/*
 * Микки — палитры оформления (mickey-theme).
 * Все схемы: html[data-theme="…"] с общим набором переменных.
 * Старые значения light/dark сохраняются; неизвестное → dark (в JS).
 * Специфичность html[data-theme] выше :root страниц — локальные палитры не перебивают схему.
 */

/* --- Светлая --- */
html[data-theme="light"] {
  color-scheme: light;
  --bg: #f4f6fa;
  --surface: #ffffff;
  --surface2: #e9edf3;
  --text: #1a2230;
  --muted: #5b6b82;
  --accent: #1f6fe0;
  --accent-dim: #1553ad;
  --accent-tint: #e8f0fc;
  --success: #159a67;
  --ok: #159a67;
  --danger: #d64545;
  --warn: #c58a0a;
  --user: #2b7bc4;
  --border: #d3dbe6;
  --input-bg: #e9edf3;
  --nav-bg: #ffffff;
  --nav-release: #1553ad;
  --row-hover: #e9edf3;
  --dots-color: rgba(26, 34, 48, 0.12);
  --theme-dots: 1;
}

/* --- Тёмная (канон оболочки) --- */
html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0f1419;
  --surface: #1a2332;
  --surface2: #243044;
  --text: #e7ecf3;
  --muted: #8b9cb3;
  --accent: #3d8bfd;
  --accent-dim: #2563b8;
  --accent-tint: #1a2740;
  --success: #34d399;
  --ok: #34d399;
  --danger: #f87171;
  --warn: #fbbf24;
  --user: #2b7bc4;
  --border: #2d3a4f;
  --input-bg: #0a0e14;
  --nav-bg: #0e1622;
  --nav-release: #9ec9f5;
  --row-hover: #121a26;
  --dots-color: rgba(241, 236, 228, 0.10);
  --theme-dots: 1;
}

/* --- Янтарная --- */
html[data-theme="amber"] {
  color-scheme: dark;
  --bg: #1a1408;
  --surface: #2a2110;
  --surface2: #3a2e16;
  --text: #fff6e0;
  --muted: #c4a878;
  --accent: #e8a317;
  --accent-dim: #b87d0c;
  --accent-tint: #3a2a10;
  --success: #7dbe4a;
  --ok: #7dbe4a;
  --danger: #e85a4a;
  --warn: #f5c542;
  --user: #d4920a;
  --border: #4a3a1c;
  --input-bg: #120e06;
  --nav-bg: #161008;
  --nav-release: #f0c060;
  --row-hover: #322818;
  --dots-color: rgba(241, 236, 228, 0.10);
  --theme-dots: 1;
}

/* --- Зелёная --- */
html[data-theme="green"] {
  color-scheme: dark;
  --bg: #0c1612;
  --surface: #152820;
  --surface2: #1e3a2e;
  --text: #e6f5ee;
  --muted: #7eab96;
  --accent: #2ecc87;
  --accent-dim: #1f9a64;
  --accent-tint: #143528;
  --success: #3dd68c;
  --ok: #3dd68c;
  --danger: #f07178;
  --warn: #e6c35c;
  --user: #2ba86e;
  --border: #2a4a3a;
  --input-bg: #08110d;
  --nav-bg: #0a1410;
  --nav-release: #8fd9b4;
  --row-hover: #13241c;
  --dots-color: rgba(241, 236, 228, 0.10);
  --theme-dots: 1;
}

