/**
 * Receiver-card cover variants (Aurora / Postcard / Wax seal).
 * Letter (revealed after open) keeps its single shared style — only the
 * unopened cover changes per .receiver-card--style-*.
 *
 * Loaded on single-dream where receiver-card.php renders.
 */

/* ====================================================================
   AURORA cover (default — purple radial gradient, glow medallion)
   ==================================================================== */
.receiver-card--style-aurora .receiver-cover--aurora {
	color: #ffffff;
	background: radial-gradient(120% 80% at 50% 0%, #8B7AC8 0%, #6050B0 45%, #3d3380 100%);
	position: relative;
	overflow: hidden;
}
.receiver-card--style-aurora .receiver-cover--aurora::before {
	content: "";
	position: absolute; inset: 0;
	background:
		radial-gradient(40% 30% at 20% 20%, rgba(255,195,105,0.25), transparent 60%),
		radial-gradient(40% 30% at 80% 70%, rgba(255,158,177,0.22), transparent 60%);
	pointer-events: none;
}
.receiver-card--style-aurora .receiver-cover--aurora::after {
	content: "";
	position: absolute; inset: 0;
	background-image: radial-gradient(circle, rgba(255,255,255,0.18) 1px, transparent 1.5px);
	background-size: 22px 22px;
	mask-image: radial-gradient(ellipse 80% 70% at 50% 40%, #000 30%, transparent 90%);
	-webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 40%, #000 30%, transparent 90%);
	pointer-events: none;
}
.receiver-card--style-aurora .receiver-cover--aurora h2,
.receiver-card--style-aurora .receiver-cover--aurora p,
.receiver-card--style-aurora .receiver-cover--aurora .receiver-medallion,
.receiver-card--style-aurora .receiver-cover--aurora .receiver-open-btn {
	position: relative;
	z-index: 2;
}
.receiver-card--style-aurora .receiver-medallion {
	position: relative;
	width: 96px; height: 96px;
	border-radius: 50%;
	background: linear-gradient(135deg, #FFC369, #ff9eb1);
	display: flex; align-items: center; justify-content: center;
	color: #fff; font-size: 2.2rem;
	box-shadow: 0 18px 40px -10px rgba(0,0,0,0.35), inset 0 0 0 4px rgba(255,255,255,0.35);
	margin-bottom: 1.6rem;
}
.receiver-card--style-aurora .receiver-medallion::before,
.receiver-card--style-aurora .receiver-medallion::after {
	content: ""; position: absolute; inset: -8px;
	border-radius: 50%;
	border: 2px solid rgba(255,255,255,0.5);
	animation: rcRingPulse 2.4s ease-out infinite;
}
.receiver-card--style-aurora .receiver-medallion::after { animation-delay: 1.2s; }
@keyframes rcRingPulse {
	0%   { transform: scale(0.7); opacity: 0.9; }
	100% { transform: scale(1.6); opacity: 0; }
}
.receiver-card--style-aurora .receiver-cover--aurora .receiver-open-btn {
	background: #fff;
	color: var(--color-primary, #6050b0);
	box-shadow: 0 12px 30px rgba(0,0,0,0.22);
}
.receiver-card--style-aurora .receiver-cover--aurora .receiver-open-btn:hover {
	box-shadow: 0 16px 40px rgba(0,0,0,0.28);
}

/* ====================================================================
   POSTCARD cover (warm gradient + stamp + postmark + cream panel)
   ==================================================================== */
.receiver-card--style-postcard .receiver-cover--postcard {
	color: var(--color-text-dark, #313330);
	background: linear-gradient(155deg, #FFC369 0%, #ff9eb1 55%, #A898FF 100%);
	padding: 2rem;
	position: relative;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 62vh;
}
.receiver-card--style-postcard .receiver-cover--postcard::before {
	content: "";
	position: absolute; inset: 0;
	background-image:
		repeating-linear-gradient(0deg, rgba(255,255,255,0.06) 0 1px, transparent 1px 4px),
		repeating-linear-gradient(90deg, rgba(0,0,0,0.04) 0 1px, transparent 1px 4px);
	pointer-events: none;
}
.rc-pc-stamp {
	position: absolute;
	top: 1.5rem; right: 1.5rem;
	width: 76px; height: 92px;
	background: #fff;
	border: 2px dashed rgba(96,80,176,0.4);
	border-radius: 6px;
	padding: 6px;
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	transform: rotate(6deg);
	box-shadow: 0 8px 18px rgba(0,0,0,0.15);
	text-align: center;
	z-index: 2;
}
.rc-pc-stamp-emoji { font-size: 1.6rem; line-height: 1; margin-bottom: 4px; }
.rc-pc-stamp-label {
	font-size: 0.55rem;
	font-weight: 800;
	letter-spacing: 1px;
	color: var(--color-primary, #6050b0);
	text-transform: uppercase;
}
.rc-pc-postmark {
	position: absolute;
	top: 5.6rem; right: 1.5rem;
	color: rgba(96,80,176,0.45);
	font-family: 'Caveat', cursive;
	font-size: 0.85rem;
	font-weight: 700;
	transform: rotate(-8deg);
	border: 1.5px solid rgba(96,80,176,0.45);
	border-radius: 100px;
	padding: 0.15rem 0.55rem;
	z-index: 2;
	pointer-events: none;
}
.rc-pc-panel {
	position: relative;
	z-index: 2;
	background: rgba(255,255,255,0.92);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border-radius: 18px;
	padding: 1.75rem 1.5rem;
	box-shadow: 0 18px 40px -16px rgba(47,47,49,0.25);
	display: flex; flex-direction: column; align-items: center; gap: 0.5rem;
	text-align: center;
}
.rc-pc-eyebrow {
	font-size: 0.7rem; font-weight: 800; letter-spacing: 2px;
	text-transform: uppercase; color: var(--color-primary, #6050b0);
	display: inline-flex; align-items: center; gap: 0.4rem;
	margin-bottom: 0.35rem;
}
.rc-pc-eyebrow::before {
	content: ""; width: 6px; height: 6px; border-radius: 50%;
	background: var(--color-primary, #6050b0);
	animation: rcDotPulse 1.8s ease-in-out infinite;
}
@keyframes rcDotPulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }
.receiver-card--style-postcard .rc-pc-panel h2 {
	color: var(--color-text-dark, #313330);
	margin: 0 0 0.3rem;
}
.receiver-card--style-postcard .rc-pc-panel p {
	color: var(--color-text-muted, #5e5f5c);
	margin-bottom: 1.2rem;
}
.receiver-card--style-postcard .receiver-open-btn {
	background: var(--color-primary, #6050b0);
	color: #fff;
	box-shadow: 0 10px 24px -8px rgba(96,80,176,0.55);
}
.receiver-card--style-postcard .receiver-open-btn:hover {
	background: #4d3f95;
}

/* ====================================================================
   WAX SEAL cover (cream paper + wax disc with monogram)
   ==================================================================== */
.receiver-card--style-seal .receiver-cover--seal {
	color: var(--color-text-dark, #313330);
	background: radial-gradient(80% 60% at 50% 30%, #fff8ec 0%, #f4ead8 100%);
	padding-top: 3.5rem;
	position: relative;
	overflow: hidden;
	text-align: center;
	min-height: 62vh;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.receiver-card--style-seal .receiver-cover--seal::before {
	content: "";
	position: absolute; inset: 0;
	background-image: radial-gradient(circle, rgba(122,87,68,0.07) 1px, transparent 1.5px);
	background-size: 14px 14px;
	pointer-events: none;
	opacity: 0.6;
}
.rc-seal-wax {
	position: relative;
	width: 110px; height: 110px;
	margin-bottom: 1.6rem;
	z-index: 2;
}
.rc-seal-disc {
	position: absolute; inset: 0;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #d96565 0%, #a83232 60%, #7a1f1f 100%);
	box-shadow:
		0 14px 28px -8px rgba(122,32,32,0.5),
		inset 0 -6px 14px rgba(0,0,0,0.25),
		inset 0 4px 10px rgba(255,255,255,0.18);
}
.rc-seal-ring {
	position: absolute; inset: 12px;
	border-radius: 50%;
	border: 1.5px solid rgba(255,255,255,0.35);
	pointer-events: none;
}
.rc-seal-mono {
	position: absolute; inset: 0;
	display: flex; align-items: center; justify-content: center;
	font-family: 'Fraunces', 'Caveat', Georgia, serif;
	font-style: italic;
	font-weight: 600;
	color: rgba(255,255,255,0.92);
	font-size: 2.6rem;
	text-shadow: 0 1px 0 rgba(0,0,0,0.25), 0 0 12px rgba(255,255,255,0.15);
	letter-spacing: -0.04em;
}
.rc-seal-eyebrow {
	font-size: 0.72rem; font-weight: 700; letter-spacing: 3px;
	text-transform: uppercase;
	color: var(--color-accent-brown, #7a5744);
	margin-bottom: 0.6rem;
	display: inline-flex; align-items: center; gap: 0.55rem;
	position: relative;
	z-index: 2;
}
.rc-seal-eyebrow::before,
.rc-seal-eyebrow::after {
	content: ""; width: 24px; height: 1px; background: currentColor; opacity: 0.4;
}
.receiver-card--style-seal .rc-seal-title {
	font-family: 'Fraunces', Georgia, serif;
	font-weight: 500;
	font-style: italic;
	letter-spacing: -0.02em;
	color: var(--color-text-dark, #313330);
	position: relative;
	z-index: 2;
}
.receiver-card--style-seal .receiver-cover--seal p {
	color: var(--color-text-muted, #5e5f5c);
	position: relative;
	z-index: 2;
}
.receiver-card--style-seal .receiver-open-btn {
	background: var(--color-text-dark, #2F2F31);
	color: #fff;
	box-shadow: 0 10px 24px -8px rgba(47,47,49,0.4);
	position: relative;
	z-index: 2;
}
.receiver-card--style-seal .receiver-open-btn:hover {
	background: #1c1c1e;
}

/* ====================================================================
   Premium covers — Aurora layout, only the base gradient changes.
   Reuses .receiver-cover--aurora (medallion, ::before/::after glow,
   ring-pulse). Source of truth for the gradients is the PHP registry
   dg_premium_card_styles() in plugins/dream-generator-api/inc/card-styles.php
   — keep these in sync when adding/changing a style.
   ==================================================================== */
.receiver-card--style-watercolor .receiver-cover--aurora { background: linear-gradient(135deg, #a8d8ea 0%, #aa96da 50%, #fcbad3 100%); }
.receiver-card--style-neon       .receiver-cover--aurora { background: linear-gradient(135deg, #ff006e 0%, #8338ec 50%, #3a86ff 100%); }
.receiver-card--style-marble     .receiver-cover--aurora { background: linear-gradient(135deg, #fefdfb 0%, #d8d2c4 100%); }
.receiver-card--style-rose       .receiver-cover--aurora { background: linear-gradient(135deg, #fec5bb 0%, #e63946 100%); }
.receiver-card--style-cosmos     .receiver-cover--aurora { background: radial-gradient(circle, #2a1a4d 0%, #050314 100%); }
.receiver-card--style-foil       .receiver-cover--aurora { background: linear-gradient(135deg, #f0c878 0%, #c89548 100%); }
.receiver-card--style-velvet     .receiver-cover--aurora { background: linear-gradient(160deg, #2a1f4d 0%, #0a0420 100%); }
.receiver-card--style-noir       .receiver-cover--aurora { background: linear-gradient(160deg, #1a1a1a 0%, #0a0a0a 100%); }
.receiver-card--style-linen      .receiver-cover--aurora { background: linear-gradient(135deg, #f4ead5 0%, #d4a373 100%); }
.receiver-card--style-ember      .receiver-cover--aurora { background: linear-gradient(135deg, #ff6b35 0%, #c1121f 100%); }
.receiver-card--style-sage       .receiver-cover--aurora { background: linear-gradient(135deg, #a3b18a 0%, #588157 100%); }
.receiver-card--style-lavender   .receiver-cover--aurora { background: linear-gradient(135deg, #c8b6ff 0%, #8e7dbe 100%); }
.receiver-card--style-ocean      .receiver-cover--aurora { background: linear-gradient(135deg, #0077b6 0%, #03045e 100%); }
.receiver-card--style-sunset     .receiver-cover--aurora { background: linear-gradient(135deg, #ffafcc 0%, #ff8500 50%, #cb1b45 100%); }
.receiver-card--style-midnight   .receiver-cover--aurora { background: linear-gradient(135deg, #1d2d50 0%, #133b5c 100%); }

/* Light premium overrides — Marble / Linen are near-white, so the default
   white Aurora text disappears. Flip text to dark and swap the white CTA
   for a dark one so it stays visible against the cream background.
   Mirrors the is_light flag in dg_premium_card_styles(). */
.receiver-card--style-marble .receiver-cover--aurora,
.receiver-card--style-linen  .receiver-cover--aurora {
	color: var(--color-text-dark, #313330);
}
/* h2 has an explicit `color: white` in wishes-v2.css that breaks the
   parent-color inheritance — re-assert dark explicitly for these palettes. */
.receiver-card--style-marble .receiver-cover--aurora h2,
.receiver-card--style-linen  .receiver-cover--aurora h2 {
	color: var(--color-text-dark, #313330);
}
.receiver-card--style-marble .receiver-cover--aurora .receiver-open-btn,
.receiver-card--style-linen  .receiver-cover--aurora .receiver-open-btn {
	background: var(--color-text-dark, #2F2F31);
	color: #ffffff;
}
.receiver-card--style-marble .receiver-cover--aurora .receiver-open-btn:hover,
.receiver-card--style-linen  .receiver-cover--aurora .receiver-open-btn:hover {
	background: #1a1a1a;
}

/* ====================================================================
   Letter (after open) — INTENTIONALLY single style for all variants.
   Don't override per-style background or colors here.
   ==================================================================== */
