/**
 * Startbar menu polish + active states (loads after app.min.css).
 * Uses --bs-primary when present (Bootstrap / theme).
 */

.startbar .brand {
    border-bottom: 1px solid color-mix(in srgb, var(--bs-primary, #005b6f) 10%, transparent);
    background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--bs-primary, #005b6f) 4%, transparent) 0%,
        transparent 100%
    );
}

.startbar .startbar-menu .startbar-collapse {
    padding: 8px 14px 20px;
}

.startbar .startbar-menu .navbar-nav > .nav-item > .nav-link {
    transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease;
}

/* Top-level leaf: clear selected state (not section toggles) */
.startbar .startbar-menu .navbar-nav > .nav-item > .nav-link.active:not([data-bs-toggle="collapse"]) {
    background: linear-gradient(
        90deg,
        color-mix(in srgb, var(--bs-primary, #005b6f) 16%, transparent) 0%,
        color-mix(in srgb, var(--bs-primary, #005b6f) 5%, transparent) 100%
    );
    border-color: color-mix(in srgb, var(--bs-primary, #005b6f) 14%, transparent);
    font-weight: 600;
    box-shadow: 0 1px 2px color-mix(in srgb, var(--bs-primary, #005b6f) 12%, transparent);
    color: var(--bs-primary, #005b6f);
}

.startbar .startbar-menu .navbar-nav > .nav-item > .nav-link.active:not([data-bs-toggle="collapse"]) .menu-icon {
    color: var(--bs-primary, #005b6f);
}

/* Nested items */
.startbar .startbar-menu .navbar-nav .nav .nav-item .nav-link.active {
    background: color-mix(in srgb, var(--bs-primary, #005b6f) 10%, transparent);
    border-radius: 8px;
    font-weight: 600;
    color: var(--bs-primary, #005b6f);
}

.startbar .startbar-menu .navbar-nav .nav .nav-item .nav-link.active::before {
    width: 6px;
    height: 6px;
    left: 11px;
    border-color: var(--bs-primary, #005b6f);
    background: var(--bs-primary, #005b6f);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--bs-primary, #005b6f) 22%, transparent);
}