/*
=========================================
1. ESTILOS GLOBALES
=========================================
*/
body, h1, h2, h3, p, ul { margin: 0; padding: 0; }
body {
    font-family: 'Roboto', Arial, sans-serif;
    line-height: 1.6;
    background-color: #f0f0f0;
    position: relative; 
}
h1, h2, h3, h4, h5, h6, .menu-principal a {
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
}
.container {
    max-width: 1100px;
    margin: 20px auto;
    padding: 20px;
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
.boton {
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    background-color: #0056b3; color: white; padding: 12px 20px; border: none; border-radius: 4px; cursor: pointer; font-size: 16px; font-weight: bold; transition: background-color 0.3s;
}
.boton:hover { background-color: #004080; }
.enlace-bloque { text-decoration: none; display: block; color: inherit; }

/*
=========================================
2. HEADER (LOGO Y MENÚ BOTONES)
=========================================
*/
header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 30px;
    background-color: #fff;
    border-bottom: 2px solid #004080;
    position: relative;
    z-index: 10;
}
header .logo img { max-height: 70px; width: auto; }
header .menu-principal { display: block; }
header .menu-principal ul {
    list-style: none;
    display: flex;
    margin: 0;
    padding: 0;
    align-items: center; 
}
header .menu-principal li { margin-left: 10px; }
header .menu-principal a {
    text-decoration: none;
    font-weight: 500;
    font-size: 17px;
    color: #004080;
    padding: 8px 15px;
    border: 2px solid transparent;
    border-radius: 5px;
    transition: all 0.3s ease;
    display: block;
}
header .menu-principal a:hover {
    background-color: #004080;
    color: #fff;
}
header .menu-principal a i { margin-right: 6px; }
.menu-toggle { display: none; font-size: 28px; background: none; border: none; color: #004080; cursor: pointer; }

/*
=========================================
3. FRANJA DE BIENVENIDA (HEADER)
=========================================
*/
.header-bienvenida {
    background-color: #004080;
    color: white;
    text-align: center;
    padding: 10px 20px;
    font-size: 1.1em;
    font-weight: bold;
    position: relative; 
    z-index: 1; 
}

/*
=========================================
4. BANNERS PÁGINA DE INICIO
=========================================
*/
.torneo-tucho-banner,
.foto-institucional-header {
    background-color: #006400; /* Verde Gala */
    padding: 30px 20px 40px 20px;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    margin-top: 30px; 
}
.torneo-tucho-banner h2,
.foto-institucional-header h2 {
    font-size: 2.5em;
    color: #fff;
    margin: 0;
    margin-bottom: 25px;
}
.torneo-tucho-banner .banner-container,
.foto-institucional-header .foto-container { 
    max-width: 1100px; 
    margin: 0 auto; 
}
.torneo-tucho-banner .video-banner, /* ¡¡CSS PARA EL VÍDEO!! */
.foto-institucional-header img { 
    max-width: 100%;
    max-height: 450px; 
    width: 100%;
    object-fit: cover; 
    display: block; 
    margin: 0 auto; 
    border-radius: 8px; 
}
.enlace-bloque:hover .torneo-tucho-banner,
.enlace-bloque:hover .foto-institucional-header {
    transform: scale(1.01);
    box-shadow: 0 10px 20px rgba(0,0,0,0.2);
}
.foto-institucional-header {
    margin-top: 0; 
}
@media (min-width: 769px) {
    .foto-institucional-header,
    .torneo-tucho-banner {
        max-width: none; 
        margin: 0 auto 30px auto; 
        box-shadow: 0 5px 15px rgba(0,0,0,0.1); 
    }
    .foto-institucional-header h2,
    .torneo-tucho-banner h2 {
        font-size: 2.8em; 
    }
    .foto-institucional-header img,
    .torneo-tucho-banner .video-banner { /* ¡¡CSS PARA EL VÍDEO!! */
        max-height: 450px; 
        object-fit: cover; 
    }
    .enlace-bloque:hover .foto-institucional-header,
    .enlace-bloque:hover .torneo-tucho-banner {
        transform: translateY(-5px); 
        box-shadow: 0 10px 20px rgba(0,0,0,0.25);
    }
}

/*
=========================================
5. WIDGETS PÁGINA DE INICIO (¡MODIFICADO!)
=========================================
*/
/* ¡¡Este widget ahora es el de PARTIDOS BASE!! */
.widget-partidos-base-grid {
    background-color: #006400; /* ¡Verde! */
    color: white;
    border-radius: 8px;
    text-align: center;
    margin-top: 30px;
    margin-bottom: 30px;
    overflow: hidden; 
    padding: 20px; 
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}
.widget-partidos-base-grid h2 {
    margin-top: 0;
    font-size: 2.2em;
    padding: 0 0 15px 0; 
}
.carteles-base-container {
    display: flex;
    flex-wrap: wrap; 
    justify-content: center; 
    gap: 20px; 
    max-width: 1100px; 
    margin: 0 auto;
}
.partido-cartel-base {
    flex: 1; 
    min-width: 300px; 
    max-width: 500px; 
}
.partido-cartel-base img {
    max-width: 100%;
    width: 100%; 
    height: auto;
    display: block;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
.partido-cartel-base .titulo-cartel {
    font-family: 'Roboto', sans-serif;
    text-transform: none;
    font-size: 1.1em;
    margin-top: 10px;
}
/* ¡¡.proximo-partido-widget YA NO ESTÁ EN LA PORTADA!! */
.partido-info-texto {
    padding: 20px;
    font-family: 'Roboto', Arial, sans-serif;
    text-transform: none;
    font-size: 1.1em;
}


/* --- Widget Últimas Noticias --- */
.ultimas-noticias-widget {
    margin-top: 30px;
}
.ultimas-noticias-widget h2 { 
    text-align: center;
    font-size: 2.2em; 
    margin-bottom: 30px; 
    color: #333;
    border-bottom: 2px solid #f0f0f0;
    padding-bottom: 15px;
}
.noticias-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr); 
    gap: 20px;
}
.noticia-card { 
    background-color: #fff; 
    border: 1px solid #ddd; 
    border-radius: 8px; 
    box-shadow: 0 2px 5px rgba(0,0,0,0.1); 
    overflow: hidden; 
    transition: transform 0.3s, box-shadow 0.3s; 
    display: flex; 
    flex-direction: column; 
}
.noticia-card:hover { 
    transform: translateY(-5px); 
    box-shadow: 0 4px 10px rgba(0,0,0,0.15); 
}
.noticia-card a { 
    text-decoration: none; 
    color: #333; 
    display: flex; 
    flex-direction: column; 
    height: 100%; 
}
.noticia-card img { 
    width: 100%; 
    height: 200px; 
    object-fit: cover; 
}
.noticia-card .card-content { 
    padding: 15px; 
    min-height: 130px; 
    flex-grow: 1; 
}
.noticia-card h3 { 
    font-size: 1.3em; 
    margin: 0 0 10px 0; 
}
.noticia-card .fecha { 
    font-size: 0.85em; 
    color: #777; 
    display: block; 
    margin-bottom: 10px; 
    font-family: 'Roboto', Arial, sans-serif; 
    text-transform: none; 
}
.noticia-card p { 
    font-size: 0.9em; 
    line-height: 1.5; 
    font-family: 'Roboto', Arial, sans-serif; 
    text-transform: none; 
}

/*
=========================================
6. FORMULARIO DE CONTACTO
=========================================
*/
.formulario-contacto { max-width: 600px; margin: 20px auto; padding: 20px; background-color: #f4f4f4; border-radius: 8px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); }
.form-grupo { margin-bottom: 15px; }
.form-grupo label { display: block; margin-bottom: 5px; font-weight: bold; font-family: 'Roboto', Arial, sans-serif; text-transform: none; }
.form-grupo input[type="text"],
.form-grupo input[type="email"],
.form-grupo input[type="tel"],
.form-grupo textarea { width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box; font-family: 'Roboto', Arial, sans-serif; }
.form-grupo textarea { resize: vertical; }
.form-grupo .error { color: #D8000C; font-size: 0.9em; display: block; margin-top: 5px; }
.alerta.exito { background-color: #DFF2BF; color: #4F8A10; padding: 15px; border-radius: 5px; margin-bottom: 15px; text-align: center; }
.alerta.error { background-color: #f8d7da; color: #D8000C; padding: 15px; border-radius: 5px; margin-bottom: 15px; text-align: center; }


/*
=========================================
7. PÁGINA DE GALA DINÁMICA (gala-premios.php)
=========================================
*/
.gala-header {
    text-align: center;
    padding: 20px;
    background-color: #f9f9f9;
    border-radius: 8px;
    margin-bottom: 30px;
}
.gala-header h1 {
    font-size: 2.5em;
    color: #004080;
}
.gala-header p {
    font-family: 'Roboto', Arial, sans-serif;
    text-transform: none;
    font-size: 1.1em;
    color: #555;
    margin-top: 10px;
}
.gala-intro {
    font-size: 1.1em;
    text-align: center;
    color: #666;
    margin-bottom: 30px;
    font-family: 'Roboto', Arial, sans-serif;
    text-transform: none;
}

/*
=========================================
ESTILOS DE LA GALA 
=========================================
*/
.gala-filtros-y-anclas {
    display: flex;
    justify-content: space-between; 
    align-items: center;
    flex-wrap: wrap; 
    gap: 20px; 
    padding: 15px;
    margin-bottom: 30px;
    background-color: #f8f9fa;
    border-radius: 8px;
    border: 1px solid #e9ecef;
}
.gala-filtro {
    display: flex; 
    align-items: center;
    gap: 10px;
    margin: 0; 
}
.gala-filtro label {
    font-weight: bold;
    font-size: 0.95em;
    color: #333;
}
.gala-filtro select {
    padding: 8px 12px;
    border-radius: 20px;
    border: 1px solid #ddd;
    background-color: #fff;
    font-weight: bold;
    cursor: pointer;
}
.gala-anclas {
    display: flex;
    flex-wrap: wrap; 
    justify-content: flex-end; 
    gap: 8px; 
}
.gala-anclas a {
    display: inline-block;
    padding: 8px 14px;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 20px; 
    text-decoration: none;
    color: #333;
    font-weight: bold;
    font-size: 0.9em;
    transition: all 0.2s ease;
}
.gala-anclas a:hover {
    background-color: #0056b3; 
    color: #fff;
    border-color: #0056b3;
}
.gala-categoria-dinamica {
    scroll-margin-top: 20px; 
}

@media (max-width: 768px) {
    .gala-filtros-y-anclas {
        justify-content: center; 
    }
    .gala-filtro {
        width: 100%; 
        justify-content: center;
    }
    .gala-anclas {
        justify-content: center; 
    }
}
.gala-temporada-titulo {
    font-size: 2.2em;
    color: #333;
    border-bottom: 2px solid #004080;
    padding-bottom: 10px;
    margin: 40px 0 20px 0;
}
.gala-categoria-dinamica {
    margin-bottom: 30px;
}
.gala-categoria-dinamica h3 {
    font-size: 1.8em;
    color: #006400; /* Verde */
    margin-bottom: 20px;
    border-bottom: 1px solid #ddd;
    padding-bottom: 10px;
}
.premios-grid-dinamico {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}
.premios-grid-dinamico.single-item-grid {
    grid-template-columns: 1fr;
    max-width: 600px;
    margin: 0 auto;
}
.premio-item-dinamico {
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    transition: transform 0.3s;
    overflow: hidden;
}
.premio-item-dinamico:hover {
    transform: translateY(-5px);
}
.premio-item-dinamico img {
    width: 100%;
    height: 300px;
    object-fit: cover;
}
.premio-item-dinamico .premio-info {
    padding: 15px;
    text-align: center;
}
.premio-item-dinamico h4 {
    font-size: 1.3em;
    color: #004080;
    margin: 0 0 5px 0;
}
.premio-item-dinamico p {
    font-family: 'Roboto', Arial, sans-serif;
    text-transform: none;
    font-size: 1em;
    color: #666;
    padding: 0;
}

/*
=========================================
8. PÁGINA DE EQUIPO (¡OBSOLETA!)
=========================================
*/
/* Esta sección está vacía porque se ha movido a la Sección 14 */

/*
=========================================
9. FOOTER DE COLABORADORES
=========================================
*/
.footer-colaboradores {
    background-color: #4b8b54;
    color: white;
    padding: 40px 20px 20px 20px;
    text-align: center;
}
.footer-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    max-width: 1000px;
    margin: 0 auto;
    margin-bottom: 30px;
}
.colaborador-item img {
    max-width: 200px;
    height: auto;
    background-color: #fff;
    padding: 10px;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
.colaborador-item h3 {
    font-size: 1.8em;
    font-weight: 700;
    margin-top: 20px;
}
.colaborador-item p {
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 1.1em;
    font-weight: 400;
    letter-spacing: 1px;
    opacity: 0.9;
    text-transform: none;
    padding: 0;
}
.colaborador-item .linea-deco {
    width: 40px;
    height: 3px;
    background-color: white;
    margin: 15px auto 0 auto;
    opacity: 0.8;
}
.footer-copyright {
    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,0.2);
    font-family: 'Roboto', Arial, sans-serif;
    text-transform: none;
    opacity: 0.7;
}

/*
=========================================
10. PÁGINA DEL TORNEO (NUEVO DISEÑO)
=========================================
*/
.torneo-header {
    text-align: center;
    padding: 20px;
    background-color: #f9f9f9;
    border-radius: 8px;
    margin-bottom: 30px;
}
.torneo-header h1 {
    font-size: 2.5em;
    color: #004080;
}
.torneo-intro {
    font-size: 1.2em;
    text-align: center;
    margin: 20px 0 30px 0;
    font-family: 'Roboto', Arial, sans-serif;
    text-transform: none;
}
.torneo-categoria-selector {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}
.categoria-card {
    display: block;
    padding: 60px 20px;
    text-decoration: none;
    color: white;
    border-radius: 8px;
    text-align: center;
    transition: transform 0.3s, box-shadow 0.3s;
}
.categoria-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.2);
}
.categoria-card h2 {
    font-size: 2.5em;
    border-bottom: 2px solid rgba(255,255,255,0.5);
    display: inline-block;
    padding-bottom: 10px;
}
.categoria-card.benjamin {
    background-color: #006400; /* Verde */
}
.categoria-card.alevin {
    background-color: #0056b3; /* Azul */
}
.torneo-detalle-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    flex-wrap: wrap;
    gap: 15px;
}
.torneo-detalle-header h2 {
    font-size: 2.2em;
    color: #333;
}
.boton-volver {
    font-family: 'Roboto', sans-serif;
    text-decoration: none;
    color: #0056b3;
    font-weight: bold;
    font-size: 1.1em;
}
.boton-volver:hover {
    text-decoration: underline;
}
.torneo-columnas {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}
.columna-grupo {
    background-color: #fdfdfd;
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}
.grupo-titulo {
    font-size: 1.8em;
    color: white;
    text-align: center;
    padding: 10px;
    border-radius: 5px;
    margin-top: 0;
}
.partidos-titulo {
    font-size: 1.4em;
    color: #333;
    margin-top: 25px;
    margin-bottom: 15px;
    text-align: center;
    border-top: 1px solid #f0f0f0;
    padding-top: 20px;
}
.clasificacion-tabla {
    font-size: 0.95em;
    width: 100%;
    border-collapse: collapse;
}
.clasificacion-tabla th, .clasificacion-tabla td {
    padding: 10px 8px; 
    border-bottom: 1px solid #ddd;
    text-align: center;
    white-space: nowrap;
}
.clasificacion-tabla th {
    background-color: #444; 
    color: #fff;
    font-size: 1em;
}
.clasificacion-tabla tr:nth-child(even) td {
    background-color: #f9f9f9; 
}
.clasificacion-tabla tr:last-child td {
    border-bottom: none;
}
.clasificacion-tabla td.equipo-nombre {
    font-weight: bold;
    text-align: left;
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: normal; 
}
.clasificacion-tabla td.equipo-nombre img {
    width: 20px;
    height: 20px;
    border-radius: 50%;
}
.clasificacion-tabla td strong {
    font-size: 1.1em;
}
.clasificacion-tabla td:nth-child(2) strong {
    color: #006400; 
}
.partidos-lista {
    font-size: 0.9em;
}
.partido-dia-header {
    font-size: 1.1em;
    color: #fff;
    background-color: #3a6b41; 
    padding: 8px 12px;
    border-radius: 4px;
    margin: 15px 0 10px 0;
    text-align: center;
}
.partidos-tabla {
    width: 100%;
    font-size: 1em;
    border-collapse: collapse;
}
.partidos-tabla td {
    padding: 8px 5px;
    border-bottom: 1px solid #f0f0f0;
    text-align: center;
    white-space: normal;
}
.partidos-tabla tr:last-child td {
    border-bottom: none;
}
.partidos-tabla .partido-hora {
    width: 45px;
    color: #333;
    font-family: 'Roboto', sans-serif;
    text-transform: none;
    font-weight: bold;
}
.partidos-tabla .equipo-local { text-align: right; font-weight: bold; }
.partidos-tabla .equipo-visitante { text-align: left; font-weight: bold; }
.partidos-tabla .marcador-celda {
    width: 60px;
    text-align: center;
}
.partidos-tabla .marcador {
    font-size: 1.1em;
    background-color: #333;
    color: white;
    padding: 2px 8px;
    border-radius: 4px;
}
.partidos-lista-full { }
.partidos-tabla.fase-final-tabla {
    font-size: 1em; 
    margin-top: 15px; 
}
.partidos-tabla.fase-final-tabla th {
    background-color: #004080;
    color: white;
    font-size: 1.1em;
    padding: 12px 15px;
}
.partidos-tabla.fase-final-tabla td {
    text-align: center;
    font-family: 'Roboto', Arial, sans-serif;
    text-transform: none;
    font-weight: normal;
    padding: 10px 8px;
}
.partidos-tabla.fase-final-tabla tr:nth-child(even) td {
    background-color: #f9f9f9;
}
.partidos-tabla.fase-final-tabla tr.fila-descanso td {
    background-color: #4b8b54; 
    color: white;
    font-family: 'Oswald', sans-serif;
    font-weight: 500;
    font-size: 1.1em;
}
.partidos-tabla.fase-final-tabla tr.fila-fase-titulo td {
    background-color: #f0f0f0;
    color: #333;
    font-family: 'Oswald', sans-serif;
    font-weight: 500;
}
.partidos-tabla.fase-final-tabla tr.fila-final td {
    color: #006400; 
    font-weight: bold;
    font-size: 1.1em;
}
.partidos-tabla.fase-final-tabla tr.fila-bronce td {
    color: #b07400; 
    font-weight: bold;
}
.partidos-tabla.fase-final-tabla tr.fila-semis td {
    color: #0056b3; 
    font-weight: bold;
}
.partidos-tabla.fase-final-tabla tr.fila-final-plata td {
    color: #666;
    font-weight: bold;
}


/*
=========================================
11. WIDGET CODIGO INTERNO (INICIO.PHP)
=========================================
*/
.widget-codigo-interno {
    margin-top: 40px;
    text-align: center;
    border: 2px solid #004080;
    border-radius: 8px;
    background-color: #f9f9f9;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.widget-codigo-interno a {
    text-decoration: none;
    color: inherit;
    display: block;
    padding: 20px;
}
.widget-codigo-interno:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}
.widget-codigo-interno h2 {
    font-size: 2.2em;
    color: #004080;
    margin-bottom: 20px;
}
.widget-codigo-interno .foto-codigo-interno img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/*
=========================================
12. VERSIÓN MÓVIL (RESPONSIVE)
=========================================
*/
@media (max-width: 768px) {

    /* --- Ajustes del Header --- */
    header { padding: 15px 20px; }
    .menu-toggle { display: block; z-index: 102; }
    header .menu-principal {
        display: none;
        position: absolute;
        top: 91px;
        left: 0;
        width: 100%;
        background-color: #fff;
        box-shadow: 0 4px 10px rgba(0,0,0,0.1);
        z-index: 100;
    }
    header .menu-principal.menu-is-open { display: block; }
    header .menu-principal ul { flex-direction: column; width: 100%; align-items: stretch; text-align: center; }
    header .menu-principal li { margin-left: 0; margin-bottom: 0; }
    header .menu-principal a { border-radius: 0; border-bottom: 1px solid #f0f0f0; }
    
    .menu-tienda a, .menu-tienda a:hover {
        background-color: transparent; 
        color: #004080; 
    }
    .menu-tienda a:hover {
        background-color: #004080; 
        color: #fff;
    }

    .header-bienvenida { font-size: 0.9em; padding: 8px 15px; }
    
    .torneo-tucho-banner { padding: 20px 10px 30px 10px; }
    .torneo-tucho-banner h2 { font-size: 1.8em; }
    
    .foto-institucional-header { padding: 20px 10px 30px 10px; }
    .foto-institucional-header h2 { font-size: 1.8em; }
    .container { padding: 15px; margin: 10px auto; }

    /* --- Ajustes Widgets Portada --- */
    .noticias-grid {
        grid-template-columns: 1fr;
    }
    
    .widget-codigo-interno .foto-codigo-interno img {
        max-width: 100%;
        height: auto;
    }

    /* --- Ajustes Página Gala (Dinámica) --- */
    .gala-temporada-titulo {
        font-size: 1.8em;
    }
    .premios-grid-dinamico {
        grid-template-columns: 1fr;
    }
    .premio-item-dinamico img {
        height: 250px;
    }
    .gala-filtro {
        text-align: center;
    }
    
    /* --- AJUSTES PÁGINA TORNEO --- */
    .torneo-header h1 {
        font-size: 1.8em;
    }
    .torneo-categoria-selector {
        grid-template-columns: 1fr; 
        gap: 20px;
    }
    .torneo-columnas {
        grid-template-columns: 1fr; 
        gap: 30px;
    }
    .clasificacion-tabla {
        font-size: 0.85em; 
    }
    .clasificacion-tabla th, .clasificacion-tabla td {
        padding: 8px 5px; 
    }
    .clasificacion-tabla td.equipo-nombre {
        white-space: normal; 
    }
    .partidos-tabla {
        font-size: 0.9em;
    }
    .fase-final-tabla {
        font-size: 0.9em;
    }
    
    /* --- Ajustes Footer Colaboradores (Móvil) --- */
    .footer-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 10px;
    }
    .colaborador-item img {
        max-width: 90px;
        padding: 5px;
    }
    .colaborador-item h3 {
        font-size: 1.1em;
        margin-top: 10px;
    }
    .colaborador-item p {
        font-size: 0.8em;
        word-break: break-word;
    }
    .colaborador-item .linea-deco {
        display: none;
    }
}
/*
=========================================
ESTILOS DEL TORNEO TUCHO 
=========================================
*/
.clasificacion-tabla .escudo-clasificacion {
    width: 28px;       
    height: 28px;      
    object-fit: contain; 
    margin-right: 8px; 
    vertical-align: middle; 
    background-color: #f4f4f4; 
    border-radius: 50%; 
    border: 1px solid #ddd; 
}
.fase-final-tabla .fila-final {
    background-color: #fff3cd; 
    font-weight: bold;
}
.fase-final-tabla .fila-semis {
    background-color: #f8f9fa;
}
.fase-final-tabla .fila-bronce {
    background-color: #fdf0e6; 
}
.fase-final-tabla .fila-final-plata {
    background-color: #e9ecef; 
}

