/**
 * Echo Distribution — Светлая тема.
 * Активируется классом html.theme-light. Розовый акцент (#D10060) сохраняется.
 * Идея: переопределяем CSS-переменные + захардкоженные тёмные поверхности
 * + самые частые утилиты Tailwind. Чёрный → белый, текст → тёмный.
 */
html.theme-light {
    --color-bg: #f4f4f6;
    --color-card: #ffffff;
    --color-card-hover: #f0f0f3;
    --color-border: rgba(0, 0, 0, 0.10);
    --color-border-hover: rgba(0, 0, 0, 0.18);
    --color-text: #15151a;
    --color-text-muted: #52525b;
    --color-text-dim: #6b6b76;
    --shadow-card: 0 4px 24px rgba(0, 0, 0, 0.10);
    --shadow-glow: 0 0 40px var(--color-accent-glow);
}

html.theme-light body {
    background-color: var(--color-bg);
    color: var(--color-text);
}

/* Скроллбар */
html.theme-light ::-webkit-scrollbar-track { background: #e9e9ee; }
html.theme-light ::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.18); }

/* Захардкоженные тёмные поверхности */
html.theme-light .sidebar { background: linear-gradient(180deg, #ffffff 0%, #f1f1f4 100%); }
html.theme-light .topbar { background: rgba(255, 255, 255, 0.85); }
html.theme-light .card-glass,
html.theme-light .glass,
html.theme-light .glass-card { background: rgba(255,255,255,0.75); border-color: rgba(0,0,0,0.08); }

/* Полупрозрачный белый (поверхности на тёмном) → полупрозрачный чёрный */
html.theme-light .nav-item:hover,
html.theme-light .user-card,
html.theme-light .btn-ghost,
html.theme-light .dropdown-item:hover,
html.theme-light .notification-item:hover { background: rgba(0, 0, 0, 0.04); }
html.theme-light .user-card:hover,
html.theme-light .btn-ghost:hover { background: rgba(0, 0, 0, 0.08); }
html.theme-light .btn-ghost { border-color: rgba(0, 0, 0, 0.10); color: var(--color-text-muted); }
html.theme-light .btn-secondary { background: rgba(0, 0, 0, 0.05); color: var(--color-text); }
html.theme-light .btn-secondary:hover { background: rgba(0, 0, 0, 0.10); }
html.theme-light .form-input,
html.theme-light .form-select,
html.theme-light textarea.form-input { background: rgba(0, 0, 0, 0.04); color: var(--color-text); }
html.theme-light .form-input::placeholder { color: #9ca3af; }
html.theme-light .table th { background: rgba(0, 0, 0, 0.03); }
html.theme-light .table tr:hover td { background: rgba(0, 0, 0, 0.03); }
html.theme-light .dropdown-menu { background: #ffffff; border: 1px solid rgba(0,0,0,0.10); box-shadow: 0 12px 40px rgba(0,0,0,0.15); }

/* Утилиты Tailwind: текст */
html.theme-light .text-white { color: #15151a !important; }
html.theme-light .text-zinc-200 { color: #27272a !important; }
html.theme-light .text-zinc-300 { color: #3f3f46 !important; }
html.theme-light .text-zinc-400 { color: #52525b !important; }
html.theme-light .placeholder-zinc-500::placeholder { color: #9ca3af; }

/* Утилиты Tailwind: фоны (белый-альфа → чёрный-альфа) */
html.theme-light .bg-white\/5,
html.theme-light .bg-white\/10,
html.theme-light .bg-white\/\[0\.02\],
html.theme-light .bg-white\/\[0\.03\],
html.theme-light .bg-white\/\[0\.04\],
html.theme-light .bg-white\/\[0\.05\],
html.theme-light .bg-white\/\[0\.06\] { background-color: rgba(0, 0, 0, 0.045) !important; }
html.theme-light .hover\:bg-white\/5:hover,
html.theme-light .hover\:bg-white\/10:hover,
html.theme-light .hover\:bg-white\/\[0\.04\]:hover { background-color: rgba(0, 0, 0, 0.07) !important; }

/* Утилиты Tailwind: границы */
html.theme-light .border-white\/5,
html.theme-light .border-white\/10,
html.theme-light .border-white\/\[0\.05\],
html.theme-light .border-white\/\[0\.06\],
html.theme-light .border-white\/\[0\.08\],
html.theme-light .border-white\/\[0\.1\] { border-color: rgba(0, 0, 0, 0.10) !important; }

/* Утилиты Tailwind: тёмные хексы → светлые */
html.theme-light .bg-\[\#0a0a0a\],
html.theme-light .bg-\[\#121212\],
html.theme-light .bg-\[\#1a1a2e\] { background-color: #ffffff !important; }
html.theme-light .bg-zinc-800,
html.theme-light .bg-zinc-900,
html.theme-light .bg-zinc-800\/50 { background-color: #ececef !important; }

/* ============================================================
   Переменные admin-enhanced.css (карточки, таблицы, формы,
   заголовки страниц, модалки, пагинация) — флипаем в светлые.
   ============================================================ */
html.theme-light {
    --bg-primary: #f4f4f6;
    --bg-secondary: #ffffff;
    --bg-tertiary: #f2f2f6;
    --bg-elevated: #ffffff;
    --text-primary: #15151a;
    --text-secondary: rgba(0, 0, 0, 0.72);
    --text-tertiary: rgba(0, 0, 0, 0.55);
    --border-subtle: rgba(0, 0, 0, 0.10);
    --border-medium: rgba(0, 0, 0, 0.14);
    --border-strong: rgba(0, 0, 0, 0.22);
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.06);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.08);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.12);
    --shadow-xl: 0 16px 64px rgba(0, 0, 0, 0.16);
}

/* Выпадающие option на светлом */
html.theme-light select option { background: #ffffff; color: #15151a; }

/* Иконки-кнопки в топбаре: ховер тёмный, а не белый (иначе исчезают) */
html.theme-light .btn.btn-ghost.btn-icon { color: #52525b !important; }
html.theme-light .btn.btn-ghost.btn-icon:hover { color: #15151a !important; }
html.theme-light .topbar .btn.btn-ghost.btn-icon:hover { color: #15151a; }

/* Алерты — читаемый тёмный текст на светлом */
html.theme-light .alert-success { color: #047857; }
html.theme-light .alert-error { color: #b91c1c; }
html.theme-light .alert-warning { color: #b45309; }
html.theme-light .alert-info { color: #1d4ed8; }

/* Рамка заголовка и фильтр-бара на светлом */
html.theme-light .page-header { border-color: rgba(0, 0, 0, 0.08); }
html.theme-light .filter-bar { border-color: rgba(0, 0, 0, 0.08); }

/* btn-secondary на светлом — чуть заметная заливка */
html.theme-light .btn-secondary { background: #f0f0f3; border-color: rgba(0,0,0,0.12); color: #15151a; }
html.theme-light .btn-secondary:hover { background: #e7e7ec; }

/* Поля ввода — рамка заметнее на белом */
html.theme-light .form-input,
html.theme-light .form-select,
html.theme-light .form-textarea { border-color: rgba(0,0,0,0.15); }

/* ============================================================
   Страница загрузки релиза (upload_release.php / upload.php):
   инлайн-классы и локальный <style> с тёмными цветами.
   ============================================================ */
html.theme-light .upload-section {
    background: #ffffff;
    border-color: rgba(0, 0, 0, 0.10);
}
html.theme-light .upload-section:hover { border-color: rgba(0, 0, 0, 0.18); }
html.theme-light .upload-section:focus-within { border-color: rgba(209, 0, 96, 0.4); }
html.theme-light .section-header { border-bottom-color: rgba(0, 0, 0, 0.08); }
html.theme-light .section-header h3 { color: #15151a; }
html.theme-light .section-header .section-hint { color: #71717a; }
html.theme-light .track-card {
    background: #fafafb;
    border-color: rgba(0, 0, 0, 0.10);
}
html.theme-light .track-card:hover {
    background: #f4f4f6;
    border-color: rgba(0, 0, 0, 0.18);
}
html.theme-light .file-hint { color: #71717a; }
html.theme-light .submit-section {
    background: rgba(255, 255, 255, 0.9);
    border-color: rgba(0, 0, 0, 0.10);
}

/* Дополнительные оттенки текста zinc */
html.theme-light .text-zinc-500 { color: #6b7280 !important; }
html.theme-light .text-zinc-600 { color: #52525b !important; }

/* Тёмные dropdown-фоны с суффиксом прозрачности */
html.theme-light .bg-zinc-900\/70,
html.theme-light .bg-zinc-900\/60,
html.theme-light .bg-zinc-900\/50,
html.theme-light .bg-zinc-800\/70,
html.theme-light .bg-zinc-800\/60 { background-color: #f4f4f6 !important; }

/* Зона drag&drop загрузки (public/upload.php) */
html.theme-light .upload-zone {
    border-color: rgba(0, 0, 0, 0.18);
    background: #fafafb;
}
html.theme-light .upload-zone:hover,
html.theme-light .upload-zone.dragover { border-color: #D10060; background: rgba(209, 0, 96, 0.05); }
html.theme-light .upload-zone.has-file { border-color: #D10060; background: rgba(209, 0, 96, 0.06); }

/* Кнопка добавления исполнителя: в тёмной теме она полупрозрачная,
   а на светлом фоне нужен более заметный контраст текста и заливки. */

/* Меню выбора ролей автора в форме загрузки релиза */
html.theme-light .author-role-menu summary {
    color: #27272a;
    background: #ffffff;
    border-color: rgba(0, 0, 0, 0.14);
}
html.theme-light .author-role-menu[open] summary {
    background: #ffffff;
    border-color: #ec4899;
    box-shadow: 0 0 0 3px rgba(190, 24, 93, 0.12);
}
html.theme-light .author-role-options {
    background: #ffffff;
    border-color: #3f3f46;
    box-shadow: none;
}
html.theme-light .author-role-option { color: #27272a; }
html.theme-light .author-role-option + .author-role-option { border-top-color: #e4e4e7; }
html.theme-light .author-role-option:hover { background: #f4f4f5; }
html.theme-light .author-role-option:has(input:checked) { color: #ffffff; background: #2563eb; }
html.theme-light .author-role-option:has(input:checked):hover { background: #1d4ed8; }
html.theme-light #uploadForm select.form-input {
    background-color: #ffffff;
    border-color: rgba(0, 0, 0, 0.15);
}
html.theme-light #uploadForm select.form-input:hover {
    background-color: #fff0f6;
    border-color: #ec4899;
}

/* Баннер подписки и прочий фиолетовый текст — затемняем для читаемости */
html.theme-light .text-purple-300 { color: #7c3aed !important; }
html.theme-light .text-purple-400 { color: #6d28d9 !important; }
html.theme-light .text-green-400 { color: #15803d !important; }
html.theme-light .text-blue-400 { color: #1d4ed8 !important; }
html.theme-light .text-red-400 { color: #dc2626 !important; }
html.theme-light .text-amber-400,
html.theme-light .text-yellow-400 { color: #b45309 !important; }

/* ============================================================
   Тарифы / Оформление подписки / Оплата релиза (локальные
   <style> с тёмными карточками rgba(18,18,18)).
   ============================================================ */
html.theme-light .pricing-card,
html.theme-light .subscribe-card,
html.theme-light .payment-card {
    background: #ffffff;
    border-color: rgba(0, 0, 0, 0.10);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
}
html.theme-light .pricing-card:hover { border-color: rgba(0, 0, 0, 0.18); }
html.theme-light .pricing-card.featured { border-color: rgba(209, 0, 96, 0.5); }
html.theme-light .pricing-features { border-top-color: rgba(0, 0, 0, 0.10); }
html.theme-light .pricing-feature { color: #3f3f46; }
html.theme-light .subscribe-features { background: #f4f4f6; }

/* Переключатель Разовая/Подписка */
html.theme-light .pricing-toggle { background: rgba(0, 0, 0, 0.05); }
html.theme-light .pricing-toggle-btn:not(.active) { color: #52525b; }
html.theme-light .pricing-toggle-btn:not(.active):hover { color: #15151a; background: rgba(0, 0, 0, 0.05); }

/* Вторичная кнопка тарифа («Оформить» неактивная) */
html.theme-light .pricing-btn-secondary { background: #f0f0f3; color: #15151a; border-color: rgba(0, 0, 0, 0.12); }
html.theme-light .pricing-btn-secondary:hover { background: #e7e7ec; }

/* Зачёркнутая старая цена */
html.theme-light .text-zinc-500.line-through,
html.theme-light .line-through { color: #9ca3af; }

/* Страница результата оплаты (subscription_success / payment_success) */
html.theme-light .result-card {
    background: #ffffff;
    border-color: rgba(0, 0, 0, 0.10);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
}
html.theme-light .sub-details { background: #f4f4f6; }
html.theme-light .sub-detail-row { border-bottom-color: rgba(0, 0, 0, 0.08); }

/* ============================================================
   Светлая тема: мягкие пастельные иконки стат-карточек
   (дашборд, аналитика). !important перебивает инлайн-градиенты.
   ============================================================ */
html.theme-light .stat-icon { box-shadow: none !important; }
/* Product metrics are not statuses: light theme shares the same quiet Echo
   icon treatment as dark theme instead of a row of unrelated colours. */
html.theme-light .stat-icon,
html.theme-light .stat-icon[class*="tone-"] {
    background: var(--accent-subtle) !important;
    border-color: var(--accent-border) !important;
}
html.theme-light .stat-icon :is(i, svg, .app-icon) { color: var(--accent-primary, var(--accent)) !important; }

/* Заглушка «Доступ ограничен» */
html.theme-light .access-denied-card {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.10) !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
}

/* Градиентные плашки-иконки (шапки страниц) → мягкие пастельные в светлой теме */
html.theme-light .icon-tile,
html.theme-light .icon-tile[class*="tone-"] {
    background: var(--accent-subtle) !important;
    border-color: var(--accent-border) !important;
}
html.theme-light .icon-tile :is(i, svg, .app-icon) { color: var(--accent-primary, var(--accent)) !important; }

/* Вкладки в карточке пользователя (admin/user_detail): активная/ховер
   были белыми (#fff) → невидимы на светлом. Делаем тёмными. */
html.theme-light .ud-tabs { border-bottom-color: rgba(0, 0, 0, 0.08); }
html.theme-light .ud-tab { color: #52525b; }
html.theme-light .ud-tab:hover { color: #15151a; }
html.theme-light .ud-tab.active { color: #15151a; border-bottom-color: #D10060; }

/* Светлые -300 оттенки текста в бейджах (остаток аванса/расхода и т.п.) — затемняем */
html.theme-light .text-amber-300   { color: #b45309 !important; }
html.theme-light .text-emerald-300 { color: #047857 !important; }
html.theme-light .text-emerald-400 { color: #047857 !important; }
html.theme-light .text-yellow-300  { color: #b45309 !important; }
html.theme-light .text-red-300     { color: #dc2626 !important; }
html.theme-light .text-blue-300    { color: #1d4ed8 !important; }

/* Активная плитка-фильтр (stat-card) использует ring-offset-[#0a0a0a] —
   в светлой теме это рисует чёрную обводку. Делаем зазор цветом фона. */
html.theme-light .ring-offset-\[\#0a0a0a\] { --tw-ring-offset-color: #f4f4f6 !important; }

/* Модалки/карточки с захардкоженным тёмным фоном (bg-dark-card / bg-dark-bg):
   в светлой теме делаем светлыми, иначе тёмные подписи не видны на тёмном фоне. */
html.theme-light .bg-dark-card { background-color: #ffffff !important; }
html.theme-light .bg-dark-bg { background-color: #f4f4f6 !important; }