/* NodeForge — светлая тема. Включается атрибутом data-theme="light" на <html>.
   Всё, что завязано на токены, перекрашивается переменными; ниже — места с жёстко заданными цветами. */

html[data-theme="light"] {
  color-scheme: light;

  --bg: #f1f4f9;
  --bg-2: #e9edf4;
  --surface: #ffffff;
  --surface-2: #f5f7fb;
  --surface-3: #e6ebf4;

  --border: #d5dce9;
  --border-subtle: #e3e8f1;
  --border-focus: rgba(37,99,235,.45);

  --text: #101b2d;
  --text-muted: #4b5a72;
  --text-dim: #77849a;

  --accent: #2563eb;
  --accent-hover: #1d4ed8;
  --accent-muted: rgba(37,99,235,.09);
  --accent-border: rgba(37,99,235,.28);

  --ok: #0c8f5f;
  --ok-muted: rgba(12,143,95,.09);
  --ok-border: rgba(12,143,95,.28);
  --warn: #b26a00;
  --warn-muted: rgba(178,106,0,.09);
  --warn-border: rgba(178,106,0,.3);
  --err: #d23b3b;
  --err-muted: rgba(210,59,59,.08);
  --err-border: rgba(210,59,59,.28);
  --step: #6d4bd8;

  --btn-bg: var(--accent);
  --btn-text: #ffffff;

  --shadow-card: 0 1px 0 var(--border-subtle), 0 2px 10px rgba(30,45,80,.06);
  --shadow-float: 0 20px 50px rgba(30,45,80,.18), 0 4px 16px rgba(30,45,80,.08);

  --gx-l4: #2563eb; --gx-wg: #7c5ce6; --gx-casc: #c27c0e; --gx-direct: #0c8f5f; --gx-panel: #8b97ad;
}

html[data-theme="light"] body.workspace {
  background:
    radial-gradient(ellipse 900px 500px at 70% -100px, rgba(80,120,220,.10), transparent),
    radial-gradient(ellipse 600px 400px at -50px 100%, rgba(40,160,120,.06), transparent),
    var(--bg);
}

