/* Stili per il Ticker Banner */
.ticker-banner {
    background-color: var(--colore-secondario);
    color: var(--colore-neutro-chiaro);
    padding: 10px 0;
    text-align: center;
    font-size: 16px; /* Ingrandito per migliore leggibilità */
    position: sticky; /* Modificato per essere fisso in cima */
    top: 0; /* In cima alla viewport */
    z-index: 1005; /* Più alto dell'header e del menu mobile */
    width: 100%;
    overflow: hidden;
}

.ticker-banner .container {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
}

.ticker-banner .ticker-icon {
    margin-right: 8px;
    font-size: 16px;
    flex-shrink: 0; /* Impedisce all'icona di restringersi */
}

.ticker-text-wrapper {
    position: relative;
    overflow: hidden;
    display: inline-block;
    vertical-align: middle;
    width: 95%; /* Allargato quasi a tutto schermo */
    max-width: 1200px; /* Aumentata larghezza massima */
}

.ticker-banner .ticker-text {
    display: inline-block;
    white-space: nowrap;
    padding-left: 100%; /* Inizia fuori dalla vista a destra */
    /* L'animazione gestirà la trasformazione */
}

/* Animazione Ticker Continuo */
@keyframes continuousTicker {
    0% {
        transform: translateX(0%); 
    }
    100% {
        transform: translateX(-200%); 
    }
}

.continuous-ticker-animation {
    animation: continuousTicker 60s linear; /* Ulteriormente rallentato a 60s */
}

/* Spostamento dell'header sotto il ticker fisso */
body.has-ticker .site-header {
    top: 40px; /* Altezza approssimativa del ticker, da aggiustare se il padding del ticker cambia */
    /* z-index deve essere inferiore a quello del ticker se entrambi sono sticky */
}

/* Rimuoviamo il padding-top dal body se il ticker è sticky e l'header si posiziona sotto di esso */
body.has-ticker {
    padding-top: 0; 
}

/* Se l'header non fosse sticky di suo, ma dovesse diventarlo dopo lo scroll del ticker (non è questo il caso) */
/* .site-header.sticky-after-ticker {
    top: 0;
} */