/* Map EZCO tokens → Bootstrap / AdminLTE / app theme vars */
body.ezco-gui {
  --bs-primary: var(--ez-forest);
  --bs-body-bg: var(--ez-bg);
  --bs-body-color: var(--ez-text);
  --bs-border-color: var(--ez-border-soft);
  --theme-700: var(--ez-sage-700);
  --theme-800: var(--ez-forest);
  --theme-900: var(--ez-forest);
  --primary: var(--ez-forest);
  /* Follow html data-color-mode (light|dark) for native controls */
  color-scheme: inherit;
}
body.ezco-gui .skin-blue .main-header .navbar,
body.ezco-gui .skin-blue-light .main-header .navbar,
body.ezco-gui .skin-black .main-header .navbar {
  background-color: var(--ez-forest);
}
body.ezco-gui .skin-blue .main-header .logo,
body.ezco-gui .skin-blue-light .main-header .logo {
  background-color: var(--ez-forest);
  color: var(--ez-bone);
}
body.ezco-gui .btn-primary,
body.ezco-gui .bg-primary {
  background-color: var(--ez-forest) !important;
  border-color: var(--ez-forest) !important;
  color: var(--ez-bone) !important;
}
body.ezco-gui .btn-danger,
body.ezco-gui .label-danger {
  background-color: var(--ez-danger) !important;
  border-color: var(--ez-danger) !important;
  color: #fff !important;
}
/* Soft success pills — do not force dark bg (was dark-on-dark / illegible in page headers) */
body.ezco-gui .label-success {
  background-color: color-mix(in srgb, var(--ez-sage-700) 18%, var(--ez-tint)) !important;
  color: var(--ez-sage-700) !important;
  border-color: color-mix(in srgb, var(--ez-sage-700) 35%, var(--ez-tint)) !important;
}
body.ezco-gui .bg-green {
  background-color: var(--ez-sage-700) !important;
  color: var(--ez-bone) !important;
}
body.ezco-gui .text-primary {
  color: var(--ez-forest) !important;
}
/* Prefer EZCO fonts over Montserrat when theme active */
body.ezco-gui,
body.ezco-gui .wrapper,
body.ezco-gui .content-wrapper {
  font-family: var(--ez-font-body);
  font-size: 14px;
  color: var(--ez-text);
  background-color: var(--ez-bg);
}
body.ezco-gui h1,
body.ezco-gui h2,
body.ezco-gui .content-header > h1,
body.ezco-gui .tw-text-xl.tw-font-bold,
body.ezco-gui .tw-text-3xl.tw-font-bold {
  font-family: var(--ez-font-display);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--ez-text);
}

/* AdminLTE tabs — replace default blue active chrome */
body.ezco-gui .nav-tabs-custom > .nav-tabs > li.active {
  border-top-color: var(--ez-forest) !important;
}
body.ezco-gui .nav-tabs-custom > .nav-tabs > li.active > a,
body.ezco-gui .nav-tabs-custom > .nav-tabs > li.active > a:hover {
  color: var(--ez-forest) !important;
  border-left-color: var(--ez-border-soft);
  border-right-color: var(--ez-border-soft);
}
body.ezco-gui .nav-tabs > li.active > a,
body.ezco-gui .nav-tabs > li.active > a:hover,
body.ezco-gui .nav-tabs > li.active > a:focus {
  color: var(--ez-forest) !important;
  border-bottom-color: var(--ez-forest) !important;
}
body.ezco-gui .nav-pills > li.active > a,
body.ezco-gui .nav-pills > li.active > a:hover,
body.ezco-gui .nav-pills > li.active > a:focus {
  background-color: var(--ez-forest) !important;
  color: var(--ez-bone) !important;
}
body.ezco-gui .nav-tabs > li > a:hover {
  color: var(--ez-sage-700);
}

/* Location focus header select — readable on forest navbar */
body.ezco-gui #location-focus-switcher #location_focus_select,
body.ezco-gui #location-focus-switcher .lf-focus-select {
  background-color: var(--ez-surface) !important;
  color: var(--ez-text) !important;
  -webkit-text-fill-color: var(--ez-text);
  border: 1px solid color-mix(in srgb, var(--ez-bone) 45%, transparent);
  color-scheme: inherit;
  appearance: auto;
  -webkit-appearance: menulist;
}
body.ezco-gui #location-focus-switcher #location_focus_select option,
body.ezco-gui #location-focus-switcher .lf-focus-select option {
  background-color: var(--ez-surface) !important;
  color: var(--ez-text) !important;
}