/* ── общие элементы ── */
html[data-theme="light"] tr:hover td { background: rgba(37,99,235,.035) }
html[data-theme="light"] .card { box-shadow: var(--shadow-card) }
html[data-theme="light"] ::-webkit-scrollbar-thumb:hover { background: #b8c3d8 }
html[data-theme="light"] select:hover,
html[data-theme="light"] input:hover:not(:focus),
html[data-theme="light"] textarea:hover:not(:focus) { border-color: #b4c0d6 }
html[data-theme="light"] input[type=file]::file-selector-button:hover { background: #d8e1f3 }
html[data-theme="light"] .btn,
html[data-theme="light"] button:not(.btn-ghost):not(.btn-danger):not(.opt):not(.tl-head):not(.gx-card):not(.gx-chip):not(.gx-x):not(.stat-click):not(.node-name):not(.btn-icon) {
  box-shadow: 0 1px 0 rgba(255,255,255,.25) inset, 0 6px 14px -8px rgba(37,99,235,.6);
}
html[data-theme="light"] .mobile-header { background: rgba(255,255,255,.92) }
html[data-theme="light"] .login-wrap {
  background:
    radial-gradient(ellipse 600px 400px at 60% -50px, rgba(80,120,220,.14), transparent),
    var(--bg);
}
html[data-theme="light"] .modal-bg,
html[data-theme="light"] [class*="overlay"] { --nf-overlay: rgba(20,30,50,.45) }
html[data-theme="light"] select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%2377849a' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* ── статусные чипы и подписи: тёмные оттенки вместо пастельных ── */
html[data-theme="light"] .mc-direct  { color: #1d4ed8; background: rgba(37,99,235,.08);  border-color: rgba(37,99,235,.25) }
html[data-theme="light"] .mc-bridge  { color: #067a52; background: rgba(12,143,95,.08);  border-color: rgba(12,143,95,.26) }
html[data-theme="light"] .mc-cascade { color: #5b3cc4; background: rgba(109,75,216,.08); border-color: rgba(109,75,216,.26) }
html[data-theme="light"] .mc-warn    { color: #955700; background: rgba(178,106,0,.09);  border-color: rgba(178,106,0,.28) }
html[data-theme="light"] .chebur-ok  { color: #067a52; border-color: rgba(12,143,95,.26) }
html[data-theme="light"] .chebur-warn{ color: #955700; border-color: rgba(178,106,0,.28) }
html[data-theme="light"] .chebur-err { color: #b42323; background: rgba(210,59,59,.07); border-color: rgba(210,59,59,.26) }
html[data-theme="light"] .hp-bridge  { color: #067a52; background: rgba(12,143,95,.07); border-color: rgba(12,143,95,.24) }
html[data-theme="light"] .hp-tunnel  { color: #5b3cc4; background: rgba(109,75,216,.07); border-color: rgba(109,75,216,.24) }
html[data-theme="light"] .ru-ok      { color: #067a52; background: rgba(12,143,95,.08);  border-color: rgba(12,143,95,.24) }
html[data-theme="light"] .ru-warn    { color: #955700; background: rgba(178,106,0,.09);  border-color: rgba(178,106,0,.28) }
html[data-theme="light"] .ru-blocked { color: #b42323; background: rgba(210,59,59,.07);  border-color: rgba(210,59,59,.26) }
html[data-theme="light"] .ru-check-ok   { color: #067a52; border-color: rgba(12,143,95,.24) }
html[data-theme="light"] .ru-check-warn { color: #955700; border-color: rgba(178,106,0,.26) }
html[data-theme="light"] .ru-check-err  { color: #b42323; border-color: rgba(210,59,59,.24) }
html[data-theme="light"] .ru-action-ok   { color: #067a52 }
html[data-theme="light"] .ru-action-warn { color: #955700 }
html[data-theme="light"] .route-check-ok   { color: #067a52 }
html[data-theme="light"] .route-check-warn { color: #955700 }
html[data-theme="light"] .tag.warn { color: #955700; background: rgba(178,106,0,.09); border-color: rgba(178,106,0,.28) }
html[data-theme="light"] .recon-port.ok { color: #067a52; background: rgba(12,143,95,.07); border-color: rgba(12,143,95,.24) }
html[data-theme="light"] .rc-bar i { background: #0c8f5f }
html[data-theme="light"] .rc-bar i.tone-mid  { background: #d98a10 }
html[data-theme="light"] .rc-bar i.tone-high { background: #d23b3b }
html[data-theme="light"] .node-table-compact tr.attention td:first-child { box-shadow: inset 3px 0 0 rgba(217,138,16,.85) }
html[data-theme="light"] .node-table-compact tr.offline td:first-child   { box-shadow: inset 3px 0 0 rgba(210,59,59,.85) }
html[data-theme="light"] .node-table-compact tbody tr:hover td { background: rgba(37,99,235,.04) }
html[data-theme="light"] #ssh-ip-status { color: var(--text-dim) !important }

/* ── установка ── */
html[data-theme="light"] .ins-code code { color: #1e3a8a }
html[data-theme="light"] .ins-cmd { background: linear-gradient(180deg, rgba(37,99,235,.06), var(--surface) 60%) }

/* ── граф ── */
html[data-theme="light"] .gx-board {
  background:
    radial-gradient(circle at 1px 1px, rgba(30,45,80,.10) 1px, transparent 0) 0 0/24px 24px,
    linear-gradient(180deg, rgba(37,99,235,.03), transparent 40%);
}
html[data-theme="light"] .gx-card:hover { border-color: rgba(37,99,235,.45) }
html[data-theme="light"] .gx-card.sel { box-shadow: 0 0 0 1px var(--accent), 0 8px 24px rgba(37,99,235,.18) }

/* ── карта: переключатели и подписи вокруг полотна ── */
html[data-theme="light"] .map-toggle { background: var(--surface); border-color: var(--border) }
html[data-theme="light"] .map-toggle button { color: var(--text-muted) }
html[data-theme="light"] .map-toggle button:hover { background: var(--surface-3) }
html[data-theme="light"] .map-toggle button.on { background: var(--accent-muted); color: var(--accent); border-color: var(--accent-border) }
html[data-theme="light"] .map-filters button { background: var(--surface); color: var(--text-muted); border-color: var(--border) }
html[data-theme="light"] .map-filters button:hover { background: var(--surface-3) }
html[data-theme="light"] .map-filters button.on { background: var(--accent-muted); border-color: var(--accent-border); color: var(--accent) }
html[data-theme="light"] .map-inspect .path-line { color: var(--text) }
html[data-theme="light"] .map-inspect .lane { border-top-color: var(--border-subtle) }
html[data-theme="light"] .map-inspect .lane span { color: var(--text-muted) }
html[data-theme="light"] .map-inspect .facts div { background: var(--surface-2); border-color: var(--border) }
html[data-theme="light"] .map-inspect .facts dt { color: var(--text-dim) }
html[data-theme="light"] .map-warn { background: rgba(210,59,59,.07); border-color: rgba(210,59,59,.25); color: #a02525 }

/* полотно карты остаётся тёмным: на нём светящиеся линии и карточки */
html[data-theme="light"] .map-stage {
  background:
    linear-gradient(#10151e, #0c1118),
    repeating-linear-gradient(0deg, transparent 0 27px, #1c243355 28px),
    repeating-linear-gradient(90deg, transparent 0 27px, #1c243355 28px);
  box-shadow: inset 0 0 0 1px rgba(10,20,40,.35);
}
html[data-theme="light"] .map-stage.geo { background-color: #071018 }
html[data-theme="light"] .map-legend { color: var(--text-muted) }
html[data-theme="light"] .map-legend .lg-l4 i { background: #5b78e6; box-shadow: none }
html[data-theme="light"] .map-legend .lg-wg i { background: #1fae83; box-shadow: none }
html[data-theme="light"] .map-legend .lg-cdn i { background: #d99a2b }
html[data-theme="light"] .map-legend .lg-direct i { background: #7d8aa0 }
html[data-theme="light"] .map-legend .lg-idle i { background: #a8b3c7 }
html[data-theme="light"] .map-legend .lg-broken i { background: #d4545c; box-shadow: none }

/* ── переключатель темы в меню (внешний вид — как у .nav-item) ── */
button.theme-toggle {
  width: 100%; background: transparent; border: 1px solid transparent; box-shadow: none !important;
  font-family: var(--font); text-align: left; cursor: pointer; justify-content: flex-start;
}
button.theme-toggle:hover { background: var(--surface); color: var(--text); filter: none }
.theme-toggle .ic-sun { display: none }
html[data-theme="light"] .theme-toggle .ic-sun { display: block }
html[data-theme="light"] .theme-toggle .ic-moon { display: none }
.theme-toggle .tt-label::after { content: "Светлая тема" }
html[data-theme="light"] .theme-toggle .tt-label::after { content: "Тёмная тема" }