/* VOYAGER_THEME_TOKENS_V1
   Design tokens for the "voyager" public theme. Layout/type/radius/shadow
   system stays its own (not a reskin of an existing theme's markup/CSS),
   but per admin request (VOYAGER_HOMEPAGE_REVISION_V1) the color language
   itself now matches SkyExpress's brand feel - navy primary / orange
   accent, the same values SkyExpress's own stylesheet falls back to
   (static/public_experiences/sky_express/templates/sky-express.css:
   --tenant-primary default #1F5D89, --tenant-secondary default #F26836) -
   so an operator's real brand colors (set via the same --tenant-primary/
   --tenant-secondary mechanism in base.html) still override these exactly
   as before. Named loosely after theme_studio/registry.py's TOKEN_NAMES
   (color_primary, font_heading, radius_card, ...) so a later Theme Studio
   retrofit (Phase 8) can map these 1:1 onto real Theme Studio tokens
   without renaming anything here. */

:root{
  /* ---- color: SkyExpress-language navy + orange ---- */
  --voy-color-primary:#1f5d89;
  --voy-color-primary-dark:#163f5c;
  --voy-color-primary-tint:#e7eef4;
  --voy-color-accent:#f26836;
  --voy-color-accent-dark:#d6531f;
  --voy-color-ink:#182636;
  --voy-color-ink-soft:#47566b;
  --voy-color-muted:#6b7a8c;
  --voy-color-bg:#f4f6f9;
  --voy-color-surface:#ffffff;
  --voy-color-surface-alt:#edf1f5;
  --voy-color-border:#dce3ea;
  --voy-color-border-strong:#b9c4d0;
  --voy-color-success:#0e7a4a;
  --voy-color-warning:#8a5a00;
  --voy-color-error:#b3261e;
  --voy-color-success-tint:#e6f4ec;
  --voy-color-warning-tint:#fbf1de;
  --voy-color-error-tint:#fbe9e7;
  --voy-color-focus:#1f5d89;

  /* ---- type ---- */
  --voy-font-display:ui-serif,Georgia,"Times New Roman",serif;
  --voy-font-body:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --voy-font-size-base:16px;
  --voy-line-base:1.5;

  /* ---- radius / shadow ---- */
  --voy-radius-sm:8px;
  --voy-radius-md:14px;
  --voy-radius-lg:22px;
  --voy-radius-pill:999px;
  --voy-shadow-sm:0 1px 2px rgba(22,35,31,.07);
  --voy-shadow-md:0 8px 24px rgba(22,35,31,.09);
  --voy-shadow-lg:0 24px 56px rgba(22,35,31,.14);

  /* ---- spacing (8px scale) ---- */
  --voy-space-1:4px;  --voy-space-2:8px;  --voy-space-3:12px;
  --voy-space-4:16px; --voy-space-5:24px; --voy-space-6:32px;
  --voy-space-7:48px; --voy-space-8:64px;

  /* ---- layout ---- */
  /* SKYEXPRESS_UX_V1: fluid, not a flat px cap - a 1280/1366px laptop at
     100% zoom now shrinks proportionally instead of freezing at the
     same width a 1920px+ monitor uses (the actual cause of the
     "oversized/zoomed-in" look the admin had to fix with browser zoom -
     no @media breakpoint existed between 980px and infinity). */
  --voy-container:min(1240px, calc(100% - 48px));
  --voy-header-h:76px;
  --voy-header-h-mobile:64px;

  color-scheme:light;
}

/* Small, deliberate transitions only (hover/focus/selection feedback) -
   no motion framework, no auto-playing/looping animation anywhere. */
*{transition:background-color .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease,transform .15s ease}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* SKYEXPRESS_UX_V1: calmer, less saturated tones for two specific
   controls (search CTA, active trip-type pill) - see app.css/search.css
   for where these are actually used. Deliberately separate from
   --voy-color-accent/--voy-color-primary so the rest of the theme's
   branding (logo, links, other buttons) is untouched. */
:root{
  --voy-color-cta:#3f6f8f;
  --voy-color-cta-dark:#325a75;
  --voy-color-trip-active-bg:#e4edf3;
  --voy-color-trip-active-text:#1f5d89;
}

/* VOYAGER_DARK_MODE_V1 (item 5): every other public theme (flori,
   aero_blue, fly_away, skyline, liquid_glass, the orphaned sky_express
   theme dir) already ships the established per-operator dark-mode
   pattern - Operator.public_dark_mode_enabled/_auto_enabled/_start/_end,
   a root[data-public-theme] flip, a header toggle button - via a shared
   PUBLIC_DARK_MODE_BASE script embedded per theme. Voyager was created
   after that pattern existed and never got it. This is that same
   established mechanism (see templates/public/themes/voyager/base.html
   for the ported script/button), not a new feature invented from
   nothing - only the actual palette below is new, because voyager's
   token system (this file) has no equivalent to reuse: unlike flori's
   ~5000-line app.css of literal per-element colors, voyager already
   funnels every color through this one set of --voy-color-* custom
   properties, so a real, theme-wide dark mode is a single override
   block here instead of a page-by-page repaint. */
:root[data-public-theme="dark"]{
  color-scheme:dark;
  --voy-color-primary:#5aa3d8;
  --voy-color-primary-dark:#8cc3e8;
  --voy-color-primary-tint:#173349;
  --voy-color-accent:#ff9166;
  --voy-color-accent-dark:#ffb08c;
  --voy-color-ink:#eef2f6;
  --voy-color-ink-soft:#c2ccd8;
  --voy-color-muted:#8a97a6;
  --voy-color-bg:#0f1720;
  --voy-color-surface:#182634;
  --voy-color-surface-alt:#1f303f;
  --voy-color-border:#2c3e50;
  --voy-color-border-strong:#3e5266;
  --voy-color-success:#43cf94;
  --voy-color-warning:#e2bd66;
  --voy-color-error:#ff8a82;
  --voy-color-success-tint:#12332a;
  --voy-color-warning-tint:#3a2f16;
  --voy-color-error-tint:#3a1c1a;
  --voy-color-focus:#5aa3d8;
  --voy-color-cta:#4d87ac;
  --voy-color-cta-dark:#68a0c4;
  --voy-color-trip-active-bg:#1c3547;
  --voy-color-trip-active-text:#8cc3e8;
}
