/**
 * Wedding Tools — US Wedding Checklist
 * Aesthetic: British invitation + French atelier (ivory, blush, sage, gold).
 * Fonts enqueued in PHP (Cormorant Garamond + Jost).
 */

:root,
body.wd-wedding-tool {
	--wd-wc-bg: #f7f1ea;
	--wd-wc-surface: #fffcf8;
	--wd-wc-ink: #2c2420;
	--wd-wc-muted: #7a6f66;
	--wd-wc-line: #e8dfd4;
	--wd-wc-blush: #c4a4a0;
	--wd-wc-blush-deep: #9a6b66;
	--wd-wc-sage: #8a9a86;
	--wd-wc-gold: #b89b6a;
	--wd-wc-gold-soft: rgba(184, 155, 106, 0.18);
	--wd-wc-accent: #9a6b66;
	--wd-wc-accent-soft: #f3e8e4;
	--wd-wc-ok: #34c759;
	--wd-wc-ok-soft: #e8f8ec;
	--wd-wc-radius: 4px;
	--wd-wc-shadow: 0 18px 50px rgba(44, 36, 32, 0.06);
	--wd-wc-serif: "Cormorant Garamond", "Times New Roman", Times, Georgia, serif;
	--wd-wc-sans: "Jost", "Segoe UI", system-ui, -apple-system, sans-serif;
	/* Match typical Woodmart content width */
	--wd-wc-content-w: var(--wd-container-w, 1222px);
}

/* -------------------------------------------------------------------------
   Shared type & color lock — all /wedding-tools/* pages
   (Hub · Checklist · Planning Timeline share one system; block theme bleed.)
   ------------------------------------------------------------------------- */