/* --- Коричневая (si-pro) --- */
html[data-theme="brown"] {
  color-scheme: dark;
  --bg: #201e1d;
  --surface: #332d28;
  --surface2: #3f3831;
  --text: #f1ece4;
  --muted: #b0a89c;
  --accent: #c4a35a;
  --accent-dim: #9a7d3e;
  --accent-tint: #2e211c;
  --success: #8fbc6e;
  --ok: #8fbc6e;
  --danger: #d4786a;
  --warn: #d4a84b;
  --user: #b8954e;
  --border: #4a433c;
  --input-bg: #181614;
  --nav-bg: #1a1816;
  --nav-release: #d4bc7a;
  --row-hover: #2a2521;
  --dots-color: rgba(241, 236, 228, 0.10);
  --theme-dots: 1;
  /* тёплый градиентный фон в духе si-pro */
  background-color: #201e1d;
  background-image: linear-gradient(165deg, #332d28 0%, #201e1d 55%, #1a1816 100%);
  background-attachment: fixed;
}

/* --- Синяя --- */
html[data-theme="blue"] {
  color-scheme: dark;
  --bg: #0a1220;
  --surface: #132038;
  --surface2: #1a2e4c;
  --text: #e8f0ff;
  --muted: #8498b8;
  --accent: #4d8ef7;
  --accent-dim: #2f6ad4;
  --accent-tint: #152640;
  --success: #3ecf8e;
  --ok: #3ecf8e;
  --danger: #f07575;
  --warn: #e6b84d;
  --user: #3d7de0;
  --border: #243656;
  --input-bg: #070e18;
  --nav-bg: #0c1524;
  --nav-release: #9ec5ff;
  --row-hover: #101c30;
  --dots-color: rgba(241, 236, 228, 0.10);
  --theme-dots: 1;
}

/* --- Графитовая --- */
html[data-theme="graphite"] {
  color-scheme: dark;
  --bg: #121416;
  --surface: #1c1f24;
  --surface2: #282c33;
  --text: #eceff3;
  --muted: #8e959e;
  --accent: #7a8cff;
  --accent-dim: #5a6ad4;
  --accent-tint: #22263a;
  --success: #5ecf8e;
  --ok: #5ecf8e;
  --danger: #e07070;
  --warn: #d4b04a;
  --user: #6a7ae8;
  --border: #333841;
  --input-bg: #0c0e10;
  --nav-bg: #101214;
  --nav-release: #a8b4ff;
  --row-hover: #181b20;
  --dots-color: rgba(241, 236, 228, 0.09);
  --theme-dots: 1;
}

/* --- Тёплая бежевая --- */
html[data-theme="beige"] {
  color-scheme: light;
  --bg: #f3ebe0;
  --surface: #faf6f0;
  --surface2: #e8ddd0;
  --text: #2c241c;
  --muted: #7a6b5c;
  --accent: #b87333;
  --accent-dim: #8f5724;
  --accent-tint: #efe0d0;
  --success: #4a9a5c;
  --ok: #4a9a5c;
  --danger: #c45c4a;
  --warn: #c4922a;
  --user: #a0652e;
  --border: #d4c4b0;
  --input-bg: #efe6da;
  --nav-bg: #faf6f0;
  --nav-release: #8f5724;
  --row-hover: #ebe0d2;
  --dots-color: rgba(44, 36, 28, 0.10);
  --theme-dots: 1;
}

/* Точечная сетка si-pro: декоративный слой, не перехватывает клики */
html[data-theme] body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-image: radial-gradient(circle, var(--dots-color, rgba(241, 236, 228, 0.10)) 1px, transparent 1.3px);
  background-size: 30px 30px;
  background-position: 50% 50%;
  -webkit-mask-image: radial-gradient(ellipse 80% 78% at 50% 45%, #000 30%, transparent 100%);
  mask-image: radial-gradient(ellipse 80% 78% at 50% 45%, #000 30%, transparent 100%);
}

/* Плитки выбора темы (ЛК → Основные) */
.theme-picker {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr));
  gap: 0.65rem;
  margin: 0.35rem 0 0.25rem;
}
.theme-tile {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.4rem;
  margin: 0;
  padding: 0.45rem;
  background: var(--surface2, var(--surface));
  border: 2px solid var(--border);
  border-radius: 0.65rem;
  color: var(--text);
  cursor: pointer;
  font: inherit;
  text-align: center;
  position: relative;
  min-height: 44px;
}
.theme-tile:hover { border-color: var(--accent); }
.theme-tile[aria-pressed="true"],
.theme-tile.is-active {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px var(--accent);
}
.theme-tile-check {
  position: absolute;
  top: 0.3rem;
  right: 0.35rem;
  width: 1.1rem;
  height: 1.1rem;
  border-radius: 50%;
  background: var(--accent);
  color: #fff;
  font-size: 0.7rem;
  line-height: 1.1rem;
  font-weight: 700;
  opacity: 0;
  pointer-events: none;
}
.theme-tile[aria-pressed="true"] .theme-tile-check,
.theme-tile.is-active .theme-tile-check { opacity: 1; }
.theme-tile-preview {
  height: 3.1rem;
  border-radius: 0.4rem;
  border: 1px solid rgba(0, 0, 0, 0.12);
  overflow: hidden;
  position: relative;
  background: var(--tp-bg, #0f1419);
}
.theme-tile-preview .tp-card {
  position: absolute;
  left: 12%;
  right: 12%;
  top: 28%;
  bottom: 18%;
  border-radius: 0.25rem;
  background: var(--tp-surface, #1a2332);
  border: 1px solid var(--tp-border, #2d3a4f);
}
.theme-tile-preview .tp-accent {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: var(--tp-accent, #3d8bfd);
  border-radius: 0.25rem 0 0 0.25rem;
}
.theme-tile-preview .tp-line {
  position: absolute;
  left: 18%;
  right: 14%;
  top: 42%;
  height: 3px;
  border-radius: 2px;
  background: var(--tp-text, #e7ecf3);
  opacity: 0.85;
}
.theme-tile-preview .tp-line.tp-muted {
  top: 58%;
  width: 42%;
  right: auto;
  background: var(--tp-muted, #8b9cb3);
  opacity: 0.9;
}
.theme-tile-label {
  font-size: 0.78rem;
  font-weight: 650;
  line-height: 1.2;
  color: var(--text);
}
@media (max-width: 640px) {
  .theme-picker { grid-template-columns: repeat(auto-fill, minmax(6.5rem, 1fr)); gap: 0.5rem; }
}

/* Сколков -shell-modules- -05.11.26- Inter с fallback на системный шрифт */
html[data-theme] {
  font-family: "Inter", system-ui, "Segoe UI", sans-serif;
}

/* Карта файлов (files-map): доп. токены поверх общей палитры, без перекраски чужих экранов */
html[data-theme] {
  --fm-canvas-bg: var(--input-bg);
  --fm-panel: var(--surface);
  --fm-line: var(--border);
  --fm-fg: var(--text);
  --fm-dim: var(--muted);
  --fm-hover: var(--row-hover);
  --fm-chip-bg: var(--surface2);
  --fm-btn-bg: var(--surface2);
  --fm-tt-bg: var(--surface2);
  --fm-tt-border: var(--border);
  --fm-overlay-bg: var(--bg);
  --fm-tri: var(--muted);
  --fm-sep: var(--muted);
  --fm-bar-track: var(--surface2);
  --fm-input-bg: var(--input-bg);
  --fm-on-accent-fg: #ffffff;
  --fm-focus-bg: color-mix(in srgb, var(--accent) 22%, transparent);
  --fm-focus-outline: color-mix(in srgb, var(--accent) 45%, transparent);
  --fm-warn-fg: var(--warn);
}