/* --- Botones de ancla para móvil --- */
.torneo-anclas-movil {
    display: none;
}
@media (max-width: 768px) {
    .torneo-anclas-movil {
        display: flex; 
        justify-content: space-around; 
        gap: 10px;
        margin-bottom: 20px;
        margin-top: 10px; 
    }
    .torneo-anclas-movil .boton-ancla {
        display: block;
        flex: 1; 
        text-align: center;
        padding: 12px 5px; 
        border: none; 
        border-radius: 5px;
        text-decoration: none;
        color: #ffffff; 
        font-weight: bold;
        font-size: 0.95em;
        transition: all 0.2s ease;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1); 
    }
    .torneo-anclas-movil .boton-ancla:first-child {
        background-color: #006400; 
    }
    .torneo-anclas-movil .boton-ancla:last-child {
        background-color: #0056b3; 
    }
    .torneo-anclas-movil .boton-ancla:hover {
        opacity: 0.85; 
    }
    #grupo-a, #grupo-b {
        scroll-margin-top: 20px; 
    }
}


/*
=========================================
ESTILOS DE LA GALA 
=========================================
*/
.gala-filtros-y-anclas {
    display: flex;
    justify-content: space-between; 
    align-items: center;
    flex-wrap: wrap; 
    gap: 20px; 
    padding: 15px;
    margin-bottom: 30px;
    background-color: #f8f9fa;
    border-radius: 8px;
    border: 1px solid #e9ecef;
}
.gala-filtro {
    display: flex; 
    align-items: center;
    gap: 10px;
    margin: 0; 
}
.gala-filtro label {
    font-weight: bold;
    font-size: 0.95em;
    color: #333;
}
.gala-filtro select {
    padding: 8px 12px;
    border-radius: 20px;
    border: 1px solid #ddd;
    background-color: #fff;
    font-weight: bold;
    cursor: pointer;
}
.gala-anclas {
    display: flex;
    flex-wrap: wrap; 
    justify-content: flex-end; 
    gap: 8px; 
}
.gala-anclas a {
    display: inline-block;
    padding: 8px 14px;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 20px; 
    text-decoration: none;
    color: #333;
    font-weight: bold;
    font-size: 0.9em;
    transition: all 0.2s ease;
}
.gala-anclas a:hover {
    background-color: #0056b3; 
    color: #fff;
    border-color: #0056b3;
}
.gala-categoria-dinamica {
    scroll-margin-top: 20px; 
}
@media (max-width: 768px) {
    .gala-filtros-y-anclas {
        justify-content: center; 
    }
    .gala-filtro {
        width: 100%; 
        justify-content: center;
    }
    .gala-anclas {
        justify-content: center; 
    }
}


