/* Meda Voyages — agency 3 of Safaros (D94, AD-33).

   Petrol and gold, from the logo: the mark's square is gold, its wave and
   the Arabic « فوياج » petrol. Built from GTM's theme with each colour moved
   onto Meda's hues and its lightness kept, so the contrast GTM was checked
   for holds: Nuit becomes a petrol-black night with gold light; Halo ivory
   paper with petrol type and gold accents — the papers' palette
   (agencies/meda/pdf/palette.css).

   Loaded after the application's styles by /api/branding/theme.css. Every
   selector is the design system's own, prefixed with `html` so it outranks
   it without !important. Only brand colours change: layout, motion, type
   and the reader's own accent (« Apparence », BR-58) are untouched — the
   brand block below applies to the default accent only, as ABSHER's does. */

/* ---- The brand base: every halo, star, plane and button reads these ---- */
html:root {
  --nh-navy: #2B525D;
  --nh-navy-deep: #142F36;
  --nh-sky: #C6B45F;
  --nh-sky-2: #E0D28E;
  --nh-sky-3: #F1ECCA;
  --nh-manara: #BCA648;
  --nh-manara-2: #D3C269;
  --nh-manara-3: #E2D589;
  --nh-manara-deep: #877323;
  --nh-night: #0A161B;
  --nh-navy-rgb: 43, 82, 93;
  --nh-navy-deep-rgb: 20, 47, 54;
  --nh-sky-rgb: 198, 180, 95;
  --nh-sky-2-rgb: 224, 210, 142;
  --nh-sky-3-rgb: 241, 236, 202;
  --nh-manara-rgb: 188, 166, 72;
  --nh-manara-2-rgb: 211, 194, 105;
  --nh-manara-3-rgb: 226, 213, 137;
  --nh-manara-deep-rgb: 135, 115, 35;
  --nh-night-rgb: 10, 22, 27;
  /* Halo's sidebar: Meda petrol, deepening to the night, with cool ivory text. */
  --nh-side-top: #2B525D;
  --nh-side-bottom: #10252B;
  --nh-side-mobile: #12242C;
  --nh-side-text-2: #D8E2E5;
  --nh-side-text-3: #A1B5BB;

  /* The design system's primitives, retuned: petrol for its blue, gold for
     its sky, a deeper gold for its terracotta. */
  --absher-blue-50: #F6FAFB;
  --absher-blue-100: #E9F0F2;
  --absher-blue-200: #D1DFE3;
  --absher-blue-300: #B1C8CE;
  --absher-blue-400: #8AABB4;
  --absher-blue-500: #668D98;
  --absher-blue-600: #45717D;
  --absher-blue-700: #2B525D;
  --absher-blue-800: #1F3E47;
  --absher-blue-900: #142A30;
  --absher-blue-950: #0B181D;
  --absher-sky-50: #FCFBF1;
  --absher-sky-100: #F6F2DC;
  --absher-sky-200: #EEE5B9;
  --absher-sky-300: #E0D28E;
  --absher-sky-400: #C6B45F;
  --absher-sky-500: #B19D48;
  --absher-sky-600: #938036;
  --absher-sky-700: #716229;
  --absher-sky-800: #54471D;
  --absher-sky-900: #393114;
  --absher-sky-950: #221D0C;
  --absher-terra-50: #FBF8EC;
  --absher-terra-100: #F4EDD0;
  --absher-terra-200: #E9DDA5;
  --absher-terra-300: #DBC778;
  --absher-terra-400: #CAB158;
  --absher-terra-500: #B59B3D;
  --absher-terra-600: #93792D;
  --absher-terra-700: #6C5821;
  --absher-terra-800: #514117;
  --absher-terra-900: #362B0F;
  --absher-terra-950: #201A08;
}

