/* ==========================================================================
   WHALE OS — Dark Mode Override v3.5 (Slate-950 Obsidian Architecture)
   ─────────────────────────────────────────────────────────────────────────
   Guarantees high-contrast luxury dark surfaces, eliminating all residual
   white containers, unreadable gray borders, or glassmorphism artifacts.
   ========================================================================== */

/* ══════════════════════════════════════════════════════════
   §0 · CANVAS & BACKGROUND
   ══════════════════════════════════════════════════════════ */
[data-theme="dark"] body,
body.dark-theme,
[data-theme="dark"] .main-viewport,
body.dark-theme .main-viewport {
  background: #090d16 !important;
  color: #f8fafc !important;
}

/* ══════════════════════════════════════════════════════════
   §1 · CARDS, CONTAINERS & PANELS
   ══════════════════════════════════════════════════════════ */
[data-theme="dark"] .card,
body.dark-theme .card,
[data-theme="dark"] [class*="-card"]:not([class*="-card-"]):not([class*="-card_"]):not(.sidebar-nav-item):not(.bento-showcase-card),
body.dark-theme [class*="-card"]:not([class*="-card-"]):not([class*="-card_"]):not(.sidebar-nav-item):not(.bento-showcase-card),
[data-theme="dark"] [class*="-panel"],
body.dark-theme [class*="-panel"],
[data-theme="dark"] .dna-card,
body.dark-theme .dna-card,
[data-theme="dark"] .bento-tile,
body.dark-theme .bento-tile {
  background: #111827 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #f8fafc !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.45) !important;
}

/* ── Explicit Payroll Systems Cards (Dark Mode) ── */
[data-theme="dark"] .ps-hub-card,
body.dark-theme .ps-hub-card,
[data-theme="dark"] .ps-card-active,
body.dark-theme .ps-card-active {
  background: #111827 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #f8fafc !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.45) !important;
}

[data-theme="dark"] .ps-hub-card:hover,
body.dark-theme .ps-hub-card:hover {
  background: #172338 !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.6) !important;
}

[data-theme="dark"] .ps-card-title,
body.dark-theme .ps-card-title {
  color: #ffffff !important;
}

[data-theme="dark"] .ps-card-desc,
body.dark-theme .ps-card-desc {
  color: #94a3b8 !important;
}

