/* Reglas globales del tema, cargadas siempre después de base.css:
   logotipo, barra de navegación fija, cajón de cuenta y compatibilidad móvil. */

/* Salto al contenido: visible solo con teclado */
.lulo-saltar{position:absolute;left:-9999px;top:0;z-index:200;background:var(--lulo-navy);color:#fff;padding:10px 16px;border-radius:0 0 6px 0;font-size:14px;font-weight:600}
.lulo-saltar:focus{left:0}

/* Logotipo */
.lulo-brand{display:flex;align-items:center;flex:0 0 auto}
.lulo-logo{height:34px;width:auto;max-width:200px;object-fit:contain;display:block}
.lulo-logo--claro{height:30px}
@media(max-width:760px){ .lulo-logo{height:28px;max-width:150px} }

/* ---------------------------------------------------------------
   Barra de navegación: fija, corta y funcional.
   Nombra lo que hace el portal, no marcas ni categorías.
   --------------------------------------------------------------- */
.lulo-nav{background:#fff;border-bottom:1px solid var(--lulo-line);position:sticky;top:0;z-index:60}
.lulo-nav .lulo-wrap{display:flex;gap:26px;align-items:center}
.lulo-navdesk{display:flex;gap:26px;align-items:center;flex:1;overflow-x:auto;scrollbar-width:none}
.lulo-navdesk::-webkit-scrollbar{display:none}
.lulo-navitem{display:flex;align-items:center;gap:7px;height:46px;font-size:13.5px;font-weight:500;color:var(--lulo-muted);white-space:nowrap;border-bottom:2px solid transparent;margin-bottom:-1px;background:none}
.lulo-navitem:hover,.lulo-navitem.lulo-on{color:var(--lulo-navy);border-bottom-color:var(--lulo-navy)}
.lulo-navcount{background:var(--lulo-navy);color:#fff;border-radius:20px;font-size:10.5px;font-weight:700;padding:1px 6px;min-width:19px;text-align:center}
.lulo-navtoggle{display:none}
.lulo-navmas{display:flex;align-items:center;gap:8px;margin-left:auto;height:46px;padding:0 2px;font-size:13.5px;font-weight:600;color:var(--lulo-navy);background:none;white-space:nowrap;flex:0 0 auto}
.lulo-navmas svg{width:16px;height:16px}
.lulo-navmas:hover{color:var(--lulo-accent)}
.lulo-scrim{display:none}

/* Cajón */
.lulo-mega{position:fixed;top:0;bottom:0;left:0;width:min(90vw,360px);background:#fff;box-shadow:0 0 40px rgba(28,37,50,.24);overflow-y:auto;transform:translateX(-100%);transition:transform .22s ease;visibility:hidden;z-index:120;display:flex;flex-direction:column;padding-bottom:env(safe-area-inset-bottom,0)}
.lulo-mega.lulo-open{transform:translateX(0);visibility:visible}
.lulo-drawer{display:flex;flex-direction:column;min-height:100%;padding:16px 0 0}
.lulo-drawerhead{display:flex;align-items:center;justify-content:space-between;padding:0 20px 14px;border-bottom:1px solid var(--lulo-line-2)}
.lulo-drawerhead b{font-size:15px;color:var(--lulo-navy)}
.lulo-drawerhead button{font-size:24px;line-height:1;color:var(--lulo-muted);background:none}

.lulo-dnav{list-style:none;padding:8px 0;margin:0}
.lulo-dnav a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 20px;font-size:15.5px;color:var(--lulo-ink)}
.lulo-dnav a:hover{background:var(--lulo-band)}
.lulo-dnav a.lulo-on{color:var(--lulo-olive);background:rgba(46,78,55,.07);font-weight:600}
.lulo-dnav a b{background:var(--lulo-navy);color:#fff;border-radius:20px;font-size:11px;padding:1px 7px;font-weight:700}

.lulo-ddatos{border-top:1px solid var(--lulo-line-2);border-bottom:1px solid var(--lulo-line-2);padding:12px 20px;margin:4px 0}
.lulo-ddato{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:6px 0;font-size:14px}
.lulo-ddato span{color:var(--lulo-muted)}
.lulo-ddato b{color:var(--lulo-ink);font-variant-numeric:tabular-nums;text-align:right}
.lulo-ddato b.lulo-ok{color:var(--lulo-olive)}
.lulo-ddato b.lulo-due{color:var(--lulo-deep)}
.lulo-dnota{padding:12px 20px 0;font-size:13px;color:var(--lulo-muted);line-height:1.5}

.lulo-dfin{list-style:none;padding:10px 0 16px;margin:0}
.lulo-dfin a{display:block;padding:10px 20px;font-size:14.5px;color:var(--lulo-ink)}
.lulo-dfin a:hover{background:var(--lulo-band)}
.lulo-dfin a.lulo-dsalir{color:var(--lulo-deep)}

.lulo-dpie{margin-top:auto;display:flex;align-items:center;gap:11px;padding:14px 20px calc(16px + env(safe-area-inset-bottom,0));border-top:1px solid var(--lulo-line-2);background:var(--lulo-band)}
.lulo-dpie__ini{flex:0 0 auto;width:36px;height:36px;border-radius:50%;background:var(--lulo-navy);color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;letter-spacing:.02em}
.lulo-dpie__txt{display:flex;flex-direction:column;min-width:0}
.lulo-dpie__txt b{font-size:14px;color:var(--lulo-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lulo-dpie__txt span{font-size:12px;color:var(--lulo-muted)}

.lulo-scrim{display:block;position:fixed;inset:0;background:rgba(28,37,50,.42);opacity:0;visibility:hidden;transition:.2s;z-index:110}
.lulo-scrim.lulo-on{opacity:1;visibility:visible}

@media(max-width:900px){
  .lulo-nav .lulo-wrap{gap:0}
  .lulo-navdesk{display:none}
  .lulo-navmas{display:none}
  .lulo-navtoggle{display:flex;align-items:center;gap:9px;height:48px;font-size:14.5px;font-weight:600;color:var(--lulo-navy);background:none}
  .lulo-navtoggle svg{width:18px;height:18px}
  body.lulo-menu-abierto{overflow:hidden}
  body.lulo-menu-abierto .lulo-mobar,body.lulo-menu-abierto .lulo-wa,body.lulo-menu-abierto .lulo-summary{display:none}
}

/* iPhone y Android: sin zoom al enfocar campos, sin desbordes, barras fijas respetando la zona segura */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html{overflow-x:hidden;max-width:100%}
body{overflow-x:clip;max-width:100%;-webkit-tap-highlight-color:transparent}
img,svg,video{max-width:100%}
input:not([type="checkbox"]):not([type="radio"]),select,textarea,button{-webkit-appearance:none;appearance:none}
select{background-image:linear-gradient(45deg,transparent 50%,var(--lulo-muted) 50%),linear-gradient(135deg,var(--lulo-muted) 50%,transparent 50%);background-position:calc(100% - 15px) 50%,calc(100% - 10px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:28px}
input[type="number"]{-moz-appearance:textfield;appearance:textfield}
input[type="number"]::-webkit-outer-spin-button,input[type="number"]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.lulo-mobar,.lulo-summary{padding-bottom:calc(9px + env(safe-area-inset-bottom,0))}
@media(max-width:760px){
  input,select,textarea{font-size:16px}
  .lulo-stepper input,.lulo-prstep input,.lulo-lstep input{font-size:16px}
  .lulo-search input{font-size:16px}
}
@supports(-webkit-touch-callout:none){
  .lulo-hero--pantalla,.lulo-carrusel--viewport .lulo-carrusel__pista{min-height:-webkit-fill-available}
}

.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