/*
=========================================
13. WIDGET PARTIDOS BASE (CARTEL)
=========================================
*/
.widget-partidos-base-grid {
    background-color: #006400; /* ¡Verde! */
    color: white;
    border-radius: 8px;
    text-align: center;
    margin-top: 30px;
    margin-bottom: 30px;
    overflow: hidden; 
    padding: 20px; 
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}
.widget-partidos-base-grid h2 {
    margin-top: 0;
    font-size: 2.2em;
    padding: 0 0 15px 0; 
}
.carteles-base-container {
    display: flex;
    flex-wrap: wrap; 
    justify-content: center; 
    gap: 20px; 
    max-width: 1100px; 
    margin: 0 auto;
}
.partido-cartel-base {
    flex: 1; 
    min-width: 300px; 
    max-width: 500px; 
}
.partido-cartel-base img {
    max-width: 100%;
    width: 100%; 
    height: auto;
    display: block;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
.partido-cartel-base .titulo-cartel {
    font-family: 'Roboto', sans-serif;
    text-transform: none;
    font-size: 1.1em;
    margin-top: 10px;
}


/*
=========================================
14. PÁGINA DE EQUIPO SENIOR (¡NUEVA!)
=========================================
*/
.pagina-equipo-senior .equipo-header {
    position: relative;
    height: 250px; /* ¡¡REBAJADO!! */
    background-size: cover;
    background-position: center;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 30px;
}
.pagina-equipo-senior .equipo-header-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background: linear-gradient(to top, rgba(0, 64, 128, 0.9), rgba(0, 64, 128, 0));
    padding: 30px 20px 20px 20px; 
    text-align: left;
}
.pagina-equipo-senior .equipo-header h1 {
    font-size: 2.8em;
    color: #fff;
    margin: 0;
}
.pagina-equipo-senior .equipo-header p {
    font-family: 'Roboto', Arial, sans-serif;
    text-transform: none;
    font-size: 1.3em;
    color: #ffc107; /* Amarillo */
    margin: 0;
    font-weight: bold;
}

