/* The sidebar's selected item paints its highlight TWICE.
 *
 * Eight `<li class="nav-item">` in `includes/sidebar.html` contain two
 * `<a class="nav-link">` each — the destination, and an empty
 * `data-bs-toggle="collapse"` disclosure caret — and the template puts the
 * same `{% if %}active{% endif %}` on BOTH. Material Dashboard then gives each
 * of them
 *
 *     background-color: rgba(199, 199, 199, 0.2)
 *
 * so the selected row is two translucent greys stacked: a rounded pill, plus a
 * second square-cornered block where the caret sits. The overlap is visibly
 * darker (two 20% layers), and the caret's block runs past the pill and is cut
 * off by the rail — which is the "weird shape".
 *
 * ⚠ The caret is `position-absolute` with NO top/right/left/bottom set, so it
 * does not move anywhere: it is simply taken out of flow and left on top of
 * the link beside it. Its own classes, `fixed-drop` and `w-76`, are **defined
 * in no stylesheet in this project** — dead names that were meant to position
 * and size it and never did. Do not "fix" this by styling them: that invents a
 * layout nobody designed. The caret only needs to stop claiming to be
 * selected, which it is not — it is a disclosure control, not a destination.
 *
 * ⚠ Paint only — no width, height, margin or padding. An earlier attempt at
 * this resized the collapsed rail's links and blew out the whole sidebar's
 * vertical rhythm. The shape is wrong because it is drawn twice, not because
 * either copy is the wrong size, so nothing here needs to move.
 *
 * Loaded after material-dashboard.css, like the radius and type token files
 * beside it, because it overrides a vendor rule.
 */

.navbar-vertical .navbar-nav .nav-item > .nav-link.fixed-drop.active {
  background-color: transparent;
  box-shadow: none;
}