/* © Fernando Martínez Marín · VEOVIRTUAL® · veovirtual.com */

/* Ventanas */
body .vv-modal {
position:fixed;
inset:0;
z-index:100000;
display:flex;
align-items:center;
justify-content:center;
padding:20px;
opacity:0;
visibility:hidden;
transition:opacity .28s ease,visibility .28s ease;
}
body .vv-modal.is-visible {
opacity:1;
visibility:visible;
}
body .vv-modal-fondo {
position:absolute;
inset:0;
background-color:color-mix(in srgb,var(--vv-oscuro) 55%,transparent);
-webkit-backdrop-filter:blur(7px) saturate(.9);
backdrop-filter:blur(7px) saturate(.9);
}
body .vv-modal-caja {
position:relative;
width:100%;
max-width:392px;
max-height:calc(100dvh - 40px);
box-sizing:border-box;
padding:30px 26px 24px;
border-radius:18px;
background-color:#ffffff;
box-shadow:0 30px 70px color-mix(in srgb,var(--vv-oscuro) 30%,transparent);
transform:translateY(14px) scale(.97);
transition:transform .32s cubic-bezier(.2,.8,.3,1);
}
body .vv-modal.is-visible .vv-modal-caja {
transform:none;
}
body .vv-modal-cerrar {
position:absolute;
top:10px;
right:12px;
width:34px;
height:34px;
padding:0;
border:0;
border-radius:50%;
background:none;
color:color-mix(in srgb,var(--vv-texto) 48%,#ffffff);
font-size:26px;
line-height:1;
cursor:pointer;
transition:color .2s ease,background-color .2s ease;
}
body .vv-modal-cerrar:hover {
color:var(--vv-oscuro);
background-color:color-mix(in srgb,var(--vv-acento) 10%,#ffffff);
}
body .vv-modal-titulo {
margin:0 0 4px;
color:var(--vv-oscuro);
font-family:var(--vv-fuente-titulos);
font-size:29px;
line-height:1.15;
letter-spacing:.01em;
}
body .vv-modal-texto {
margin:0 0 18px;
color:color-mix(in srgb,var(--vv-texto) 58%,#ffffff);
font-size:12.5px;
line-height:1.5;
}
body .vv-modal-titulo + .vv-modal-opciones {
margin-top:18px;
}
body .vv-modal-opciones {
display:flex;
flex-direction:column;
gap:9px;
max-height:calc(100dvh - 190px);
overflow-x:hidden;
overflow-y:auto;
padding:2px 14px;
margin:0 -14px;
}
body .vv-modal-opcion {
display:flex;
align-items:center;
gap:14px;
padding:13px 14px;
border:1px solid color-mix(in srgb,var(--vv-acento) 18%,#ffffff);
border-radius:12px;
background-color:#fff;
color:var(--vv-oscuro);
text-decoration:none;
transition:border-color .2s ease,background-color .2s ease,transform .2s ease;
}
body .vv-modal-opcion,
body .vv-modal-opcion:hover,
body .vv-modal-opcion:focus,
body .vv-modal-opcion strong,
body .vv-modal-opcion em {
text-decoration:none;
}
body .vv-modal-opcion:hover {
border-color:var(--vv-acento);
background-color:color-mix(in srgb,var(--vv-acento) 6%,#ffffff);
box-shadow:0 4px 14px color-mix(in srgb,var(--vv-acento) 18%,transparent);
}
body .vv-modal-ico {
display:flex;
flex:0 0 auto;
color:var(--vv-acento);
}
body .vv-modal-ico svg {
width:22px;
height:22px;
display:block;
}
body .vv-modal-txt {
display:flex;
flex-direction:column;
gap:2px;
min-width:0;
}
body .vv-modal-txt strong {
font-size:14.5px;
font-weight:600;
line-height:1.25;
}
body .vv-modal-txt em {
color:color-mix(in srgb,var(--vv-texto) 58%,#ffffff);
font-size:12px;
font-style:normal;
line-height:1.3;
}
body .vv-modal-flecha {
margin-left:auto;
color:color-mix(in srgb,var(--vv-acento) 45%,#ffffff);
font-size:22px;
line-height:1;
}
@media (max-width:480px) {
body .vv-modal {
padding:14px;
}
body .vv-modal-caja {
padding:26px 20px 20px;
}
body .vv-modal-titulo {
font-size:26px;
}
}
body .vv-modal-horario {
margin:14px 0 0;
padding:12px 14px;
border:1px dashed color-mix(in srgb,var(--vv-acento) 28%,#ffffff);
border-radius:12px;
background-color:color-mix(in srgb,var(--vv-acento) 6%,#ffffff);
text-align:center;
}
body .vv-modal-horario span {
display:block;
color:color-mix(in srgb,var(--vv-texto) 58%,#ffffff);
font-size:11.5px;
letter-spacing:.08em;
text-transform:uppercase;
}
body .vv-modal-horario strong {
display:block;
margin-top:3px;
color:var(--vv-oscuro);
font-size:14.5px;
}
body .vv-modal-horario em {
display:block;
margin-top:4px;
color:color-mix(in srgb,var(--vv-texto) 58%,#ffffff);
font-size:12px;
font-style:normal;
}