.pms-nav-menu {
    position: relative;
    padding: 0px 12px 20px 12px !important;
    color: var(--mud-palette-text-primary);
}

.pms-nav-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 12px;
    margin-bottom: 14px;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(139, 92, 246, .12), rgba(167, 139, 250, .08));
    border: 1px solid rgba(139, 92, 246, .14);
}

.pms-nav-header-icon {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    background: linear-gradient(135deg, #8B5CF6, #A78BFA);
    box-shadow: 0 10px 24px rgba(139, 92, 246, .25);
}

.pms-nav-header-title {
    font-weight: 800;
    line-height: 1.1;
    color: var(--mud-palette-text-primary);
}

.pms-nav-header-subtitle {
    color: var(--mud-palette-text-secondary);
    line-height: 1.2;
}

.pms-nav-section {
    margin-top: 14px;
}

.pms-nav-section-title {
    display: block;
    padding: 0 12px 7px 0 !important;
    margin-left: 0 !important;
    color: var(--mud-palette-text-secondary);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 11px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.pms-nav-section-header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.pms-nav-section-title-inline {
    padding-bottom: 0 !important;
}

.pms-nav-link {
    margin: 3px 0 !important;
    margin-inline-start: 0 !important;
    margin-inline-end: 0 !important;
    min-height: 42px;
    color: var(--mud-palette-text-primary) !important;
    font-weight: 500 !important;
    transition: background-color .18s ease, color .18s ease, transform .18s ease;
}

    .pms-nav-link:hover {
        background: rgba(139, 92, 246, .08) !important;
        color: #6D28D9 !important;
    }

        .pms-nav-link:hover .mud-nav-link-icon {
            color: #7C3AED !important;
        }

    .pms-nav-link.active,
    .pms-nav-link.mud-nav-link-active {
        background: linear-gradient(135deg, rgba(139, 92, 246, .16), rgba(167, 139, 250, .11)) !important;
        color: #6D28D9 !important;
        font-weight: 700 !important;
    }

        .pms-nav-link.active .mud-nav-link-icon,
        .pms-nav-link.mud-nav-link-active .mud-nav-link-icon {
            background: rgba(139, 92, 246, .18);
            color: #7C3AED !important;
        }

    .pms-nav-link .mud-nav-link-icon {
        box-sizing: border-box;
        width: 30px;
        height: 30px;
        margin-right: 4px;
        padding: 6px;
        border-radius: 10px;
        background: rgba(139, 92, 246, .10);
        color: #7C3AED;
        opacity: 1;
        transition: background-color .18s ease, color .18s ease;
    }

.pms-nav-section-bottom {
    padding-bottom: 16px;
}

.pms-nav-link-availability .mud-nav-link-icon {
    background: rgba(37, 99, 235, .10);
    color: #2563EB;
}

.pms-nav-link-availability.active .mud-nav-link-icon,
.pms-nav-link-availability.mud-nav-link-active .mud-nav-link-icon {
    background: rgba(37, 99, 235, .18);
    color: #2563EB !important;
}

.pms-nav-link-reservations .mud-nav-link-icon {
    background: rgba(13, 148, 136, .10);
    color: #0D9488;
}

.pms-nav-link-reservations.active .mud-nav-link-icon,
.pms-nav-link-reservations.mud-nav-link-active .mud-nav-link-icon {
    background: rgba(13, 148, 136, .18);
    color: #0D9488 !important;
}

.pms-nav-link-finance .mud-nav-link-icon {
    background: rgba(217, 119, 6, .10);
    color: #D97706;
}

.pms-nav-link-finance.active .mud-nav-link-icon,
.pms-nav-link-finance.mud-nav-link-active .mud-nav-link-icon {
    background: rgba(217, 119, 6, .18);
    color: #D97706 !important;
}

.pms-nav-link-reports .mud-nav-link-icon {
    background: rgba(2, 132, 199, .10);
    color: #0284C7;
}

.pms-nav-link-reports.active .mud-nav-link-icon,
.pms-nav-link-reports.mud-nav-link-active .mud-nav-link-icon {
    background: rgba(2, 132, 199, .18);
    color: #0284C7 !important;
}

.pms-nav-link-clients .mud-nav-link-icon {
    background: rgba(219, 39, 119, .10);
    color: #DB2777;
}

.pms-nav-link-clients.active .mud-nav-link-icon,
.pms-nav-link-clients.mud-nav-link-active .mud-nav-link-icon {
    background: rgba(219, 39, 119, .18);
    color: #DB2777 !important;
}

.pms-nav-link-camp .mud-nav-link-icon {
    background: rgba(22, 163, 74, .10);
    color: #16A34A;
}

.pms-nav-link-camp.active .mud-nav-link-icon,
.pms-nav-link-camp.mud-nav-link-active .mud-nav-link-icon {
    background: rgba(22, 163, 74, .18);
    color: #16A34A !important;
}

.pms-nav-link-system .mud-nav-link-icon {
    background: rgba(100, 116, 139, .10);
    color: #64748B;
}

.pms-nav-link-system.active .mud-nav-link-icon,
.pms-nav-link-system.mud-nav-link-active .mud-nav-link-icon {
    background: rgba(100, 116, 139, .18);
    color: #64748B !important;
}

/* Mini drawer overrides */
.pms-nav-closed .pms-nav-link {
    padding-left: 0 !important;
    justify-content: center !important;
}

/* The row that actually lays out icon + label is MudBlazor's own inner <a class="mud-nav-link">,
   not the "pms-nav-link" class (which Class="..." applies to the outer wrapper div) -- centering
   only the wrapper is a no-op since its sole child still left-aligns its own content at its own
   16px padding-left. */
.pms-nav-closed .pms-nav-link .mud-nav-link {
    justify-content: center !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.pms-nav-closed .pms-nav-link .mud-nav-link-icon {
    margin-right: 0 !important;
}

.pms-nav-pin-container {
    line-height: 0;
    margin-top: -8px;
    margin-bottom: -8px;
}

.pms-nav-closed .pms-nav-pin-container {
    visibility: hidden !important;
}