body.wd-wedding-tool .wd-wc-page,
body.wd-wedding-tool .wd-wedding-tool-shell,
body.wd-wedding-tool .wd-wc-app,
body.wd-wedding-tool .wd-wt-hub {
	font-family: var(--wd-wc-sans);
	color: var(--wd-wc-ink);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Display / serif roles (titles, phase labels, editorial accents) */
body.wd-wedding-tool .wd-wc-title,
body.wd-wedding-tool .wd-wc-progress-label,
body.wd-wedding-tool .wd-wc-phase-label,
body.wd-wedding-tool .wd-wc-loading,
body.wd-wedding-tool .wd-wc-empty,
body.wd-wedding-tool .wd-wc-footnote,
body.wd-wedding-tool .wd-wtl-card-title,
body.wd-wedding-tool .wd-wtl-countdown-num,
body.wd-wedding-tool .wd-wtl-prompt,
body.wd-wedding-tool .wd-wt-hub-card-title,
body.wd-wedding-tool .wd-wvb-pin-text,
body.wd-wedding-tool .wd-wvb-addbar-label,
body.wd-wedding-tool .wd-wvb-prompts-label,
body.wd-wedding-tool .wd-wvb-tab-label,
body.wd-wedding-tool .wd-wcp-result-title,
body.wd-wedding-tool .wd-wcp-section-title,
body.wd-wedding-tool .wd-wcp-preset-title,
body.wd-wedding-tool .wd-wcp-saved-name,
body.wd-wedding-tool .wd-wcp-swatch-role,
body.wd-wedding-tool .wd-wcp-preview-names,
body.wd-wedding-tool .wd-wgq-section-title,
body.wd-wedding-tool .wd-wgq-card-title,
body.wd-wedding-tool .wd-wgq-play-title,
body.wd-wedding-tool .wd-wgq-result-title,
body.wd-wedding-tool .wd-wgq-prompt,
body.wd-wedding-tool .wd-wgq-history-name,
body.wd-wedding-tool .wd-wc-print-title {
	font-family: var(--wd-wc-serif);
	color: var(--wd-wc-ink);
}

/* Body / UI sans (readable copy, labels, controls) */
body.wd-wedding-tool .wd-wc-kicker,
body.wd-wedding-tool .wd-wc-breadcrumb,
body.wd-wedding-tool .wd-wc-lead,
body.wd-wedding-tool .wd-wc-field-label,
body.wd-wedding-tool .wd-wc-task-title,
body.wd-wedding-tool .wd-wc-task-cat,
body.wd-wedding-tool .wd-wc-btn,
body.wd-wedding-tool .wd-wc-input,
body.wd-wedding-tool .wd-wc-select,
body.wd-wedding-tool .wd-wtl-mark,
body.wd-wedding-tool .wd-wtl-badge,
body.wd-wedding-tool .wd-wtl-short,
body.wd-wedding-tool .wd-wtl-when,
body.wd-wedding-tool .wd-wtl-theme,
body.wd-wedding-tool .wd-wtl-summary,
body.wd-wedding-tool .wd-wtl-highlights,
body.wd-wedding-tool .wd-wtl-hint,
body.wd-wedding-tool .wd-wtl-countdown-label,
body.wd-wedding-tool .wd-wt-hub-card-desc,
body.wd-wedding-tool .wd-wvb-hint,
body.wd-wedding-tool .wd-wvb-pin-note,
body.wd-wedding-tool .wd-wvb-pin-caption,
body.wd-wedding-tool .wd-wvb-prompts-list,
body.wd-wedding-tool .wd-wc-print-kicker,
body.wd-wedding-tool .wd-wc-print-sub {
	font-family: var(--wd-wc-sans);
}

/* Text color roles */
body.wd-wedding-tool .wd-wc-title,
body.wd-wedding-tool .wd-wc-progress-label,
body.wd-wedding-tool .wd-wc-phase-label,
body.wd-wedding-tool .wd-wc-task-title,
body.wd-wedding-tool .wd-wtl-card-title,
body.wd-wedding-tool .wd-wtl-summary,
body.wd-wedding-tool .wd-wt-hub-card-title,
body.wd-wedding-tool .wd-wvb-pin-text,
body.wd-wedding-tool .wd-wvb-pin-note {
	color: var(--wd-wc-ink);
}

body.wd-wedding-tool .wd-wc-lead,
body.wd-wedding-tool .wd-wc-breadcrumb,
body.wd-wedding-tool .wd-wc-field-label,
body.wd-wedding-tool .wd-wc-progress-text,
body.wd-wedding-tool .wd-wc-phase-hint,
body.wd-wedding-tool .wd-wc-phase-count:not(.is-complete),
body.wd-wedding-tool .wd-wc-footnote,
body.wd-wedding-tool .wd-wc-loading,
body.wd-wedding-tool .wd-wc-empty,
body.wd-wedding-tool .wd-wtl-hint,
body.wd-wedding-tool .wd-wtl-when,
body.wd-wedding-tool .wd-wtl-theme,
body.wd-wedding-tool .wd-wtl-highlights,
body.wd-wedding-tool .wd-wtl-countdown-label,
body.wd-wedding-tool .wd-wtl-prompt,
body.wd-wedding-tool .wd-wt-hub-card-desc,
body.wd-wedding-tool .wd-wvb-hint,
body.wd-wedding-tool .wd-wvb-pin-caption,
body.wd-wedding-tool .wd-wvb-pin-hex,
body.wd-wedding-tool .wd-wvb-prompts-list {
	color: var(--wd-wc-muted);
}

body.wd-wedding-tool .wd-wc-kicker,
body.wd-wedding-tool .wd-wtl-badge,
body.wd-wedding-tool .wd-wtl-countdown-num,
body.wd-wedding-tool .wd-wc-breadcrumb a,
body.wd-wedding-tool .wd-wtl-hint a,
body.wd-wedding-tool .wd-wt-hub-card-icon {
	color: var(--wd-wc-blush-deep);
}

body.wd-wedding-tool .wd-wc-saved,
body.wd-wedding-tool .wd-wc-phase-count.is-complete {
	color: var(--wd-wc-sage);
}

body.wd-wedding-tool .wd-wtl-short,
body.wd-wedding-tool .wd-wc-hero-ornament::before,
body.wd-wedding-tool .wd-wc-hero-ornament::after,
body.wd-wedding-tool .wd-wc-task-cat {
	color: var(--wd-wc-gold);
}

body.wd-wedding-tool .wd-wc-breadcrumb a:hover {
	color: var(--wd-wc-ink);
}

/* -------------------------------------------------------------------------
   Shell — site content width, not edge-to-edge 100%
   ------------------------------------------------------------------------- */

/*
 * Woodmart layout wrappers on Wedding Tool routes only:
 * - #main-content .wd-content-layout.content-layout-wrapper.container → padding-inline 5px
 * - .wd-content-layout → padding-block 10px, left/right 0
 */
body.wd-wedding-tool #main-content .wd-content-layout.content-layout-wrapper.container,
body.wd-wedding-tool #main-content.wd-content-layout.content-layout-wrapper.container,
body.wd-wedding-tool .wd-content-layout.content-layout-wrapper.container {
	padding-inline: 5px !important;
	padding-left: 5px !important;
	padding-right: 5px !important;
}

body.wd-wedding-tool .wd-content-layout,
body.wd-wedding-tool #main-content.wd-content-layout,
body.wd-wedding-tool #main-content .wd-content-layout {
	padding-block: 10px !important;
	padding-top: 10px !important;
	padding-bottom: 10px !important;
	padding-inline: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* Container that is also content-layout: keep 5px sides, 10px top/bottom */
body.wd-wedding-tool #main-content .wd-content-layout.content-layout-wrapper.container,
body.wd-wedding-tool .wd-content-layout.content-layout-wrapper.container {
	padding-top: 10px !important;
	padding-bottom: 10px !important;
	padding-left: 5px !important;
	padding-right: 5px !important;
	padding-block: 10px !important;
	padding-inline: 5px !important;
}

.wd-wedding-tool-shell,
.wd-wc-page {
	background: transparent;
	padding: 0;
	margin: 0;
	width: 100%;
	max-width: none;
	float: none;
	flex: 1 1 auto !important;
	--wd-col: 1 !important;
	--wd-col-lg: 1 !important;
}

/* Use theme .container when present; otherwise cap like site content */
.wd-wc-page-inner {
	width: 100%;
	box-sizing: border-box;
}

.wd-wc-page-inner:not(.container) {
	max-width: var(--wd-wc-content-w);
	margin-left: auto;
	margin-right: auto;
	padding-left: 0;
	padding-right: 0;
}

.wd-wc-app {
	font-family: var(--wd-wc-sans);
	color: var(--wd-wc-ink);
	line-height: 1.55;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	overflow-x: hidden;
	position: relative;
	/* Default (mobile-first): open layout, no nested frames */
	background: transparent;
	border: 0;
	box-shadow: none;
	padding: 0;
}

.wd-wc-app::before {
	content: none;
	display: none;
}

.wd-wc-app > * {
	position: relative;
	z-index: 1;
}

/* Desktop: keep invitation card look + content width; no extra padding */
@media (min-width: 768px) {
	.wd-wc-app {
		background:
			linear-gradient(180deg, rgba(255, 252, 248, 0.97) 0%, #f7f1ea 100%);
		border: 1px solid var(--wd-wc-line);
		box-shadow: var(--wd-wc-shadow);
		padding: 0;
	}

	/* Soft double-line frame only on desktop */
	.wd-wc-app::before {
		content: "";
		display: block;
		position: absolute;
		inset: 12px;
		border: 1px solid rgba(184, 155, 106, 0.35);
		pointer-events: none;
		z-index: 0;
	}

	/* Inner breathing room via children margins, not outer shell padding */
	.wd-wc-app > .wd-wc-breadcrumb {
		margin: 20px 24px 16px;
	}

	.wd-wc-app > .wd-wc-hero {
		margin-left: 24px;
		margin-right: 24px;
	}

	.wd-wc-app > .wd-wc-toolbar,
	.wd-wc-app > .wd-wtl-datebar {
		margin-left: 24px;
		margin-right: 24px;
	}

	.wd-wc-app > .wd-wc-list,
	.wd-wc-app > .wd-wtl-track,
	.wd-wc-app > .wd-wt-hub-grid,
	.wd-wc-app > .wd-wvb-guide,
	.wd-wc-app > .wd-wvb-toolbar,
	.wd-wc-app > .wd-wvb-prompts,
	.wd-wc-app > .wd-wvb-board,
	.wd-wc-app > .wd-wcp-controls,
	.wd-wc-app > .wd-wcp-result,
	.wd-wc-app > .wd-wcp-presets,
	.wd-wc-app > .wd-wcp-saved-wrap,
	.wd-wc-app > .wd-wgq-host,
	.wd-wc-app > .wd-wgq-picker,
	.wd-wc-app > .wd-wgq-customize,
	.wd-wc-app > .wd-wgq-play,
	.wd-wc-app > .wd-wgq-result,
	.wd-wc-app > .wd-wgq-history {
		margin-left: 24px;
		margin-right: 24px;
	}

	.wd-wc-app > .wd-wc-footnote {
		margin-left: 24px;
		margin-right: 24px;
		padding-bottom: 20px;
	}

	.wd-wc-app > .wd-wt-hub-grid {
		padding-bottom: 24px;
	}
}

/* Phone: airy, less chrome — no double border, no card padding stack */
@media (max-width: 767.98px) {
	.wd-wc-page-inner:not(.container) {
		padding-left: 0;
		padding-right: 0;
	}

	/* Mobile: match requested 5px side gutters on tool containers */
	.wd-wedding-tool-shell .container.wd-wc-page-inner,
	body.wd-wedding-tool .container.wd-wc-page-inner {
		padding-left: 5px !important;
		padding-right: 5px !important;
		padding-inline: 5px !important;
	}

	.wd-wc-app {
		background: transparent;
		border: 0 !important;
		box-shadow: none !important;
		padding: 0 !important;
	}

	.wd-wc-app::before {
		content: none !important;
		display: none !important;
	}

	/* +2 size steps for readable mobile type */
	.wd-wc-app {
		font-size: 1.0625rem; /* ~17px base */
		line-height: 1.55;
	}

	.wd-wc-breadcrumb {
		margin-bottom: 12px;
		font-size: 0.9rem;
	}

	.wd-wc-hero {
		margin-bottom: 16px;
		padding-bottom: 14px;
		text-align: left;
	}

	.wd-wc-hero-ornament {
		margin-left: 0;
		margin-right: auto;
	}

	.wd-wc-kicker {
		font-size: 0.9rem;
	}

	.wd-wc-title {
		font-size: 2.1rem;
	}

	.wd-wc-lead {
		font-size: 1.1rem;
		margin-left: 0;
	}

	.wd-wc-toolbar {
		padding: 12px !important;
		margin-bottom: 14px;
		border-radius: 2px;
		box-shadow: none;
	}

	.wd-wc-progress-label {
		font-size: 1.25rem;
	}

	.wd-wc-progress-text,
	.wd-wc-saved {
		font-size: 1rem;
	}

	.wd-wc-field-label {
		font-size: 0.85rem;
	}

	.wd-wc-toolbar .wd-wc-input,
	.wd-wc-toolbar .wd-wc-select,
	.wd-wc-app input[type="search"].wd-wc-input,
	.wd-wc-app select.wd-wc-select {
		height: 44px !important;
		min-height: 44px !important;
		max-height: 44px !important;
		font-size: 1.05rem !important;
		padding: 8px 12px !important;
	}

	.wd-wc-btn {
		font-size: 0.9rem;
		padding: 11px 16px;
	}

	.wd-wc-list {
		gap: 10px;
	}

	.wd-wc-phase {
		border-radius: 2px;
		box-shadow: none;
	}

	.wd-wc-phase-head {
		padding: 12px 12px;
	}

	.wd-wc-phase-label {
		font-size: 1.4rem;
	}

	.wd-wc-phase-hint {
		font-size: 0.9rem;
	}

	.wd-wc-phase-count {
		font-size: 0.9rem;
		padding: 6px 12px;
	}

	.wd-wc-phase-body {
		padding: 4px 6px 8px;
	}

	.wd-wc-task {
		padding: 10px 4px 10px 0;
		gap: 2px;
	}

	.wd-wc-task-cat {
		font-size: 0.85rem;
	}

	.wd-wc-task-title {
		font-size: 1.15rem;
		line-height: 1.45;
	}

	.wd-wc-check {
		width: 40px;
		height: 40px;
	}

	.wd-wc-check::before {
		width: 28px;
		height: 28px;
	}

	.wd-wc-loading,
	.wd-wc-empty {
		font-size: 1.35rem;
	}

	.wd-wc-footnote {
		margin-top: 16px;
		padding-top: 12px;
		text-align: left;
		font-size: 1rem;
	}

	/* Hub uses .wd-wc-app shell — match checklist mobile type */
	.wd-wt-hub.wd-wc-app {
		font-size: 1.0625rem;
	}

	.wd-wt-hub-card-title {
		font-size: 1.45rem;
	}

	.wd-wt-hub-card-desc {
		font-size: 1.05rem;
	}
}

/* -------------------------------------------------------------------------
   Breadcrumb / hero — editorial wedding
   ------------------------------------------------------------------------- */
.wd-wc-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	font-size: 0.78rem;
	font-weight: 400;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--wd-wc-muted);
	margin-bottom: 22px;
}

