/* Mega Menu base styles - kept theme-neutral */
.megamenu {
    width: 100%;
    background: #fff;
    /* border-bottom: 1px solid #e7e7e7; */
    /*position: relative;*/
    z-index: 100;
}

.megamenu--full {
    /* full width: no inner constraint */
}

.megamenu__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
}

.megamenu--center .megamenu__list {
    justify-content: center;
}

.megamenu__item {
    position: static;
}

.megamenu__link {
    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 14px 18px;
    color: #333;
    text-decoration: none;
    font-weight: 500;
    line-height: 1.2;
    transition: background-color .15s ease, color .15s ease;
}

.megamenu__link:hover,
.megamenu__item:hover > .megamenu__link {
    background: #f5f5f5;
    color: #000;
    text-decoration: none;
}

.megamenu__icon {
    height: 18px;
    max-width: 28px;
    width: auto;
    object-fit: contain;
    vertical-align: middle;
}
.megamenu__icon-class {
    font-size: 16px;
    line-height: 1;
    vertical-align: middle;
}

.megamenu__label {
    background: #ff5252;
    color: #fff;
    font-size: 10px;
    text-transform: uppercase;
    padding: 2px 6px;
    border-radius: 3px;
    line-height: 1;
}

.megamenu__arrow {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    border-radius: 1px;
    transform: rotate(45deg) translateY(-2px);
    transform-origin: 50% 50%;
    transition: transform .35s cubic-bezier(.34, 1.56, .64, 1);
    margin-left: 6px;
    opacity: .7;
    font-size: 0;
    line-height: 0;
}
.megamenu__item--has-submenu:hover > .megamenu__link .megamenu__arrow,
.megamenu__item--has-submenu:focus-within > .megamenu__link .megamenu__arrow {
    transform: rotate(-135deg) translateY(-2px);
    opacity: 1;
}

.megamenu__submenu-wrapper {
    position: absolute;
    left: 0;
    right: 0;
    /* top: 100%; */
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate3d(0, 0, 0);
    transition: opacity .25s ease, transform .25s ease, visibility 0s linear .25s;
}
.megamenu__submenu {
    background: #fff;
    border: 1px solid #e7e7e7;
    border-top: 2px solid #333;
    padding: 20px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .08);
}
.megamenu--content .megamenu__submenu {
    max-width: 1280px;
    margin: 0 auto;
}
.megamenu__item--has-submenu:hover > .megamenu__submenu-wrapper,
.megamenu__item--has-submenu:focus-within > .megamenu__submenu-wrapper {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate3d(0, 0, 0) scale(1) rotateX(0);
    transition: opacity .25s ease, transform .25s ease, visibility 0s linear 0s;
}

/* Initial transform per animation (when hidden) */
.megamenu__submenu-wrapper--anim-0 { transition: none; }
.megamenu__submenu-wrapper--anim-2 { transform: translate3d(0, -15px, 0); }
.megamenu__submenu-wrapper--anim-3 { transform: translate3d(0, 15px, 0); }
.megamenu__submenu-wrapper--anim-4 { transform: scale(.92); transform-origin: top center; }
.megamenu__submenu-wrapper--anim-5 { transform: perspective(800px) rotateX(-18deg); transform-origin: top center; }
.megamenu__submenu-wrapper--anim-6 { transform: translate3d(-15px, 0, 0); }
.megamenu__submenu-wrapper--anim-7 {
    transform: scale(.4);
    transform-origin: top center;
    transition: opacity .25s ease, transform .45s cubic-bezier(.34, 1.56, .64, 1), visibility 0s linear .45s;
}
.megamenu__item--has-submenu:hover > .megamenu__submenu-wrapper--anim-7,
.megamenu__item--has-submenu:focus-within > .megamenu__submenu-wrapper--anim-7 {
    transition: opacity .25s ease, transform .45s cubic-bezier(.34, 1.56, .64, 1), visibility 0s linear 0s;
}

.megamenu__submenu-arrow {
    position: absolute;
    bottom: -1px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #333;
    opacity: 0;
    transition: opacity .2s ease, bottom .2s ease;
    pointer-events: none;
    z-index: 1001;
}
.megamenu__item--has-submenu:hover > .megamenu__link .megamenu__submenu-arrow,
.megamenu__item--has-submenu:focus-within > .megamenu__link .megamenu__submenu-arrow {
    opacity: 1;
    bottom: -8px;
}

