/* Low Margin System Theme Pack (Bootstrap 5.3+) */
/* Works with: document.documentElement.dataset.bsTheme = 'light'|'dark'|'sepia'|'coolblue'|'midnight'|'contrast'|'auto' */

/* -------------------------- Base (applies to all) -------------------------- */
:root {
  /* Brand accents (tweak if needed) */
  --lm-brand: #1389ff;         /* primary accent */
  --lm-brand-2: #00b894;       /* success-ish accent */
  --lm-danger-soft: #f8d7da;
  --lm-muted: #6c757d;

  /* Make badges, cards, and tables look consistent across themes */
  --lm-card-radius: 1rem;
  --lm-card-shadow: 0 8px 24px rgba(0,0,0,.08);
  --lm-card-shadow-dark: 0 8px 24px rgba(0,0,0,.35);
}

.card {
  border-radius: var(--lm-card-radius) !important;
}
.card.lm-soft-shadow {
  box-shadow: var(--lm-card-shadow);
}
[data-bs-theme="dark"] .card.lm-soft-shadow,
[data-bs-theme="midnight"] .card.lm-soft-shadow {
  box-shadow: var(--lm-card-shadow-dark);
}

/* Soft badges that respect theme variables */
.badge-soft-primary   { background: color-mix(in oklab, var(--bs-primary) 18%, transparent); color: var(--bs-primary-text-emphasis, var(--bs-primary)); }
.badge-soft-success   { background: color-mix(in oklab, var(--bs-success) 18%, transparent); color: var(--bs-success-text-emphasis, var(--bs-success)); }
.badge-soft-warning   { background: color-mix(in oklab, var(--bs-warning) 22%, transparent); color: var(--bs-warning-text-emphasis, #8a6d1d); }
.badge-soft-danger    { background: color-mix(in oklab, var(--bs-danger) 18%, transparent);  color: var(--bs-danger-text-emphasis, var(--bs-danger)); }
.badge-soft-info      { background: color-mix(in oklab, var(--bs-info) 18%, transparent);    color: var(--bs-info-text-emphasis, var(--bs-info)); }

/* Gradient buttons using current --bs-primary */
.btn-gradient-primary {
  border: 0;
  color: #fff;
  background-image: linear-gradient(135deg,
    color-mix(in oklab, var(--bs-primary) 92%, #fff 0%),
    color-mix(in oklab, var(--bs-primary) 65%, #000 0%)
  );
}
.btn-gradient-primary:hover { filter: brightness(1.05); }

/* Utilities */
.border-subtle { border-color: color-mix(in oklab, var(--bs-body-color) 10%, transparent) !important; }

/* -------------------------- Light (default) -------------------------- */
[data-bs-theme="light"] {
  color-scheme: light;

  --bs-body-bg: #f7f8fb;
  --bs-body-color: #1f2937;
  --bs-emphasis-color: #0b1220;

  --bs-primary: var(--lm-brand);
  --bs-primary-rgb: 19, 137, 255;

  --bs-secondary: #64748b;
  --bs-success: #16a34a;
  --bs-info: #0ea5e9;
  --bs-warning: #f59e0b;
  --bs-danger: #ef4444;

  --bs-border-color: #e5e7eb;
  --bs-card-bg: #ffffff;
  --bs-card-cap-bg: #ffffff;
  --bs-tertiary-bg: #eef2f7;

  --bs-link-color: var(--bs-primary);
  --bs-link-hover-color: #0f6ed6;
}

/* -------------------------- Dark -------------------------- */
[data-bs-theme="dark"] {
  color-scheme: dark;

  --bs-body-bg: #0f141b;
  --bs-body-color: #d6dde7;
  --bs-emphasis-color: #f3f6fa;

  --bs-primary: #3ea0ff; /* slightly brighter in dark */
  --bs-primary-rgb: 62, 160, 255;

  --bs-secondary: #9aa4b2;
  --bs-success: #22c55e;
  --bs-info: #38bdf8;
  --bs-warning: #fbbf24;
  --bs-danger: #f87171;

  --bs-border-color: #233041;
  --bs-card-bg: #151c26;
  --bs-card-cap-bg: #151c26;
  --bs-tertiary-bg: #0b0f15;

  --bs-link-color: var(--bs-primary);
  --bs-link-hover-color: #8cc6ff;
}

/* -------------------------- Sepia (Warm Reading) -------------------------- */
[data-bs-theme="sepia"] {
  color-scheme: light;

  --bs-body-bg: #f4ecd8;
  --bs-body-color: #3b2f2f;
  --bs-emphasis-color: #2b2323;

  --bs-primary: #a67744;
  --bs-primary-rgb: 166, 119, 68;

  --bs-secondary: #8b6b4f;
  --bs-success: #5f8f5f;
  --bs-info: #6a8aa6;
  --bs-warning: #b68b2e;
  --bs-danger: #9b524d;

  --bs-border-color: #e4d6b8;
  --bs-card-bg: #fff9ef;
  --bs-card-cap-bg: #fff9ef;
  --bs-tertiary-bg: #efe5cf;

  --bs-link-color: #8c5f32;
  --bs-link-hover-color: #744d28;
}

/* -------------------------- Cool Blue (Corporate) -------------------------- */
[data-bs-theme="coolblue"] {
  color-scheme: light;

  --bs-body-bg: #e9f0f8;
  --bs-body-color: #0a2a43;
  --bs-emphasis-color: #061a29;

  --bs-primary: #2a6fdb; /* Go T&T-friendly */
  --bs-primary-rgb: 42, 111, 219;

  --bs-secondary: #4b6b8a;
  --bs-success: #1f9d6f;
  --bs-info: #147fb6;
  --bs-warning: #d08a1f;
  --bs-danger: #cc3a42;

  --bs-border-color: #cdd9e6;
  --bs-card-bg: #ffffff;
  --bs-card-cap-bg: #ffffff;
  --bs-tertiary-bg: #dfe8f3;

  --bs-link-color: var(--bs-primary);
  --bs-link-hover-color: #1b56b4;
}

/* -------------------------- Midnight (AMOLED) -------------------------- */
[data-bs-theme="midnight"] {
  color-scheme: dark;

  --bs-body-bg: #000000;
  --bs-body-color: #e8eef6;
  --bs-emphasis-color: #ffffff;

  --bs-primary: #0d6efd;
  --bs-primary-rgb: 13, 110, 253;

  --bs-secondary: #a0a9b7;
  --bs-success: #22c55e;
  --bs-info: #60a5fa;
  --bs-warning: #fbbf24;
  --bs-danger: #f87171;

  --bs-border-color: #1b1f27;
  --bs-card-bg: #0a0a0a;
  --bs-card-cap-bg: #0a0a0a;
  --bs-tertiary-bg: #050505;

  --bs-link-color: var(--bs-primary);
  --bs-link-hover-color: #6aa2ff;
}

/* -------------------------- High Contrast (Accessibility) -------------------------- */
[data-bs-theme="contrast"] {
  color-scheme: light;

  --bs-body-bg: #ffffff;
  --bs-body-color: #000000;
  --bs-emphasis-color: #000000;

  --bs-primary: #000000;
  --bs-primary-rgb: 0, 0, 0;

  --bs-secondary: #000000;
  --bs-success: #006400;
  --bs-info: #003366;
  --bs-warning: #7f6000;
  --bs-danger: #8b0000;

  --bs-border-color: #000000;
  --bs-card-bg: #ffffff;
  --bs-card-cap-bg: #ffffff;
  --bs-tertiary-bg: #f2f2f2;

  --bs-link-color: #0000ee;
  --bs-link-hover-color: #0000aa;

  /* Force outlines for focus */
  *:focus {
    outline: 3px solid #000 !important;
    outline-offset: 2px !important;
    box-shadow: none !important;
  }
}

/* -------------------------- Optional: “Auto” support --------------------------
   If you set data-bs-theme="auto", these prefers-color-scheme queries will
   map to light/dark without changing your JS.
----------------------------------------------------------------------------- */
[data-bs-theme="auto"] {
  /* fallback values if neither query applies (rare) */
  --bs-body-bg: #f7f8fb;
  --bs-body-color: #1f2937;
  --bs-card-bg: #ffffff;
}
@media (prefers-color-scheme: dark) {
  [data-bs-theme="auto"] {
    color-scheme: dark;
    --bs-body-bg: #0f141b;
    --bs-body-color: #d6dde7;
    --bs-card-bg: #151c26;
    --bs-primary: #3ea0ff;
  }
}
@media (prefers-color-scheme: light) {
  [data-bs-theme="auto"] {
    color-scheme: light;
    --bs-body-bg: #f7f8fb;
    --bs-body-color: #1f2937;
    --bs-card-bg: #ffffff;
    --bs-primary: var(--lm-brand);
  }
}

/* -------------------------- Component polish -------------------------- */
.navbar,
.offcanvas,
.dropdown-menu {
  background-color: var(--bs-card-bg) !important;
  border-color: var(--bs-border-color) !important;
}

.table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--bs-body-color);
  --bs-table-border-color: var(--bs-border-color);
}

.form-control, .form-select, .form-check-input {
  background-color: color-mix(in oklab, var(--bs-card-bg) 94%, transparent);
  color: var(--bs-body-color);
  border-color: var(--bs-border-color);
}
.form-control:focus, .form-select:focus {
  box-shadow: 0 0 0 .25rem color-mix(in oklab, var(--bs-primary) 25%, transparent);
  border-color: color-mix(in oklab, var(--bs-primary) 55%, var(--bs-border-color));
}

/* Cards that need a faint tinted header (optional utility) */
.card.cap-tint .card-header {
  background: color-mix(in oklab, var(--bs-primary) 8%, var(--bs-card-bg));
  border-bottom-color: var(--bs-border-color);
}

/* Subtle separators */
hr, .hr {
  border-top: 1px solid var(--bs-border-color);
}

/* Links in muted contexts */
.text-muted a { color: var(--bs-link-color); }

/* -------------------------- Button Visibility Fixes (Dark Mode) -------------------------- */
[data-bs-theme='dark'] .btn-secondary,
[data-bs-theme='dark'] .btn-outline-secondary {
  color: #fff !important;
  background-color: #343a40 !important;
  border-color: #495057 !important;
}

[data-bs-theme='dark'] .btn-secondary:hover,
[data-bs-theme='dark'] .btn-outline-secondary:hover {
  background-color: #495057 !important;
  border-color: #6c757d !important;
}

/* Specific fixes for Back / Logout buttons */
[data-bs-theme='dark'] .btn-back,
[data-bs-theme='dark'] .btn-logout {
  color: #fff !important;
  background: linear-gradient(90deg, #0d6efd 0%, #198754 100%) !important;
  border: none !important;
}

[data-bs-theme='dark'] .btn-back:hover,
[data-bs-theme='dark'] .btn-logout:hover {
  background: linear-gradient(90deg, #198754 0%, #0d6efd 100%) !important;
  color: #fff !important;
}

/* Make sure outline buttons like "Back to Admin" stay visible */
[data-bs-theme='dark'] .btn-outline-primary {
  color: #9cc9ff !important;
  border-color: #9cc9ff !important;
}
[data-bs-theme='dark'] .btn-outline-primary:hover {
  background-color: #0d6efd !important;
  color: #fff !important;
}