.mobilenav-container .mobileMenu li > a {
    color: inherit !important;
}

.content-hidden {
    visibility: hidden;
    opacity: 0;
}

.content-visible {
    visibility: visible;
    opacity: 1;
    transition: opacity 0.5s ease-in-out;
}

html, body {
    overflow-x: hidden;
}

/* Force light theme styling inside the mobile menu */
.mobilenav-container {
    /* Override theme variables locally for a light panel */
    --bg-color: #FFFFFF;
    --bg-color-rgb: 255, 255, 255;
    --body-color: #001F3F; /* text color inside menu */
}

.mobilenav-container .mobilenav-container__content {
    background-color: #FFFFFF !important;
}

.mobilenav-container .mobileMenu {
    background-color: #FFFFFF !important;
}

.mobilenav-container .mobileMenu li,
.mobilenav-container .mobilenav-container__contact li {
    color: #001F3F !important;
}

/* Submenu link borders for readability on white */
.mobilenav-container .mobileMenu > li > ul > li > a {
    border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
}

.mobilenav-container .mobilenav-container__socialwrap li a,
.mobilenav-container .menu-icon {
    color: #001F3F !important;
}

/* Style 'Get a Quote' button and disable its hover effect */
.mobilenav-container .mobileMenu .btn-glass-primary,
.mobilenav-container .mobileMenu .btn-glass-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
    padding: 8px 16px !important;
    border-radius: 5px !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.5;
}

/* Disable hover on the link wrapping the 'Get a Quote' button */
.mobilenav-container .mobileMenu li > a:has(.btn-glass-primary):hover {
    background-color: transparent !important;
}

[data-bs-theme="light"] .header-info-sidebar__icon svg path {
    stroke: #001F3F !important; /* Ensure icons are dark in light mode */
}

/* Professional hover effect for mobile menu items */
.mobilenav-container .mobileMenu li > a:not(:has(.btn-glass-primary)) {
    transition: background-color 0.2s ease-in-out;
    border-radius: 8px;
    padding: 10px 15px;
}

.mobilenav-container .mobileMenu li > a:not(:has(.btn-glass-primary)):hover {
    background-color: rgba(0, 0, 0, 0.05); /* Subtle grey background on hover */
    color: #001F3F !important; /* Ensure text color remains dark */
}

/* Ensure feature links in mobile menu also have correct hover styles */
.mobilenav-container .header-info-sidebar__feature li a:hover {
    background-color: var(--primary-color) !important;
    color: #FFFFFF !important;
    border-radius: 4px; /* Optional: adds a slight rounding to the hover effect */
}

.mobilenav-container .header-info-sidebar__feature li a:hover span {
    color: #FFFFFF !important;
}

.mobilenav-container .header-info-sidebar__feature li a:hover .header-info-sidebar__icon svg path {
    stroke: #FFFFFF !important;
}

/* Modern "Get In Touch" section styles */
.mobilenav-container .header-info-sidebar__feature {
    margin-top: 20px;
    padding: 16px;
    background-color: #f5f5f7; /* Light grey background, Apple-style */
    border-radius: 12px;
}

.mobilenav-container .header-info-sidebar__feature h3 {
    font-size: 16px;
    font-weight: 600;
    color: #1d1d1f; /* Apple's primary text color */
    margin-bottom: 16px;
}

.mobilenav-container .header-info-sidebar__feature div {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
}

.mobilenav-container .header-info-sidebar__feature div:last-child {
    margin-bottom: 0;
}

.mobilenav-container .header-info-sidebar__feature .topbar-two__icon {
    font-size: 18px;
    width: 20px;
    text-align: center;
    margin-right: 15px;
    color: #8A8A8E; /* A muted color for the icon */
}

.mobilenav-container .header-info-sidebar__feature a {
    font-size: 15px;
    font-weight: 500;
    color: var(--primary-color); /* Apple's link color */
    text-decoration: none;
    transition: opacity 0.2s ease-in-out;
}

.mobilenav-container .header-info-sidebar__feature a:hover {
    opacity: 0.8;
}

/* Modern contact info styles */
.mobilenav-contact {
    margin-top: 20px;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    padding-top: 20px;
}

.mobilenav-contact__link {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    border-radius: 8px;
    text-decoration: none;
    color: #001F3F;
    font-weight: 500;
    font-size: 15px;
    transition: background-color 0.2s ease-in-out;
}

.mobilenav-contact__link i {
    font-size: 18px;
    width: 20px;
    text-align: center;
    margin-right: 15px;
    color: #8A8A8E; /* A muted color for the icon */
}
