/* Dark Theme */

[data-theme="dark"] {
  /* Primary Colors */
  --primary: #3b82f6;
  --primary-hover: #60a5fa;
  --primary-light: #1e3a5f;
  --primary-dark: #1e40af;

  /* Secondary Colors */
  --secondary: #64748b;
  --secondary-hover: #94a3b8;
  --secondary-light: #334155;

  /* Accent Colors */
  --accent: #a78bfa;
  --accent-hover: #c4b5fd;
  --accent-light: #2e1065;

  /* Status Colors */
  --success: #34d399;
  --warning: #fbbf24;
  --error: #f87171;
  --info: #38bdf8;

  /* Background Colors */
  --bg-primary: #0f172a;
  --bg-secondary: #1e293b;
  --bg-tertiary: #334155;
  --bg-hover: #475569;

  /* Text Colors */
  --text-primary: #f8fafc;
  --text-secondary: #cbd5e1;
  --text-muted: #64748b;
  --text-light: #475569;
  --text-inverse: #0f172a;

  /* Border Colors */
  --border: #334155;
  --border-hover: #475569;
  --border-focus: #3b82f6;

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2);
  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.25);
  --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.3);
  --shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.35);
  --shadow-2xl: 0 25px 50px rgba(0, 0, 0, 0.4);
  --shadow-inner: inset 0 2px 4px rgba(0, 0, 0, 0.2);

  /* Code Syntax Highlighting */
  --code-bg: #1e293b;
  --code-text: #f8fafc;
  --code-comment: #64748b;
  --code-keyword: #f87171;
  --code-string: #34d399;
  --code-number: #38bdf8;
  --code-function: #a78bfa;
  --code-variable: #fbbf24;
  --code-operator: #60a5fa;
  --code-punctuation: #cbd5e1;
  --code-tag: #34d399;
  --code-attribute: #60a5fa;
  --code-value: #fbbf24;

  /* Scrollbar */
  --scrollbar-track: #1e293b;
  --scrollbar-thumb: #475569;
  --scrollbar-thumb-hover: #64748b;

  /* Selection */
  --selection-bg: #1e3a5f;
  --selection-text: #f8fafc;

  /* Focus */
  --focus-ring: rgba(59, 130, 246, 0.3);

  /* Tooltips */
  --tooltip-bg: #1e293b;
  --tooltip-text: #f8fafc;

  /* Modal Backdrop */
  --modal-backdrop: rgba(0, 0, 0, 0.7);

  /* Context Menu */
  --context-menu-bg: #1e293b;
  --context-menu-border: #334155;
  --context-menu-hover: #334155;

  /* Progress */
  --progress-bg: #334155;
  --progress-fill: #3b82f6;

  /* Skeleton */
  --skeleton-base: #334155;
  --skeleton-highlight: #475569;

  /* File Icons */
  --file-icon-default: #64748b;
  --file-icon-folder: #fbbf24;
  --file-icon-document: #60a5fa;
  --file-icon-image: #34d399;
  --file-icon-video: #f87171;
  --file-icon-audio: #a78bfa;
  --file-icon-archive: #fbbf24;
  --file-icon-code: #38bdf8;

  /* Search Highlights */
  --search-highlight-bg: #422006;
  --search-highlight-text: #fbbf24;
  --search-highlight-border: #92400e;

  /* Notifications */
  --notification-bg: #1e293b;
  --notification-border: #334155;
  --notification-shadow: 0 10px 15px rgba(0, 0, 0, 0.3);

  /* Charts */
  --chart-primary: #60a5fa;
  --chart-secondary: #a78bfa;
  --chart-tertiary: #34d399;
  --chart-quaternary: #fbbf24;
  --chart-quinary: #f87171;

  /* Gradients */
  --gradient-primary: linear-gradient(135deg, #3b82f6 0%, #60a5fa 100%);
  --gradient-secondary: linear-gradient(135deg, #a78bfa 0%, #c4b5fd 100%);
  --gradient-success: linear-gradient(135deg, #34d399 0%, #10b981 100%);
  --gradient-warning: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
  --gradient-error: linear-gradient(135deg, #f87171 0%, #ef4444 100%);

  /* Overlays */
  --overlay-light: rgba(255, 255, 255, 0.1);
  --overlay-dark: rgba(0, 0, 0, 0.7);

  /* Hover States */
  --hover-opacity: 0.9;
  --hover-transform: translateY(-2px);

  /* Active States */
  --active-opacity: 1;
  --active-transform: translateY(0);

  /* Disabled States */
  --disabled-opacity: 0.4;
  --disabled-cursor: not-allowed;

  /* Transitions */
  --transition-colors: background-color var(--transition-fast) var(--ease-in-out),
                       color var(--transition-fast) var(--ease-in-out),
                       border-color var(--transition-fast) var(--ease-in-out);
  --transition-transform: transform var(--transition-fast) var(--ease-in-out);
  --transition-shadow: box-shadow var(--transition-fast) var(--ease-in-out);
  --transition-all: all var(--transition-fast) var(--ease-in-out);
}

/* Dark Mode Specific Adjustments */
[data-theme="dark"] .btn-primary {
  background-color: var(--primary);
  color: var(--text-primary);
}

[data-theme="dark"] .btn-outline {
  border-color: var(--border);
  color: var(--text-primary);
}

[data-theme="dark"] .btn-outline:hover {
  background-color: var(--bg-tertiary);
  border-color: var(--primary);
}

[data-theme="dark"] .card {
  background-color: var(--bg-secondary);
  border-color: var(--border);
}

[data-theme="dark"] .modal-content {
  background-color: var(--bg-secondary);
  border: 1px solid var(--border);
}

[data-theme="dark"] .alert-success {
  background-color: rgba(34, 211, 153, 0.1);
  border-color: var(--success);
  color: var(--success);
}

[data-theme="dark"] .alert-warning {
  background-color: rgba(251, 191, 36, 0.1);
  border-color: var(--warning);
  color: var(--warning);
}

[data-theme="dark"] .alert-error {
  background-color: rgba(248, 113, 113, 0.1);
  border-color: var(--error);
  color: var(--error);
}

[data-theme="dark"] .alert-info {
  background-color: rgba(56, 189, 248, 0.1);
  border-color: var(--info);
  color: var(--info);
}

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

[data-theme="dark"] .toast {
  background-color: var(--bg-secondary);
  border-color: var(--border);
}

[data-theme="dark"] code {
  background-color: var(--bg-tertiary);
  color: var(--text-primary);
}

[data-theme="dark"] pre {
  background-color: var(--bg-tertiary);
  color: var(--text-primary);
}

[data-theme="dark"] .comparison-table th {
  background-color: var(--bg-tertiary);
}

[data-theme="dark"] .results-table thead {
  background-color: var(--bg-tertiary);
}

[data-theme="dark"] .results-table tbody tr:hover {
  background-color: var(--bg-tertiary);
}

[data-theme="dark"] .results-table tbody tr.selected {
  background-color: var(--primary-light);
}

[data-theme="dark"] .match-context {
  background-color: var(--bg-tertiary);
}

[data-theme="dark"] .match-highlight {
  background-color: var(--search-highlight-bg);
  color: var(--search-highlight-text);
}

/* Dark Mode Scrollbar */
[data-theme="dark"] ::-webkit-scrollbar-track {
  background: var(--scrollbar-track);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover);
}

/* Dark Mode Selection */
[data-theme="dark"] ::selection {
  background-color: var(--selection-bg);
  color: var(--selection-text);
}

/* Dark Mode Focus */
[data-theme="dark"] :focus-visible {
  outline-color: var(--primary);
  box-shadow: 0 0 0 3px var(--focus-ring);
}