/* ========================================
   RoofRunner Drawer / Navigation Styles
   ======================================== */

.rr-drawer {
    border-right: 1px solid var(--rr-border) !important;
    background: var(--rr-surface) !important;
}

.rr-drawer .mud-nav-link {
    border-radius: var(--rr-radius-md);
    font-weight: 600;
    color: var(--rr-text-secondary);
    margin-bottom: 2px;
    transition: all var(--rr-transition);
}

.rr-drawer .mud-nav-link:hover {
    background: var(--rr-surface-hover);
    color: var(--rr-text-strong);
}

/* The active route gets the prominent monochrome highlight, and it moves with
   navigation — whichever page you are on is the highlighted item. Purely
   greyscale (no gradient/shadow/colour), in line with the monochrome design. */
.rr-drawer .mud-nav-link.active {
    background: rgba(0, 0, 0, 0.08);
    color: var(--rr-text-strong);
    font-weight: 700;
    border-radius: var(--rr-radius-md);
}

.rr-drawer .mud-nav-link.active:hover {
    background: rgba(0, 0, 0, 0.10);
}

.rr-drawer .mud-nav-link .mud-nav-link-icon {
    color: inherit;
}