/* ============================================================
   Vikram Dev University — Design Tokens
   Palette grounded in Koraput cultural sources:
     - Aal/madder red (Kotpad handloom, GI 2005)
     - Tussar off-white (raw-silk warp)
     - Ebony (Bonda hair-band, ground for tribal jewellery)
     - Eastern Ghats indigo (sky over Niyamgiri)
     - Turmeric / Dhokra brass (lost-wax bronze)
     - Niyamgiri forest green (accent)
   All foreground/background pairings tested at WCAG 2.1 AA (4.5:1
   for body text, 3:1 for large text and non-text contrast).
   ============================================================ */

:root {
  /* Brand palette */
  --kp-aal: #8B1E1E;            /* madder red — primary */
  --kp-aal-deep: #6B1414;       /* hover/active */
  --kp-aal-tint: #F4E5E5;       /* surface tint */
  --kp-ebony: #2A1A12;          /* body text on light */
  --kp-ebony-soft: #3D2A1F;     /* secondary text */
  --kp-indigo: #1E3A5F;         /* link, focus */
  --kp-indigo-deep: #142844;
  --kp-turmeric: #C8881C;       /* accent, headings on dark */
  --kp-turmeric-deep: #9A6612;
  --kp-tussar: #F4ECD8;         /* warm off-white background */
  --kp-tussar-soft: #FAF6EA;
  --kp-forest: #2E4A2B;         /* secondary accent */
  --kp-paper: #FFFFFF;
  --kp-rule: #D9CDB0;           /* divider on tussar */
  --kp-rule-strong: #A89876;

  /* Functional colours */
  --c-text: var(--kp-ebony);
  --c-text-muted: var(--kp-ebony-soft);
  --c-bg: var(--kp-paper);
  --c-bg-warm: var(--kp-tussar-soft);
  --c-bg-deep: var(--kp-tussar);
  --c-link: var(--kp-indigo);
  --c-link-visited: #4A2C6B;
  --c-link-hover: var(--kp-aal);
  --c-focus: var(--kp-turmeric);
  --c-rule: var(--kp-rule);
  --c-success: #2E4A2B;
  --c-warning: #8B5A1E;
  --c-danger: #8B1E1E;

  /* Typography stack
     English: Inter for UI, "Source Serif 4" for long-form (system serif fallback)
     Odia:    Noto Sans Oriya (loaded via @font-face when lang=or)
     Devanagari (Hindi): Noto Sans Devanagari */
  --ff-sans: "Inter", "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  --ff-serif: "Source Serif 4", "Source Serif Pro", "Lora", Georgia, "Times New Roman", serif;
  --ff-display: "Source Serif 4", Georgia, "Times New Roman", serif;
  --ff-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --ff-or: "Noto Sans Oriya", "Lohit Odia", "Kalinga", "Utkal", sans-serif;
  --ff-hi: "Noto Sans Devanagari", "Mangal", sans-serif;

  /* Type scale — modular, 1.250 perfect-fourth */
  --fs-50: 0.78rem;     /* 12.5px */
  --fs-100: 0.875rem;   /* 14px */
  --fs-200: 1rem;       /* 16px base */
  --fs-300: 1.125rem;   /* 18px */
  --fs-400: 1.25rem;    /* 20px */
  --fs-500: 1.5rem;     /* 24px */
  --fs-600: 1.875rem;   /* 30px */
  --fs-700: 2.25rem;    /* 36px */
  --fs-800: 3rem;       /* 48px */
  --fs-900: 3.75rem;    /* 60px */

  --lh-tight: 1.15;
  --lh-snug: 1.3;
  --lh-base: 1.55;
  --lh-loose: 1.75;

  /* Spacing — 4px baseline */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.25rem;
  --sp-6: 1.5rem;
  --sp-8: 2rem;
  --sp-10: 2.5rem;
  --sp-12: 3rem;
  --sp-16: 4rem;
  --sp-20: 5rem;
  --sp-24: 6rem;

  /* Layout */
  --content-max: 72rem;       /* 1152px */
  --content-prose: 38rem;     /* 608px — readable measure */
  --content-wide: 84rem;
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 8px;
  --radius-pill: 999px;

  /* Borders */
  --bw-1: 1px;
  --bw-2: 2px;
  --bw-3: 3px;

  /* Shadow — restrained, never glowy */
  --shadow-sm: 0 1px 2px rgba(42, 26, 18, 0.06);
  --shadow-md: 0 2px 6px rgba(42, 26, 18, 0.08), 0 1px 2px rgba(42, 26, 18, 0.05);
  --shadow-lg: 0 8px 24px rgba(42, 26, 18, 0.10);

  /* Motion */
  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
  --dur-100: 100ms;
  --dur-150: 150ms;
  --dur-300: 300ms;

  /* Focus ring — turmeric, never removed */
  --focus-ring: 0 0 0 3px var(--kp-turmeric), 0 0 0 5px var(--kp-ebony);

  /* Z-index */
  --z-skip: 100;
  --z-header: 50;
  --z-modal: 200;
  --z-toolbar: 150;
}

