/* === Theme Contrast Fixes — WCAG AA compliant light/dark mode === */
/* Targets: text-muted, text-secondary, badges, icons, table-striped, forms */

/* ---------- Light mode overrides ---------- */
[data-bs-theme="light"] {
  --app-text-primary: #1a1d23;
  --app-text-secondary: #4a5568;
  --app-text-muted: #5a6577;
  --app-border: #d1d5db;
  --app-icon: #4a5568;
  --app-link: #377dff;
  --app-surface-alt: #f4f6f9;
  --app-badge-muted-bg: #e5e7eb;
  --app-badge-muted-text: #4b5563;
}

/* ---------- Dark mode overrides ---------- */
[data-bs-theme="dark"] {
  --app-text-primary: #e8eaed;
  --app-text-secondary: #b0b8c4;
  --app-text-muted: #9aa0a6;
  --app-border: #3c4043;
  --app-icon: #b0b8c4;
  --app-link: #8ab4f8;
  --app-surface-alt: #202124;
  --app-badge-muted-bg: #3c4043;
  --app-badge-muted-text: #c4c7c5;
}

/* Global text defaults */
body {
  color: var(--app-text-primary);
}

/* text-muted: Bootstrap default is too low-contrast in dark mode */
.text-muted {
  color: var(--app-text-muted) !important;
}

/* text-secondary: improve readability */
.text-secondary {
  color: var(--app-text-secondary) !important;
}

/* Links in dark mode */
[data-bs-theme="dark"] a:not(.btn):not(.badge):not(.nav-link):not(.dropdown-item) {
  color: var(--app-link);
}

/* Badge contrast: muted badges */
.badge.bg-secondary-subtle,
.badge.text-secondary {
  background-color: var(--app-badge-muted-bg) !important;
  color: var(--app-badge-muted-text) !important;
}

/* Iconify icons: ensure readable in both themes */
iconify-icon {
  color: var(--app-icon);
}

/* Buttons: keep icon color matching button text */
.btn iconify-icon {
  color: inherit;
}

/* Table text in dark mode */
[data-bs-theme="dark"] .table {
  color: var(--app-text-primary);
}

[data-bs-theme="dark"] .table th {
  color: var(--app-text-muted);
}

/* Form controls in dark mode */
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select {
  color: var(--app-text-primary);
  background-color: #303134;
  border-color: var(--app-border);
}

[data-bs-theme="dark"] .form-control::placeholder {
  color: var(--app-text-muted);
}

/* Card headers in dark mode */
[data-bs-theme="dark"] .card-header {
  border-bottom-color: var(--app-border);
}

/* Dropdown items in dark mode */
[data-bs-theme="dark"] .dropdown-menu {
  background-color: #2d2e30;
  border-color: var(--app-border);
}

[data-bs-theme="dark"] .dropdown-item {
  color: var(--app-text-primary);
}

[data-bs-theme="dark"] .dropdown-item:hover {
  background-color: #3c4043;
}

/* Page title / heading contrast */
h1, h2, h3, h4, h5, h6,
.page-title-box h4 {
  color: var(--app-text-primary);
}

/* Alert background in dark mode */
[data-bs-theme="dark"] .alert {
  border-color: var(--app-border);
}

/* Modal in dark mode */
[data-bs-theme="dark"] .modal-content {
  background-color: #2d2e30;
  border-color: var(--app-border);
}

[data-bs-theme="dark"] .modal-header {
  border-bottom-color: var(--app-border);
}

[data-bs-theme="dark"] .modal-footer {
  border-top-color: var(--app-border);
}

/* Badge: ensure text contrast on colored badges */
.badge {
  font-weight: 500;
}

/* bg-light class in dark mode */
[data-bs-theme="dark"] .bg-light {
  background-color: var(--app-surface-alt) !important;
}

/* small text in dark mode */
[data-bs-theme="dark"] small {
  color: var(--app-text-muted);
}

/* Ensure focus rings are visible in both themes */
:focus-visible {
  outline: 2px solid var(--app-link) !important;
  outline-offset: 2px;
}