/* ── Menú vertical: megamenú por encima del hero (inicio) ── */
@media (min-width: 1200px) {
    body.page-home #header.u-header {
        position: relative;
        z-index: 10050 !important;
    }

    body.page-home #header .u-header__section {
        overflow: visible !important;
    }

    body.page-home #header .nexlap-header-nav-row,
    body.page-home #header .nexlap-vertical-menu-wrap,
    body.page-home #header #basicsAccordion,
    body.page-home #header #basicsAccordion .card,
    body.page-home #header #basicsCollapseOne,
    body.page-home #header #basicsCollapseOne .card-body,
    body.page-home #header .vertical-menu,
    body.page-home #header .vertical-menu .js-mega-menu,
    body.page-home #header .vertical-menu .u-header__navbar-collapse,
    body.page-home #header .vertical-menu .u-header__navbar-nav {
        overflow: visible !important;
    }

    body.page-home #header .nexlap-header-nav-row {
        position: relative;
        z-index: 10050;
    }

    body.page-home #header .nexlap-vertical-menu-wrap {
        position: relative;
        z-index: 10051;
    }

    body.page-home #header .vertical-menu {
        z-index: 10052 !important;
    }

    body.page-home #header .vertical-menu .u-header__nav-item.hs-has-mega-menu {
        position: static;
    }

    body.page-home #header .vertical-menu .u-header__nav-item.hs-mega-menu-opened {
        position: relative !important;
        overflow: visible !important;
        z-index: 10053 !important;
    }

    body.page-home #header .vertical-menu .u-header__nav-item.hs-mega-menu-opened .u-header__sub-menu,
    body.page-home #header .vertical-menu .u-header__nav-item.hs-mega-menu-opened .hs-mega-menu,
    body.page-home #header .vertical-menu .hs-mega-menu.u-header__sub-menu {
        z-index: 10054 !important;
        position: absolute !important;
        background-color: #fff !important;
        box-shadow: 0 14px 40px rgba(51, 62, 72, 0.18);
        bottom: auto !important;
    }

    /* Hero y slick por debajo del header/megamenú */
    body.page-home main#content {
        position: relative;
        z-index: 0 !important;
        isolation: isolate;
    }

    body.page-home main#content > .mb-5:first-child,
    body.page-home main#content .bg-img-hero,
    body.page-home main#content .js-slick-carousel,
    body.page-home main#content .u-slick,
    body.page-home main#content .slick-list,
    body.page-home main#content .slick-track,
    body.page-home main#content .slick-slide,
    body.page-home main#content .js-slide {
        z-index: 0 !important;
    }
}

/* Menú hamburguesa por encima del menú vertical / megamenú */
#sidebarHeader1.u-sidebar:not(.u-unfold--hidden) {
    z-index: 10160 !important;
}

body.nexlap-sidebar-open #header .vertical-menu .hs-mega-menu-opened .u-header__sub-menu,
body.nexlap-sidebar-open #header .vertical-menu .hs-mega-menu-opened .hs-mega-menu {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

body.nexlap-sidebar-open #header .nexlap-vertical-menu-wrap,
body.nexlap-sidebar-open #header .vertical-menu {
    pointer-events: none !important;
}

/* Móvil / tablet: ocultar menú vertical de escritorio (solo hamburguesa) */
@media (max-width: 1199.98px) {
    #header .nexlap-header-nav-row,
    #header .nexlap-vertical-menu-wrap,
    #header .vertical-menu,
    #header .vertical-menu .hs-mega-menu,
    #header .vertical-menu .u-header__sub-menu {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    #sidebarHeader1.u-sidebar:not(.u-unfold--hidden) {
        width: min(100vw, 20rem);
        box-shadow: 4px 0 24px rgba(51, 62, 72, 0.18);
    }
}

/* Index: header y menú lateral móvil en blanco */
@media (max-width: 1199.98px) {
    body.page-home #header #sidebarHeader1,
    body.page-home #header #sidebarHeader1 .u-sidebar__container,
    body.page-home #header #sidebarHeader1 .u-sidebar__body,
    body.page-home #header #sidebarHeader1 .u-header-sidebar__content {
        background-color: #fff !important;
    }
}

