/* TASK_BELZ — design tokens, ported from the original taskcontrol design
   system (Navy Trust palette). Fonts self-hosted instead of Google Fonts
   CDN — same visual result, no external request. */

@font-face {
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/heebo-hebrew.woff2') format('woff2');
  unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
@font-face {
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/heebo-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  src: url('../fonts/rubik-hebrew.woff2') format('woff2');
  unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  src: url('../fonts/rubik-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Sora';
  font-style: normal;
  font-weight: 100 800;
  font-display: swap;
  src: url('../fonts/sora-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url('../fonts/manrope-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* === Navy Trust palette — ported 1:1 from the source design system === */
  --background: 214 30% 97%;
  --foreground: 224 45% 13%;

  --card: 0 0% 100%;
  --card-foreground: 224 45% 13%;

  --primary: 213 52% 25%;
  --primary-foreground: 0 0% 100%;
  --primary-hover: 213 55% 20%;
  --primary-muted: 213 45% 94%;

  --secondary: 214 28% 93%;
  --secondary-foreground: 224 45% 15%;

  --muted: 214 28% 94%;
  --muted-foreground: 215 18% 42%;

  --accent: 210 47% 43%;
  --accent-foreground: 0 0% 100%;

  --success: 158 62% 38%;
  --success-foreground: 0 0% 100%;
  --success-muted: 158 55% 93%;

  --warning: 35 92% 55%;
  --warning-foreground: 224 45% 13%;
  --warning-muted: 35 90% 94%;

  --destructive: 358 68% 52%;
  --destructive-foreground: 0 0% 100%;
  --destructive-muted: 358 65% 95%;

  --gold: 40 72% 50%;
  --gold-light: 40 82% 62%;

  /* Priority */
  --priority-urgent: 358 68% 52%;
  --priority-high: 24 92% 55%;
  --priority-medium: 35 92% 55%;
  --priority-low: 158 62% 38%;

  /* Status */
  --status-pending: 215 15% 50%;
  --status-in-progress: 213 52% 32%;
  --status-done: 158 62% 38%;
  --status-overdue: 358 68% 52%;

  --border: 214 25% 88%;
  --input: 214 25% 88%;
  --ring: 213 52% 32%;

  --radius: 0.625rem;
  --radius-s: 8px;
  --radius-m: 12px;
  --radius-l: 20px;

  /* Sidebar — deep navy, matches the source's dark sidebar over a light app */
  --sidebar-background: 224 60% 11%;
  --sidebar-foreground: 214 30% 88%;
  --sidebar-primary: 210 70% 68%;
  --sidebar-accent: 224 45% 17%;
  --sidebar-border: 224 45% 15%;
  --sidebar-muted: 215 20% 60%;

  --shadow-sm: 0 1px 2px 0 hsl(224 45% 15% / 0.05);
  --shadow-md: 0 2px 8px -2px hsl(224 45% 15% / 0.09), 0 1px 3px -1px hsl(224 45% 15% / 0.05);
  --shadow-lg: 0 10px 28px -6px hsl(224 45% 15% / 0.12), 0 3px 8px -2px hsl(224 45% 15% / 0.06);

  --font-heading: 'Sora', 'Heebo', system-ui, sans-serif;
  --font-body: 'Manrope', 'Rubik', system-ui, sans-serif;
}

/* Dark mode — toggled explicitly via the sidebar button (static/js/app.js),
   not prefers-color-scheme; remembered per-browser in localStorage.
   Every pair below was checked against WCAG contrast, not eyeballed:
   text pairs clear 4.5:1, large/UI pairs clear 3:1. The sidebar keeps its
   own deep-navy tokens unchanged in both modes — it was already dark. */
:root[data-theme="dark"] {
  color-scheme: dark;
  --background: 224 25% 9%;
  --foreground: 214 30% 92%;

  --card: 224 22% 13%;
  --card-foreground: 214 30% 92%;

  --primary: 213 70% 58%;
  --primary-foreground: 224 45% 10%;
  --primary-hover: 213 70% 52%;
  --primary-muted: 213 40% 20%;

  --secondary: 224 20% 16%;
  --secondary-foreground: 214 30% 90%;

  --muted: 224 18% 16%;
  --muted-foreground: 215 15% 64%;

  --accent: 210 55% 55%;
  --accent-foreground: 224 45% 10%;

  --success: 158 50% 52%;
  --success-foreground: 224 45% 10%;
  --success-muted: 158 35% 16%;

  --warning: 35 85% 58%;
  --warning-foreground: 224 45% 10%;
  --warning-muted: 35 40% 16%;

  --destructive: 358 70% 50%;
  --destructive-foreground: 0 0% 100%;
  --destructive-muted: 358 40% 16%;

  --gold: 40 75% 60%;
  --gold-light: 40 85% 70%;

  --priority-urgent: 358 70% 50%;
  --priority-high: 24 85% 55%;
  --priority-medium: 35 85% 58%;
  --priority-low: 158 50% 52%;

  --status-pending: 215 12% 55%;
  --status-in-progress: 213 60% 55%;
  --status-done: 158 50% 52%;
  --status-overdue: 358 70% 50%;

  --border: 224 18% 30%;
  --input: 224 18% 30%;
  --ring: 213 70% 58%;

  --shadow-sm: 0 1px 2px 0 hsl(0 0% 0% / 0.3);
  --shadow-md: 0 2px 8px -2px hsl(0 0% 0% / 0.4), 0 1px 3px -1px hsl(0 0% 0% / 0.3);
  --shadow-lg: 0 10px 28px -6px hsl(0 0% 0% / 0.5), 0 3px 8px -2px hsl(0 0% 0% / 0.3);
}

* { box-sizing: border-box; }

html {
  direction: rtl;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: var(--font-body);
  color: hsl(var(--foreground));
  background: hsl(var(--background));
  font-size: 15px;
  line-height: 1.55;
  letter-spacing: -0.005em;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 {
  font-family: var(--font-heading);
  font-weight: 700;
  letter-spacing: -0.02em;
  margin: 0 0 8px;
  color: hsl(var(--foreground));
}
h1 { font-size: 26px; line-height: 1.15; }
h2 { font-size: 20px; line-height: 1.2; }
h3 { font-size: 16px; line-height: 1.3; }
p { margin: 0 0 8px; }
a { color: hsl(var(--primary)); text-decoration: none; }
a:hover { text-decoration: underline; }

.container { max-width: 1400px; margin: 0 auto; padding: 0 20px; }

button, input, select, textarea { font-family: inherit; font-size: inherit; }

:focus-visible {
  outline: 2px solid hsl(var(--primary));
  outline-offset: 2px;
  border-radius: 4px;
}
:focus:not(:focus-visible) { outline: none; }