/*
 * LAV Theme Components — registry-rsvp-guestbook.css
 * Registry, RSVP, guestbook, 404, hero readability, and guest-facing page refinements.
 *
 * Loaded in order from functions.php. The last component handle receives
 * generated wedding-design CSS from LAV Core.
 */

/* ============================================================
   v36.2 generated-page typography and consistency pass
   ============================================================ */
.lav-page-main--lav-shortcode .lav-section-title::before,
.lav-page-main--lav-shortcode .lav-section-title::after,
.lav-page-main--lav-shortcode .lav-page-title::before,
.lav-page-main--lav-shortcode .lav-page-title::after,
.lav-page-main--lav-shortcode .lav-registry-page__title::before,
.lav-page-main--lav-shortcode .lav-registry-page__title::after {
	content: none;
	display: none;
}

.lav-registry-page,
.lav-rsvp-page,
.lav-guestbook-page,
.lav-page-main--lav-shortcode .lav-section--plain {
	background: var(--lav-bg, var(--lav-cream));
}

.lav-page-crosslinks {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: .85rem;
	margin-top: clamp(2rem, 4vw, 3rem);
}

.lav-page-crosslinks .lav-btn {
	min-width: 150px;
}

.lav-registry__back {
	display: none;
}


/* One heading system for all generated guest pages. The script line is the decorative title; the h1 below it is the readable page heading. */
.lav-page-main--lav-shortcode .lav-page-heading,
.lav-page-main--lav-shortcode .lav-section--plain > .lav-container > .lav-text-center > h1,
.lav-page-main--lav-shortcode .lav-rsvp-page .lav-text-center > h1,
.lav-page-main--lav-shortcode .lav-registry-page__title,
.lav-page-main--lav-shortcode .lav-guestbook__inner > h1,
.lav-page-main--lav-shortcode .lav-guestbook__inner > h2 {
	font-family: var(--lav-font-display, Georgia, serif);
	font-size: clamp(2rem, 4vw, 3.5rem);
	font-style: normal;
	font-weight: 400;
	line-height: 1.12;
	letter-spacing: 0;
	text-transform: none;
	color: var(--lav-charcoal);
	margin: 0 0 1rem;
}

.lav-page-main--lav-shortcode .lav-script-line {
	font-family: var(--lav-font-script, cursive);
	font-size: clamp(3.25rem, 7vw, 6rem);
	font-style: normal;
	font-weight: 400;
	letter-spacing: 0;
	line-height: .95;
	margin-bottom: clamp(1rem, 2vw, 1.5rem);
	text-transform: none;
}

.lav-registry-page .lav-divider,
.lav-rsvp-page .lav-divider,
.lav-guestbook-page .lav-divider,
.lav-page-main--lav-shortcode .lav-section--plain .lav-divider {
	margin-top: clamp(1rem, 2vw, 1.35rem);
	margin-bottom: clamp(1.5rem, 3vw, 2rem);
}

.lav-registry-card-grid {
	margin-top: clamp(2rem, 4vw, 2.75rem);
}


/* RSVP generated page uses the same title/divider/intro rhythm as the other generated pages; only the form card remains functionally wider. */
.lav-rsvp-page .lav-section-intro {
	max-width: 680px;
	margin-left: auto;
	margin-right: auto;
}

.lav-rsvp-page__hint {
	max-width: 680px;
	margin: 0 auto clamp(1.5rem, 3vw, 2rem);
}

.lav-rsvp-page .lav-page-crosslinks {
	margin-top: clamp(1.75rem, 4vw, 2.5rem);
}

@media (max-width: 640px) {
	.lav-page-crosslinks {
		display: grid;
		grid-template-columns: 1fr;
	}

	.lav-page-crosslinks .lav-btn {
		width: 100%;
	}
}

/* ============================================================
   v36.4 front-end guest journey consistency pass
   ------------------------------------------------------------
   Keeps generated guest pages in one visual system: same top
   spacing, same title rhythm, same intro width, same bottom
   navigation, same card/grid rhythm.
   ============================================================ */
.lav-page-main--lav-shortcode {
	background: var(--lav-bg, var(--lav-cream));
}

