/* ============================================================
   NIGHT + DAY — Colour System
   Three primaries carry the brand: Black (Night), White (Day),
   Silver (the bridge). Accent colour exists ONLY to express
   flavour — never to carry identity, never as a full background.
   ============================================================ */

:root {
  /* ---- PRIMARY ---------------------------------------------------- */
  --nd-black: #0B0B0C;        /* NIGHT — energy, culture        */
  --nd-white: #FBFAF7;        /* DAY — clarity, progress (warm) */
  --nd-pure-white: #FFFFFF;   /* true white, for product/screen */

  /* ---- SILVER — brushed aluminium, the connection ----------------- */
  --nd-silver-100: #ECEEF0;   /* highlight                       */
  --nd-silver-200: #E6E7EA;
  --nd-silver-300: #D1D4D9;
  --nd-silver-400: #C3C7CD;   /* base silver                     */
  --nd-silver-500: #AAAEB5;
  --nd-silver-600: #9DA1A7;
  --nd-silver-700: #717072;   /* shadow                          */
  /* Brushed-metal gradient — the lens, the +, the bridge */
  --nd-metal: linear-gradient(135deg,
      #ECEEF0 0%, #C3C7CD 24%, #E6E7EA 46%,
      #9DA1A7 64%, #C6C9CE 82%, #717072 100%); /* @kind color */
  --nd-metal-vert: linear-gradient(180deg,
      #E6E7EA 0%, #C3C7CD 35%, #9DA1A7 70%, #717072 100%); /* @kind color */

  /* ---- NEUTRAL GREYS (UI scaffolding) ----------------------------- */
  --nd-ink-900: #0B0B0C;
  --nd-ink-800: #1C1C19;
  --nd-ink-700: #242424;
  --nd-grey-600: #717072;
  --nd-grey-500: #8D8E8F;
  --nd-grey-400: #AAAEB5;
  --nd-grey-300: #D1D4D9;
  --nd-grey-200: #E6E7EA;
  --nd-grey-100: #F2F3F5;
  --nd-grey-50:  #FBFAF7;

  /* ---- ACCENT — FLAVOUR ONLY -------------------------------------- */
  /* Per the v2 identity system, every fruit is a two-stop gradient.
     Solid tokens use the dominant stop; *-light / *-deep give the ends. */
  /* Lemon + Lime */
  --nd-lemon:        #FEE74C;  --nd-lemon-deep:  #F8BA2F;
  --nd-lime:         #B2CD16;  --nd-lime-light:  #D5EB4D;
  /* Pineapple + Passionfruit */
  --nd-pineapple:      #FEE20C; --nd-pineapple-light: #FFEB65;
  --nd-passionfruit:   #B84342; --nd-passion-deep:    #7C164F;
  /* Orange + Mandarin */
  --nd-orange:       #F3A102;  --nd-orange-light: #FFBE2A;
  --nd-mandarin:     #FF7500;  --nd-mandarin-light: #FF9C00;

  /* Per-fruit gradients (exact, from the identity system) */
  --nd-grad-fruit-lemon:       linear-gradient(180deg, #FEE74C 0%, #F8BA2F 100%); /* @kind color */
  --nd-grad-fruit-lime:        linear-gradient(180deg, #D5EB4D 0%, #B2CD16 100%); /* @kind color */
  --nd-grad-fruit-pineapple:   linear-gradient(180deg, #FFEB65 0%, #FEE20C 100%); /* @kind color */
  --nd-grad-fruit-passionfruit:linear-gradient(180deg, #B84342 0%, #7C164F 100%); /* @kind color */
  --nd-grad-fruit-orange:      linear-gradient(180deg, #FFBE2A 0%, #F3A102 100%); /* @kind color */
  --nd-grad-fruit-mandarin:    linear-gradient(180deg, #FF9C00 0%, #FF7500 100%); /* @kind color */

  /* Flavour-pair gradients — the two fruits flowing into one another */
  --nd-grad-lemon-lime:   linear-gradient(180deg, #FEE74C 0%, #F8BA2F 38%, #D5EB4D 64%, #B2CD16 100%); /* @kind color */
  --nd-grad-pineapple:    linear-gradient(180deg, #FFEB65 0%, #FEE20C 34%, #B84342 76%, #7C164F 100%); /* @kind color */
  --nd-grad-orange:       linear-gradient(180deg, #FFBE2A 0%, #F3A102 46%, #FF9C00 74%, #FF7500 100%); /* @kind color */

  /* ---- SEMANTIC ALIASES ------------------------------------------- */
  --surface-day:        var(--nd-white);
  --surface-night:      var(--nd-black);
  --surface-card:       var(--nd-pure-white);
  --surface-muted:      var(--nd-grey-100);

  --text-primary:       var(--nd-black);
  --text-secondary:     var(--nd-grey-600);
  --text-muted:         var(--nd-grey-500);
  --text-on-night:      var(--nd-white);
  --text-on-night-dim:  var(--nd-grey-400);

  --border-hairline:    rgba(11, 11, 12, 0.12);
  --border-strong:      var(--nd-black);
  --border-on-night:    rgba(251, 250, 247, 0.18);

  --accent-bridge:      var(--nd-silver-400);

  /* Default flavour hook — overridden per flavour scope */
  --flavour-a:          var(--nd-lemon);
  --flavour-b:          var(--nd-lime);
  --flavour-gradient:   var(--nd-grad-lemon-lime);
}

/* ---- Flavour scopes — set [data-flavour] to recolour accents ------ */
[data-flavour="lemon-lime"] {
  --flavour-a: var(--nd-lemon);  --flavour-b: var(--nd-lime);
  --flavour-gradient: var(--nd-grad-lemon-lime);
}
[data-flavour="pineapple-passionfruit"] {
  --flavour-a: var(--nd-pineapple); --flavour-b: var(--nd-passionfruit);
  --flavour-gradient: var(--nd-grad-pineapple);
}
[data-flavour="orange-mandarin"] {
  --flavour-a: var(--nd-orange); --flavour-b: var(--nd-mandarin);
  --flavour-gradient: var(--nd-grad-orange);
}

/* ---- Night mode surface — invert the world ---------------------- */
[data-mode="night"] {
  --surface-card:   var(--nd-black);
  --text-primary:   var(--nd-white);
  --text-secondary: var(--nd-grey-400);
  --text-muted:     var(--nd-grey-500);
  --border-hairline: var(--border-on-night);
  --border-strong:  var(--nd-white);
}