/* Global Dark Mode Fixes for Configuration Pages */

/* Fix any remaining white backgrounds */
.dark body {
  background-color: #111827 !important;
  color: #f3f4f6 !important;
}

/* Apply background only to main content containers, not navbar/footer */
.dark main .container,
.dark .page-content {
  background-color: #111827 !important;
  color: #f3f4f6 !important;
}

/* Ensure navbar and footer containers don't get overridden */
.dark nav .container,
.dark footer .container {
  background-color: transparent !important;
}

/* Fix form controls globally */
.dark input[type="text"],
.dark input[type="email"],
.dark input[type="password"],
.dark input[type="number"],
.dark select,
.dark textarea,
.dark .form-control {
  background-color: #374151 !important;
  border-color: #4b5563 !important;
  color: #e5e7eb !important;
}

.dark input[type="text"]:focus,
.dark input[type="email"]:focus,
.dark input[type="password"]:focus,
.dark input[type="number"]:focus,
.dark select:focus,
.dark textarea:focus,
.dark .form-control:focus {
  background-color: #374151 !important;
  border-color: #60a5fa !important;
  color: #e5e7eb !important;
  box-shadow: 0 0 0 0.2rem rgba(96, 165, 250, 0.25) !important;
}

/* Fix tables globally */
.dark table,
.dark .table {
  background-color: #1f2937 !important;
  color: #e5e7eb !important;
}

.dark th,
.dark .table th {
  background-color: #374151 !important;
  color: #f3f4f6 !important;
  border-color: #4b5563 !important;
}

.dark td,
.dark .table td {
  background-color: #1f2937 !important;
  color: #e5e7eb !important;
  border-color: #374151 !important;
}

/* Fix cards globally */
.dark .card {
  background-color: #1f2937 !important;
  border-color: #374151 !important;
}

.dark .card-header {
  background-color: #374151 !important;
  border-color: #4b5563 !important;
  color: #f3f4f6 !important;
}

.dark .card-body {
  background-color: #1f2937 !important;
  color: #e5e7eb !important;
}

/* Fix alerts */
.dark .alert-warning {
  background-color: #78350f !important;
  border-color: #92400e !important;
  color: #fef3c7 !important;
}

.dark .alert-info {
  background-color: #1e3a8a !important;
  border-color: #1e40af !important;
  color: #dbeafe !important;
}

/* Fix buttons */
.dark .btn-primary {
  background-color: #3b82f6 !important;
  border-color: #3b82f6 !important;
}

.dark .btn-primary:hover {
  background-color: #2563eb !important;
  border-color: #2563eb !important;
}

.dark .btn-secondary {
  background-color: #4b5563 !important;
  border-color: #4b5563 !important;
}

.dark .btn-secondary:hover {
  background-color: #6b7280 !important;
  border-color: #6b7280 !important;
}

.dark .btn-outline-primary {
  color: #60a5fa !important;
  border-color: #60a5fa !important;
}

.dark .btn-outline-primary:hover {
  background-color: #3b82f6 !important;
  border-color: #3b82f6 !important;
  color: #ffffff !important;
}

/* Fix text colors */
.dark h1, .dark h2, .dark h3, .dark h4, .dark h5, .dark h6 {
  color: #f3f4f6 !important;
}

.dark .text-muted {
  color: #9ca3af !important;
}

.dark label {
  color: #e5e7eb !important;
}

/* Fix specific inline styles */
.dark [style*="background: white"],
.dark [style*="background:white"],
.dark [style*="background-color: white"],
.dark [style*="background-color:white"] {
  background-color: #1f2937 !important;
}

/* Force override specific white backgrounds */
.dark .card[style*="background"],
.dark .modal[style*="background"],
.dark .alert[style*="background"] {
  background-color: inherit !important;
}

/* Fix specific configuration page elements */
.dark .config-section,
.dark .version-info-card,
.dark .preview-section,
.dark .data-preview {
  background-color: #1f2937 !important;
  border-color: #374151 !important;
}

.dark .table-responsive {
  background-color: #111827 !important;
  border-color: #374151 !important;
}

/* Fix wizard mode specific elements */
.dark .wizard-content {
  background-color: #1f2937 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

.dark .file-preview-card,
.dark .column-list,
.dark .review-section {
  background-color: #111827 !important;
  border-color: #374151 !important;
}

.dark .column-item {
  background-color: #1f2937 !important;
  border-color: #374151 !important;
}

.dark .column-item:hover {
  background-color: #374151 !important;
}

.dark .column-item.selected {
  background-color: #1e3a8a !important;
  border-color: #3b82f6 !important;
}

.dark .mapping-card {
  background-color: #111827 !important;
  border-color: #374151 !important;
}

.dark .mapping-card.mapped {
  background-color: #064e3b !important;
  border-color: #10b981 !important;
}

/* Ensure proper cascade for nested elements */
.dark .container * {
  color: inherit;
}

/* Fix checkbox and radio styles */
.dark input[type="checkbox"],
.dark input[type="radio"] {
  background-color: #374151 !important;
  border-color: #4b5563 !important;
}

.dark input[type="checkbox"]:checked,
.dark input[type="radio"]:checked {
  background-color: #3b82f6 !important;
  border-color: #3b82f6 !important;
}

/* Fix select dropdown options */
.dark select option {
  background-color: #374151 !important;
  color: #e5e7eb !important;
}

/* Fix any remaining form elements */
.dark .form-check-label {
  color: #e5e7eb !important;
}

.dark .form-text {
  color: #9ca3af !important;
}

/* Fix progress bars */
.dark .progress {
  background-color: #374151 !important;
}

.dark .progress-bar {
  background-color: #3b82f6 !important;
}

/* Ensure icons maintain proper color */
.dark .fas,
.dark .far,
.dark .fab {
  color: inherit;
}

/* Fix modal backgrounds if any */
.dark .modal-content {
  background-color: #1f2937 !important;
  color: #e5e7eb !important;
}

.dark .modal-header,
.dark .modal-footer {
  border-color: #374151 !important;
}

/* Ensure proper specificity for overrides */
.dark body .container .card-body {
  background-color: #1f2937 !important;
}

.dark body .container table {
  background-color: #1f2937 !important;
}

/* Ensure footer text has no background */
footer .text-gray-500,
footer .text-gray-400,
.dark footer .text-gray-500,
.dark footer .text-gray-400,
footer a,
.dark footer a,
footer div,
.dark footer div {
  background-color: transparent !important;
  background: none !important;
}

/* Remove any box shadows that might reveal white backgrounds */
.dark .card,
.dark .wizard-content,
.dark .progress-section {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}