/* ---- Nuit: a petrol-black night, gold light -------------------------- */
html:root[data-absher-theme="dark"] {
  --absher-color-surface-canvas: #0A161B;
  --absher-color-surface-subtle: #122229;
  --absher-color-surface-raised: #162A32;
  --absher-color-surface-sunken: #081114;
  --absher-color-surface-overlay: rgba(6, 14, 17, .72);
  --absher-color-text-primary: #F0F5F6;
  --absher-color-text-secondary: #B3C2C7;
  --absher-color-text-tertiary: #95A7AC;
  --absher-color-text-disabled: #677C82;
  --absher-color-border-subtle: #1F373E;
  --absher-color-border-default: #2A4650;
  --absher-color-border-control: #668089;

  --px-card: #12242C;
  --px-float: #172D36;
  --px-hover-solid: #1D3740;

  --nh-card-bg: linear-gradient(160deg, rgba(35, 63, 73, .80), rgba(18, 36, 44, .80));
  --nh-muted: #95A7AC;
  --nh-overline: #A0B1B6;
  --nh-ghost-fg: #E6EEF0;
  --nh-page-bg:
    radial-gradient(900px 520px at 12% -10%, #274A56 0%, rgba(39, 74, 86, 0) 70%),
    radial-gradient(700px 480px at 95% 110%, rgba(188, 166, 72, .22) 0%, rgba(188, 166, 72, 0) 70%),
    #0A161B;
}

/* ---- Halo: ivory paper, petrol type, gold accents -------------------- */
html:root:not([data-absher-theme="dark"]) {
  --absher-color-surface-canvas: #F8F7F1;
  --absher-color-surface-subtle: #F2F0E5;
  --absher-color-surface-sunken: #ECE9DA;
  --absher-color-text-secondary: #465C63;
  --absher-color-text-tertiary: #64767B;
  --absher-color-border-subtle: #EBE8D7;
  --absher-color-border-default: #E2DECB;
  --absher-color-status-info-bg: #F1EEDD;

  --px-canvas: #F8F7F1;
  --px-hairline: #EBE8D7;
  --px-hover: #FBF9F1;
  --px-pressed: #F3F1E0;
  --px-hover-solid: #FBF9F1;
  --px-shadow-float: 0 0 0 1px #EBE8D7, 0 40px 90px -30px rgba(43, 82, 93, .45);

  --nh-glass-border: #EBE8D7;
  --nh-muted: #53676D;
  --nh-overline: #877323;
  --nh-field-bg: #FDFCF7;
  --nh-field-border: #E2DECB;
  --nh-ghost-ring: #E1DBBD;
  --nh-row-hover: linear-gradient(90deg, #F6F3E1, rgba(246, 243, 225, .2));
  --nh-page-bg:
    radial-gradient(900px 520px at 15% -10%, #F1ECCA 0%, rgba(241, 236, 202, 0) 70%),
    radial-gradient(700px 480px at 95% 110%, rgba(43, 82, 93, .10) 0%, rgba(43, 82, 93, 0) 70%),
    linear-gradient(180deg, #F7F4E8, #FBFBF6 55%);
}

/* ---- The sign-in page's dunes and the logo's trail --------------------
   The shared stylesheet draws them in ABSHER's colours, not from the brand
   variables (nuit-halo.css: .nh-auth__dune-*, .nh-logo__trail), so they are
   repainted here: petrol dunes at night, pale gold sand by day, and a petrol
   trail by day where the shared one is ABSHER blue. */
html:root .nh-auth__dune-far { fill: #142937; }
html:root .nh-auth__dune-near { fill: #0E1E29; }
html:root:not([data-absher-theme="dark"]) .nh-auth__dune-far { fill: #F4E3B6; }
html:root:not([data-absher-theme="dark"]) .nh-auth__dune-near { fill: #EDCF8E; }
html:root:not([data-absher-theme="dark"]) .nh-logo__trail {
  background: conic-gradient(from 0deg, rgba(var(--nh-sky-rgb), 0) 0deg 250deg, rgba(var(--nh-navy-rgb), .85) 360deg);
}