/* WLink — light theme override.
   Loaded AFTER /styles.css. Each page is its own DOM/CSS load, so this is
   opt-in per page rather than global — but it's now the shared light theme
   for the whole product surface (landing, dashboard, builder, register,
   admin, review), not just the marketing site the filename suggests.
   admin/ and review/ used to keep the raw dark tokens in public/tokens/*.css
   unthemed; that was a design-system split, not a deliberate choice, so
   they load this file too now (see DESIGN.md for the rationale).

   Direction: clean, light, professional SaaS — white/soft-neutral ground,
   dark warm-black text, ONE confident accent (a flat, saturated blue) used
   only for the primary action and key highlights. WhatsApp keeps its own
   real brand green so it always reads as "the WhatsApp channel", clearly
   separate from the site's own accent — reinforcing that WhatsApp is a
   secondary channel, not the main call to action. */
:root {
  /* Ground / surfaces (kept the same variable names as the dark tokens so
     every existing component "just works" with new values) */
  --ink-950: #ffffff; /* page background */
  --ink-900: #ffffff; /* dialogs, gradients that started from ink-900 */
  --ink-800: #f5f3ef; /* raised surface / browser-chrome bars */
  --ink-700: #eeece5; /* slightly deeper neutral */
  --ink-600: #e6e2d9;

  /* Accent — confident blue (flat, no purple drift) */
  --green-700: #17399e;
  --green-600: #2952d6;
  --green-500: #4c72e0;
  --green-400: #9db3ee;

  /* Text */
  --ivory: #16181c;      /* primary text — dark warm-black on light ground */
  --slate-300: #565c64;  /* muted body text */
  --slate-400: #6b7178;  /* faint / captions — darkened from #7d838c, which
    measured 3.8:1 on white (fails the 4.5:1 body-text floor); this passes
    at ~4.9:1 while staying visibly lighter than --slate-300 */
  --ink-on-accent: #ffffff; /* text on the accent-colored button */

  /* Hairlines & fills */
  --line-green: rgba(41, 82, 214, 0.24);
  --line-green-strong: rgba(41, 82, 214, 0.5);
  --line-white: rgba(22, 24, 28, 0.09);
  --glass-fill: #ffffff;
  --glass-fill-strong: #fff8f5;
  --scrim: rgba(15, 15, 15, 0.5);

  /* Semantic aliases */
  --bg-page: var(--ink-950);
  --surface-card: var(--glass-fill);
  --surface-raised: var(--ink-800);
  --surface-panel: linear-gradient(180deg, #ffffff, #fbfaf7);
  --text-primary: var(--ivory);
  --text-muted: var(--slate-300);
  --text-faint: var(--slate-400);
  --text-on-gold: var(--ink-on-accent);
  --accent: var(--green-600);
  --accent-bright: var(--green-600);
  --accent-tint: rgba(41, 82, 214, .08);
  --border-subtle: var(--line-green);
  --border-hair: var(--line-white);
  --line-gold-strong: var(--line-green-strong);

  /* Shadows — soft, light-mode weight (dark tokens were tuned for dark bg) */
  --shadow-card: 0 10px 28px rgba(20, 18, 15, 0.07);
  --shadow-panel: 0 26px 64px rgba(20, 18, 15, 0.10);
  --shadow-gold: 0 14px 32px rgba(41, 82, 214, 0.20);
  --shadow-gold-hover: 0 18px 40px rgba(41, 82, 214, 0.26);

  --blur-nav: blur(16px) saturate(160%);
  --blur-card: blur(0px);

  /* Gradients */
  --grad-gold: linear-gradient(135deg, var(--green-600), var(--green-500));
  --grad-gold-accent: linear-gradient(135deg, #2952d6, #4c72e0, #9db3ee);
  --grad-glass: linear-gradient(180deg, #ffffff, #fbfaf7);
  --grad-glass-strong: linear-gradient(180deg, #f4f7ff, #ffffff);
  --grad-whatsapp: linear-gradient(135deg, #25d366, #128c7e);

  --bg-atmosphere:
    radial-gradient(circle at 12% 0%, rgba(41, 82, 214, 0.06), transparent 38%),
    radial-gradient(circle at 88% 22%, rgba(41, 82, 214, 0.045), transparent 40%),
    #ffffff;
}
