/* Vozavía V2 · el buscador universal (26-oct-2026, Olimón: «el botón del V1 me gustaba más» y «el buscador siempre tiene
   que estar: es una herramienta universal de todo Vozavía»). El botón es COPIA FIEL del de V1 (vozavia.css) y la capa es la
   misma; lo abre /menu-vozavia.js. Lo usan /v2, el panel (/mi) y Edición. */
/* El buscador: pastilla de cristal líquido azul al centro de la barra (versión ligera en CSS del buscador azul) */
@property --vz-giro { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
.vz-buscar {
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  height: 44px; min-width: 276px; padding: 0 22px 0 16px; border-radius: 999px; isolation: isolate;
  color: #EAF0FF; text-decoration: none; font: 600 15px/1 inherit; letter-spacing: .01em; white-space: nowrap;
  background: linear-gradient(180deg, rgba(150, 190, 255, .30) 0%, rgba(54, 110, 235, .20) 48%, rgba(10, 30, 90, .42) 100%);
  backdrop-filter: blur(14px) saturate(1.5); -webkit-backdrop-filter: blur(14px) saturate(1.5);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .6),
    inset 0 -9px 14px -8px rgba(170, 205, 255, .5),
    inset 0 0 0 1px rgba(140, 185, 255, .32),
    0 12px 30px -12px rgba(37, 99, 235, .85),
    0 2px 6px rgba(0, 6, 24, .55);
  text-shadow: 0 1px 2px rgba(2, 8, 28, .6);
  transition: transform .4s cubic-bezier(.22, 1, .36, 1), box-shadow .4s ease, filter .4s ease;
  will-change: transform;
}
.vz-buscar::before { /* brillo que recorre el borde */
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1.6px; z-index: 2; pointer-events: none;
  background: conic-gradient(from var(--vz-giro), rgba(255, 255, 255, 0) 0deg, rgba(255, 255, 255, 0) 250deg, rgba(190, 215, 255, .55) 310deg, #fff 345deg, rgba(255, 255, 255, 0) 360deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
  animation: vz-giro 4.2s linear infinite;
}
.vz-buscar-brillo { position: absolute; inset: 0; border-radius: inherit; overflow: hidden; z-index: 0; pointer-events: none; }
.vz-buscar-brillo::after { /* destello que cruza la pastilla */
  content: ""; position: absolute; top: -20%; bottom: -20%; width: 38%; left: -50%;
  background: linear-gradient(105deg, transparent, rgba(255, 255, 255, .34), transparent);
  transform: skewX(-18deg); animation: vz-destello 6s ease-in-out infinite;
}
.vz-buscar-simbolo, .vz-buscar-texto { position: relative; z-index: 1; }
.vz-buscar-simbolo {
  flex: none; width: 25px; height: 16px;
  -webkit-mask: url("/vozavia-simbolo.svg") center / contain no-repeat; mask: url("/vozavia-simbolo.svg") center / contain no-repeat;
  background: linear-gradient(150deg, #ffffff 0%, #b7d0ff 30%, #6c9bf2 52%, #e6efff 72%, #8fb2ee 100%);
  filter: drop-shadow(0 0 6px rgba(120, 170, 255, .65));
}
.vz-buscar-texto { overflow: hidden; text-overflow: ellipsis; line-height: 1.4; }
.vz-buscar:hover { transform: translateY(-3px); filter: brightness(1.12); box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .75), inset 0 -9px 14px -8px rgba(190, 220, 255, .65), inset 0 0 0 1px rgba(170, 205, 255, .5),
    0 18px 38px -12px rgba(60, 120, 255, .95), 0 3px 8px rgba(0, 6, 24, .5); }
.vz-buscar:active { transform: translateY(-1px) scale(.985); }
@keyframes vz-giro { to { --vz-giro: 360deg; } }
@keyframes vz-destello { 0%, 55% { left: -50%; } 85%, 100% { left: 130%; } }

/* Capa de pantalla completa del buscador (la página /buscador-hostess adentro) */
.vz-buscador-capa { position: fixed; inset: 0; z-index: 100; background: radial-gradient(ellipse at 50% 45%, #13306A, #050A1A 75%); overflow: hidden; }
.vz-buscador-capa[hidden] { display: none; }
.vz-buscador-capa iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; background: transparent; }
.vz-buscador-cerrar {
  position: absolute; z-index: 2; top: max(14px, env(safe-area-inset-top)); right: max(14px, env(safe-area-inset-right)); height: 44px; min-width: 44px; padding: 0 14px; border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; cursor: pointer;
  color: #EAF0FF; font: 600 13px/1 inherit; letter-spacing: .04em;
  background: rgba(20, 44, 110, .45); border: 1px solid rgba(160, 200, 255, .4);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 8px 22px -10px rgba(0, 8, 40, .8);
  transition: transform .3s ease, background .3s ease;
}
.vz-buscador-cerrar:hover { background: rgba(40, 80, 180, .55); transform: scale(1.05); }
.vz-buscador-esc { opacity: .75; font-size: 11px; border: 1px solid rgba(190, 215, 255, .45); border-radius: 6px; padding: 3px 6px; }
body.vz-con-capa { overflow: hidden; }
.vz-buscador-capa { position: fixed; inset: 0; z-index: 100; background: radial-gradient(ellipse at 50% 45%, #13306A, #050A1A 75%); overflow: hidden; }
.vz-buscador-capa[hidden] { display: none; }
.vz-buscador-capa iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; background: transparent; }
.vz-buscador-cerrar {
  position: absolute; z-index: 2; top: max(14px, env(safe-area-inset-top)); right: max(14px, env(safe-area-inset-right)); height: 44px; min-width: 44px; padding: 0 14px; border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; cursor: pointer;
  color: #EAF0FF; font: 600 13px/1 inherit; letter-spacing: .04em;
  background: rgba(20, 44, 110, .45); border: 1px solid rgba(160, 200, 255, .4);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 8px 22px -10px rgba(0, 8, 40, .8);
  transition: transform .3s ease, background .3s ease;
}
.vz-buscador-cerrar:hover { background: rgba(40, 80, 180, .55); transform: scale(1.05); }
.vz-buscador-esc { opacity: .75; font-size: 11px; border: 1px solid rgba(190, 215, 255, .45); border-radius: 6px; padding: 3px 6px; }
@media (max-width: 719px) { .vz-buscar { height: 42px; padding: 0 12px 0 10px; gap: 7px; font-size: 12.5px; letter-spacing: 0; min-width: 0; } .vz-buscar-simbolo { width: 21px; height: 13px; } }
@media (prefers-reduced-motion: reduce) { .vz-buscar::before { animation: none; --vz-giro: 300deg; } .vz-buscar-brillo::after { animation: none; display: none; } .vz-buscar { transition: none; } }
@keyframes vz-destello { 0%, 55% { left: -50%; } 85%, 100% { left: 130%; } }
/* En el panel: flota arriba al centro, entre el logo y la píldora de la cuenta */
.vz-buscar.vz-buscar-panel { position: fixed; top: 16px; left: 50%; transform: translateX(-50%); z-index: 45; min-width: 300px; }
.vz-buscar.vz-buscar-panel:hover { transform: translate(-50%, -3px); }
.vz-buscar.vz-buscar-panel:active { transform: translate(-50%, -1px) scale(.985); }
@media (max-width: 719px) { .vz-buscar.vz-buscar-panel { top: 12px; min-width: 0; width: auto; max-width: 52vw; } }
/* En Edición: dentro de la burbuja, al final */
.ed-cab .vz-buscar.vz-buscar-edicion { height: 40px; min-width: 0; padding: 0 16px 0 12px; font-size: 13.5px; margin-left: 4px; }
.ed-cab.ed-cab-compacta .vz-buscar.vz-buscar-edicion { height: 34px; }
@media (max-width: 560px) { .ed-cab .vz-buscar.vz-buscar-edicion .vz-buscar-texto { display: none; } .ed-cab .vz-buscar.vz-buscar-edicion { padding: 0 10px; } }
/* Celular, en el panel: el buscador toma el lugar del logo (arriba a la izquierda) para no encimarse con la píldora de la cuenta */
@media (max-width: 719px) {
  html.v2-app body:has(.vz-buscar-panel) .cabecera .marca-vz { visibility: hidden; }
  .vz-buscar.vz-buscar-panel { left: 14px; transform: none; max-width: calc(100vw - 150px); height: 42px; font-size: 12.5px; }
  .vz-buscar.vz-buscar-panel:hover { transform: none; }
  .vz-buscar.vz-buscar-panel:active { transform: scale(.985); }
}
@media (max-width: 719px) {
  .vz-buscar.vz-buscar-panel { width: 44px; height: 44px; min-width: 0; max-width: none; padding: 0; justify-content: center; }
  .vz-buscar.vz-buscar-panel .vz-buscar-texto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .vz-buscar.vz-buscar-panel .vz-buscar-simbolo { width: 22px; height: 14px; }
}
