/* ============================================================
   Lyntrix Admin — Design tokens
   Общие переменные (R-S1). Импортируется и web_auth, и admin.
   Светлая тема — :root. Тёмная — [data-theme="dark"].
   ============================================================ */

:root {
  /* Surfaces & neutrals */
  --bg:           #EAEEEC;
  --surface:      #FBFCFB;
  --raised:       #E4E9E6;
  --border:       #DBE2DF;
  --border-card:  #E2E8E5;

  /* Text */
  --t-strong:     #16221E;
  --t-body:       #42514B;
  --t-muted:      #7E8E88;

  /* Brand & accent */
  --brand:        #0E9E72;
  --brand-press:  #0B7E5B;
  --up:           #E03B33;
  --primary-fg:   #FFFFFF;

  /* Price / delta */
  --drop-fg:      #06754F;  --drop-bg:  #BFEFD4;  --drop-bd:  #97DBB7;
  --rise-fg:      #FFFFFF;  --rise-bg:  #E03B33;
  --min-fg:       #8A5A00;  --min-bg:   #FCE7AE;  --min-bd:   #F0D079;

  /* Secondary button */
  --btn2-bg:      #FBFCFB;  --btn2-bd:  #DBE2DF;  --btn2-fg:  #42514B;

  /* Danger (soft) */
  --danger-soft:  #FBE2E0;  --danger-bd: #F0A9A4;

  /* Nav active / tonal */
  --nav-active-bg: #E3F3EC;  --nav-active-fg: #0B7E5B;

  /* Sparkline track */
  --spark-track:  #EEF2F0;

  /* Marketplace dots */
  --ozon:         #005BFF;
  --wildberries:  #7B2FF7;
  --yandex:       #FC3F1D;

  /* Категориальная палитра графиков (6 слотов, фикс. порядок; проверена на
     CVD-разделение и контраст к --surface валидатором dataviz). */
  --cat-1: #1BAF7A;
  --cat-2: #EDA100;
  --cat-3: #2A78D6;
  --cat-4: #E34948;
  --cat-5: #4A3AA7;
  --cat-6: #1791BC;

  /* Effects */
  --btn-shadow:   0 6px 16px rgba(14,158,114,.30);
  --focus-ring:   0 0 0 3px rgba(14,158,114,.14);
  --shadow-card:  0 1px 3px rgba(20,40,32,.08);
  --shadow-popup: 0 16px 50px rgba(20,40,32,.18);

  /* Typography */
  --font:         'Manrope', system-ui, -apple-system, sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, monospace;

  /* Radii */
  --r-xs: 6px; --r-sm: 8px; --r-input: 10px; --r-field: 11px;
  --r-btn: 12px; --r-card: 14px; --r-panel: 16px; --r-pill: 999px;
}

[data-theme="dark"] {
  --bg:           #1E2429;
  --surface:      #272E33;
  --raised:       #323A40;
  --border:       #404A51;
  --border-card:  #404A51;

  --t-strong:     #F4F7F9;
  --t-body:       #CDD5DB;
  --t-muted:      #939EA6;

  --brand:        #2BD89F;
  --brand-press:  #2BD89F;
  --up:           #F2554D;
  --primary-fg:   #06281E;

  --drop-fg:      #3FE0AA;  --drop-bg:  rgba(63,224,170,.15);  --drop-bd:  rgba(63,224,170,.38);
  --rise-fg:      #FFFFFF;  --rise-bg:  #F2554D;
  --min-fg:       #F6CB5E;  --min-bg:   rgba(246,203,94,.15);  --min-bd:   rgba(246,203,94,.36);

  --btn2-bg:      #323A40;  --btn2-bd:  #485259;  --btn2-fg:  #CDD5DB;

  --danger-soft:  rgba(242,85,77,.13);  --danger-bd: rgba(242,85,77,.42);

  --nav-active-bg: rgba(43,216,159,.12);  --nav-active-fg: #2BD89F;

  --spark-track:  #323A40;

  --cat-1: #189567;
  --cat-2: #C68200;
  --cat-3: #4A8FE0;
  --cat-4: #E5544D;
  --cat-5: #8B7BE8;
  --cat-6: #2399BF;

  --btn-shadow:   none;
  --focus-ring:   0 0 0 3px rgba(43,216,159,.20);
  --shadow-card:  0 1px 3px rgba(0,0,0,.30);
  --shadow-popup: 0 16px 50px rgba(0,0,0,.50);
}

/* ============================================================
   Единый переключатель темы (toggle) — общий для всего проекта
   (admin, веб-вход; идентичен профилю Chrome-расширения).
   Состояние «ночь» — класс .on (ставится при data-theme="dark").
   ============================================================ */
.theme-switch {
  position: relative; display: inline-flex; align-items: center; flex: none;
  width: 52px; height: 30px; padding: 0; border: none; border-radius: 999px;
  background: #bcd7f5; /* день — голубое небо */
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.08);
  cursor: pointer; transition: background .18s ease, box-shadow .18s ease;
}
.theme-switch.on,
html[data-theme="dark"] .theme-switch { /* раннее «ночь»-состояние по теме — без мигания свитча */
  background: #1e293b; /* ночь — тёмное небо */
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12);
}
.theme-switch-thumb {
  position: absolute; left: 3px; display: inline-flex; align-items: center; justify-content: center;
  width: 24px; height: 24px; border-radius: 50%; background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.35); transition: transform .18s ease;
}
.theme-switch.on .theme-switch-thumb,
html[data-theme="dark"] .theme-switch .theme-switch-thumb { transform: translateX(22px); }
.theme-switch-icon {
  position: absolute; width: 15px; height: 15px; pointer-events: none; transition: opacity .18s ease;
}
.theme-switch-icon.icon-sun  { color: #ef7c0a; }
.theme-switch-icon.icon-moon { color: #475569; opacity: 0; }
.theme-switch.on .icon-sun,
html[data-theme="dark"] .theme-switch .icon-sun  { opacity: 0; }
.theme-switch.on .icon-moon,
html[data-theme="dark"] .theme-switch .icon-moon { opacity: 1; }
.theme-switch:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }