/**
 * Invitea Global App Typography & Design Tokens
 * Patch: INVITEA_SAFE_68_12_GLOBAL_APP_TYPOGRAPHY_AND_DESIGN_TOKENS
 *
 * Scope is intentionally limited to Invitea app pages/components. This must
 * not change the public WordPress theme pages outside /invitea/{page}/.
 */

:root {
	--invitea-font-heading: 'Playfair Display', Georgia, 'Times New Roman', serif;
	--invitea-font-body: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--invitea-font-logo: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
	--invitea-font-script: 'Great Vibes', cursive;

	--invitea-color-cream: #fff8f3;
	--invitea-color-cream-2: #fffdf9;
	--invitea-color-card: rgba(255,255,255,.96);
	--invitea-color-ink: #2b2430;
	--invitea-color-heading: #201826;
	--invitea-color-muted: #7a6f7f;
	--invitea-color-soft: #faf2ec;
	--invitea-color-border: rgba(203, 139, 82, .24);
	--invitea-color-border-strong: rgba(203, 139, 82, .38);
	--invitea-color-gold: #c9842b;
	--invitea-color-gold-dark: #9d5c0d;
	--invitea-color-rose: #d86b7a;
	--invitea-color-rose-dark: #b94b5c;
	--invitea-color-success: #70b77e;
	--invitea-color-warning: #e2a23a;
	--invitea-color-danger: #cf4b5c;

	--invitea-radius-xs: 10px;
	--invitea-radius-sm: 14px;
	--invitea-radius-md: 18px;
	--invitea-radius-lg: 24px;
	--invitea-radius-xl: 32px;
	--invitea-shadow-soft: 0 12px 34px rgba(93, 56, 23, .08);
	--invitea-shadow-card: 0 18px 52px rgba(93, 56, 23, .12);
	--invitea-shadow-floating: 0 26px 80px rgba(93, 56, 23, .16);
	--invitea-transition: 180ms ease;
}

