/* =====================================================================
   THEME - the only place colours and fonts are defined.
   To re-theme the guide for another host, change the values below
   (and the Google Fonts link in index.html / hosts.html if the fonts change),
   then run:  python3 tools/check_theme.py   (WCAG AA contrast check).
   style.css only consumes these tokens; it sets no colours or font families.

   Pilot identity "Stay Guide": sea-glass off-white, deep teal primary,
   coral as the one bright accent. Fonts: Rubik (body/UI, Latin + Hebrew),
   Fraunces (Latin headings) with Frank Ruhl Libre (Hebrew headings).
   ===================================================================== */
:root {
  /* fonts */
  --font-body: "Rubik", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-display: "Fraunces", "Frank Ruhl Libre", Georgia, serif;
  --fw-display: 600;

  /* surfaces and text */
  --bg: #eef5f3;            /* sea-glass off-white */
  --surface: #ffffff;
  --chip: #e0edea;
  --line: #d3e3e0;
  --ink: #0f2733;           /* ink navy */
  --muted: #47606b;

  /* primary (deep teal) */
  --accent: #0b6266;
  --accent-ink: #ffffff;    /* text on --accent */
  --accent-soft: #d5ebe8;

  /* the one bright accent (coral) */
  --accent-deco: #e4583c;   /* decoration only: dots, small marks */
  --happy: #ff8a6b;         /* coral fill behind dark text: badges, check-out reminder */
  --happy-ink: #0f2733;

  /* danger / emergency */
  --danger: #b3261e;
  --danger-soft: #fde9e6;
  --danger-fill: #b3261e;
  --danger-ink: #ffffff;    /* text on --danger-fill */

  /* WhatsApp button (the host's contact) */
  --wa-bg: var(--accent);
  --wa-ink: var(--accent-ink);
  --wa-link: var(--accent);

  /* labels that sit on photos: same in light and dark */
  --badge-bg: rgba(255, 255, 255, .94);
  --badge-ink: #0f2733;
  --pill-bg: #0b6266;
  --pill-ink: #ffffff;
  --scrim-rgb: 5 24 30;     /* photo gradients, as "r g b" */
  --lightbox-bg: #061317;

  /* depth */
  --shadow-rgb: 15 39 51;
  --ring: rgba(15, 39, 51, .10);
  --shadow: 0 1px 2px rgba(15, 39, 51, .05), 0 8px 24px -14px rgba(11, 98, 102, .22);
  --shadow-hi: 0 2px 4px rgba(15, 39, 51, .06), 0 16px 36px -16px rgba(11, 98, 102, .30);
  --radius: 20px;

  color-scheme: light;
}

/* Dark mode: the same tokens, night values (both selectors are needed: system setting and forced theme) */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0a1a1f; --surface: #12272e; --chip: #1a343b; --line: #25434b;
    --ink: #e6f1ef; --muted: #9fb7bb;
    --accent: #5cd3c6; --accent-ink: #04201f; --accent-soft: #133d40;
    --accent-deco: #ff8a6b; --happy: #ff9a7d; --happy-ink: #0a1a1f;
    --danger: #ff9e92; --danger-soft: #3b1f1e; --danger-fill: #c4332a; --danger-ink: #ffffff;
    --ring: rgba(255, 255, 255, .09);
    --shadow: 0 10px 26px -16px rgba(0, 0, 0, .7); --shadow-hi: 0 18px 40px -18px rgba(0, 0, 0, .85);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #0a1a1f; --surface: #12272e; --chip: #1a343b; --line: #25434b;
  --ink: #e6f1ef; --muted: #9fb7bb;
  --accent: #5cd3c6; --accent-ink: #04201f; --accent-soft: #133d40;
  --accent-deco: #ff8a6b; --happy: #ff9a7d; --happy-ink: #0a1a1f;
  --danger: #ff9e92; --danger-soft: #3b1f1e; --danger-fill: #c4332a; --danger-ink: #ffffff;
  --ring: rgba(255, 255, 255, .09);
  --shadow: 0 10px 26px -16px rgba(0, 0, 0, .7); --shadow-hi: 0 18px 40px -18px rgba(0, 0, 0, .85);
  color-scheme: dark;
}