/* ════════════════════════════════════════════════════════════════════════════
   THEME · Dark Neon (Formula 1 vibes)
   Технологичный тёмный стиль с неоновой подсветкой.
   Палитра: deep blue-black #0A0A1A · cards #13132A · cyan #00E5FF · magenta #FF2BD6
   Шрифты: Titillium Web (heading) + Inter (body) + JetBrains Mono
   ════════════════════════════════════════════════════════════════════════════ */

:root[data-theme="dark"] {
  /* ───── Backgrounds ───── */
  --bg-page: #0a0a1a;
  --bg-topbar: #0d0d22;
  --bg-card: #13132a;
  --bg-card-soft: #181834;
  --bg-card-info: rgba(0, 229, 255, 0.04);
  --bg-card-ai: linear-gradient(135deg, rgba(0, 229, 255, 0.06) 0%, rgba(255, 43, 214, 0.04) 100%);
  --bg-card-muted: rgba(0, 229, 255, 0.02);
  --bg-input: #181834;
  --bg-row-header: rgba(0, 229, 255, 0.04);
  --bg-modal-backdrop: rgba(2, 2, 12, 0.82);
  --bg-overlay-soft: rgba(0, 229, 255, 0.04);
  --bg-progress: rgba(224, 224, 240, 0.08);
  --bg-photo-placeholder: rgba(0, 229, 255, 0.04);
  --bg-photo-label: rgba(0, 0, 12, 0.75);

  /* ───── Text ───── */
  --text-primary: #e0e0f0;
  --text-on-dark: #e0e0f0;
  --text-dim: rgba(224, 224, 240, 0.55);
  --text-on-accent: #0a0a1a;
  --text-on-dark-dim: rgba(224, 224, 240, 0.55);

  /* ───── Accents ───── */
  --accent-primary: #00e5ff;
  --accent-primary-hover: #4df3ff;
  --accent-secondary: #ff2bd6;
  --accent-soft: rgba(0, 229, 255, 0.08);
  --accent-soft-strong: rgba(0, 229, 255, 0.22);
  --accent-soft-border: rgba(0, 229, 255, 0.35);

  /* ───── Borders ───── */
  --border-default: rgba(0, 229, 255, 0.12);
  --border-strong: rgba(0, 229, 255, 0.28);
  --border-on-dark: rgba(0, 229, 255, 0.18);

  /* ───── Status semantic ───── */
  --status-danger: #ff4d6d;
  --status-danger-soft: rgba(255, 77, 109, 0.1);
  --status-danger-border: rgba(255, 77, 109, 0.35);
  --status-warn: #ffb84d;
  --status-warn-soft: rgba(255, 184, 77, 0.1);
  --status-ok: #00ff9c;
  --status-ok-soft: rgba(0, 255, 156, 0.1);
  --status-ok-border: rgba(0, 255, 156, 0.35);
  --status-info: #00e5ff;

  /* ───── Visit status badges ───── */
  --badge-lead-bg: rgba(255, 184, 77, 0.12);
  --badge-lead-fg: #ffb84d;
  --badge-lead-border: rgba(255, 184, 77, 0.4);

  --badge-scheduled-bg: rgba(224, 224, 240, 0.08);
  --badge-scheduled-fg: #e0e0f0;
  --badge-scheduled-border: rgba(224, 224, 240, 0.2);

  --badge-inspected-bg: rgba(224, 224, 240, 0.14);
  --badge-inspected-fg: #e0e0f0;

  --badge-estimate-bg: rgba(0, 229, 255, 0.1);
  --badge-estimate-fg: #00e5ff;
  --badge-estimate-border: rgba(0, 229, 255, 0.4);

  --badge-arrived-bg: rgba(0, 229, 255, 0.18);
  --badge-arrived-fg: #00e5ff;
  --badge-arrived-border: rgba(0, 229, 255, 0.5);

  --badge-progress-bg: rgba(0, 229, 255, 0.18);
  --badge-progress-fg: #00e5ff;
  --badge-progress-border: #00e5ff;

  --badge-ready-bg: rgba(0, 255, 156, 0.15);
  --badge-ready-fg: #00ff9c;
  --badge-ready-border: rgba(0, 255, 156, 0.5);

  --badge-completed-bg: rgba(255, 43, 214, 0.15);
  --badge-completed-fg: #ff2bd6;
  --badge-completed-border: rgba(255, 43, 214, 0.5);

  --badge-postcare-bg: rgba(255, 184, 77, 0.12);
  --badge-postcare-fg: #ffb84d;
  --badge-postcare-border: rgba(255, 184, 77, 0.45);

  --badge-paused-bg: rgba(255, 77, 109, 0.12);
  --badge-paused-fg: #ff4d6d;
  --badge-paused-border: rgba(255, 77, 109, 0.45);

  --badge-closed-bg: rgba(224, 224, 240, 0.06);
  --badge-closed-fg: rgba(224, 224, 240, 0.5);

  /* ───── Channel chips / plates ───── */
  --channel-default-bg: rgba(224, 224, 240, 0.08);
  --group-calls-bg: rgba(255, 122, 77, 0.18);
  --group-calls-fg: #ff7a4d;
  --channel-telegram-bg: rgba(0, 136, 204, 0.2);
  --channel-telegram-fg: #4dc8ff;
  --channel-email-bg: rgba(255, 184, 77, 0.18);
  --channel-email-fg: #ffb84d;
  --channel-web-bg: rgba(0, 229, 255, 0.18);
  --channel-web-fg: #00e5ff;
  --channel-avito-bg: rgba(255, 184, 77, 0.18);
  --channel-avito-fg: #ffd494;
  --channel-yandex-bg: rgba(255, 77, 109, 0.18);
  --channel-yandex-fg: #ff809a;
  --channel-instagram-bg: rgba(255, 43, 214, 0.18);
  --channel-instagram-fg: #ff2bd6;

  /* ───── Tags ───── */
  --tag-legal-bg: rgba(255, 43, 214, 0.1);
  --tag-legal-fg: #ff2bd6;
  --tag-legal-border: rgba(255, 43, 214, 0.4);

  /* ───── Plate (госномер) ───── */
  --plate-bg: #00e5ff;
  --plate-fg: #0a0a1a;

  /* ───── Shadows / glow ───── */
  --shadow-none: none;
  --shadow-card: 0 0 0 1px rgba(0, 229, 255, 0.04), 0 2px 12px rgba(0, 0, 0, 0.4);
  --shadow-card-hover: 0 0 0 1px rgba(0, 229, 255, 0.3), 0 8px 28px rgba(0, 229, 255, 0.18);
  --shadow-button-hover: 0 0 20px rgba(0, 229, 255, 0.55), 0 0 40px rgba(0, 229, 255, 0.2);
  --shadow-modal: 0 30px 80px rgba(0, 0, 0, 0.8), 0 0 60px rgba(0, 229, 255, 0.12);
  --shadow-login: 0 30px 60px rgba(0, 0, 0, 0.7), 0 0 40px rgba(0, 229, 255, 0.18);
  --shadow-topbar: 0 1px 0 rgba(0, 229, 255, 0.18), 0 4px 24px rgba(0, 229, 255, 0.05);
  --glow-strong: 0 0 20px rgba(0, 229, 255, 0.5);
  --glow-soft: 0 0 10px rgba(0, 229, 255, 0.3);
  --glow-text: 0 0 8px rgba(0, 229, 255, 0.35);

  /* ───── Radii ───── */
  --radius-sm: 3px;
  --radius-md: 5px;
  --radius-lg: 6px;
  --radius-xl: 8px;
  --radius-2xl: 10px;
  --radius-3xl: 12px;
  --radius-pill: 100px;
  --radius-modal: 14px;

  /* ───── Typography (F1 vibes) ───── */
  --font-display: 'Titillium Web', 'Inter', system-ui, sans-serif;
  --font-body: 'Inter', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
  --font-display-weight: 600;
  --font-display-style: normal;
  --font-display-letter: -0.01em;
  --font-display-line: 1.1;
  --display-uppercase: none;
  --eyebrow-letter: 0.32em;

  /* ───── Transitions ───── */
  --transition-fast: 0.15s ease;
  --transition-base: 0.2s ease;
  --transition-slow: 0.3s ease;
  --theme-transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;

  /* ───── Login background ───── */
  --login-bg: #06061a;
  --login-bg-grad-1: rgba(0, 229, 255, 0.25);
  --login-bg-grad-2: rgba(255, 43, 214, 0.18);
  --login-card-bg: #13132a;
  --login-brand-dot: #00e5ff;

  /* ───── Form-specific ───── */
  --doc-stamp-color: rgba(255, 43, 214, 0.25);
}

