/* ============================================
   DARK MODE STYLES
   ============================================ */

body.dark-mode {
  background-color: var(--darker);
  color: #e5e7eb;
}

body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6 {
  color: #f3f4f6;
}

body.dark-mode a {
  color: var(--primary-light);
}

body.dark-mode a:hover {
  color: var(--primary);
}

body.dark-mode .card {
  background: #1f2937;
  border-color: #374151;
  color: #e5e7eb;
}

body.dark-mode .card:hover {
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3);
}

body.dark-mode .card-header {
  border-color: #374151;
  background: #111827;
}

body.dark-mode .card-footer {
  border-color: #374151;
}

body.dark-mode input[type="text"],
body.dark-mode input[type="email"],
body.dark-mode input[type="password"],
body.dark-mode input[type="number"],
body.dark-mode input[type="search"],
body.dark-mode input[type="url"],
body.dark-mode textarea,
body.dark-mode select {
  background: #374151;
  color: #e5e7eb;
  border-color: #4b5563;
}

body.dark-mode input[type="text"]:focus,
body.dark-mode input[type="email"]:focus,
body.dark-mode input[type="password"]:focus,
body.dark-mode input[type="number"]:focus,
body.dark-mode input[type="search"]:focus,
body.dark-mode input[type="url"]:focus,
body.dark-mode textarea:focus,
body.dark-mode select:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2);
}

body.dark-mode .table thead {
  background: #374151;
  border-color: #4b5563;
}

body.dark-mode .table th {
  color: #f3f4f6;
}

body.dark-mode .table td {
  border-color: #374151;
}

body.dark-mode .table tbody tr:hover {
  background: #1f2937;
}

body.dark-mode .pagination a,
body.dark-mode .pagination span {
  border-color: #374151;
  color: #e5e7eb;
}

body.dark-mode .pagination a:hover {
  background: var(--primary);
  border-color: var(--primary);
  color: white;
}

body.dark-mode .btn-outline {
  color: var(--primary-light);
  border-color: var(--primary-light);
}

body.dark-mode .btn-outline:hover {
  background: var(--primary);
  border-color: var(--primary);
  color: white;
}

body.dark-mode .alert-success {
  background: #064e3b;
  border-color: var(--success);
  color: #d1fae5;
}

body.dark-mode .alert-danger {
  background: #7f1d1d;
  border-color: var(--danger);
  color: #fee2e2;
}

body.dark-mode .alert-warning {
  background: #78350f;
  border-color: var(--warning);
  color: #fef3c7;
}

body.dark-mode .alert-info {
  background: #1e3a8a;
  border-color: #3b82f6;
  color: #dbeafe;
}

body.dark-mode .badge-primary {
  background: rgba(99, 102, 241, 0.3);
  color: var(--primary-light);
}

body.dark-mode .badge-success {
  background: rgba(16, 185, 129, 0.3);
  color: var(--success);
}

body.dark-mode .badge-danger {
  background: rgba(239, 68, 68, 0.3);
  color: var(--danger);
}

body.dark-mode .badge-warning {
  background: rgba(245, 158, 11, 0.3);
  color: var(--warning);
}

body.dark-mode .breadcrumb span {
  color: #6b7280;
}

body.dark-mode .form-text {
  color: #9ca3af;
}

body.dark-mode .text-muted {
  color: #9ca3af;
}

body.dark-mode .user-title {
  color: #9ca3af;
}

body.dark-mode ::-webkit-scrollbar-track {
  background: #374151;
}

body.dark-mode ::-webkit-scrollbar-thumb {
  background: #6b7280;
}

body.dark-mode ::-webkit-scrollbar-thumb:hover {
  background: #9ca3af;
}

/* Dark Mode Specific Shadows */
body.dark-mode .shadow-md {
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3);
}

body.dark-mode .shadow-lg {
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3);
}

body.dark-mode .shadow-xl {
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.3);
}

/* Dark Mode Backgrounds */
body.dark-mode .bg-light {
  background: #374151;
  color: #e5e7eb;
}

body.dark-mode .bg-primary {
  background: var(--primary);
  color: white;
}

/* Dark Mode Links in Dark Background */
body.dark-mode .link-light {
  color: var(--primary-light);
}

body.dark-mode .link-light:hover {
  color: #c7d2fe;
}

/* Dark Mode Code Blocks */
body.dark-mode code {
  background: #374151;
  color: #e5e7eb;
  padding: 2px 6px;
  border-radius: 3px;
}

body.dark-mode pre {
  background: #1f2937;
  color: #e5e7eb;
  padding: 1rem;
  border-radius: var(--radius);
  border: 1px solid #374151;
  overflow-x: auto;
}

/* Dark Mode Selection */
body.dark-mode ::selection {
  background: var(--primary);
  color: white;
}

/* Dark Mode Placeholder */
body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder {
  color: #9ca3af;
}