/* ── Alternado: cards pares → amarillo ───────────────────────────────────────
 *
 * IMPORTANTE: Elementor inyecta etiquetas <style> ENTRE las cards dentro del
 * .elementor-loop-container. Un :nth-child(even) común las cuenta como hermanos
 * y descuadra el alternado (provincia entera oscura o entera amarilla según
 * cuántos <style> tenga delante). Por eso usamos ":nth-child(even of .e-loop-item)",
 * que cuenta ÚNICAMENTE las cards e ignora los <style>. Alterna una y una de verdad.
 * (Soportado en Chrome/Edge 111+, Firefox 113+, Safari 9+.)
 * Al reordenar la geolocalización el DOM, el CSS se recalcula solo.
 * ──────────────────────────────────────────────────────────────────────────── */

.elementor-loop-container .e-loop-item:nth-child(even of .e-loop-item) > .e-con-full {
    background-color: #FFBD00 !important;
}

/* ── Cards: contenido compacto arriba + mismo alto, conservando el gap ────────
 * La plantilla de la card usa min-height:570px + justify-content:space-evenly,
 * que reparte el espacio sobrante entre todo el contenido y lo deja disperso
 * (peor aún cuando un botón se oculta con display:none). Lo unificamos en TODAS
 * las cards:
 *   - apilamos el contenido arriba con flex-start → sin dispersión
 *   - igualamos el alto haciendo que la card llene la fila con flex:1
 *
 * Importante para el GAP: NO usamos height:100% (eso ignoraba el margin-bottom:65px
 * de la card y se comía el gap entre filas). Con el e-loop-item como flex-column y
 * la card en flex:1, la card llena el alto DESCONTANDO su propio margin, así el gap
 * entre filas (sea cual sea por breakpoint) queda intacto. El badge de geo es
 * position:absolute, no lo afecta. */
.elementor-loop-container .e-loop-item {
    display: flex;
    flex-direction: column;
}
.elementor-loop-container .e-loop-item > .e-con-full {
    flex: 1 1 auto;
    justify-content: flex-start !important;
}

/* Textos negros en cards amarillas */
.elementor-loop-container .e-loop-item:nth-child(even of .e-loop-item) .elementor-heading-title,
.elementor-loop-container .e-loop-item:nth-child(even of .e-loop-item) .elementor-text-editor,
.elementor-loop-container .e-loop-item:nth-child(even of .e-loop-item) .elementor-widget-container p,
.elementor-loop-container .e-loop-item:nth-child(even of .e-loop-item) .elementor-widget-container span,
.elementor-loop-container .e-loop-item:nth-child(even of .e-loop-item) .elementor-icon-list-text,
.elementor-loop-container .e-loop-item:nth-child(even of .e-loop-item) .elementor-icon-list-icon svg,
.elementor-loop-container .e-loop-item:nth-child(even of .e-loop-item) .elementor-icon-list-icon i {
    color: #000 !important;
    fill: #000 !important;
}

/* ── Botones en cards amarillas: fondo oscuro + TEXTO amarillo ────────────────
 * El texto del botón vive en .elementor-button-text. La regla de arriba
 * (span → #000) lo pintaba negro sobre fondo oscuro y quedaba ilegible.
 * Acá lo forzamos a amarillo con mayor especificidad para que gane.
 * Excluimos el botón "próximamente" (.qivox-btn-proximamente): ese va en rojo. */
.elementor-loop-container .e-loop-item:nth-child(even of .e-loop-item) .elementor-button:not(.qivox-btn-proximamente) {
    background-color: #191919 !important;
    color: #FFBD00 !important;
}
.elementor-loop-container .e-loop-item:nth-child(even of .e-loop-item) .elementor-button:not(.qivox-btn-proximamente) .elementor-button-text,
.elementor-loop-container .e-loop-item:nth-child(even of .e-loop-item) .elementor-button:not(.qivox-btn-proximamente) span,
.elementor-loop-container .e-loop-item:nth-child(even of .e-loop-item) .elementor-button:not(.qivox-btn-proximamente) i,
.elementor-loop-container .e-loop-item:nth-child(even of .e-loop-item) .elementor-button:not(.qivox-btn-proximamente) svg {
    color: #FFBD00 !important;
    fill: #FFBD00 !important;
}
.elementor-loop-container .e-loop-item:nth-child(even of .e-loop-item) .elementor-button:not(.qivox-btn-proximamente):hover {
    background-color: #000 !important;
    color: #FFBD00 !important;
}

/* ── Botón "Próximamente": SIEMPRE rojo con texto blanco ──────────────────────
 * En cards oscuras y amarillas. El marcador .qivox-btn-proximamente lo agrega
 * sedes.js por el texto del botón.
 *
 * OJO con la especificidad: la regla de "texto negro" usa
 * :nth-child(even of .e-loop-item), y el argumento "of .e-loop-item" SUMA su
 * propia especificidad al :nth-child, quedando en (0,5,1). Para ganarle sin
 * depender del orden, encadenamos ancestros reales (.elementor-widget-button +
 * .elementor-widget-container) y apuntamos a la clase .elementor-button-text,
 * llevando estas reglas por encima de (0,5,1). */
.elementor-loop-container .e-loop-item .elementor-widget-button .elementor-button.qivox-btn-proximamente,
.elementor-loop-container .e-loop-item .elementor-widget-button .elementor-button.qivox-btn-proximamente:hover,
.elementor-loop-container .e-loop-item .elementor-widget-button .elementor-button.qivox-btn-proximamente:focus {
    background-color: #F52C2C !important;
    border-color: #F52C2C !important;
    color: #FFFFFF !important;
}
.elementor-loop-container .e-loop-item .elementor-widget-button .elementor-widget-container .elementor-button.qivox-btn-proximamente .elementor-button-text,
.elementor-loop-container .e-loop-item .elementor-widget-button .elementor-button.qivox-btn-proximamente .elementor-button-text,
.elementor-loop-container .e-loop-item .elementor-widget-button .elementor-button.qivox-btn-proximamente .elementor-button-content-wrapper,
.elementor-loop-container .e-loop-item .elementor-widget-button .elementor-button.qivox-btn-proximamente span,
.elementor-loop-container .e-loop-item .elementor-widget-button .elementor-button.qivox-btn-proximamente i,
.elementor-loop-container .e-loop-item .elementor-widget-button .elementor-button.qivox-btn-proximamente svg {
    color: #FFFFFF !important;
    fill: #FFFFFF !important;
}