/* _content/CrownSupportPortal/Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-oz4z3t1qe6] {
    display: flex;
    min-height: 100vh;
}

.sidebar[b-oz4z3t1qe6] {
    width: 280px;
    background: linear-gradient(180deg, #1f2937 0%, #111827 100%);
    display: flex;
    flex-direction: column;
    position: fixed;
    height: 100vh;
    left: 0;
    top: 0;
    z-index: 100;
    box-shadow: 4px 0 12px rgba(0, 0, 0, 0.15);
    overflow-y: auto;
    transition: transform 0.3s ease-in-out;
}

/* Override Bootstrap nav-link color variables and force professional white */
.sidebar[b-oz4z3t1qe6] {
    --bs-nav-link-color: #E7E7E7;
}

/* Force professional white color for all nav links in sidebar - multiple selectors for maximum specificity */
.sidebar .nav-link[b-oz4z3t1qe6],
.sidebar .nav-item .nav-link[b-oz4z3t1qe6],
.sidebar a.nav-link[b-oz4z3t1qe6],
.sidebar .nav-item a.nav-link[b-oz4z3t1qe6],
.sidebar .nav .nav-link[b-oz4z3t1qe6] {
    color: #E7E7E7 !important;
}

.sidebar .nav-link *[b-oz4z3t1qe6],
.sidebar .nav-item .nav-link *[b-oz4z3t1qe6] {
    color: #E7E7E7 !important;
}

/* Custom scrollbar for sidebar */
.sidebar[b-oz4z3t1qe6]::-webkit-scrollbar {
    width: 6px;
}

.sidebar[b-oz4z3t1qe6]::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.2);
}

.sidebar[b-oz4z3t1qe6]::-webkit-scrollbar-thumb {
    background: rgba(235, 49, 55, 0.5);
    border-radius: 3px;
}

.sidebar[b-oz4z3t1qe6]::-webkit-scrollbar-thumb:hover {
    background: rgba(235, 49, 55, 0.7);
}

.logo-container-top-right[b-oz4z3t1qe6] {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 1000;
    pointer-events: none;
}

.logo-top-right[b-oz4z3t1qe6] {
    width: auto;
    max-width: 200px;
    height: auto;
    pointer-events: auto;
}

.nav-scrollable[b-oz4z3t1qe6] {
    flex: 1;
    overflow-y: auto;
    padding: 0;
    padding-left: 12px;
    padding-right: 12px;
}

/* Add padding and spacing for mobile menu items */
@media (max-width: 768px) {
    .nav-scrollable[b-oz4z3t1qe6] {
        padding-top: 4.5rem !important; /* Space below hamburger icon */
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}

.bi[b-oz4z3t1qe6] {
    display: inline-block;
    position: relative;
    width: 1.4rem;
    height: 1.4rem;
    margin-right: 0.75rem;
    top: 4px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-oz4z3t1qe6] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-lightning-charge-fill-nav-menu[b-oz4z3t1qe6] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-lightning-charge-fill' viewBox='0 0 16 16'%3E%3Cpath d='M11.251.068a.5.5 0 0 1 .227.58L9.677 6.5H13a.5.5 0 0 1 .364.843l-8 8.5a.5.5 0 0 1-.842-.49L6.323 9.5H3a.5.5 0 0 1-.364-.843l8-8.5a.5.5 0 0 1 .615-.09z'/%3E%3C/svg%3E");
}

.bi-sun-fill-nav-menu[b-oz4z3t1qe6] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-sun-fill' viewBox='0 0 16 16'%3E%3Cpath d='M8 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8M8 0a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 0m0 13a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 13m8-5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2a.5.5 0 0 1 .5.5M3 8a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2A.5.5 0 0 1 3 8m10.657-5.657a.5.5 0 0 1 0 .707l-1.414 1.415a.5.5 0 1 1-.707-.708l1.414-1.414a.5.5 0 0 1 .707 0m-9.193 9.193a.5.5 0 0 1 0 .707L3.05 13.657a.5.5 0 0 1-.707-.707l1.414-1.414a.5.5 0 0 1 .707 0m9.193 2.121a.5.5 0 0 1-.707 0l-1.414-1.414a.5.5 0 0 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .707M4.464 4.465a.5.5 0 0 1-.707 0L2.343 3.05a.5.5 0 1 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .708z'/%3E%3C/svg%3E");
}

.nav-item[b-oz4z3t1qe6] {
    font-size: 1rem;
    padding-bottom: 0.5rem;
    padding-left: 0;
    padding-right: 0;
}

.nav-item:first-of-type[b-oz4z3t1qe6] {
    padding-top: 1rem;
}

.nav-item:last-of-type[b-oz4z3t1qe6] {
    padding-bottom: 1rem;
}

.sidebar .nav-item .nav-link[b-oz4z3t1qe6],
.nav-item .nav-link[b-oz4z3t1qe6] {
    color: #E7E7E7 !important;
    background: none !important;
    border: none;
    border-radius: 4px;
    height: 3rem;
    display: flex;
    align-items: center;
    line-height: 3rem;
    width: 100%;
    transition: all 0.2s ease;
    font-size: 1.05rem;
    font-weight: 500;
}

/* Target all text content in nav links */
.sidebar .nav-link[b-oz4z3t1qe6],
.sidebar .nav-item .nav-link[b-oz4z3t1qe6] {
    color: #E7E7E7 !important;
}