/* ───── Эффекты усиления для dark-neon — точечные, поверх базового CSS ───── */

[data-theme="dark"] body {
  background-image:
    radial-gradient(ellipse at 20% 0%, rgba(0, 229, 255, 0.05), transparent 50%),
    radial-gradient(ellipse at 80% 100%, rgba(255, 43, 214, 0.04), transparent 50%);
  background-attachment: fixed;
}

[data-theme="dark"] .topbar {
  background:
    linear-gradient(180deg, #0d0d22 0%, #07071a 100%);
}

[data-theme="dark"] .brand-name {
  text-shadow: 0 0 12px rgba(0, 229, 255, 0.4);
  letter-spacing: 0.02em;
}

[data-theme="dark"] .brand-dot {
  background: var(--accent-primary);
  box-shadow: 0 0 8px var(--accent-primary);
}

[data-theme="dark"] .btn-primary {
  background: linear-gradient(135deg, var(--accent-primary) 0%, #00b8d4 100%);
  color: var(--text-on-accent);
  box-shadow: 0 0 12px rgba(0, 229, 255, 0.3);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 12.5px;
}

[data-theme="dark"] .btn-primary:hover {
  background: linear-gradient(135deg, var(--accent-primary-hover) 0%, #00d5f5 100%);
  box-shadow: 0 0 20px rgba(0, 229, 255, 0.55), 0 0 40px rgba(0, 229, 255, 0.2);
}

[data-theme="dark"] .btn-danger:hover {
  background: var(--status-danger);
  color: #0a0a1a;
  box-shadow: 0 0 16px rgba(255, 77, 109, 0.45);
}

[data-theme="dark"] .stat-card {
  background: var(--bg-card);
  border-color: var(--border-default);
}

[data-theme="dark"] a.stat-card:hover {
  border-color: var(--accent-primary);
  box-shadow: var(--shadow-card-hover);
}

[data-theme="dark"] .stat-value {
  color: var(--accent-primary);
  text-shadow: var(--glow-text);
}

[data-theme="dark"] .card {
  box-shadow: 0 0 0 1px rgba(0, 229, 255, 0.05), 0 1px 0 rgba(0, 229, 255, 0.04) inset;
}

[data-theme="dark"] .nav-item.is-active {
  color: var(--accent-primary);
  border-bottom-color: var(--accent-primary);
  text-shadow: var(--glow-text);
}

[data-theme="dark"] .page-title {
  letter-spacing: -0.005em;
}

[data-theme="dark"] em {
  color: var(--accent-secondary);
  text-shadow: 0 0 10px rgba(255, 43, 214, 0.35);
  font-style: normal;
}

[data-theme="dark"] .status-badge.status-in_progress,
[data-theme="dark"] .status-badge.status-arrived {
  box-shadow: 0 0 12px rgba(0, 229, 255, 0.35);
}

[data-theme="dark"] .status-badge.status-ready {
  box-shadow: 0 0 12px rgba(0, 255, 156, 0.35);
}

[data-theme="dark"] .status-badge.status-completed {
  box-shadow: 0 0 12px rgba(255, 43, 214, 0.35);
}

[data-theme="dark"] .switch-on {
  box-shadow: 0 0 14px rgba(0, 229, 255, 0.5);
}

[data-theme="dark"] .progress-fill {
  background: linear-gradient(90deg, var(--accent-primary), var(--accent-secondary));
  box-shadow: 0 0 8px rgba(0, 229, 255, 0.5);
}

[data-theme="dark"] .plate {
  box-shadow: 0 0 12px rgba(0, 229, 255, 0.4);
}

[data-theme="dark"] .mini-box-busy:hover,
[data-theme="dark"] .box-card-busy {
  border-color: rgba(0, 229, 255, 0.3);
}

[data-theme="dark"] .ai-metric-value {
  color: var(--accent-primary);
  text-shadow: var(--glow-text);
}

[data-theme="dark"] .ai-metric {
  background: linear-gradient(135deg, rgba(0, 229, 255, 0.06), rgba(255, 43, 214, 0.04));
}

[data-theme="dark"] .doc-preview-stamp {
  text-shadow: 0 0 20px rgba(255, 43, 214, 0.5);
}

[data-theme="dark"] .msg-ai {
  border: 1px solid rgba(0, 229, 255, 0.3);
  box-shadow: 0 0 12px rgba(0, 229, 255, 0.08);
}

[data-theme="dark"] .msg-owner {
  background: linear-gradient(135deg, #181834, #0d0d22);
  box-shadow: 0 0 12px rgba(255, 43, 214, 0.18);
  border: 1px solid rgba(255, 43, 214, 0.25);
}

[data-theme="dark"] .msg-mode {
  box-shadow: 0 0 6px rgba(0, 229, 255, 0.3);
}

[data-theme="dark"] .ch-icon {
  box-shadow: 0 0 6px currentColor;
  opacity: 0.95;
}
