/* نادي الروّاد — Dashboard design tokens.
   Direction «المكتبة»: the public site's paper, ink and gold, set in Cairo. */
:root {
  /* Brand scale (from the live site) */
  --gold-200: #fdddaf;
  --gold-300: #fdd399;
  --gold-400: #f6c079;
  --gold-500: #e19947;
  --gold-600: #b8732e;
  --gold-700: #895324;
  --gold-800: #5f3a19;
  --ink-900: #252527;
  --ink-950: #161618;

  /* Surfaces — light (default) */
  --surface-page: #fdfbf7;
  --surface-side: #ffffff;
  --surface-raised: #ffffff;
  --surface-sunken: #f8f3ea;
  --surface-input: #ffffff;
  --surface-line: #ece5d8;
  --surface-chip: #f6efe2;
  --surface-highlight: #fdf4e6;
  --surface-overlay: rgb(22 22 24 / .45);

  /* Text */
  --text-strong: #252527;
  --text-muted: #5c5c66;
  --text-soft: #8a8580;
  --accent-text: var(--gold-700);
  --accent-fill: var(--gold-500);

  /* Actions: the site's buttons are ink; gold marks the active and the important */
  --primary: #252527;
  --on-primary: #ffffff;
  --primary-hover: #000000;

  /* Semantic */
  --success: #2d6a4f;
  --warning: #895324;
  --danger: #a03030;
  --info: #3d5a99;

  /* Charts */
  --chart-1: #b8732e;
  --chart-2: #3d5a99;
  --chart-3: #2f6f6a;
  --chart-prev: #b0a99d;
  --chart-area: rgb(225 153 71 / .16);
  --chart-grid: #efe8dc;

  /* Shadows */
  --shadow-sm: 0 1px 2px rgb(37 37 39 / .05);
  --shadow: 0 1px 2px rgb(37 37 39 / .04), 0 6px 20px rgb(37 37 39 / .05);
  --shadow-lg: 0 18px 50px rgb(95 58 25 / .16);
  --glow: 0 0 0 4px rgb(225 153 71 / .22);

  /* Layout */
  --sidebar-width: 280px;
  --topnav-height: 76px;
  --content-max: 1560px;
  --control-height: 46px;
  --radius-lg: 22px;
  --radius: 16px;
  --radius-sm: 12px;
  --radius-xs: 9px;
  --ease: cubic-bezier(.22, .8, .24, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --transition: all .22s var(--ease);

  /* Type — Cairo throughout, as in the house's other dashboards */
  --font-sans: 'Cairo', 'Segoe UI', Tahoma, system-ui, sans-serif;
  --font-display: 'Cairo', 'Segoe UI', Tahoma, system-ui, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, monospace;
  --fs-xs: 13px;
  --fs-sm: 14.5px;
  --fs-base: 16px;
  --fs-md: 17.5px;
  --fs-lg: 21px;
  --fs-xl: 32px;
  --fs-hero: 40px;
}

:root[data-theme="dark"] {
  --surface-page: #161618;
  --surface-side: #1b1b1e;
  --surface-raised: #1f1f22;
  --surface-sunken: #26262a;
  --surface-input: #1b1b1e;
  --surface-line: rgb(255 255 255 / .09);
  --surface-chip: #2c2720;
  --surface-highlight: #2a241b;
  --surface-overlay: rgb(0 0 0 / .6);

  --text-strong: #eeeef1;
  --text-muted: #a3a3ad;
  --text-soft: #7d7d86;
  --accent-text: var(--gold-300);

  --primary: #fdd399;
  --on-primary: #161618;
  --primary-hover: #fde4bf;

  --success: #4bbe8a;
  --warning: #f6c079;
  --danger: #e07070;
  --info: #93adf0;

  --chart-1: #f6c079;
  --chart-2: #93adf0;
  --chart-3: #6fd0c4;
  --chart-prev: #5c5c66;
  --chart-area: rgb(253 211 153 / .14);
  --chart-grid: rgb(255 255 255 / .07);

  --shadow-sm: 0 1px 2px rgb(0 0 0 / .3);
  --shadow: 0 1px 2px rgb(0 0 0 / .3), 0 8px 24px rgb(0 0 0 / .28);
  --shadow-lg: 0 18px 50px rgb(0 0 0 / .5);
  --glow: 0 0 0 4px rgb(253 211 153 / .18);
  color-scheme: dark;
}