.sidebar .nav-link:not(.active)[b-oz4z3t1qe6],
.sidebar .nav-item .nav-link:not(.active)[b-oz4z3t1qe6] {
    color: #E7E7E7 !important;
}

.nav-item a.active[b-oz4z3t1qe6],
.nav-item a.active .nav-link[b-oz4z3t1qe6] {
    background-color: rgba(255, 255, 255, 0.37);
    color: #E7E7E7 !important;
}

.nav-item .nav-link:hover[b-oz4z3t1qe6] {
    background-color: rgba(255, 255, 255, 0.1);
    color: #E7E7E7 !important;
}

.content-wrapper[b-oz4z3t1qe6] {
    flex: 1;
    margin-left: 280px;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #e8f0f5;
    transition: margin-left 0.3s ease-in-out;
}

/* Top row with navbar brand */
.top-row[b-oz4z3t1qe6] {
    height: 3.5rem;
    display: flex;
    align-items: center;
    background-color: transparent;
}

.navbar-brand[b-oz4z3t1qe6] {
    font-size: 1.1rem;
    color: #E7E7E7;
    text-decoration: none;
}

/* Hide top-row (Crown Micro text) on mobile */
@media (max-width: 768px) {
    .top-row[b-oz4z3t1qe6] {
        display: none !important;
    }
}

/* Checkbox-based navbar toggler - Blazor template approach */
.navbar-toggler[b-oz4z3t1qe6] {
    display: none;
}

/* Hamburger icon label - shown on mobile */
.navbar-toggler-label[b-oz4z3t1qe6] {
    display: none;
}

.navbar-toggler[b-oz4z3t1qe6] {
    display: none;
}

@media (max-width: 768px) {
    /* Hamburger icon label - always visible on mobile, outside sidebar */
    .navbar-toggler-label[b-oz4z3t1qe6] {
        display: flex !important;
        position: fixed !important;
        top: 0.75rem !important;
        left: 0.75rem !important;
        width: 3.5rem !important;
        height: 3.5rem !important;
        cursor: pointer !important;
        z-index: 10000 !important;
        background-color: #1f2937 !important;
        border-radius: 4px !important;
        align-items: center !important;
        justify-content: center !important;
        color: #E7E7E7 !important;
        font-size: 1.8rem !important;
        line-height: 1 !important;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .navbar-toggler-label[b-oz4z3t1qe6]::before {
        content: "☰" !important;
        display: block !important;
    }

    /* Make checkbox invisible but clickable, positioned over the label */
    .navbar-toggler[b-oz4z3t1qe6] {
        display: block !important;
        position: fixed !important;
        top: 0.75rem !important;
        left: 0.75rem !important;
        width: 3.5rem !important;
        height: 3.5rem !important;
        background: transparent !important;
        border: none !important;
        cursor: pointer !important;
        z-index: 10001 !important;
        opacity: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        appearance: none !important;
        -webkit-appearance: none !important;
    }
}

main[b-oz4z3t1qe6] {
    flex: 1;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer[b-oz4z3t1qe6] {
    background-color: #f8f9fa;
    border-top: 1px solid #dee2e6;
    padding: 15px 20px;
    text-align: center;
    margin-top: auto;
}

.footer p[b-oz4z3t1qe6] {
    margin: 0;
    color: #6c757d;
    font-size: 14px;
}

.footer a[b-oz4z3t1qe6] {
    color: #007bff;
    text-decoration: none;
    font-weight: 500;
}

.footer a:hover[b-oz4z3t1qe6] {
    text-decoration: underline;
    color: #0056b3;
}

#blazor-error-ui[b-oz4z3t1qe6] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-oz4z3t1qe6] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

/* Maximum specificity override for nav-link text color - must be at the end */
aside.sidebar .nav-scrollable .nav.flex-column .nav-item.px-3 .nav-link[b-oz4z3t1qe6],
aside.sidebar .nav-scrollable .nav .nav-item .nav-link[b-oz4z3t1qe6],
aside.sidebar .nav-item .nav-link[b-oz4z3t1qe6],
.sidebar aside .nav-link[b-oz4z3t1qe6] {
    color: #E7E7E7 !important;
}

aside.sidebar .nav-link:link[b-oz4z3t1qe6],
aside.sidebar .nav-link:visited[b-oz4z3t1qe6],
aside.sidebar .nav-link:hover[b-oz4z3t1qe6],
aside.sidebar .nav-link:active[b-oz4z3t1qe6] {
    color: #E7E7E7 !important;
}

/* Responsive sidebar styles - Blazor template approach */
@media (max-width: 768px) {
    .sidebar[b-oz4z3t1qe6] {
        position: fixed;
        top: 0;
        left: 0;
        height: 100vh;
        width: 280px;
        transform: translateX(-100%);
        transition: transform 0.3s ease-in-out;
        z-index: 1000;
    }

    /* Show sidebar when checkbox is checked (checkbox is now outside sidebar) */
    .page:has(.navbar-toggler:checked) .sidebar[b-oz4z3t1qe6] {
        transform: translateX(0);
    }

    /* Overlay when sidebar is open */
    .page:has(.navbar-toggler:checked)[b-oz4z3t1qe6]::after {
        content: '';
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.5);
        z-index: 999;
        cursor: pointer;
        pointer-events: auto;
    }

    .content-wrapper[b-oz4z3t1qe6] {
        margin-left: 0;
    }
}
