/* ===================================================
   1. SPINNER ADA (Carga de Dashboards)
   =================================================== */
@keyframes pulse-ada-white {
    0% { transform: scale(0.85); opacity: 0.6; filter: invert(100%); }
    50% { transform: scale(1.1); opacity: 1; filter: invert(100%); }
    100% { transform: scale(0.85); opacity: 0.6; filter: invert(100%); }
}

.ada-spinner-white {
    animation: pulse-ada-white 1.5s infinite ease-in-out;
    width: 60px;
    height: auto;
    display: block;
    margin: 0 auto;
    filter: invert(100%); 
}

/* ===================================================
   2. BOTÓN "DATOS EN VIVO" (Landing Page)
   =================================================== */
@keyframes blink-live {
    0% { opacity: 1; text-shadow: 0 0 8px rgba(255, 77, 77, 0.9); }
    50% { opacity: 0.3; text-shadow: none; }
    100% { opacity: 1; text-shadow: 0 0 8px rgba(255, 77, 77, 0.9); }
}

/* Fuerza el botón primario a usar dos líneas centradas */
.btn-live-data {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1.2 !important;
    padding: 10px 24px !important;
}

/* Fila 1: "● DATOS EN VIVO" */
.live-row-1 {
    display: flex;
    align-items: center;
    font-weight: 800;
    font-size: 15px; 
    margin-bottom: 2px;
}

/* El punto rojo titilante */
.live-dot {
    color: #ff4d4d;
    animation: blink-live 1.5s infinite ease-in-out;
    margin-right: 6px;
    font-size: 14px;
}

/* Fila 2: "Consumo en Argentina" */
.live-row-2 {
    font-size: 11px;
    font-weight: 600;
    opacity: 0.9;
}