/* Iconos del menú móvil superior (buscar, cuenta, hamburguesa) */
@media (max-width: 1199.98px) {
    #header .d-xl-none #searchClassicInvoker,
    #header .d-xl-none #searchClassicInvoker .ec,
    #header .d-xl-none a[title="Buscar"] .ec,
    #header .d-xl-none a[title="Search"] .ec,
    #header .d-xl-none .ec-search {
        color: #83B917 !important;
    }

    #header .d-xl-none #searchClassicInvoker:hover,
    #header .d-xl-none #searchClassicInvoker:focus,
    #header .d-xl-none a[title="Buscar"]:hover {
        color: #6d9b13 !important;
    }

    /* Carrito móvil: mismo gris que el resto de iconos de la fila blanca */
    #header .d-xl-none .nexlap-mobile-cart-trigger,
    #header .d-xl-none .nexlap-mobile-cart-trigger .ec-shopping-bag {
        color: #333e48 !important;
    }

    #header .u-hamburger__inner,
    #header .u-hamburger__inner::before,
    #header .u-hamburger__inner::after {
        background-color: #83B917;
    }
}

/* Escritorio: carrito en barra verde (blanco) */
@media (min-width: 1200px) {
    #header .bg-primary #basicDropdownHoverInvoker .ec-shopping-bag {
        color: #fff !important;
    }

    #header .bg-primary #cartTotalAmount {
        color: #fff !important;
    }
}

/* ── Preview del carrito (dropdown) ── */
#basicDropdownHover.nexlap-cart-preview {
    min-width: 22rem;
    max-width: 22.5rem;
    padding: 0;
    margin-top: 0.75rem !important;
    border: none !important;
    border-radius: 12px;
    box-shadow: 0 12px 40px rgba(51, 62, 72, 0.14), 0 2px 8px rgba(51, 62, 72, 0.06);
    overflow: hidden;
}

#basicDropdownHover.nexlap-cart-preview::before {
    content: '';
    display: block;
    height: 3px;
    background: linear-gradient(90deg, #83B917 0%, #6d9b13 100%);
}

#basicDropdownHover.nexlap-cart-preview > .px-3.pt-3 {
    padding: 1rem 1rem 0.5rem !important;
}

#basicDropdownHover.nexlap-cart-preview #cartDropdownItems {
    max-height: 17.5rem;
    overflow-y: auto;
    padding: 0.25rem 0.15rem 0.5rem 0;
    margin: 0;
    scrollbar-width: thin;
    scrollbar-color: #c5cad1 transparent;
}

#basicDropdownHover.nexlap-cart-preview #cartDropdownItems::-webkit-scrollbar {
    width: 5px;
}

#basicDropdownHover.nexlap-cart-preview #cartDropdownItems::-webkit-scrollbar-thumb {
    background: #c5cad1;
    border-radius: 999px;
}

