/* ==========================================
   CHAT REVEAL — Color Theme Override
   firecatlabs.com/chat-reveal/

   Loaded AFTER style.css on all chat-reveal/ pages.
   Only overrides color tokens and the handful of
   hardcoded rgba() values in style.css.
   Every layout, component, and responsive rule
   stays in style.css — never duplicated here.
   ========================================== */

/* ── 1. CSS Variable Overrides ─────────────────────────────── */
:root {

  /* Backgrounds — warm cream with a rosy tint */
  --bg-primary:   #FFF5F7;
  --bg-secondary: #FEEEF2;
  --bg-tertiary:  #FCDDE5;

  /* Brand — warm pink / rose gold palette */
  --color-fire:       #D45F78;   /* warm pink     */
  --color-fire-dark:  #BC4F68;   /* deep pink     */
  --color-ember:      #C4866A;   /* rose gold     */
  --color-ember-dark: #B07560;   /* deep rose gold */

  /* Gradients */
  --gradient-fire:       linear-gradient(135deg, #D45F78 0%, #C4866A 100%);
  --gradient-fire-hover: linear-gradient(135deg, #BC4F68 0%, #B07560 100%);
  --gradient-fire-soft:  linear-gradient(135deg,
      rgba(212, 95, 120, 0.08) 0%,
      rgba(196, 134, 106, 0.08) 100%);

  /* Shadow */
  --shadow-fire: 0 4px 20px rgba(212, 95, 120, 0.20);
}

/* ── 2. Hardcoded rgba overrides ───────────────────────────── */

/* Nav backdrop */
.nav {
  background: rgba(255, 245, 247, 0.90);
}

/* Hero + product-hero ambient glow */
.hero::before,
.product-hero::before {
  background: radial-gradient(ellipse,
      rgba(212, 95, 120, 0.06) 0%,
      transparent 65%);
}

/* Primary button hover glow */
.btn--primary:hover {
  box-shadow: 0 6px 24px rgba(212, 95, 120, 0.30);
}

/* Featured card borders */
.card--featured {
  border-color: rgba(212, 95, 120, 0.20);
  box-shadow: var(--shadow-md),
              inset 0 0 0 1px rgba(212, 95, 120, 0.10);
}
.card--featured:hover {
  border-color: rgba(212, 95, 120, 0.35);
  box-shadow: var(--shadow-lg), var(--shadow-fire);
}

/* App cards */
.app-card--featured {
  border-color: rgba(212, 95, 120, 0.25);
  background: linear-gradient(160deg, #FFFFFF 0%, #FFF5F7 100%);
}
.app-card--featured:hover {
  border-color: rgba(212, 95, 120, 0.40);
  box-shadow: var(--shadow-md),
              0 0 0 1px rgba(212, 95, 120, 0.15);
}

/* Legal callout border */
.legal-callout {
  border-color: rgba(212, 95, 120, 0.15);
}

/* Product mockup background */
.product-mockup__bg {
  background: linear-gradient(160deg,
      #FFFFFF  0%,
      #FEEEF2 50%,
      #FCDDE5 100%);
}