/* Design tokens — Maalcards Financial. Light by default, dark via [data-theme="dark"]. */
:root {
  --color-primary: #0D9488;
  --color-primary-pressed: #0B7A6F;
  --color-primary-deep: #064E47;
  --color-primary-soft: #CCFBF1;
  --color-on-primary: #FFFFFF;
  --color-accent: #6649EB;
  --color-accent-soft: #EDE9FE;

  --color-app-bg: #F7F6F3;
  --color-app-panel: #FFFFFF;
  --color-app-border: #E8E7E2;
  --color-app-border-soft: #F0EFEA;
  --color-app-hover: #F3F2EE;

  --color-ink: #1F1E1B;
  --color-ink-deep: #0F0F0D;
  --color-slate: #6F6E69;
  --color-stone: #ACAAA3;
  --color-on-dark: #FFFFFF;

  --color-success: #2F855A;
  --color-success-soft: #DEF7E6;
  --color-warning: #C2731A;
  --color-warning-soft: #FDEFD8;
  --color-danger: #C53030;
  --color-danger-soft: #FDE2E2;
  --color-info: #2B6CB0;
  --color-info-soft: #DCEBFA;
  --color-muted-soft: #ECEBE7;

  --font-heading: "Cairo", "Tajawal", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "Tajawal", "Cairo", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px;
  --radius-sm: 6px; --radius-md: 10px; --radius-lg: 14px; --radius-full: 9999px;
  --shadow-1: 0 1px 2px rgba(15, 15, 13, 0.06);
  --shadow-2: 0 4px 14px rgba(15, 15, 13, 0.08);
  --shadow-3: 0 12px 32px rgba(15, 15, 13, 0.14);
  --sidebar-w: 252px;
  --topbar-h: 64px;
  color-scheme: light;
}

:root[data-theme="dark"] {
  --color-primary: #2DD4BF;
  --color-primary-pressed: #14B8A6;
  --color-primary-deep: #99F6E4;
  --color-primary-soft: #134E4A;
  --color-on-primary: #052E2B;
  --color-accent-soft: #2E1065;

  --color-app-bg: #121311;
  --color-app-panel: #1B1C19;
  --color-app-border: #2A2B27;
  --color-app-border-soft: #23241F;
  --color-app-hover: #23241F;

  --color-ink: #ECEAE4;
  --color-ink-deep: #FFFFFF;
  --color-slate: #A8A69F;
  --color-stone: #6F6E69;

  --color-success: #4ADE80; --color-success-soft: #14332A;
  --color-warning: #FBBF24; --color-warning-soft: #3A2A0E;
  --color-danger: #F87171;  --color-danger-soft: #3B1515;
  --color-info: #60A5FA;    --color-info-soft: #14243B;
  --color-muted-soft: #2A2B27;
  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-2: 0 4px 14px rgba(0, 0, 0, 0.5);
  --shadow-3: 0 12px 32px rgba(0, 0, 0, 0.6);
  color-scheme: dark;
}