/* Mobile Menu Fix - Display menu items in a single column on the left */

/* Tablet and Mobile Styles */
@media (max-width: 1200px) {
    /* When mobile menu is open */
    .gh-head-open .gh-head-inner {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding-top: 20px;
        padding-bottom: 20px;
    }

    /* Keep the brand section at the top */
    .gh-head-open .gh-head-brand {
        width: 100%;
        justify-content: space-between;
        margin-bottom: 20px;
    }

    /* Menu section full width and items in column */
    .gh-head-open .gh-head-menu {
        width: 100%;
        margin: 0;
        padding: 0;
        order: 2;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }

    /* Each navigation item in column */
    .gh-head-open .gh-head-menu .nav {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
    }

    /* Each menu item */
    .gh-head-open .gh-head-menu .nav li {
        margin: 0;
        padding: 0;
        width: 100%;
    }

    .gh-head-open .gh-head-menu .nav a {
        display: block;
        padding: 12px 0;
        width: 100%;
        text-align: left;
    }

    /* Categories dropdown */
    .gh-head-open .gh-categories-dropdown {
        margin: 0;
        width: 100%;
    }

    .gh-head-open .gh-categories-trigger {
        padding: 12px 0;
        width: 100%;
        justify-content: space-between;
    }
    
    /* Dropdown arrow rotation */
    .dropdown-arrow.rotated {
        transform: rotate(180deg);
    }

    /* Style dropdown for mobile */
    .gh-head-open .categories-dropdown-menu {
        position: static !important;
        width: 100% !important;
        margin-top: 8px !important;
        margin-bottom: 8px !important;
        box-shadow: none !important;
        transform: none !important;
        display: none; /* Hidden by default, will be shown with JavaScript */
    }

    /* Actions section */
    .gh-head-open .gh-head-actions {
        width: 100%;
        margin-top: 20px;
        order: 3;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }

    /* Members section */
    .gh-head-open .gh-head-members {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .gh-head-open .gh-head-members a {
        width: 100%;
        padding: 12px 0;
        text-align: left;
    }
}

/* Tablet-specific adjustments */
@media (min-width: 768px) and (max-width: 1200px) {
    /* Adjust dropdown items for better tablet display */
    .gh-head-open .categories-dropdown-menu {
        padding: 12px;
        border-radius: 8px;
        background-color: #f8f8f8;
        border: 1px solid #e4e4e7;
    }
    
    .gh-head-open .dropdown-item {
        padding: 10px;
    }
    
    /* Add some spacing for tablet menu items */
    .gh-head-open .gh-head-menu .nav a,
    .gh-head-open .gh-categories-trigger,
    .gh-head-open .gh-head-members a {
        padding: 14px 0;
        font-size: 16px;
    }
    
    /* Dark mode adjustments for tablet */
    .dark-mode .gh-head-open .categories-dropdown-menu {
        background-color: #2a2a2a;
        border-color: #3a3a3a;
    }
}