/* ============================================================
   n4n · COLOR TOKENS  — Zoho-inspired light theme
   Clean white surfaces on a soft gray canvas, a professional
   blue primary action, crisp per-app accent hues, and calm
   neutral text. Token NAMES are unchanged so every component
   and UI kit re-themes automatically.
   ============================================================ */
:root {
  /* ---- Base neutrals (light) ---- */
  --n-void:        #EBEEF3;   /* app rails / deepest chrome */
  --n-bg:          #F4F6FA;   /* app background */
  --n-bg-2:        #FFFFFF;   /* inputs / raised fields */
  --n-surface:     #ffffffb8; /* glass surface (used w/ blur) */
  --n-surface-1:   #FFFFFF;   /* solid card */
  --n-surface-2:   #F1F4F9;   /* hover */
  --n-surface-3:   #E7ECF3;   /* active / popover */

  /* ---- Hairlines & borders ---- */
  --n-line:         #E4E8EF;  /* default border */
  --n-line-2:       #D4DAE3;  /* stronger border */
  --n-line-glow:    #2f6fed40; /* accent-tinted hairline */

  /* ---- Text ---- */
  --n-text:         #1B2534;  /* primary — dark slate */
  --n-text-2:       #556072;  /* secondary / muted */
  --n-text-3:       #8A94A4;  /* tertiary / placeholder */
  --n-text-invert:  #FFFFFF;  /* text on dark chrome */

  /* ---- Signature accent: n4n blue (primary action) ---- */
  --n-accent:       #2F6FED;
  --n-accent-hi:    #4A83FF;  /* hover / lighter */
  --n-accent-lo:    #2258C9;  /* pressed / darker */
  --n-accent-dim:   #2f6fed14; /* ~8% wash */
  --n-accent-soft:  #2f6fed29; /* ~16% wash */
  --n-on-accent:    #FFFFFF;

  /* ---- Product spectrum (one hue per n4n app) ---- */
  --n-ai:     #0EA5A0;  /* n4n AI     — teal   */
  --n-mail:   #2F6FED;  /* n4n Mail   — blue   */
  --n-social: #E5487F;  /* n4n Social — pink   */
  --n-web:    #7A5AF8;  /* n4n Web    — violet */
  --n-cyan:   #0FA9DE;
  --n-amber:  #F5A623;

  /* ---- Semantic ---- */
  --n-success:  #12A150;
  --n-warning:  #F5A623;
  --n-danger:   #E5484D;
  --n-info:     #2F6FED;
  --n-success-dim: #12a15014;
  --n-warning-dim: #f5a62317;
  --n-danger-dim:  #e5484d14;
  --n-info-dim:    #2f6fed14;

  /* ---- Signature gradients ---- */
  --n-aurora:  linear-gradient(120deg, #2F6FED 0%, #0EA5A0 52%, #7A5AF8 100%); /* @kind other */
  --n-plasma:  linear-gradient(120deg, #E5487F 0%, #7A5AF8 100%); /* @kind other */
  --n-glass:   linear-gradient(180deg, #ffffffe6 0%, #ffffff99 100%); /* @kind other */

  /* ---- Semantic aliases (use these in components) ---- */
  --surface-page:    var(--n-bg);
  --surface-card:    var(--n-surface-1);
  --surface-raised:  var(--n-surface-2);
  --surface-pop:     var(--n-surface-3);
  --text-primary:    var(--n-text);
  --text-body:       var(--n-text-2);
  --text-muted:      var(--n-text-3);
  --border-default:  var(--n-line);
  --border-strong:   var(--n-line-2);
  --focus-ring:      var(--n-accent);
}