/* Mobile Side Drawer Menu CSS */
@media (max-width: 991.98px) {
    #ftco-nav {
        position: fixed !important;
        top: 0;
        right: -300px;
        /* Start off-screen */
        width: 300px;
        height: 100vh !important;
        background: #ffffff;
        z-index: 9999;
        transition: right 0.4s cubic-bezier(0.19, 1, 0.22, 1);
        display: block !important;
        /* Override bootstrap collapse display handling */
        padding-top: 60px;
        box-shadow: -2px 0 10px rgba(0, 0, 0, 0.1);
        overflow-y: auto;
    }

    #ftco-nav.show {
        right: 0;
    }

    /* Adjust navbar items */
    #ftco-nav .navbar-nav {
        width: 100%;
        margin: 0 !important;
        padding-left: 0;
    }

    #ftco-nav .nav-item {
        width: 100%;
        border-bottom: 1px solid #f0f0f0;
    }

    #ftco-nav .nav-link {
        padding: 15px 25px !important;
        text-align: left;
    }

    /* Style the dropdowns for mobile */
    /* Use specific selector specificity to override header styles */
    /* Style the dropdowns for mobile */
    /* Use specific selector specificity to override header styles */
    #ftco-nav .dropdown-content {
        position: static !important;
        float: none;
        width: 100%;
        box-shadow: none;
        background: #f9f9f9;
        border: none;
        padding-left: 20px;
        display: none;
        /* Hide by default */
    }

    /* Override hover effect for mobile - Force it to stay hidden on hover unless .show is present */
    div.dropdown:hover .dropdown-content:not(.show) {
        display: none !important;
    }

    /* Mobile toggle styles for dropdown */
    .dropdown-content.show {
        display: block !important;
        position: relative !important;
        /* Changed from static to relative for better control */
        box-shadow: none !important;
        width: 100% !important;
        background-color: #f8f8f8 !important;
        padding-left: 30px;
        border-left: 3px solid #c5a559;
    }

    #ftco-nav .dropbtn {
        width: 100%;
        text-align: left;
        background: none;
        border: none !important;
        outline: none !important;
        padding: 15px 25px !important;
        color: #333333;
        display: flex !important;
        justify-content: space-between !important;
        /* Ensures text is left and icon is far right */
        align-items: center !important;
        box-shadow: none !important;
    }

    /* Target the text explicitly to allow flex spacing */
    #ftco-nav .dropbtn span {
        flex-grow: 1;
        text-align: left;
    }

    #ftco-nav .dropbtn i {
        float: none;
        margin-top: 0;
        margin-left: 10px;
        /* Minimal gap */
    }

    #ftco-nav .dropbtn:focus,
    #ftco-nav .dropbtn:active,
    #ftco-nav .dropbtn.active {
        border: none !important;
        outline: none !important;
        box-shadow: none !important;
    }

    /* Close button styles */
    .mobile-close-btn {
        position: absolute;
        top: 15px;
        right: 20px;
        font-size: 24px;
        color: #333;
        background: none;
        border: none;
        cursor: pointer;
        outline: none;
        display: block;
    }

    .mobile-close-btn:hover {
        color: #c5a559;
    }

    /* Social Icons Mobile Styling */
    .social-icons-mobile {
        padding: 20px 0;
        border-bottom: none !important;
        text-align: center;
    }

    .social-wrapper {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 15px;
        width: 100%;
    }

    .social-link {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background-color: #f0f0f0;
        color: #333;
        font-size: 18px;
        transition: all 0.3s ease;
        text-decoration: none !important;
    }

    .social-link:hover,
    .social-link:hover span,
    .social-link:hover i {
        background-color: #c5a559 !important;
        color: #ffffff !important;
        text-decoration: none !important;
    }
}

/* Hide close button on desktop */
@media (min-width: 992px) {
    .mobile-close-btn {
        display: none;
    }

    .social-icons-mobile {
        display: none;
    }
}