/* 
 * Navigation Override CSS - HIGH PRIORITY RULES
 * Purpose: Ensure navigation sidebar remains visible on desktop regardless of other CSS changes
 * Created to fix recurring navigation display issues
 * Load this file LAST in _Layout.cshtml
 */

/* CRITICAL: Force sidebar visibility on desktop screens (768px and above) */
@media (min-width: 768px) {
    /* Main page layout - MUST be horizontal on desktop */
    .page {
        display: flex !important;
        flex-direction: row !important;
        min-height: 100vh !important;
    }
    
    /* Sidebar MUST be visible on desktop */
    .sidebar {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: 250px !important;
        min-width: 250px !important;
        max-width: 250px !important;
        flex-shrink: 0 !important;
        position: sticky !important;
        top: 0 !important;
        height: 100vh !important;
        background-color: #0A3161 !important;
        z-index: 1000 !important;
    }
    
    /* Ensure nav menu content is visible */
    .sidebar .nav-menu,
    .sidebar nav {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    /* Main content must flex to fill remaining space */
    main {
        flex: 1 !important;
        min-width: 0 !important;
        width: calc(100% - 250px) !important;
    }
    
    /* Hide any collapse classes that might interfere */
    .sidebar .collapse {
        display: block !important;
    }
    
    /* Override any Bootstrap utility classes that might hide sidebar */
    .sidebar.d-none {
        display: block !important;
    }
    
    /* Ensure Bootstrap responsive utilities work correctly */
    .d-md-block {
        display: block !important;
    }
    
    .d-md-none {
        display: none !important;
    }
}

/* Mobile styles - Sidebar should be hidden on mobile */
@media (max-width: 767.98px) {
    .page {
        flex-direction: column !important;
    }
    
    .sidebar {
        display: none !important;
    }
    
    main {
        width: 100% !important;
    }
    
    /* Show mobile navigation toggle */
    .navbar-toggler.d-md-none {
        display: inline-block !important;
    }
}

/* Additional defensive rules to prevent common issues */
.sidebar * {
    /* Prevent any child elements from being hidden */
    visibility: visible !important;
}

/* Ensure nav items are clickable */
.sidebar a {
    pointer-events: auto !important;
}

/* Override any transform or position changes that might move sidebar off-screen */
.sidebar {
    transform: none !important;
    left: 0 !important;
    margin-left: 0 !important;
}