/* =============================================================================
   Токены оформления АДМИНИСТРАТОРСКОЙ панели.

   Тот же набор токенов, что в пользовательской части (поэтому core-файлы
   переносятся между ними без правок), но два отличия НАМЕРЕННЫ:

     1. Брендовый цвет — фиолетово-индиговый, а не индиго. Панель управления
        площадкой и рабочее приложение цеха не должны выглядеть одинаково:
        человек, у которого открыты обе вкладки, обязан различать их
        периферийным зрением, а не читая заголовок.
     2. Навигация ВСЕГДА тёмная, в любой теме (--nav-bg ниже). Тёмная боковая
        полоса — привычный признак служебной панели.

   Всё остальное — как в пользовательской части: цвет нигде больше не
   пишется числом, иначе тёмная тема разъезжается по разделам.
   ========================================================================== */

:root {
  /* --- Цвета бренда ------------------------------------------------------ */
  --acc:        #6b4fd8;
  --acc-hover:  #5a3fc7;
  --acc-soft:   #f1ecfd;
  --acc-text:   #4a2fa8;

  --prod:       #d97a1f;
  --prod-soft:  #fdf2e5;
  --prod-text:  #9a5310;

  --ok:         #17914f;
  --ok-soft:    #e8f7ee;
  --ok-text:    #0d6b39;

  --warn:       #b98105;
  --warn-soft:  #fdf6e3;
  --warn-text:  #855c02;

  --bad:        #d23f3f;
  --bad-soft:   #fdedec;
  --bad-text:   #a02a2a;

  --purple:     #7a53c9;
  --purple-soft:#f3eefc;
  --purple-text:#553a9e;
  --teal:       #0f8b84;
  --teal-soft:  #e6f6f5;
  --pink:       #c1408a;
  --pink-soft:  #fceef5;

  /* --- Поверхности -------------------------------------------------------- */
  --bg:         #f4f6fa;   /* фон страницы */
  --surface:    #ffffff;   /* карточки, таблицы */
  --surface-2:  #f8f9fc;   /* полосы таблиц, вложенные блоки */
  --surface-3:  #eef1f6;   /* шапки таблиц, неактивные вкладки */
  --overlay:    rgba(19, 24, 40, .46);

  /* --- Текст -------------------------------------------------------------- */
  --text:       #171c2b;
  --text-2:     #4d5670;
  --text-3:     #7b849c;
  --text-on-acc:#ffffff;

  /* --- Границы ------------------------------------------------------------ */
  --line:       #e2e6ee;
  --line-2:     #cfd5e2;
  --focus:      #6b4fd8;

  /* --- Тени -------------------------------------------------------------- */
  --shadow-1:   0 1px 2px rgba(23, 28, 43, .06);
  --shadow-2:   0 4px 16px rgba(23, 28, 43, .09);
  --shadow-3:   0 18px 48px rgba(23, 28, 43, .18);

  /* --- Размеры ----------------------------------------------------------- */
  --radius:     12px;
  --radius-sm:  8px;
  --radius-lg:  18px;
  --nav-w:      252px;
  --header-h:   58px;

  /* Навигация служебной панели — тёмная в любой теме. */
  --nav-bg:     #171a2b;
  --nav-line:   #262b42;
  --nav-text:   #c3c9de;
  --nav-text-2: #8a91ab;
  --nav-active: #2a2550;

  /* Кегль. Держим переменными: на сенсорном моноблоке в цеху и на телефоне
     мастера нужны разные размеры, и правится это в одном месте (см. base.css). */
  --fs-xs:      11.5px;
  --fs-sm:      12.5px;
  --fs:         13.5px;
  --fs-md:      15px;
  --fs-lg:      18px;
  --fs-xl:      23px;
  --fs-2xl:     30px;

  --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
          Arial, "Noto Sans", sans-serif;

  color-scheme: light;
}

/* Тёмная тема по настройке системы — только если человек не выбрал светлую. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --acc:        #a68bf7;
    --acc-hover:  #b6a0f9;
    --acc-soft:   #241e45;
    --acc-text:   #c3b0fb;

    --prod:       #eb9a45;
    --prod-soft:  #3a2a15;
    --prod-text:  #f0b374;

    --ok:         #3cc47c;
    --ok-soft:    #16321f;
    --ok-text:    #6ed69d;

    --warn:       #e4b02f;
    --warn-soft:  #332a10;
    --warn-text:  #eec55f;

    --bad:        #f0625f;
    --bad-soft:   #3a1c1c;
    --bad-text:   #f58a88;

    --purple:     #a98bea;
    --purple-soft:#291f42;
    --purple-text:#c9b4f5;
    --teal:       #38b3ab;
    --teal-soft:  #12312f;
    --pink:       #e070ac;
    --pink-soft:  #3a1c2c;

    --bg:         #0e1320;
    --surface:    #161c2c;
    --surface-2:  #1b2233;
    --surface-3:  #222a3d;
    --overlay:    rgba(4, 7, 14, .66);

    --text:       #e7ebf5;
    --text-2:     #a6b0c8;
    --text-3:     #737e99;
    --text-on-acc:#0e1320;

    --line:       #283044;
    --line-2:     #364059;
    --focus:      #a68bf7;

    --shadow-1:   0 1px 2px rgba(0, 0, 0, .4);
    --shadow-2:   0 4px 16px rgba(0, 0, 0, .45);
    --shadow-3:   0 18px 48px rgba(0, 0, 0, .6);

    color-scheme: dark;
  }
}

/* Явный выбор человека сильнее системы — в обе стороны. */
:root[data-theme="dark"] {
  --acc:        #a68bf7;
  --acc-hover:  #b6a0f9;
  --acc-soft:   #241e45;
  --acc-text:   #c3b0fb;

  --prod:       #eb9a45;
  --prod-soft:  #3a2a15;
  --prod-text:  #f0b374;

  --ok:         #3cc47c;
  --ok-soft:    #16321f;
  --ok-text:    #6ed69d;

  --warn:       #e4b02f;
  --warn-soft:  #332a10;
  --warn-text:  #eec55f;

  --bad:        #f0625f;
  --bad-soft:   #3a1c1c;
  --bad-text:   #f58a88;

  --purple:     #a98bea;
  --purple-soft:#291f42;
  --purple-text:#c9b4f5;
  --teal:       #38b3ab;
  --teal-soft:  #12312f;
  --pink:       #e070ac;
  --pink-soft:  #3a1c2c;

  --bg:         #0e1320;
  --surface:    #161c2c;
  --surface-2:  #1b2233;
  --surface-3:  #222a3d;
  --overlay:    rgba(4, 7, 14, .66);

  --text:       #e7ebf5;
  --text-2:     #a6b0c8;
  --text-3:     #737e99;
  --text-on-acc:#0e1320;

  --line:       #283044;
  --line-2:     #364059;
  --focus:      #a68bf7;

  --shadow-1:   0 1px 2px rgba(0, 0, 0, .4);
  --shadow-2:   0 4px 16px rgba(0, 0, 0, .45);
  --shadow-3:   0 18px 48px rgba(0, 0, 0, .6);

  color-scheme: dark;
}