/* Siam Booking · shared design tokens.
   Loaded by the landing (index.html, contact.html) and by the back-office
   prototype (app/). One accent (lagoon teal), Geist, tinted neutrals.
   Dark mode follows the system (prefers-color-scheme). A page that must stay
   light (the public booking page, operators embed it) sets
   data-theme="light" on <html>.

   radii  --r-xl 20 (big frames) · --r-lg 14 (cards, windows) · --r-md 10 (inner cards, buttons, inputs) · --r-sm 6 (badges, cells)
   shadow --sh-1 (resting) · --sh-2 (panel) · --sh-3 (hero window)            */

:root {
  color-scheme: light;
  --bg: #F6F7F6;
  --surface: #FFFFFF;
  --surface-2: #F1F3F2;
  --line: #E1E5E3;
  --line-2: #CBD2CF;
  --ink: #0E1715;
  --ink-2: #3D4845;
  --muted: #56625F;

  --accent: #0B6B66;
  --accent-ink: #FFFFFF;
  --accent-soft: #E3F1EF;
  --accent-line: #CBE4E0;
  --accent-deep: #07504C;
  --accent-2: #7FB7B2;

  --warm: #A14A07;
  --warm-ink: #7A3606;
  --warm-soft: #FCEFDF;
  --warm-line: #F3DCC0;

  --info-ink: #33425C;
  --info-soft: #EEF1F6;
  --info-line: #DCE2EC;

  --danger: #A8261B;
  --danger-soft: #FBE9E7;
  --danger-line: #F2CBC6;

  --nav-bg: rgba(246, 247, 246, 0.86);
  --shade: 14, 23, 21;

  --r-xl: 20px;
  --r-lg: 14px;
  --r-md: 10px;
  --r-sm: 6px;
  --sh-1: 0 1px 2px rgba(var(--shade), 0.05);
  --sh-2: 0 1px 2px rgba(var(--shade), 0.05), 0 12px 32px -14px rgba(var(--shade), 0.16);
  --sh-3: 0 1px 3px rgba(var(--shade), 0.06), 0 30px 60px -28px rgba(var(--shade), 0.30);
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);

  --font: 'Geist', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono: 'Geist Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* Dark: same hue family, lifted accent, dark text on the accent fill.
   Every text pair below is checked at AA (4.5:1) on --surface and --bg. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #0B1110;
    --surface: #121A18;
    --surface-2: #18221F;
    --line: #243030;
    --line-2: #34423F;
    --ink: #E9EFED;
    --ink-2: #BCC7C3;
    --muted: #97A5A0;

    --accent: #4CC2B7;
    --accent-ink: #04211F;
    --accent-soft: #10302C;
    --accent-line: #1C4843;
    --accent-deep: #8FDDD5;
    --accent-2: #2C7F78;

    --warm: #F0A25C;
    --warm-ink: #F6BD88;
    --warm-soft: #2C1F12;
    --warm-line: #4A3219;

    --info-ink: #BFCBE0;
    --info-soft: #1A2130;
    --info-line: #2A3448;

    --danger: #F2998F;
    --danger-soft: #331A17;
    --danger-line: #5A2B25;

    --nav-bg: rgba(11, 17, 16, 0.82);
    --shade: 0, 0, 0;
    --sh-1: 0 1px 2px rgba(0, 0, 0, 0.4);
    --sh-2: 0 1px 2px rgba(0, 0, 0, 0.4), 0 14px 36px -14px rgba(0, 0, 0, 0.6);
    --sh-3: 0 1px 3px rgba(0, 0, 0, 0.45), 0 34px 70px -26px rgba(0, 0, 0, 0.75);
  }
}
