/* ==========================================================================
   BINGU — Tema Clásico
   ==========================================================================
   Estilo tradicional de bingo: fondo blanco, bordes negros, marcado rojo.
   Limpio, sencillo, legible.
   ========================================================================== */

.bingo-card.card-theme-clasico {
    --clasico-bg: #ffffff;
    --clasico-border: #000000;
    --clasico-header-bg: #f5f5f5;
    --clasico-header-border: #dddddd;
    --clasico-text: #000000;
    --clasico-empty-bg: #fafafa;
    --clasico-marked-bg: #e53935;
    --clasico-marked-text: #ffffff;
    --clasico-footer-bg: #f5f5f5;
    --clasico-footer-text: #666666;
}

/* Contenedor */
.bingo-card.card-theme-clasico {
    background-color: var(--clasico-bg);
    border: 2px solid var(--clasico-border);
}

/* Cabecera */
.bingo-card.card-theme-clasico .bingo-card-header {
    background-color: var(--clasico-header-bg);
    border-bottom: 1px solid var(--clasico-header-border);
}

.bingo-card.card-theme-clasico .bingo-card-url {
    color: var(--clasico-text);
}

/* Letras B-I-N-G-O (formato americano) */
.bingo-card.card-theme-clasico .bingo-grid-us-header .bingo-header-letter {
    background-color: var(--clasico-border);
    color: var(--clasico-bg);
}

/* Celdas con número */
.bingo-card.card-theme-clasico .bingo-cell {
    color: var(--clasico-text);
    font-weight: 700;
    font-size: clamp(14px, 2.5vw, 24px);
    border: 1px solid var(--clasico-header-border);
}

/* Celdas vacías */
.bingo-card.card-theme-clasico .bingo-cell.empty {
    background-color: var(--clasico-empty-bg);
}

/* Celda marcada */
.bingo-card.card-theme-clasico .bingo-cell.marked {
    background-color: var(--clasico-marked-bg);
    color: var(--clasico-marked-text);
    font-weight: 700;
}

/* Celda FREE */
.bingo-card.card-theme-clasico .bingo-cell.free {
    background-color: var(--clasico-header-bg);
    font-weight: 700;
    font-size: clamp(9px, 1.5vw, 13px);
    color: var(--clasico-text);
}

.bingo-card.card-theme-clasico .bingo-cell.free.marked {
    background-color: var(--clasico-marked-bg);
    color: var(--clasico-marked-text);
}

/* Pie */
.bingo-card.card-theme-clasico .bingo-card-footer {
    background-color: var(--clasico-footer-bg);
    color: var(--clasico-footer-text);
    border-top: 1px solid var(--clasico-header-border);
}