/* High-contrast mode (toggled by accessibility toolbar) */
[data-contrast="high"] {
  --c-text: #000000;
  --c-text-muted: #1A1A1A;
  --c-bg: #FFFFFF;
  --c-bg-warm: #FFFFFF;
  --c-bg-deep: #F0F0F0;
  --c-link: #000080;
  --c-link-visited: #4B0082;
  --c-link-hover: #B22222;
  --c-rule: #000000;
  --kp-aal: #800000;
  --kp-aal-tint: #FFE5E5;
  --kp-tussar: #FFFFFF;
  --kp-tussar-soft: #FFFFFF;
}

/* Dark mode (separate from high-contrast — for reading at night).
   Critical token-discipline rule: --kp-tussar is the FOREGROUND off-white
   used on dark/branded backgrounds (header text, nav text, footer, hero).
   It MUST stay light in dark mode.  Surfaces that were tussar-as-background
   in default mode flip via --c-bg-warm and explicit per-component overrides
   further down this file. */
[data-theme="dark"] {
  --c-text: #F4ECD8;
  --c-text-muted: #C8B89C;
  --c-bg: #14100A;
  --c-bg-warm: #221813;
  --c-bg-deep: #1A100A;
  --c-link: #E8C97C;
  --c-link-visited: #C8A0E0;
  --c-link-hover: #FFD89A;
  --c-rule: #4A3320;
  --kp-rule: #4A3320;
  --kp-rule-strong: #6A4A2E;

  /* Brand reds — lighten so they read as headings on dark backgrounds.
     Aim is approx 5:1 contrast against #14100A. */
  --kp-aal: #E07560;
  --kp-aal-deep: #C8553D;
  --kp-aal-tint: #3A1A14;

  /* Tussar is FOREGROUND text — keep light. */
  --kp-tussar: #F4ECD8;
  --kp-tussar-soft: #221813;   /* surface (dark) */
  --kp-paper: #FFFFFF;

  /* Turmeric — lighten for dark mode readability. */
  --kp-turmeric: #E8B25E;
  --kp-turmeric-deep: #C8881C;

  --kp-ebony: #0A0604;          /* deeper ebony for the gov-bar / footer */
  --kp-ebony-soft: #14100A;
  --kp-forest: #5C8A4F;
}

/* Dark-mode surface overrides — selectors that previously used --kp-tussar
   as a LIGHT background flip explicitly to dark surfaces here. */
