/* Custom CSS for HFE Mobile Menu Toggle - Insurigo Theme */

/* Hide HFE toggle on desktop (1025px and up) */
@media (min-width: 1025px) {
    .hfe-nav-menu__toggle {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }
}

/* Show and style HFE toggle only on mobile/tablet (1024px and below) */
@media (max-width: 1024px) {
    .hfe-nav-menu__toggle {
        background-color: #ffffff !important;
        border: 2px solid #333333 !important;
        border-radius: 5px !important;
        padding: 10px !important;
        color: #333333 !important;
        visibility: visible !important;
        opacity: 1 !important;
        display: flex !important;
    }
}

/* Style the toggle icon */
.hfe-nav-menu__toggle-icon,
.hfe-nav-menu-icon {
    font-size: 24px !important;
    color: #333333 !important;
}

/* Style when menu is active/open */
.hfe-nav-menu__toggle.hfe-active-menu {
    background-color: #333333 !important;
    color: #ffffff !important;
    transform: rotate(180deg); /* Optional: rotate when active */
}

.hfe-nav-menu__toggle.hfe-active-menu .hfe-nav-menu__toggle-icon,
.hfe-nav-menu__toggle.hfe-active-menu .hfe-nav-menu-icon {
    color: #ffffff !important;
}

/* Mobile-specific overrides only apply below 1024px */
@media (max-width: 1024px) {
    /* Override theme's hiding of HFE toggle on mobile */
    .hfe-layout-horizontal .hfe-nav-menu__toggle,
    .hfe-layout-vertical .hfe-nav-menu__toggle {
        visibility: visible !important;
        opacity: 1 !important;
        display: flex !important;
    }
}

/* Ensure HFE toggle shows on tablet breakpoints (max-width: 1024px) */
@media (max-width: 1024px) {
    .hfe-nav-menu__breakpoint-tablet .hfe-layout-horizontal .hfe-nav-menu__toggle,
    .hfe-nav-menu__breakpoint-tablet .hfe-layout-vertical .hfe-nav-menu__toggle {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}

/* Ensure HFE toggle shows on mobile breakpoints (max-width: 767px) */
@media (max-width: 767px) {
    .hfe-nav-menu__breakpoint-mobile .hfe-layout-horizontal .hfe-nav-menu__toggle,
    .hfe-nav-menu__breakpoint-mobile .hfe-layout-vertical .hfe-nav-menu__toggle {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        /* Add your mobile-specific styles here */
        font-size: 20px !important;
    }
}

/* Hide theme's default mobile menu toggle if HFE is present */
.elementor-widget-hfe-nav-menu ~ .menu-toggle-wrapper,
.hfe-nav-menu__toggle + .menu-toggle-wrapper {
    display: none !important;
}

/* Specific targeting for the element ID found in live site - mobile only */
@media (max-width: 1024px) {
    .elementor-element-0b3f223 .hfe-nav-menu__toggle {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        justify-content: flex-end !important;
    }
}

/* Insurigo theme specific overrides */
.site-header__mobile .menu-toggle-wrapper {
    display: none !important;
}

/* Z-index for proper layering on mobile only */
@media (max-width: 1024px) {
    .hfe-nav-menu__toggle {
        z-index: 999 !important;
    }
}