body {
            background-color: #0f3b21;
            color: #fff;
            font-family: Arial, sans-serif;
             margin: 0 !important;
    padding: 0 !important;
        }

        .card {
            background-color: #1b5530;
            border-radius: 8px;
            padding: 1rem;
            margin-bottom: 1rem;
            max-width: 950px; 
    margin-left: auto;
    margin-right: auto;
        }

        .match {
            border-bottom: 1px solid #2a7a47;
            padding: 0.5rem 0;
        }

        .match:last-child {
            border-bottom: none;
        }

        table {
            width: 100%;
            text-align: center;
        }

        th {
            background-color: #1b5530;
            padding: 0.5rem;
        }

        td {
            background-color: #124225;
            padding: 0.5rem;
        }

        input[type="number"] {
            width: 40px;
            padding: 0.2rem;
            background: #fff;
            color: #000;
            border-radius: 4px;
            text-align: center;
        }


        .fecha-card {
            background-color: #1b5530;
            border-radius: 8px;
            padding: 1rem;
            margin: 1rem auto;
            border: 2px solid #2a7a47;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
            max-width: 900px;
        }


        .fecha-card table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 0.5rem;
        }

        .fecha-card th {
            background-color: #2a7a47;
            color: #fff;
            padding: 0.5rem;
            border: 1px solid #2a7a47;
        }

        .fecha-card td {
            background-color: #124225;
            color: #fff;
            padding: 0.5rem;
            border: 1px solid #2a7a47;
            text-align: center;
            vertical-align: middle;
        }


        img.escudo-equipo {
            width: 32px;
            height: 32px;
            object-fit: contain;
            display: inline-block;
        }

        .pos-1 {
            background-color: #ffd700;
            /* Dorado */
            color: #000;
        }

        .pos-2,
        .pos-3,
        .pos-4,
        .pos-5,
        .pos-6,
        .pos-7 {
            background-color: #4fc3f7;
            /* Celeste */
            color: #000;
        }

        .tabla-posiciones {
    font-size: 0.75rem; /* text-xs */
    table-layout: auto;
    width: 100%;
}

.tabla-posiciones th,
.tabla-posiciones td {
    padding: 0.25rem 0.4rem; /* menos espacio */
    white-space: nowrap;
}

.tabla-posiciones-limitada {
    max-width: 900px;
    width: 100%;
}

.tabla-desempate {
    max-width: 900px;
    margin: 0.5rem auto;
    width: 100%;
    font-size: 0.75rem;
    table-layout: auto;
    border-spacing: 0;
}

.tabla-desempate th,
.tabla-desempate td {
    padding: 0.25rem 0.4rem; /* más ajustado */
    white-space: nowrap;
    text-align: center;
}


/* === Force ALL number inputs to have black text === */
input[type="number"] {
    color: black !important;
}



/* === Forzar color inputs type=text con inputmode=numeric === */
input[type="text"][inputmode="numeric"] {
    color: black !important;
    background-color: white !important;
}



/* === Truncado de nombres de equipo en tabla de posiciones === */
.tabla-posiciones td:nth-child(2) span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
    max-width: 120px; /* ajustar si hace falta */
    vertical-align: middle;
}

.abreviado {
    display: none;
}
.completo {
    display: inline;
}

/* Ajustes para pantallas pequeñas */
@media screen and (max-width: 600px) {
    /* Tipografía general */
    .fecha-card td span,
    .fecha-card th,
    .tabla-posiciones td,
    .tabla-posiciones th,
    .tabla-desempate th,
    .tabla-desempate td,
    .match span,
    .card div,
    .card span,
    .card p {
        font-size: 11px !important;
    }

    h2, h3, h4,
    .card h2 {
        font-size: 16px !important;
    }

    select,
    label {
        font-size: 14px !important;
    }

    #explicacion-desempate {
        font-size: 13px !important;
    }

    /* Escudos */
    .escudo-equipo {
        width: 24px !important;
        height: 24px !important;
    }

    /* Ancho truncado para nombres de equipos */
    .tabla-posiciones td:nth-child(2) span {
    white-space: nowrap;
    overflow: visible;
    text-overflow: unset;
}

    /* Espaciado de tablas */
    .tabla-posiciones th,
    .tabla-posiciones td,
    .tabla-desempate th,
    .tabla-desempate td,
    .fecha-card td {
        padding: 0.2rem !important;
    }

    .tabla-desempate th {
        white-space: nowrap;
    }

    /* Inputs en fecha editable */
    .fecha-card td input[type="text"] {
        width: 30px !important;
        font-size: 12px !important;
        padding: 2px !important;
    }

    .fecha-card .flex.justify-center {
        flex-direction: row !important;
        gap: 4px;
    }

    .fecha-card .flex.justify-center input {
        display: inline-block;
        width: 100%;
        max-width: 35px;
        margin: 0 auto;
    }

    .fecha-card td .font-bold.text-base {
    font-size: 18px !important;
    }

 .abreviado {
        display: inline !important;
    }
    .completo {
        display: none !important;
    }
}