/* ==========================================================================
   SERVORA / HOME APPLIANCE REPAIR PLATFORM — DARK MODE STYLESHEET
   ========================================================================== */

html.dark-mode {
  --primary: #3B82F6;
  --primary-hover: #60A5FA;
  --primary-light: rgba(59, 130, 246, 0.18);
  --accent: #22D3EE;
  --accent-amber: #F59E0B;
  --accent-green: #10B981;

  --bg-body: #0B0F19;
  --bg-surface: #151D2A;
  --bg-subtle: #1E293B;
  --border-color: #334155;
  --border-hover: #475569;

  --text-main: #F8FAFC;
  --text-muted: #CBD5E1;
  --text-light: #94A3B8;
  --text-inverse: #0F172A;
}

/* Base Body & Headings */
html.dark-mode body {
  background-color: var(--bg-body);
  color: var(--text-main);
}

html.dark-mode h1,
html.dark-mode h2,
html.dark-mode h3,
html.dark-mode h4,
html.dark-mode h5,
html.dark-mode h6 {
  color: var(--text-main);
}

/* Hero Section Dark Mode */
html.dark-mode .hero-section {
  background: linear-gradient(135deg, #090D16 0%, #111827 100%);
}

html.dark-mode .hero-badge {
  background-color: rgba(59, 130, 246, 0.15);
  color: #60A5FA;
}

html.dark-mode .hero-title {
  color: #F8FAFC;
}

html.dark-mode .hero-title highlight {
  color: #38BDF8;
  background: linear-gradient(120deg, rgba(30, 58, 138, 0.4) 0%, rgba(6, 182, 212, 0.3) 100%);
}

html.dark-mode .hero-description {
  color: #CBD5E1;
}

html.dark-mode .hero-trust-row {
  border-top-color: #334155;
}

html.dark-mode .trust-icon {
  background-color: rgba(59, 130, 246, 0.2);
  color: #60A5FA;
}

html.dark-mode .trust-text strong {
  color: #F8FAFC;
}

html.dark-mode .trust-text span {
  color: #CBD5E1;
}

/* Shell & Headers */
html.dark-mode .site-header-wrapper {
  background-color: var(--bg-body);
}

html.dark-mode .header-topbar {
  background-color: #0B0F19;
  border-bottom-color: #1E293B;
}

html.dark-mode .topbar-info-item,
html.dark-mode .topbar-info-item span,
html.dark-mode .topbar-info-item strong {
  color: #CBD5E1;
}

html.dark-mode .header-main {
  background-color: rgba(21, 29, 42, 0.95);
  border-bottom-color: var(--border-color);
}

html.dark-mode .header-main.scrolled {
  background-color: rgba(21, 29, 42, 0.98);
}

html.dark-mode .nav-link {
  color: #E2E8F0;
}

html.dark-mode .nav-link:hover,
html.dark-mode .nav-link.active {
  color: #60A5FA;
}

html.dark-mode .brand-logo-text {
  color: #F8FAFC;
}

html.dark-mode .dashboard-header-badge {
  border-color: rgba(34, 211, 238, 0.5);
  color: #22D3EE;
  background-color: rgba(34, 211, 238, 0.12);
}

html.dark-mode .dashboard-profile {
  background-color: #1E293B;
  color: #F8FAFC;
  border-color: #334155;
}

html.dark-mode .dashboard-profile:hover {
  background-color: #334155;
}

html.dark-mode .dashboard-profile-avatar {
  background-color: #2563EB;
  color: #FFFFFF;
}

html.dark-mode .dashboard-notification span {
  background-color: #EF4444;
  color: #FFFFFF;
}

html.dark-mode .mobile-menu-drawer {
  background-color: #151D2A;
  border-left-color: #334155;
}

html.dark-mode .mobile-nav-link {
  color: #E2E8F0;
}

html.dark-mode .mobile-nav-link:hover,
html.dark-mode .mobile-nav-link.active {
  color: #60A5FA;
}

/* Dropdowns & Submenus */
html.dark-mode .nav-dropdown-menu,
html.dark-mode .mobile-nav-submenu {
  background-color: #1E293B;
  border-color: #334155;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.6);
}

html.dark-mode .nav-dropdown-item {
  color: #E2E8F0;
}

html.dark-mode .nav-dropdown-item:hover,
html.dark-mode .nav-dropdown-item.active {
  background-color: rgba(59, 130, 246, 0.2);
  color: #60A5FA;
}

/* Buttons */
html.dark-mode .btn-primary {
  background-color: #2563EB;
  color: #FFFFFF;
  border-color: #2563EB;
}

html.dark-mode .btn-primary:hover {
  background-color: #1D4ED8;
  color: #FFFFFF;
  border-color: #1D4ED8;
}

html.dark-mode .icon-btn,
html.dark-mode .btn-secondary {
  background-color: #1E293B;
  color: #F8FAFC;
  border-color: #334155;
}

html.dark-mode .icon-btn:hover,
html.dark-mode .btn-secondary:hover {
  background-color: #334155;
  color: #FFFFFF;
  border-color: #475569;
}

html.dark-mode .btn-outline-primary {
  color: #60A5FA;
  border-color: #60A5FA;
  background-color: transparent;
}

html.dark-mode .btn-outline-primary:hover {
  background-color: #2563EB;
  color: #FFFFFF;
  border-color: #2563EB;
}

/* Form Controls & Inputs */
html.dark-mode .form-control,
html.dark-mode select.form-control,
html.dark-mode textarea.form-control {
  background-color: #1E293B;
  color: #F8FAFC;
  border-color: #334155;
}

html.dark-mode .form-control:focus {
  border-color: #3B82F6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.25);
  background-color: #1E293B;
  color: #F8FAFC;
}

html.dark-mode .form-control::placeholder {
  color: #94A3B8;
  opacity: 1;
}

html.dark-mode select.form-control option {
  background-color: #1E293B;
  color: #F8FAFC;
}

html.dark-mode .form-label,
html.dark-mode label,
html.dark-mode .form-group label {
  color: #E2E8F0;
}

html.dark-mode .form-error-msg {
  color: #F87171;
}

/* Cards & Surfaces */
html.dark-mode .card,
html.dark-mode .appliance-tile,
html.dark-mode .testimonial-card,
html.dark-mode .process-step,
html.dark-mode .faq-item,
html.dark-mode .stat-card,
html.dark-mode .hero-float-card,
html.dark-mode .appliance-option-tile,
html.dark-mode .service-card,
html.dark-mode .pricing-card,
html.dark-mode .tracking-result-card,
html.dark-mode .wizard-container,
html.dark-mode .confirmation-card,
html.dark-mode .summary-card,
html.dark-mode .tracking-info-card {
  background-color: #151D2A;
  border-color: #334155;
  color: #F8FAFC;
}

html.dark-mode .faq-header {
  color: #F8FAFC;
}

html.dark-mode .faq-answer,
html.dark-mode .faq-answer p {
  color: #CBD5E1;
}

html.dark-mode .section-subtitle,
html.dark-mode .section-description,
html.dark-mode .hero-description {
  color: #CBD5E1;
}

html.dark-mode .appliance-option-tile.selected {
  border-color: #3B82F6;
  background-color: rgba(59, 130, 246, 0.15);
}

html.dark-mode .appliance-option-tile h4 {
  color: #F8FAFC;
}

html.dark-mode .appliance-option-tile p {
  color: #CBD5E1;
}

/* Dashboard Sidebar */
html.dark-mode .dashboard-sidebar {
  background-color: #151D2A;
  border-color: #334155;
}

html.dark-mode .sidebar-user h4 {
  color: #F8FAFC !important;
}

html.dark-mode .sidebar-user p {
  color: #CBD5E1 !important;
}

html.dark-mode .sidebar-link {
  color: #CBD5E1;
}

html.dark-mode .sidebar-link:hover,
html.dark-mode .sidebar-link.active {
  background-color: rgba(59, 130, 246, 0.15);
  color: #60A5FA;
}

/* Tables */
html.dark-mode .custom-table,
html.dark-mode table {
  color: #F8FAFC;
  border-color: #334155;
}

html.dark-mode .custom-table th,
html.dark-mode table th {
  background-color: #1E293B;
  color: #CBD5E1;
  border-bottom-color: #334155;
}

html.dark-mode .custom-table td,
html.dark-mode table td {
  border-bottom-color: #334155;
  color: #F8FAFC;
}

html.dark-mode .custom-table tr:hover,
html.dark-mode table tbody tr:hover {
  background-color: rgba(30, 41, 59, 0.5);
}

html.dark-mode select.admin-status-select,
html.dark-mode select.admin-tech-select {
  background-color: #1E293B;
  color: #F8FAFC;
  border-color: #475569;
}

/* Stat Cards & Badges */
html.dark-mode .stat-card {
  background-color: #151D2A;
  border-color: #334155;
}

html.dark-mode .stat-card h3 {
  color: #F8FAFC !important;
}

html.dark-mode .stat-card p {
  color: #CBD5E1 !important;
}

html.dark-mode .stat-card-icon {
  background-color: rgba(59, 130, 246, 0.2) !important;
  color: #60A5FA !important;
}

html.dark-mode .status-badge.completed {
  background-color: rgba(16, 185, 129, 0.2);
  color: #34D399;
  border: 1px solid rgba(16, 185, 129, 0.4);
}

html.dark-mode .status-badge.in-progress {
  background-color: rgba(245, 158, 11, 0.2);
  color: #FBBF24;
  border: 1px solid rgba(245, 158, 11, 0.4);
}

html.dark-mode .status-badge.pending,
html.dark-mode .status-badge.received {
  background-color: rgba(59, 130, 246, 0.2);
  color: #60A5FA;
  border: 1px solid rgba(59, 130, 246, 0.4);
}

html.dark-mode .status-step-icon {
  background-color: #1E293B;
  border-color: #475569;
  color: #CBD5E1;
}

html.dark-mode .status-step.completed .status-step-icon {
  background-color: #10B981;
  border-color: #10B981;
  color: #FFFFFF;
}

html.dark-mode .status-step.active .status-step-icon {
  background-color: #2563EB;
  border-color: #60A5FA;
  color: #FFFFFF;
}

/* Footer Overrides */
html.dark-mode .footer-main {
  background-color: #060911;
  border-top-color: #1E293B;
}

html.dark-mode .footer-heading {
  color: #F8FAFC;
}

html.dark-mode .footer-main p,
html.dark-mode .footer-links a,
html.dark-mode .footer-bottom p,
html.dark-mode .footer-bottom a {
  color: #CBD5E1;
}

html.dark-mode .footer-links a:hover,
html.dark-mode .footer-bottom a:hover {
  color: #38BDF8;
}

/* Inline Style Attribute Adapters for Dark Mode */
html.dark-mode [style*="color: var(--primary)"],
html.dark-mode [style*="color: #1E3A8A"] {
  color: #60A5FA !important;
}

html.dark-mode [style*="color: var(--text-muted)"],
html.dark-mode [style*="color: #64748B"],
html.dark-mode [style*="color: #475569"] {
  color: #CBD5E1 !important;
}

html.dark-mode [style*="color: #0F172A"] {
  color: #F8FAFC !important;
}

html.dark-mode [style*="color: #B45309"] {
  color: #FBBF24 !important;
}

html.dark-mode [style*="color: #DC2626"] {
  color: #F87171 !important;
}
