/* ============================================================================
   Arish Publications — Brand Tokens
   ----------------------------------------------------------------------------
   Extracted from the official logo (pixel-sampled, 300x300, white + grey
   anti-alias filtered out):
       navy  #0C1C54  = 74.9% of logo pixels  -> PRIMARY
       gold  #CCA45C  = 10.4% of logo pixels  -> ACCENT
       white          = background

   Hierarchy (per brand spec):
       navy 50-60%  |  white 25-35%  |  light grey 5-10%  |  gold <= 5%

   Rules
     * Gold is an ACCENT, never a background or body-text colour.
     * Gold on white fails WCAG AA (2.6:1) -> use --gold-ink instead.
     * Flat surfaces only: no gradients, no drop-shadow elevation.
   ============================================================================ */

:root{
  /* ── Navy (primary) ─────────────────────────────────────────────────── */
  --navy-900:#081336;   /* darkest — footer, deep hover                  */
  --navy-800:#0C1C54;   /* LOGO NAVY — buttons, header, headings, links   */
  --navy-700:#14296F;   /* hover / light                                  */
  --navy-600:#1D3789;   /* focus ring, subtle emphasis                    */
  --navy-100:#E8ECF7;   /* navy wash — selected rows, chips               */
  --navy-050:#F4F6FC;   /* whisper tint                                   */

  /* ── Gold (accent, <=5%) ────────────────────────────────────────────── */
  --gold-600:#A8823A;   /* dark gold — gold text on WHITE (4.0:1)         */
  --gold-500:#CCA45C;   /* LOGO GOLD — accent on navy, badges, rules      */
  --gold-300:#E2C68E;   /* light gold — decorative lines, tints           */
  --gold-100:#F7F1E1;   /* gold wash — notice background                  */

  /* ── Neutrals ───────────────────────────────────────────────────────── */
  --white:#FFFFFF;
  --bg:#F7F8FA;         /* section / alternate background                 */
  --surface:#FFFFFF;    /* cards                                          */
  --border:#E5E7EB;     /* default border                                 */
  --border-strong:#D3D8E0;

  /* ── Text ───────────────────────────────────────────────────────────── */
  --text:#333333;       /* body copy                                      */
  --muted:#6B7280;      /* secondary text                                 */
  --sub:#9AA1AC;        /* tertiary / placeholder                         */

  /* ── Functional (kept minimal, never decorative) ────────────────────── */
  --ok:#1B7F5A;         /* success / in-stock                             */
  --ok-bg:#E9F6F0;
  --warn:#A8823A;       /* warning reuses dark gold                       */
  --warn-bg:#F7F1E1;
  --danger:#C0392B;     /* error / out-of-stock                           */
  --danger-bg:#FBECEA;
  --info:#0C1C54;       /* info reuses navy                               */
  --info-bg:#E8ECF7;

  /* ── Legacy aliases (inner pages still reference these names) ───────── */
  --brand:var(--navy-800);
  --brand2:var(--navy-700);
  --brand-dark:var(--navy-900);
  --brand-tint:var(--navy-100);
  --brand1:var(--navy-800);
  --brand2-alt:var(--navy-700);
  --brand3:var(--navy-900);
  --accent:var(--gold-500);
  --navy:var(--navy-800);
  --ink:var(--text);
  --line:var(--border);
  --input-border:var(--border);
  --card:var(--surface);
  --header-bg:var(--white);
  --footer-bg:var(--navy-900);

  /* ── Geometry ───────────────────────────────────────────────────────── */
  --radius:6px;
  --radius-lg:10px;
  --radius-pill:65px;

  /* Flat design: hairlines + surface shift instead of shadow elevation */
  --shadow:none;
  --shadow-hover:none;
  --ring:0 0 0 3px rgba(12,28,84,.14);
  --ring-gold:0 0 0 3px rgba(204,164,92,.28);
}