/**
 * Mobile Navigation
 */

/* Hide mobile menu on desktop */
.kutup-mobile-actions {
    display: none;
}

.mobile-dropdown-menu {
    display: none;
}

/* Show mobile menu on tablet and below */
@media (max-width: 991px) {
    /* Hide desktop navigation */
    .kutup-shrink-item {
        display: none !important;
    }

    .kutup-desktop-actions {
        display: none !important;
    }

    /* Show mobile actions */
    .kutup-mobile-actions {
        display: flex;
        align-items: center;
        gap: 12px;
    }

    .mobile-phone-button {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        background-image: linear-gradient(230deg, #ffa31b, #ffc956);
        border-radius: 50%;
        text-decoration: none;
        transition: box-shadow 0.3s ease;
    }

    .mobile-phone-button:hover {
        box-shadow: 0 0 15px rgba(255, 163, 27, 0.6);
    }

    .mobile-phone-icon {
        width: 20px;
        height: 20px;
        filter: brightness(0);
    }

    .kutup-menu-button {
        background: none;
        border: none;
        cursor: pointer;
        padding: 8px;
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .kutup-menu-button svg {
        stroke: #fff;
    }

    /* Mobile dropdown menu */
    .mobile-dropdown-menu {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background-color: #000;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease;
        z-index: 1000;
    }

    .mobile-dropdown-menu.active {
        max-height: 600px;
        display: block;
    }

    .mobile-menu-item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 16px 20px;
        color: #fff;
        text-decoration: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        font-weight: 600;
        font-size: 14px;
        letter-spacing: 0.5px;
        transition: background-color 0.2s ease;
    }

    .mobile-menu-item:hover {
        background-color: rgba(255, 255, 255, 0.05);
    }

    .mobile-dropdown-arrow {
        transition: transform 0.3s ease;
    }

    .mobile-menu-item.expanded .mobile-dropdown-arrow {
        transform: rotate(180deg);
    }

    /* Submenu */
    .mobile-submenu {
        max-height: 0;
        overflow: hidden;
        background-color: rgba(0, 0, 0, 0.5);
        transition: max-height 0.3s ease;
    }

    .mobile-submenu.active {
        max-height: 400px;
    }

    .mobile-submenu-item {
        display: block;
        padding: 12px 20px 12px 40px;
        color: rgba(255, 255, 255, 0.8);
        text-decoration: none;
        font-size: 13px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
        transition: all 0.2s ease;
    }

    .mobile-submenu-item:hover {
        background-color: rgba(255, 255, 255, 0.05);
        color: #fff;
        padding-left: 45px;
    }
}
