/* Fix Sidebar Responsiveness for Mobile Devices - FORCE HIDE */

/* Mobile and Tablet - FORCE sidebar to be completely hidden */
@media (max-width: 991.98px) {
    /* FORCE hide sidebar completely with display none */
    .main-sidebar {
        display: none !important;
    }
    
    /* Show sidebar ONLY when menu button is clicked */
    body.sidebar-open .main-sidebar {
        display: block !important;
        position: fixed !important;
        top: 0;
        bottom: 0;
        width: 280px !important;
        z-index: 1050 !important;
        left: 0 !important;
        right: auto !important;
        box-shadow: 4px 0 12px rgba(0,0,0,0.3);
        animation: slideInLeft 0.3s ease;
    }
    
    @keyframes slideInLeft {
        from { 
            transform: translateX(-100%);
            opacity: 0;
        }
        to { 
            transform: translateX(0);
            opacity: 1;
        }
    }
    
    /* RTL Support for Arabic */
    html[dir="rtl"] body.sidebar-open .main-sidebar {
        left: auto !important;
        right: 0 !important;
        box-shadow: -4px 0 12px rgba(0,0,0,0.3);
        animation: slideInRight 0.3s ease;
    }
    
    @keyframes slideInRight {
        from { 
            transform: translateX(100%);
            opacity: 0;
        }
        to { 
            transform: translateX(0);
            opacity: 1;
        }
    }
    
    /* Dark overlay behind sidebar when open */
    body.sidebar-open::before {
        content: '';
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.6);
        z-index: 1040;
        animation: fadeIn 0.3s ease;
    }
    
    @keyframes fadeIn {
        from { opacity: 0; }
        to { opacity: 1; }
    }
    
    /* Content takes FULL width on mobile - NO sidebar space */
    .content-wrapper,
    .main-footer,
    .main-header {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }
    
    body:not(.sidebar-open) .content-wrapper,
    body:not(.sidebar-open) .main-footer,
    body:not(.sidebar-open) .main-header {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    /* Fix navbar to use full width */
    .main-header.navbar {
        width: 100% !important;
        margin: 0 !important;
        left: 0 !important;
        right: 0 !important;
    }
    
    /* Navbar layout fixes */
    .navbar-nav {
        flex-direction: row;
        align-items: center;
    }
    
    /* Logo - keep it small */
    .navbar-brand {
        max-width: 100px !important;
        flex-shrink: 0;
        padding: 0.5rem !important;
        margin-right: 0.5rem !important;
    }
    
    .navbar-brand img {
        max-height: 35px !important;
        width: auto !important;
    }
    
    /* Search bar gets remaining space */
    .navbar .form-inline {
        flex: 1 !important;
        max-width: 300px !important;
        margin: 0 0.5rem !important;
    }
    
    .navbar .form-inline .form-control {
        width: 100% !important;
        font-size: 0.875rem;
    }
    
    /* Hamburger menu button */
    .navbar-nav .nav-link[data-widget="pushmenu"] {
        display: inline-block !important;
        padding: 0.5rem !important;
    }
    
    /* Ensure all navbar dropdowns are visible on mobile */
    .navbar-nav .nav-item.dropdown {
        display: block !important;
    }
    
    .navbar-nav .dropdown-toggle {
        padding: 0.5rem !important;
        font-size: 0.875rem;
    }
    
    .navbar-nav .dropdown-menu {
        right: 0 !important;
        left: auto !important;
        min-width: 150px;
    }
    
    html[dir="rtl"] .navbar-nav .dropdown-menu {
        left: 0 !important;
        right: auto !important;
    }
    
    /* Language switcher should be visible */
    .navbar-nav .nav-item[topnav_right] {
        display: block !important;
    }
    
    /* Prevent body scroll when sidebar is open */
    body.sidebar-open {
        overflow: hidden !important;
        position: fixed !important;
        width: 100% !important;
        height: 100% !important;
    }
    
    /* Remove any layout classes that might show sidebar */
    body.sidebar-collapse .main-sidebar,
    body.sidebar-mini .main-sidebar,
    body.sidebar-mini-md .main-sidebar,
    body.sidebar-mini-xs .main-sidebar {
        display: none !important;
    }
    
    body.sidebar-open.sidebar-collapse .main-sidebar,
    body.sidebar-open.sidebar-mini .main-sidebar {
        display: block !important;
    }
}

/* Extra small phones */
@media (max-width: 575.98px) {
    body.sidebar-open .main-sidebar {
        width: 85% !important;
        max-width: 300px !important;
    }
    
    .navbar-brand {
        max-width: 70px !important;
    }
    
    .navbar-brand img {
        max-height: 30px !important;
    }
    
    .navbar .form-inline {
        max-width: 180px !important;
        margin: 0 0.25rem !important;
    }
}