/* =========================================================
   Módulo Banca / Admin — tablets y móviles (iOS / Android)
   Reglas globales bajo .banca-wrap (sin scoped)
   ========================================================= */

.banca-wrap {
    max-width: 100%;
    overflow-x: hidden;
}

.banca-contenido {
    max-width: 100%;
    overflow-x: hidden;
}

/* ---------- Tablet ---------- */
@media (max-width: 1024px) {
    .banca-wrap .kpi-grid,
    .banca-wrap .ppb-featured-grid,
    .banca-wrap .ppb-lcr-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .banca-wrap .ganador-pro-board-selectores {
        grid-template-columns: 1fr !important;
        justify-content: stretch !important;
    }

    .banca-wrap .ganador-pro-column {
        max-width: 100% !important;
    }
}

/* ---------- Móvil ---------- */
@media (max-width: 768px) {
    .banca-wrap {
        padding: 8px 10px 16px !important;
    }

    .banca-wrap .banca-tabs {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
    }

    .banca-wrap .cerrar-sesion {
        grid-column: 1 / -1 !important;
    }

    /* Tablas anchas: scroll horizontal sin romper layout */
    .banca-wrap .tabla,
    .banca-wrap .tabla-usuarios,
    .banca-wrap .tabla-sorteos,
    .banca-wrap .bn-table-wrap,
    .banca-wrap .cs-table-wrap,
    .banca-wrap .hist-table-wrap,
    .banca-wrap .usuarios-tabla-scroll {
        display: block;
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
    }

    .banca-wrap .tabla-header,
    .banca-wrap .tabla-body .fila,
    .banca-wrap .tabla-us-sorteos-grid,
    .banca-wrap .tabla-us-sorteos-grid-simple,
    .banca-wrap .tabla-us-sorteos-grid-monazos,
    .banca-wrap .tabla-us-sorteos-grid-tiempos {
        min-width: 0;
    }

    .banca-wrap .tabla-sorteos .tabla-header,
    .banca-wrap .tabla-sorteos .tabla-body .fila {
        min-width: 640px;
    }

    .banca-wrap .tabla-usuarios .tabla-header,
    .banca-wrap .tabla-usuarios .tabla-body .fila {
        min-width: 680px;
    }

    /* Grids → una columna */
    .banca-wrap .ganador-pro-board,
    .banca-wrap .ganador-pro-board-selectores,
    .banca-wrap .historial-grid,
    .banca-wrap .kpi-grid,
    .banca-wrap .ppb-featured-grid,
    .banca-wrap .ppb-lcr-grid,
    .banca-wrap .rest-wrap .filtros,
    .banca-wrap .filtros {
        grid-template-columns: 1fr !important;
    }

    .banca-wrap .fecha-barra,
    .banca-wrap .fecha-top .fecha-barra,
    .banca-wrap .bn-filtros,
    .banca-wrap .ganador-pro-tabs-row {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .banca-wrap .fecha-box,
    .banca-wrap .bn-filter,
    .banca-wrap .bn-filter-date,
    .banca-wrap .ganador-pro-date-inline {
        width: 100% !important;
        max-width: 100% !important;
    }

    .banca-wrap .ganador-pro-tabs {
        width: 100%;
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
    }

    .banca-wrap .ganador-pro-tab-historial {
        grid-column: 1 / -1 !important;
    }

    /* Bloque números */
    .banca-wrap .bn-grid {
        grid-template-columns: repeat(5, minmax(52px, 1fr)) !important;
        gap: 8px !important;
    }

    .banca-wrap .bn-select,
    .banca-wrap .bn-filtros select {
        min-width: 0 !important;
        width: 100% !important;
    }

    /* Modales */
    .banca-wrap .ganador-pro-modal,
    .banca-wrap .ganador-historial-modal,
    .banca-wrap .rest-floating-modal,
    .banca-wrap .bn-modal-box,
    .banca-wrap .modal-historial {
        width: min(100%, calc(100vw - 20px)) !important;
        max-width: calc(100vw - 20px) !important;
        margin: 0 auto;
    }

    .banca-wrap .ganador-pro-modal-backdrop,
    .banca-wrap .ganador-historial-backdrop,
    .banca-wrap .rest-floating-modal-backdrop {
        padding: 10px !important;
    }

    /* Formularios */
    .banca-wrap .form-row {
        grid-template-columns: 1fr !important;
    }

    .banca-wrap .input,
    .banca-wrap select,
    .banca-wrap textarea,
    .banca-wrap .btn,
    .banca-wrap .ganador-pro-main-btn {
        max-width: 100%;
        box-sizing: border-box;
    }

    .banca-wrap .acciones {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .banca-wrap .acciones .btn {
        width: 100% !important;
    }

    /* Listas editor — evitar desborde */
    .banca-wrap .listas-fecha-bar,
    .banca-wrap .listas-juego-bar {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .banca-wrap .listas-fecha-control,
    .banca-wrap .listas-juego-control {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Panel principal */
    .banca-wrap .ppb-shell {
        padding: 10px !important;
        border-radius: 16px !important;
    }

    .banca-wrap .ppb-hero {
        padding: 14px !important;
    }

    .banca-wrap .kpi-valor {
        font-size: 1.6rem !important;
        word-break: break-word;
    }

    .banca-wrap .enc-metric-value {
        font-size: 14px !important;
    }

    /* Toasts dentro de banca */
    .banca-wrap .toast-ok,
    .banca-wrap .toast-error {
        min-width: 0 !important;
        width: min(420px, calc(100vw - 24px)) !important;
        max-width: calc(100vw - 24px) !important;
        box-sizing: border-box;
    }
}

@media (max-width: 480px) {
    .banca-wrap .banca-tabs {
        grid-template-columns: 1fr !important;
    }

    .banca-wrap .bn-grid {
        grid-template-columns: repeat(4, minmax(48px, 1fr)) !important;
    }

    .banca-wrap .ganador-pro-tabs {
        grid-template-columns: 1fr !important;
    }

    .banca-wrap .ppb-title {
        font-size: 1.25rem !important;
    }
}

/* Pantallas grandes en móvil horizontal */
@media (max-width: 900px) and (orientation: landscape) {
    .banca-wrap .ppb-featured-grid,
    .banca-wrap .kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}