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

/* ---------- Barra de avisos ---------- */
body .vv-avisos {
position:relative;
z-index:9990;
background-color:transparent;
color:#ffffff;
font-size:14px;
line-height:1.4;
text-align:center;
}
body .vv-avisos-cuerpo {
display:flex;
align-items:center;
justify-content:center;
min-height:40px;
padding:8px 48px;
overflow:hidden;
background-color:var(--vv-acento);
transition:max-height .45s cubic-bezier(.32,.72,.35,1),min-height .45s cubic-bezier(.32,.72,.35,1),padding .45s cubic-bezier(.32,.72,.35,1),opacity .3s ease;
}
body .vv-avisos.is-plegada .vv-avisos-cuerpo {
min-height:0;
padding-top:0;
padding-bottom:0;
opacity:0;
}
body .vv-avisos[hidden] {
display:none;
}
body .vv-avisos[data-estilo="oscuro"] .vv-avisos-cuerpo {
background-color:var(--vv-oscuro);
color:var(--vv-claro,#ffffff);
}
body .vv-avisos[data-estilo="rojo"] .vv-avisos-cuerpo {
background-color:#8f2d24;
color:#ffffff;
}
body .vv-avisos[data-estilo="verde"] .vv-avisos-cuerpo {
background-color:#3f5b3a;
color:#ffffff;
}
body .vv-avisos-pista {
display:grid;
width:100%;
max-width:1240px;
}
body .vv-aviso {
grid-area:1 / 1;
opacity:0;
visibility:hidden;
transition:opacity .6s ease,visibility .6s ease;
}
body .vv-aviso.is-activo {
opacity:1;
visibility:visible;
}
body .vv-aviso-texto {
font-weight:500;
letter-spacing:.01em;
}
body .vv-aviso-enlace {
margin-left:6px;
color:inherit;
font-weight:700;
text-decoration:underline;
text-underline-offset:3px;
}
body .vv-aviso-enlace:hover {
color:inherit;
opacity:.8;
}
body .vv-avisos-cerrar {
position:absolute;
top:5px;
right:12px;
z-index:2;
display:flex;
align-items:center;
justify-content:center;
width:30px;
height:30px;
padding:0;
border:0;
border-radius:50%;
background-color:rgba(255,255,255,.18);
color:#ffffff;
cursor:pointer;
transition:background-color .25s ease,box-shadow .25s ease,transform .45s cubic-bezier(.32,.72,.35,1);
}
body .vv-avisos-cerrar:hover {
background-color:rgba(255,255,255,.34);
}
body .vv-avisos-cerrar svg {
width:17px;
height:17px;
display:block;
}
body .vv-avisos-cerrar .vv-av-abajo {
display:none;
}
body .vv-avisos.is-plegada .vv-avisos-cerrar {
background-color:var(--vv-acento);
box-shadow:0 5px 16px color-mix(in srgb,var(--vv-oscuro) 30%,transparent);
}
body .vv-avisos.is-plegada[data-estilo="oscuro"] .vv-avisos-cerrar {
background-color:var(--vv-oscuro);
}
body .vv-avisos.is-plegada[data-estilo="rojo"] .vv-avisos-cerrar {
background-color:#8f2d24;
}
body .vv-avisos.is-plegada[data-estilo="verde"] .vv-avisos-cerrar {
background-color:#3f5b3a;
}
body .vv-avisos.is-plegada .vv-avisos-cerrar:hover {
background-color:color-mix(in srgb,var(--vv-acento) 80%,#000000);
}
body .vv-avisos.is-plegada .vv-avisos-cerrar .vv-av-x {
display:none;
}
body .vv-avisos.is-plegada .vv-avisos-cerrar .vv-av-abajo {
display:block;
}
body .vv-avisos[data-modo="ticker"] .vv-avisos-pista {
display:flex;
max-width:none;
overflow:hidden;
width:100%;
gap:0;
}
body .vv-avisos[data-modo="ticker"] .vv-tira {
display:flex;
flex:0 0 auto;
align-items:center;
gap:56px;
padding-right:56px;
white-space:nowrap;
animation:vv-desfile var(--vv-dur,22s) linear infinite;
}
body .vv-avisos[data-modo="ticker"] .vv-aviso {
grid-area:auto;
flex:0 0 auto;
opacity:1;
visibility:visible;
transition:none;
white-space:nowrap;
}
body .vv-avisos[data-modo="ticker"] .vv-avisos-cuerpo {
padding-left:16px;
padding-right:48px;
}
body .vv-avisos[data-modo="ticker"]:hover .vv-tira {
animation-play-state:paused;
}
@keyframes vv-desfile {
from { transform:translateX(0); }
to { transform:translateX(calc(var(--vv-tira,1000px) * -1)); }
}
@media (prefers-reduced-motion:reduce) {
body .vv-avisos[data-modo="ticker"] .vv-tira {
animation:none;
}
}
body .vv-avisos-pausa {
position:absolute;
top:5px;
right:48px;
z-index:2;
display:flex;
align-items:center;
justify-content:center;
width:30px;
height:30px;
padding:0;
border:0;
border-radius:50%;
background:rgba(255,255,255,.18);
color:#ffffff;
cursor:pointer;
}
body .vv-avisos-pausa[hidden] {
display:none;
}
body .vv-avisos-pausa svg {
width:15px;
height:15px;
fill:none;
stroke:currentColor;
stroke-width:2.4;
stroke-linecap:round;
}
body .vv-avisos[data-modo="ticker"].is-pausado .vv-tira {
animation-play-state:paused;
}
@media only screen and (max-width:767px) {
body .vv-avisos {
font-size:13px;
}
body .vv-avisos-cuerpo {
padding:8px 44px 8px 16px;
}
body .vv-avisos-pausa {
right:44px;
}
}
body .vv-avisos:has(.vv-avisos-pausa:not([hidden])) .vv-avisos-cuerpo {
padding-left:84px;
padding-right:84px;
}
@media only screen and (max-width:767px) {
body .vv-avisos:has(.vv-avisos-pausa:not([hidden])) .vv-avisos-cuerpo {
padding-left:16px;
padding-right:80px;
}
}