/* Contenedor principal del ticker */
.custom-ticker-container {
    width: 100%;
    background: linear-gradient(145deg, #1d1f2c, #2a2d3e); /* Gradiente oscuro */
    color: #fff;
    padding: 4px 0; /* Padding reducido */
    font-family: 'Roboto', sans-serif;
    font-size: 12px; /* Tamaño de letra más pequeño */
    overflow: hidden;
    border-bottom: 2px solid #444;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/* Contenido del ticker (animación horizontal) */
.ticker-content {
    display: flex;
    white-space: nowrap;
}

/* Elementos individuales del ticker */
.ticker-item {
    display: inline-flex;
    align-items: center;
    gap: 6px; /* Espacio reducido entre elementos */
    padding: 4px 6px; /* Padding reducido */
    margin: 0 4px; /* Margen reducido */
    border-radius: 6px;
    background-color: rgba(255, 255, 255, 0.1);
    transition: all 0.3s ease-in-out;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Estilos para Renta Variable (RV) */
.ticker-item.rv {
    border-left: 4px solid #56d68f; /* Verde */
}

/* Estilos para Renta Fija (RF) */
.ticker-item.rf {
    border-left: 4px solid #ff6b6b; /* Rojo */
}

/* Efecto hover sobre cada item */
.ticker-item:hover {
    background-color: rgba(255, 255, 255, 0.2);
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

/* Animación del ticker */
@keyframes ticker-scroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-100%); /* Mueve el contenido hasta su ancho completo */
    }
}

/* Contenedor del emisor y tipo de renta */
.ticker-item .emisor-container {
    display: flex;
    flex-direction: column;
    gap: 1px; /* Espacio reducido entre elementos */
    align-items: center; /* Centrar horizontalmente */
}

/* Estilo para el nombre del emisor */
.ticker-item .emisor {
    font-weight: 600;
    color: #f1f1f1;
    text-transform: uppercase;
    font-size: 12px; /* Tamaño de letra normal */
    line-height: 1; /* Eliminar espacio adicional */
    display: block; /* Cambiar a bloque para evitar espacios inline */
}

/* Estilo para el tipo de renta */
.ticker-item .tipo-renta {
    font-size: 10px; /* Tamaño de letra más pequeño */
    color: #9b9b9b;
    line-height: 1; /* Eliminar espacio adicional */
    display: block; /* Cambiar a bloque para evitar espacios inline */
}

/* Columna de datos (V. Nom / Precio o Rend / Plazo) */
.ticker-item .data-column {
    display: flex;
    flex-direction: column;
    gap: 0px; /* Espacio reducido entre elementos */
    justify-content: center; /* Centrar verticalmente */
    align-items: center; /* Centrar horizontalmente */
}

/* Estilos para V. Nom, Precio, Rendimiento, Plazo, Título y Código */
.ticker-item .vnominal,
.ticker-item .precio,
.ticker-item .rendimiento,
.ticker-item .plazo,
.ticker-item .titulo,
.ticker-item .codigo {
    font-size: 10px; /* Tamaño de letra más pequeño */
    line-height: 1; /* Eliminar espacio adicional */
    display: block; /* Cambiar a bloque para evitar espacios inline */
    margin: 0; /* Eliminar márgenes predeterminados */
    padding: 0; /* Eliminar paddings predeterminados */
}

/* Estilos para V. Nom y Precio */
.ticker-item .vnominal {
    color: #56d68f; /* Verde para V. Nom */
}

.ticker-item .precio {
    color: #ff6b6b; /* Rojo para Precio */
}

/* Estilos para Rendimiento y Plazo */
.ticker-item .rendimiento {
    color: #ff6b6b; /* Rojo para Rendimiento */
}

.ticker-item .plazo {
    color: #6b8cff; /* Azul para Plazo */
}

/* Estilos para Título y Código */
.ticker-item .titulo,
.ticker-item .codigo {
    color: #9b9b9b;
    text-align: center; /* Centrar el texto */
}

/* Manejo de errores */
.ticker-item.error {
    color: #ff6b6b;
    font-weight: 600;
}