/* ============================================================
   Tech Rim Standards — Color System
   Primary brand: TRS Crimson #BA1F39
   Built around a cool graphite neutral (the logo black) with a
   steel-blue precision secondary and a safety-amber industrial accent.
   ============================================================ */
:root {
  /* ---- TRS Crimson (primary) ---- */
  --crimson-50:  #fbeaee;
  --crimson-100: #f5ccd4;
  --crimson-200: #e89aa7;
  --crimson-300: #db687b;
  --crimson-400: #cd3a54;
  --crimson-500: #ba1f39;   /* BRAND PRIMARY */
  --crimson-600: #9d1730;
  --crimson-700: #7e1126;
  --crimson-800: #5d0c1b;
  --crimson-900: #3f0813;

  /* ---- Graphite (cool neutral / the brand black) ---- */
  --graphite-950: #0c0e11;
  --graphite-900: #14171c;
  --graphite-800: #1e232a;
  --graphite-700: #2c333c;
  --graphite-600: #3f4955;
  --graphite-500: #5a6675;
  --graphite-400: #7c8898;
  --graphite-300: #a3adba;
  --graphite-200: #c9d0d8;
  --graphite-100: #e4e8ec;
  --graphite-75:  #eef1f4;
  --graphite-50:  #f5f7f9;
  --white: #ffffff;

  /* ---- Steel Blue (secondary — precision / tech) ---- */
  --steel-50:  #e9f2f8;
  --steel-100: #c8e0ee;
  --steel-200: #97c3dd;
  --steel-300: #5ba1c8;
  --steel-400: #2c80ad;
  --steel-500: #1d6fa3;   /* SECONDARY */
  --steel-600: #155a86;
  --steel-700: #11486b;
  --steel-800: #0d384f;

  /* ---- Safety Amber (accent — industrial attention) ---- */
  --amber-50:  #fdf3e0;
  --amber-100: #fbe2b4;
  --amber-300: #f3bf5a;
  --amber-400: #edaa2e;
  --amber-500: #e8a31d;   /* ACCENT */
  --amber-600: #c5851a;
  --amber-700: #9a6612;

  /* ---- Functional greens (success) ---- */
  --green-100: #d3ede0;
  --green-500: #1f8a5b;
  --green-600: #176f49;

  /* =========================================================
     SEMANTIC ALIASES — reference these in components
     ========================================================= */
  /* surfaces */
  --color-bg:             var(--graphite-50);
  --color-surface:        var(--white);
  --color-surface-raised: var(--white);
  --color-surface-sunken: var(--graphite-75);
  --color-surface-inverse:var(--graphite-900);

  /* text */
  --text-strong:  var(--graphite-900);
  --text-body:    var(--graphite-700);
  --text-muted:   var(--graphite-500);
  --text-subtle:  var(--graphite-400);
  --text-inverse: var(--white);
  --text-on-brand:var(--white);

  /* borders & lines */
  --color-border:        var(--graphite-100);
  --color-border-strong: var(--graphite-200);
  --color-border-bold:   var(--graphite-700);
  --color-divider:       var(--graphite-75);

  /* brand */
  --brand:        var(--crimson-500);
  --brand-hover:  var(--crimson-600);
  --brand-active: var(--crimson-700);
  --brand-subtle: var(--crimson-50);
  --on-brand:     var(--white);

  --secondary:        var(--steel-500);
  --secondary-hover:  var(--steel-600);
  --secondary-subtle: var(--steel-50);

  --accent:        var(--amber-500);
  --accent-subtle: var(--amber-50);

  /* status */
  --status-success:        var(--green-500);
  --status-success-subtle: var(--green-100);
  --status-warning:        var(--amber-500);
  --status-warning-subtle: var(--amber-50);
  --status-danger:         var(--crimson-500);
  --status-danger-subtle:  var(--crimson-50);
  --status-info:           var(--steel-500);
  --status-info-subtle:    var(--steel-50);

  /* focus */
  --focus-ring: var(--steel-400);

  /* hazard stripe (industrial motif) */
  --hazard-stripe: repeating-linear-gradient(
      -45deg, var(--graphite-900) 0 14px,
      var(--amber-500) 14px 28px);
}
