/* Pharmabot navbar refresh -- custom overrides, loaded after style.css */

.header.header-1:not(.header-xpodium-glass) .main-header-wraper {
    top: 0 !important;
    padding: 10px 0;
    box-shadow: 0 2px 16px rgba(14, 30, 54, 0.08);
}

/* Keep the factual utility bar on desktop and place the main navigation
   beneath it. Bootstrap's d-none d-xl-block still hides it on smaller screens. */
@media (min-width: 1200px) {
    .header.header-1:not(.header-xpodium-glass) .top-header {
        display: block !important;
    }

    .header.header-1:not(.header-xpodium-glass) .main-header-wraper {
        top: 51px !important;
    }

    /* The template's `.stop` state normally removes the utility bar. Keep this
       restored information strip visible and leave navigation beneath it. */
    .header.header-1.stop:not(.header-xpodium-glass) .top-header {
        transform: translate3d(0, 0, 0) !important;
    }

    .header.header-1.stop:not(.header-xpodium-glass) .main-header-wraper {
        top: 51px !important;
    }
}

/* Desktop "Xpodium 2026" as an accent badge */
.header-right .main-menu > ul > li > a[href="/xpodium2026"] {
    border: 1px solid #FF9C00;
    color: #B26900 !important;
    border-radius: 20px;
    padding: 8px 16px !important;
    font-size: 13px !important;
}

.header-right .main-menu > ul > li > a[href="/xpodium2026"]:hover {
    background-color: #FFF4E0;
    color: #B26900 !important;
}

/* Mobile: quick-call icon next to the hamburger */
.mobile-header-actions {
    display: flex;
    align-items: center;
    gap: 14px;
}

.mobile-call-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: #E6ECFF;
    color: #4069FF;
    font-size: 15px;
}

.mobile-call-btn:hover {
    background-color: #D2DEFF;
    color: #4069FF;
}

/* Mobile offcanvas menu -- dark theme */
.mobile-nav {
    background: #0E1E36 !important;
}

.mobile-nav .consulter-mobile-nav > ul > li > a,
.mobile-nav .consulter-mobile-nav > ul > li > ul > li > a {
    color: #FFFFFF !important;
}

.mobile-nav .sidebar-nav__bottom-contact-infos h6,
.mobile-nav .sidebar-nav__bottom-social h6 {
    color: rgba(255, 255, 255, 0.6) !important;
}

.mobile-nav .sidebar-nav__bottom-contact-infos a,
.mobile-nav .sidebar-nav__bottom-social a {
    color: #FFFFFF !important;
}

.mobile-nav .close-nav {
    color: #FFFFFF !important;
}

@media (max-width: 1199px) {
    .header.header-1 .main-header-wraper {
        padding: 12px 0;
    }
}