.wd-wc-breadcrumb a {
	color: var(--wd-wc-blush-deep);
	text-decoration: none;
	font-weight: 500;
}

.wd-wc-breadcrumb a:hover {
	color: var(--wd-wc-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.wd-wc-breadcrumb-sep {
	opacity: 0.45;
	font-weight: 300;
}

.wd-wc-hero {
	text-align: center;
	margin-bottom: 28px;
	padding-bottom: 22px;
	border-bottom: 1px solid var(--wd-wc-line);
}

.wd-wc-hero-ornament {
	display: block;
	width: 64px;
	height: 1px;
	margin: 0 auto 16px;
	background: linear-gradient(90deg, transparent, var(--wd-wc-gold), transparent);
	position: relative;
}

.wd-wc-hero-ornament::before,
.wd-wc-hero-ornament::after {
	content: "❧";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 0.85rem;
	color: var(--wd-wc-gold);
	background: var(--wd-wc-bg);
	padding: 0 8px;
	line-height: 1;
}

.wd-wc-kicker {
	margin: 0 0 10px;
	font-family: var(--wd-wc-sans);
	font-size: 0.72rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--wd-wc-blush-deep);
}

.wd-wc-title {
	margin: 0 0 12px;
	font-family: var(--wd-wc-serif);
	font-size: clamp(2rem, 5vw, 2.85rem);
	font-weight: 600;
	font-style: italic;
	letter-spacing: 0.01em;
	line-height: 1.15;
	color: var(--wd-wc-ink);
}

.wd-wc-lead {
	margin: 0 auto;
	max-width: 45rem;
	font-size: 0.95rem;
	font-weight: 300;
	color: var(--wd-wc-muted);
	line-height: 1.65;
}

/* -------------------------------------------------------------------------
   Toolbar
   ------------------------------------------------------------------------- */
.wd-wc-toolbar {
	background: rgba(255, 252, 248, 0.9);
	border: 1px solid var(--wd-wc-line);
	border-radius: var(--wd-wc-radius);
	box-shadow: none;
	padding: 16px 16px 14px;
	margin-bottom: 22px;
	display: flex;
	flex-direction: column;
	gap: 12px;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	overflow: hidden;
}

.wd-wc-progress-block {
	width: 100%;
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
}

.wd-wc-progress-meta {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 12px;
	margin-bottom: 8px;
	min-width: 0;
}

.wd-wc-progress-meta > * {
	min-width: 0;
}

.wd-wc-progress-label {
	font-family: var(--wd-wc-serif);
	font-weight: 600;
	font-size: 1.05rem;
	font-style: italic;
}

.wd-wc-progress-text {
	font-size: 0.8rem;
	letter-spacing: 0.02em;
	color: var(--wd-wc-muted);
}

.wd-wc-progress-bar {
	height: 6px;
	background: var(--wd-wc-line);
	border-radius: 999px;
	overflow: hidden;
}

.wd-wc-progress-fill {
	display: block;
	height: 100%;
	width: 0;
	background: linear-gradient(90deg, var(--wd-wc-sage), var(--wd-wc-gold));
	border-radius: inherit;
	transition: width 0.35s ease;
}

.wd-wc-saved {
	margin: 8px 0 0;
	font-size: 0.78rem;
	color: var(--wd-wc-sage);
	letter-spacing: 0.04em;
}

.wd-wc-filters {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 10px;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

.wd-wc-field--grow {
	grid-column: 1 / -1;
	min-width: 0;
	max-width: 100%;
}

.wd-wc-field {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
	max-width: 100%;
}

.wd-wc-field-label {
	font-size: 0.68rem;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--wd-wc-muted);
}

.wd-wc-select,
.wd-wc-input {
	display: block;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
	border: 1px solid var(--wd-wc-line);
	border-radius: 2px;
	padding: 8px 10px;
	margin: 0;
	font: inherit;
	font-size: 0.875rem;
	line-height: 1.3;
	background: #fff;
	color: var(--wd-wc-ink);
	-webkit-appearance: none;
	appearance: none;
}

.wd-wc-toolbar .wd-wc-input,
.wd-wc-toolbar .wd-wc-select,
.wd-wc-app input[type="search"].wd-wc-input,
.wd-wc-app select.wd-wc-select {
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	height: 36px !important;
	min-height: 36px !important;
	max-height: 36px !important;
	padding: 6px 10px !important;
	font-size: 0.875rem !important;
	line-height: 1.25 !important;
	box-sizing: border-box !important;
	border-radius: 2px !important;
}

.wd-wc-select:focus,
.wd-wc-input:focus {
	outline: none;
	border-color: var(--wd-wc-gold);
	box-shadow: 0 0 0 2px var(--wd-wc-gold-soft);
}

.wd-wc-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.wd-wc-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	border: 1px solid var(--wd-wc-ink);
	border-radius: 0;
	padding: 9px 18px;
	font-family: var(--wd-wc-sans);
	font-size: 0.72rem;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	cursor: pointer;
	touch-action: manipulation;
	-webkit-tap-highlight-color: transparent;
	background: var(--wd-wc-ink);
	color: var(--wd-wc-surface);
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.wd-wc-btn:hover {
	background: var(--wd-wc-blush-deep);
	border-color: var(--wd-wc-blush-deep);
}

.wd-wc-btn:active {
	transform: scale(0.98);
}

.wd-wc-btn--ghost {
	background: transparent;
	color: var(--wd-wc-ink);
	border-color: var(--wd-wc-line);
}

.wd-wc-btn--ghost:hover {
	border-color: var(--wd-wc-gold);
	background: var(--wd-wc-gold-soft);
	color: var(--wd-wc-ink);
}

.wd-wc-btn--danger {
	background: transparent;
	color: var(--wd-wc-blush-deep);
	border-color: rgba(154, 107, 102, 0.35);
}

.wd-wc-btn--danger:hover {
	background: var(--wd-wc-accent-soft);
	border-color: var(--wd-wc-blush-deep);
}

/* -------------------------------------------------------------------------
   Phases & tasks
   ------------------------------------------------------------------------- */
.wd-wc-list {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.wd-wc-loading,
.wd-wc-empty {
	text-align: center;
	color: var(--wd-wc-muted);
	padding: 40px 16px;
	font-family: var(--wd-wc-serif);
	font-style: italic;
	font-size: 1.15rem;
}

.wd-wc-phase {
	background: var(--wd-wc-surface);
	border: 1px solid var(--wd-wc-line);
	border-radius: var(--wd-wc-radius);
	box-shadow: none;
	overflow: hidden;
}

.wd-wc-phase-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 16px;
	background: linear-gradient(180deg, #fffcf8 0%, #faf4ee 100%);
	border: 0;
	border-bottom: 1px solid var(--wd-wc-line);
	cursor: pointer;
	user-select: none;
	touch-action: manipulation;
	width: 100%;
	text-align: left;
	font: inherit;
	color: inherit;
}

.wd-wc-phase-head:hover {
	background: #faf0ea;
}

.wd-wc-phase-titles {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.wd-wc-phase-label {
	font-family: var(--wd-wc-serif);
	font-weight: 600;
	font-size: 1.2rem;
	font-style: italic;
	letter-spacing: 0.01em;
}

.wd-wc-phase-hint {
	font-size: 0.72rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wd-wc-muted);
	font-weight: 400;
}

.wd-wc-phase-count {
	flex-shrink: 0;
	font-size: 0.72rem;
	font-weight: 500;
	letter-spacing: 0.06em;
	padding: 5px 11px;
	border-radius: 0;
	border: 1px solid var(--wd-wc-line);
	background: transparent;
	color: var(--wd-wc-muted);
}

.wd-wc-phase-count.is-complete {
	border-color: rgba(138, 154, 134, 0.45);
	color: var(--wd-wc-sage);
	background: rgba(138, 154, 134, 0.08);
}

.wd-wc-phase-body {
	padding: 6px 8px 10px;
}

.wd-wc-phase.is-collapsed .wd-wc-phase-body {
	display: none;
}

.wd-wc-task {
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 8px 6px 8px 0;
	border-radius: 0;
	border-bottom: 1px solid rgba(232, 223, 212, 0.65);
	transition: background 0.2s ease;
}

.wd-wc-task:last-child {
	border-bottom: 0;
}

.wd-wc-task:hover {
	background: rgba(247, 241, 234, 0.55);
}

.wd-wc-task.is-done .wd-wc-task-title {
	color: var(--wd-wc-muted);
}

/* -------------------------------------------------------------------------
   iOS circular check — circular hit/hover (not square)
   ------------------------------------------------------------------------- */
.wd-wc-check {
	--ios-check: #34c759;
	--ios-check-border: #c7c7cc;
	flex-shrink: 0;
	position: relative;
	/* Visual + hit target are both circular */
	width: 40px;
	height: 40px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50% !important;
	background: transparent;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	touch-action: manipulation;
	-webkit-tap-highlight-color: transparent;
	appearance: none;
	-webkit-appearance: none;
	user-select: none;
	-webkit-user-select: none;
	box-shadow: none !important;
	outline: none;
	line-height: 0;
	font: inherit;
	color: #fff;
	overflow: visible;
}

/* Soft circular hover wash (never square) */
.wd-wc-check::after {
	content: "";
	position: absolute;
	inset: 4px;
	border-radius: 50%;
	background: transparent;
	transition: background 0.2s ease, transform 0.2s ease;
	z-index: 0;
	pointer-events: none;
}

@media (hover: hover) and (pointer: fine) {
	.wd-wc-check:hover::after {
		background: rgba(52, 199, 89, 0.12);
		transform: scale(1.05);
	}

	.wd-wc-check:hover::before {
		border-color: #a8a8ad;
		transform: scale(1.04);
	}
}

.wd-wc-check::before {
	content: "";
	position: absolute;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	box-sizing: border-box;
	border: 1.5px solid var(--ios-check-border);
	background: #fff;
	z-index: 1;
	transition:
		background 0.22s cubic-bezier(0.2, 0.9, 0.3, 1.2),
		border-color 0.22s ease,
		transform 0.22s cubic-bezier(0.2, 0.9, 0.3, 1.2),
		box-shadow 0.22s ease;
}

.wd-wc-check:active::before {
	transform: scale(0.9);
}

.wd-wc-check:focus-visible {
	outline: none;
}

.wd-wc-check:focus-visible::before {
	box-shadow: 0 0 0 3px rgba(52, 199, 89, 0.35);
}

.wd-wc-task.is-done .wd-wc-check::before,
.wd-wc-check[aria-pressed="true"]::before {
	background: var(--ios-check);
	border-color: var(--ios-check);
	box-shadow:
		0 1px 2px rgba(52, 199, 89, 0.35),
		inset 0 1px 0 rgba(255, 255, 255, 0.25);
	animation: wd-wc-ios-pop 0.38s cubic-bezier(0.2, 0.9, 0.25, 1.35);
}

@keyframes wd-wc-ios-pop {
	0% {
		transform: scale(0.72);
	}
	55% {
		transform: scale(1.08);
	}
	100% {
		transform: scale(1);
	}
}

.wd-wc-check svg {
	position: relative;
	z-index: 2;
	width: 14px;
	height: 14px;
	opacity: 0;
	transform: scale(0.4);
	transition:
		opacity 0.15s ease,
		transform 0.28s cubic-bezier(0.2, 0.9, 0.3, 1.25);
	pointer-events: none;
	overflow: visible;
}

.wd-wc-check svg path {
	fill: none;
	stroke: #fff;
	stroke-width: 2.75;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-dasharray: 24;
	stroke-dashoffset: 24;
	transition: stroke-dashoffset 0.28s cubic-bezier(0.4, 0, 0.2, 1) 0.05s;
}

.wd-wc-task.is-done .wd-wc-check svg,
.wd-wc-check[aria-pressed="true"] svg {
	opacity: 1;
	transform: scale(1);
}

.wd-wc-task.is-done .wd-wc-check svg path,
.wd-wc-check[aria-pressed="true"] svg path {
	stroke-dashoffset: 0;
}

@media (prefers-reduced-motion: reduce) {
	.wd-wc-check::before,
	.wd-wc-check::after,
	.wd-wc-check svg,
	.wd-wc-check svg path {
		transition: none;
		animation: none;
	}
}

.wd-wc-task-body {
	min-width: 0;
	flex: 1;
	padding-right: 6px;
}

.wd-wc-task-cat {
	display: inline-block;
	font-size: 0.65rem;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--wd-wc-gold);
	margin-bottom: 3px;
}

.wd-wc-task-title {
	margin: 0;
	font-size: 0.95rem;
	font-weight: 400;
	line-height: 1.45;
	color: var(--wd-wc-ink);
}

.wd-wc-footnote {
	margin-top: 28px;
	padding-top: 18px;
	border-top: 1px solid var(--wd-wc-line);
	font-size: 0.8rem;
	font-weight: 300;
	color: var(--wd-wc-muted);
	text-align: center;
	font-family: var(--wd-wc-serif);
	font-style: italic;
}

.wd-wc-footnote p {
	margin: 0;
}

/* Print-only invitation header (hidden on screen) */
.wd-wc-print-only {
	display: none;
}

/* -------------------------------------------------------------------------
   Hub — same shell/type as checklist & timeline (.wd-wc-app + .wd-wc-hero)
   ------------------------------------------------------------------------- */
.wd-wt-hub-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
	margin-bottom: 8px;
}

