/* =====================================================================
   ABS Vendor — global dark mode tokens.
   Loaded everywhere (landing + dashboard). Page-specific overrides go
   in their own stylesheets (dashboard.css has its own block).
   ================================================================== */

:root {
  --abs-bg: #ffffff;
  --abs-bg-alt: #f8fafc;
  --abs-bg-card: #ffffff;
  --abs-bg-elevated: #ffffff;
  --abs-text: #0f172a;
  --abs-text-muted: #64748b;
  --abs-border: #e2e8f0;
  --abs-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
  --abs-input-bg: #ffffff;
  --abs-input-border: #e2e8f0;
  --abs-input-text: #0f172a;
  --abs-link: #2563eb;
}

[data-abs-theme="dark"] {
  --abs-bg: #0b1220;
  --abs-bg-alt: #0f172a;
  --abs-bg-card: #131c2e;
  --abs-bg-elevated: #1a2236;
  --abs-text: #e2e8f0;
  --abs-text-muted: #94a3b8;
  --abs-border: #1e293b;
  --abs-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
  --abs-input-bg: #131c2e;
  --abs-input-border: #2a3348;
  --abs-input-text: #e2e8f0;
  --abs-link: #60a5fa;
  color-scheme: dark;
}

/* ---------- Bootstrap defaults patched for dark ---------- */
[data-abs-theme="dark"] body {
  background: var(--abs-bg);
  color: var(--abs-text);
}

[data-abs-theme="dark"] .card,
[data-abs-theme="dark"] .modal-content,
[data-abs-theme="dark"] .dropdown-menu,
[data-abs-theme="dark"] .list-group-item,
[data-abs-theme="dark"] .accordion-item,
[data-abs-theme="dark"] .accordion-button,
[data-abs-theme="dark"] .toast {
  background-color: var(--abs-bg-card);
  color: var(--abs-text);
  border-color: var(--abs-border);
}

[data-abs-theme="dark"] .text-muted,
[data-abs-theme="dark"] .text-secondary {
  color: var(--abs-text-muted) !important;
}

[data-abs-theme="dark"] .bg-light,
[data-abs-theme="dark"] .bg-white {
  background-color: var(--abs-bg-card) !important;
  color: var(--abs-text) !important;
}

[data-abs-theme="dark"] .border,
[data-abs-theme="dark"] .border-top,
[data-abs-theme="dark"] .border-bottom,
[data-abs-theme="dark"] .border-start,
[data-abs-theme="dark"] .border-end,
[data-abs-theme="dark"] .border-light {
  border-color: var(--abs-border) !important;
}

[data-abs-theme="dark"] .table {
  color: var(--abs-text);
  --bs-table-bg: transparent;
  --bs-table-color: var(--abs-text);
  --bs-table-striped-color: var(--abs-text);
  --bs-table-striped-bg: rgba(255, 255, 255, 0.03);
  --bs-table-hover-bg: rgba(255, 255, 255, 0.05);
  --bs-table-border-color: var(--abs-border);
}
[data-abs-theme="dark"] .table > :not(caption) > * > * {
  background-color: transparent;
  color: var(--abs-text);
  border-bottom-color: var(--abs-border);
}

[data-abs-theme="dark"] .form-control,
[data-abs-theme="dark"] .form-select,
[data-abs-theme="dark"] textarea,
[data-abs-theme="dark"] input[type="text"],
[data-abs-theme="dark"] input[type="email"],
[data-abs-theme="dark"] input[type="number"],
[data-abs-theme="dark"] input[type="password"],
[data-abs-theme="dark"] input[type="search"],
[data-abs-theme="dark"] input[type="tel"],
[data-abs-theme="dark"] input[type="date"],
[data-abs-theme="dark"] input[type="datetime-local"],
[data-abs-theme="dark"] input[type="month"],
[data-abs-theme="dark"] input[type="url"] {
  background-color: var(--abs-input-bg);
  border-color: var(--abs-input-border);
  color: var(--abs-input-text);
}
[data-abs-theme="dark"] .form-control::placeholder,
[data-abs-theme="dark"] textarea::placeholder {
  color: var(--abs-text-muted);
  opacity: 0.7;
}
[data-abs-theme="dark"] .form-control:disabled,
[data-abs-theme="dark"] .form-select:disabled {
  background-color: rgba(255, 255, 255, 0.04);
  color: var(--abs-text-muted);
}

[data-abs-theme="dark"] .input-group-text {
  background-color: var(--abs-bg-elevated);
  border-color: var(--abs-input-border);
  color: var(--abs-text);
}

[data-abs-theme="dark"] hr {
  border-color: var(--abs-border);
  opacity: 1;
}

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

[data-abs-theme="dark"] code,
[data-abs-theme="dark"] pre {
  background-color: var(--abs-bg-elevated);
  color: #f1c46c;
  border-color: var(--abs-border);
}

/* SweetAlert2 dark surface */
[data-abs-theme="dark"] .swal2-popup {
  background: var(--abs-bg-card) !important;
  color: var(--abs-text) !important;
}
[data-abs-theme="dark"] .swal2-html-container,
[data-abs-theme="dark"] .swal2-title {
  color: var(--abs-text) !important;
}
[data-abs-theme="dark"] .swal2-input,
[data-abs-theme="dark"] .swal2-textarea,
[data-abs-theme="dark"] .swal2-select {
  background: var(--abs-input-bg) !important;
  color: var(--abs-input-text) !important;
  border-color: var(--abs-input-border) !important;
}

/* ---------- The toggle pill (used by both topbars) ---------- */
.abs-theme-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--abs-border);
  background: var(--abs-bg-card);
  color: var(--abs-text);
  cursor: pointer;
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.abs-theme-toggle:hover {
  background: var(--abs-bg-elevated);
}
.abs-theme-toggle .abs-theme-toggle__icon {
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.abs-theme-toggle .abs-theme-toggle__icon svg {
  width: 16px;
  height: 16px;
}
[data-abs-theme="light"] .abs-theme-toggle .abs-theme-toggle__icon--moon { display: inline-flex; }
[data-abs-theme="light"] .abs-theme-toggle .abs-theme-toggle__icon--sun  { display: none; }
[data-abs-theme="dark"]  .abs-theme-toggle .abs-theme-toggle__icon--moon { display: none; }
[data-abs-theme="dark"]  .abs-theme-toggle .abs-theme-toggle__icon--sun  { display: inline-flex; }
[data-abs-theme="light"] .abs-theme-toggle .abs-theme-toggle__label::before { content: "Dark"; }
[data-abs-theme="dark"]  .abs-theme-toggle .abs-theme-toggle__label::before { content: "Light"; }

/* Hide label on small screens — icon alone is enough */
@media (max-width: 600px) {
  .abs-theme-toggle .abs-theme-toggle__label { display: none; }
  .abs-theme-toggle { padding: 6px; }
}