#basicDropdownHover.nexlap-cart-preview #cartDropdownItems::-webkit-scrollbar-thumb:hover {
    background: #a8afb8;
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-preview__empty,
#basicDropdownHover.nexlap-cart-preview #cartEmptyMessage.nexlap-cart-preview__empty {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    padding: 2rem 1.25rem;
    margin: 0;
    color: #77838f;
    font-size: 0.875rem;
    text-align: center;
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-preview__empty-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 50%;
    background: #f3f5f7;
    color: #c5cad1;
    font-size: 1.5rem;
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-item {
    list-style: none;
    padding: 0.75rem 0;
    border-bottom: 1px solid #eef0f3;
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-item:last-child {
    border-bottom: none;
    padding-bottom: 0.25rem;
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-item__inner {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-item__thumb {
    flex: 0 0 4.25rem;
    width: 4.25rem;
    height: 4.25rem;
    border-radius: 10px;
    background: #f7f8fa;
    border: 1px solid #eef0f3;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-item__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-item__placeholder {
    color: #b0b8c0;
    font-size: 1.35rem;
    line-height: 1;
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-item__body {
    flex: 1;
    min-width: 0;
    padding-top: 0.1rem;
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-item__name {
    margin: 0 0 0.35rem;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.35;
    color: #333e48;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-item__pricing {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.35rem 0.5rem;
    margin-bottom: 0.5rem;
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-item__total {
    font-size: 0.9375rem;
    font-weight: 700;
    color: #333e48;
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-item__unit {
    font-size: 0.75rem;
    color: #77838f !important;
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-qty {
    display: inline-flex;
    align-items: center;
    gap: 0;
    background: #f3f5f7;
    border-radius: 999px;
    padding: 0.15rem;
    border: 1px solid #e4e8ec;
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-qty__btn {
    width: 1.65rem;
    height: 1.65rem;
    border: none;
    border-radius: 50%;
    background: #fff;
    color: #333e48;
    font-size: 1rem;
    line-height: 1;
    padding: 0;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
    box-shadow: 0 1px 2px rgba(51, 62, 72, 0.08);
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-qty__btn:hover {
    background: #83B917;
    color: #fff;
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-qty__value {
    min-width: 1.5rem;
    text-align: center;
    font-size: 0.8125rem;
    font-weight: 700;
    color: #333e48;
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-item__remove {
    flex: 0 0 auto;
    width: 1.75rem;
    height: 1.75rem;
    margin-top: 0.1rem;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: #b0b8c0;
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

#basicDropdownHover.nexlap-cart-preview .nexlap-cart-item__remove:hover {
    background: #fdecea;
    color: #e74c3c;
}

#basicDropdownHover.nexlap-cart-preview > .px-3.border-top {
    padding: 0.85rem 1rem !important;
    margin: 0;
    background: #fafbfc;
    border-top: 1px solid #eef0f3 !important;
}

#basicDropdownHover.nexlap-cart-preview > .px-3.border-top .text-gray-60 {
    font-size: 0.8125rem;
    color: #77838f !important;
}

#basicDropdownHover.nexlap-cart-preview #cartDropdownSubtotal {
    font-size: 1.0625rem;
    font-weight: 700;
    color: #333e48 !important;
}

#basicDropdownHover.nexlap-cart-preview > .flex-center-between {
    padding: 0.85rem 1rem 1rem !important;
    gap: 0.5rem;
    background: #fff;
}

#basicDropdownHover.nexlap-cart-preview > .flex-center-between .btn-soft-secondary {
    flex: 1;
    margin: 0 !important;
    padding: 0.55rem 0.75rem !important;
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    border-radius: 999px !important;
    border: 1px solid #dde2e8 !important;
    background: #fff !important;
    color: #333e48 !important;
    text-align: center;
    white-space: nowrap;
}

#basicDropdownHover.nexlap-cart-preview > .flex-center-between .btn-soft-secondary:hover {
    border-color: #333e48 !important;
    background: #333e48 !important;
    color: #fff !important;
}

#basicDropdownHover.nexlap-cart-preview > .flex-center-between .btn-primary-dark-w,
#basicDropdownHover.nexlap-cart-preview > .flex-center-between .nexlap-checkout-btn {
    flex: 1;
    margin: 0 !important;
    padding: 0.55rem 0.75rem !important;
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    border-radius: 999px !important;
    text-align: center;
    white-space: nowrap;
    border: none !important;
    background: linear-gradient(135deg, #25d366 0%, #128c7e 100%) !important;
    color: #fff !important;
    box-shadow: 0 4px 14px rgba(37, 211, 102, 0.35);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
}

#basicDropdownHover.nexlap-cart-preview > .flex-center-between .nexlap-checkout-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(37, 211, 102, 0.45);
    color: #fff !important;
}

#basicDropdownHover.nexlap-cart-preview > .flex-center-between .nexlap-checkout-btn.is-loading {
    opacity: 0.75;
    pointer-events: none;
}

/* Botón checkout (WhatsApp) — global */
.nexlap-checkout-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    border: none !important;
    background: linear-gradient(135deg, #25d366 0%, #128c7e 100%) !important;
    color: #fff !important;
    box-shadow: 0 4px 14px rgba(37, 211, 102, 0.3);
    transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
}

.nexlap-checkout-btn:hover,
.nexlap-checkout-btn:focus {
    color: #fff !important;
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(37, 211, 102, 0.42);
}

.nexlap-checkout-btn.is-loading {
    opacity: 0.75;
    pointer-events: none;
}

.nexlap-checkout-btn--page {
    padding: 0.85rem 1.25rem !important;
    font-size: 1rem !important;
    border-radius: 10px !important;
}

.nexlap-checkout-toast {
    position: fixed;
    bottom: 1.5rem;
    left: 50%;
    z-index: 9999;
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    max-width: min(92vw, 22rem);
    padding: 0.85rem 1.1rem;
    border-radius: 12px;
    background: #333e48;
    color: #fff;
    font-size: 0.875rem;
    line-height: 1.4;
    box-shadow: 0 10px 30px rgba(51, 62, 72, 0.25);
    transform: translate(-50%, 120%);
    opacity: 0;
    transition: transform 0.25s ease, opacity 0.25s ease;
    pointer-events: none;
}

.nexlap-checkout-toast.is-visible {
    transform: translate(-50%, 0);
    opacity: 1;
}

.nexlap-checkout-toast--warning {
    background: #fff3cd;
    color: #856404;
    border: 1px solid #ffeeba;
}

.nexlap-checkout-toast--warning .ec {
    font-size: 1.15rem;
}

@media (max-width: 1199.98px) {
    #header .cart-dropdown.dropdown-unfold.nexlap-cart-preview {
        right: 0.75rem !important;
        left: auto !important;
        min-width: min(100vw - 1.5rem, 22.5rem);
        max-width: min(100vw - 1.5rem, 22.5rem);
    }
}
