/* ============================================================
   Studienkolleg Vorbereitung — токены оформления
   ------------------------------------------------------------
   Фиолетовая шкала здесь ИДЕНТИЧНА шкале в тренажёре
   (trainer/frontend/assets/app.css). Меняете там — меняйте здесь.
   Это единственное место в проекте, где заданы цвета.

   Тема переключается атрибутом на <html>:
       <html data-theme="dark">   тёмная, под логотип
       <html data-theme="light">  светлая, как тренажёр
   ============================================================ */

:root{
  /* ---- Общая палитра (одна на сайт и тренажёр) ---- */
  --violet-50:#f6f2fc;
  --violet-100:#ece1f8;
  --violet-200:#d9c3f0;
  --violet-300:#c2a1e6;
  --violet-400:#a678e0;
  --violet-500:#8b4fd4;
  --violet-600:#7c3aed;
  --violet-700:#6b28d4;

  /* Свечение с логотипа — только для декоративных подсветок */
  --violet-glow:#cf7cee;

  /* Тёплые из медальона логотипа (флажок) */
  --gold:#d99a12;
  --amber:#e8a838;
  --amber-hi:#f6c45e;
  --clay:#d9552f;
  --clay-hi:#e86a44;

  /* ---- Геометрия и типографика (одинаково в обеих темах) ---- */
  --radius:14px;
  --radius-sm:10px;
  --radius-lg:22px;
  --radius-pill:999px;
  --maxw:1120px;
  --ease:cubic-bezier(.22,.61,.36,1);
  /* У Fraunces нет кириллицы (только латиница и вьетнамский).
     Русские заголовки неизбежно рисуются запасным шрифтом — он задан
     явно, чтобы это был осознанный выбор, а не то, что подвернулось. */
  --font-head:'Fraunces','PT Serif','Noto Serif',Georgia,'Times New Roman',serif;
  --font-body:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
}

/* ============================================================
   ТЁМНАЯ ТЕМА — фон и камень взяты пипеткой с логотипа
   ============================================================ */
html[data-theme="dark"]{
  --bg:#0c0b19;
  --bg-2:#100e1f;
  --panel:#161230;
  --panel-hi:#1e1840;
  --line:#2a2352;
  --line-soft:#1e1940;

  --ink:#efeaf8;
  --ink-soft:#bdb2d6;
  --ink-mute:#8578a8;

  /* На тёмном фоне текстовый фиолет должен быть светлым, иначе не читается */
  --accent:var(--violet-300);
  --accent-hi:var(--violet-200);
  --accent-fill:var(--violet-600);      /* заливка кнопок */
  --accent-fill-hi:var(--violet-500);
  --on-accent:#ffffff;
  --accent-wash:rgba(124,58,237,.16);   /* подложки иконок, бейджей */
  --accent-ring:rgba(124,58,237,.35);

  --warm:var(--amber);
  --warm-hi:var(--amber-hi);
  --warm-wash:rgba(232,168,56,.14);
  --warm-ink:var(--amber-hi);
  --accent-shadow:rgba(124,58,237,.55);

  --surface:var(--panel);
  --surface-hi:var(--panel-hi);
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 18px 40px rgba(0,0,0,.35);
  --shadow-sm:0 1px 2px rgba(0,0,0,.35);
  --glow:radial-gradient(1200px 520px at 50% -300px, rgba(207,124,238,.16), transparent 70%);
  --scrim:rgba(12,11,25,.82);
  --hairline:rgba(255,255,255,.06);
  --lightbox-bg:rgba(8,7,18,.93);
  color-scheme:dark;
}

/* ============================================================
   СВЕТЛАЯ ТЕМА — один в один фон и границы тренажёра
   ============================================================ */
html[data-theme="light"]{
  --bg:#faf8fd;
  --bg-2:#f4f0fb;
  --panel:#ffffff;
  --panel-hi:#ffffff;
  --line:#e9e1f4;
  --line-soft:#f0eaf9;

  --ink:#2c2338;
  --ink-soft:#5b5270;
  --ink-mute:#6f6683;

  --accent:var(--violet-600);
  --accent-hi:var(--violet-700);
  --accent-fill:var(--violet-600);
  --accent-fill-hi:var(--violet-700);
  --on-accent:#ffffff;
  --accent-wash:var(--violet-50);
  --accent-ring:rgba(124,58,237,.15);

  --warm:#b07a0c;                        /* янтарь на белом надо темнее — иначе контраст ниже нормы */
  --warm-hi:var(--gold);
  --warm-wash:#fdf4e0;
  --warm-ink:#8a5e06;
  --accent-shadow:rgba(124,58,237,.30);

  --surface:var(--panel);
  --surface-hi:var(--bg-2);
  --shadow:0 1px 2px rgba(44,35,56,.05), 0 10px 30px rgba(124,58,237,.07);
  --shadow-sm:0 1px 2px rgba(44,35,56,.06);
  --glow:radial-gradient(1100px 480px at 50% -280px, rgba(124,58,237,.10), transparent 70%);
  --scrim:rgba(250,248,253,.85);
  --hairline:rgba(44,35,56,.06);
  --lightbox-bg:rgba(30,24,44,.88);
  color-scheme:light;
}