@media (min-width: 640px) {
	.wd-wt-hub-grid {
		grid-template-columns: 1fr 1fr;
	}
}

.wd-wt-hub-card {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 22px;
	background: var(--wd-wc-surface);
	border: 1px solid var(--wd-wc-line);
	border-radius: var(--wd-wc-radius);
	text-decoration: none;
	color: var(--wd-wc-ink);
	font-family: var(--wd-wc-sans);
	transition: border-color 0.2s ease, background 0.2s ease;
}

.wd-wt-hub-card:hover {
	border-color: var(--wd-wc-gold);
	background: linear-gradient(180deg, #fffaf7 0%, var(--wd-wc-surface) 100%);
	color: var(--wd-wc-ink);
}

.wd-wt-hub-card-icon {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--wd-wc-accent-soft);
	color: var(--wd-wc-blush-deep);
	font-family: var(--wd-wc-sans);
	font-weight: 600;
	border: 1px solid rgba(154, 107, 102, 0.2);
}

.wd-wt-hub-card-title {
	font-family: var(--wd-wc-serif);
	font-weight: 600;
	font-size: 1.25rem;
	font-style: italic;
	color: var(--wd-wc-ink);
	letter-spacing: 0.01em;
	line-height: 1.25;
}

.wd-wt-hub-card-desc {
	font-family: var(--wd-wc-sans);
	font-size: 0.88rem;
	color: var(--wd-wc-muted);
	font-weight: 300;
	line-height: 1.55;
}

