/* ═══════════════════════════════════════════════════════
   SAFO — Dark Mode Theme
   Activated via data-theme="dark" on <html>
   ═══════════════════════════════════════════════════════ */

/* ── CSS Variables Override ──────────────────────────── */
[data-theme="dark"] {
  --primary: #5FC48E;
  --primary-dark: #49B47B;
  --primary-light: #7DD4A8;
  --primary-bg: #0F2922;
  --success: #34D399;
  --success-bg: #064E3B;
  --warning: #FBBF24;
  --error: #F87171;
  --error-bg: #450A0A;
  --info: #60A5FA;
  --white: #111827;
  --bg: #111111;
  --gray-50: #1a1a1a;
  --gray-100: #1a1a1a;
  --gray-200: #334155;
  --gray-300: #475569;
  --gray-400: #94A3B8;
  --gray-500: #CBD5E1;
  --gray-600: #E2E8F0;
  --gray-700: #F1F5F9;
  --gray-800: #F8FAFC;
  --gray-900: #FFFFFF;

  /* Commerce design-system tokens */
  --ds-color-bg: #0b1220;
  --ds-color-surface: #172337;
  --ds-color-surface-2: #1d304a;
  --ds-color-surface-3: #223653;
  --ds-color-text: #f8fafc;
  --ds-color-text-soft: #b7c4d6;
  --ds-color-text-muted: #91a1b8;
  --ds-color-line: #2d405b;
  --ds-color-line-strong: #365070;
  --ds-color-accent: #ff8a4c;
  --ds-color-accent-strong: #ffb086;
  --ds-color-accent-soft: #2c211b;
  --ds-color-brand-dark: #111c2f;
  --ds-color-brand-dark-soft: #172a43;
  --ds-color-sale: #ff8a8a;
  --ds-color-sale-soft: #3b2028;
  --ds-color-success: #8ee2b3;
  --ds-color-success-soft: #123c31;
  --ds-color-warning: #ffd166;
  --ds-color-warning-soft: #3b2c16;
  --ds-color-info: #8eb8ff;
  --ds-color-info-soft: #172f52;
}

/* ── Global Dark Backgrounds ─────────────────────────── */
[data-theme="dark"] body {
  background: var(--bg);
  color: #E2E8F0;
}

[data-theme="dark"] .admin-layout,
[data-theme="dark"] .seller-layout {
  background: var(--bg);
}

[data-theme="dark"] .admin-main,
[data-theme="dark"] .seller-main {
  background: #111111;
}

[data-theme="dark"] .admin-sidebar,
[data-theme="dark"] .seller-sidebar {
  background: #1a1a1a;
  border-color: #334155;
}

[data-theme="dark"] .admin-topbar,
[data-theme="dark"] .seller-topbar {
  background: #1a1a1a;
  border-color: #334155;
  color: #E2E8F0;
}

/* ── Cards ───────────────────────────────────────────── */
[data-theme="dark"] .admin-stat-card,
[data-theme="dark"] .seller-stat-card,
[data-theme="dark"] .product-card-seller,
[data-theme="dark"] .rfq-card,
[data-theme="dark"] .review-card,
[data-theme="dark"] .order-card,
[data-theme="dark"] .settings-card,
[data-theme="dark"] .profile-seller-grid a {
  background: #1a1a1a;
  border-color: #334155;
  color: #E2E8F0;
}

