/* ===========================================================================
   Raqamli Kimyo - Design tokens
   sytle.txt: Modern Scientific EdTech. Deep Blue/Indigo + Cyan + Violet.
   Bu yerdagi qiymatlar butun sayt bo'ylab yagona manba bo'lib xizmat qiladi.
   =========================================================================== */

:root {
  /* --- Brend: Deep Blue / Indigo ----------------------------------------- */
  --brand-50: #eef2ff;
  --brand-100: #e0e7ff;
  --brand-200: #c7d2fe;
  --brand-300: #a5b4fc;
  --brand-400: #818cf8;
  --brand-500: #6366f1;
  --brand-600: #4f46e5;
  --brand-700: #4338ca;
  --brand-800: #3730a3;
  --brand-900: #1e1b4b;

  /* --- Ikkilamchi: Cyan / Sky -------------------------------------------- */
  --cyan-50: #ecfeff;
  --cyan-100: #cffafe;
  --cyan-300: #67e8f9;
  --cyan-400: #22d3ee;
  --cyan-500: #06b6d4;
  --cyan-600: #0891b2;
  --cyan-700: #0e7490;

  /* --- Urg'u: Violet ------------------------------------------------------ */
  --violet-100: #ede9fe;
  --violet-400: #a78bfa;
  --violet-500: #8b5cf6;
  --violet-600: #7c3aed;

  /* --- Neytral: dark navy -> slate --------------------------------------- */
  --ink-900: #0f172a;
  --ink-800: #1e293b;
  --ink-700: #334155;
  --ink-600: #475569;
  --ink-500: #64748b;
  --ink-400: #94a3b8;
  --ink-300: #cbd5e1;
  --ink-200: #e2e8f0;
  --ink-100: #f1f5f9;

  /* --- Yuzalar ------------------------------------------------------------ */
  --bg: #f8fafc;
  --surface: #ffffff;
  --surface-2: #f1f5f9;
  --surface-3: #e8edf5;
  --border: #e2e8f0;
  --border-strong: #cbd5e1;

  /* --- Matn --------------------------------------------------------------- */
  --text: var(--ink-900);
  --text-muted: var(--ink-600);
  --text-subtle: var(--ink-500);
  --text-invert: #ffffff;

  /* --- Semantik ----------------------------------------------------------- */
  --success: #10b981;
  --success-bg: #ecfdf5;
  --success-border: #a7f3d0;
  --warning: #f59e0b;
  --warning-bg: #fffbeb;
  --warning-border: #fde68a;
  --danger: #ef4444;
  --danger-bg: #fef2f2;
  --danger-border: #fecaca;
  --info: var(--cyan-600);
  --info-bg: var(--cyan-50);

  /* --- Bo'lim ranglari (ma'ruza / amaliy / seminar) ----------------------- */
  --sec-lecture: var(--brand-600);
  --sec-lecture-bg: var(--brand-50);
  --sec-practice: var(--cyan-600);
  --sec-practice-bg: var(--cyan-50);
  --sec-seminar: var(--violet-600);
  --sec-seminar-bg: var(--violet-100);

  /* --- Tipografika -------------------------------------------------------- */
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  --font-display: "Manrope", var(--font-body);
  --font-mono: ui-monospace, "SF Mono", "Cascadia Mono", Menlo, Consolas, monospace;

  --fs-xs: 0.8125rem;   /* 13px */
  --fs-sm: 0.875rem;    /* 14px */
  --fs-base: 1rem;      /* 16px */
  --fs-md: 1.0625rem;   /* 17px - uzun matn uchun qulayroq */
  --fs-lg: 1.25rem;
  --fs-xl: 1.5rem;
  --fs-2xl: 1.875rem;
  --fs-3xl: 2.25rem;
  --fs-4xl: 2.75rem;
  --fs-5xl: 3.5rem;

  --lh-tight: 1.2;
  --lh-heading: 1.3;
  --lh-body: 1.75;      /* o'zbekcha uzun matnlar uchun */
  --lh-relaxed: 1.85;

  --tracking-tight: -0.02em;
  --tracking-wide: 0.04em;

  /* O'qish qulayligi: ma'ruza matni kengligi */
  --measure: 72ch;

  /* --- Masofa (4px bazasi) ------------------------------------------------ */
  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-5: 1.25rem;
  --s-6: 1.5rem;
  --s-8: 2rem;
  --s-10: 2.5rem;
  --s-12: 3rem;
  --s-16: 4rem;
  --s-20: 5rem;
  --s-24: 6rem;

  /* --- Radius ------------------------------------------------------------- */
  --radius-xs: 6px;
  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 999px;

  /* --- Soyalar (yumshoq, past kontrastli) --------------------------------- */
  --shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow: 0 4px 12px rgba(15, 23, 42, 0.06), 0 1px 3px rgba(15, 23, 42, 0.04);
  --shadow-md: 0 8px 24px rgba(15, 23, 42, 0.08), 0 2px 6px rgba(15, 23, 42, 0.04);
  --shadow-lg: 0 16px 40px rgba(15, 23, 42, 0.1), 0 4px 12px rgba(15, 23, 42, 0.05);
  --shadow-brand: 0 8px 24px rgba(79, 70, 229, 0.18);

  /* --- Animatsiya --------------------------------------------------------- */
  --dur-fast: 140ms;
  --dur: 220ms;
  --dur-slow: 380ms;
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);

  /* --- Tuzilma ------------------------------------------------------------ */
  --container: 1200px;
  --container-narrow: 820px;
  --container-wide: 1400px;
  --header-h: 72px;
  --header-h-compact: 58px;
  --sidebar-w: 268px;

  /* --- Z qatlamlar -------------------------------------------------------- */
  --z-header: 100;
  --z-dropdown: 200;
  --z-overlay: 300;
  --z-modal: 400;
  --z-toast: 500;
}