.megamenu__row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin: 0;
}

.megamenu__col {
    flex: 0 0 auto;
}

/* 12-column grid */
.megamenu__col--1  { width: calc(8.3333% - 18.34px); }
.megamenu__col--2  { width: calc(16.6666% - 18.34px); }
.megamenu__col--3  { width: calc(25% - 17.5px); }
.megamenu__col--4  { width: calc(33.3333% - 16.66px); }
.megamenu__col--5  { width: calc(41.6666% - 16.04px); }
.megamenu__col--6  { width: calc(50% - 15px); }
.megamenu__col--7  { width: calc(58.3333% - 13.34px); }
.megamenu__col--8  { width: calc(66.6666% - 11.66px); }
.megamenu__col--9  { width: calc(75% - 10px); }
.megamenu__col--10 { width: calc(83.3333% - 8.34px); }
.megamenu__col--11 { width: calc(91.6666% - 6.66px); }
.megamenu__col--12 { width: 100%; }

.megamenu__col-title {
    display: block;
    font-weight: 700;
    font-size: 14px;
    color: #222;
    margin-bottom: 10px;
    padding-bottom: 6px;
    border-bottom: 1px solid #eee;
    text-decoration: none;
}

a.megamenu__col-title:hover {
    color: #000;
    text-decoration: none;
}

.megamenu__col-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.megamenu__col-list li {
    margin: 0;
}

.megamenu__col-list li a {
    display: block;
    padding: 4px 0;
    color: #555;
    text-decoration: none;
    font-size: 13px;
    transition: color .15s ease, padding-left .15s ease;
}

.megamenu__col-list--cols-2,
.megamenu__col-list--cols-3,
.megamenu__col-list--cols-4,
.megamenu__col-list--cols-5,
.megamenu__col-list--cols-6 { column-gap: 20px; }
.megamenu__col-list--cols-2 { column-count: 2; }
.megamenu__col-list--cols-3 { column-count: 3; }
.megamenu__col-list--cols-4 { column-count: 4; }
.megamenu__col-list--cols-5 { column-count: 5; }
.megamenu__col-list--cols-6 { column-count: 6; }
.megamenu__col-list--cols-2 li,
.megamenu__col-list--cols-3 li,
.megamenu__col-list--cols-4 li,
.megamenu__col-list--cols-5 li,
.megamenu__col-list--cols-6 li {
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
}
@media (max-width: 991px) {
    .megamenu__col-list--cols-3,
    .megamenu__col-list--cols-4,
    .megamenu__col-list--cols-5,
    .megamenu__col-list--cols-6 { column-count: 2; }
}
@media (max-width: 600px) {
    .megamenu__col-list--cols-2,
    .megamenu__col-list--cols-3,
    .megamenu__col-list--cols-4,
    .megamenu__col-list--cols-5,
    .megamenu__col-list--cols-6 { column-count: 1; }
}

.megamenu__col-list li a:hover {
    color: #000;
    padding-left: 4px;
    text-decoration: none;
}

.megamenu__col-html {
    font-size: 13px;
    color: #555;
}

.megamenu__col-html img {
    max-width: 100%;
    height: auto;
}

