/* ============================================================================
   dCover app — THE TOKEN LAYER (design v6, brand locked by MSD 2026-09-26).

   Source of truth: brand/preview-board-combo.png. STRICT three colours:
     · red   #D71921 — the brand (logo d, the plane) and the ONE action colour
                       (Search, Reserve, primary buttons). White text 5.18:1.
     · black #121316 — words, icons, the app tile, selected rings, links.
     · white          — cards and surfaces.
   Neutral greys only for secondary text (#5E636B) and lines (#E3E6EA).
   Blue only as the faint page background #F3F6FB — never a link, ring, line,
   tag or highlight. No green, no amber, no red for errors: good prices are
   black bold, errors are black words + ⚠ in a plain box with a black left
   bar, so red always means dCover.

   1. BRAND  — the only part a partner theme changes (theme.js writes a
               partner's values after this file, same three blocks).
   2. NEUTRAL — surfaces, words, lines (never themed).
   3. REMAP  — the Horizon names older components still use, pointed at the
               above. ok / warn / bad all become ink: meaning comes from the
               icon and the words, not from a colour.
   Light on bare :root, then prefers-color-scheme:dark, then [data-theme=dark].
   data-theme = light/dark mode; data-brand = partner theme.
   ========================================================================== */

/* ------------------------------------------------------------- 1. BRAND */
:root{
  --accent:#d71921;          /* dCover Red — logo, Search, Reserve, the header line, the loading line */
  --accent-ink:#ffffff;      /* text on the red: 5.18:1 */
  --accent-soft:#e3e6ea;     /* the track behind the loading line (a line grey — not a pink) */
  --accent-text:#d71921;     /* red as TEXT or OUTLINE on white (5.18:1) — outlined secondary only */
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){ --accent:#d71921; --accent-ink:#ffffff; --accent-soft:#2c2f35; --accent-text:#ff5a5f; }
}
:root[data-theme="dark"]{ --accent:#d71921; --accent-ink:#ffffff; --accent-soft:#2c2f35; --accent-text:#ff5a5f; }
/* dark: the filled red button stays #D71921 with white text; red TEXT/OUTLINES use #FF5A5F
   (6.09:1 on #121316, 5.52:1 on #1B1D22) — the only extra shade. */

/* ----------------------------------------------------------- 2. NEUTRAL */
:root{
  --bg:#f3f6fb;              /* the faint blue page — the ONLY blue */
  --surface:#ffffff;         /* header band, summary bar, cards, sheets */
  --surface-2:#f6f7f9;       /* quiet rows, hover */
  --chip:#eef0f2;            /* neutral tint: tags, icon wells, selected rows */
  --ink:#121316;             /* words, icons, selected rings, links */
  --text:#1e2328;            /* body copy: a deep charcoal (headlines and the logo stay #121316) */
  --ink-2:#5e636b;           /* secondary text — 6.05:1 on white, 5.58:1 on the page */
  --mute:#5e636b;
  --hair:#e3e6ea;            /* lines */
  --hair-2:#c9cdd3;          /* field and button outlines (still grey) */
  --focus-ring:#121316;
  --fieldbg:#eef0f3;         /* grey form fields */
  --round:0 1px 4px rgba(18,19,22,.16);
  --card-lift:0 1px 3px rgba(18,19,22,.08);
  --tag-best:#eef0f2; --tag-best-ink:#121316;       /* tags: one neutral tint, black words */
  --tag-cheap:#eef0f2; --tag-cheap-ink:#121316;
  --tag-fast:#eef0f2; --tag-fast-ink:#121316;
  --lift:0 1px 2px rgba(18,19,22,.04);
  --float:0 10px 30px rgba(18,19,22,.16);
  --card-float:0 1px 2px rgba(18,19,22,.06),0 4px 14px rgba(18,19,22,.10);   /* round 8: the search card (KAYAK's soft lift) */
  /* round 10 (MSD: "just a little bit of neon"): the Harbour tint — ONLY for Hadi (the customer's bubble, the ✦, the send ring) */
  --neon-tint:#e3edfc; --neon-ink:#121316; --neon:#1f74f0; --lagoon:#14b194;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#121316; --surface:#1b1d22; --surface-2:#212329; --chip:#2a2d33;
    --ink:#ffffff; --ink-2:#a3a8b0; --mute:#a3a8b0; --hair:#2c2f35; --hair-2:#454951; --text:#e9ebee;
    --focus-ring:#ffffff; --fieldbg:#26292f; --round:0 0 0 1px #454951; --card-lift:0 0 0 1px #2c2f35;
    --tag-best:#2a2d33; --tag-best-ink:#ffffff; --tag-cheap:#2a2d33; --tag-cheap-ink:#ffffff; --tag-fast:#2a2d33; --tag-fast-ink:#ffffff;
    --lift:none; --float:0 10px 30px rgba(0,0,0,.6); --card-float:0 0 0 1px #2c2f35;
    --neon-tint:#16213a; --neon-ink:#ffffff; --neon:#1f74f0; --lagoon:#14b194;
  }
}
:root[data-theme="dark"]{
  --bg:#121316; --surface:#1b1d22; --surface-2:#212329; --chip:#2a2d33;
  --ink:#ffffff; --ink-2:#a3a8b0; --mute:#a3a8b0; --hair:#2c2f35; --hair-2:#454951; --text:#e9ebee;
  --focus-ring:#ffffff; --fieldbg:#26292f; --round:0 0 0 1px #454951; --card-lift:0 0 0 1px #2c2f35;
  --tag-best:#2a2d33; --tag-best-ink:#ffffff; --tag-cheap:#2a2d33; --tag-cheap-ink:#ffffff; --tag-fast:#2a2d33; --tag-fast-ink:#ffffff;
  --lift:none; --float:0 10px 30px rgba(0,0,0,.6); --card-float:0 0 0 1px #2c2f35;
  --neon-tint:#16213a; --neon-ink:#ffffff; --neon:#1f74f0; --lagoon:#14b194;
}

