/* ============================================================================
   ТЁМНАЯ ТЕМА (dark theme) — отдельный слой поверх styles_island.css
   Включается атрибутом html[data-theme="dark"] (тему выставляет head.php по
   выбору пользователя из профиля / БД; см. также cabinet.php).
   Принцип как в Telegram/GitHub: тёмные «острова» на глубоком фоне, тёплый
   оранжевый акцент сохранён. Светлая база не меняется — здесь сначала
   переопределяются токены, затем точечно правятся цвета, заданные жёстко
   (белые поверхности и слишком тёмный текст).
   ============================================================================ */
html[data-theme="dark"]{
  --bg:#0e1621;          /* фон страницы — глубокий сине-серый */
  --island:#18212c;      /* поверхность карточки-острова */
  --ink:#e6ecf3;         /* основной текст */
  --muted:#8b97a7;       /* вторичный текст */
  --line:#26313d;        /* границы, разделители */
  --ph:#212c38;          /* плейсхолдер-блоки */
  --ph2:#1b2530;         /* лёгкая заливка / чередование строк */
  --accent:#ef9a3d;      /* тёплый оранжевый акцент (ярче для тёмного фона) */
  --accent-dark:#f4ad5e; /* «тёмный» акцент светлее — для ссылок и hover на тёмном */
  --accent-soft:rgba(239,154,61,.16);
  --green:#3fb27f;
  --green-soft:rgba(63,178,127,.16);
  --red:#e0685a;
  --red-dark:#c85446;
  --red-soft:rgba(224,104,90,.16);
  --blue:#5b8fe0;
  --blue-soft:rgba(91,143,224,.16);
  --menubar:#141d27;

  --shadow:0 8px 24px rgba(0,0,0,.5), 0 1px 3px rgba(0,0,0,.4);
  --shadow-sm:0 2px 6px rgba(0,0,0,.45);

  /* Доп. токены только для тёмной темы */
  --control:#243040;      /* поверхности контролов (табы, пилюли, чекбоксы) */
  --control-line:#37434f; /* границы контролов */
  --thead:#222d39;        /* шапки таблиц */
  --accent-ink:#f4ad5e;   /* читаемый текст на accent-soft */
  --green-ink:#5ccb90;
  --red-ink:#ef897c;
  --blue-ink:#7fa8ea;

  color-scheme:dark;      /* нативные контролы (скроллбар, date-picker) — тёмные */
}