[data-theme="dark"] .seller-welcome {
  background: linear-gradient(135deg, #1a1a1a, #0F2922);
  border-color: #334155;
}

/* ── Forms ───────────────────────────────────────────── */
[data-theme="dark"] .form-input,
[data-theme="dark"] .form-select,
[data-theme="dark"] .form-textarea {
  background: #1a1a1a;
  border-color: #334155;
  color: #E2E8F0;
}

[data-theme="dark"] .safo-select-pro {
  background: #172033 !important;
  color: #F8FAFC !important;
  border-color: #475569 !important;
  box-shadow: none;
}

[data-theme="dark"] .safo-select-pro:hover { border-color: #64748B !important; }
[data-theme="dark"] .safo-select-pro option { background: #172033; color: #F8FAFC; }
[data-theme="dark"] .safo-select-shell > span { color: #CBD5E1 !important; }

[data-theme="dark"] .form-input:focus,
[data-theme="dark"] .form-select:focus,
[data-theme="dark"] .form-textarea:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(95, 196, 142, 0.15);
}

[data-theme="dark"] .form-input::placeholder,
[data-theme="dark"] .form-textarea::placeholder {
  color: #64748B;
}

[data-theme="dark"] .form-label {
  color: #CBD5E1;
}

/* ── Tables ──────────────────────────────────────────── */
[data-theme="dark"] .admin-table,
[data-theme="dark"] .seller-table {
  background: #1a1a1a;
  color: #E2E8F0;
}

[data-theme="dark"] .admin-table thead th,
[data-theme="dark"] .seller-table thead th {
  background: #111111;
  color: #94A3B8;
  border-color: #334155;
}

[data-theme="dark"] .admin-table tbody td,
[data-theme="dark"] .seller-table tbody td {
  border-color: #1a1a1a;
}

[data-theme="dark"] .admin-table tbody tr:hover,
[data-theme="dark"] .seller-table tbody tr:hover {
  background: #334155;
}

/* ── Badges ──────────────────────────────────────────── */
[data-theme="dark"] .badge-success { background: #064E3B; color: #34D399; }
[data-theme="dark"] .badge-warning { background: #451A03; color: #FBBF24; }
[data-theme="dark"] .badge-error { background: #450A0A; color: #F87171; }
[data-theme="dark"] .badge-info { background: #1E3A5F; color: #60A5FA; }
[data-theme="dark"] .badge-primary { background: #0F2922; color: #5FC48E; }
[data-theme="dark"] .badge-gray { background: #334155; color: #94A3B8; }

/* ── Buttons ─────────────────────────────────────────── */
[data-theme="dark"] .btn-secondary {
  background: #334155;
  border-color: #475569;
  color: #E2E8F0;
}

[data-theme="dark"] .btn-secondary:hover {
  background: #475569;
}

[data-theme="dark"] .btn-outline {
  background: transparent;
  border-color: #475569;
  color: #E2E8F0;
}

[data-theme="dark"] .btn-outline:hover {
  background: #334155;
}

[data-theme="dark"] .btn-light {
  background: #334155;
  color: #E2E8F0;
}

/* ── Navigation ──────────────────────────────────────── */
[data-theme="dark"] .admin-nav-item,
[data-theme="dark"] .seller-nav-item {
  color: #94A3B8;
}

[data-theme="dark"] .admin-nav-item:hover,
[data-theme="dark"] .seller-nav-item:hover {
  background: #334155;
  color: #E2E8F0;
}

[data-theme="dark"] .admin-nav-item.active,
[data-theme="dark"] .seller-nav-item.active {
  background: var(--primary-bg);
  color: var(--primary);
}

/* ── Bottom Nav ──────────────────────────────────────── */
[data-theme="dark"] .bottom-nav {
  background: #1a1a1a;
  border-color: #334155;
}

[data-theme="dark"] .bottom-nav-item {
  color: #64748B;
}

[data-theme="dark"] .bottom-nav-item.active {
  color: var(--primary);
}

/* ── Modals ──────────────────────────────────────────── */
[data-theme="dark"] .modal-content,
[data-theme="dark"] .modal-body {
  background: #1a1a1a;
  color: #E2E8F0;
}

[data-theme="dark"] .modal-header {
  border-color: #334155;
}

[data-theme="dark"] .modal-overlay {
  background: rgba(0, 0, 0, 0.7);
}

/* ── Toast ───────────────────────────────────────────── */
[data-theme="dark"] .toast {
  background: #334155;
  color: #E2E8F0;
  border-color: #475569;
}

/* ── Notifications ───────────────────────────────────── */
[data-theme="dark"] .notif-dropdown {
  background: #1a1a1a;
  border-color: #334155;
}

[data-theme="dark"] .notif-item {
  border-color: #334155;
}

[data-theme="dark"] .notif-item.unread {
  background: #0F2922;
}

[data-theme="dark"] .notif-item:hover {
  background: #334155;
}

/* ── Product Cards ───────────────────────────────────── */
[data-theme="dark"] .product-card {
  background: #1a1a1a;
  border-color: #334155;
}

[data-theme="dark"] .product-card:hover {
  border-color: var(--primary);
}

/* ── Search ──────────────────────────────────────────── */
[data-theme="dark"] .search-bar,
[data-theme="dark"] .seller-search-box {
  background: #1a1a1a;
  border-color: #334155;
}

[data-theme="dark"] .search-bar input,
[data-theme="dark"] .seller-search-box input {
  background: transparent;
  color: #E2E8F0;
}

/* ── Empty States ────────────────────────────────────── */
[data-theme="dark"] .empty-state {
  color: #64748B;
}

[data-theme="dark"] .empty-icon {
  color: #475569;
}

/* ── Wallet ──────────────────────────────────────────── */
[data-theme="dark"] .wallet-balance-card {
  background: linear-gradient(135deg, #1a1a1a, #0F2922);
  border-color: #334155;
}

[data-theme="dark"] .wallet-tx {
  border-color: #334155;
}

/* ── Wizard ──────────────────────────────────────────── */
[data-theme="dark"] .wizard-content {
  background: #1a1a1a;
  border-color: #334155;
}

[data-theme="dark"] .wizard-step-circle {
  background: #334155;
  border-color: #475569;
}

[data-theme="dark"] .wizard-step.active .wizard-step-circle {
  background: var(--primary);
  border-color: var(--primary);
}

/* ── Charts ──────────────────────────────────────────── */
[data-theme="dark"] canvas {
  filter: invert(0.85) hue-rotate(180deg);
}

/* ── Scrollbars ──────────────────────────────────────── */
[data-theme="dark"] ::-webkit-scrollbar {
  width: 8px;
}

[data-theme="dark"] ::-webkit-scrollbar-track {
  background: #111111;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: #334155;
  border-radius: 4px;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background: #475569;
}

/* ── Quick Actions ───────────────────────────────────── */
[data-theme="dark"] .quick-action-btn {
  background: #1a1a1a;
  border-color: #334155;
  color: #E2E8F0;
}

[data-theme="dark"] .quick-action-btn:hover {
  border-color: var(--primary);
  background: #0F2922;
}

/* ── Analytics Bars ──────────────────────────────────── */
[data-theme="dark"] .analytics-bar-item {
  color: #CBD5E1;
}

[data-theme="dark"] .progress-bar {
  background: #334155;
}

/* ── Auth Pages ──────────────────────────────────────── */
[data-theme="dark"] .auth-page {
  background: var(--bg);
}

[data-theme="dark"] .auth-form {
  background: #1a1a1a;
  border-color: #334155;
}

[data-theme="dark"] .admin-login-card {
  background: #1a1a1a;
  border-color: #334155;
}

/* ── Detail Pages ────────────────────────────────────── */
[data-theme="dark"] .detail-header {
  background: #1a1a1a;
  border-color: #334155;
}

/* ── PWA Install Banner ──────────────────────────────── */
[data-theme="dark"] .pwa-install-banner {
  background: #1a1a1a;
  border-color: #334155;
}

/* ── Category Cards ──────────────────────────────────── */
[data-theme="dark"] .category-card {
  background: #1a1a1a;
  border-color: #334155;
}

/* ── Review Summary ──────────────────────────────────── */
[data-theme="dark"] .review-summary {
  background: #1a1a1a;
  border-color: #334155;
}

[data-theme="dark"] .review-bar {
  background: #334155;
}

/* ── Tiered Pricing Table ────────────────────────────── */
[data-theme="dark"] .tiered-pricing-table {
  background: #1a1a1a;
  border-color: #334155;
}

[data-theme="dark"] .tiered-header {
  background: #111111;
  color: #94A3B8;
}

/* ── Shipping Options ────────────────────────────────── */
[data-theme="dark"] .shipping-option {
  background: #1a1a1a;
  border-color: #334155;
  color: #E2E8F0;
}

[data-theme="dark"] .shipping-option.active {
  border-color: var(--primary);
  background: #0F2922;
}

/* ── Preview Card ────────────────────────────────────── */
[data-theme="dark"] .preview-card {
  background: #1a1a1a;
  border-color: #334155;
}

/* ── Admin Alerts ────────────────────────────────────── */
[data-theme="dark"] .admin-alert {
  background: #1a1a1a;
  border-color: #334155;
  color: #E2E8F0;
}

/* ── Settings Tabs ───────────────────────────────────── */
[data-theme="dark"] .settings-tab {
  color: #94A3B8;
  border-color: #334155;
}

[data-theme="dark"] .settings-tab.active {
  color: var(--primary);
  border-color: var(--primary);
}

[data-theme="dark"] .settings-tab-content {
  background: #1a1a1a;
  border-color: #334155;
}

/* ── Cover Section ───────────────────────────────────── */
[data-theme="dark"] .settings-cover {
  filter: brightness(0.7);
}

/* ── Misc ────────────────────────────────────────────── */
[data-theme="dark"] hr,
[data-theme="dark"] .divider {
  border-color: #334155;
}

[data-theme="dark"] .text-gray-400 { color: #94A3B8; }
[data-theme="dark"] .text-gray-500 { color: #CBD5E1; }

[data-theme="dark"] a {
  color: var(--primary-light);
}

[data-theme="dark"] .admin-cat-group {
  background: #1a1a1a;
  border-color: #334155;
}

[data-theme="dark"] .admin-cat-header {
  border-color: #334155;
}

[data-theme="dark"] .admin-subcat-item {
  border-color: #334155;
}

[data-theme="dark"] .admin-subcat-item:hover {
  background: #334155;
}

/* ── Admin contrast hardening ─────────────────────────── */
[data-theme="dark"] .admin-layout,
[data-theme="dark"] .admin-main {
  background: #0b1220 !important;
  color: #e5edf7;
}

[data-theme="dark"] .admin-sidebar {
  background: #111c2f !important;
  border-inline-end-color: #26364d !important;
}

[data-theme="dark"] .admin-topbar {
  background: rgba(17, 28, 47, .92) !important;
  border-bottom: 1px solid #26364d !important;
  color: #f8fafc !important;
}

[data-theme="dark"] .admin-topbar h2,
[data-theme="dark"] .admin-sidebar-header h3,
[data-theme="dark"] .admin-section-header h3,
[data-theme="dark"] .admin-section-header h4,
[data-theme="dark"] .admin-content h1,
[data-theme="dark"] .admin-content h2,
[data-theme="dark"] .admin-content h3,
[data-theme="dark"] .admin-content h4,
[data-theme="dark"] .admin-content strong,
[data-theme="dark"] .admin-content label {
  color: #f8fafc !important;
}

[data-theme="dark"] .admin-content p,
[data-theme="dark"] .admin-content small,
[data-theme="dark"] .admin-content .text-muted,
[data-theme="dark"] .admin-content .text-secondary,
[data-theme="dark"] .admin-content .admin-hint,
[data-theme="dark"] .admin-content .section-subtitle {
  color: #b7c4d6 !important;
}

[data-theme="dark"] .admin-nav-label {
  color: #8191a8 !important;
}

[data-theme="dark"] .admin-nav-meta {
  color: #91a1b8 !important;
}

[data-theme="dark"] .admin-nav-item {
  color: #b6c4d7 !important;
}

[data-theme="dark"] .admin-nav-item:hover,
[data-theme="dark"] .admin-nav-item:focus-visible {
  color: #ffffff !important;
  background: #243653 !important;
  border-color: #365070 !important;
}

[data-theme="dark"] .admin-nav-item.active {
  color: #8ee2b3 !important;
  background: #123c31 !important;
  border-color: #286b53 !important;
}

[data-theme="dark"] .admin-user-badge {
  background: #243653;
  border-color: #365070;
  color: #dce8f5;
}

[data-theme="dark"] .admin-hub-hero,
[data-theme="dark"] .admin-hub-card,
[data-theme="dark"] .admin-alert,
[data-theme="dark"] .admin-stat-card,
[data-theme="dark"] .admin-table-wrap {
  background: #172337 !important;
  border-color: #2d405b !important;
  color: #e5edf7 !important;
}

[data-theme="dark"] .admin-hub-hero {
  background: linear-gradient(135deg, #172337, #132b2b) !important;
}

[data-theme="dark"] .admin-hub-hero h3,
[data-theme="dark"] .admin-hub-card-copy strong {
  color: #f8fafc !important;
}

[data-theme="dark"] .admin-hub-hero p,
[data-theme="dark"] .admin-hub-card-copy small {
  color: #b7c4d6 !important;
}

[data-theme="dark"] .admin-hub-hero-icon,
[data-theme="dark"] .admin-hub-card-icon {
  color: #8ee2b3 !important;
  background: #123c31 !important;
}

[data-theme="dark"] .admin-hub-card:hover,
[data-theme="dark"] .admin-hub-card:focus-visible {
  background: #1d304a !important;
  border-color: #e87932 !important;
}

[data-theme="dark"] .admin-icon-button {
  background: #172337;
  border-color: #365070;
  color: #b7c4d6;
}

[data-theme="dark"] .admin-icon-button:hover,
[data-theme="dark"] .admin-icon-button:focus-visible {
  background: #123c31;
  border-color: #49b47b;
  color: #8ee2b3;
}

[data-theme="dark"] .admin-table,
[data-theme="dark"] .admin-table tbody,
[data-theme="dark"] .admin-table tr {
  background: #172337 !important;
  color: #e5edf7 !important;
}

[data-theme="dark"] .admin-table th {
  background: #101b2d !important;
  color: #dce8f5 !important;
  border-color: #2d405b !important;
}

[data-theme="dark"] .admin-table td {
  color: #d7e2ef !important;
  border-color: #2d405b !important;
}

[data-theme="dark"] .admin-table tbody tr:hover {
  background: #21334d !important;
}

[data-theme="dark"] .admin-content .form-input,
[data-theme="dark"] .admin-content .form-select,
[data-theme="dark"] .admin-content .form-textarea,
[data-theme="dark"] .admin-content input,
[data-theme="dark"] .admin-content select,
[data-theme="dark"] .admin-content textarea {
  background: #101b2d !important;
  border-color: #365070 !important;
  color: #f8fafc !important;
}

[data-theme="dark"] .admin-content input::placeholder,
[data-theme="dark"] .admin-content textarea::placeholder {
  color: #8293aa !important;
}

[data-theme="dark"] .admin-content .empty-state,
[data-theme="dark"] .admin-content .empty-state p {
  color: #b7c4d6 !important;
}

[data-theme="dark"] .admin-content .badge-gray {
  background: #2d405b !important;
  color: #dce8f5 !important;
}

@media (max-width: 640px) {
  [data-theme="dark"] .admin-topbar {
    background: #111c2f !important;
  }
}

[data-theme="dark"] .admin-dashboard-panel,
[data-theme="dark"] .admin-dashboard-action {
  background: #172337 !important;
  border-color: #2d405b !important;
  color: #e5edf7 !important;
}

[data-theme="dark"] .admin-dashboard-panel h3,
[data-theme="dark"] .admin-dashboard-action > div:last-child {
  color: #f8fafc !important;
}

[data-theme="dark"] .admin-dashboard-action:hover {
  background: #1d304a !important;
  border-color: #49b47b !important;
}

[data-theme="dark"] .admin-dashboard-charts,
[data-theme="dark"] .admin-dashboard-quick-actions {
  color: #e5edf7;
}

/* ── Universal Contrast & Inversion Safeguards ─────────────────── */
[data-theme="dark"] p,
[data-theme="dark"] span,
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5,
[data-theme="dark"] h6,
[data-theme="dark"] label,
[data-theme="dark"] li,
[data-theme="dark"] a,
[data-theme="dark"] td,
[data-theme="dark"] th {
  color: inherit;
}

[data-theme="dark"] .admin-table,
[data-theme="dark"] table {
  color: #f8fafc !important;
  background-color: #172337 !important;
}

[data-theme="dark"] .admin-table th,
[data-theme="dark"] table th {
  background-color: #1d304a !important;
  color: #f8fafc !important;
  border-color: #2d405b !important;
}

[data-theme="dark"] .admin-table td,
[data-theme="dark"] table td {
  color: #e5edf7 !important;
  border-color: #2d405b !important;
}

[data-theme="dark"] .admin-hub-card,
[data-theme="dark"] .admin-hub-hero,
[data-theme="dark"] .admin-stat-card,
[data-theme="dark"] .card,
[data-theme="dark"] .modal-content {
  background-color: #172337 !important;
  color: #f8fafc !important;
  border-color: #2d405b !important;
}

[data-theme="dark"] .admin-hub-card:hover {
  background-color: #1d304a !important;
  border-color: #ff8a4c !important;
}

[data-theme="dark"] small,
[data-theme="dark"] .text-muted,
[data-theme="dark"] .text-secondary {
  color: #b7c4d6 !important;
}

[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea {
  background-color: #111c2f !important;
  color: #f8fafc !important;
  border-color: #2d405b !important;
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
  color: #899bb5 !important;
}

/* ── Legacy Inline Style Inversion ────────────────────────────────
   Some older views still emit inline colors. These guarded selectors
   keep those views readable without changing their semantic states. */
[data-theme="dark"] [style*="color:#111827"],
[data-theme="dark"] [style*="color: #111827"],
[data-theme="dark"] [style*="color:#1F2937"],
[data-theme="dark"] [style*="color: #1F2937"],
[data-theme="dark"] [style*="color:#1f2937"],
[data-theme="dark"] [style*="color: #1f2937"] {
  color: #f8fafc !important;
}

[data-theme="dark"] [style*="color:#374151"],
[data-theme="dark"] [style*="color: #374151"],
[data-theme="dark"] [style*="color:#4B5563"],
[data-theme="dark"] [style*="color: #4B5563"],
[data-theme="dark"] [style*="color:#4b5563"],
[data-theme="dark"] [style*="color: #4b5563"] {
  color: #e5edf7 !important;
}

[data-theme="dark"] [style*="color:#6B7280"],
[data-theme="dark"] [style*="color: #6B7280"],
[data-theme="dark"] [style*="color:#6b7280"],
[data-theme="dark"] [style*="color: #6b7280"],
[data-theme="dark"] [style*="color:#9CA3AF"],
[data-theme="dark"] [style*="color: #9CA3AF"],
[data-theme="dark"] [style*="color:#9ca3af"],
[data-theme="dark"] [style*="color: #9ca3af"] {
  color: #b7c4d6 !important;
}

[data-theme="dark"] [style*="background:white"],
[data-theme="dark"] [style*="background: white"],
[data-theme="dark"] [style*="background:#FFF"],
[data-theme="dark"] [style*="background: #FFF"],
[data-theme="dark"] [style*="background:#fff"],
[data-theme="dark"] [style*="background: #fff"] {
  background-color: #172337 !important;
}

[data-theme="dark"] [style*="background:#F9FAFB"],
[data-theme="dark"] [style*="background: #F9FAFB"],
[data-theme="dark"] [style*="background:#f9fafb"],
[data-theme="dark"] [style*="background: #f9fafb"],
[data-theme="dark"] [style*="background:#F3F4F6"],
[data-theme="dark"] [style*="background: #F3F4F6"],
[data-theme="dark"] [style*="background:#f3f4f6"],
[data-theme="dark"] [style*="background: #f3f4f6"] {
  background-color: #1d304a !important;
}

[data-theme="dark"] [style*="#E5E7EB"],
[data-theme="dark"] [style*="#e5e7eb"],
[data-theme="dark"] [style*="#D1D5DB"],
[data-theme="dark"] [style*="#d1d5db"] {
  border-color: #2d405b !important;
}