.seccion-titulo-equipo {
    font-size: 2em;
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    color: #333;
    border-bottom: 2px solid #004080;
    padding-bottom: 10px;
    margin-bottom: 20px;
    margin-top: 40px;
}

/* --- Filtros de Jornada (¡¡REVENTADOS!!) --- */
.filtros-jornada-equipo {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 30px;
    padding: 0 5px;
    align-items: center; /* ¡Alineamos! */
}
.filtros-jornada-equipo label {
    font-family: 'Roboto', sans-serif;
    text-transform: none;
    font-weight: bold;
    font-size: 1.1em;
    color: #333;
    margin-right: 10px;
}
.filtros-jornada-equipo select {
    font-family: 'Oswald', sans-serif;
    font-size: 1.1em;
    padding: 8px 15px;
    border: 2px solid #0056b3;
    border-radius: 25px;
    background-color: #fff;
    cursor: pointer;
    font-weight: 500;
    box-shadow: 0 2px 5px rgba(0,0,0,0.08);
}
/* ¡¡Botones viejos a la mierda!! */
.filtro-btn-equipo { display: none; }


/* --- Widget de Partidos (Blanco) --- */
.widget-partidos-equipo {
    background-color: transparent; 
    color: #333;
    text-align: center;
    overflow: visible; 
    padding: 0; 
}
.lista-proximos-partidos-equipo {
    list-style: none;
    padding: 0;
    margin: 0;
    font-family: 'Roboto', sans-serif;
    text-transform: none;
    max-width: none; 
    margin: 0; 
}
.lista-proximos-partidos-equipo li {
    background-color: #ffffff;
    border: 1px solid #e8e8e8;
    border-left: 5px solid #0056b3; /* Borde azul por defecto */
    border-radius: 10px;
    margin-bottom: 20px;
    padding: 20px 30px; 
    box-shadow: 0 6px 15px rgba(0,0,0,0.08);
    /* ¡¡A LA MIERDA EL FLEX!! ¡¡BLOQUE!! */
    display: block;
    text-align: center; /* ¡Centramos todo! */
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    position: relative; 
}
.lista-proximos-partidos-equipo li:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
}

