/* Lucide Outline y buscador esmerilado integrado al encabezado. */
.masthead.masthead { background: #f8fcffeb; backdrop-filter: none; -webkit-backdrop-filter: none; } /* taste-skill-ignore: no crea un ancestro filtrado para el panel fijo. */
/* Buscador como la versión anterior (aprobada por Julio): píldora blanca con sombra suave, lupa redonda azul
   y botón de laptop con rayo para el buscador guiado. */
.masthead .search { position: relative; min-width: 0; padding: 0; border: 0; border-radius: 999px; background: #fff; box-shadow: 0 6px 18px rgb(10 37 64 / .10), 0 1px 3px rgb(10 37 64 / .08); }
.masthead .search input, .masthead .search input:hover, .masthead .search input:focus-visible { min-width: 0; width: 100%; height: 50px; padding: 0 58px 0 22px; border: 0 !important; border-radius: 999px !important; background: #fff !important; color: var(--ink); font-size: 15px; box-shadow: none !important; }
.masthead .search input::placeholder { color: #6b7d8f; opacity: 1; }
.masthead .search:focus-within { outline: 0; box-shadow: 0 0 0 3px rgb(0 119 182 / .22), 0 6px 18px rgb(10 37 64 / .10); }
.masthead .search button { position: absolute; top: 5px; right: 5px; display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%; background: var(--blue-700, #0077b6); color: #fff; }
.masthead .search button:hover { background: #095a7d; }
.masthead .search button .icon { width: 20px; height: 20px; }
.masthead .finder-btn { position: relative; display: grid; place-items: center; width: 50px; height: 50px; border: 0; border-radius: 50%; color: var(--navy); background: #fff; box-shadow: 0 6px 18px rgb(10 37 64 / .10), 0 1px 3px rgb(10 37 64 / .08); backdrop-filter: none; -webkit-backdrop-filter: none; }
.masthead .finder-btn:hover, .masthead .finder-btn[aria-expanded="true"] { box-shadow: 0 0 0 4px rgb(0 157 225 / .16), 0 6px 18px rgb(10 37 64 / .10); }
.masthead .finder-btn .icon { width: 22px; height: 22px; }
.masthead .finder-btn__bolt { position: absolute; right: 4px; bottom: 4px; display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; background: var(--blue-700, #0077b6); color: #fff; }
.masthead .finder-btn__bolt .icon { width: 11px; height: 11px; }
.masthead .masthead__actions .icon { width: 22px; height: 22px; }
.masthead .icon:not(.icon--fill) { stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; fill: none; }
.masthead .masthead__actions > a:not(.btn) { gap: 5px; padding: 8px; font-size: 11px; }
.masthead .masthead__actions > .btn { min-height: 46px; border-radius: 14px; }
.masthead :is(button,a):focus-visible { outline: 2px solid #0076a8; outline-offset: 3px; }
@media(max-width:479px) {
  .masthead .search input, .masthead .search input:hover, .masthead .search input:focus-visible { padding-left: 16px; font-size: 14px; }
}
@media(prefers-reduced-transparency:reduce) {
  .masthead.masthead { backdrop-filter: none; -webkit-backdrop-filter: none; background: #f0f7fb; } /* taste-skill-ignore: alternativa sin transparencia. */
}
@media(prefers-reduced-motion:no-preference) {
  :is(.masthead,.catnav) :is(a,button):is(:hover,:focus-visible) > .icon {
    animation: header-icon-jitter 440ms ease-out 1;
    transform-origin: center;
  }
  .catnav .catnav__menu:not([hidden]) { animation: header-menu-settle 220ms ease-out both; }
}
@keyframes header-icon-jitter {
  0%,100% { transform: translateX(0) rotate(0); }
  20% { transform: translateX(-1px) rotate(-7deg); }
  45% { transform: translateX(1px) rotate(5deg); }
  70% { transform: translateX(-.5px) rotate(-2deg); }
}
@keyframes header-menu-settle {
  from { opacity: 0; translate: 0 5px; }
  to { opacity: 1; translate: 0 0; }
}

/* Barra superior siempre en una línea: nada se parte; lo que no cabe se oculta por prioridad */
.topbar__inner { flex-wrap: nowrap !important; min-height: 40px; }
.topbar__stores, .topbar__aside { flex-wrap: nowrap !important; flex-direction: row !important; align-items: center; gap: 18px !important; min-width: 0; }
.topbar a, .topbar span, .topbar li { white-space: nowrap; }
@media (max-width: 1279px) { .topbar__hours { display: none !important; } }
@media (max-width: 599px) {
  .topbar { font-size: 11px !important; }
  .topbar__inner { justify-content: center; }
  .topbar__stores { gap: 12px !important; max-width: 100%; }
  .topbar__stores li { min-width: 0; }
  .topbar__stores a { min-width: 0; gap: 4px; }
  .topbar__city { display: none; }
}
.topbar__city { margin-left: -3px; }
