/* BIMT theme overrides (Light/Dark) */

:root{
  /* Shared palette */
  --bg: #0b1020;
  --text: rgba(255,255,255,0.92);
  --muted: rgba(255,255,255,0.7);

  --card-bg: rgba(255,255,255,0.07);
  --card-border: rgba(255,255,255,0.12);
  --card-shadow: 0 12px 28px rgba(0,0,0,0.22);

  --navbar-bg: rgba(11,16,32,0.55);
  --navbar-border: rgba(255,255,255,0.08);
  --navbar-link: rgba(255,255,255,0.78);
  --navbar-link-active-text: #0b1020;

  --footer-bg: rgba(0,0,0,0.22);
  --footer-border: rgba(255,255,255,0.08);
  --footer-link: rgba(255,255,255,0.8);

  --heading: #ffffff;
  --content: rgba(255,255,255,0.78);

  /* Form + inputs */
  --input-bg: rgba(255,255,255,0.06);
  --input-border: rgba(255,255,255,0.16);
  --input-text: rgba(255,255,255,0.92);
  --input-placeholder: rgba(255,255,255,0.55);

  transition: background-color 250ms ease, color 250ms ease;
}

[data-theme="light"]{
  --bg: #f6f7fb;
  --text: rgba(15,23,42,0.92);
  --muted: rgba(15,23,42,0.65);

  --heading: #0b1020;
  --content: rgba(15,23,42,0.78);

  --card-bg: rgba(255,255,255,0.72);
  --card-border: rgba(15,23,42,0.10);
  --card-shadow: 0 12px 28px rgba(15,23,42,0.10);

  --navbar-bg: rgba(255,255,255,0.66);
  --navbar-border: rgba(15,23,42,0.10);
  --navbar-link: rgba(15,23,42,0.72);
  --navbar-link-active-text: #0b1020;

  --footer-bg: rgba(255,255,255,0.75);
  --footer-border: rgba(15,23,42,0.10);
  --footer-link: rgba(15,23,42,0.78);

  --input-bg: rgba(15,23,42,0.05);
  --input-border: rgba(15,23,42,0.14);
  --input-text: rgba(15,23,42,0.92);
  --input-placeholder: rgba(15,23,42,0.55);
}

body{
  background-color: var(--bg);
  color: var(--text);
  transition: background-color 250ms ease, color 250ms ease;
}

/******** Visibility safety for headings & content ********/
/* Strict visibility rules */
/* Light mode: dark text */
[data-theme="light"] h1,[data-theme="light"] h2,[data-theme="light"] h3,[data-theme="light"] h4,[data-theme="light"] h5,[data-theme="light"] h6,
[data-theme="light"] .section-title,[data-theme="light"] .section-subtitle,
[data-theme="light"] p,[data-theme="light"] li,[data-theme="light"] label,
[data-theme="light"] .card-glass,
[data-theme="light"] .accordion-body,
[data-theme="light"] .navbar .nav-link,
[data-theme="light"] .footer,
[data-theme="light"] .footer a,
[data-theme="light"] .btn,
[data-theme="light"] .badge,
[data-theme="light"] .form-control,
[data-theme="light"] .form-select,
[data-theme="light"] textarea{
  color: rgba(15,23,42,0.92) !important;
}

/* Dark mode: light text */
h1,h2,h3,h4,h5,h6,.section-title,.section-subtitle,
p,li,label,
.card-glass,
.accordion-body,
.navbar .nav-link,
.footer,
.footer a,
.btn,
.badge,
.form-control,
.form-select,
textarea{
  color: rgba(255,255,255,0.92) !important;
}

/* Utility classes used in markup */
.text-white-50{ color: var(--content) !important; }
.text-white-70{ color: var(--content) !important; }
span,li,div,button,label{ color: inherit; }

/******** Badge / chip readability ********/
/*
  Bootstrap often uses classes like `text-bg-dark` for pills/chips.
  Ensure badge text never becomes dark text on dark/color backgrounds in Light mode.
*/
.badge, .tag, .chip{
  color: inherit;
}

/******** Light-mode fixes for Bootstrap text utilities ********/
/*
  Some markup uses Bootstrap classes like `.text-white-50`.
  In Light theme, those can become low-contrast on pale/light card surfaces.
  Force them to use theme-aware `--content` (dark text) in Light mode.
*/
[data-theme="light"] .text-white-50,
[data-theme="light"] .text-white-70{
  /* Use dark theme-aware text in Light mode */
  color: var(--content) !important;
}




/* Force text contrast for dark-colored Bootstrap badge variants */
.badge.text-bg-dark,
.badge.text-bg-dark.border,
.badge.text-bg-dark.border.border-light-subtle{
  color: rgba(255,255,255,0.92) !important;
}

/* If badges use inline bg colors, keep text readable */
.badge[class*="bg-"]{
  color: rgba(255,255,255,0.92) !important;
}
[data-theme="light"] .badge[class*="bg-"]{
  color: rgba(255,255,255,0.96) !important;
}

/* Make border-based pills readable regardless of theme */
.border-light-subtle{
  border-color: rgba(255,255,255,0.16) !important;
}




/******** Navbar overrides ********/
.navbar{
  background: var(--navbar-bg) !important;
  border-bottom: 1px solid var(--navbar-border);
  transition: background-color 250ms ease, border-color 250ms ease;
}
.navbar .nav-link{
  color: var(--navbar-link) !important;
}
.navbar .nav-link:hover{ color: var(--text) !important; }
.navbar .nav-link.active{
  color: var(--navbar-link-active-text) !important;
  background: linear-gradient(135deg, rgba(251,191,36,0.95), rgba(124,58,237,0.12));
}

/******** Card overrides ********/
.card-glass{
  background: var(--card-bg) !important;
  border: 1px solid var(--card-border) !important;
  box-shadow: var(--card-shadow) !important;
}

/******** Accordion ********/
.accordion-button{
  color: var(--text) !important;
  background: var(--input-bg) !important;
}

/******** Footer ********/
.footer{
  background: var(--footer-bg) !important;
  border-top: 1px solid var(--footer-border) !important;
}
.footer a{ color: var(--footer-link) !important; }
.footer a:hover{ color: var(--text) !important; }

/******** Inputs / selects / textareas ********/
.form-control, .form-select, textarea{
  background: var(--input-bg) !important;
  border-color: var(--input-border) !important;
  color: var(--input-text) !important;
}
.form-control::placeholder, .form-select::placeholder, textarea::placeholder{ color: var(--input-placeholder) !important; }