/* ============================================================
   Nohena — Color System
   ------------------------------------------------------------
   A document-grade compliance palette.
   - Brand "Clearance Green": trust, customs clearance, trade,
     a measured nod to Nigerian identity.
   - Warm paper neutrals: the product is built on documents
     (invoices, declarations, PAARs) — surfaces read like
     premium official paper, not generic SaaS grey.
   - Signal triad maps to the product's core mechanic:
       cleared (green) · review (amber) · blocked (red)
     plus a calm informational blue.
   ============================================================ */

:root {
  /* ---- Brand green ramp (Clearance Green) ---- */
  --green-50:  #EAF4EF;
  --green-100: #CFE7DC;
  --green-200: #9FCFBA;
  --green-300: #66B493;
  --green-400: #2E9670;
  --green-500: #0E7A56;  /* interactive primary */
  --green-600: #0B6347;  /* brand deep / primary surface text */
  --green-700: #094E39;
  --green-800: #073A2B;
  --green-900: #06291F;  /* brand ink-green */

  /* ---- Amber (review / medium risk / caution) ---- */
  --amber-50:  #FBF2E0;
  --amber-100: #F6E1BB;
  --amber-200: #EFC97F;
  --amber-300: #E6A93F;
  --amber-500: #C9821A;  /* amber primary */
  --amber-600: #A66913;
  --amber-700: #80500E;

  /* ---- Red (blocked / high risk / error) ---- */
  --red-50:  #FBEBE8;
  --red-100: #F6D0CA;
  --red-200: #EBA89F;
  --red-300: #DD8275;
  --red-500: #C0392B;  /* red primary */
  --red-600: #9E2C20;
  --red-700: #7A2017;

  /* ---- Blue (information / neutral signal) ---- */
  --blue-50:  #E9F0FA;
  --blue-100: #CDDDF2;
  --blue-300: #7FA8E0;
  --blue-500: #2E6BD0;
  --blue-600: #1F539E;

  /* ---- Stone neutrals (warm paper → cool ink) ---- */
  --stone-0:   #FFFFFF;
  --paper:     #FBFAF6;  /* app background */
  --stone-50:  #F6F4EE;
  --stone-100: #EEEBE2;
  --stone-150: #E5E1D6;
  --stone-200: #D9D4C7;  /* default borders */
  --stone-300: #C3BCAB;
  --stone-400: #9C9684;  /* faint text / disabled */
  --stone-500: #756F60;  /* muted text */
  --stone-600: #565143;  /* secondary text */
  --ink-700:   #3A382F;
  --ink-800:   #26261F;
  --ink-900:   #161610;  /* primary text */

  /* ---- Dark "ink" brand surface (hero / footer / wordmark bg) ---- */
  --ink-bg:    #0A1A13;
  --ink-bg-2:  #0F2418;
  --ink-line:  #1E3528;
  --on-ink:    #F1EFE8;
  --on-ink-muted: #9FB0A6;

  /* ============================================================
     SEMANTIC ALIASES — prefer these in product UI
     ============================================================ */

  /* Surfaces */
  --bg-app:          var(--paper);
  --surface-card:    var(--stone-0);
  --surface-sunken:  var(--stone-50);
  --surface-raised:  var(--stone-0);
  --surface-hover:   var(--stone-50);
  --surface-brand:   var(--green-50);
  --surface-ink:     var(--ink-bg);

  /* Borders */
  --border-subtle:   var(--stone-150);
  --border-default:  var(--stone-200);
  --border-strong:   var(--stone-300);
  --border-brand:    var(--green-200);
  --border-focus:    var(--green-500);

  /* Text */
  --text-primary:    var(--ink-900);
  --text-secondary:  var(--stone-600);
  --text-muted:      var(--stone-500);
  --text-faint:      var(--stone-400);
  --text-inverse:    var(--stone-0);
  --text-on-ink:     var(--on-ink);
  --text-on-ink-muted: var(--on-ink-muted);
  --text-brand:      var(--green-600);
  --text-link:       var(--green-600);

  /* Brand / interactive */
  --brand:           var(--green-600);
  --brand-hover:     var(--green-700);
  --brand-active:    var(--green-800);
  --brand-soft:      var(--green-50);
  --brand-soft-border: var(--green-200);
  --accent:          var(--green-500);

  /* ---- Signal: the product's core mechanic ---- */
  --signal-cleared:        var(--green-500);
  --signal-cleared-text:   var(--green-700);
  --signal-cleared-surface:var(--green-50);
  --signal-cleared-border: var(--green-200);

  --signal-review:         var(--amber-500);
  --signal-review-text:    var(--amber-700);
  --signal-review-surface: var(--amber-50);
  --signal-review-border:  var(--amber-200);

  --signal-blocked:        var(--red-500);
  --signal-blocked-text:   var(--red-700);
  --signal-blocked-surface:var(--red-50);
  --signal-blocked-border: var(--red-200);

  --signal-info:           var(--blue-500);
  --signal-info-text:      var(--blue-600);
  --signal-info-surface:   var(--blue-50);
  --signal-info-border:    var(--blue-100);

  /* Focus ring */
  --ring: 0 0 0 3px color-mix(in srgb, var(--green-500) 32%, transparent);
}