/* --- Базовый текст / заголовки --- */
html[data-theme="dark"] h1{color:#aeb8c6}

html[data-theme="dark"] .text-success{color:var(--green-ink)}
html[data-theme="dark"] .text-error{color:var(--red-ink)}

/* --- Навигация --- */
html[data-theme="dark"] .nav-hamburger{background:var(--control);border-color:var(--control-line)}
html[data-theme="dark"] .nav-hamburger span{background:var(--muted)}
html[data-theme="dark"] .nav-links a{color:#aab4c2}
html[data-theme="dark"] .nav-group a:hover,
html[data-theme="dark"] .nav-group a.active{background:rgba(255,255,255,.08)}

/* --- Кнопки / контролы, у которых поверхность была белой --- */
html[data-theme="dark"] button:disabled,
html[data-theme="dark"] .btn:disabled{background:#2c3846;color:#6b7484}
html[data-theme="dark"] .btn-ghost,
html[data-theme="dark"] button.ghost{border-color:var(--control-line)}
html[data-theme="dark"] .btn-ghost:hover,
html[data-theme="dark"] button.ghost:hover{background:var(--control);border-color:#47535f}

html[data-theme="dark"] input[type="checkbox"],
html[data-theme="dark"] .admin-check{background:var(--control);border-color:var(--control-line)}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder{color:#69737f}
html[data-theme="dark"] .switch .slider{background:#3a4655}

/* --- Чипы / бейджи: текст на «мягких» цветных фонах --- */
html[data-theme="dark"] .chip.gray,
html[data-theme="dark"] .chip.draw{color:#aab4c2}
html[data-theme="dark"] .chip.need,
html[data-theme="dark"] .chip.accent{color:var(--accent-ink)}
html[data-theme="dark"] .chip.done,
html[data-theme="dark"] .chip.win{color:var(--green-ink)}
html[data-theme="dark"] .chip.live{color:var(--blue-ink)}
html[data-theme="dark"] .chip.loss{color:var(--red-ink)}
html[data-theme="dark"] .chip.role-player{color:var(--blue-ink)}
html[data-theme="dark"] .chip.role-capitan{background:rgba(240,200,60,.16);color:#e7c65a}
html[data-theme="dark"] .chip.role-admin{color:var(--red-ink)}

/* --- Вкладки и групповые пилюли (были на белом фоне) --- */
html[data-theme="dark"] .tab-button,
html[data-theme="dark"] .tab-button:hover,
html[data-theme="dark"] .group-tab-button{background:var(--island)}
html[data-theme="dark"] .tab-button.active,
html[data-theme="dark"] .group-tab-button.active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-ink)}

/* --- Кнопки-пилюли прогноза (1/X/2 …) --- */
html[data-theme="dark"] .pick i{background:var(--control);border-color:var(--control-line);color:var(--muted)}
html[data-theme="dark"] .pick i:hover{border-color:#47535f;color:var(--ink)}
html[data-theme="dark"] .pick i.disabled{background:var(--ph2)}
html[data-theme="dark"] .pick i.disabled:hover{border-color:var(--control-line);color:var(--muted)}

/* --- Таблицы: шапки и слишком тёмный текст тела --- */
html[data-theme="dark"] .table_rezult thead th,
html[data-theme="dark"] .table_compare_results th,
html[data-theme="dark"] .calend-table thead th{background:var(--thead);color:#dbe3ec}
html[data-theme="dark"] .table_rezult tbody td{color:#9aa6b6}
html[data-theme="dark"] .table_rezult tbody tr.me-row td:nth-child(2){color:var(--accent-ink)}
html[data-theme="dark"] .cell{color:#9aa6b6}
html[data-theme="dark"] .calend-score-pill--tbd{color:#9aa6b6}
html[data-theme="dark"] .calend-deadline--live{color:var(--accent-ink)}
html[data-theme="dark"] #registerSuccessMessage:not(.hidden){color:var(--green-ink)}

/* --- Сетка плей-офф --- */
html[data-theme="dark"] .pb-stage-title.pb-stage-live{color:var(--accent-ink)}
html[data-theme="dark"] .pb-player-winner .pb-player-name{color:var(--green-ink)}

/* --- Боковое меню блоков (капитан) --- */
html[data-theme="dark"] .side-item{background:var(--control);color:#aab4c2}
html[data-theme="dark"] .side-item:hover{color:var(--ink)}
html[data-theme="dark"] .side-item.on{background:#2f3c4a;border-color:#47535f;color:var(--ink)}

/* --- Вложенные блоки и прочие светлые поверхности --- */
html[data-theme="dark"] .block .block,
html[data-theme="dark"] .playoff-stage-block{background:var(--ph2);border-color:var(--line)}
html[data-theme="dark"] .block hr{border-top-color:var(--line)}
html[data-theme="dark"] .block form>label{color:#95a1b1}
html[data-theme="dark"] .playoff-stage-block input,
html[data-theme="dark"] #playoff_settings_container input{background:var(--island)}
html[data-theme="dark"] #playoff_settings_container{background:rgba(239,183,61,.1)}
html[data-theme="dark"] .match-icon-btn--cancel{background:var(--control);color:#aab4c2}
html[data-theme="dark"] #sortable-criteria li:hover{background:#222d39}
html[data-theme="dark"] #sortable-criteria li::before{color:#5c6673}
html[data-theme="dark"] .roster-select-all,
html[data-theme="dark"] .roster-deselect-all{border-color:var(--control-line)}
html[data-theme="dark"] .roster-select-all:hover,
html[data-theme="dark"] .roster-deselect-all:hover{background:var(--control);border-color:#47535f}
html[data-theme="dark"] .island.dashed,
html[data-theme="dark"] .pair-compare-grid .island.dashed{border-color:#3a4655}

/* --- Подписи-лейблы форм (были тёмно-серыми) --- */
html[data-theme="dark"] .filter-form label,
html[data-theme="dark"] .calend-selector label,
html[data-theme="dark"] .results-selectors .fld label,
html[data-theme="dark"] .delete-form-section label,
html[data-theme="dark"] .block .fld>label,
html[data-theme="dark"] .playoff-stage-field label{color:#909cac}

/* --- «Опасные» зоны (были светло-розовыми) --- */
html[data-theme="dark"] .admin-danger-island,
html[data-theme="dark"] .block--danger{background:rgba(224,104,90,.08);border-color:rgba(224,104,90,.35)}
html[data-theme="dark"] .admin-danger-island .island-title,
html[data-theme="dark"] .block--danger>h2{color:var(--red-ink)}
html[data-theme="dark"] .block--danger>h2{border-bottom-color:rgba(224,104,90,.4)}

/* --- Переключатель темы в профиле (сегмент-контрол) --- */
html[data-theme="dark"] .theme-switch{background:var(--ph2);border-color:var(--line)}
html[data-theme="dark"] .theme-option{color:var(--muted)}
html[data-theme="dark"] .theme-option:hover{color:var(--ink)}
html[data-theme="dark"] .theme-option input:checked+.theme-option-body{background:var(--control);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.4)}