[data-theme="dark"] th { background: #221813; color: var(--c-text); }
[data-theme="dark"] tbody tr:nth-child(even) { background: #1B130E; }
[data-theme="dark"] code { background: #221813; color: var(--kp-turmeric); }
[data-theme="dark"] pre { background: #221813; }
[data-theme="dark"] blockquote { background: #1B130E; }
[data-theme="dark"] hr { /* zigzag svg uses currentColor — render as bright aal */ color: var(--kp-aal); }

[data-theme="dark"] .card,
[data-theme="dark"] .leader-card,
[data-theme="dark"] .programme-card,
[data-theme="dark"] .college-list li,
[data-theme="dark"] .stat-tile { background: #1B130E; border-color: var(--c-rule); color: var(--c-text); }

[data-theme="dark"] .callout { background: #1B130E; color: var(--c-text); }
[data-theme="dark"] .callout--info { background: #122036; border-color: #3D6299; }
[data-theme="dark"] .callout--warning { background: #2A1F0A; border-color: var(--kp-turmeric); }
[data-theme="dark"] .callout--success { background: #14221A; border-color: var(--kp-forest); }

[data-theme="dark"] .pill-grid a { background: #221813; color: var(--c-text); border-color: var(--c-rule); }
[data-theme="dark"] .pill-grid a:hover,
[data-theme="dark"] .pill-grid a:focus-visible { background: var(--kp-aal); color: #1A100A; border-color: var(--kp-aal); }

[data-theme="dark"] .toc-box { background: #221813; border-color: var(--c-rule); }

[data-theme="dark"] .quick-strip { background: #1B130E; border-color: var(--c-rule); }
[data-theme="dark"] .quick-strip__list a { background: #221813; color: var(--c-text); border-color: var(--c-rule); }
[data-theme="dark"] .quick-strip__list svg { color: var(--kp-aal); }
[data-theme="dark"] .quick-strip__list a:hover,
[data-theme="dark"] .quick-strip__list a:focus-visible { background: var(--kp-aal); color: #1A100A; border-color: var(--kp-aal); }
[data-theme="dark"] .quick-strip__list a:hover svg,
[data-theme="dark"] .quick-strip__list a:focus-visible svg { color: #1A100A; }

[data-theme="dark"] .filter-bar { background: #1B130E; border-color: var(--c-rule); }

[data-theme="dark"] .search-suggest { background: #221813; border-color: var(--c-rule); }
[data-theme="dark"] .search-suggest__item { color: var(--c-text); border-bottom-color: var(--c-rule); }
[data-theme="dark"] .search-suggest__item:hover,
[data-theme="dark"] .search-suggest__item:focus-visible { background: #1A100A; color: var(--kp-aal); }
[data-theme="dark"] .search-suggest__url { color: var(--c-text-muted); }

[data-theme="dark"] .a11y-panel { background: #1B130E; border-color: var(--c-rule); color: var(--c-text); }
[data-theme="dark"] .a11y-panel__label { color: var(--c-text-muted); }
[data-theme="dark"] .a11y-btn { background: #221813; color: var(--c-text); border-color: var(--c-rule); }
[data-theme="dark"] .a11y-btn:hover { background: #2A1A12; border-color: var(--kp-rule-strong); }
[data-theme="dark"] .a11y-btn[aria-pressed="true"] { background: var(--kp-turmeric); color: #1A100A; border-color: var(--kp-turmeric); }

[data-theme="dark"] input,
[data-theme="dark"] textarea,
[data-theme="dark"] select { background: #1B130E; color: var(--c-text); border-color: var(--c-rule); }
[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder { color: var(--c-text-muted); }

[data-theme="dark"] .site-header { background: #14100A; border-bottom-color: var(--c-rule); }
[data-theme="dark"] .site-header__name--or,
[data-theme="dark"] .site-header__name--en { color: var(--kp-aal); }
[data-theme="dark"] .site-header__name--hi { color: var(--kp-aal-deep); }
[data-theme="dark"] .site-header__tagline { color: var(--c-text-muted); }

[data-theme="dark"] .site-search { background: #1B130E; border-color: var(--c-rule); }
[data-theme="dark"] .site-search input { background: transparent; }
[data-theme="dark"] .nav-toggle { background: transparent; color: var(--c-text); border-color: var(--c-rule); }

[data-theme="dark"] .breadcrumb { color: var(--c-text-muted); }
[data-theme="dark"] .breadcrumb a { color: var(--c-link); }
[data-theme="dark"] .breadcrumb [aria-current="page"] { color: var(--c-text); }

[data-theme="dark"] .last-updated { border-top-color: var(--c-rule); color: var(--c-text-muted); }

[data-theme="dark"] .page-hero { background: #1B130E; border-bottom-color: var(--kp-aal); color: var(--c-text); }
[data-theme="dark"] .page-hero h1 { color: var(--c-text); }

[data-theme="dark"] .doc-link__view { background: #221813; color: var(--c-text); border-color: var(--c-rule); }
[data-theme="dark"] .doc-link__view:hover,
[data-theme="dark"] .doc-link__view:focus-visible { background: #1B130E; color: var(--kp-aal); border-color: var(--kp-aal); }
[data-theme="dark"] .doc-link__download { color: var(--c-text-muted); border-color: var(--c-rule); }

[data-theme="dark"] .gov-bar { background: #0A0604; }
/* In dark mode the brand chrome strips do NOT take their colour from
   the dark-mode --kp-aal tokens (which are deliberately bright coral
   to read as link/foreground colours against ebony). For backgrounds
   the strips need to be MUTED — quiet, deep maroons that read as the
   brand colour at low brightness, not as glowing bands. */
[data-theme="dark"] .audience-bar { background: #2A0F0F; border-top-color: rgba(244, 236, 216, 0.10); }
[data-theme="dark"] a.audience-bar__link { border-right-color: rgba(244, 236, 216, 0.08); }
[data-theme="dark"] a.audience-bar__link:hover,
[data-theme="dark"] a.audience-bar__link:focus-visible { background: #3F1818; color: var(--kp-tussar); }
[data-theme="dark"] .primary-nav { background: #3A1414; }
[data-theme="dark"] .primary-nav__item > a:hover,
[data-theme="dark"] .primary-nav__item > a:focus-visible,
[data-theme="dark"] .primary-nav__item.is-active > a { background: #5A1E1E; border-bottom-color: var(--kp-turmeric); color: var(--kp-paper); }
[data-theme="dark"] .primary-nav__menu { background: #1B130E; border-color: var(--c-rule); border-top-color: var(--kp-turmeric); }
[data-theme="dark"] .primary-nav__menu a { color: var(--c-text); }
[data-theme="dark"] .primary-nav__menu a:hover,
[data-theme="dark"] .primary-nav__menu a:focus-visible { background: #221813; color: var(--kp-aal); }

/* Reduced motion — honour the OS preference and the toolbar override */
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-100: 0ms;
    --dur-150: 0ms;
    --dur-300: 0ms;
  }
}

[data-motion="reduced"] {
  --dur-100: 0ms;
  --dur-150: 0ms;
  --dur-300: 0ms;
}

/* Text-size override (toolbar A+/A/A-) — multiplies the base */
[data-text-size="large"] { font-size: 112.5%; }
[data-text-size="larger"] { font-size: 125%; }
[data-text-size="largest"] { font-size: 137.5%; }