/*
================================================================================
  BASKET MANAGER PROFESSIONAL - HOJAS DE ESTILO (assets/style.css)
  Personaliza el diseño de los shortcodes para adaptarlo a tu plantilla de WordPress.
  Totalmente Responsivo para Celulares, Tablets y Pantallas de Escritorio.
================================================================================
*/

/* --- 1. TABLA DE POSICIONES ([basket_standings]) --- */
.basket-standings-container {
    width: 100%;
    margin: 20px 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.basket-standings-table {
    width: 100%;
    border-collapse: collapse;
    background-color: #ffffff;
    border: 2px solid #141414 !important; /* Color oscuro base de tu diseño */
    font-family: sans-serif;
    text-align: left;
    min-width: 500px; /* Evita compresión extrema de columnas */
}

.basket-standings-table thead tr {
    background-color: #141414 !important; /* Fondo del encabezado */
    color: #ffffff !important;            /* Texto en blanco */
    font-family: monospace;
    text-transform: uppercase;
}

.basket-standings-table th {
    padding: 12px 16px !important;
    font-weight: bold;
}

.basket-standings-table td {
    padding: 12px 16px !important;
    border-bottom: 1px solid #e2e8f0 !important;
    vertical-align: middle;
}

.basket-standings-table tbody tr:hover {
    background-color: #f8fafc !important; /* Color de fondo al pasar el cursor por la fila */
}

/* Ocultar columnas menos críticas en pantallas de celulares y tablets pequeñas (menores a 640px) */
@media screen and (max-width: 640px) {
    /* Ocultar PF (Puntos a favor) y PC (Puntos en contra) para dar espacio al puntaje principal */
    .basket-standings-table th:nth-child(8),
    .basket-standings-table td:nth-child(8),
    .basket-standings-table th:nth-child(9),
    .basket-standings-table td:nth-child(9) {
        display: none !important;
    }
    
    .basket-standings-table th, 
    .basket-standings-table td {
        padding: 8px 10px !important; /* Reducir padding interno */
        font-size: 13px !important;
    }
    
    .basket-standings-table {
        min-width: 100% !important; /* Permitir que ocupe todo el ancho sin scroll */
    }
}

/* Optimización extra para celulares súper pequeños (menores a 400px) */
@media screen and (max-width: 400px) {
    /* Ocultar también DIF (Diferencia de goles/puntos) si es necesario */
    .basket-standings-table th:nth-child(7),
    .basket-standings-table td:nth-child(7) {
        display: none !important;
    }
    
    .basket-standings-table th, 
    .basket-standings-table td {
        padding: 6px 8px !important;
        font-size: 11px !important;
    }
}


/* --- 2. TARJETA DEL ÚLTIMO PARTIDO JUGADO ([basket_last_game]) --- */
.basket-last-game-card {
    background-color: #ffffff !important;
    border: 2px solid #141414 !important;
    padding: 20px !important;
    text-align: center !important;
    max-width: 450px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 15px auto !important;
    box-shadow: 4px 4px 0px #141414 !important; /* Estilo brutalista retro */
    font-family: sans-serif;
}

/* Adaptación responsive para el Último Partido */
@media screen and (max-width: 480px) {
    .basket-last-game-card {
        padding: 15px 10px !important;
    }
    .basket-last-game-card div[style*="display:flex"] {
        flex-direction: column !important; /* Apilar equipos verticalmente en celulares muy pequeños */
        gap: 10px !important;
    }
    .basket-last-game-card div[style*="flex:1"] {
        flex: none !important;
        width: 100% !important;
    }
    .basket-last-game-card img {
        width: 40px !important;
        height: 40px !important;
    }
}


/* --- 3. TARJETA DEL SIGUIENTE PARTIDO ([basket_next_game]) --- */
.basket-next-game-card {
    background-color: #ffffff !important;
    border: 2px solid #141414 !important;
    padding: 20px !important;
    text-align: center !important;
    max-width: 450px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 15px auto !important;
    box-shadow: 4px 4px 0px #141414 !important;
    font-family: sans-serif;
}

/* Adaptación responsive para el Siguiente Partido */
@media screen and (max-width: 480px) {
    .basket-next-game-card {
        padding: 15px 10px !important;
    }
    .basket-next-game-card div[style*="display:flex"] {
        flex-direction: column !important; /* Apilar en vertical */
        gap: 10px !important;
    }
    .basket-next-game-card div[style*="flex:1"] {
        flex: none !important;
        width: 100% !important;
    }
    .basket-next-game-card img {
        width: 40px !important;
        height: 40px !important;
    }
}


/* --- 4. FIXTURE Y CALENDARIO COMPLETO ([basket_calendar]) --- */
.basket-calendar-container {
    width: 100%;
    margin: 15px 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    font-family: sans-serif;
}

.basket-calendar-container table {
    width: 100%;
    border-collapse: collapse;
    background: #ffffff !important;
    border: 2px solid #141414 !important;
    text-align: left;
    min-width: 600px; /* Asegura legibilidad en tablets */
}

.basket-calendar-container thead tr {
    background: #141414 !important;
    color: #ffffff !important;
    font-size: 11px !important;
    text-transform: uppercase;
    font-family: monospace;
}

.basket-calendar-container th, 
.basket-calendar-container td {
    padding: 12px 15px !important;
}

.basket-calendar-container tbody tr {
    border-bottom: 1px solid #e5e7eb !important;
}

.basket-calendar-container tbody tr:hover {
    background-color: #fafafa !important;
}

/* Responsive para Calendario */
@media screen and (max-width: 768px) {
    /* En tablets reducimos paddings y tamaños de letra */
    .basket-calendar-container table {
        min-width: 500px !important;
    }
    .basket-calendar-container th, 
    .basket-calendar-container td {
        padding: 8px 10px !important;
        font-size: 12px !important;
    }
}

@media screen and (max-width: 600px) {
    /* Ocultar columna Sede/Coliseo en celulares pequeños para evitar overflow */
    .basket-calendar-container table thead tr th:nth-child(6),
    .basket-calendar-container table tbody tr td:nth-child(6) {
        display: none !important;
    }
    /* Ocultar Fase/Jornada en celulares muy pequeños */
    .basket-calendar-container table thead tr th:nth-child(1),
    .basket-calendar-container table tbody tr td:nth-child(1) {
        display: none !important;
    }
    
    .basket-calendar-container table {
        min-width: 100% !important; /* Cabe completo sin scroll */
    }
}


/* --- 5. LLAVES DE PLAYOFFS ([basket_playoffs]) --- */
.basket-playoffs-container {
    font-family: sans-serif;
    margin: 15px 0;
}

.basket-series-bracket {
    background-color: #ffffff !important;
    border: 2px solid #141414 !important;
    box-shadow: 4px 4px 0px #141414 !important;
    padding: 15px !important;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    border-left: 6px solid #ff4500 !important; /* Borde izquierdo llamativo naranja */
    box-sizing: border-box !important;
}

/* Responsive para las llaves */
@media screen and (max-width: 640px) {
    /* La cuadrícula de llaves pasa a ser una sola columna limpia */
    .basket-playoffs-container div[style*="display:grid"] {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
    }
    
    .basket-series-bracket {
        padding: 12px !important;
    }
}