.lav-page-main--lav-shortcode .lav-page-content {
	padding-top: 0;
	padding-bottom: 0;
}

.lav-page-main--lav-shortcode .lav-section--plain,
.lav-page-main--lav-shortcode .lav-registry-page,
.lav-page-main--lav-shortcode .lav-rsvp-page,
.lav-page-main--lav-shortcode .lav-guestbook-page {
	padding-top: var(--lav-generated-page-offset);
	padding-bottom: clamp(4rem, 8vw, 6.5rem);
}

.lav-page-main--lav-shortcode .lav-details-page-group > .lav-section:first-child {
	padding-top: var(--lav-generated-page-offset);
}

.lav-page-main--lav-shortcode .lav-section--plain + .lav-section--plain,
.lav-page-main--lav-shortcode .lav-details-page-group .lav-section--plain + .lav-section--plain {
	padding-top: clamp(3rem, 6vw, 5rem);
}

.lav-page-main--lav-shortcode .lav-text-center,
.lav-page-main--lav-shortcode .lav-registry-page__inner,
.lav-page-main--lav-shortcode .lav-guestbook__inner,
.lav-page-main--lav-shortcode .lav-rsvp-page__inner > .lav-text-center {
	text-align: center;
}

.lav-page-main--lav-shortcode .lav-script-line {
	display: block;
	max-width: min(100%, 920px);
	margin-left: auto;
	margin-right: auto;
	color: var(--lav-primary, var(--lav-gold));
	text-align: center;
	text-wrap: balance;
}

.lav-page-main--lav-shortcode .lav-page-heading,
.lav-page-main--lav-shortcode .lav-schedule-page > .lav-container > h2,
.lav-page-main--lav-shortcode .lav-parking-page > .lav-container > h2,
.lav-page-main--lav-shortcode .lav-generic-page > .lav-container > h2,
.lav-page-main--lav-shortcode .lav-faq-page > .lav-container > .lav-text-center > h1,
.lav-page-main--lav-shortcode .lav-gallery-page > .lav-container > .lav-text-center > h1,
.lav-page-main--lav-shortcode .lav-family-page > .lav-container > .lav-text-center > h1 {
	font-family: var(--lav-font-display, Georgia, serif);
	font-size: clamp(2rem, 4vw, 3.5rem);
	font-style: normal;
	font-weight: 400;
	line-height: 1.12;
	letter-spacing: 0;
	text-transform: none;
	color: var(--lav-charcoal);
	text-align: center;
	text-wrap: balance;
	margin: 0 0 1rem;
}

.lav-page-main--lav-shortcode .lav-section-intro,
.lav-page-main--lav-shortcode .lav-registry__intro,
.lav-page-main--lav-shortcode .lav-guestbook__intro,
.lav-page-main--lav-shortcode .lav-rsvp-page__hint {
	max-width: 680px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	color: var(--lav-muted, var(--lav-gray));
}

.lav-page-main--lav-shortcode .lav-section-intro p,
.lav-page-main--lav-shortcode .lav-registry__intro p,
.lav-page-main--lav-shortcode .lav-guestbook__intro p {
	margin-left: auto;
	margin-right: auto;
}

.lav-page-main--lav-shortcode .lav-divider {
	margin-left: auto;
	margin-right: auto;
}

.lav-page-main--lav-shortcode .lav-registry-card-grid,
.lav-page-main--lav-shortcode .lav-family__grid,
.lav-page-main--lav-shortcode .lav-gallery__grid,
.lav-page-main--lav-shortcode .lav-faq__list,
.lav-page-main--lav-shortcode .lav-public-schedule,
.lav-page-main--lav-shortcode .lav-detail-feature-grid,
.lav-page-main--lav-shortcode .lav-info-card,
.lav-page-main--lav-shortcode .lav-guestbook-form,
.lav-page-main--lav-shortcode .lav-rsvp-form {
	margin-top: clamp(2rem, 4vw, 2.75rem);
}

.lav-page-main--lav-shortcode .lav-page-crosslinks {
	clear: both;
	width: 100%;
	max-width: 760px;
	margin: clamp(2.25rem, 4vw, 3.25rem) auto 0;
	padding: 0;
}

