/* ============================================================
   PrintCRM — Dark theme (dark.css)
   Тёмная тема: только те случаи, где Bootstrap или утилита
   используют жёсткий hex и не читают токены.

   ОСНОВНАЯ работа с переменными Bootstrap (поверхности, таблицы,
   ссылки, прогресс, чекбоксы) живёт в tokens.css и components.css —
   там они привязаны к токенам темы. Здесь — исключения и добивка.
   Подключается ПОСЛЕДНИМ в base.html.
   ============================================================ */

/* Утилита .bg-white читает --bs-white-rgb (в тёмной теме это поверхность,
   см. tokens.css). Правило — страховка на случай смены токена. */
html[data-theme="dark"] .bg-white { background-color: var(--c-surface) !important; }
html[data-theme="dark"] .border { border-color: var(--c-border) !important; }

/* Тени Bootstrap в тёмной теме почти не работают */
html[data-theme="dark"] {
    --bs-box-shadow: none;
    --bs-box-shadow-sm: none;
    --bs-box-shadow-lg: none;
}

html[data-theme="dark"] .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }

/* Кнопки-утилиты со «светлыми» классами */
html[data-theme="dark"] .btn-light {
    --bs-btn-bg: var(--c-surface-2);
    --bs-btn-border-color: var(--c-border-strong);
    --bs-btn-color: var(--c-text);
    --bs-btn-hover-bg: var(--c-border);
    --bs-btn-hover-border-color: var(--c-border-strong);
    --bs-btn-hover-color: var(--c-text);
}

/* Заливки кнопок в тёмной теме пастельно-яркие, поэтому при наведении
   слегка затемняем ИХ ЖЕ, а не уходим в тёмный оттенок, подобранный
   для светлой темы (иначе кнопка «прыгает» из светлой в тёмную).
   Если color-mix не поддерживается — объявление просто отбросится
   и останутся значения из components.css. */
html[data-theme="dark"] .btn-primary {
    --bs-btn-hover-bg: color-mix(in srgb, var(--c-primary) 88%, var(--c-bg));
    --bs-btn-hover-border-color: color-mix(in srgb, var(--c-primary) 88%, var(--c-bg));
    --bs-btn-active-bg: color-mix(in srgb, var(--c-primary) 76%, var(--c-bg));
    --bs-btn-active-border-color: color-mix(in srgb, var(--c-primary) 76%, var(--c-bg));
}
html[data-theme="dark"] .btn-success {
    --bs-btn-hover-bg: color-mix(in srgb, var(--c-success) 88%, var(--c-bg));
    --bs-btn-hover-border-color: color-mix(in srgb, var(--c-success) 88%, var(--c-bg));
    --bs-btn-active-bg: color-mix(in srgb, var(--c-success) 76%, var(--c-bg));
    --bs-btn-active-border-color: color-mix(in srgb, var(--c-success) 76%, var(--c-bg));
}
html[data-theme="dark"] .btn-danger {
    --bs-btn-hover-bg: color-mix(in srgb, var(--c-danger) 88%, var(--c-bg));
    --bs-btn-hover-border-color: color-mix(in srgb, var(--c-danger) 88%, var(--c-bg));
    --bs-btn-active-bg: color-mix(in srgb, var(--c-danger) 76%, var(--c-bg));
    --bs-btn-active-border-color: color-mix(in srgb, var(--c-danger) 76%, var(--c-bg));
}
html[data-theme="dark"] .btn-warning {
    --bs-btn-hover-bg: color-mix(in srgb, var(--c-warning) 88%, var(--c-bg));
    --bs-btn-hover-border-color: color-mix(in srgb, var(--c-warning) 88%, var(--c-bg));
    --bs-btn-active-bg: color-mix(in srgb, var(--c-warning) 76%, var(--c-bg));
    --bs-btn-active-border-color: color-mix(in srgb, var(--c-warning) 76%, var(--c-bg));
}
html[data-theme="dark"] .btn-info {
    --bs-btn-hover-bg: color-mix(in srgb, var(--c-info) 88%, var(--c-bg));
    --bs-btn-hover-border-color: color-mix(in srgb, var(--c-info) 88%, var(--c-bg));
    --bs-btn-active-bg: color-mix(in srgb, var(--c-info) 76%, var(--c-bg));
    --bs-btn-active-border-color: color-mix(in srgb, var(--c-info) 76%, var(--c-bg));
}
html[data-theme="dark"] .btn-secondary {
    --bs-btn-hover-bg: color-mix(in srgb, var(--c-secondary) 88%, var(--c-bg));
    --bs-btn-hover-border-color: color-mix(in srgb, var(--c-secondary) 88%, var(--c-bg));
    --bs-btn-active-bg: color-mix(in srgb, var(--c-secondary) 76%, var(--c-bg));
    --bs-btn-active-border-color: color-mix(in srgb, var(--c-secondary) 76%, var(--c-bg));
}

/* Пузыри чата: свои — тёмный индиго (контраст на тёмном), текст — --c-on-accent */
html[data-theme="dark"] .chat-bubble--out { background-color: var(--c-primary-active) !important; }

/* Бейджи: мягкие приглушённые тона (светлее, чем фон) */
html[data-theme="dark"] .badge.bg-primary   { background-color: rgba(79, 70, 229, 0.22) !important; color: #c7d2fe; }
html[data-theme="dark"] .badge.bg-success   { background-color: rgba(22, 163, 74, 0.2) !important; color: #86efac; }
html[data-theme="dark"] .badge.bg-warning   { background-color: rgba(217, 119, 6, 0.2) !important; color: #fcd34d; }
html[data-theme="dark"] .badge.bg-danger    { background-color: rgba(220, 38, 38, 0.2) !important; color: #fca5a5; }
html[data-theme="dark"] .badge.bg-info      { background-color: rgba(2, 132, 199, 0.2) !important; color: #7dd3fc; }
html[data-theme="dark"] .badge.bg-secondary { background-color: rgba(107, 114, 128, 0.25) !important; color: #d1d5db; }
html[data-theme="dark"] .badge.bg-light     { background-color: var(--c-surface-2) !important; color: var(--c-text-muted); border: 1px solid var(--c-border); }

/* Алерты: приглушённые, на тёмной подложке */
html[data-theme="dark"] .alert-success { background-color: var(--c-success-soft); color: #86efac; border-color: rgba(74, 222, 128, 0.3); }
html[data-theme="dark"] .alert-danger  { background-color: var(--c-danger-soft);  color: #fca5a5; border-color: rgba(248, 113, 113, 0.3); }
html[data-theme="dark"] .alert-warning { background-color: var(--c-warning-soft); color: #fcd34d; border-color: rgba(251, 191, 36, 0.3); }
html[data-theme="dark"] .alert-info    { background-color: var(--c-info-soft);    color: #7dd3fc; border-color: rgba(56, 189, 248, 0.3); }

/* Чипы остатков быстрой продажи */
html[data-theme="dark"] .qs-stock-ok      { background: var(--c-success-soft); color: #86efac; }
html[data-theme="dark"] .qs-stock-low     { background: var(--c-warning-soft); color: #fcd34d; }
html[data-theme="dark"] .qs-stock-out     { background: var(--c-danger-soft);  color: #fca5a5; }
html[data-theme="dark"] .qs-stock-service { background: var(--c-info-soft);    color: #7dd3fc; }

/* Нейтральные иконки/текст светлее на тёмном фоне */
html[data-theme="dark"] .text-secondary { color: #94a3b8 !important; }