body.invitea-standalone-app-page {
	margin: 0;
	background:
		radial-gradient(circle at 12% 10%, rgba(255, 224, 199, .54), transparent 30%),
		radial-gradient(circle at 88% 8%, rgba(255, 235, 224, .68), transparent 24%),
		linear-gradient(180deg, #fffdf9 0%, #fff8f3 55%, #fffdf9 100%);
	color: var(--invitea-color-ink);
	font-family: var(--invitea-font-body);
	font-size: 15px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

body.invitea-standalone-app-page #wpadminbar {
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

.invitea-frontend-app,
.invitea-frontend-app *,
.invitea-dashboard-v9,
.invitea-dashboard-v9 *,
.invitea-app-shell,
.invitea-app-shell *,
[class^="invitea-"],
[class*=" invitea-"] {
	box-sizing: border-box;
}

.invitea-frontend-app,
.invitea-dashboard-v9,
.invitea-app-shell,
.invitea-template-gallery,
.invitea-template-marketplace,
.invitea-templates,
.invitea-builder,
.invitea-preview,
.invitea-account-page,
.invitea-billing-page,
.invitea-my-invitation,
.invitea-rsvp-manager,
.invitea-guestbook-manager,
.invitea-analytics-dashboard,
.invitea-custom-domain,
.invitea-subdomain,
.invitea-qr-code {
	font-family: var(--invitea-font-body) !important;
	color: var(--invitea-color-ink);
}

.invitea-frontend-app input,
.invitea-frontend-app select,
.invitea-frontend-app textarea,
.invitea-frontend-app button,
.invitea-dashboard-v9 input,
.invitea-dashboard-v9 select,
.invitea-dashboard-v9 textarea,
.invitea-dashboard-v9 button,
.invitea-app-shell input,
.invitea-app-shell select,
.invitea-app-shell textarea,
.invitea-app-shell button,
.invitea-template-gallery input,
.invitea-template-gallery select,
.invitea-template-gallery button,
.invitea-template-marketplace input,
.invitea-template-marketplace select,
.invitea-template-marketplace button,
.invitea-templates input,
.invitea-templates select,
.invitea-templates button {
	font-family: var(--invitea-font-body) !important;
}

.invitea-frontend-app h1,
.invitea-frontend-app h2,
.invitea-frontend-app h3,
.invitea-frontend-app h4,
.invitea-dashboard-v9 h1,
.invitea-dashboard-v9 h2,
.invitea-dashboard-v9 h3,
.invitea-dashboard-v9 h4,
.invitea-app-shell h1,
.invitea-app-shell h2,
.invitea-app-shell h3,
.invitea-app-shell h4,
.invitea-template-gallery h1,
.invitea-template-gallery h2,
.invitea-template-gallery h3,
.invitea-template-marketplace h1,
.invitea-template-marketplace h2,
.invitea-template-marketplace h3,
.invitea-templates h1,
.invitea-templates h2,
.invitea-templates h3 {
	font-family: var(--invitea-font-heading) !important;
	color: var(--invitea-color-heading) !important;
	font-weight: 650;
	letter-spacing: -.02em;
	line-height: 1.1;
}

.invitea-frontend-app p,
.invitea-dashboard-v9 p,
.invitea-app-shell p,
.invitea-template-gallery p,
.invitea-template-marketplace p,
.invitea-templates p {
	color: var(--invitea-color-muted);
}

.invitea-v9-brand strong,
.invitea-app-shell__brand strong,
.invitea-premium-brand strong,
.invitea-premium-brand__mark,
.invitea-logo,
.invitea-brand-name {
	font-family: var(--invitea-font-logo) !important;
	font-weight: 700;
	letter-spacing: -.025em;
}

.invitea-v9-brand strong,
.invitea-app-shell__brand strong {
	font-style: italic;
	font-size: clamp(32px, 3vw, 42px) !important;
	line-height: .92;
	background: linear-gradient(135deg, #9d5c0d 0%, #c9842b 40%, #e2b66f 75%, #9d5c0d 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent !important;
}

.invitea-v9-brand span,
.invitea-app-shell__brand small,
.invitea-premium-brand span,
.invitea-kicker,
.invitea-v9-kicker,
.invitea-dashboard-kicker {
	font-family: var(--invitea-font-body) !important;
	text-transform: uppercase;
	letter-spacing: .16em;
	font-weight: 700;
	color: var(--invitea-color-gold-dark) !important;
}

.invitea-script-accent,
.invitea-wedding-script {
	font-family: var(--invitea-font-script) !important;
	font-weight: 400;
}

/* Global app shell surfaces */
.invitea-dashboard-v9,
.invitea-app-shell,
.invitea-template-gallery,
.invitea-template-marketplace,
.invitea-templates,
.invitea-builder,
.invitea-preview,
.invitea-account-page,
.invitea-billing-page,
.invitea-my-invitation,
.invitea-rsvp-manager,
.invitea-guestbook-manager,
.invitea-analytics-dashboard {
	--invitea-card-bg: var(--invitea-color-card);
	--invitea-border: var(--invitea-color-border);
	--invitea-ink: var(--invitea-color-ink);
	--invitea-muted: var(--invitea-color-muted);
}

/* Cards/panels across app pages */
.invitea-frontend-app .invitea-panel,
.invitea-frontend-app .invitea-card,
.invitea-app-shell__content,
.invitea-app-page-card,
.invitea-v9-topbar,
.invitea-v9-summary,
.invitea-v9-action-row .invitea-v9-btn,
.invitea-v9-browser,
.invitea-v9-phone,
.invitea-v9-checklist,
.invitea-v9-stat-card,
.invitea-v9-panel,
.invitea-template-gallery,
.invitea-template-marketplace,
.invitea-templates,
.invitea-template-card,
.invitea-my-invitation__panel,
.invitea-my-invitation__card,
.invitea-account-page__panel,
.invitea-account-page__card,
.invitea-billing-page__card,
.invitea-rsvp-manager__card,
.invitea-guestbook-manager__card,
.invitea-analytics-card {
	border-color: var(--invitea-color-border) !important;
	box-shadow: var(--invitea-shadow-soft);
}

/* Buttons */
.invitea-frontend-app a[class*="btn"],
.invitea-frontend-app button[class*="btn"],
.invitea-frontend-app .button,
.invitea-dashboard-v9 a[class*="btn"],
.invitea-dashboard-v9 button[class*="btn"],
.invitea-app-shell a[class*="btn"],
.invitea-app-shell button[class*="btn"],
.invitea-template-gallery button,
.invitea-template-gallery a.button,
.invitea-template-marketplace button,
.invitea-template-marketplace a.button,
.invitea-templates button,
.invitea-templates a.button {
	font-family: var(--invitea-font-body) !important;
	font-weight: 700;
	letter-spacing: -.01em;
	border-radius: var(--invitea-radius-sm) !important;
	transition: transform var(--invitea-transition), box-shadow var(--invitea-transition), background var(--invitea-transition), color var(--invitea-transition);
}

.invitea-frontend-app a[class*="btn"]:hover,
.invitea-frontend-app button[class*="btn"]:hover,
.invitea-dashboard-v9 a[class*="btn"]:hover,
.invitea-dashboard-v9 button[class*="btn"]:hover,
.invitea-app-shell a[class*="btn"]:hover,
.invitea-app-shell button[class*="btn"]:hover {
	transform: translateY(-1px);
	box-shadow: var(--invitea-shadow-card);
}

.invitea-v9-btn--primary,
.invitea-v9-btn--gold,
.invitea-premium-btn--primary,
.invitea-premium-btn--gold,
.invitea-button--primary,
.invitea-template-gallery button[type="submit"],
.invitea-template-marketplace button[type="submit"],
.invitea-templates button[type="submit"] {
	background: linear-gradient(135deg, var(--invitea-color-rose) 0%, var(--invitea-color-rose-dark) 52%, var(--invitea-color-gold) 100%) !important;
	border-color: rgba(185, 75, 92, .28) !important;
	color: #fff !important;
	box-shadow: 0 12px 30px rgba(216, 107, 122, .24) !important;
}

/* Inputs/forms */
.invitea-frontend-app input[type="text"],
.invitea-frontend-app input[type="email"],
.invitea-frontend-app input[type="url"],
.invitea-frontend-app input[type="search"],
.invitea-frontend-app input[type="date"],
.invitea-frontend-app input[type="time"],
.invitea-frontend-app input[type="number"],
.invitea-frontend-app select,
.invitea-frontend-app textarea,
.invitea-dashboard-v9 input,
.invitea-dashboard-v9 select,
.invitea-dashboard-v9 textarea,
.invitea-app-shell input,
.invitea-app-shell select,
.invitea-app-shell textarea,
.invitea-template-gallery input,
.invitea-template-gallery select,
.invitea-template-marketplace input,
.invitea-template-marketplace select,
.invitea-templates input,
.invitea-templates select {
	border: 1px solid var(--invitea-color-border-strong) !important;
	border-radius: var(--invitea-radius-sm) !important;
	background: rgba(255,255,255,.96) !important;
	color: var(--invitea-color-ink) !important;
	box-shadow: 0 8px 22px rgba(93, 56, 23, .04) !important;
}

.invitea-frontend-app input:focus,
.invitea-frontend-app select:focus,
.invitea-frontend-app textarea:focus,
.invitea-dashboard-v9 input:focus,
.invitea-dashboard-v9 select:focus,
.invitea-dashboard-v9 textarea:focus,
.invitea-app-shell input:focus,
.invitea-app-shell select:focus,
.invitea-app-shell textarea:focus {
	outline: 3px solid rgba(216,107,122,.13) !important;
	border-color: rgba(216,107,122,.55) !important;
}

/* Tables */
.invitea-frontend-app table,
.invitea-dashboard-v9 table,
.invitea-app-shell table {
	font-family: var(--invitea-font-body) !important;
	border-color: var(--invitea-color-border) !important;
}

.invitea-frontend-app th,
.invitea-dashboard-v9 th,
.invitea-app-shell th {
	font-family: var(--invitea-font-body) !important;
	font-weight: 700;
	color: var(--invitea-color-gold-dark) !important;
	letter-spacing: .05em;
	text-transform: uppercase;
	font-size: 12px;
}

/* Badges/status */
.invitea-frontend-app [class*="status"],
.invitea-dashboard-v9 [class*="status"],
.invitea-app-shell [class*="status"],
.invitea-frontend-app [class*="badge"],
.invitea-dashboard-v9 [class*="badge"],
.invitea-app-shell [class*="badge"] {
	font-family: var(--invitea-font-body) !important;
	font-weight: 800;
	letter-spacing: .01em;
}

/* App-shell sidebar polish shared across dashboard and routed pages. */
.invitea-v9-sidebar,
.invitea-app-shell__sidebar {
	background:
		radial-gradient(circle at 22% 86%, rgba(255, 226, 205, .72), transparent 30%),
		linear-gradient(180deg, rgba(255,253,249,.98) 0%, rgba(255,248,243,.98) 100%) !important;
	border-color: var(--invitea-color-border) !important;
	box-shadow: 18px 0 60px rgba(93, 56, 23, .08) !important;
}

.invitea-v9-nav a,
.invitea-app-shell__nav a,
.invitea-premium-nav__item {
	font-family: var(--invitea-font-body) !important;
	font-weight: 700;
	color: var(--invitea-color-ink) !important;
}

.invitea-v9-nav a.is-active,
.invitea-app-shell__nav a.is-active,
.invitea-premium-nav__item.is-active {
	background: linear-gradient(135deg, #fff0ed 0%, #fff8f3 100%) !important;
	border-color: rgba(216,107,122,.20) !important;
	box-shadow: 0 10px 28px rgba(216,107,122,.10) !important;
	color: var(--invitea-color-rose-dark) !important;
}

/* Dashboard v9 content: more consistent wedding typography. */
.invitea-v9-topbar h1,
.invitea-v9-preview-title,
.invitea-v9-browser-hero h2,
.invitea-v9-phone h3,
.invitea-v9-status-title,
.invitea-v9-panel h3,
.invitea-v9-checklist h3,
.invitea-v9-summary strong {
	font-family: var(--invitea-font-heading) !important;
}

.invitea-v9-browser-hero h2,
.invitea-v9-phone h3 {
	letter-spacing: -.03em;
}

/* Template marketplace inside app shell. */
.invitea-template-gallery,
.invitea-template-marketplace,
.invitea-templates {
	background: var(--invitea-color-card) !important;
	border-radius: var(--invitea-radius-lg) !important;
}

.invitea-template-gallery form,
.invitea-template-marketplace form,
.invitea-templates form {
	background: linear-gradient(135deg, rgba(255,248,243,.96), rgba(255,255,255,.96)) !important;
	border-color: var(--invitea-color-border) !important;
	border-radius: var(--invitea-radius-md) !important;
}

.invitea-template-card,
.invitea-template-gallery__item,
[class*="template-card"] {
	border-radius: var(--invitea-radius-lg) !important;
	border-color: var(--invitea-color-border) !important;
	box-shadow: var(--invitea-shadow-soft) !important;
}

@media (max-width: 1024px) {
	.invitea-frontend-app,
	.invitea-dashboard-v9,
	.invitea-app-shell {
		font-size: 14px;
	}

	.invitea-v9-brand strong,
	.invitea-app-shell__brand strong {
		font-size: 28px !important;
	}
}

@media (max-width: 720px) {
	.invitea-frontend-app h1,
	.invitea-dashboard-v9 h1,
	.invitea-app-shell h1 {
		font-size: clamp(30px, 11vw, 44px) !important;
	}

	.invitea-frontend-app h2,
	.invitea-dashboard-v9 h2,
	.invitea-app-shell h2 {
		font-size: clamp(25px, 8vw, 34px) !important;
	}

	.invitea-frontend-app h3,
	.invitea-dashboard-v9 h3,
	.invitea-app-shell h3 {
		font-size: clamp(20px, 6vw, 27px) !important;
	}

	.invitea-v9-brand strong,
	.invitea-app-shell__brand strong {
		font-size: 25px !important;
	}
}