/* Desplegables públicos: jerarquía clara, aire y un solo contenedor visual. */
@media (min-width:901px){
  .header{position:relative;z-index:1000;overflow:visible!important;padding-block:11px!important}
  .header>.logo{display:flex;align-items:center;justify-content:flex-start;width:285px;min-width:285px;height:60px;overflow:hidden}
  .header>.logo img{display:block;width:278px;height:auto;max-width:100%;object-fit:contain;object-position:left center}
  .header-actions{position:relative;z-index:1100;overflow:visible!important}
  .nav-menu{z-index:300;align-items:center;margin:0;list-style:none;padding-block:10px!important}
  .nav-menu>li{display:flex;align-items:center;height:48px;min-height:48px;padding:0;box-sizing:border-box}
  .nav-menu>li>div,.nav-menu>li>a,.nav-menu>li>div>a{display:flex;align-items:center;min-height:28px;gap:7px;line-height:1;box-sizing:border-box}
  .nav-menu>li>div{width:auto!important;justify-content:flex-start!important}
  .nav-menu>li>a,.nav-menu>li>div>a{white-space:nowrap}
  .nav-menu>li>a svg,.nav-menu>li>div>a svg,.nav-menu .chevron{display:block;flex:0 0 auto}
  .nav-label-icon{width:14px;height:14px}
  .dropdown{top:calc(100% + 4px)!important;padding:8px!important;border:1px solid #e4e9f1!important;border-top:1px solid #e4e9f1!important;border-radius:12px!important;background:#fff!important;box-shadow:0 18px 44px rgba(15,23,42,.14)!important;transform:translateY(8px);transition:opacity .18s ease,visibility .18s ease,transform .18s ease!important;overflow:visible}
  .dropdown:before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
  .nav-menu>li:hover>.dropdown,.nav-menu>li.active>.dropdown{transform:translateY(0)}
  .dropdown li{list-style:none}
  .dropdown a{padding:10px 12px!important;border-radius:8px;color:#1e293b!important;font-size:12px!important;font-weight:650!important;line-height:1.35;text-transform:none!important;letter-spacing:.01em;transition:background .15s,color .15s,transform .15s!important}
  .dropdown a:hover{background:#f5f3ff!important;color:#7c3aed!important;transform:translateX(2px)}

  .dropdown-megamenu{display:block!important;width:470px!important;min-width:470px!important;min-height:235px;padding:8px!important}
  .dropdown-megamenu .mega-parents{position:relative;width:210px!important;min-height:219px;margin:0!important;padding:0 8px 0 0!important;border-right:1px solid #e8edf4!important;box-sizing:border-box}
  .dropdown-megamenu .mega-parents>li{position:static!important;margin:2px 0}
  .dropdown-megamenu .mega-parents>li>a{min-height:38px;padding:9px 10px!important;box-sizing:border-box;text-transform:uppercase!important;font-size:11px!important;font-weight:750!important;letter-spacing:.035em}
  .dropdown-megamenu .mega-parents>li>a svg{color:#7c3aed;flex:0 0 auto}
  .dropdown-megamenu .mega-parents>li:hover>a{background:#f5f3ff!important;color:#7c3aed!important}
  .dropdown-megamenu .mega-subs{display:none;position:absolute!important;top:0!important;left:210px!important;width:244px!important;min-width:244px!important;min-height:219px;padding:38px 8px 8px 16px!important;border:0!important;border-radius:0 10px 10px 0!important;background:#fbfcff!important;box-shadow:none!important;box-sizing:border-box}
  .dropdown-megamenu .mega-subs:before{content:"SUBCATEGORÍAS";position:absolute;top:12px;left:16px;color:#94a3b8;font-size:9px;font-weight:800;letter-spacing:.11em}
  .dropdown-megamenu .mega-subs a{padding:9px 10px!important;white-space:normal!important;overflow-wrap:anywhere}
  .dropdown-megamenu .mega-parents>li:first-child>.mega-subs{display:block}
  .dropdown-megamenu .mega-parents:hover>li:first-child:not(:hover)>.mega-subs{display:none}
  .dropdown-megamenu .mega-parents>li:hover>.mega-subs{display:block!important}

  .dropdown-collections{width:390px!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:5px!important;padding:10px!important}
  .dropdown-collections>li:first-child{grid-column:1/-1;padding:7px 10px 8px!important;border-bottom:1px solid #edf1f6;margin-bottom:3px}
  .dropdown-collections a{height:100%;box-sizing:border-box;background:#fafbfe}
  .nav-menu>li>.dropdown:not(.dropdown-megamenu):not(.dropdown-collections){width:250px!important;padding:10px!important}
  .nav-menu>li>.dropdown:not(.dropdown-megamenu):not(.dropdown-collections)>li:first-child{padding:5px 10px 9px!important;border-bottom:1px solid #edf1f6;margin-bottom:4px}

  /* El perfil vive en el encabezado, no en la navegación. Se crea un puente
     real de interacción y también se admite clic/foco para no depender del hover. */
  .user-dropdown-container{position:relative;z-index:1200;isolation:isolate;overflow:visible!important}
  .user-dropdown-container:after{content:"";position:absolute;z-index:1201;top:100%;right:-12px;width:250px;height:18px}
  .user-dropdown-container>.dropdown{display:block!important;z-index:1210!important;top:calc(100% + 10px)!important;right:-8px!important;left:auto!important;width:218px!important;margin:0!important;padding:9px!important;border:1px solid #e2e8f0!important;border-radius:12px!important;background:#fff!important;box-shadow:0 18px 44px rgba(15,23,42,.16)!important;transform:translateY(5px)!important;opacity:0!important;visibility:hidden!important;pointer-events:none;transition:opacity .16s ease,visibility .16s ease,transform .16s ease!important}
  .user-dropdown-container>.dropdown:before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
  .user-dropdown-container:focus-within>.dropdown,.user-dropdown-container.is-open>.dropdown{opacity:1!important;visibility:visible!important;pointer-events:auto;transform:translateY(0)!important}
  .user-dropdown-container>.dropdown li{margin:0!important;padding:0!important}
  .user-dropdown-container>.dropdown a{display:flex!important;align-items:center;min-height:38px;padding:9px 12px!important;border-radius:8px;font-size:12px!important;font-weight:700!important;color:#1e293b!important}
  .user-dropdown-container>.dropdown a:hover,.user-dropdown-container>.dropdown a:focus{background:#f5f3ff!important;color:#7c3aed!important;outline:0}
}

@media (min-width:901px) and (max-width:1180px){
  .header>.logo{width:225px;min-width:225px}
  .header>.logo img{width:218px}
  .header .search-container{margin-inline:20px!important}
  .header-actions{gap:10px!important}
}

.footer-brand .footer-logo{display:block;width:min(245px,100%);height:auto;margin:0 auto 18px;filter:none!important;object-fit:contain}

@media (max-width:900px){
  .header>.logo{display:flex;align-items:center;justify-content:flex-start;min-width:0;overflow:hidden}
  .header>.logo img{display:block;width:190px;height:auto;max-width:100%;object-fit:contain;object-position:left center}
  .nav-menu>li>a,.nav-menu>li>div>a{display:flex;align-items:center;gap:8px;line-height:1.25}
  .nav-label-icon{display:block;width:15px;height:15px;flex:0 0 auto}
  .dropdown{transform:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:#fff!important;padding:8px 0 8px 12px!important}
  .dropdown:before{display:none!important}
  .dropdown-megamenu{width:100%!important;min-width:0!important;min-height:0!important;padding-left:8px!important}
  .dropdown-megamenu .mega-parents{position:static!important;width:100%!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important}
  .dropdown-megamenu .mega-parents>li{position:relative!important;margin:0!important}
  .dropdown-megamenu .mega-parents>li>a{padding:10px 8px!important;border-radius:8px;font-size:12px!important}
  .dropdown-megamenu .mega-subs,.dropdown-megamenu .mega-parents>li:first-child>.mega-subs{position:static!important;display:block!important;width:auto!important;min-width:0!important;min-height:0!important;margin:2px 0 7px 10px!important;padding:2px 0 2px 12px!important;border-left:1px solid #dbe4f0!important;background:transparent!important;box-shadow:none!important}
  .dropdown-megamenu .mega-subs:before{display:none!important}
  .dropdown-megamenu .mega-subs a{padding:8px 10px!important;color:#64748b!important;font-size:11px!important}
  .dropdown-collections{width:100%!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:5px!important;padding:8px!important}
  .dropdown-collections>li:first-child{grid-column:1/-1}
}

/* Drawer movil: conserva la navegacion dinamica del escritorio en una
   presentacion lateral compacta, accesible y sin bloquear la lectura. */
@media (max-width:900px){
  body.mobile-menu-open{overflow:hidden!important}
  .mobile-nav-backdrop{position:fixed;z-index:9990;top:var(--mobile-nav-top,92px);right:0;bottom:0;left:0;background:rgba(15,23,42,.5);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:opacity .24s ease,visibility .24s ease}
  body.mobile-menu-open .mobile-nav-backdrop{opacity:1;visibility:visible}

  .nav-menu{display:flex!important;position:fixed!important;z-index:10000!important;top:var(--mobile-nav-top,92px)!important;right:auto!important;bottom:0!important;left:0!important;width:min(88vw,390px)!important;height:auto!important;margin:0!important;padding:12px 10px 16px!important;box-sizing:border-box!important;flex-direction:column!important;justify-content:flex-start!important;align-items:stretch!important;gap:3px!important;overflow-x:hidden!important;overflow-y:auto!important;overscroll-behavior:contain;background:#fff!important;border:0!important;border-radius:0 18px 0 0!important;box-shadow:18px 0 42px rgba(15,23,42,.2)!important;transform:translateX(calc(-100% - 24px));visibility:hidden;pointer-events:none;transition:transform .28s cubic-bezier(.22,1,.36,1),visibility .28s ease!important}
  .nav-menu.active{transform:translateX(0);visibility:visible;pointer-events:auto}
  .nav-menu::-webkit-scrollbar{width:5px}
  .nav-menu::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:999px}

  .nav-menu>li{display:flex!important;width:100%!important;min-width:0!important;margin:0!important;padding:0!important;box-sizing:border-box!important;flex:0 0 auto!important;align-items:stretch!important;border:0!important;border-bottom:1px solid #f1f4f8!important;border-radius:10px!important;color:#172033!important;font-size:13px!important;font-weight:750!important;line-height:1.25!important;letter-spacing:.015em!important;transition:background .18s ease,color .18s ease!important}
  .nav-menu>li:not(.mobile-extra:last-child):hover,.nav-menu>li.active{background:#f6f3ff!important}
  .nav-menu>li.current{background:linear-gradient(90deg,#f2ebff,#faf8ff)!important;color:#6d28d9!important;box-shadow:inset 3px 0 #8b5cf6}
  .nav-menu>li>a,.nav-menu>li>div{width:100%!important;min-width:0!important;min-height:50px!important;box-sizing:border-box!important;padding:0 14px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;border-radius:10px!important}
  .nav-menu>li>a:has(.nav-label-icon){justify-content:flex-start!important}
  .nav-menu>li>div>a{display:flex!important;align-items:center!important;min-width:0!important;min-height:50px!important;gap:9px!important;flex:1!important}
  .nav-menu>li .chevron{flex:0 0 auto;transition:transform .2s ease!important}
  .nav-menu>li.active .chevron{transform:rotate(180deg)}

  .nav-menu .dropdown{width:calc(100% - 18px)!important;margin:0 9px 7px!important;padding:6px!important;box-sizing:border-box!important;background:#f8fafc!important;border:1px solid #e8edf4!important;border-radius:10px!important}
  .nav-menu>li.active>.dropdown{animation:mobileSubmenuIn .2s ease both}
  @keyframes mobileSubmenuIn{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
  .nav-menu .dropdown-label{padding:6px 9px!important;color:#94a3b8!important;font-size:9px!important;letter-spacing:.1em!important}
  .nav-menu .dropdown a{min-height:34px!important;padding:6px 9px!important;box-sizing:border-box!important;border-radius:7px!important;color:#334155!important;font-size:10.5px!important;font-weight:700!important;line-height:1.25!important}
  .nav-menu .dropdown a:hover,.nav-menu .dropdown a:focus{background:#ede9fe!important;color:#6d28d9!important;outline:none}
  .dropdown-megamenu .mega-parents>li{margin:0!important}
  .dropdown-megamenu .mega-parents>li>a{min-height:36px!important;padding:7px 8px!important;box-sizing:border-box!important}
  .dropdown-megamenu .mega-subs,.dropdown-megamenu .mega-parents>li:first-child>.mega-subs{margin:0 0 4px 8px!important;padding:1px 0 1px 8px!important}
  .dropdown-megamenu .mega-subs>li{margin:0!important;padding:0!important}
  .dropdown-megamenu .mega-subs a{min-height:32px!important;padding:5px 9px!important;box-sizing:border-box!important}
  .dropdown-collections{grid-template-columns:1fr!important}

  /* Inicio recibe un icono visual sin duplicar contenido ni rutas. */
  .nav-menu>li.mobile-extra:first-child>a:before{content:"";width:17px;height:17px;flex:0 0 auto;background:currentColor;clip-path:polygon(50% 4%,96% 43%,84% 43%,84% 96%,59% 96%,59% 65%,41% 65%,41% 96%,16% 96%,16% 43%,4% 43%)}
  .nav-menu>li.mobile-extra:first-child>a{justify-content:flex-start!important;gap:11px!important}

  /* Contacto, redes y cuenta en una tarjeta compacta al final del drawer. */
  .nav-menu>li.mobile-extra:last-child{display:flex!important;flex:0 0 auto!important;margin:12px 2px 0!important;padding:15px!important;align-items:stretch!important;background:linear-gradient(145deg,#fff,#f7f9fd)!important;border:1px solid #dfe6f0!important;border-left-color:#dfe6f0!important;border-radius:15px!important;box-shadow:0 10px 26px rgba(15,23,42,.07)!important;text-transform:none!important;letter-spacing:0!important}
  .nav-menu>li.mobile-extra:last-child>div{width:100%!important;min-height:0!important;margin:0 0 10px!important;padding:0!important;border-radius:0!important;justify-content:flex-start!important}
  .nav-menu>li.mobile-extra:last-child>div:nth-of-type(3){justify-content:flex-start!important;gap:10px!important;margin:3px 0 10px!important}
  .nav-menu>li.mobile-extra:last-child>div:nth-of-type(4){margin:0 0 10px!important;text-align:left!important;font-size:9px!important}
  .nav-menu>li.mobile-extra:last-child>div:nth-of-type(3)>.icon-btn{display:inline-flex!important;width:36px!important;min-width:36px!important;max-width:36px!important;height:36px!important;min-height:36px!important;max-height:36px!important;aspect-ratio:1/1!important;flex:0 0 36px!important;align-items:center!important;justify-content:center!important;padding:0!important;border:0!important;border-radius:50%!important;line-height:0!important;box-sizing:border-box!important;overflow:hidden!important}
  .nav-menu>li.mobile-extra:last-child>div:nth-of-type(3)>.icon-btn svg{display:block!important;width:17px!important;height:17px!important;flex:0 0 17px!important}
  .nav-menu>li.mobile-extra:last-child>div:nth-of-type(-n+2)>div span:first-child{font-size:9px!important;line-height:1.2!important;color:#71819a!important;letter-spacing:.07em!important}
  .nav-menu>li.mobile-extra:last-child>div:nth-of-type(-n+2)>div span:last-child{font-size:12px!important;line-height:1.35!important;color:#111827!important;letter-spacing:.015em!important}
  .nav-menu>li.mobile-extra:last-child span{overflow-wrap:anywhere}
  .nav-menu>li.mobile-extra:last-child>a{min-height:54px!important;margin:3px 0 0!important;padding:10px 13px!important;justify-content:flex-start!important;gap:12px!important;color:#fff!important;background:linear-gradient(135deg,#172554,#21447f)!important;border:0!important;border-radius:12px!important;box-shadow:0 6px 16px rgba(30,58,109,.18)!important}
  .nav-menu>li.mobile-extra:last-child>a svg{width:22px!important;height:22px!important;flex:0 0 22px!important}
  .nav-menu>li.mobile-extra:last-child>a span:first-child{font-size:9px!important;letter-spacing:.06em!important}
  .nav-menu>li.mobile-extra:last-child>a span:last-child{font-size:13px!important;line-height:1.2!important;letter-spacing:.02em!important}
  .nav-menu>li.mobile-extra:last-child>a span{color:inherit!important}

  .mobile-menu-toggle{position:relative;z-index:10020;display:flex!important;align-items:center;justify-content:center;width:38px;height:38px;border-radius:10px;color:#172033;transition:background .18s ease,color .18s ease}
  body.mobile-menu-open .mobile-menu-toggle{background:#ede9fe;color:#7c3aed}
}

@media (max-width:420px){
  .nav-menu{width:calc(100vw - 22px)!important;border-radius:0 16px 0 0!important}
}