/* -------------------------------------------------------------------------
   Print — invitation card, hide website chrome
   ------------------------------------------------------------------------- */
@media print {
	@page {
		margin: 14mm 16mm;
		size: auto;
	}

	html,
	body {
		background: #fff !important;
		color: #2c2420 !important;
	}

	/* Hide theme chrome */
	body.wd-wedding-tool .whb-header,
	body.wd-wedding-tool .whb-main-header,
	body.wd-wedding-tool header,
	body.wd-wedding-tool footer,
	body.wd-wedding-tool .footer-container,
	body.wd-wedding-tool .wd-footer,
	body.wd-wedding-tool .wd-sticky-nav,
	body.wd-wedding-tool .wd-sidebar,
	body.wd-wedding-tool .sidebar-container,
	body.wd-wedding-tool .wd-page-nav,
	body.wd-wedding-tool .wd-nav-arrows,
	body.wd-wedding-tool .wd-scroll-top,
	body.wd-wedding-tool .cookie-notice,
	body.wd-wedding-tool #wpadminbar,
	.wd-wc-breadcrumb,
	.wd-wc-toolbar,
	.wd-wc-actions,
	.wd-wc-filters,
	.wd-wc-saved,
	.wd-wc-loading {
		display: none !important;
		visibility: hidden !important;
		height: 0 !important;
		overflow: hidden !important;
	}

	.wd-wedding-tool-shell,
	.wd-wc-page,
	.wd-wc-page-inner,
	.main-page-wrapper,
	.website-wrapper,
	#main-content,
	.content-layout-wrapper,
	.main-page-wrapper > .container,
	.site-content {
		width: 100% !important;
		max-width: none !important;
		margin: 0 !important;
		padding: 0 !important;
		float: none !important;
		background: #fff !important;
		box-shadow: none !important;
		border: 0 !important;
	}

	.wd-wc-app {
		background: #fff !important;
		border: 2px solid #2c2420 !important;
		box-shadow: none !important;
		padding: 18mm 16mm !important;
		max-width: none !important;
		overflow: visible !important;
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
	}

	.wd-wc-app::before {
		inset: 6mm !important;
		border-color: #b89b6a !important;
	}

	.wd-wc-print-only {
		display: block !important;
		text-align: center;
		margin-bottom: 10mm;
		padding-bottom: 6mm;
		border-bottom: 1px solid #e8dfd4;
	}

	.wd-wc-print-only .wd-wc-print-kicker {
		margin: 0 0 4mm;
		font-family: var(--wd-wc-sans), sans-serif;
		font-size: 9pt;
		letter-spacing: 0.28em;
		text-transform: uppercase;
		color: #9a6b66;
	}

	.wd-wc-print-only .wd-wc-print-title {
		margin: 0 0 3mm;
		font-family: var(--wd-wc-serif), Georgia, serif;
		font-size: 22pt;
		font-style: italic;
		font-weight: 600;
		color: #2c2420;
	}

	.wd-wc-print-only .wd-wc-print-sub {
		margin: 0;
		font-family: var(--wd-wc-serif), Georgia, serif;
		font-size: 10pt;
		font-style: italic;
		color: #7a6f66;
	}

	.wd-wc-print-only .wd-wc-print-ornament {
		display: block;
		margin: 4mm auto 0;
		font-size: 12pt;
		color: #b89b6a;
		letter-spacing: 0.4em;
	}

	/* Screen hero still ok, or hide if print-only header present */
	.wd-wc-hero {
		display: none !important;
	}

	.wd-wc-list {
		gap: 5mm !important;
	}

	.wd-wc-phase {
		border: 0 !important;
		border-bottom: 1px solid #e8dfd4 !important;
		break-inside: avoid;
		page-break-inside: avoid;
		box-shadow: none !important;
		background: transparent !important;
		margin: 0 0 3mm !important;
	}

	.wd-wc-phase-head {
		background: transparent !important;
		border: 0 !important;
		padding: 0 0 2mm !important;
		cursor: default !important;
	}

	.wd-wc-phase-head::after {
		display: none !important;
	}

	.wd-wc-phase-label {
		font-size: 13pt !important;
		color: #2c2420 !important;
	}

	.wd-wc-phase-hint {
		font-size: 8pt !important;
	}

	.wd-wc-phase-count {
		border: 0 !important;
		font-size: 9pt !important;
		padding: 0 !important;
	}

	.wd-wc-phase.is-collapsed .wd-wc-phase-body {
		display: block !important;
	}

	.wd-wc-phase-body {
		padding: 0 0 3mm !important;
	}

	.wd-wc-task {
		border: 0 !important;
		padding: 1.2mm 0 !important;
		background: transparent !important;
		align-items: flex-start !important;
		gap: 3mm !important;
		page-break-inside: avoid;
	}

	.wd-wc-check {
		width: 12pt !important;
		height: 12pt !important;
		min-width: 12pt !important;
	}

	.wd-wc-check::before {
		width: 10pt !important;
		height: 10pt !important;
		border: 1pt solid #2c2420 !important;
		background: #fff !important;
		box-shadow: none !important;
		animation: none !important;
	}

	.wd-wc-task.is-done .wd-wc-check::before {
		background: #2c2420 !important;
		border-color: #2c2420 !important;
	}

	.wd-wc-check::after {
		display: none !important;
	}

	.wd-wc-check svg {
		width: 7pt !important;
		height: 7pt !important;
	}

	.wd-wc-task.is-done .wd-wc-check svg path {
		stroke: #fff !important;
		stroke-dashoffset: 0 !important;
	}

	.wd-wc-task-cat {
		font-size: 7.5pt !important;
		color: #b89b6a !important;
	}

	.wd-wc-task-title {
		font-size: 10pt !important;
		line-height: 1.35 !important;
	}

	.wd-wc-footnote {
		margin-top: 8mm !important;
		padding-top: 4mm !important;
		font-size: 8.5pt !important;
		border-top: 1px solid #e8dfd4 !important;
	}
}
