/*
 * Dark theme polish.
 * Loaded after the legacy bundle so light mode and application behavior stay intact.
 */
html.theme-dark {
  --dark-bg: #07111f;
  --dark-bg-soft: #0b172a;
  --dark-surface: #101d32;
  --dark-surface-raised: #14243c;
  --dark-surface-input: #0a1425;
  --dark-line: rgba(148, 180, 218, .16);
  --dark-line-strong: rgba(148, 180, 218, .28);
  --dark-text: #eaf1fb;
  --dark-sub: #9aaeca;
  --dark-blue: #4d8dff;
  --dark-blue-strong: #2770ef;
  --dark-shadow: 0 24px 64px rgba(1, 7, 18, .42);
}

html.theme-dark,
html.theme-dark body {
  color: var(--dark-text) !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(42, 106, 211, .25), transparent 31%),
    radial-gradient(circle at 86% 4%, rgba(36, 79, 148, .16), transparent 26%),
    linear-gradient(150deg, #07111f 0%, #091425 42%, #060e1c 100%) !important;
}

html.theme-dark .app-header {
  background: rgba(9, 18, 33, .78) !important;
  border-color: rgba(150, 181, 218, .13) !important;
  box-shadow: 0 20px 46px rgba(0, 5, 16, .32) !important;
  backdrop-filter: blur(24px) saturate(135%) !important;
}

html.theme-dark .brand,
html.theme-dark .brand span {
  color: #f3f7ff !important;
}

html.theme-dark .header-nav,
html.theme-dark .music-bar {
  background: rgba(20, 35, 57, .88) !important;
  border-color: var(--dark-line) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
}

html.theme-dark .header-nav a {
  color: #aebdd3 !important;
}

html.theme-dark .header-nav a.active,
html.theme-dark .header-nav a:hover {
  background: #e9f0fb !important;
  color: #0b1729 !important;
}

html.theme-dark .music-btn,
html.theme-dark .music-preset-btn {
  color: #d5e0f1 !important;
  background: rgba(255, 255, 255, .04) !important;
}

html.theme-dark .music-preset-btn.active,
html.theme-dark .music-btn:hover {
  background: var(--dark-blue-strong) !important;
  color: #fff !important;
}

html.theme-dark .subpage-top {
  background:
    linear-gradient(135deg, rgba(17, 31, 53, .98), rgba(12, 23, 41, .98)) !important;
  border-color: var(--dark-line) !important;
  box-shadow: var(--dark-shadow) !important;
}

html.theme-dark .subpage-title small {
  color: #5c96ff !important;
}

html.theme-dark .subpage-title h2 {
  color: #f5f8fe !important;
}

html.theme-dark .back-btn {
  background: rgba(17, 31, 53, .76) !important;
  border: 1px solid var(--dark-line) !important;
  color: #d8e4f7 !important;
}

html.theme-dark .back-btn:hover {
  border-color: rgba(92, 150, 255, .5) !important;
  background: rgba(32, 58, 94, .75) !important;
}

html.theme-dark .calculator-frame,
html.theme-dark .spell-checker-frame,
html.theme-dark .calendar-frame,
html.theme-dark .news-frame {
  background: rgba(13, 24, 43, .9) !important;
  border-color: var(--dark-line) !important;
  box-shadow: var(--dark-shadow) !important;
}

html.theme-dark .card,
html.theme-dark .spell-box,
html.theme-dark .kpi-item,
html.theme-dark .salary-input-panel,
html.theme-dark .salary-memo,
html.theme-dark .tool-popup-card {
  color: var(--dark-text) !important;
  background: var(--dark-surface) !important;
  border-color: var(--dark-line) !important;
  box-shadow: 0 12px 32px rgba(1, 7, 18, .2) !important;
}

html.theme-dark .card h2,
html.theme-dark .spell-box h3 {
  color: #f2f7ff !important;
  background: linear-gradient(135deg, #15355d, #11253f) !important;
  border-color: var(--dark-line) !important;
}

html.theme-dark .spell-box textarea,
html.theme-dark .spell-output {
  color: var(--dark-text) !important;
  background: var(--dark-surface-input) !important;
}

html.theme-dark .spell-box textarea::placeholder {
  color: #7387a4 !important;
}

html.theme-dark .spell-output {
  border-color: var(--dark-line) !important;
}

html.theme-dark .spell-result-item {
  color: var(--dark-text) !important;
  background: var(--dark-surface-raised) !important;
  border-color: var(--dark-line) !important;
}

html.theme-dark .spell-result-item strong {
  color: #ecf3ff !important;
}

html.theme-dark .spell-result-item span,
html.theme-dark .kpi-label {
  color: var(--dark-sub) !important;
}

html.theme-dark .kpi-value {
  color: #f4f7fc !important;
}

html.theme-dark .spell-mark {
  color: #fff3c6 !important;
  background: rgba(245, 158, 11, .2) !important;
  border-color: #fbbf24 !important;
}

html.theme-dark .btn {
  background: var(--dark-blue-strong) !important;
  color: #fff !important;
  border-color: transparent !important;
}

html.theme-dark .btn.secondary {
  color: #dbe7f8 !important;
  background: var(--dark-surface-raised) !important;
  border-color: var(--dark-line-strong) !important;
}

html.theme-dark .btn.green {
  background: #168269 !important;
}

html.theme-dark input,
html.theme-dark textarea,
html.theme-dark select {
  color: var(--dark-text) !important;
  background: var(--dark-surface-input) !important;
  border-color: var(--dark-line-strong) !important;
}

html.theme-dark input:focus,
html.theme-dark textarea:focus,
html.theme-dark select:focus {
  border-color: #5c96ff !important;
  box-shadow: 0 0 0 4px rgba(77, 141, 255, .18) !important;
}

html.theme-dark .workflow-global-controls,
html.theme-dark .workflow-floating-theme {
  background: rgba(16, 29, 50, .95) !important;
  border-color: var(--dark-line) !important;
  color: #e6eefb !important;
}

html.theme-dark .workflow-global-controls .user {
  color: #b6c6dc !important;
}

html.theme-dark .workflow-floating-theme:hover {
  background: var(--dark-blue-strong) !important;
  border-color: var(--dark-blue-strong) !important;
}