/* Тёмная тема. Светлые правила в app.css не переопределяются, пока data-theme не dark/system. */

html[data-theme="dark"] {
  color-scheme: dark;
  --ink: #f4efe6;
  --muted: #cbbda8;
  --paper: #12161e;
  --card: #1c2330;
  --line: #3c4658;
  --sidebar: #0c1016;
  --sidebar-text: #d7dee8;
  --amber: #e8b15a;
  --amber-deep: #f6d7a2;
  --ok: #8ed4ae;
  --danger: #f0b4b4;
  --shadow: 0 10px 30px rgba(0, 0, 0, 0.45);
  --mail-dash: #8b97ab;
}

html[data-theme="dark"] body,
html[data-theme="dark"] .picker,
html[data-theme="dark"] .content { background: var(--paper); color: var(--ink); }

html[data-theme="dark"] .topbar {
  background: rgba(18, 22, 30, 0.94);
  color: var(--ink);
}
html[data-theme="dark"] .panel,
html[data-theme="dark"] .stat,
html[data-theme="dark"] .sheet,
html[data-theme="dark"] .login-card,
html[data-theme="dark"] .chat-panel,
html[data-theme="dark"] .lookup-modal .panel,
html[data-theme="dark"] .picker-detail {
  background: var(--card);
  color: var(--ink);
  border-color: var(--line);
}
html[data-theme="dark"] .brand {
  background: transparent;
  padding: 0;
}
html[data-theme="dark"] .brand-logo-light { display: none; }
html[data-theme="dark"] .brand-logo-dark { display: block; }

