/* 1. Scope all styles to #mobile-sidebar to avoid affecting footer/other menus */
    #mobile-sidebar {
        position: fixed;
        top: 0;
        left: -320px;
        width: 320px;
        height: 100%;
        background: #fff;
        transition: left 0.3s ease;
        z-index: 1001;
        display: flex; /* Changed to flex to manage sticky header easily */
        flex-direction: column;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
        overflow: hidden; /* Prevent double scrollbars */
    }

    /* 2. Sticky Header */
    #mobile-sidebar .sidebar-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 15px 20px;
        border-bottom: 1px solid #eee;
        background: var(--accent_color);
        z-index: 10;
        flex-shrink: 0; /* Don't allow header to shrink */
    }

    /* 3. Scrollable Content Area */
    #mobile-sidebar .menu-slider-container {
        flex-grow: 1;
        overflow-y: auto;
        overflow-x: hidden;
        position: relative;
    }

    /* Sliding logic based on "data-level" */
    #mobile-sidebar .menu-slider-wrapper {
        position: relative;
        width: 100%;
        transition: transform 0.3s ease;
    }

    /* Level movements */
    #mobile-sidebar[data-level="1"] .menu-slider-wrapper { transform: translateX(-100%); }
    #mobile-sidebar[data-level="2"] .menu-slider-wrapper { transform: translateX(-200%); }

    /* List Styles */
    #mobile-sidebar ul { list-style: none; margin: 0; padding: 0; background: #fff; }
    #mobile-sidebar .nav-links li { border-bottom: 1px solid #f0f0f0; }
    
    #mobile-sidebar .nav-links li a {
        padding: 18px 20px;
        font-size: 15px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        text-decoration: none;
        color: #000;
    }

    /* Sub-menu absolute positioning */
    #mobile-sidebar .sub-menu {
        position: absolute;
        top: 0;
        left: 100%; /* Level 1 submenus */
        width: 100%;
        min-height: 100%;
        visibility: hidden;
    }

    /* Level 2 submenus (submenu of submenu) */
    #mobile-sidebar .sub-menu .sub-menu {
        left: 100%; /* Relative to the level 1 submenu */
    }

    #mobile-sidebar .sub-menu.active { visibility: visible; }

    /* Icons */
    #mobile-sidebar .menu-item-has-children > a::after {
        content: '\2192';
        color: #999;
    }

    /* Reset & Overlay (Unchanged) */
    #sidebar-toggle { display: none; }
    #sidebar-toggle:checked ~ #mobile-sidebar { left: 0; }
    .sidebar-overlay {
        position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
        background: rgba(0, 0, 0, 0.3); display: none; z-index: 1000;
    }
    #sidebar-toggle:checked ~ .sidebar-overlay { display: block; }
    .back-btn { cursor: pointer; display: none; font-size: 18px; font-weight: bold; }
    .close-btn-label { cursor: pointer; font-size: 24px; }