:root {
  /* Brand colors — Practical EduSkills palette, deliberately distinct from
     the official portal's blue/red government scheme while keeping enough
     visual familiarity for training purposes. */
  --itl-primary: #1a4fb4;
  --itl-primary-dark: #123a85;
  --itl-primary-light: #eaf1fd;
  --itl-accent: #f2a900;
  --itl-success: #1e9e5a;
  --itl-info-bg: #fff8e1;
  --itl-info-border: #f2c94c;
  --itl-note-bg: #eaf3ff;
  --itl-note-border: #a9c9f5;

  --itl-text: #1c1f26;
  --itl-text-muted: #5a6270;
  --itl-border: #e2e5ea;
  --itl-surface: #ffffff;
  --itl-surface-alt: #f6f8fb;

  --itl-radius-sm: 6px;
  --itl-radius-md: 12px;
  --itl-radius-lg: 18px;

  --itl-shadow-sm: 0 1px 3px rgba(16, 24, 40, 0.08);
  --itl-shadow-md: 0 4px 16px rgba(16, 24, 40, 0.10);
  --itl-shadow-lg: 0 12px 32px rgba(16, 24, 40, 0.14);

  --itl-space-1: 4px;
  --itl-space-2: 8px;
  --itl-space-3: 16px;
  --itl-space-4: 24px;
  --itl-space-5: 40px;
  --itl-space-6: 64px;
}

[data-theme="dark"] {
  --itl-text: #eef1f6;
  --itl-text-muted: #a8b0bd;
  --itl-border: #2a2f3a;
  --itl-surface: #12151c;
  --itl-surface-alt: #1a1f29;
  --itl-primary-light: #16233d;
  --itl-info-bg: #2a230f;
  --itl-note-bg: #10233f;
}