/* ------------------------------------------------------------ 3. REMAP */
:root,
:root[data-theme="dark"]{
  --paper:var(--bg); --card:var(--surface); --card-2:var(--surface-2);
  --ink-soft:var(--ink-2); --muted:var(--mute);
  --line:var(--hair); --line-strong:var(--hair-2);
  --sea-900:var(--surface); --on-sea:var(--ink); --on-sea-soft:var(--mute);
  --sea-700:var(--ink); --sea-soft:var(--chip);
  --sun:var(--accent); --sun-hover:var(--accent); --on-sun:var(--accent-ink);
  --sun-soft:var(--chip); --sun-ink:var(--ink);
  --ok:var(--ink); --ok-soft:var(--chip);
  --warn:var(--ink); --warn-soft:var(--chip);
  --bad:var(--ink); --bad-soft:var(--surface);
  --focus:var(--focus-ring);
  --shadow-1:var(--lift); --shadow-2:var(--float);
  --radius:12px; --radius-sm:10px;
  --logo-ground:#ffffff; --logo-line:var(--hair);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --paper:var(--bg); --card:var(--surface); --card-2:var(--surface-2);
    --ink-soft:var(--ink-2); --muted:var(--mute);
    --line:var(--hair); --line-strong:var(--hair-2);
    --sea-900:var(--surface); --on-sea:var(--ink); --on-sea-soft:var(--mute);
    --sea-700:var(--ink); --sea-soft:var(--chip);
    --sun:var(--accent); --sun-hover:var(--accent); --on-sun:var(--accent-ink);
    --sun-soft:var(--chip); --sun-ink:var(--ink);
    --ok:var(--ink); --ok-soft:var(--chip);
    --warn:var(--ink); --warn-soft:var(--chip);
    --bad:var(--ink); --bad-soft:var(--surface);
    --focus:var(--focus-ring);
    --shadow-1:var(--lift); --shadow-2:var(--float);
    --logo-ground:#ffffff; --logo-line:var(--hair);
  }
}
