#tnet-text-slider {
    /* Usar viewport width para romper cualquier contenedor */
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 100vw !important;
    background-color: #f4efe8;
    overflow: hidden !important;
    position: relative !important;
    padding: 0;
    white-space: nowrap !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    /* Centrar el slider si está dentro de un contenedor */
    margin-left: calc(-50vw + 50%) !important;
    margin-right: calc(-50vw + 50%) !important;
    left: 0 !important;
    right: 0 !important;
    clear: both !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

#tnet-text-slider-wrapper {
    display: inline-block !important;
    white-space: nowrap !important;
    will-change: transform;
    padding: 0 !important;
    margin: 0 !important;
    position: relative !important;
    /* La posición inicial se maneja por la animación, no aquí */
    /* La animación empezará desde translateX(100vw) automáticamente */
}

/* La animación se aplica solo cuando está inicializado */
/* NOTA: La duración se establece dinámicamente por JavaScript */
/* NO usar animation shorthand aquí porque sobrescribe la duración inline */
#tnet-text-slider[data-initialized="true"] #tnet-text-slider-wrapper {
    animation-name: scroll-horizontal !important;
    animation-timing-function: linear !important;
    animation-iteration-count: infinite !important;
    animation-play-state: running !important;
    animation-fill-mode: forwards !important;
    /* La duración se aplica inline por JS, NO aquí */
}

/* Pausar la animación al pasar el ratón */
/* Usar mayor especificidad y !important para sobrescribir estilos inline */
#tnet-text-slider:hover #tnet-text-slider-wrapper,
#tnet-text-slider[data-initialized="true"]:hover #tnet-text-slider-wrapper {
    animation-play-state: paused !important;
    /* Forzar que se pause incluso con estilos inline */
    -webkit-animation-play-state: paused !important;
    -moz-animation-play-state: paused !important;
    -o-animation-play-state: paused !important;
}

#tnet-text-slider-content {
    display: inline-block !important;
    white-space: nowrap !important;
    color: #333 !important;
    /* font-family y font-size se aplican inline desde el template */
    line-height: 1.5 !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Resetear márgenes que puedan venir del tema */
#tnet-text-slider-content *,
#tnet-text-slider-content p,
#tnet-text-slider-content span,
#tnet-text-slider-content strong,
#tnet-text-slider-content em {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    line-height: inherit !important;
}

/* Estilos específicos para el separador de espaciado - Mayor especificidad */
#tnet-text-slider-content .tnet-slider-spacer {
    display: inline-block !important;
    width: 100px !important; /* Valor por defecto, se sobrescribe por JS */
    min-width: 100px !important;
    max-width: 100px !important;
    height: 1px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
    visibility: visible !important;
    box-sizing: border-box !important;
    vertical-align: baseline !important;
    white-space: nowrap !important;
    /* Asegurar que el separador sea visible y respete el ancho */
    flex-shrink: 0 !important;
    flex-grow: 0 !important;
    /* Forzar que el width se respete */
    position: relative !important;
}

@keyframes scroll-horizontal {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

/* Ajustes para dispositivos móviles */
@media screen and (max-width: 768px) {
    #tnet-text-slider-content {
        font-size: 12px;
    }
}