/* ============================================================
   PNS-Univ — COLOR TOKENS
   Source of truth: Charte Graphique du Gouvernement du Bénin.
   Only the six official roles + the national flag colors are
   permitted. Everything below derives from them.
   ============================================================ */
:root {
  /* ---- Official charter palette (the six mandated roles) ---- */
  --pns-blue-dark:   #1d477a;  /* Fond principal / headers          */
  --pns-blue-navy:   #1d475f;  /* Fond secondaire                   */
  --pns-teal:        #7db0b2;  /* Éléments UI / accents             */
  --pns-green:       #006828;  /* Succès / validation               */
  --pns-yellow:      #ffbe00;  /* Avertissement (toujours texte noir) */
  --pns-red:         #eb0000;  /* Erreur / danger                   */

  /* ---- Extended blue ramp (derived, for depth & surfaces) ---- */
  --blue-950: #0a1622;  /* deepest device/terminal background */
  --blue-900: #0b1f38;  /* hero / dark canvas                 */
  --blue-850: #0d2644;  /* USSD canvas                        */
  --blue-800: #102d44;  /* heading ink on light / dark panel  */
  --blue-700: #163a64;  /* hover state of primary             */
  --blue-600: #1d477a;  /* = --pns-blue-dark (primary)        */
  --blue-500: #2d5e96;
  --blue-400: #4a78ad;
  --blue-200: #9ec6c7;  /* teal-tinted light accent           */
  --blue-100: #dbe6f0;  /* light text on dark / soft fill     */

  /* ---- Teal ramp (accent) ---- */
  --teal-600: #5f9a9c;
  --teal-500: #7db0b2;  /* = --pns-teal */
  --teal-200: #9ec6c7;
  --teal-100: #cfe9ea;

  /* ---- Neutral / ink ramp ---- */
  --ink-900: #0a1722;
  --ink-800: #1a2533;  /* body text                  */
  --ink-700: #3a4a5c;
  --ink-600: #4a5d72;  /* secondary text             */
  --ink-500: #5b6b7d;  /* tertiary text              */
  --ink-400: #8795a6;  /* muted / placeholder        */
  --ink-300: #9aa7b5;
  --ink-200: #c3ccd6;

  /* ---- Surface / line ramp ---- */
  --surface-0:    #ffffff;  /* cards, sheets             */
  --surface-50:   #f7f9fb;  /* subtle fill               */
  --surface-100:  #f6f8fb;  /* section background        */
  --surface-150:  #eef2f7;  /* alt section               */
  --surface-200:  #eef1f5;  /* app canvas                */
  --surface-300:  #e8ebf0;  /* deeper canvas             */
  --line-100:     #eef1f5;  /* hairline on white         */
  --line-200:     #e3e8ee;  /* default border            */
  --line-300:     #d3dae2;  /* input border              */

  /* ---- Semantic status fills (tints) ---- */
  --success-fg:   #006828;
  --success-bg:   #e6f2ea;
  --success-line: #cfe6d8;
  --warning-fg:   #7a5a00;   /* legible amber ink on tint  */
  --warning-bg:   #fff3d1;
  --warning-line: #f3e2a8;
  --danger-fg:    #c40000;
  --danger-bg:    #fdf2f2;
  --danger-line:  #f3c4c4;
  --info-fg:      #1d477a;
  --info-bg:      #eef3f9;
  --info-line:    #dce8f3;

  /* ---- National flag (logo lockups, official banding only) ---- */
  --flag-green:  #008751;
  --flag-yellow: #fcd116;
  --flag-red:    #e8112d;

  /* ============================================================
     SEMANTIC ALIASES — reference these in product code.
     ============================================================ */
  --bg-app:           var(--surface-200);
  --bg-canvas-dark:   var(--blue-900);
  --bg-section:       var(--surface-100);
  --surface-card:     var(--surface-0);
  --surface-sunken:   var(--surface-50);

  --text-heading:     var(--blue-800);
  --text-body:        var(--ink-800);
  --text-secondary:   var(--ink-600);
  --text-muted:       var(--ink-400);
  --text-on-dark:     #ffffff;
  --text-on-dark-dim: var(--blue-100);

  --border-default:   var(--line-200);
  --border-input:     var(--line-300);
  --border-hairline:  var(--line-100);

  --brand-primary:        var(--pns-blue-dark);
  --brand-primary-hover:  var(--blue-700);
  --brand-accent:         var(--pns-teal);
  --eyebrow:              var(--pns-teal);

  --focus-ring:       var(--pns-blue-dark);
  --selection-bg:     var(--pns-teal);
  --selection-fg:     var(--ink-900);
}