/* ============================================================
   COE Platform color system
   Ported from dediggibyte/coe_platform src/frontend/tailwind.config.js
   + components/ui.tsx badge tones. Light "oat" surfaces, Databricks
   navy text, signature Lava red brand accent.
   ============================================================ */

:root {
  /* ---- Databricks Lava ramp (brand) ---- */
  --brand-50: #FFF1EE;  --brand-100: #FFE0D9; --brand-200: #FFC7BB;
  --brand-300: #FFA694; --brand-400: #FF6E54; --brand-500: #FF4A30;
  --brand-600: #FF3621; --brand-700: #E62D1A; --brand-800: #BF2415;
  --brand-900: #991D11;

  /* ---- Databricks Navy / Oolite ---- */
  --navy: #1B3139; --navy-700: #23454F; --navy-800: #16282F; --navy-900: #101D22;

  /* ---- Warm "oat" neutrals ---- */
  --oat-50: #FAF8F4; --oat-100: #F7F5F2; --oat-200: #ECE6DC;
  --oat-300: #E0D8CB; --oat-400: #D9D0C2;

  /* ---- Teal accent (secondary) ---- */
  --teal: #1B5162; --teal-600: #2D6E7E; --teal-100: #EAF1F2;

  /* ---- Text ---- */
  --text-1: var(--navy);          /* headings + primary */
  --muted: #5A6B72;               /* body secondary */
  --muted-2: #7B8A90;             /* mono meta, dates */

  /* ---- Badge tones (ui.tsx Badge) ---- */
  --tone-green-bg: #E7F1E8;  --tone-green-tx: #1F7A3D;
  --tone-amber-bg: #FBEEDD;  --tone-amber-tx: #B45309;
  --tone-red-bg: #FCE6E2;    --tone-red-tx: #C2362B;
  --tone-blue-bg: #EAF1F2;   --tone-blue-tx: #1B5162;
  --tone-indigo-bg: #FFE0D9; --tone-indigo-tx: #E62D1A;
  --tone-violet-bg: #F2E7F3; --tone-violet-tx: #7A3B82;
  --tone-slate-bg: #ECE6DC;  --tone-slate-tx: #5A6B72;

  /* ---- Semantic aliases (light) ---- */
  --surface-page: var(--oat-100);
  --surface-card: #ffffff;
  --surface-well: var(--oat-50);
  --border: var(--oat-200);
  --border-soft: #F1ECE4;
  --border-strong: var(--oat-300);
  --accent: var(--brand-600);
  --accent-hover: var(--brand-700);
  --focus-ring: 0 0 0 2px #ffffff, 0 0 0 4px var(--brand-300);

  /* ---- Navy (dark alternate) surfaces ---- */
  --nv-page: var(--navy-900);
  --nv-card: var(--navy);
  --nv-well: var(--navy-800);
  --nv-line: rgba(255,255,255,0.10);
  --nv-line-2: rgba(255,255,255,0.20);
  --nv-text-1: #F4F1EC;
  --nv-text-2: rgba(244,241,236,0.72);
  --nv-text-3: rgba(244,241,236,0.48);
  /* status dots on navy */
  --nv-green: #4CC479; --nv-blue: #6AB9D8; --nv-violet: #C08BD0;
  --nv-amber: #E8A33D; --nv-slate: #AEB9C6; --nv-red: #F07B6E;
}