/* ══════════════════════════════════
   DARK THEME — follows the OS `prefers-color-scheme: dark`
   ══════════════════════════════════ */
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark; /* native inputs, scrollbars, date pickers */
  }

  /* ── Page chrome ── */
  body {
    background: #0b1220 !important;
    color: #e2e8f0;
  }
  #toolbar, #viewTabsBar {
    background: #111827 !important;
    border-color: #1f2937 !important;
  }
  #toolbar .toolbar-btn.bg-gray-100,
  #toolbar .toolbar-btn.bg-gray-50,
  #viewTabsBar .toolbar-btn.bg-gray-100,
  #viewTabsBar .toolbar-btn.bg-gray-50 {
    background: #334155 !important;
    color: #e2e8f0 !important;
    border-color: #475569 !important;
  }
  #toolbar .toolbar-btn.bg-gray-100:hover,
  #viewTabsBar .toolbar-btn.bg-gray-100:hover {
    background: #475569 !important;
  }
  #toolbar .toolbar-btn.bg-white,
  #viewTabsBar .toolbar-btn.bg-white {
    background: #1e293b !important;
    color: #e2e8f0 !important;
    border-color: #475569 !important;
  }
  #authArea .text-gray-700, #authUserEmail { color: #e2e8f0 !important; }
  footer { background: #0b1220 !important; color: #64748b !important; border-color: #1f2937 !important; }

  /* View tabs (active state stays blue) */
  #viewTabsBar [data-view] { border-color: #475569 !important; }

  /* ── Inputs / selects / textareas ── */
  input, select, textarea {
    background: #1e293b !important;
    color: #e2e8f0 !important;
    border-color: #475569 !important;
  }
  input::placeholder, textarea::placeholder { color: #64748b !important; }

  /* ── Modals ── */
  .modal-overlay { background: rgba(2,6,23,0.7) !important; }
  .modal { background: #111827 !important; color: #e2e8f0 !important; border: 1px solid #1f2937; }
  .modal h2 { color: #93c5fd !important; }
  .modal label { color: #cbd5e1 !important; }
  .modal .text-gray-400, .modal .text-gray-500 { color: #94a3b8 !important; }
  .modal .border-gray-100, .modal .border-gray-200, .modal .border-gray-300 { border-color: #334155 !important; }
  .modal .bg-gray-100 { background: #1f2937 !important; color: #e2e8f0 !important; }
  .modal .bg-gray-50 { background: #1f2937 !important; }

  /* Dropdowns (View/Export/AI menus + context menus) */
  #viewMenu, #exportDataMenu, #aiMenu, .context-menu {
    background: #111827 !important;
    color: #e2e8f0 !important;
    border-color: #334155 !important;
  }
  #viewMenu .context-menu-item:hover, #aiMenu .context-menu-item:hover { background: #1f2937 !important; }
  #viewMenu label, #viewMenu .text-gray-500, #viewMenu .text-gray-700 { color: #cbd5e1 !important; }

  /* ── Roadmap canvas ── */
  #roadmap-wrapper { background: #0b1220 !important; }
  #roadmap-export-area {
    background: #0f172a !important;
    color: #e2e8f0;
  }

  /* Timeline rows + columns (zebra → uniform dark) */
  #roadmap-export-area .row-bg-white,
  #roadmap-export-area .row-bg-light,
  #roadmap-export-area .cell-label,
  #roadmap-export-area .cell-rag,
  #roadmap-export-area .cell-outside,
  #roadmap-export-area .cell-owner,
  #roadmap-export-area .cell-comments,
  #roadmap-export-area .cell-timeline {
    background: #0f172a !important;
    border-color: #1f2937 !important;
  }
  #roadmap-export-area .cell-label,
  #roadmap-export-area .cell-outside span,
  #roadmap-export-area .cell-owner span,
  #roadmap-export-area .cell-comments span { color: #e2e8f0 !important; }

  /* Inline light text → light (sweeps grid/list/board/todo + legend/note) */
  #roadmap-export-area [style*="color:#1e293b"],
  #roadmap-export-area [style*="color:#334155"],
  #roadmap-export-area [style*="color:#475569"],
  #roadmap-export-area [style*="color:#64748b"],
  #roadmap-export-area [style*="color:#4a5568"],
  #roadmap-export-area [style*="color:#2d3748"],
  #roadmap-export-area [style*="color:#0f172a"],
  #roadmap-export-area [style*="color:#111827"] { color: #e2e8f0 !important; }

  /* Inline white/light surfaces → dark (grid/list/board/todo) */
  #roadmap-export-area [style*="background:white"],
  #roadmap-export-area [style*="background:#fff"],
  #roadmap-export-area [style*="background:#ffffff"],
  #roadmap-export-area [style*="background:#f8fafc"],
  #roadmap-export-area [style*="background:#f1f5f9"] { background: #1e293b !important; }

  /* Inline light borders → dark */
  #roadmap-export-area [style*="border-bottom:1px solid #e2e8f0"],
  #roadmap-export-area [style*="border-bottom:1px solid #eef2f7"],
  #roadmap-export-area [style*="border-bottom:1px solid #f1f5f9"],
  #roadmap-export-area [style*="border:1px solid #e2e8f0"],
  #roadmap-export-area [style*="border:1px solid #d1d5db"] { border-color: #2d3748 !important; }

  /* Subtle grid lines on dark canvas */
  #roadmap-export-area .cell-timeline { background-image: none; }

  /* Calendar grid lines — soften the near-white inline colours */
  #roadmap-export-area [style*="background:#edf2f7"],
  #roadmap-export-area [style*="background:#e8edf3"],
  #roadmap-export-area [style*="border-top:1px dashed #dde3eb"] {
    background: #1a2438 !important;
    border-color: #1a2438 !important;
  }
  #roadmap-export-area [style*="background:#d1d9e6"] {
    background: #2c3a52 !important;
  }
}