/* Kök Finans color system — earth, parchment, coin, leaf.
   Base ramps first, semantic aliases after. */
:root{
  /* Bark — the primary brand ramp, pulled from the tree/root mark */
  --bark-900:#221811;
  --bark-800:#2E211A;
  --bark-700:#3F2D22;
  --bark-600:#5C4433;
  --bark-500:#7A5C42;
  --bark-400:#9C7E62;
  --bark-300:#BFA68B;
  --bark-200:#DCCBB6;
  --bark-100:#EDE1D0;

  /* Parchment — page and surface neutrals, warm not grey */
  --parchment-50:#FFFDF9;
  --parchment-100:#F9F4EB;
  --parchment-200:#F2EADC;
  --parchment-300:#E8DCC8;
  --parchment-400:#D8C8AE;

  /* Coin — the gold accent; the falling dinars in the mark */
  --coin-700:#8A6620;
  --coin-600:#A87C27;
  --coin-500:#C79A3C;
  --coin-400:#DCB65E;
  --coin-300:#EBD199;
  --coin-100:#F7EDD4;

  /* Leaf — growth / halal-affirmative green */
  --leaf-800:#1F4436;
  --leaf-700:#2F5D4A;
  --leaf-600:#3E7760;
  --leaf-500:#4E8A6E;
  --leaf-200:#C3DCD0;
  --leaf-100:#E4F0E9;

  /* Clay — caution / correction; never used decoratively */
  --clay-700:#8A3625;
  --clay-600:#A4442F;
  --clay-200:#EED4CC;
  --clay-100:#F8E8E3;

  /* Ink — pure text values */
  --ink-strong:#1B120C;

  /* ---- Semantic: text ---- */
  --text-strong:var(--ink-strong);
  --text-body:var(--bark-800);
  --text-muted:var(--bark-500);
  --text-subtle:var(--bark-400);
  --text-inverse:var(--parchment-100);
  --text-accent:var(--coin-700);
  --text-link:var(--leaf-700);
  --text-link-hover:var(--bark-800);

  /* ---- Semantic: surfaces ---- */
  --surface-page:var(--parchment-100);
  --surface-card:var(--parchment-50);
  --surface-sunken:var(--parchment-200);
  --surface-raised:#FFFFFF;
  --surface-inverse:var(--bark-800);
  --surface-inverse-alt:var(--bark-700);
  --surface-accent-soft:var(--coin-100);
  --surface-leaf-soft:var(--leaf-100);
  --surface-overlay:rgba(34,24,17,.62);

  /* ---- Semantic: borders ---- */
  --border-hairline:var(--parchment-300);
  --border-default:var(--bark-200);
  --border-strong:var(--bark-500);
  --border-inverse:rgba(247,237,212,.22);
  --border-focus:var(--coin-500);

  /* ---- Semantic: interactive ---- */
  --action-primary:var(--bark-800);
  --action-primary-hover:var(--bark-700);
  --action-primary-press:var(--bark-900);
  --action-accent:var(--coin-500);
  --action-accent-hover:var(--coin-600);
  --action-accent-press:var(--coin-700);
  --action-quiet-hover:var(--parchment-200);
  --action-disabled:var(--parchment-300);
  --action-disabled-text:var(--bark-300);

  /* ---- Semantic: status ---- */
  --status-positive:var(--leaf-700);
  --status-positive-soft:var(--leaf-100);
  --status-caution:var(--coin-600);
  --status-caution-soft:var(--coin-100);
  --status-critical:var(--clay-600);
  --status-critical-soft:var(--clay-100);

  /* ---- Category hues: the three content pillars ---- */
  --cat-finance:var(--coin-600);
  --cat-finance-soft:var(--coin-100);
  --cat-history:var(--bark-600);
  --cat-history-soft:var(--bark-100);
  --cat-law:var(--leaf-700);
  --cat-law-soft:var(--leaf-100);
}

/* Dark scope — used for the player shell, footers and full-bleed sections.
   Apply with class="kf-dark" on any container. */
.kf-dark{
  --text-strong:var(--parchment-50);
  --text-body:var(--parchment-200);
  --text-muted:var(--bark-300);
  --text-subtle:var(--bark-400);
  --text-accent:var(--coin-400);
  --text-link:var(--coin-400);
  --text-link-hover:var(--coin-300);
  --surface-page:var(--bark-900);
  --surface-card:var(--bark-800);
  --surface-sunken:var(--bark-900);
  --surface-raised:var(--bark-700);
  --surface-accent-soft:rgba(199,154,60,.16);
  --surface-leaf-soft:rgba(78,138,110,.18);
  --border-hairline:rgba(247,237,212,.12);
  --border-default:rgba(247,237,212,.2);
  --border-strong:var(--bark-400);
  --action-primary:var(--coin-500);
  --action-primary-hover:var(--coin-400);
  --action-primary-press:var(--coin-600);
  --action-quiet-hover:rgba(247,237,212,.08);
}