/* ============================================================
   RUDRA SSC — Color tokens
   Institutional navy ink + saffron accent on warm paper.
   Base palette (raw) → semantic aliases at the bottom.
   ============================================================ */

:root {
  /* --- Warm paper neutrals --------------------------------- */
  --paper-0:   #ffffff;
  --paper-50:  #faf8f4;  /* page background */
  --paper-100: #f3efe7;
  --paper-150: #ece6da;
  --paper-200: #e3dccd;  /* hairline borders */
  --paper-300: #d2c8b6;
  --paper-400: #b7ab95;

  /* --- Ink (cool navy-grey text) --------------------------- */
  --ink-900: #0f1c2e;    /* primary text / near-black navy */
  --ink-800: #1b2a3e;
  --ink-700: #2c3d52;
  --ink-600: #45576d;
  --ink-500: #61728a;    /* secondary text */
  --ink-400: #8593a6;    /* muted text */
  --ink-300: #aab5c4;
  --ink-200: #cdd5df;

  /* --- Navy (primary brand) -------------------------------- */
  --navy-950: #081628;
  --navy-900: #0c2240;
  --navy-800: #11304f;
  --navy-700: #163c66;   /* brand primary */
  --navy-600: #1c4f86;
  --navy-500: #2563a8;   /* interactive blue */
  --navy-400: #3f81c9;
  --navy-300: #79a8de;
  --navy-200: #b6d0ee;
  --navy-100: #dde9f7;
  --navy-50:  #eef4fb;

  /* --- Saffron (accent / energy) --------------------------- */
  --saffron-800: #92520a;
  --saffron-700: #b4690a;
  --saffron-600: #d9830b;
  --saffron-500: #f59e0b;  /* accent */
  --saffron-400: #f9b53f;
  --saffron-300: #fbcb74;
  --saffron-200: #fce0a8;
  --saffron-100: #fdedcc;
  --saffron-50:  #fef7e8;

  /* --- Royal blue (from the RUDRA SSC logo) ---------------- */
  --royal-800: #01316b;
  --royal-700: #013f8a;
  --royal-600: #034fad;  /* the "R" + "SSC" blue */
  --royal-500: #0a59c2;
  --royal-400: #3f77d2;
  --royal-300: #6f9ee0;
  --royal-200: #a7c4ec;
  --royal-100: #d2e1f6;
  --royal-50:  #eaf1fb;

  /* Logo slate (the "Rudra" wordmark / mountain) */
  --slate-900: #1e2a38;
  --slate-800: #252f3e;

  /* --- Semantic hues --------------------------------------- */
  --green-700: #136844;
  --green-600: #178050;
  --green-500: #1f9a63;  /* correct */
  --green-100: #d9f0e3;
  --green-50:  #eaf7f0;

  --red-700: #a32e28;
  --red-600: #c23b33;
  --red-500: #d8463d;    /* wrong / danger */
  --red-100: #f7dcd9;
  --red-50:  #fcecea;

  --amber-600: #c47a05;
  --amber-500: #e2920a;  /* warning (distinct from saffron accent) */
  --amber-100: #fbe7bf;
  --amber-50:  #fdf4e0;

  /* ============================================================
     SEMANTIC ALIASES — reference these in components
     ============================================================ */

  /* Surfaces & backgrounds */
  --color-bg:            var(--paper-50);
  --color-bg-sunken:     var(--paper-100);
  --surface-card:        var(--paper-0);
  --surface-raised:      var(--paper-0);
  --surface-subtle:      var(--paper-100);
  --surface-inset:       var(--paper-150);
  --surface-inverse:     var(--navy-900);

  /* Text */
  --text-primary:    var(--ink-900);
  --text-secondary:  var(--ink-500);
  --text-muted:      var(--ink-400);
  --text-disabled:   var(--ink-300);
  --text-on-brand:   #ffffff;
  --text-on-accent:  var(--navy-950);
  --text-link:       var(--navy-600);

  /* Brand & interactive — royal blue from the logo, slate-navy for depth */
  --brand:           var(--royal-600);
  --brand-strong:    var(--slate-900);
  --brand-tint:      var(--royal-50);
  --interactive:     var(--royal-600);
  --interactive-hover: var(--royal-700);
  /* Saffron kept as a sparing warm accent for the single hero CTA + marked state */
  --accent:          var(--saffron-500);
  --accent-strong:   var(--saffron-600);
  --accent-tint:     var(--saffron-50);

  /* Borders & lines */
  --border-subtle:   var(--paper-200);
  --border-default:  var(--paper-300);
  --border-strong:   var(--ink-300);
  --border-brand:    var(--royal-200);
  --ring:            color-mix(in oklch, var(--royal-500) 45%, transparent);

  /* Semantic states */
  --success:        var(--green-500);
  --success-fg:     var(--green-700);
  --success-bg:     var(--green-50);
  --success-border: var(--green-100);

  --danger:         var(--red-500);
  --danger-fg:      var(--red-700);
  --danger-bg:      var(--red-50);
  --danger-border:  var(--red-100);

  --warning:        var(--amber-500);
  --warning-fg:     var(--amber-600);
  --warning-bg:     var(--amber-50);
  --warning-border: var(--amber-100);

  --info:           var(--royal-600);
  --info-fg:        var(--royal-700);
  --info-bg:        var(--royal-50);
  --info-border:    var(--royal-100);

  /* Test-flow specific (correct / wrong / unattempted / marked) */
  --answer-correct:     var(--green-500);
  --answer-correct-bg:  var(--green-50);
  --answer-wrong:       var(--red-500);
  --answer-wrong-bg:    var(--red-50);
  --answer-marked:      var(--saffron-500);
  --answer-marked-bg:   var(--saffron-50);
  --answer-skipped:     var(--ink-300);
  --answer-skipped-bg:  var(--paper-100);
}