/* Единая цветовая палитра франшизы. ЕДИНСТВЕННЫЙ источник цветов для всех
   веб-интерфейсов: панель франчайзи (internal/franchisepanel), админ-панель
   (internal/admin) и брендированная страница подписки (internal/subproxy).
   Меняешь токен здесь — меняется во всех интерфейсах.

   Направление: «угольно-чёрный + оранжевый» — нейтральная почти-чёрная шкала
   без цветного подтона и ОДИН тёплый акцент. Зелёный/красный/янтарь держат
   смысл состояний (успех/ошибка/предупреждение) и акцентом не работают.

   Шкала намеренно нейтральная (H=0, S=0%): чистая светлота от 4% до 96%.
   Глубина строится ступенями поверхностей и рамками, а не тенями — на чёрном
   тени не читаются.

   Тема: ТЁМНАЯ ПО УМОЛЧАНИЮ — это художественное решение, а не следование за
   системой. Светлая включается только явным выбором пользователя:
     • нет data-theme        → тёмная;
     • data-theme="dark"     → тёмная;
     • data-theme="light"    → светлая.
   Кнопка-переключатель в каждом интерфейсе пишет выбор в localStorage и ставит
   data-theme; ранний инлайн-скрипт восстанавливает его до первой отрисовки. */

/* ─────────── ТЁМНАЯ ТЕМА — база ─────────── */
:root{
  /* Сырые HSL-каналы: держим отдельно, чтобы можно было брать цвет с любой
     прозрачностью — hsl(var(--h-acc) / .12) — без color-mix и без второго
     токена на каждый оттенок. Так же устроен shadcn, и это единственный
     способ дать «акцент 10%» одинаково во всех трёх интерфейсах. */
  --h-bg:0 0% 4%;      --h-card:0 0% 7%;    --h-soft:0 0% 10%;
  --h-line:0 0% 14%;   --h-txt:0 0% 96%;    --h-mut:0 0% 58%;
  --h-acc:22 95% 55%;  --h-ok:152 60% 48%;  --h-err:0 75% 60%;
  --h-warn:38 92% 58%; --h-blue:213 90% 62%;

  /* Поверхности: нейтральный уголь, шаг светлоты 3-4%. */
  --bg:hsl(var(--h-bg));       /* #0A0A0A — полотно                       */
  --card:hsl(var(--h-card));   /* #121212 — карточка                      */
  --soft:hsl(var(--h-soft));   /* #1A1A1A — вложенный блок, hover строки  */
  --soft-hi:hsl(0 0% 14%);     /* #242424 — активный hover, чипы          */
  --line:hsl(var(--h-line));   /* #242424 — рамка                          */
  --sidebar-bg:hsl(0 0% 5%);   /* #0D0D0D — сайдбар темнее полотна        */

  --txt:hsl(var(--h-txt));     /* #F5F5F5 */
  --mut:hsl(var(--h-mut));     /* #949494 — 6.5:1 на bg, 6.2:1 на card    */
  --dim:hsl(var(--h-mut));     /* исторически «ещё тише» — теперь равен   */
                               /* mut: ниже 58% контраст падает под AA.   */

  /* Акцент — оранжевый. Единственный «фирменный» цвет интерфейса.
     --on-acc — цвет текста/иконок ПОВЕРХ акцентной заливки: белый и на
     тёмной, и на светлой теме (акцент достаточно насыщен в обеих). */
  --acc:hsl(var(--h-acc));                 /* #FA6F1F */
  --acc-hi:hsl(22 95% 60%);                /* ховер/свечение */
  --acc-soft:hsl(var(--h-acc) / .12);      /* подложка бейджа, активный пункт меню */
  --acc-line:hsl(var(--h-acc) / .35);      /* рамка акцентного блока */
  --on-acc:hsl(0 0% 100%);

  /* Состояния. --err намеренно ОТДЕЛЁН от акцента: ошибка должна читаться
     как ошибка, а не как брендовая кнопка. */
  --ok:hsl(var(--h-ok));       --ok-soft:hsl(var(--h-ok) / .12);
  --err:hsl(var(--h-err));     --err-soft:hsl(var(--h-err) / .12);
  --amber:hsl(var(--h-warn));  --amber-soft:hsl(var(--h-warn) / .12);
  --blue:hsl(var(--h-blue));   --blue-soft:hsl(var(--h-blue) / .12);

  /* Производные поверхности. */
  --inp:hsl(0 0% 12%);
  --topbar:hsl(var(--h-bg) / .72);
  --sk1:hsl(0 0% 10%); --sk2:hsl(0 0% 15%);   /* скелетоны */

  /* Геометрия и тени — общий язык форм. */
  --radius:12px; --radius-lg:16px; --radius-sm:8px;
  --sidebar:248px;
  --sh-sm:0 1px 2px 0 hsl(0 0% 0% / .5);
  --sh-md:0 4px 16px -4px hsl(0 0% 0% / .6);
  --sh-lg:0 12px 40px -8px hsl(0 0% 0% / .7);
  --glow:radial-gradient(560px circle at 50% 0%, hsl(var(--h-acc) / .07), transparent 62%);
  --ease:cubic-bezier(.4,0,.2,1);
}

/* ─────────── СВЕТЛАЯ ТЕМА — только по явному выбору ─────────── */
/* Полотно тёплое (H=30): холодно-серый под оранжевым акцентом выглядит
   грязным, тёплый — собранным. Карточка при этом чисто-белая, поэтому
   иерархия «полотно → карточка» читается без рамок. */
:root[data-theme="light"]{
  --h-bg:30 20% 97%;   --h-card:0 0% 100%;  --h-soft:30 16% 94%;
  --h-line:30 12% 88%; --h-txt:0 0% 10%;    --h-mut:0 0% 40%;
  --h-acc:22 95% 52%;  --h-ok:152 60% 40%;  --h-err:0 75% 55%;
  --h-warn:38 92% 50%; --h-blue:213 90% 50%;

  --soft-hi:hsl(30 16% 90%);
  --sidebar-bg:hsl(30 20% 98%);
  --inp:hsl(0 0% 100%);
  --topbar:hsl(var(--h-bg) / .8);
  --sk1:hsl(30 16% 93%); --sk2:hsl(30 14% 87%);

  --acc-soft:hsl(var(--h-acc) / .10);
  --acc-line:hsl(var(--h-acc) / .30);

  --ok-soft:hsl(var(--h-ok) / .10);
  --err-soft:hsl(var(--h-err) / .10);
  --amber-soft:hsl(var(--h-warn) / .12);
  --blue-soft:hsl(var(--h-blue) / .10);

  --sh-sm:0 1px 2px 0 hsl(0 0% 0% / .04);
  --sh-md:0 4px 16px -4px hsl(0 0% 0% / .08);
  --sh-lg:0 12px 40px -8px hsl(0 0% 0% / .12);
  --glow:radial-gradient(600px circle at 50% 0%, hsl(var(--h-acc) / .06), transparent 60%);
}

/* ─────────── АЛИАСЫ СОВМЕСТИМОСТИ ─────────── */
/* Исторические имена, на которые завязан существующий CSS/JS во всех трёх
   интерфейсах. Держим алиасами, чтобы смена акцента не требовала правки сотен
   мест. --red здесь читается как «акцент», а не «красный»: настоящий красный
   для деструктивных действий и ошибок — это --err. */
:root{
  --red:var(--acc); --red-hi:var(--acc-hi); --red-soft:var(--acc-soft);
  --accent:var(--acc);
  --warn:var(--amber); --warn-soft:var(--amber-soft);
  --fg:var(--txt); --bd:var(--line);
}