html[data-theme="dark"] a { color: var(--amber-deep); }
html[data-theme="dark"] .sidebar a { color: var(--sidebar-text); }
html[data-theme="dark"] .sidebar a.active { color: #f6d48a; }

html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] .form-card input,
html[data-theme="dark"] .form-card select,
html[data-theme="dark"] .facts input,
html[data-theme="dark"] .facts select,
html[data-theme="dark"] .picker-search input,
html[data-theme="dark"] .picker-fields input,
html[data-theme="dark"] .picker-fields select,
html[data-theme="dark"] .picker-line input,
html[data-theme="dark"] .line-input,
html[data-theme="dark"] .doc-pick-q {
  background: #171c26;
  color: var(--ink);
  border-color: var(--line);
}
html[data-theme="dark"] .sheet th { color: var(--muted); }
html[data-theme="dark"] .sheet tr:hover td,
html[data-theme="dark"] .doc-pick-option.is-active,
html[data-theme="dark"] .doc-pick-option:hover,
html[data-theme="dark"] .pick-card:hover,
html[data-theme="dark"] .pick-card.is-in { background: #2a3142; }
html[data-theme="dark"] .doc-pick-menu,
html[data-theme="dark"] .doc-pick-option,
html[data-theme="dark"] .doc-pick-empty { background: #171c26; color: var(--ink); }
html[data-theme="dark"] .deficit td { background: #3a2424; }
html[data-theme="dark"] .tag.warn { color: #f3d7a1; border-color: #6a5430; background: #3a2e18; }
html[data-theme="dark"] .tag.ok,
html[data-theme="dark"] .pick-badge-ok { color: #b6ebc8; border-color: #2f6a48; background: #163224; }
html[data-theme="dark"] .pick-badge-wait,
html[data-theme="dark"] .pick-foot .pick-transit,
html[data-theme="dark"] .picker-legend { color: #d6e8ff; }
html[data-theme="dark"] .pick-badge-wait { background: #1a3f6e; border-color: #3d6ea8; }
html[data-theme="dark"] .pick-legend-swatch { background: #9ec5f0; }
html[data-theme="dark"] .pick-card,
html[data-theme="dark"] .picker-tabs button,
html[data-theme="dark"] .picker-filters button,
html[data-theme="dark"] .picker-brands button,
html[data-theme="dark"] .wh-nav a { background: var(--card); color: var(--ink); }
html[data-theme="dark"] .wh-nav a.active { background: var(--amber); color: #1c1408; }
html[data-theme="dark"] .pick-photo,
html[data-theme="dark"] .pick-photo img,
html[data-theme="dark"] .lookup-photo img,
html[data-theme="dark"] .photo-card img,
html[data-theme="dark"] .photo-main,
html[data-theme="dark"] .item-thumb,
html[data-theme="dark"] .stock-photo,
html[data-theme="dark"] .picker-detail img { background: #f7f4ee; }
html[data-theme="dark"] .chat-msg { background: #242b38; }
html[data-theme="dark"] .chat-msg-user { background: #2c2618; }
html[data-theme="dark"] .chat-dialogs li.is-active button,
html[data-theme="dark"] .chat-dialogs li button:hover { background: #2a3142; }
html[data-theme="dark"] .lookup-preview,
html[data-theme="dark"] .token-once,
html[data-theme="dark"] .tax-bar-track { background: #2a2418; color: var(--ink); }
html[data-theme="dark"] .alert-warning { background: #3a2e18; color: #f6d7a2; border-color: #6a5430; }
html[data-theme="dark"] .alert-success,
html[data-theme="dark"] .alert-info { background: #1a2a24; color: var(--ink); }
html[data-theme="dark"] .alert-error,
html[data-theme="dark"] .alert-danger { background: #3a2222; color: #f6d0d0; }
html[data-theme="dark"] .btn { color: var(--ink); border-color: var(--line); }
html[data-theme="dark"] .btn-accent { color: #1c1408; }
html[data-theme="dark"] .theme-icon-moon { display: none; }
html[data-theme="dark"] .theme-icon-sun { display: block; }
html[data-theme="dark"] .theme-toggle-btn { background: #2a3142; color: #f6d7a2; border-color: #e8b15a; }
html[data-theme="dark"] .theme-menu { background: #1c2330; }
html[data-theme="dark"] .doc-line-short { color: #f0b4b4; }
html[data-theme="dark"] .mail-editor,
html[data-theme="dark"] .mail-compose input:not([type="file"]):not([type="hidden"]),
html[data-theme="dark"] .mail-body { background: #171c26; color: var(--ink); }

@media (prefers-color-scheme: dark) {
  html[data-theme="system"] {
    color-scheme: dark;
    --ink: #f4efe6;
    --muted: #cbbda8;
    --paper: #12161e;
    --card: #1c2330;
    --line: #3c4658;
    --sidebar: #0c1016;
    --sidebar-text: #d7dee8;
    --amber: #e8b15a;
    --amber-deep: #f6d7a2;
    --ok: #8ed4ae;
    --danger: #f0b4b4;
    --shadow: 0 10px 30px rgba(0, 0, 0, 0.45);
    --mail-dash: #8b97ab;
  }
  html[data-theme="system"] body,
  html[data-theme="system"] .picker,
  html[data-theme="system"] .content { background: var(--paper); color: var(--ink); }
  html[data-theme="system"] .topbar { background: rgba(18, 22, 30, 0.94); color: var(--ink); }
  html[data-theme="system"] .panel,
  html[data-theme="system"] .stat,
  html[data-theme="system"] .sheet,
  html[data-theme="system"] .login-card { background: var(--card); color: var(--ink); border-color: var(--line); }
  html[data-theme="system"] .brand { background: transparent; padding: 0; }
  html[data-theme="system"] .brand-logo-light { display: none; }
  html[data-theme="system"] .brand-logo-dark { display: block; }
  html[data-theme="system"] .theme-icon-moon { display: none; }
  html[data-theme="system"] .theme-icon-sun { display: block; }
  html[data-theme="system"] .theme-toggle-btn { background: #2a3142; color: #f6d7a2; border-color: #e8b15a; }
  html[data-theme="system"] input,
  html[data-theme="system"] select,
  html[data-theme="system"] textarea,
  html[data-theme="system"] .form-control,
  html[data-theme="system"] .form-select { background: #171c26; color: var(--ink); border-color: var(--line); }
  html[data-theme="system"] .pick-badge-wait,
  html[data-theme="system"] .pick-foot .pick-transit,
  html[data-theme="system"] .picker-legend { color: #d6e8ff; }
  html[data-theme="system"] .pick-badge-wait { background: #1a3f6e; border-color: #3d6ea8; }
  html[data-theme="system"] .pick-photo,
  html[data-theme="system"] .lookup-photo img,
  html[data-theme="system"] .stock-photo,
  html[data-theme="system"] .item-thumb { background: #f7f4ee; }
}

.theme-toggle {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  position: relative;
}
.theme-toggle-btn {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 1px solid var(--amber);
  background: #fff8ea;
  color: #8a4e00;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  cursor: pointer;
}
.theme-toggle-btn svg { width: 20px; height: 20px; display: block; }
.theme-icon-sun { display: none; }
.theme-more { position: relative; }
.theme-more summary {
  list-style: none;
  cursor: pointer;
  width: 22px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
}
.theme-more summary::-webkit-details-marker { display: none; }
.theme-menu {
  position: absolute;
  right: 0;
  top: 40px;
  z-index: 40;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 6px;
  box-shadow: var(--shadow);
  white-space: nowrap;
}
.theme-menu button {
  border: 0;
  background: transparent;
  color: var(--ink);
  padding: 6px 10px;
  border-radius: 8px;
  cursor: pointer;
}
.login-card .theme-toggle { margin: 0 0 12px; }