.lav-page-main--lav-shortcode .lav-page-crosslinks .lav-btn {
	min-width: 156px;
}

.lav-page-main--lav-shortcode .lav-details-page-group > .lav-page-crosslinks {
	padding-bottom: clamp(4rem, 8vw, 6.5rem);
}

.lav-page-main--registry .lav-registry-page,
.lav-page-main--lav-shortcode .lav-gallery-page,
.lav-page-main--lav-shortcode .lav-family-page,
.lav-page-main--lav-shortcode .lav-faq-page {
	min-height: 72svh;
}

.lav-page-main--lav-shortcode .lav-registry__back,
.lav-page-main--lav-shortcode .lav-back-link,
.lav-page-main--lav-shortcode .lav-back-to-site {
	display: none;
}

.lav-page-main--lav-shortcode .lav-btn,
.lav-page-main--lav-shortcode .lav-rsvp-form button,
.lav-page-main--lav-shortcode .lav-guestbook-form button,
.lav-page-main--lav-shortcode .lav-registry-card .lav-btn {
	text-decoration: none;
}

@media (max-width: 720px) {
	.lav-page-main--lav-shortcode .lav-section--plain,
	.lav-page-main--lav-shortcode .lav-registry-page,
	.lav-page-main--lav-shortcode .lav-rsvp-page,
	.lav-page-main--lav-shortcode .lav-guestbook-page {
		padding-left: 0;
		padding-right: 0;
	}

	.lav-page-main--lav-shortcode .lav-script-line {
		font-size: clamp(3rem, 17vw, 4.75rem);
	}

	.lav-page-main--lav-shortcode .lav-page-heading,
	.lav-page-main--lav-shortcode .lav-schedule-page > .lav-container > h2,
	.lav-page-main--lav-shortcode .lav-parking-page > .lav-container > h2 {
		font-size: clamp(1.9rem, 10vw, 2.85rem);
	}
}