/* --- ¡¡ESTILOS DE RESULTADO (VICTORIA, ETC)!! --- */
.lista-proximos-partidos-equipo li.resultado-victoria { border-left-color: #28a745; }
.lista-proximos-partidos-equipo li.resultado-derrota { border-left-color: #dc3545; }
.lista-proximos-partidos-equipo li.resultado-empate { border-left-color: #ffc107; }

/* Título (Próximo Partido / Resultado) */
.partido-info-categoria {
    font-size: 1.1em;
    color: #0056b3; /* Azul por defecto */
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: bold; 
    width: 100%; 
}
/* ¡¡Colores de Título!! */
.resultado-victoria .partido-info-categoria { color: #28a745 !important; }
.resultado-derrota .partido-info-categoria { color: #dc3545 !important; }
.resultado-empate .partido-info-categoria { color: #ffc107 !important; }

/* ¡¡NUEVO!! Hora/Jornada (AHORA ESTÁ AQUÍ) */
.partido-info-hora {
    width: 100%; 
    text-align: center;
    font-size: 1.1em;
    color: #555;
    margin-top: 0;
    margin-bottom: 10px; /* ¡Espacio! */
    border-top: none;
    padding-top: 0;
    font-weight: bold;
}

.partido-info-partido {
    display: flex;
    align-items: center;
    justify-content: center; /* ¡¡CENTRADO!! */
    width: 100%; 
    margin-bottom: 0;
}
.partido-info-partido strong {
    font-size: 1.8em;
    color: #1a1a1a;
    font-weight: 700;
    white-space: nowrap;
    flex: 1; /* Ocupan espacio */
}
.partido-info-partido .equipo-local-nombre {
    text-align: right;
}
.partido-info-partido .equipo-visitante-nombre {
    text-align: left;
}

.marcador-widget {
    font-size: 2.2em; 
    font-weight: 700;
    margin: 0 25px; /* ¡Más espacio! */
    color: #004080; 
    font-family: 'Oswald', sans-serif;
    flex: 0; /* No crece */
}
.partido-info-partido span { /* Para el "vs" */
    font-size: 2.0em; /* Más pequeño */
    font-weight: 700;
    margin: 0 25px;
    color: #999; 
    flex: 0;
}

/* ¡¡ESTILOS GOLEADORES!! */
.partido-fila-goles {
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px dashed #ddd;
}
.goleadores-titulo {
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    font-size: 1em;
    color: #333;
    font-weight: 600;
    margin-bottom: 10px;
    text-align: center; /* ¡Centrado! */
}
.lista-goleadores-widget {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: center; /* ¡Centrado! */
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* ¡Centrado! */
    gap: 10px 20px; /* 10px vertical, 20px horizontal */
}
.lista-goleadores-widget li {
    font-size: 0.95em;
    color: #444;
    margin-bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: none;
    border: none;
    box-shadow: none;
    flex-basis: auto; /* ¡Que crezcan solos! */
}
.lista-goleadores-widget li:hover {
    transform: none;
    box-shadow: none;
}
.lista-goleadores-widget li i {
    color: #005a9e;
    margin-right: 8px;
}

.partido-info-texto-equipo {
    text-align: center;
    margin-top: 30px;
    font-size: 1.1em;
    color: #555;
    background: #f9f9f9;
    padding: 20px;
    border-radius: 8px;
    border: 1px solid #eee;
}

/* Clasificación (¡Comentada en el PHP!) */
.clasificacion-container {
    text-align: center;
}
.clasificacion-container img {
    max-width: 100%;
    width: 100%;
    max-width: 800px; 
    height: auto;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/* --- Plantilla (Jugadores) --- */
.plantilla-grid-senior {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); 
    gap: 25px;
    margin-top: 30px;
}
.jugador-card-senior {
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    padding: 0; 
    text-align: center;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    overflow: hidden; 
}
.jugador-card-senior:hover {
    transform: translateY(-5px);
    box-shadow: 0 6px 15px rgba(0,0,0,0.15);
}
.jugador-card-senior img {
    width: 100%; 
    height: 190px;
    border-radius: 0; 
    object-fit: cover;
    border: none;
    margin-bottom: 0; 
    border-bottom: 4px solid #005a9e; 
}
.jugador-info-senior {
    padding: 15px;
}
.jugador-info-senior h3 {
    margin: 0 0 5px 0;
    font-size: 1.3em;
    color: #1a1a1a;
    font-weight: 600;
}
.jugador-info-senior p {
    margin: 0;
    font-size: 0.95em;
    color: #555;
    font-weight: 500;
}

/* Móvil (para la plantilla y cabecera) */
@media (max-width: 768px) {
    .pagina-equipo-senior .equipo-header {
        height: 180px; 
    }
    .pagina-equipo-senior .equipo-header h1 {
        font-size: 2em;
    }
    .pagina-equipo-senior .equipo-header p {
        font-size: 1.1em;
    }
    .plantilla-grid-senior {
        grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
        gap: 15px;
    }
    .jugador-card-senior img {
        height: 160px;
    }

    /* ¡¡ARREGLO MÓVIL PARA EL MARCADOR!! */
    .lista-proximos-partidos-equipo li {
        padding: 15px;
        align-items: center;
        display: block; /* ¡¡EL ARREGLO!! */
    }
    .partido-info-partido {
        width: 100%;
        margin-bottom: 10px;
        justify-content: center; 
        flex-direction: column; /* ¡¡LA CLAVE!! Apilamos */
    }
    .partido-info-partido strong {
        font-size: 1.4em;
        flex: none; /* Quitamos el flex */
        width: 100%; /* Ancho completo */
        text-align: center; /* Centrado */
    }
    .partido-info-partido .equipo-local-nombre { 
        padding-right: 0; 
        order: 1; /* Posición 1: Local */
    } 
    .partido-info-partido .equipo-visitante-nombre { 
        padding-left: 0; 
        order: 3; /* Posición 3: Visitante */
    }
    
    .marcador-widget { 
        font-size: 2em; 
        margin: 5px 0; 
        order: 2; /* Posición 2: Marcador */
    }
    .partido-info-partido span { /* vs */
        font-size: 1.5em; 
        margin: 5px 0; 
        order: 2; /* Posición 2: VS */
    }
    
    .partido-info-hora {
        width: 100%;
        text-align: center;
        border-top: 1px dashed #eee;
        padding-top: 10px;
    }
    .lista-goleadores-widget {
        justify-content: center;
        gap: 10px;
    }
    .lista-goleadores-widget li {
        flex-basis: auto;
    }
}

/*
=========================================
15. PÁGINA DE NOTICIAS (LISTADO)
=========================================
*/
.pagina-noticias-header {
    text-align: center;
    padding: 20px;
    background-color: #f9f9f9;
    border-radius: 8px;
    margin-bottom: 30px;
}
.pagina-noticias-header h1 {
    font-size: 2.5em;
    color: #004080;
}
.listado-noticias {
    max-width: 900px; /* Más ancho que el de contacto */
    margin: 0 auto;
}
.noticia-item {
    display: flex;
    flex-direction: row;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    overflow: hidden;
    margin-bottom: 30px;
    transition: transform 0.3s, box-shadow 0.3s;
}
.noticia-item:hover {
    transform: translateY(-5px); 
    box-shadow: 0 4px 10px rgba(0,0,0,0.15); 
}
.noticia-item .noticia-imagen {
    flex: 0 0 300px; /* Ancho fijo para la imagen */
    min-height: 200px;
}
.noticia-item .noticia-imagen img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.noticia-item .noticia-contenido {
    padding: 20px 25px;
    flex: 1;
}
.noticia-item h3 {
    font-size: 1.8em;
    color: #004080;
    margin: 0 0 10px 0;
}
.noticia-item .noticia-fecha {
    font-size: 0.9em; 
    color: #777; 
    display: block; 
    margin-bottom: 15px; 
    font-family: 'Roboto', Arial, sans-serif; 
    text-transform: none; 
}
.noticia-item p {
    font-family: 'Roboto', Arial, sans-serif; 
    text-transform: none; 
    font-size: 1em;
    line-height: 1.7;
    color: #333;
    white-space: pre-wrap; /* ¡Para respetar los saltos de línea! */
}

/* Móvil para la lista de noticias */
@media (max-width: 768px) {
    .noticia-item {
        flex-direction: column; /* Apilamos en móvil */
    }
    .noticia-item .noticia-imagen {
        flex: 0 0 200px; /* Alto fijo para la imagen en móvil */
    }
}