/* ── Loads last — overrides bootstrap5, site.css, 386.css ── */

/* Links */
a, a:hover, a:focus, a:visited { text-decoration: none !important; }

/* Navbar: fix Bootstrap 5 regression, zero padding for 21px compact bar */
.navbar {
  --bs-navbar-padding-y: 0;
  --bs-nav-link-padding-y: 0;
  overflow: visible;
}
.navbar-nav { margin-left: 0 !important; }

/* Force the collapse and its container to stay inside the 21px bar */
.navbar > .container-fluid,
.navbar > .container {
  height: 100%;
  overflow: visible;
}
.navbar-expand-lg .navbar-collapse {
  height: 21px !important;
  overflow: visible !important;
  align-items: center;
}

.navbar .nav-link, .navbar .navbar-brand {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: 21px !important;
  height: 21px;
}
.navbar .nav-item {
  height: 21px;
  display: flex;
  align-items: center;
}

/* Navbar toggler: site uses text "mENU", hide BS5 icon */
.navbar-toggler { border: none !important; padding: 0 !important; box-shadow: none !important; }
.navbar-toggler-icon { display: none !important; }

/* Dropdowns */
.dropdown-menu {
  --bs-dropdown-bg: #aaaaaa;
  --bs-dropdown-color: #111111;
  --bs-dropdown-link-color: #111111;
  --bs-dropdown-link-hover-bg: #888888;
  --bs-dropdown-link-hover-color: #111111;
  --bs-dropdown-link-active-bg: #666666;
  --bs-dropdown-link-active-color: #111111;
  background-color: #aaaaaa !important;
  color: #111111 !important;
}
.dropdown-item { color: #111111 !important; }
.dropdown-item span { font-family: Monaco, monospace; font-size: 16px; }

/* Hover-to-open on desktop */
@media (min-width: 992px) {
  .navbar .dropdown:hover > .dropdown-menu { display: block; margin-top: 0; }
}
.navbar .dropdown:hover > .dropdown-toggle,
.navbar .dropdown.show > .dropdown-toggle { color: inherit !important; }

/* Form controls */
.form-control, .form-select {
  background-color: #212121 !important;
  color: rgba(255,255,255,0.7) !important;
  border-color: #555555 !important;
  border-radius: 0 !important;
}
.form-control:focus, .form-select:focus {
  background-color: #212121 !important;
  color: rgba(255,255,255,0.7) !important;
  box-shadow: none !important;
}
.form-check-input { background-color: #444 !important; border-color: #666 !important; }
.form-check-input:checked { background-color: #ff55ff !important; border-color: #ff55ff !important; }

/* Sort buttons */
.sort-btn { background: none; border: none; color: inherit; cursor: pointer; font: inherit; padding: 0; }
.sort-btn:hover { text-decoration: underline; }

/* Bootstrap 5 adds ::after caret to dropdown-toggle; we use explicit <span class="caret"> */


/* The caret span itself must not add extra line height */
.navbar .caret { line-height: 1; vertical-align: middle; }

/* Dropdown menus: override Popper.js inline transform, position below navbar */
.navbar .dropdown-menu {
  position: absolute !important;
  top: 21px !important;
  transform: none !important;
  margin-top: 0 !important;
  inset: auto !important;
}

/* Fix dropdown-toggle height: site.css adds padding-top:1px, BS5 after has vertical-align:0.255em */
.navbar .dropdown-toggle {
  padding-top: 0 !important;
}
.navbar .dropdown-toggle::after {
  vertical-align: middle !important;
  margin-left: 4px;
}

/* Navbar search input: constrain to fit within 21px bar */
.navbar .form-control {
  height: 21px !important;
  min-height: 0 !important;
  padding: 0 4px !important;
  
  line-height: 16px !important;
  width: 80px !important;
}

/* Hide BS5 ::after caret — arrow is text in HTML instead */
.navbar .dropdown-toggle::after { display: none !important; }

/* form-switch: retro pill toggle matching site palette */
.form-switch .form-check-input {
  --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23aaaaaa'/%3e%3c/svg%3e");
  width: 2em !important;
  height: 1em !important;
  background-color: #333333 !important;
  border-color: #555555 !important;
  border-radius: 1em !important;
}
.form-switch .form-check-input:checked {
  --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23111111'/%3e%3c/svg%3e");
  background-color: #55ff55 !important;
  border-color: #55ff55 !important;
}