/* 404 page */
.lav-error-page {
	padding-top: var(--lav-page-top-space, 96px);
}
.lav-error-page__inner {
	min-height: 52vh;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.lav-generated-page__actions {
	display: flex;
	gap: 14px;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	margin-top: 30px;
}


/* v36.7 Hero image controls */
.lav-hero--invitation.lav-hero--layout-full {
	min-height: 100svh;
}

.lav-hero--invitation.lav-hero--layout-clean {
	background-image: none;
	background-color: var(--lav-background);
}

.lav-hero--invitation.lav-hero--layout-photo,
.lav-hero--invitation.lav-hero--layout-full {
	background-size: cover;
	background-repeat: no-repeat;
}

.lav-hero--invitation.lav-hero--has-image .lav-hero__overlay {
	display: block;
}

.lav-hero--invitation.lav-hero--overlay-light .lav-hero__overlay {
	background: rgba(250,247,242,0.38);
}

.lav-hero--invitation.lav-hero--overlay-medium .lav-hero__overlay {
	background: rgba(250,247,242,0.58);
}

.lav-hero--invitation.lav-hero--overlay-strong .lav-hero__overlay {
	background: rgba(250,247,242,0.74);
}

.lav-hero--has-image.lav-hero--invitation.lav-hero--overlay-light .lav-hero__content {
	background: rgba(255,255,255,0.62);
}

.lav-hero--has-image.lav-hero--invitation.lav-hero--overlay-medium .lav-hero__content {
	background: rgba(255,255,255,0.74);
}

.lav-hero--has-image.lav-hero--invitation.lav-hero--overlay-strong .lav-hero__content {
	background: rgba(255,255,255,0.84);
}

.lav-hero--invitation.lav-hero--layout-full .lav-hero__content {
	max-width: min(920px, 86vw);
}

@media (max-width: 700px) {
	.lav-hero--invitation.lav-hero--layout-full,
	.lav-hero--invitation.lav-hero--layout-photo {
		min-height: 82svh;
	}
}


/* v36.10 Frontend QA polish: photo hero + family cards */
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full {
	background-color: #191714;
}

.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-hero__overlay,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-hero__overlay {
	display: block;
	background:
		linear-gradient(90deg, rgba(20,18,15,.78) 0%, rgba(20,18,15,.48) 45%, rgba(20,18,15,.18) 100%),
		linear-gradient(180deg, rgba(20,18,15,.18) 0%, rgba(20,18,15,.50) 100%);
}

.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-hero__content,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-hero__content {
	background: transparent;
	border: 0;
	box-shadow: none;
	backdrop-filter: none;
	max-width: min(760px, 88vw);
	margin-left: max(6vw, 2rem);
	margin-right: auto;
	text-align: left;
	padding-left: 0;
	padding-right: 0;
}

.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-display,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-hero__date,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-hero__countdown,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-hero__hashtag,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-display,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-hero__date,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-hero__countdown,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-hero__hashtag {
	color: var(--lav-photo-hero-text, #fffaf2);
	text-shadow: 0 2px 18px rgba(0,0,0,.38);
}

.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-script-line,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-script-line {
	color: var(--lav-photo-hero-accent, #e6c37b);
	text-shadow: 0 2px 16px rgba(0,0,0,.32);
}

.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-divider,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-divider {
	margin-left: 0;
	margin-right: auto;
}

.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-divider::before,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-divider::after,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-divider::before,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-divider::after {
	background: rgba(255,250,242,.38);
}

.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-divider span,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-divider span {
	color: var(--lav-photo-hero-accent, #e6c37b);
}

.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-hero__actions,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-hero__actions {
	justify-content: flex-start;
}

.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-btn--ghost,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-btn--ghost {
	color: var(--lav-photo-hero-text, #fffaf2);
	border-color: color-mix(in srgb, var(--lav-photo-hero-text, #fffaf2) 76%, transparent);
	background: rgba(255,255,255,.10);
}

.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-btn--ghost:hover,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-btn--ghost:hover {
	background: var(--lav-photo-hero-accent, #e6c37b);
	border-color: var(--lav-photo-hero-accent, #e6c37b);
	color: var(--lav-on-photo-hero-accent, #191919);
}

.lav-family__card {
	overflow: hidden;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.lav-family__photo {
	flex: 0 0 auto;
	display: block;
}

.lav-family__bio {
	width: 100%;
	max-width: 24rem;
	margin-left: auto;
	margin-right: auto;
	overflow: visible;
}

.lav-family__bio p {
	margin: 0.35rem auto 0;
	font-size: 0.9rem;
	line-height: 1.62;
	color: var(--lav-muted);
}

@media (max-width: 760px) {
	.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-hero__overlay,
	.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-hero__overlay {
		background: linear-gradient(180deg, rgba(20,18,15,.30) 0%, rgba(20,18,15,.74) 100%);
	}
	.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-hero__content,
	.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-hero__content {
		max-width: min(92vw, 620px);
		margin-left: auto;
		margin-right: auto;
		text-align: center;
		padding-left: 1rem;
		padding-right: 1rem;
	}
	.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-divider,
	.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-divider {
		margin-left: auto;
		margin-right: auto;
	}
	.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-hero__actions,
	.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-hero__actions {
		justify-content: center;
	}
}


/* v36.11 Homepage photo hero readability guard
   The style controller can inject global heading colors after this file.
   These selectors mirror the photo hero state so the intended treatment stays readable. */
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-display,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-hero__date,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-hero__countdown,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-hero__hashtag,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-display,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-hero__date,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-hero__countdown,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-hero__hashtag {
	color: var(--lav-photo-hero-text, #fffaf2);
	text-shadow: 0 2px 18px rgba(0,0,0,.42);
}

.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-photo .lav-script-line,
.lav-hero--invitation.lav-hero--has-image.lav-hero--layout-full .lav-script-line {
	color: var(--lav-photo-hero-accent, #e6c37b);
	text-shadow: 0 2px 16px rgba(0,0,0,.34);
}

/* v36.12 Photo hero contrast polish: theme-aware script color and safer buttons. */
.lav-hero--invitation.lav-hero--has-image .lav-hero__actions .lav-btn--solid,
.lav-hero--invitation.lav-hero--has-image .lav-hero__actions .lav-btn:not(.lav-btn--ghost):not(.lav-btn--outline) {
	background: var(--lav-photo-hero-accent, var(--lav-gold));
	border-color: var(--lav-photo-hero-accent, var(--lav-gold));
	color: var(--lav-on-photo-hero-accent, #191919);
}
.lav-hero--invitation.lav-hero--has-image .lav-hero__actions .lav-btn--ghost,
.lav-hero--invitation.lav-hero--has-image .lav-hero__actions .lav-btn--outline {
	background: rgba(255,255,255,.10);
	color: var(--lav-photo-hero-text, #fffaf2);
	border-color: color-mix(in srgb, var(--lav-photo-hero-text, #fffaf2) 76%, transparent);
}
.lav-hero--invitation.lav-hero--has-image .lav-hero__actions .lav-btn--ghost:hover,
.lav-hero--invitation.lav-hero--has-image .lav-hero__actions .lav-btn--outline:hover {
	background: var(--lav-photo-hero-accent, var(--lav-gold));
	border-color: var(--lav-photo-hero-accent, var(--lav-gold));
	color: var(--lav-on-photo-hero-accent, #191919);
}

/* v36.13 RSVP pill readability polish
   Keep gold CTA buttons accessible. White on this gold fails contrast in many palettes,
   so action pills use a deep ink/brown label with stronger weight. */
.lav-main-nav a[href*="rsvp"],
.lav-main-nav .lav-nav-rsvp,
.lav-main-nav .lav-menu-rsvp,
.lav-floating-rsvp,
.lav-floating-actions__rsvp,
.lav-hero--invitation .lav-hero__actions .lav-btn--solid,
.lav-hero--invitation .lav-hero__actions .lav-btn:not(.lav-btn--ghost):not(.lav-btn--outline) {
	font-weight: 700;
	letter-spacing: .14em;
	text-rendering: geometricPrecision;
}

.lav-main-nav a[href*="rsvp"],
.lav-main-nav .lav-nav-rsvp,
.lav-main-nav .lav-menu-rsvp {
	color: var(--lav-on-action, #24190f);
	text-shadow: none;
}

.lav-hero--invitation.lav-hero--has-image .lav-hero__actions .lav-btn--solid,
.lav-hero--invitation.lav-hero--has-image .lav-hero__actions .lav-btn:not(.lav-btn--ghost):not(.lav-btn--outline),
.lav-floating-rsvp,
.lav-floating-actions__rsvp {
	color: var(--lav-on-action, #24190f);
	text-shadow: none;
}

.lav-hero--invitation.lav-hero--has-image .lav-hero__actions .lav-btn--solid:hover,
.lav-hero--invitation.lav-hero--has-image .lav-hero__actions .lav-btn:not(.lav-btn--ghost):not(.lav-btn--outline):hover,
.lav-floating-rsvp:hover,
.lav-floating-actions__rsvp:hover {
	filter: brightness(.96) saturate(1.04);
}


/* v36.16 return-to-top shape polish
   The utility control is circular and subtle so it matches the site's soft, pill-shaped language. */
.lav-floating-actions__top {
	width: 44px;
	height: 44px;
	min-width: 44px;
	border-radius: 999px;
	box-shadow: 0 12px 30px rgba(31, 23, 18, 0.12);
	background: color-mix(in srgb, var(--lav-surface, #fffaf1) 92%, transparent);
	color: var(--lav-action, var(--lav-gold));
	border-color: color-mix(in srgb, var(--lav-action, var(--lav-gold)) 34%, var(--lav-line, #e8ddcd));
}

.lav-floating-actions__top:hover,
.lav-floating-actions__top:focus-visible {
	border-radius: 999px;
	box-shadow: 0 16px 34px rgba(31, 23, 18, 0.18);
	background: var(--lav-action, var(--lav-gold));
	border-color: var(--lav-action, var(--lav-gold));
	color: var(--lav-on-action, #24190f);
}

@media (max-width: 820px) {
	.lav-floating-actions__top {
		width: 40px;
		height: 40px;
		min-width: 40px;
		border-radius: 999px;
	}
}