[data-theme="dark"] .ps-card-icon,
body.dark-theme .ps-card-icon {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .ps-card-coming-soon,
body.dark-theme .ps-card-coming-soon {
  background: #0d1322 !important;
  border-color: rgba(255, 255, 255, 0.05) !important;
}

/* ── Explicit Insurance Portal (Dark Mode) ── */
[data-theme="dark"] .ins-hero,
body.dark-theme .ins-hero,
[data-theme="dark"] .ins-card,
body.dark-theme .ins-card {
  background: #111827 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #f8fafc !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.45) !important;
}

[data-theme="dark"] .ins-hero-title,
body.dark-theme .ins-hero-title,
[data-theme="dark"] .ins-card-title,
body.dark-theme .ins-card-title,
[data-theme="dark"] .ins-label,
body.dark-theme .ins-label {
  color: #ffffff !important;
}

[data-theme="dark"] .ins-hero-desc,
body.dark-theme .ins-hero-desc,
[data-theme="dark"] .ins-badge-label,
body.dark-theme .ins-badge-label,
[data-theme="dark"] .ins-file-desc,
body.dark-theme .ins-file-desc,
[data-theme="dark"] .ins-check-text,
body.dark-theme .ins-check-text {
  color: #94a3b8 !important;
}

[data-theme="dark"] .ins-file-item,
body.dark-theme .ins-file-item,
[data-theme="dark"] .ins-badge-card,
body.dark-theme .ins-badge-card,
[data-theme="dark"] .ins-check-item,
body.dark-theme .ins-check-item,
[data-theme="dark"] .ins-copier,
body.dark-theme .ins-copier {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .ins-file-item:hover,
body.dark-theme .ins-file-item:hover {
  background: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .ins-file-name,
body.dark-theme .ins-file-name,
[data-theme="dark"] .ins-badge-val,
body.dark-theme .ins-badge-val,
[data-theme="dark"] .ins-check-text strong,
body.dark-theme .ins-check-text strong {
  color: #ffffff !important;
}

[data-theme="dark"] .ins-input,
body.dark-theme .ins-input {
  background: #0d1322 !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ins-btn-download,
body.dark-theme .ins-btn-download,
[data-theme="dark"] .ins-copy-btn,
body.dark-theme .ins-copy-btn {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  color: #38bdf8 !important;
}

[data-theme="dark"] .ins-btn-download:hover,
body.dark-theme .ins-btn-download:hover,
[data-theme="dark"] .ins-copy-btn:hover,
body.dark-theme .ins-copy-btn:hover {
  background: #0284c7 !important;
  color: #ffffff !important;
  border-color: #0284c7 !important;
}

/* ── Explicit Command Center & Workspace Cards (Dark Mode) ── */
[data-theme="dark"] .cc-sidebar,
body.dark-theme .cc-sidebar,
[data-theme="dark"] .cc-stat-mini-card,
body.dark-theme .cc-stat-mini-card,
[data-theme="dark"] .cc-pillar-card,
body.dark-theme .cc-pillar-card,
[data-theme="dark"] .cc-workflow-card,
body.dark-theme .cc-workflow-card,
[data-theme="dark"] .cc-insight-card,
body.dark-theme .cc-insight-card {
  background: #111827 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #f8fafc !important;
}

/* ── Explicit Recruitment, Onboarding, and Settings Cards (Dark Mode) ── */
[data-theme="dark"] .rec-card,
body.dark-theme .rec-card,
[data-theme="dark"] .rec-candidate-card,
body.dark-theme .rec-candidate-card,
[data-theme="dark"] .onb-card,
body.dark-theme .onb-card,
[data-theme="dark"] .onb-milestone-card,
body.dark-theme .onb-milestone-card,
[data-theme="dark"] .settings-card,
body.dark-theme .settings-card {
  background: #111827 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #f8fafc !important;
}


/* ══════════════════════════════════════════════════════════
   §2 · TABLE WRAPPERS & CELLS
   ══════════════════════════════════════════════════════════ */
[data-theme="dark"] .table-wrap,
body.dark-theme .table-wrap,
[data-theme="dark"] .table-container,
body.dark-theme .table-container,
[data-theme="dark"] .em-table-wrap,
body.dark-theme .em-table-wrap,
[data-theme="dark"] .em-table-wrapper,
body.dark-theme .em-table-wrapper,
[data-theme="dark"] [class*="table-wrap"],
body.dark-theme [class*="table-wrap"] {
  background: #111827 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  outline: none !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.45) !important;
}

/* Table head */
[data-theme="dark"] thead th,
body.dark-theme thead th,
[data-theme="dark"] .table thead th,
body.dark-theme .table thead th,
[data-theme="dark"] .em-table thead th,
body.dark-theme .em-table thead th {
  background: #162032 !important;
  color: #94a3b8 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* Table body */
[data-theme="dark"] tbody td,
body.dark-theme tbody td,
[data-theme="dark"] .table tbody td,
body.dark-theme .table tbody td,
[data-theme="dark"] .em-table tbody td,
body.dark-theme .em-table tbody td {
  color: #cbd5e1 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
  background: transparent !important;
}

[data-theme="dark"] tbody tr:hover,
body.dark-theme tbody tr:hover,
[data-theme="dark"] .table tbody tr:hover,
body.dark-theme .table tbody tr:hover {
  background: #172338 !important;
}

/* ══════════════════════════════════════════════════════════
   §3 · HEADINGS & TEXT
   ══════════════════════════════════════════════════════════ */
[data-theme="dark"] h1, body.dark-theme h1,
[data-theme="dark"] h2, body.dark-theme h2,
[data-theme="dark"] h3, body.dark-theme h3,
[data-theme="dark"] h4, body.dark-theme h4,
[data-theme="dark"] h5, body.dark-theme h5,
[data-theme="dark"] [class*="view-title"],
body.dark-theme [class*="view-title"],
[data-theme="dark"] [class*="page-title"],
body.dark-theme [class*="page-title"] {
  background: none !important;
  background-image: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: #f8fafc !important;
  color: #f8fafc !important;
}

[data-theme="dark"] p, body.dark-theme p,
[data-theme="dark"] span, body.dark-theme span {
  color: inherit;
}

/* ══════════════════════════════════════════════════════════
   §4 · HEADER & SIDEBAR
   ══════════════════════════════════════════════════════════ */
[data-theme="dark"] .header-desktop,
body.dark-theme .header-desktop {
  background: rgba(9, 13, 22, 0.94) !important;
  backdrop-filter: blur(12px) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .sidebar,
body.dark-theme .sidebar {
  background: #0d121f !important;
  border-left: 1px solid rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .sidebar-nav-item,
body.dark-theme .sidebar-nav-item {
  color: #94a3b8 !important;
}

[data-theme="dark"] .sidebar-nav-item:hover,
body.dark-theme .sidebar-nav-item:hover {
  background: #1e293b !important;
  color: #f8fafc !important;
}

[data-theme="dark"] .sidebar-nav-item.active,
body.dark-theme .sidebar-nav-item.active {
  background: rgba(59, 130, 246, 0.16) !important;
  color: #60a5fa !important;
}

/* ══════════════════════════════════════════════════════════
   §5 · INPUTS, TEXTAREAS & SELECTS
   ══════════════════════════════════════════════════════════ */
[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
body.dark-theme input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
[data-theme="dark"] textarea,
body.dark-theme textarea,
[data-theme="dark"] select,
body.dark-theme select {
  background: #0d1322 !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: #f8fafc !important;
}

[data-theme="dark"] input::placeholder,
body.dark-theme input::placeholder,
[data-theme="dark"] textarea::placeholder,
body.dark-theme textarea::placeholder {
  color: #64748b !important;
}

[data-theme="dark"] select option,
body.dark-theme select option {
  background: #0d1322 !important;
  color: #f8fafc !important;
}

/* ══════════════════════════════════════════════════════════
   §6 · MODALS, POPUPS & DRAWERS
   ══════════════════════════════════════════════════════════ */
[data-theme="dark"] [class*="modal-container"],
body.dark-theme [class*="modal-container"],
[data-theme="dark"] [class*="modal-content"],
body.dark-theme [class*="modal-content"],
[data-theme="dark"] .modal-box,
body.dark-theme .modal-box {
  background: #111827 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.75) !important;
  color: #f8fafc !important;
}

/* ══════════════════════════════════════════════════════════
   §7 · BUTTONS & CHIPS
   ══════════════════════════════════════════════════════════ */
[data-theme="dark"] .btn-secondary,
body.dark-theme .btn-secondary,
[data-theme="dark"] button[class*="-secondary-btn"],
body.dark-theme button[class*="-secondary-btn"] {
  background: #162032 !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  color: #cbd5e1 !important;
}

[data-theme="dark"] .btn-secondary:hover,
body.dark-theme .btn-secondary:hover,
[data-theme="dark"] button[class*="-secondary-btn"]:hover,
body.dark-theme button[class*="-secondary-btn"]:hover {
  background: #1e293b !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
  color: #f8fafc !important;
}

[data-theme="dark"] .chip,
body.dark-theme .chip,
[data-theme="dark"] .filter-chip,
body.dark-theme .filter-chip,
[data-theme="dark"] .hd-chip,
body.dark-theme .hd-chip {
  background: #162032 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: #cbd5e1 !important;
}

[data-theme="dark"] .chip:hover,
body.dark-theme .chip:hover,
[data-theme="dark"] .filter-chip:hover,
body.dark-theme .filter-chip:hover {
  background: #1e293b !important;
  color: #f8fafc !important;
}

[data-theme="dark"] .chip.active,
body.dark-theme .chip.active,
[data-theme="dark"] .filter-chip.active,
body.dark-theme .filter-chip.active {
  background: rgba(59, 130, 246, 0.2) !important;
  border-color: rgba(59, 130, 246, 0.4) !important;
  color: #93c5fd !important;
}
/* Badges & Pills in Dark Mode */
[data-theme="dark"] .badge,
body.dark-theme .badge,
[data-theme="dark"] .badge-upgrade,
body.dark-theme .badge-upgrade,
[data-theme="dark"] .badge-primary,
body.dark-theme .badge-primary,
[data-theme="dark"] .badge-info,
body.dark-theme .badge-info,
[data-theme="dark"] .status-pill,
body.dark-theme .status-pill,
[data-theme="dark"] .status-pill-active,
body.dark-theme .status-pill-active {
  background: rgba(59, 130, 246, 0.18) !important;
  color: #93c5fd !important;
  border: 1px solid rgba(59, 130, 246, 0.35) !important;
}

[data-theme="dark"] .badge-success,
body.dark-theme .badge-success,
[data-theme="dark"] .status-pill-success,
body.dark-theme .status-pill-success {
  background: rgba(16, 185, 129, 0.18) !important;
  color: #6ee7b7 !important;
  border: 1px solid rgba(16, 185, 129, 0.35) !important;
}

[data-theme="dark"] .badge-warning,
body.dark-theme .badge-warning,
[data-theme="dark"] .status-pill-warning,
body.dark-theme .status-pill-warning {
  background: rgba(245, 158, 11, 0.18) !important;
  color: #fcd34d !important;
  border: 1px solid rgba(245, 158, 11, 0.35) !important;
}

[data-theme="dark"] .badge-danger,
body.dark-theme .badge-danger,
[data-theme="dark"] .status-pill-danger,
body.dark-theme .status-pill-danger {
  background: rgba(239, 68, 68, 0.18) !important;
  color: #fca5a5 !important;
  border: 1px solid rgba(239, 68, 68, 0.35) !important;
}

/* ══════════════════════════════════════════════════════════
   §8 · SPECIALIZED CARD ARCHETYPES & PATTERNS IN LUXURY DARK
   ══════════════════════════════════════════════════════════ */
[data-theme="dark"] .card-tool,
body.dark-theme .card-tool,
[data-theme="dark"] .card-prompt,
body.dark-theme .card-prompt,
[data-theme="dark"] .card-knowledge,
body.dark-theme .card-knowledge,
[data-theme="dark"] .card-feature,
body.dark-theme .card-feature,
[data-theme="dark"] .card-compact,
body.dark-theme .card-compact,
[data-theme="dark"] .card-hero,
body.dark-theme .card-hero {
  background: #111827 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #f8fafc !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
}

[data-theme="dark"] .card-tool:hover,
body.dark-theme .card-tool:hover,
[data-theme="dark"] .card-prompt:hover,
body.dark-theme .card-prompt:hover,
[data-theme="dark"] .card-knowledge:hover,
body.dark-theme .card-knowledge:hover {
  background: #162032 !important;
  border-color: rgba(59, 130, 246, 0.45) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6) !important;
}

[data-theme="dark"] .card-tool-badge,
body.dark-theme .card-tool-badge {
  background: #1c283d !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .card-prompt-preview,
body.dark-theme .card-prompt-preview {
  background: #0b111c !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #cbd5e1 !important;
}

[data-theme="dark"] .card-knowledge-details-box,
body.dark-theme .card-knowledge-details-box {
  background: #0f172a !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #cbd5e1 !important;
}

[data-theme="dark"] .card-carousel-btn,
body.dark-theme .card-carousel-btn {
  background: #1e293b !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: #f8fafc !important;
}

[data-theme="dark"] .card-carousel-btn:hover,
body.dark-theme .card-carousel-btn:hover {
  background: #3b82f6 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .whale-date-picker-input,
body.dark-theme .whale-date-picker-input,
[data-theme="dark"] .whale-multiselect-trigger,
body.dark-theme .whale-multiselect-trigger {
  background: #111827 !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  color: #f8fafc !important;
}

[data-theme="dark"] .whale-multiselect-dropdown,
body.dark-theme .whale-multiselect-dropdown {
  background: #111827 !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.7) !important;
}

/* ══════════════════════════════════════════════════════════
   §16 · PREMIUM VISUAL CARDS (.card-visual) DARK OVERRIDES
   ══════════════════════════════════════════════════════════ */
[data-theme="dark"] .card-visual,
body.dark-theme .card-visual {
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .card-visual-white,
body.dark-theme .card-visual-white {
  background: #111827 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .card-visual-white .card-visual-title,
body.dark-theme .card-visual-white .card-visual-title {
  color: #f8fafc !important;
}

[data-theme="dark"] .card-visual-white .card-visual-pill,
body.dark-theme .card-visual-white .card-visual-pill {
  color: #94a3b8 !important;
}

[data-theme="dark"] .card-visual-white .card-visual-desc,
body.dark-theme .card-visual-white .card-visual-desc {
  color: #cbd5e1 !important;
}

[data-theme="dark"] .card-visual-white .card-visual-cta,
body.dark-theme .card-visual-white .card-visual-cta {
  background: #ffffff !important;
  color: #0f172a !important;
}

[data-theme="dark"] .card-visual-white .card-visual-fav,
body.dark-theme .card-visual-white .card-visual-fav {
  background: rgba(17, 24, 39, 0.8) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  color: #94a3b8 !important;
}

[data-theme="dark"] .card-visual-hero-3d img,
body.dark-theme .card-visual-hero-3d img {
  filter: drop-shadow(-8px 14px 24px rgba(0, 0, 0, 0.6));
}

[data-theme="dark"] .card-visual:hover .card-visual-hero-3d img,
body.dark-theme .card-visual:hover .card-visual-hero-3d img {
  filter: drop-shadow(-12px 20px 32px rgba(0, 0, 0, 0.8));
}