/* Predefined tabs inside submenu */
.megamenu__tabs {
    display: flex;
    align-items: stretch;
    min-height: 240px;
}
.megamenu__tabs-nav {
    list-style: none;
    margin: 0;
    padding: 0;
    flex: 0 0 220px;
    border-right: 1px solid #eee;
    padding-right: 15px;
}
.megamenu__tabs-nav li { margin: 0; }
.megamenu__tabs-link {
    display: block;
    padding: 8px 12px;
    color: #444;
    text-decoration: none;
    border-radius: 3px;
    font-size: 14px;
}
.megamenu__tabs-link:hover {
    background: #f5f5f5;
    color: #000;
    text-decoration: none;
}
.megamenu__tabs-link.is-active {
    background: #333;
    color: #fff;
    font-weight: 600;
}
.megamenu__tabs-content {
    flex: 1 1 auto;
    padding-left: 20px;
}
.megamenu__tabs-pane { display: none; }
.megamenu__tabs-pane.is-active { display: block; }
@media (max-width: 768px) {
    .megamenu__tabs { flex-direction: column; }
    .megamenu__tabs-nav { flex: 0 0 auto; border-right: none; border-bottom: 1px solid #eee; padding-right: 0; padding-bottom: 10px; margin-bottom: 10px; }
    .megamenu__tabs-content { padding-left: 0; }
}

.megamenu-extras {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 8px 16px;
    border-top: 1px solid #f0f0f0;
    background: #fafafa;
    flex-wrap: wrap;
}
.megamenu-extras__lang,
.megamenu-extras__social { display: inline-flex; align-items: center; }
.megamenu-extras--mobile {
    flex-direction: column;
    align-items: stretch;
    border-top: 1px solid #eee;
    background: #fff;
    padding: 12px 16px;
    gap: 12px;
}
.megamenu-langs__list,
.megamenu-social__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.megamenu-langs__item a {
    display: inline-block;
    padding: 4px 10px;
    border: 1px solid #ddd;
    border-radius: 3px;
    color: #333;
    font-size: 12px;
    text-transform: uppercase;
    text-decoration: none;
}
.megamenu-langs__item a:hover { background: #f5f5f5; color: #000; text-decoration: none; }
.megamenu-langs__item.is-active a { background: #333; color: #fff; border-color: #333; }
.megamenu-social__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: #333;
    color: #fff;
    border-radius: 50%;
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
}
.megamenu-social__link:hover { background: #555; color: #fff; text-decoration: none; }
.megamenu-social__link--facebook { background: #3b5998; }
.megamenu-social__link--twitter { background: #000; }
.megamenu-social__link--youtube { background: #c4302b; }
.megamenu-social__link--instagram { background: #e1306c; }
.megamenu-social__link--pinterest { background: #bd081c; }
.megamenu-social__link--vimeo { background: #1ab7ea; }
.megamenu-social__link--rss { background: #ee802f; }

/* Sticky behaviour (basic) */
.megamenu--sticky {
    position: sticky;
    top: 0;
}

@media (max-width: 768px) {
    .megamenu__list { flex-direction: column; }
    .megamenu__submenu-wrapper { position: static; transform: none !important; left: auto; right: auto; opacity: 1; visibility: visible; pointer-events: auto; transition: none; }
    .megamenu__submenu { box-shadow: none; padding: 12px; }
    .megamenu__col { width: 100% !important; }
}

/* Vertical menu (displayLeftColumn) */
.megamenu--vertical {
    width: 100%;
    background: #fff;
    border: 1px solid #e7e7e7;
    margin-bottom: 20px;
    padding: 0;
}
.megamenu__v-title {
    background: #f5f5f5;
    padding: 12px 15px;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 13px;
    color: #333;
    border-bottom: 1px solid #e7e7e7;
}
.megamenu__v-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.megamenu__v-item {
    border-bottom: 1px solid #f0f0f0;
    position: relative;
}
.megamenu__v-item:last-child {
    border-bottom: none;
}
.megamenu__v-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 15px;
    color: #333;
    text-decoration: none;
    font-size: 14px;
}
.megamenu__v-link:hover,
.megamenu__v-item:hover > .megamenu__v-link {
    background: #f7f7f7;
    color: #000;
    text-decoration: none;
}
.megamenu__v-arrow {
    color: #888;
    font-size: 12px;
}
.megamenu__v-submenu {
    position: absolute;
    top: 0;
    left: 100%;
    background: #fff;
    border: 1px solid #e7e7e7;
    border-left: 2px solid #333;
    padding: 20px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .08);
    display: none;
    z-index: 1000;
    min-width: 480px;
}
.megamenu__v-item--has-submenu:hover > .megamenu__v-submenu,
.megamenu__v-item--has-submenu:focus-within > .megamenu__v-submenu {
    display: block;
}
@media (max-width: 768px) {
    .megamenu__v-submenu { position: static; box-shadow: none; padding: 12px; min-width: 0; border-left: none; }
}

/* Mobile/desktop visibility - 991px = mobile, 992px+ = desktop */
.megamenu-mobile-wrapper.mm-show-mobile { display: none; }
.megamenu-mobile-wrapper.mm-show-mobile.mm-show-mobile--always { display: inline-block; }
@media (max-width: 991px) {
    .megamenu--horizontal { display: none !important; }
    .megamenu-mobile-wrapper.mm-show-mobile { display: inline-block; }
}

/* Mobile menu drawer */
.megamenu-mobile-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
    background: transparent;
    border: 0;
    color: #333;
    cursor: pointer;
    margin-top: 10px;
}
.megamenu-mobile-trigger__icon {
    width: 28px;
    height: 27px;
    position: relative;
    display: inline-block;
}
.megamenu-mobile-trigger__icon::before,
.megamenu-mobile-trigger__icon::after,
.megamenu-mobile-trigger__icon span {
    display: block;
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background: #333;
    border-radius: 1px;
}
/* .megamenu-mobile-trigger__icon::before { content: ''; top: 0; }
.megamenu-mobile-trigger__icon::after { content: ''; bottom: 0; } */
.megamenu-mobile-trigger__icon{
    background: url(../../../../themes/condalab/assets/img/ico-menu-mobile.png?);
}
.megamenu-mobile-trigger__icon::before,
.megamenu-mobile-trigger__icon::after {
    box-shadow: 0 6px 0 #333;
}

.megamenu-mobile-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .45);
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s ease, visibility .25s ease;
    z-index: 9998;
}
.megamenu-mobile-wrapper {
    position: relative;
    display: inline-block;
}
.megamenu-mobile-wrapper--dropdown {
    display: block;
    width: 100%;
}

.megamenu-mobile-drawer {
    position: fixed;
    top: 0;
    left: -10px;
    width: 100vw;
    max-width: 100vw;
    height: 100vh; /* fallback navegadores sin dvh */
    height: 100dvh; /* respeta UI bars dinámicas (Android nav, iOS chrome) */
    background: transparent;
    /* box-shadow: 4px 0 16px rgba(0, 0, 0, .15); */
    transform: translateX(-100%);
    transition: transform .3s ease;
    z-index: 9999;
    overflow-y: auto;
}
.megamenu-mobile-drawer--right {
    left: auto;
    right: 0;
    box-shadow: -4px 0 16px rgba(0, 0, 0, .15);
    transform: translateX(100%);
}
.megamenu-mobile-drawer--dropdown {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    width: auto;
    height: auto;
    max-height: 70vh;
    transform: scaleY(0);
    transform-origin: top;
    transition: transform .25s ease, opacity .25s ease;
    opacity: 0;
    box-shadow: 0 6px 14px rgba(0, 0, 0, .12);
    z-index: 9999;
}

body.megamenu-mobile-open .megamenu-mobile-overlay {
    /* opacity: 1; */
    /* visibility: visible; */
}
body.megamenu-mobile-open .megamenu-mobile-drawer {
    transform: translateX(0);
}
body.megamenu-mobile-open .megamenu-mobile-drawer--right {
    transform: translateX(0);
}
body.megamenu-mobile-open .megamenu-mobile-drawer--dropdown {
    transform: scaleY(1);
    opacity: 1;
}
.megamenu-mobile-drawer__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    border-bottom: 1px solid #eee;
    background: #f7f7f7;
}
.megamenu-mobile-drawer__title {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 13px;
    color: #333;
}
.megamenu-mobile-drawer__close {
    background: transparent;
    border: 0;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
    color: #666;
    padding: 0 4px;
    background: url(../../../../themes/condalab/assets/img/btn-close-menu-mobile.png);
    font-size: 0px;
    width: 27px;
    height: 27px;
    margin-left: 16px;
}
.megamenu-mobile-drawer__close:hover { color: #000; }

.megamenu-mobile-stack {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.megamenu-mobile-panel {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: transparent;
    transform: translateX(100%);
    transition: transform .3s ease;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}
.megamenu-mobile-panel.is-active { transform: translateX(0); z-index: 2; }
.megamenu-mobile-panel.is-out { transform: translateX(-100%); z-index: 1; }
.megamenu-mobile-drawer--right .megamenu-mobile-panel { transform: translateX(-100%); }
.megamenu-mobile-drawer--right .megamenu-mobile-panel.is-active { transform: translateX(0); }
.megamenu-mobile-drawer--right .megamenu-mobile-panel.is-out { transform: translateX(100%); }

.megamenu-mobile-panel__head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 11px;
    background: #009a17;
    flex: 0 0 auto;
    width: 70px;
    height: 66px;
}
.megamenu-mobile-panel__title {
    flex: 1 1 auto;
    font-weight: 700;
    font-size: 14px;
    color: #333;
    text-align: center;
    display: none;
}
.megamenu-mobile-panel__back {
    background: transparent;
    border: 0;
    color: white;
    font-size: 14px;
    cursor: pointer;
    padding: 6px 10px;
    border-radius: 3px;
    line-height: 20px;

}
.megamenu-mobile-panel__back:hover { background: #ececec; color: #000; }
.megamenu-mobile-panel__list {
    list-style: none;
    margin: 0;
    padding: 0;
    flex: 1 1 auto;
    overflow-y: auto;
    background: white;
}
.megamenu-mobile-panel__item {
    display: flex;
    align-items: stretch;
    border-bottom: 1px solid #f0f0f0;
}
.megamenu-mobile-panel__link {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 17px 31px;
    color: #333;
    text-decoration: none;
    font-size: 15px;
    text-transform: uppercase;
    color: black;
}
.megamenu-mobile-panel__link:hover { background: #f5f5f5; color: #000; text-decoration: none; }
.megamenu-mobile-panel__next {
    flex: 0 0 50px;
    width: 50px;
    background: transparent;
    border: 0;
    border-left: 1px solid #f0f0f0;
    cursor: pointer;
    font-size: 22px;
    color: black;
    line-height: 1;
}
.megamenu-mobile-panel__next:hover { background: #f5f5f5; color: #333; }

.megamenu-mobile__list,
.megamenu-mobile__sublist {
    list-style: none;
    margin: 0;
    padding: 0;
}
.megamenu-mobile__item {
    border-bottom: 1px solid #f0f0f0;
}
.megamenu-mobile__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.megamenu-mobile__link {
    flex: 1 1 auto;
    display: block;
    padding: 12px 16px;
    color: #333;
    text-decoration: none;
    font-size: 15px;
}
.megamenu-mobile__link:hover { background: #f5f5f5; color: #000; text-decoration: none; }
.megamenu-mobile__toggle {
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    background: transparent;
    border: 0;
    border-left: 1px solid #f0f0f0;
    cursor: pointer;
    font-size: 18px;
    color: #888;
}
.megamenu-mobile__toggle.is-open { color: #333; transform: rotate(45deg); }

.megamenu-mobile__sub {
    display: none;
    background: #fafafa;
    border-top: 1px solid #f0f0f0;
    padding: 8px 16px;
}
.megamenu-mobile__item.is-open > .megamenu-mobile__sub { display: block; }

.megamenu-mobile__group { padding: 8px 0; border-bottom: 1px dashed #e8e8e8; }
.megamenu-mobile__group:last-child { border-bottom: 0; }
.megamenu-mobile__group-title,
.megamenu-mobile__col-title {
    display: block;
    font-weight: 600;
    color: #222;
    margin-bottom: 6px;
    font-size: 13px;
    text-decoration: none;
}
.megamenu-mobile__sublist li a {
    display: block;
    padding: 6px 8px;
    color: #555;
    text-decoration: none;
    font-size: 13px;
}
.megamenu-mobile__sublist li a:hover { color: #000; background: #f0f0f0; }
.megamenu-mobile__html { font-size: 13px; color: #555; }
.megamenu-mobile__html img { max-width: 100%; height: auto; }

/* Mobile drawer: pin extras (lang/social) to the bottom always visible */
.megamenu-mobile-drawer {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.megamenu-mobile-drawer .megamenu-mobile-stack {
    flex: 1 1 auto;
    height: auto;
    min-height: 0;
}
.megamenu-mobile-drawer .megamenu-extras--mobile {
    flex: 0 0 auto;
    margin-top: auto;
    position: sticky;
    bottom: 0;
    z-index: 3;
    box-shadow: 0 -2px 6px rgba(0,0,0,.06);
    /* Respetar barra de navegación de Android e iOS home indicator */
    padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    padding-left: calc(16px + env(safe-area-inset-left, 0px));
    padding-right: calc(16px + env(safe-area-inset-right, 0px));
    background: #fff;
}
.megamenu-mobile-drawer--dropdown .megamenu-extras--mobile {
    position: static;
    box-shadow: none;
}
