/* _content/SistemaLoteriaDashboard/Components/Banca/Ahorro.razor.rz.scp.css */
/* =========================
   AHORRO - PRO (AJUSTE FINAL)
   - Buscar + ID a la par
   - Selector debajo de Buscar (mismo ancho)
   - Letras +3pt
   - Labels +4pt
   - Chip y saldo más grandes
   ========================= */

.ap-panel[b-xquylebwm1] {
    padding: 18px;
    border-radius: 14px;
    background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
    border: 1px solid #dbe8fb;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.08);
}

/* ===== Grid: izquierda (buscar+select) | derecha (id) ===== */
.ap-busqueda[b-xquylebwm1] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 90px; /* ✅ ID más angosto */
    gap: 14px; /* ✅ antes 35px, muy grande */
    align-items: start;
    max-width: 100%;
}

@media (max-width: 980px) {
    .ap-busqueda[b-xquylebwm1] {
        grid-template-columns: 1fr;
    }
}

/* Columna base */
.ap-col[b-xquylebwm1] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}

    /* ===== Labels: +4 puntos ===== */
    .ap-col label[b-xquylebwm1] {
        font-size: 1.20rem; /* antes ~0.95rem */
        font-weight: 1000;
        color: #213b63;
        margin-bottom: -2px;
    }

/* label secundario "Vendedor" encima del select */
.ap-label-sub[b-xquylebwm1] {
    margin-top: 2px;
}

/* ===== Inputs: +3 puntos ===== */
.ap-input-sm[b-xquylebwm1] {
    height: 44px;
    padding: 0 12px;
    border-radius: 12px;
    border: 1px solid #cfe0f7;
    outline: none;
    background: #fff;
    font-weight: 900;
    font-size: 1.16rem;
    color: #14243a;
    /* ✅ sombra real */
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
    /* ✅ CLAVE para que el ancho sí obedezca */
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
}

    .ap-input-sm[b-xquylebwm1]::placeholder {
        color: #6a7a92;
        font-weight: 800;
    }

    .ap-input-sm:focus[b-xquylebwm1] {
        border-color: #1a5fb4;
        box-shadow: 0 0 0 4px rgba(26,95,180,.18);
    }

/* ===== Select: mismo tamaño que input y NO gigante ===== */
.ap-select[b-xquylebwm1] {
    appearance: none;
    background-image: linear-gradient(45deg, transparent 50%, #375e9a 50%), linear-gradient(135deg, #375e9a 50%, transparent 50%);
    background-position: calc(100% - 18px) 18px, calc(100% - 12px) 18px;
    background-size: 6px 6px, 6px 6px;
    background-repeat: no-repeat;
    padding-right: 34px;
}

/* Esto asegura que NO se estire por nada raro */
.ap-select-compact[b-xquylebwm1] {
    width: 100%; /* clave */
    max-width: 100%;
}

/* ID centrado */
.ap-input-id[b-xquylebwm1] {
    text-align: center;
}

/* ===== Chip vendedor seleccionado: más grande ===== */
.ap-seleccion[b-xquylebwm1] {
    margin: 14px 0 12px;
}

.ap-chip[b-xquylebwm1] {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 999px;
    border: 1px solid #b7f0ce;
    background: #ecfdf5;
    color: #065f46;
    font-weight: 1100;
    font-size: 1.12rem; /* más grande */
    max-width: 100%;
}

.ap-chip-warn[b-xquylebwm1] {
    border-color: #fdba74;
    background: #fff7ed;
    color: #9a3412;
}

.ap-dot[b-xquylebwm1] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #22c55e;
    box-shadow: 0 0 0 4px rgba(34,197,94,.15);
}

.ap-dot-warn[b-xquylebwm1] {
    background: #f97316;
    box-shadow: 0 0 0 4px rgba(249,115,22,.16);
}

.ap-sep[b-xquylebwm1] {
    opacity: .65;
}

/* ===== Botones ===== */
.ap-actions[b-xquylebwm1] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin: 12px 0 16px;
}

.ap-btn2[b-xquylebwm1] {
    height: 44px;
    padding: 0 16px;
    border-radius: 12px;
    font-weight: 1100;
    font-size: 1.12rem; /* +3pt */
    border: 1px solid transparent;
    cursor: pointer;
    transition: transform .12s ease, box-shadow .12s ease;
}

    .ap-btn2:disabled[b-xquylebwm1] {
        opacity: .55;
        cursor: not-allowed;
        transform: none;
        box-shadow: none;
    }

    .ap-btn2:hover[b-xquylebwm1] {
        transform: translateY(-1px);
    }

.ap-btn2-primary[b-xquylebwm1] {
    background: linear-gradient(180deg, #1a5fb4, #144a8f);
    color: #fff;
    box-shadow: 0 10px 22px rgba(20,74,143,.22);
}

.ap-btn2-ghost[b-xquylebwm1] {
    background: #fff;
    color: #144a8f;
    border-color: #cfe0f7;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

/* ===== Saldo: panel más grande ===== */
.ap-saldo-card[b-xquylebwm1] {
    margin-top: 12px;
    padding: 18px;
    border-radius: 14px;
    border: 1px solid #dbe8fb;
    background: linear-gradient(180deg, #ffffff 0%, #f2f8ff 100%);
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.10);
    max-width: 640px; /* más grande */
}

.ap-saldo-title[b-xquylebwm1] {
    font-weight: 1100;
    color: #153e75;
    font-size: 1.18rem; /* más grande */
    margin-bottom: 8px;
}

.ap-saldo-valor[b-xquylebwm1] {
    font-size: 2.15rem; /* más grande */
    font-weight: 1300;
    color: #0f2b4d;
}

.ap-saldo-sub[b-xquylebwm1] {
    margin-top: 8px;
    color: #52627a;
    font-weight: 1000;
    font-size: 1.10rem; /* +3pt */
}

/* ===== Modales (por si los usas aquí) ===== */
.ap-modal-backdrop[b-xquylebwm1] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    padding: 18px;
}

.ap-modal[b-xquylebwm1] {
    width: min(560px, 96vw);
    background: #fff;
    border-radius: 16px;
    padding: 16px;
    box-shadow: 0 18px 50px rgba(0,0,0,.28);
    border: 1px solid rgba(255,255,255,.35);
}

.ap-modal-title[b-xquylebwm1] {
    font-weight: 1200;
    font-size: 1.28rem;
    color: #153e75;
    margin-bottom: 8px;
}

.ap-modal-sub[b-xquylebwm1] {
    color: #1b2b45;
    font-weight: 1000;
    font-size: 1.12rem;
    margin-bottom: 12px;
}

.ap-modal-label[b-xquylebwm1] {
    font-weight: 1100;
    color: #304766;
    display: block;
    margin-bottom: 8px;
    font-size: 1.08rem;
}

.ap-modal-input[b-xquylebwm1] {
    height: 48px !important;
    font-size: 1.16rem !important;
    padding: 0 12px !important;
}

.ap-modal-actions[b-xquylebwm1] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

/* Toast */
.toast-ok[b-xquylebwm1], .toast-error[b-xquylebwm1] {
    position: fixed;
    right: 18px;
    bottom: 18px;
    padding: 12px 14px;
    border-radius: 12px;
    font-weight: 1100;
    font-size: 1.08rem;
    z-index: 10000;
    box-shadow: 0 14px 34px rgba(0,0,0,.18);
}

.toast-ok[b-xquylebwm1] {
    background: #ecfdf5;
    border: 1px solid #86efac;
    color: #065f46;
}

.toast-error[b-xquylebwm1] {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #7f1d1d;
}


/* =========================
   MODAL HISTÓRICO DE ABONOS (PRO)
   ========================= */

.ap-modal-hist[b-xquylebwm1] {
    width: min(940px, 96vw);
    max-height: min(78vh, 820px);
    overflow: hidden;
    border-radius: 18px;
    padding: 18px;
}

/* Subtítulo */
.ap-hist-sub[b-xquylebwm1] {
    margin-top: 6px;
    margin-bottom: 14px;
    font-size: 1.10rem;
    font-weight: 1000;
}

/* Marco con scroll para el contenido */
.ap-hist-wrap[b-xquylebwm1] {
    border: 1px solid #dbe8fb;
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f6fbff 100%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
    padding: 10px;
    max-height: calc(78vh - 190px);
    overflow: auto;
}

/* Tabla estilo tarjeta */
.ap-table[b-xquylebwm1] {
    border: 0;
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}

/* Cabecera tabla más grande y bonita */
.ap-table-head[b-xquylebwm1] {
    display: grid;
    grid-template-columns: 1.4fr 1fr .6fr;
    gap: 10px;
    padding: 14px 14px;
    background: linear-gradient(180deg, #eef6ff 0%, #ffffff 100%);
    color: #153e75;
    font-weight: 1200;
    font-size: 1.12rem;
    border-bottom: 1px solid #dbe8fb;
}

/* Filas más grandes */
.ap-table-row[b-xquylebwm1] {
    display: grid;
    grid-template-columns: 1.4fr 1fr .6fr;
    gap: 10px;
    padding: 14px 14px;
    border-top: 1px solid #eef2f7;
    font-weight: 1000;
    font-size: 1.10rem;
    color: #1b2b45;
}

    .ap-table-row:nth-child(even)[b-xquylebwm1] {
        background: #fbfdff;
    }

/* Columna monto destacada */
.ap-hist-monto[b-xquylebwm1] {
    font-weight: 1300;
    color: #0f2b4d;
}

/* Etiqueta tipo “pill” para el tipo (si tienes Tipo=Abono) */
.ap-pill[b-xquylebwm1] {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: .95rem;
    font-weight: 1200;
    border: 1px solid #cfe0f7;
    background: #f4f9ff;
    color: #144a8f;
}

/* Estado vacío */
.ap-table-empty[b-xquylebwm1] {
    padding: 18px;
    color: #52627a;
    font-weight: 1100;
    font-size: 1.10rem;
}

/* Scroll bonito (Chrome/Edge) */
.ap-hist-wrap[b-xquylebwm1]::-webkit-scrollbar {
    width: 10px;
}

.ap-hist-wrap[b-xquylebwm1]::-webkit-scrollbar-track {
    background: #f1f6ff;
    border-radius: 999px;
}

.ap-hist-wrap[b-xquylebwm1]::-webkit-scrollbar-thumb {
    background: #cfe0f7;
    border-radius: 999px;
}

    .ap-hist-wrap[b-xquylebwm1]::-webkit-scrollbar-thumb:hover {
        background: #b6d4fb;
    }

/* ===== Encabezado moderno del historial ===== */
.ap-hist-head[b-xquylebwm1] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 10px 0 14px;
    flex-wrap: wrap;
}

.ap-hist-label[b-xquylebwm1] {
    font-weight: 1200;
    font-size: 1.12rem;
    color: #153e75;
    letter-spacing: .2px;
}

.ap-hist-chip[b-xquylebwm1] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 999px;
    background: linear-gradient(180deg, #eef6ff 0%, #ffffff 100%);
    border: 1px solid #cfe0f7;
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.08);
    font-weight: 1200;
    font-size: 1.14rem;
    color: #0f2b4d;
}

.ap-hist-chip-id[b-xquylebwm1] {
    padding: 6px 10px;
    border-radius: 999px;
    background: #ecfdf5;
    border: 1px solid #b7f0ce;
    color: #065f46;
    font-weight: 1200;
    font-size: 1.04rem;
}
/* ===== Layout 3 columnas (Ahorros) ===== */

/* Column wrappers */
.ap-left[b-xquylebwm1], .ap-center[b-xquylebwm1], .ap-right[b-xquylebwm1] {
    min-width: 0;
}

/* Búsqueda “compacta” dentro del layout */
.ap-busqueda-single[b-xquylebwm1] {
    margin: 0;
}

/* Slot para el aviso naranja debajo de búsqueda */
.ap-warn-slot[b-xquylebwm1] {
    margin-top: 14px;
}

/* Centro: tarjeta que contiene panel verde + botones */
.ap-center-card[b-xquylebwm1] {
    padding: 12px;
    border-radius: 16px;
    border: 1px solid #dbe8fb;
    background: linear-gradient(180deg, #ffffff 0%, #f6fbff 100%);
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.10);
}

/* Acciones centradas */
.ap-actions-center[b-xquylebwm1] {
    justify-content: center;
}

/* Panel verde seleccionado MÁS grande */
.ap-chip-selected[b-xquylebwm1] {
    border: 1px solid #b7f0ce;
    background: #ecfdf5;
    color: #065f46;
}

.ap-chip-selected-xl[b-xquylebwm1] {
    padding: 8px 10px;
    border-radius: 999px;
    font-weight: 1400;
    font-size: 1.22rem;
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    width: fit-content; /* ✅ no ocupa todo el ancho */
    max-width: 100%;
}

    .ap-chip-selected-xl b[b-xquylebwm1] {
        font-size: 1.32rem;
    }

/* Saldo a la derecha con tamaño grande (si ya existe, esto lo refuerza) */
.ap-saldo-card-right[b-xquylebwm1] {
    max-width: 100%;
}

.ap-saldo-title-lg[b-xquylebwm1] {
    font-size: 1.22rem;
}

.ap-saldo-valor-lg[b-xquylebwm1] {
    font-size: 2.25rem;
    font-weight: 1400;
}

/* ===== Layout 3 columnas (Ahorros) ===== */
.ap-layout[b-xquylebwm1] {
    display: grid;
    grid-template-columns: minmax(320px, 380px) minmax(320px, 1fr) minmax(260px, 320px);
    gap: 18px;
    align-items: start;
}

@media (max-width: 1100px) {
    .ap-layout[b-xquylebwm1] {
        grid-template-columns: 1fr;
    }
}

.ap-left[b-xquylebwm1], .ap-center[b-xquylebwm1], .ap-right[b-xquylebwm1] {
    min-width: 0;
}

/* Evita que el panel del centro se monte encima */
.ap-center-card[b-xquylebwm1] {
    overflow: hidden;
}

/* El chip verde debe romper línea y no salirse */
.ap-chip-wrap[b-xquylebwm1] {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* Saldo SIEMPRE visible, pero “apagado” si no hay vendedor */
.ap-saldo-disabled[b-xquylebwm1] {
    opacity: .65;
}

/* Ajustes de títulos/valor más grandes */
.ap-saldo-title-lg[b-xquylebwm1] {
    font-size: 1.22rem;
}

.ap-saldo-valor-lg[b-xquylebwm1] {
    font-size: 2.25rem;
    font-weight: 1400;
}

/* Botón de resumen */
.ap-left-actions[b-xquylebwm1] {
    margin-top: 14px;
    display: flex;
}

.ap-btn2-wide[b-xquylebwm1] {
    width: 100%;
    justify-content: center;
}

/* Modal resumen grande */
.ap-modal-resumen[b-xquylebwm1] {
    width: min(980px, 96vw);
    max-height: min(82vh, 900px);
    overflow: hidden;
    border-radius: 18px;
    padding: 18px;
}

/* Tabla resumen columnas */
.ap-resumen-head[b-xquylebwm1],
.ap-resumen-row[b-xquylebwm1] {
    grid-template-columns: 90px 1fr 180px;
}

.ap-resumen-monto[b-xquylebwm1] {
    text-align: right;
}

/* Total al fondo */
.ap-resumen-total[b-xquylebwm1] {
    margin-top: 14px;
    padding: 14px 16px;
    border-radius: 14px;
    border: 1px solid #dbe8fb;
    background: linear-gradient(180deg, #ffffff 0%, #f2f8ff 100%);
    display: flex;
    align-items: center;
    justify-content: flex-start; /* 🔥 ya no se separan */
    gap: 10px; /* 🔥 espacio corto entre texto y monto */
    font-weight: 1200;
    font-size: 1.18rem;
    color: #0f2b4d;
}

/* Resumen de ahorros: 5 columnas */
.ap-resumen-head[b-xquylebwm1],
.ap-resumen-row[b-xquylebwm1] {
    display: grid;
    grid-template-columns: 90px 1.4fr 180px 180px 220px;
    gap: 12px;
    align-items: center;
}

.ap-resumen-monto[b-xquylebwm1] {
    text-align: right;
}

.ap-btn2-xs[b-xquylebwm1] {
    padding: 6px 10px;
    font-size: 12px;
    border-radius: 10px;
    line-height: 1;
}

@media (max-width: 700px) {
    /* =========================
       AHORRO - SOLO MÓVIL
       No toca escritorio
       ========================= */

    .ap-panel[b-xquylebwm1] {
        padding: 12px;
        border-radius: 12px;
    }

    .ap-layout[b-xquylebwm1] {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .ap-left[b-xquylebwm1],
    .ap-center[b-xquylebwm1],
    .ap-right[b-xquylebwm1] {
        width: 100%;
        min-width: 0;
    }

    /* ===== Búsqueda ===== */
    .ap-busqueda[b-xquylebwm1] {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .ap-col[b-xquylebwm1] {
        gap: 8px;
    }

        .ap-col label[b-xquylebwm1] {
            font-size: 1rem;
            margin-bottom: 0;
            line-height: 1.2;
        }

    .ap-label-sub[b-xquylebwm1] {
        margin-top: 0;
    }

    .ap-input-sm[b-xquylebwm1],
    .ap-input[b-xquylebwm1],
    .ap-select[b-xquylebwm1],
    .ap-modal-input[b-xquylebwm1] {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
        font-size: 16px !important; /* evita zoom en iPhone */
    }

    .ap-input-sm[b-xquylebwm1] {
        height: 46px;
        padding: 0 12px;
        border-radius: 12px;
    }

    .ap-input-id[b-xquylebwm1] {
        text-align: left;
    }

    .ap-col-id[b-xquylebwm1] {
        width: 100%;
    }

    /* ===== Acciones izquierda ===== */
    .ap-left-actions[b-xquylebwm1] {
        margin-top: 12px;
        display: flex;
        width: 100%;
    }

    .ap-btn2-wide[b-xquylebwm1] {
        width: 100%;
    }

    /* ===== Centro ===== */
    .ap-center-card[b-xquylebwm1] {
        padding: 12px;
        border-radius: 14px;
    }

    .ap-chip[b-xquylebwm1] {
        width: 100%;
        max-width: 100%;
        border-radius: 16px;
        padding: 12px;
        gap: 10px;
        font-size: 1rem;
        white-space: normal;
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .ap-chip-selected-xl[b-xquylebwm1] {
        width: 100%;
        border-radius: 16px;
        padding: 12px;
        font-size: 1rem;
        gap: 8px;
    }

        .ap-chip-selected-xl b[b-xquylebwm1] {
            font-size: 1.05rem;
        }

    .ap-chip-wrap[b-xquylebwm1] {
        width: 100%;
        max-width: 100%;
        white-space: normal;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .ap-actions[b-xquylebwm1],
    .ap-actions-center[b-xquylebwm1] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        margin: 12px 0 0;
    }

    .ap-btn2[b-xquylebwm1] {
        width: 100%;
        min-height: 46px;
        height: auto;
        padding: 10px 14px;
        font-size: 1rem;
        border-radius: 12px;
    }

    /* ===== Saldo ===== */
    .ap-saldo-card[b-xquylebwm1],
    .ap-saldo-card-right[b-xquylebwm1] {
        margin-top: 0;
        max-width: 100%;
        padding: 14px;
        border-radius: 14px;
    }

    .ap-saldo-title[b-xquylebwm1],
    .ap-saldo-title-lg[b-xquylebwm1] {
        font-size: 1.02rem;
        line-height: 1.2;
        margin-bottom: 6px;
    }

    .ap-saldo-valor[b-xquylebwm1],
    .ap-saldo-valor-lg[b-xquylebwm1] {
        font-size: 1.75rem;
        line-height: 1.15;
        word-break: break-word;
    }

    .ap-saldo-sub[b-xquylebwm1] {
        font-size: 0.96rem;
        line-height: 1.3;
    }

    .ap-warn-slot[b-xquylebwm1] {
        margin-top: 12px;
    }

    /* ===== Modales ===== */
    .ap-modal-backdrop[b-xquylebwm1] {
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,45);
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 10px;
        overflow: hidden;
        overscroll-behavior: contain;
        touch-action: none;
        -webkit-overflow-scrolling: auto;
    }

    .ap-modal[b-xquylebwm1],
    .ap-modal-hist[b-xquylebwm1],
    .ap-modal-resumen[b-xquylebwm1],
    .ap-modal-confirm[b-xquylebwm1] {
        width: 100%;
        max-width: 100%;
        max-height: 90svh;
        border-radius: 14px;
        padding: 14px;
        overflow: hidden;
        box-sizing: border-box;
        touch-action: auto;
        overscroll-behavior: contain;
    }

    .ap-modal-title[b-xquylebwm1] {
        font-size: 1.08rem;
        line-height: 1.25;
        margin-bottom: 8px;
    }

    .ap-modal-sub[b-xquylebwm1] {
        font-size: 0.96rem;
        line-height: 1.35;
        margin-bottom: 10px;
        word-break: break-word;
    }

    .ap-modal-label[b-xquylebwm1] {
        font-size: 0.96rem;
        margin-bottom: 6px;
    }

    .ap-modal-body[b-xquylebwm1] {
        max-height: calc(90svh - 220px);
        overflow: auto;
        padding-right: 2px;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-y;
    }

    .ap-hint[b-xquylebwm1] {
        margin-top: 8px;
        font-size: 0.92rem;
        line-height: 1.3;
    }

    .ap-modal-actions[b-xquylebwm1] {
        display: flex;
        flex-direction: column;
        gap: 8px;
        margin-top: 12px;
    }

        .ap-modal-actions .ap-btn2[b-xquylebwm1] {
            width: 100%;
        }

    /* ===== Historial ===== */
    .ap-hist-head[b-xquylebwm1] {
        align-items: stretch;
        gap: 8px;
        margin: 8px 0 12px;
    }

    .ap-hist-label[b-xquylebwm1] {
        font-size: 1rem;
    }

    .ap-hist-chip[b-xquylebwm1] {
        width: 100%;
        max-width: 100%;
        border-radius: 14px;
        padding: 10px 12px;
        font-size: 0.98rem;
        line-height: 1.25;
        white-space: normal;
        flex-wrap: wrap;
    }

    .ap-hist-chip-id[b-xquylebwm1] {
        font-size: 0.92rem;
    }

    .ap-hist-wrap[b-xquylebwm1] {
        max-height: calc(90svh - 230px);
        padding: 8px;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-x pan-y;
    }

    .ap-table[b-xquylebwm1] {
        min-width: 0;
        box-shadow: none;
        background: transparent;
    }

    .ap-table-head[b-xquylebwm1],
    .ap-table-row[b-xquylebwm1] {
        min-width: 620px;
        grid-template-columns: 170px 120px 110px 120px;
        gap: 8px;
        padding: 12px;
        font-size: 0.95rem;
        align-items: center;
    }

    .ap-table-head[b-xquylebwm1] {
        font-size: 0.96rem;
    }

    .ap-table-empty[b-xquylebwm1] {
        padding: 14px;
        font-size: 0.95rem;
    }

    .ap-pill[b-xquylebwm1] {
        font-size: 0.88rem;
        padding: 6px 8px;
    }

    .ap-btn2-xs[b-xquylebwm1] {
        width: auto;
        min-height: 36px;
        padding: 8px 10px;
        font-size: 0.9rem;
        border-radius: 10px;
    }

    /* ===== Resumen de ahorros ===== */
    .ap-resumen-wrap[b-xquylebwm1] {
        max-height: calc(90svh - 250px);
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-x pan-y;
    }

    .ap-resumen-head[b-xquylebwm1],
    .ap-resumen-row[b-xquylebwm1] {
        min-width: 860px;
        grid-template-columns: 80px 180px 140px 160px 220px;
        gap: 10px;
        padding: 12px;
        font-size: 0.94rem;
        align-items: center;
    }

    .ap-resumen-monto[b-xquylebwm1] {
        text-align: right;
    }

    .ap-resumen-total[b-xquylebwm1] {
        margin-top: 12px;
        padding: 12px 14px;
        border-radius: 12px;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        font-size: 1rem;
    }

    /* ===== Toast ===== */
    .toast-ok[b-xquylebwm1],
    .toast-error[b-xquylebwm1] {
        right: 10px;
        left: 10px;
        bottom: 10px;
        width: auto;
        max-width: none;
        font-size: 0.96rem;
        padding: 12px 14px;
        line-height: 1.3;
    }

    .ap-table-head-5[b-xquylebwm1],
    .ap-table-row-5[b-xquylebwm1] {
        grid-template-columns: 1.3fr 1fr .8fr 1fr .8fr !important;
    }

    .ap-pill-ok[b-xquylebwm1] {
        background: #ecfdf5;
        border-color: #86efac;
        color: #065f46;
    }

    .ap-pill-no[b-xquylebwm1] {
        background: #fff7ed;
        border-color: #fdba74;
        color: #9a3412;
    }

    .ap-check[b-xquylebwm1] {
        display: flex;
        align-items: center;
        gap: 10px;
        font-weight: 1100;
        color: #153e75;
        font-size: 1.05rem;
    }
}

.ap-modal-header[b-xquylebwm1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.ap-modal-close[b-xquylebwm1] {
    width: 38px;
    height: 38px;
    border: none;
    border-radius: 10px;
    background: #eef5ff;
    color: #144a8f;
    font-size: 1.1rem;
    font-weight: 1200;
    cursor: pointer;
    transition: .15s ease;
}

    .ap-modal-close:hover[b-xquylebwm1] {
        background: #dbeafe;
        transform: scale(1.04);
    }


.ap-modal-hist[b-xquylebwm1] {
    width: min(1180px, 98vw) !important;
}

.ap-hist-wrap[b-xquylebwm1] {
    overflow-x: auto !important;
}

.ap-table[b-xquylebwm1] {
    min-width: 980px !important;
}

.ap-table-head-5[b-xquylebwm1],
.ap-table-row-5[b-xquylebwm1] {
    display: grid !important;
    grid-template-columns: 210px 150px 120px 170px 190px !important;
    gap: 10px !important;
    align-items: center !important;
}

.ap-row-actions[b-xquylebwm1] {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
}

.ap-btn2-danger[b-xquylebwm1] {
    background: #fee2e2 !important;
    color: #991b1b !important;
    border-color: #fecaca !important;
}

    .ap-btn2-danger:hover[b-xquylebwm1] {
        background: #fecaca !important;
    }

.ap-modal-resumen[b-xquylebwm1] {
    width: min(1180px, 98vw) !important;
    max-width: 1180px !important;
}

.ap-resumen-wrap[b-xquylebwm1] {
    overflow-x: auto !important;
}

.ap-resumen-table[b-xquylebwm1] {
    min-width: 1080px !important;
}

.ap-resumen-head[b-xquylebwm1],
.ap-resumen-row[b-xquylebwm1] {
    grid-template-columns: 80px 1.4fr 160px 170px 220px 160px !important;
    min-width: 1080px !important;
    align-items: center !important;
}

.ap-resumen-totales[b-xquylebwm1] {
    display: grid;
    grid-template-columns: repeat(3, minmax(220px, 1fr));
    gap: 12px;
    margin: 14px 0;
}

.ap-resumen-totalbox[b-xquylebwm1] {
    padding: 14px 16px;
    border-radius: 14px;
    border: 1px solid #dbe8fb;
    background: linear-gradient(180deg, #ffffff 0%, #f2f8ff 100%);
    display: flex;
    flex-direction: column;
    gap: 4px;
}

    .ap-resumen-totalbox span[b-xquylebwm1] {
        font-weight: 1100;
        color: #153e75;
        font-size: 0.98rem;
    }

    .ap-resumen-totalbox b[b-xquylebwm1] {
        font-weight: 1400;
        color: #0f2b4d;
        font-size: 1.35rem;
    }

@media (max-width: 700px) {
    .ap-resumen-totales[b-xquylebwm1] {
        grid-template-columns: 1fr;
    }
}

.ap-totales-pro[b-xquylebwm1] {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(190px, 1fr)) !important;
    gap: 10px !important;
    margin: 14px 0 10px !important;
}

.ap-totales-pro-hist[b-xquylebwm1] {
    grid-template-columns: repeat(auto-fit, minmax(168px, 1fr)) !important;
}

.ap-total-pro-saldo[b-xquylebwm1] {
    border-color: #86efac !important;
    background: linear-gradient(180deg, #ffffff 0%, #ecfdf5 100%) !important;
}

.ap-total-pro-saldo b[b-xquylebwm1] {
    color: #166534 !important;
}

.ap-total-pro-warn[b-xquylebwm1] {
    border-color: #fdba74 !important;
    background: linear-gradient(180deg, #ffffff 0%, #fff7ed 100%) !important;
}

.ap-hist-sin-acciones[b-xquylebwm1] {
    color: #94a3b8;
    font-weight: 800;
}

.ap-total-pro[b-xquylebwm1] {
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
    border: 1px solid #dbe8fb !important;
    border-radius: 14px !important;
    padding: 10px 12px !important;
    min-height: 62px !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 3px !important;
}

    .ap-total-pro span[b-xquylebwm1] {
        font-size: .82rem !important;
        font-weight: 1100 !important;
        color: #475569 !important;
        line-height: 1.15 !important;
    }

    .ap-total-pro b[b-xquylebwm1] {
        font-size: 1.18rem !important;
        font-weight: 1400 !important;
        color: #0f172a !important;
        line-height: 1.1 !important;
    }

.ap-total-pro-ok[b-xquylebwm1] {
    border-color: #bbf7d0 !important;
    background: linear-gradient(180deg, #ffffff 0%, #f0fdf4 100%) !important;
}

.ap-total-pro-no[b-xquylebwm1] {
    border-color: #fed7aa !important;
    background: linear-gradient(180deg, #ffffff 0%, #fff7ed 100%) !important;
}

@media (max-width: 700px) {
    .ap-totales-pro[b-xquylebwm1] {
        grid-template-columns: 1fr !important;
    }

    .ap-total-pro[b-xquylebwm1] {
        min-height: 58px !important;
        padding: 9px 10px !important;
    }

        .ap-total-pro span[b-xquylebwm1] {
            font-size: .78rem !important;
        }

        .ap-total-pro b[b-xquylebwm1] {
            font-size: 1rem !important;
        }
}
/* _content/SistemaLoteriaDashboard/Components/Banca/AsignarGanadorTab.razor.rz.scp.css */


/* =========================================================
   REDISEÑO PRO - ASIGNAR GANADORES
========================================================= */

.ganador-pro-wrap[b-ugsukpn7u5] {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    padding: 16px !important;
}

.ganador-pro-header[b-ugsukpn7u5] {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 16px;
    flex-wrap: wrap;
    padding: 18px;
    border-radius: 20px;
    background: linear-gradient(135deg, #0b1220, #123a72 55%, #0d47a1);
    color: #fff;
    box-shadow: 0 18px 38px rgba(15,23,42,.18);
}

.ganador-pro-title[b-ugsukpn7u5] {
    font-size: 1.6rem;
    font-weight: 1000;
}

.ganador-pro-sub[b-ugsukpn7u5] {
    margin-top: 4px;
    font-size: .96rem;
    font-weight: 850;
    opacity: .82;
}

.ganador-pro-date[b-ugsukpn7u5] {
    display: grid;
    gap: 6px;
    min-width: 210px;
}

    .ganador-pro-date label[b-ugsukpn7u5] {
        font-size: .88rem;
        font-weight: 950;
        color: rgba(255,255,255,.88);
    }

.ganador-pro-tabs[b-ugsukpn7u5] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    padding: 10px;
    border-radius: 18px;
    background: rgba(255,255,255,.85);
    border: 1px solid #dbe7ff;
    box-shadow: 0 12px 24px rgba(15,23,42,.06);
}

.ganador-pro-tab[b-ugsukpn7u5] {
    border: 0;
    border-radius: 14px;
    padding: 11px 18px;
    font-weight: 1000;
    cursor: pointer;
    color: #0d47a1;
    background: #eef5ff;
    transition: .14s ease;
}

    .ganador-pro-tab.active[b-ugsukpn7u5] {
        color: #fff;
        background: linear-gradient(135deg, #0d47a1, #1e88e5);
        box-shadow: 0 14px 26px rgba(30,136,229,.22);
    }

.ganador-pro-tab-historial[b-ugsukpn7u5] {
    margin-left: 4px;
    color: #0d47a1;
    background: #fff;
    border: 1px solid #cfe0ff;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .06);
}

.ganador-pro-tab-historial:hover[b-ugsukpn7u5] {
    background: #eef5ff;
    border-color: #93c5fd;
}

.ganador-pro-summary[b-ugsukpn7u5] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.ganador-pro-chip[b-ugsukpn7u5] {
    min-width: 150px;
    padding: 12px 14px;
    border-radius: 18px;
    background: #fff;
    border: 1px solid #dbe7ff;
    box-shadow: 0 10px 20px rgba(15,23,42,.06);
}

    .ganador-pro-chip span[b-ugsukpn7u5] {
        display: block;
        font-size: .82rem;
        color: #64748b;
        font-weight: 950;
    }

    .ganador-pro-chip strong[b-ugsukpn7u5] {
        display: block;
        margin-top: 3px;
        font-size: 1.25rem;
        color: #0f172a;
        font-weight: 1000;
    }

    .ganador-pro-chip.pending strong[b-ugsukpn7u5] {
        color: #b45309;
    }

    .ganador-pro-chip.assigned strong[b-ugsukpn7u5] {
        color: #15803d;
    }

.ganador-pro-board[b-ugsukpn7u5] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 16px;
}

.ganador-pro-column[b-ugsukpn7u5] {
    background: #fff;
    border: 1px solid #dbe7ff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 14px 28px rgba(15,23,42,.07);
}

.ganador-pro-column-head[b-ugsukpn7u5] {
    padding: 15px 16px;
    border-bottom: 1px solid #e6efff;
    background: linear-gradient(180deg, #f8fbff, #ffffff);
}

    .ganador-pro-column-head h3[b-ugsukpn7u5] {
        margin: 0;
        font-size: 1.12rem;
        font-weight: 1000;
        color: #0b2a55;
    }

    .ganador-pro-column-head p[b-ugsukpn7u5] {
        margin: 3px 0 0;
        font-size: .88rem;
        font-weight: 800;
        color: #64748b;
    }


.ganador-pro-empty[b-ugsukpn7u5] {
    padding: 18px;
    text-align: center;
    border-radius: 16px;
    background: #f8fafc;
    border: 1px dashed #cbd5e1;
    color: #64748b;
    font-weight: 900;
}

.ganador-pro-editor[b-ugsukpn7u5] {
    padding: 16px;
    border-radius: 22px;
    background: #ffffff;
    border: 1px solid #dbe7ff;
    box-shadow: 0 18px 34px rgba(15,23,42,.10);
}

.ganador-pro-editor-head[b-ugsukpn7u5] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    padding-bottom: 12px;
    margin-bottom: 12px;
    border-bottom: 1px solid #e6efff;
}

.ganador-pro-editor-title[b-ugsukpn7u5] {
    font-size: 1.18rem;
    font-weight: 1000;
    color: #0b2a55;
}

.ganador-pro-editor-sub[b-ugsukpn7u5] {
    margin-top: 3px;
    color: #64748b;
    font-weight: 850;
}

.ganador-pro-editor-close[b-ugsukpn7u5] {
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 12px;
    cursor: pointer;
    font-size: 1.35rem;
    font-weight: 1000;
    color: #991b1b;
    background: #fee2e2;
}

.ganador-pro-input-center[b-ugsukpn7u5] {
    text-align: center;
    font-size: 1.25rem !important;
    font-weight: 1000 !important;
}

.ganador-pro-note[b-ugsukpn7u5] {
    margin-top: 6px;
    color: #64748b;
    font-size: .86rem;
    font-weight: 850;
}

.ganador-pro-date-inline[b-ugsukpn7u5]  .sl-date-wrap.sl-date-field-compact {
    width: 100%;
}

.ganador-pro-date-inline[b-ugsukpn7u5]  .sl-date-wrap input.sl-date-input.cg-date-input {
    min-height: 38px;
    height: 38px;
    font-weight: 950;
}

.historial-filtros[b-ugsukpn7u5]  .sl-date-wrap.sl-date-field-compact {
    flex: 1;
    min-width: 0;
}

.historial-filtros[b-ugsukpn7u5]  .sl-date-wrap input.sl-date-input.cg-date-input {
    min-height: 46px;
    height: 46px;
    font-weight: 950;
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 900px) {
    .ganador-pro-board[b-ugsukpn7u5] {
        grid-template-columns: 1fr;
    }

    .ganador-pro-header[b-ugsukpn7u5] {
        align-items: stretch;
    }

    .ganador-pro-date[b-ugsukpn7u5] {
        width: 100%;
    }

    .ganador-pro-tabs[b-ugsukpn7u5] {
        display: grid;
        grid-template-columns: 1fr;
    }

    .ganador-pro-summary[b-ugsukpn7u5] {
        display: grid;
        grid-template-columns: 1fr;
    }


}


/* =========================================================
   AJUSTE FINAL PRO - GANADORES
   Selectores proporcionales + modal + historial + mensajes
========================================================= */

/* Selectores no gigantes */
.ganador-pro-board-selectores[b-ugsukpn7u5] {
    grid-template-columns: repeat(2, minmax(280px, 460px)) !important;
    justify-content: center !important;
    align-items: start !important;
}

.ganador-pro-column[b-ugsukpn7u5] {
    width: 100% !important;
    max-width: 460px !important;
    margin: 0 auto !important;
}

/* Caja del selector más premium */
.ganador-pro-selector-box[b-ugsukpn7u5] {
    padding: 18px !important;
    display: grid !important;
    gap: 14px !important;
}

    .ganador-pro-selector-box .form-row label[b-ugsukpn7u5] {
        font-size: .88rem !important;
        font-weight: 1000 !important;
        color: #0b2a55 !important;
    }

    /* Select premium */
    .ganador-pro-selector-box select.input[b-ugsukpn7u5],
    .ganador-pro-date .input[b-ugsukpn7u5],
    .historial-filtros select.input[b-ugsukpn7u5] {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 46px !important;
        height: 46px !important;
        border-radius: 15px !important;
        border: 1px solid rgba(37,99,235,.25) !important;
        background: linear-gradient(180deg, #ffffff 0%, #f5f9ff 100%) !important;
        color: #0f172a !important;
        font-size: 15px !important;
        font-weight: 950 !important;
        padding: 0 42px 0 14px !important;
        box-shadow: 0 12px 22px rgba(15,23,42,.06) !important;
        outline: none !important;
        appearance: none !important;
        -webkit-appearance: none !important;
        background-image: linear-gradient(45deg, transparent 50%, #0d47a1 50%), linear-gradient(135deg, #0d47a1 50%, transparent 50%), linear-gradient(180deg, #ffffff 0%, #f5f9ff 100%) !important;
        background-position: calc(100% - 20px) 20px, calc(100% - 14px) 20px, 0 0 !important;
        background-size: 6px 6px, 6px 6px, 100% 100% !important;
        background-repeat: no-repeat !important;
    }

        .ganador-pro-selector-box select.input:focus[b-ugsukpn7u5],
        .ganador-pro-date .input:focus[b-ugsukpn7u5],
        .historial-filtros select.input:focus[b-ugsukpn7u5] {
            border-color: #1e88e5 !important;
            box-shadow: 0 0 0 4px rgba(30,136,229,.15), 0 16px 28px rgba(30,136,229,.12) !important;
        }

/* Vista previa compacta y elegante */
.ganador-pro-preview[b-ugsukpn7u5] {
    padding: 13px 14px !important;
    border-radius: 17px !important;
}

.ganador-pro-preview-name[b-ugsukpn7u5] {
    font-size: 1.02rem !important;
    line-height: 1.25 !important;
}

.ganador-pro-main-btn[b-ugsukpn7u5] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: auto;
    min-width: 180px;
    max-width: 100%;
    min-height: 48px;
    padding: 12px 22px;
    border: 0;
    border-radius: 15px;
    cursor: pointer;
    font-size: 1rem;
    font-weight: 1000;
    font-family: inherit;
    color: #fff;
    background: linear-gradient(135deg, #0d47a1, #1e88e5);
    box-shadow: 0 14px 28px rgba(30, 136, 229, .22);
    transition: transform .12s ease, box-shadow .12s ease, opacity .12s ease;
}

.ganador-pro-main-btn:hover:not(:disabled)[b-ugsukpn7u5] {
    transform: translateY(-1px);
    box-shadow: 0 18px 34px rgba(30, 136, 229, .28);
}

.ganador-pro-main-btn:disabled[b-ugsukpn7u5] {
    opacity: .55;
    cursor: not-allowed;
    box-shadow: none;
}

.ganador-pro-main-btn.soft[b-ugsukpn7u5] {
    color: #0d47a1;
    background: linear-gradient(180deg, #ffffff, #eef5ff);
    border: 1px solid #cfe0ff;
    box-shadow: 0 10px 20px rgba(15, 23, 42, .06);
}

.ganador-pro-main-btn.danger[b-ugsukpn7u5] {
    color: #fff;
    background: linear-gradient(135deg, #b91c1c, #ef4444);
    box-shadow: 0 14px 28px rgba(239, 68, 68, .22);
}

.ganador-pro-preview-result-hero[b-ugsukpn7u5] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 8px;
    padding: 12px 14px;
    border-radius: 14px;
    background: linear-gradient(180deg, #f0fdf4, #ecfdf5);
    border: 1px solid #bbf7d0;
}

.ganador-pro-result-kicker[b-ugsukpn7u5] {
    font-size: .78rem;
    font-weight: 1000;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #166534;
}

.ganador-pro-result-value[b-ugsukpn7u5] {
    font-size: 1.55rem;
    font-weight: 1000;
    letter-spacing: 2px;
    color: #14532d;
    line-height: 1.1;
}

.ganador-pro-preview-label[b-ugsukpn7u5] {
    font-size: .76rem;
    font-weight: 1000;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #64748b;
}

.ganador-pro-preview.pending[b-ugsukpn7u5] {
    background: linear-gradient(180deg, #fffbeb, #fff7ed);
    border: 1px solid #fed7aa;
}

.ganador-pro-preview.assigned[b-ugsukpn7u5] {
    background: linear-gradient(180deg, #f0fdf4, #ecfdf5);
    border: 1px solid #bbf7d0;
}

/* Modal asignar / editar más profesional */
.ganador-pro-modal-backdrop[b-ugsukpn7u5] {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2600 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 18px !important;
    background: rgba(15,23,42,.58) !important;
    backdrop-filter: blur(6px) !important;
}

.ganador-pro-modal[b-ugsukpn7u5] {
    width: min(520px, 94vw) !important;
    max-height: 90vh !important;
    overflow: hidden !important;
    border-radius: 26px !important;
    background: #ffffff !important;
    box-shadow: 0 34px 90px rgba(15,23,42,.38) !important;
}

    .ganador-pro-modal .ganador-pro-editor[b-ugsukpn7u5] {
        margin: 0 !important;
        border: none !important;
        border-radius: 26px !important;
        box-shadow: none !important;
        padding: 18px !important;
    }

    .ganador-pro-modal .ganador-pro-editor-head[b-ugsukpn7u5] {
        margin: -18px -18px 18px -18px !important;
        padding: 18px !important;
        border-radius: 26px 26px 0 0 !important;
        background: linear-gradient(135deg, #0b1220, #0d47a1 65%, #1e88e5) !important;
        border: none !important;
    }

    .ganador-pro-modal .ganador-pro-editor-title[b-ugsukpn7u5] {
        color: #ffffff !important;
        font-size: 1.2rem !important;
        font-weight: 1000 !important;
    }

    .ganador-pro-modal .ganador-pro-editor-sub[b-ugsukpn7u5] {
        color: rgba(255,255,255,.82) !important;
    }

    .ganador-pro-modal .ganador-pro-editor-close[b-ugsukpn7u5] {
        background: rgba(255,255,255,.16) !important;
        color: #ffffff !important;
    }

    .ganador-pro-modal .form-row label[b-ugsukpn7u5] {
        font-weight: 1000 !important;
        color: #0b2a55 !important;
    }

    .ganador-pro-modal .input[b-ugsukpn7u5] {
        min-height: 48px !important;
        border-radius: 15px !important;
        border: 1px solid rgba(37,99,235,.25) !important;
        background: #f8fbff !important;
        color: #0f172a !important;
        font-size: 16px !important;
        font-weight: 950 !important;
    }

.ganador-pro-input-center[b-ugsukpn7u5] {
    font-size: 1.45rem !important;
    letter-spacing: 4px !important;
}

.ganador-pro-modal .form-actions[b-ugsukpn7u5] {
    margin-top: 18px !important;
}

.ganador-pro-modal .ganador-pro-modal-actions[b-ugsukpn7u5] {
    display: flex;
    gap: 10px;
}

.ganador-pro-modal .ganador-pro-modal-actions .ganador-pro-main-btn[b-ugsukpn7u5] {
    width: auto !important;
    flex: 1;
}

.ganador-pro-modal .ganador-pro-main-btn[b-ugsukpn7u5] {
    width: 100% !important;
}

/* Mensajes bonitos */
.ganador-msg-backdrop[b-ugsukpn7u5] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    background: rgba(15,23,42,.55);
    backdrop-filter: blur(6px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
}

.ganador-msg-modal[b-ugsukpn7u5] {
    width: min(420px, 94vw);
    background: #ffffff;
    border-radius: 26px;
    padding: 24px;
    text-align: center;
    box-shadow: 0 34px 90px rgba(15,23,42,.38);
    border: 1px solid rgba(148,163,184,.35);
}

.ganador-msg-icon[b-ugsukpn7u5] {
    width: 64px;
    height: 64px;
    margin: 0 auto 12px;
    border-radius: 22px;
    display: grid;
    place-items: center;
    font-size: 2rem;
    font-weight: 1000;
    color: #ffffff;
    background: linear-gradient(135deg, #16a34a, #22c55e);
    box-shadow: 0 18px 32px rgba(34,197,94,.24);
}

.ganador-msg-modal.error .ganador-msg-icon[b-ugsukpn7u5] {
    background: linear-gradient(135deg, #dc2626, #ef4444);
    box-shadow: 0 18px 32px rgba(239,68,68,.22);
}

.ganador-msg-title[b-ugsukpn7u5] {
    font-size: 1.28rem;
    font-weight: 1000;
    color: #0b1220;
}

.ganador-msg-text[b-ugsukpn7u5] {
    margin-top: 8px;
    color: #475569;
    font-weight: 850;
    line-height: 1.4;
}

.ganador-msg-btn[b-ugsukpn7u5] {
    margin-top: 18px;
    width: 100%;
    min-height: 46px;
    border: 0;
    border-radius: 15px;
    cursor: pointer;
    color: #ffffff;
    font-weight: 1000;
    background: linear-gradient(135deg, #0d47a1, #1e88e5);
    box-shadow: 0 16px 28px rgba(30,136,229,.20);
}

/* Historial modal pro */
.modal-backdrop[b-ugsukpn7u5] {
    background: rgba(15,23,42,.60) !important;
    backdrop-filter: blur(6px) !important;
    z-index: 2500 !important;
    padding: 18px !important;
}

.modal-historial[b-ugsukpn7u5] {
    width: min(1040px, 96vw) !important;
    max-width: 96vw !important;
    max-height: 90vh !important;
    border-radius: 26px !important;
    overflow: hidden !important;
    background: #ffffff !important;
    box-shadow: 0 34px 90px rgba(15,23,42,.40) !important;
}

    .modal-historial .modal-header[b-ugsukpn7u5] {
        padding: 18px 20px !important;
        background: linear-gradient(135deg, #0b1220, #0d47a1 65%, #1e88e5) !important;
        border: none !important;
    }

    .modal-historial .modal-title[b-ugsukpn7u5] {
        font-size: 1.15rem !important;
        font-weight: 1000 !important;
    }

    .modal-historial .modal-close[b-ugsukpn7u5] {
        background: rgba(255,255,255,.16) !important;
        color: #ffffff !important;
    }

    .modal-historial .modal-body[b-ugsukpn7u5] {
        padding: 18px !important;
        max-height: calc(90vh - 120px) !important;
        overflow: auto !important;
        background: linear-gradient(180deg, #f8fbff, #ffffff) !important;
    }

    .modal-historial .historial-grid[b-ugsukpn7u5] {
        display: grid !important;
        grid-template-columns: 320px minmax(0, 1fr) !important;
        gap: 18px !important;
    }

    .modal-historial .historial-filtros[b-ugsukpn7u5],
    .modal-historial .historial-resultados > div[b-ugsukpn7u5] {
        background: #ffffff !important;
        border: 1px solid #dbe7ff !important;
        border-radius: 18px !important;
        padding: 14px !important;
        box-shadow: 0 12px 24px rgba(15,23,42,.06) !important;
    }

    .modal-historial .historial-resumen[b-ugsukpn7u5] {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
    }

    .modal-historial .hist-res-item[b-ugsukpn7u5] {
        min-width: 0 !important;
        padding: 12px !important;
        border-radius: 15px !important;
        background: #f5f9ff !important;
        border: 1px solid #dbe7ff !important;
    }

    .modal-historial .tabla[b-ugsukpn7u5] {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .modal-historial .tabla-header[b-ugsukpn7u5] {
        background: #0d47a1 !important;
        color: #ffffff !important;
        border-radius: 12px 12px 0 0 !important;
        font-weight: 1000 !important;
    }

    .modal-historial .fila[b-ugsukpn7u5] {
        border-bottom: 1px solid #e6efff !important;
        color: #0f172a !important;
        font-weight: 850 !important;
    }

    .modal-historial .modal-actions[b-ugsukpn7u5] {
        padding: 12px 18px !important;
        background: #f8fbff !important;
    }

@media (max-width: 900px) {
    .ganador-pro-board-selectores[b-ugsukpn7u5] {
        grid-template-columns: 1fr !important;
    }

    .ganador-pro-column[b-ugsukpn7u5] {
        max-width: 100% !important;
    }

    .modal-historial .historial-grid[b-ugsukpn7u5] {
        grid-template-columns: 1fr !important;
    }

    .modal-historial[b-ugsukpn7u5] {
        width: calc(100vw - 20px) !important;
        max-width: calc(100vw - 20px) !important;
    }

        .modal-historial .historial-resumen[b-ugsukpn7u5] {
            grid-template-columns: 1fr !important;
        }

    .ganador-pro-modal[b-ugsukpn7u5] {
        width: calc(100vw - 22px) !important;
    }
}

.ganador-wrap[b-ugsukpn7u5] {
    background: #f3f6fb;
    border-radius: 18px;
    border: 1px solid #dbe7ff;
    box-shadow: 0 10px 24px rgba(15,23,42,.06);
}

.card-titulo[b-ugsukpn7u5] {
    font-size: 1.05rem;
    font-weight: 1000;
    color: #0b2a55;
}

.form-row[b-ugsukpn7u5] {
    margin-bottom: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

    .form-row label[b-ugsukpn7u5] {
        font-size: .9rem;
        font-weight: 950;
        color: #264a7a;
    }

.input[b-ugsukpn7u5] {
    min-height: 44px;
    border-radius: 13px;
    border: 1px solid #cfe0ff;
    background: #f7fbff;
    color: #0f172a;
    font-size: 16px;
    font-weight: 850;
    padding: 8px 12px;
    outline: none;
    box-sizing: border-box;
}

    .input:focus[b-ugsukpn7u5] {
        background: #fff;
        border-color: #2b78ff;
        box-shadow: 0 0 0 3px rgba(43,120,255,.18);
    }

.btn[b-ugsukpn7u5] {
    border: 0;
    border-radius: 14px;
    padding: 10px 16px;
    min-height: 42px;
    font-size: .95rem;
    font-weight: 1000;
    cursor: pointer;
    color: #fff;
    background: linear-gradient(135deg, #0d47a1, #1e88e5);
    box-shadow: 0 14px 26px rgba(30,136,229,.20);
}

.btn-secondary[b-ugsukpn7u5] {
    color: #0d47a1 !important;
    background: #eef5ff !important;
    border: 1px solid #cfe0ff !important;
    box-shadow: none !important;
}

.btn:disabled[b-ugsukpn7u5] {
    opacity: .55;
    cursor: not-allowed;
    box-shadow: none;
}

.ganador-historial-card[b-ugsukpn7u5] {
    border-radius: 18px;
    background: #ffffff;
    border: 1px solid #dbe7ff;
    padding: 16px;
    box-shadow: 0 12px 24px rgba(15,23,42,.07);
}

.ganador-historial-texto[b-ugsukpn7u5] {
    margin: 6px 0 0;
    font-size: .95rem;
    color: #355b8c;
    font-weight: 750;
}

.tabla[b-ugsukpn7u5] {
    width: 100%;
    overflow-x: auto;
}

.tabla-header[b-ugsukpn7u5],
.fila[b-ugsukpn7u5] {
    display: grid;
    align-items: center;
}

.tabla-header[b-ugsukpn7u5] {
    padding: 9px 10px;
}

.fila[b-ugsukpn7u5] {
    padding: 9px 10px;
}

.ganador-tabla-estad[b-ugsukpn7u5],
.ganador-fila-estad[b-ugsukpn7u5] {
    grid-template-columns: minmax(80px,.8fr) minmax(70px,.6fr) minmax(130px,1fr);
}

.ganador-tabla-hist[b-ugsukpn7u5],
.ganador-fila-hist[b-ugsukpn7u5] {
    grid-template-columns: minmax(170px,1.4fr) minmax(110px,1fr) minmax(90px,.7fr);
}

.fila-placeholder[b-ugsukpn7u5] {
    padding: 14px;
    color: #64748b;
    font-weight: 850;
}

.historial-rango[b-ugsukpn7u5] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.historial-acciones[b-ugsukpn7u5] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.consulta-numero-card[b-ugsukpn7u5] {
    margin-top: 14px;
    padding: 14px;
    border-radius: 16px;
    background: #ffffff;
    border: 1px solid #dbe7ff;
    box-shadow: 0 10px 20px rgba(15,23,42,.06);
}

.consulta-titulo[b-ugsukpn7u5] {
    font-size: .98rem;
    font-weight: 1000;
    color: #0b2a55;
    margin-bottom: 8px;
}

.consulta-numero-info[b-ugsukpn7u5] {
    font-size: .84rem;
    color: #5b7295;
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin: 6px 0 8px;
}

.consulta-error[b-ugsukpn7u5] {
    margin-top: 8px;
    font-size: .88rem;
    color: #b91c1c;
    font-weight: 900;
}

.consulta-numero-resumen[b-ugsukpn7u5] {
    margin-top: 8px;
    font-size: .92rem;
    color: #0f172a;
    font-weight: 850;
}

/* =========================================================
   FIX FINAL HISTORIAL GANADORES - MODAL REAL
========================================================= */

.ganador-historial-backdrop[b-ugsukpn7u5] {
    position: fixed !important;
    inset: 0 !important;
    z-index: 5000 !important;
    width: 100vw !important;
    height: 100vh !important;
    background: rgba(15,23,42,.62) !important;
    backdrop-filter: blur(7px) !important;
    -webkit-backdrop-filter: blur(7px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 18px !important;
    box-sizing: border-box !important;
}

.ganador-historial-modal[b-ugsukpn7u5] {
    width: min(1040px, 96vw) !important;
    max-height: 90vh !important;
    background: #ffffff !important;
    border-radius: 26px !important;
    overflow: hidden !important;
    box-shadow: 0 34px 90px rgba(15,23,42,.42) !important;
    border: 1px solid rgba(219,231,255,.95) !important;
    display: flex !important;
    flex-direction: column !important;
}

    .ganador-historial-modal .modal-header[b-ugsukpn7u5] {
        padding: 18px 20px !important;
        background: linear-gradient(135deg, #0b1220, #0d47a1 65%, #1e88e5) !important;
        border: none !important;
        color: #ffffff !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
    }

    .ganador-historial-modal .modal-title[b-ugsukpn7u5] {
        color: #ffffff !important;
        font-size: 1.15rem !important;
        font-weight: 1000 !important;
    }

    .ganador-historial-modal .modal-close[b-ugsukpn7u5] {
        width: 36px !important;
        height: 36px !important;
        border: 0 !important;
        border-radius: 12px !important;
        background: rgba(255,255,255,.16) !important;
        color: #ffffff !important;
        font-weight: 1000 !important;
        cursor: pointer !important;
    }

    .ganador-historial-modal .modal-body[b-ugsukpn7u5] {
        padding: 18px !important;
        overflow: auto !important;
        max-height: calc(90vh - 120px) !important;
        background: linear-gradient(180deg, #f8fbff, #ffffff) !important;
    }

    .ganador-historial-modal .historial-grid[b-ugsukpn7u5] {
        display: grid !important;
        grid-template-columns: 320px minmax(0, 1fr) !important;
        gap: 18px !important;
    }

    .ganador-historial-modal .historial-filtros[b-ugsukpn7u5],
    .ganador-historial-modal .historial-tabla-top[b-ugsukpn7u5],
    .ganador-historial-modal .historial-tabla-registros[b-ugsukpn7u5],
    .ganador-historial-modal .consulta-numero-card[b-ugsukpn7u5] {
        background: #ffffff !important;
        border: 1px solid #dbe7ff !important;
        border-radius: 18px !important;
        padding: 14px !important;
        box-shadow: 0 12px 24px rgba(15,23,42,.06) !important;
    }

    .ganador-historial-modal .historial-resumen[b-ugsukpn7u5] {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
        margin-bottom: 12px !important;
    }

    .ganador-historial-modal .hist-res-item[b-ugsukpn7u5] {
        padding: 12px !important;
        border-radius: 15px !important;
        background: #f5f9ff !important;
        border: 1px solid #dbe7ff !important;
    }

    .ganador-historial-modal .tabla-header[b-ugsukpn7u5] {
        background: #0d47a1 !important;
        color: #ffffff !important;
        border-radius: 12px 12px 0 0 !important;
        font-weight: 1000 !important;
    }

    .ganador-historial-modal .fila[b-ugsukpn7u5] {
        border-bottom: 1px solid #e6efff !important;
        color: #0f172a !important;
        font-weight: 850 !important;
    }

    .ganador-historial-modal .modal-actions[b-ugsukpn7u5] {
        padding: 12px 18px !important;
        background: #f8fbff !important;
        border-top: 1px solid #dbe7ff !important;
        display: flex !important;
        justify-content: flex-end !important;
    }

@media (max-width: 900px) {
    .ganador-historial-modal[b-ugsukpn7u5] {
        width: calc(100vw - 20px) !important;
        max-height: 90svh !important;
    }

        .ganador-historial-modal .historial-grid[b-ugsukpn7u5] {
            grid-template-columns: 1fr !important;
        }

        .ganador-historial-modal .historial-resumen[b-ugsukpn7u5] {
            grid-template-columns: 1fr !important;
        }
}

.ganador-bola-linea[b-ugsukpn7u5] {
    margin-top: 7px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: .92rem;
    font-weight: 1000;
    color: #334155;
}

.ganador-bola[b-ugsukpn7u5] {
    width: 18px;
    height: 18px;
    border-radius: 999px;
    display: inline-block;
    border: 2px solid rgba(15,23,42,.18);
    box-shadow: 0 6px 12px rgba(15,23,42,.18);
}

    .ganador-bola.roja[b-ugsukpn7u5] {
        background: radial-gradient(circle at 35% 30%, #ffffff 0%, #ff8a8a 20%, #dc2626 65%, #7f1d1d 100%);
    }

    .ganador-bola.blanca[b-ugsukpn7u5] {
        background: radial-gradient(circle at 35% 30%, #ffffff 0%, #f8fafc 45%, #cbd5e1 100%);
    }

.ganador-pro-tabs-row[b-ugsukpn7u5] {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    gap: 14px;
    flex-wrap: wrap;
}

.ganador-pro-tabs-row .ganador-pro-tabs[b-ugsukpn7u5] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.ganador-pro-date-inline[b-ugsukpn7u5] {
    min-width: 170px;
    max-width: 220px;
    background: rgba(255,255,255,.85);
    border: 1px solid #dbe7ff;
    border-radius: 18px;
    padding: 8px 10px;
    box-shadow: 0 12px 24px rgba(15,23,42,.06);
}

    .ganador-pro-date-inline label[b-ugsukpn7u5] {
        color: #0b2a55 !important;
        font-size: .78rem !important;
        font-weight: 1000 !important;
    }

    .ganador-pro-date-inline .input[b-ugsukpn7u5] {
        min-height: 38px !important;
        height: 38px !important;
        font-size: 14px !important;
        border-radius: 12px !important;
    }

@media (max-width: 700px) {
    .ganador-pro-tabs-row[b-ugsukpn7u5] {
        flex-direction: column;
    }

    .ganador-pro-date-inline[b-ugsukpn7u5] {
        max-width: 100%;
        width: 100%;
    }
}

/* =========================================================
   SELECTORES DE SORTEOS - MEJOR DISEÑO
   Solo pendientes/asignados
========================================================= */

.ganador-pro-selector-box select.input[b-ugsukpn7u5] {
    height: 52px !important;
    min-height: 52px !important;
    border-radius: 17px !important;
    font-size: 16px !important;
    font-weight: 1000 !important;
    letter-spacing: .2px !important;
    color: #0b2a55 !important;
    background: linear-gradient(45deg, transparent 50%, #0d47a1 50%), linear-gradient(135deg, #0d47a1 50%, transparent 50%), linear-gradient(180deg, #ffffff 0%, #eef6ff 100%) !important;
    background-position: calc(100% - 22px) 23px, calc(100% - 15px) 23px, 0 0 !important;
    background-size: 7px 7px, 7px 7px, 100% 100% !important;
    background-repeat: no-repeat !important;
    border: 1px solid rgba(13,71,161,.24) !important;
    box-shadow: 0 14px 28px rgba(13,71,161,.10), inset 0 1px 0 rgba(255,255,255,.95) !important;
    padding-left: 16px !important;
    padding-right: 48px !important;
    cursor: pointer !important;
}

    .ganador-pro-selector-box select.input:hover[b-ugsukpn7u5] {
        background: linear-gradient(45deg, transparent 50%, #1e88e5 50%), linear-gradient(135deg, #1e88e5 50%, transparent 50%), linear-gradient(180deg, #ffffff 0%, #eaf3ff 100%) !important;
        background-position: calc(100% - 22px) 23px, calc(100% - 15px) 23px, 0 0 !important;
        background-size: 7px 7px, 7px 7px, 100% 100% !important;
        background-repeat: no-repeat !important;
        border-color: rgba(30,136,229,.55) !important;
    }

    .ganador-pro-selector-box select.input:focus[b-ugsukpn7u5] {
        border-color: #1e88e5 !important;
        box-shadow: 0 0 0 4px rgba(30,136,229,.16), 0 18px 34px rgba(30,136,229,.16) !important;
    }

    /* Opciones internas del desplegable */
    .ganador-pro-selector-box select.input option[b-ugsukpn7u5] {
        font-size: 16px;
        font-weight: 900;
        color: #0f172a;
        background: #ffffff;
        padding: 10px;
    }
/* _content/SistemaLoteriaDashboard/Components/Banca/BloqueNumeros.razor.rz.scp.css */
.bn-card[b-wlv5ewggay] {
    background: #fff;
    border-radius: 16px;
    padding: 18px;
    box-shadow: 0 10px 30px rgba(0,0,0,.08);
}

.bn-title[b-wlv5ewggay] {
    font-weight: 900;
    font-size: 1.25rem;
    color: #153e75;
}

.bn-sub[b-wlv5ewggay] {
    margin-top: 4px;
    color: #52627a;
    font-size: .98rem;
}

.bn-filtros[b-wlv5ewggay] {
    margin-top: 14px;
    display: flex;
    gap: 14px;
    align-items: flex-end;
    flex-wrap: wrap;
}

.bn-filter label[b-wlv5ewggay] {
    display: block;
    font-weight: 800;
    color: #183b6b;
    margin-bottom: 6px;
    font-size: .95rem;
}

.bn-select[b-wlv5ewggay] {
    min-width: 220px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid #d7e2f1;
    outline: none;
    font-weight: 700;
    color: #123;
    background: #f8fbff;
}

.bn-filter-date[b-wlv5ewggay] {
    min-width: 240px;
}

.bn-date-control[b-wlv5ewggay] {
    max-width: 220px;
}

.bn-date-control[b-wlv5ewggay]  .sl-date-wrap.sl-date-field-compact {
    width: 100%;
}

.bn-date-control[b-wlv5ewggay]  .sl-date-wrap input.sl-date-input.bn-date-input,
.bn-date-control[b-wlv5ewggay]  .sl-date-wrap input.sl-date-input.cg-date-input {
    min-height: 48px;
    height: 48px;
    width: 100%;
    border-radius: 14px;
    border: 1px solid #cfe0ff;
    font-size: 1.05rem;
    font-weight: 900;
    color: #0f172a;
    background: #fff;
    box-shadow: inset 0 0 0 1px rgba(226, 232, 240, .55);
}

.bn-datehint[b-wlv5ewggay] {
    margin-top: 6px;
    font-size: .86rem;
    color: #64748b;
    font-weight: 750;
}

.bn-note[b-wlv5ewggay] {
    color: #425a79;
    font-size: .95rem;
    margin-left: auto;
    padding: 10px 12px;
    border: 1px dashed #cfe0f7;
    border-radius: 12px;
    background: #fbfdff;
}

.bn-grid[b-wlv5ewggay] {
    margin-top: 16px;
    display: grid;
    grid-template-columns: repeat(10, minmax(64px, 1fr));
    gap: 10px;
}

.bn-num[b-wlv5ewggay] {
    border: 1px solid #d7e2f1;
    background: linear-gradient(180deg,#ffffff,#f3f7ff);
    border-radius: 14px;
    padding: 10px 6px;
    cursor: pointer;
    position: relative;
    box-shadow: 0 6px 16px rgba(0,0,0,.06);
    transition: transform .08s ease;
}

    .bn-num:active[b-wlv5ewggay] {
        transform: scale(.98);
    }

.bn-n[b-wlv5ewggay] {
    font-size: 1.05rem;
    font-weight: 900;
    color: #153e75;
}

.bn-flag[b-wlv5ewggay] {
    font-size: .75rem;
    font-weight: 900;
    color: #c02828;
    margin-top: 4px;
    height: 12px;
}

.bn-bloq[b-wlv5ewggay] {
    border: 2px solid #c02828;
    background: linear-gradient(180deg,#fff6f6,#ffecec);
}

.bn-backdrop[b-wlv5ewggay] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.35);
    z-index: 9998;
}

.bn-modal[b-wlv5ewggay] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
    z-index: 9999;
}

.bn-modal-box[b-wlv5ewggay] {
    width: min(760px, 96vw);
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0,0,0,.35);
}

.bn-mh[b-wlv5ewggay] {
    padding: 14px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #e7eefb;
    background: #f6f9ff;
}

.bn-mt[b-wlv5ewggay] {
    font-weight: 900;
    color: #153e75;
    font-size: 1.1rem;
}

.bn-x[b-wlv5ewggay] {
    border: none;
    background: transparent;
    font-size: 1.2rem;
    font-weight: 900;
    cursor: pointer;
    color: #1b2b44;
}

.bn-mb[b-wlv5ewggay] {
    padding: 16px;
}

.bn-resumen[b-wlv5ewggay] {
    display: grid;
    gap: 6px;
    color: #123;
    font-weight: 700;
    margin-bottom: 12px;
}

.bn-det-title[b-wlv5ewggay] {
    font-weight: 900;
    color: #153e75;
    margin-bottom: 8px;
}

.bn-empty[b-wlv5ewggay] {
    padding: 12px;
    border-radius: 12px;
    background: #f8fbff;
    border: 1px solid #d7e2f1;
    color: #52627a;
    font-weight: 700;
}

.bn-table[b-wlv5ewggay] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    border-radius: 12px;
    border: 1px solid #d7e2f1;
}

    .bn-table th[b-wlv5ewggay] {
        text-align: left;
        background: #f0f6ff;
        color: #153e75;
        font-weight: 900;
        padding: 10px;
        border-bottom: 1px solid #d7e2f1;
    }

    .bn-table td[b-wlv5ewggay] {
        padding: 10px;
        border-bottom: 1px solid #edf2fb;
        font-weight: 700;
        color: #123;
    }

    .bn-table tr:last-child td[b-wlv5ewggay] {
        border-bottom: none;
    }

.bn-actions[b-wlv5ewggay] {
    margin-top: 14px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

.bn-btn[b-wlv5ewggay] {
    border: none;
    border-radius: 12px;
    padding: 10px 14px;
    font-weight: 900;
    cursor: pointer;
}

.bn-btn-danger[b-wlv5ewggay] {
    background: #c02828;
    color: #fff;
}

.bn-btn-ok[b-wlv5ewggay] {
    background: #1f8a3b;
    color: #fff;
}

.bn-btn-sec[b-wlv5ewggay] {
    background: #eef3fb;
    color: #153e75;
    border: 1px solid #d7e2f1;
}

.bn-warn[b-wlv5ewggay] {
    margin-top: 12px;
    padding: 12px;
    border-radius: 12px;
    background: #fff7e8;
    border: 1px solid #ffe0a6;
    color: #6a4a00;
    font-weight: 800;
    font-size: .95rem;
}

@media (max-width: 700px) {
    /* =========================
       BLOQUEAR NÚMEROS
       SOLO MÓVIL
       NO TOCA ESCRITORIO
       ========================= */

    .bn-card[b-wlv5ewggay] {
        padding: 12px;
        border-radius: 14px;
        box-sizing: border-box;
        overflow-x: hidden;
    }

    .bn-title[b-wlv5ewggay] {
        font-size: 1.08rem;
        line-height: 1.25;
    }

    .bn-sub[b-wlv5ewggay] {
        margin-top: 6px;
        font-size: 0.94rem;
        line-height: 1.35;
    }

    /* ===== Filtros ===== */
    .bn-filtros[b-wlv5ewggay] {
        margin-top: 12px;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .bn-filter[b-wlv5ewggay] {
        width: 100%;
        min-width: 0;
    }

        .bn-filter label[b-wlv5ewggay] {
            font-size: 0.94rem;
            line-height: 1.2;
            margin-bottom: 6px;
        }

    .bn-select[b-wlv5ewggay] {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
        min-height: 46px;
        font-size: 16px;
        padding: 10px 12px;
        border-radius: 12px;
    }

    .bn-datehint[b-wlv5ewggay] {
        margin-top: 6px;
        font-size: 0.86rem;
        line-height: 1.3;
        color: #5b6f8c;
    }

    .bn-note[b-wlv5ewggay] {
        margin-left: 0;
        width: 100%;
        box-sizing: border-box;
        font-size: 0.92rem;
        line-height: 1.35;
        padding: 10px 12px;
    }

    /* ===== Grid de números ===== */
    .bn-grid[b-wlv5ewggay] {
        margin-top: 14px;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 8px;
    }

    .bn-num[b-wlv5ewggay] {
        min-height: 64px;
        padding: 10px 4px;
        border-radius: 12px;
        box-sizing: border-box;
    }

    .bn-n[b-wlv5ewggay] {
        font-size: 1rem;
        line-height: 1.1;
    }

    .bn-flag[b-wlv5ewggay] {
        font-size: 0.72rem;
        line-height: 1;
        height: auto;
        min-height: 12px;
    }

    /* ===== Backdrop y modal ===== */
    .bn-backdrop[b-wlv5ewggay] {
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,.42);
        z-index: 9998;
        overflow: hidden;
        overscroll-behavior: contain;
        touch-action: none;
    }

    .bn-modal[b-wlv5ewggay] {
        position: fixed;
        inset: 0;
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 10px;
        z-index: 9999;
        box-sizing: border-box;
        overflow: hidden;
        overscroll-behavior: contain;
    }

    .bn-modal-box[b-wlv5ewggay] {
        width: calc(100vw - 20px);
        max-width: calc(100vw - 20px);
        max-height: 90svh;
        min-width: 0;
        background: #fff;
        border-radius: 16px;
        overflow: hidden;
        box-shadow: 0 20px 60px rgba(0,0,0,.35);
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
    }

    .bn-mh[b-wlv5ewggay] {
        padding: 12px 14px;
        gap: 10px;
        box-sizing: border-box;
    }

    .bn-mt[b-wlv5ewggay] {
        font-size: 1rem;
        line-height: 1.2;
        min-width: 0;
    }

    .bn-x[b-wlv5ewggay] {
        min-width: 40px;
        min-height: 40px;
        flex: 0 0 auto;
        border-radius: 10px;
    }

    .bn-mb[b-wlv5ewggay] {
        padding: 12px;
        overflow: auto;
        max-height: calc(90svh - 64px);
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-y;
        box-sizing: border-box;
        min-width: 0;
    }

    /* ===== Resumen ===== */
    .bn-resumen[b-wlv5ewggay] {
        gap: 8px;
        margin-bottom: 12px;
        font-size: 0.94rem;
        line-height: 1.35;
        word-break: break-word;
    }

    .bn-estado[b-wlv5ewggay] {
        margin-bottom: 12px;
        font-size: 0.95rem;
        line-height: 1.35;
        word-break: break-word;
    }

    .bn-det-title[b-wlv5ewggay] {
        font-size: 0.96rem;
        line-height: 1.2;
        margin-bottom: 8px;
    }

    .bn-empty[b-wlv5ewggay] {
        padding: 12px;
        font-size: 0.92rem;
        line-height: 1.35;
    }

    /* ===== Tabla del modal ===== */
    .bn-det[b-wlv5ewggay] {
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
    }

    .bn-table-wrap[b-wlv5ewggay] {
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        border-radius: 12px;
    }

    .bn-table[b-wlv5ewggay] {
        min-width: 360px;
        width: 100%;
        box-sizing: border-box;
    }

        .bn-table th[b-wlv5ewggay],
        .bn-table td[b-wlv5ewggay] {
            padding: 10px;
            font-size: 0.92rem;
            line-height: 1.25;
        }

    /* ===== Acciones ===== */
    .bn-actions[b-wlv5ewggay] {
        margin-top: 14px;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    .bn-btn[b-wlv5ewggay] {
        width: 100%;
        min-height: 46px;
        box-sizing: border-box;
        font-size: 0.96rem;
        padding: 10px 14px;
        border-radius: 12px;
        text-align: center;
    }

    .bn-warn[b-wlv5ewggay] {
        margin-top: 12px;
        padding: 12px;
        font-size: 0.9rem;
        line-height: 1.35;
        box-sizing: border-box;
    }

    /* ===== Blindaje de ancho ===== */
    .bn-card *[b-wlv5ewggay],
    .bn-modal *[b-wlv5ewggay],
    .bn-modal-box *[b-wlv5ewggay],
    .bn-mb *[b-wlv5ewggay] {
        box-sizing: border-box;
    }

    .bn-card[b-wlv5ewggay],
    .bn-filtros[b-wlv5ewggay],
    .bn-filter[b-wlv5ewggay],
    .bn-note[b-wlv5ewggay],
    .bn-grid[b-wlv5ewggay],
    .bn-modal[b-wlv5ewggay],
    .bn-modal-box[b-wlv5ewggay],
    .bn-mh[b-wlv5ewggay],
    .bn-mb[b-wlv5ewggay],
    .bn-resumen[b-wlv5ewggay],
    .bn-det[b-wlv5ewggay],
    .bn-actions[b-wlv5ewggay],
    .bn-warn[b-wlv5ewggay] {
        min-width: 0;
        max-width: 100%;
    }

    html[b-wlv5ewggay],
    body[b-wlv5ewggay] {
        overflow-x: hidden;
    }
}
/* _content/SistemaLoteriaDashboard/Components/Banca/ConsultaFacturaDetallada.razor.rz.scp.css */
.cfd-root[b-yxcf3iybgb] {
    width: 100%;
    padding: 14px;
}

.cfd-hero[b-yxcf3iybgb] {
    background: linear-gradient(180deg, #0b3a74 0%, #0f4a92 55%, #1253a3 100%);
    border-radius: 16px;
    padding: 18px 18px;
    box-shadow: 0 10px 22px rgba(0,0,0,.18);
    margin-bottom: 14px;
}

.cfd-hero-title[b-yxcf3iybgb] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cfd-h1[b-yxcf3iybgb] {
    margin: 0;
    font-size: 1.45rem;
    font-weight: 900;
    color: #fff;
}

.cfd-h2[b-yxcf3iybgb] {
    font-size: .98rem;
    color: rgba(255,255,255,.85);
    font-weight: 600;
}

.cfd-section[b-yxcf3iybgb] {
    background: #fff;
    border-radius: 16px;
    padding: 14px;
    margin-top: 14px;
    box-shadow: 0 8px 18px rgba(0,0,0,.10);
    border: 1px solid rgba(15, 74, 146, .14);
}

.cfd-section-head[b-yxcf3iybgb] {
    margin-bottom: 12px;
}

.cfd-section-title[b-yxcf3iybgb] {
    font-size: 1.10rem;
    font-weight: 900;
    color: #153e75;
}

.cfd-section-sub[b-yxcf3iybgb] {
    font-size: .92rem;
    color: #314c70;
    font-weight: 600;
    margin-top: 4px;
}

.cfd-filters[b-yxcf3iybgb] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: flex-end;
}

.cfd-block[b-yxcf3iybgb] {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 190px;
}

.cfd-grow[b-yxcf3iybgb] {
    flex: 1 1 260px;
}

.cfd-block-btn[b-yxcf3iybgb] {
    min-width: 180px;
    display: flex;
    justify-content: flex-end;
}

.cfd-label[b-yxcf3iybgb] {
    font-size: .86rem;
    font-weight: 900;
    color: #153e75;
}

.cfd-input[b-yxcf3iybgb] {
    height: 42px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(18, 83, 163, .20);
    outline: none;
    font-size: .98rem;
    background: #fbfdff;
    color: #0f1b2d;
}

    .cfd-input:focus[b-yxcf3iybgb] {
        border-color: rgba(18, 83, 163, .55);
        box-shadow: 0 0 0 4px rgba(18, 83, 163, .14);
    }

.cfd-select[b-yxcf3iybgb] {
    appearance: none;
    padding-right: 42px;
}

.cfd-radio[b-yxcf3iybgb] {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
    padding: 6px 8px;
    border-radius: 12px;
    background: #f5f9ff;
    border: 1px solid rgba(18, 83, 163, .14);
    min-height: 42px;
}

    .cfd-radio label[b-yxcf3iybgb] {
        display: flex;
        align-items: center;
        gap: 6px;
        font-weight: 800;
        font-size: .92rem;
        color: #163b6c;
        cursor: pointer;
    }

.cfd-btn[b-yxcf3iybgb] {
    border: none;
    border-radius: 12px;
    height: 42px;
    padding: 0 16px;
    font-weight: 900;
    cursor: pointer;
}

.cfd-btn-blue[b-yxcf3iybgb] {
    background: linear-gradient(180deg, #1a66c7 0%, #1253a3 100%);
    color: #fff;
    box-shadow: 0 10px 18px rgba(18,83,163,.22);
}

.cfd-loading-card[b-yxcf3iybgb],
.cfd-error[b-yxcf3iybgb] {
    margin-top: 14px;
    background: #fff;
    border-radius: 14px;
    padding: 14px;
    font-weight: 900;
    box-shadow: 0 8px 18px rgba(0,0,0,.08);
}

.cfd-error[b-yxcf3iybgb] {
    background: #fff2f2;
    border: 1px solid rgba(220, 70, 70, .28);
    color: #7a1111;
}

@media (max-width: 980px) {
    .cfd-filters[b-yxcf3iybgb] {
        flex-direction: column;
        align-items: stretch;
    }

    .cfd-block[b-yxcf3iybgb],
    .cfd-grow[b-yxcf3iybgb],
    .cfd-block-btn[b-yxcf3iybgb] {
        width: 100%;
        min-width: 0;
    }

    .cfd-btn[b-yxcf3iybgb] {
        width: 100%;
    }
}

.cfd-topbar[b-yxcf3iybgb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    background: #ffffff;
    border: 1px solid rgba(18, 83, 163, .14);
    border-radius: 16px;
    padding: 14px 16px;
    box-shadow: 0 8px 18px rgba(0,0,0,.08);
    margin-bottom: 14px;
}

.cfd-topbar-left[b-yxcf3iybgb] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cfd-topbar-title[b-yxcf3iybgb] {
    font-size: 1.05rem;
    font-weight: 900;
    color: #153e75;
}

.cfd-topbar-sub[b-yxcf3iybgb] {
    font-size: .90rem;
    color: #37557b;
    font-weight: 600;
}

.cfd-topbar-actions[b-yxcf3iybgb] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.cfd-topbar-btn[b-yxcf3iybgb] {
    border: none;
    border-radius: 12px;
    height: 40px;
    padding: 0 14px;
    font-weight: 900;
    cursor: pointer;
    transition: transform .08s ease, box-shadow .12s ease, filter .12s ease;
}

    .cfd-topbar-btn:active[b-yxcf3iybgb] {
        transform: translateY(1px);
    }

.cfd-topbar-btn-light[b-yxcf3iybgb] {
    background: #eef5ff;
    color: #1253a3;
    border: 1px solid rgba(18, 83, 163, .14);
}

.cfd-topbar-btn-dark[b-yxcf3iybgb] {
    background: linear-gradient(180deg, #1a66c7 0%, #1253a3 100%);
    color: #fff;
    box-shadow: 0 10px 18px rgba(18,83,163,.22);
}

@media (max-width: 980px) {
    .cfd-topbar[b-yxcf3iybgb] {
        flex-direction: column;
        align-items: stretch;
    }

    .cfd-topbar-actions[b-yxcf3iybgb] {
        width: 100%;
        justify-content: stretch;
        flex-direction: column;
    }

    .cfd-topbar-btn[b-yxcf3iybgb] {
        width: 100%;
    }
}

.cfd-result-grid[b-yxcf3iybgb] {
    display: grid;
    grid-template-columns: repeat(4, minmax(180px, 1fr));
    gap: 12px;
    margin-top: 12px;
}

.cfd-result-card[b-yxcf3iybgb] {
    background: #f7fbff;
    border: 1px solid rgba(18,83,163,.14);
    border-radius: 14px;
    padding: 12px;
}

.cfd-result-label[b-yxcf3iybgb] {
    font-size: .82rem;
    font-weight: 900;
    color: #4c6488;
    margin-bottom: 4px;
}

.cfd-result-value[b-yxcf3iybgb] {
    font-size: 1rem;
    font-weight: 900;
    color: #153e75;
    word-break: break-word;
}

.cfd-detail-layout[b-yxcf3iybgb] {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 14px;
    margin-top: 16px;
}

.cfd-preview-box[b-yxcf3iybgb],
.cfd-lines-box[b-yxcf3iybgb] {
    background: #fff;
    border: 1px solid rgba(18,83,163,.14);
    border-radius: 16px;
    padding: 14px;
    box-shadow: 0 8px 18px rgba(0,0,0,.06);
}

.cfd-preview-title[b-yxcf3iybgb] {
    font-size: 1rem;
    font-weight: 900;
    color: #153e75;
    margin-bottom: 10px;
}

.cfd-preview-frame[b-yxcf3iybgb] {
    width: 100%;
    height: 520px;
    border: 0;
    background: #fff;
    border-radius: 12px;
}

.cfd-lines-table[b-yxcf3iybgb] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cfd-lines-head[b-yxcf3iybgb],
.cfd-lines-row[b-yxcf3iybgb] {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 12px;
}

.cfd-lines-head[b-yxcf3iybgb] {
    background: #edf5ff;
    border: 1px solid rgba(18,83,163,.14);
    font-weight: 900;
    color: #153e75;
}

.cfd-lines-row[b-yxcf3iybgb] {
    background: #fafcff;
    border: 1px solid rgba(18,83,163,.10);
    color: #123;
    font-weight: 700;
}

.cfd-empty-lines[b-yxcf3iybgb] {
    background: #f7fbff;
    border: 1px solid rgba(18,83,163,.12);
    border-radius: 12px;
    padding: 12px;
    color: #355174;
    font-weight: 700;
}

.cfd-reimp-list[b-yxcf3iybgb] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.cfd-reimp-item[b-yxcf3iybgb] {
    background: #f7fbff;
    border: 1px solid rgba(18,83,163,.12);
    border-radius: 12px;
    padding: 10px 12px;
    color: #153e75;
    font-weight: 800;
}

@media (max-width: 1100px) {
    .cfd-result-grid[b-yxcf3iybgb] {
        grid-template-columns: repeat(2, minmax(180px, 1fr));
    }

    .cfd-detail-layout[b-yxcf3iybgb] {
        grid-template-columns: 1fr;
    }

    .cfd-preview-frame[b-yxcf3iybgb] {
        height: 420px;
    }
}

@media (max-width: 700px) {
    .cfd-result-grid[b-yxcf3iybgb] {
        grid-template-columns: 1fr;
    }

    .cfd-lines-head[b-yxcf3iybgb],
    .cfd-lines-row[b-yxcf3iybgb] {
        grid-template-columns: 1fr 1fr 1fr;
        font-size: .90rem;
    }

    .cfd-preview-frame[b-yxcf3iybgb] {
        height: 340px;
    }
}

.cfd-ticket-shell[b-yxcf3iybgb] {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 10px 0;
}

.cfd-ticket-paper[b-yxcf3iybgb] {
    position: relative;
    background: linear-gradient(180deg, #ffffff 0%, #fbfbfb 100%);
    border: 2px solid #d7e2f2;
    border-radius: 18px;
    box-shadow: 0 18px 34px rgba(0, 0, 0, .12);
    padding: 16px 14px;
    max-width: 430px;
    width: 100%;
}

    .cfd-ticket-paper[b-yxcf3iybgb]::before,
    .cfd-ticket-paper[b-yxcf3iybgb]::after {
        content: "";
        position: absolute;
        left: 12px;
        right: 12px;
        height: 10px;
        background: radial-gradient(circle, #d7e2f2 48%, transparent 52%) repeat-x;
        background-size: 18px 10px;
    }

    .cfd-ticket-paper[b-yxcf3iybgb]::before {
        top: -6px;
    }

    .cfd-ticket-paper[b-yxcf3iybgb]::after {
        bottom: -6px;
    }

.cfd-ticket-watermark[b-yxcf3iybgb] {
    text-align: center;
    font-size: .90rem;
    font-weight: 900;
    letter-spacing: .22rem;
    color: #2c61a8;
    border: 1px dashed rgba(44, 97, 168, .35);
    border-radius: 10px;
    padding: 4px 8px;
    margin-bottom: 10px;
    background: rgba(44, 97, 168, .05);
}

.cfd-ticket-consulta-band[b-yxcf3iybgb] {
    margin: 10px 0 2px 0;
    text-align: center;
    font-size: .95rem;
    font-weight: 900;
    letter-spacing: .16rem;
    color: #0b3a74;
    border-top: 1px dashed rgba(11, 58, 116, .35);
    border-bottom: 1px dashed rgba(11, 58, 116, .35);
    padding: 6px 0;
    background: rgba(11, 58, 116, .04);
}

.cfd-preview-box .rf-ticket-preview[b-yxcf3iybgb] {
    background: transparent;
    border: 0;
    box-shadow: none;
    width: 100%;
}

.cfd-preview-box .pos-title[b-yxcf3iybgb] {
    font-size: 1.10rem;
    font-weight: 900;
}

.cfd-preview-box .pos-sub[b-yxcf3iybgb],
.cfd-preview-box .pos-meta[b-yxcf3iybgb],
.cfd-preview-box .pos-msg[b-yxcf3iybgb],
.cfd-preview-box .pos-footer[b-yxcf3iybgb] {
    word-break: break-word;
}

@media (max-width: 700px) {
    .cfd-ticket-paper[b-yxcf3iybgb] {
        padding: 12px 10px;
        border-radius: 14px;
    }

    .cfd-ticket-watermark[b-yxcf3iybgb],
    .cfd-ticket-consulta-band[b-yxcf3iybgb] {
        letter-spacing: .10rem;
    }
}

.cfd-filters-compact[b-yxcf3iybgb] {
    display: grid;
    gap: 10px;
    align-items: end;
}

/* ===== Mundo Banca: 7 columnas ===== */
.cfd-filters-banca-directa[b-yxcf3iybgb] {
    grid-template-columns: 145px /* Fecha */
    95px /* Juego */
    230px /* Vendedor */
    230px /* Sorteo */
    165px /* Tickets */
    105px /* Consecutivo */
    120px; /* Botón */
}

/* ===== Mundo del Listero: 7 columnas ===== */
.cfd-filters-listero-propio[b-yxcf3iybgb] {
    grid-template-columns: 145px /* Fecha */
    95px /* Juego */
    230px /* Vendedor */
    230px /* Sorteo */
    165px /* Tickets */
    105px /* Consecutivo */
    120px; /* Botón */
}

/* ===== Mundo Listero desde Banca: 8 columnas ===== */
.cfd-filters-banca-listero[b-yxcf3iybgb] {
    grid-template-columns: 145px /* Fecha */
    95px /* Juego */
    190px /* Listero */
    230px /* Vendedor del listero */
    190px /* Sorteo */
    165px /* Tickets */
    105px /* Consecutivo */
    120px; /* Botón */
}

.cfd-date-block[b-yxcf3iybgb] {
    min-width: 145px;
}

.cfd-block-game[b-yxcf3iybgb] {
    min-width: 95px;
}

.cfd-block-compact[b-yxcf3iybgb] {
    min-width: 160px;
}

.cfd-block-ticket[b-yxcf3iybgb] {
    min-width: 105px;
}

.cfd-filters-compact .cfd-block-btn[b-yxcf3iybgb] {
    min-width: 120px;
}

.cfd-date-block .cfd-input[b-yxcf3iybgb] {
    min-width: 145px;
    padding: 8px 10px;
}

.cfd-filters-compact .cfd-input[b-yxcf3iybgb],
.cfd-filters-compact .cfd-btn[b-yxcf3iybgb] {
    height: 40px;
    font-size: .90rem;
}

.cfd-filters-compact .cfd-select[b-yxcf3iybgb] {
    width: 100%;
    min-width: 0;
}

.cfd-filters-compact .cfd-radio[b-yxcf3iybgb] {
    min-height: 40px;
    justify-content: flex-start;
    gap: 4px;
    padding: 6px 8px;
    flex-direction: column;
    align-items: flex-start;
}

    .cfd-filters-compact .cfd-radio label[b-yxcf3iybgb] {
        font-size: .83rem;
        gap: 4px;
        line-height: 1.1;
    }

.cfd-filters-compact .cfd-label[b-yxcf3iybgb] {
    font-size: .82rem;
    line-height: 1.1;
    white-space: nowrap;
}

.cfd-filters-compact .cfd-btn[b-yxcf3iybgb] {
    width: 100%;
    padding: 0 10px;
    line-height: 1.1;
}

/* ===== Laptop mediana ===== */
@media (max-width: 1500px) {
    .cfd-filters-banca-directa[b-yxcf3iybgb],
    .cfd-filters-listero-propio[b-yxcf3iybgb] {
        grid-template-columns: repeat(4, minmax(180px, 1fr));
    }

    .cfd-filters-banca-listero[b-yxcf3iybgb] {
        grid-template-columns: repeat(4, minmax(180px, 1fr));
    }

    .cfd-filters-compact .cfd-radio[b-yxcf3iybgb] {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
    }
}

/* ===== Tablet / pantallas más angostas ===== */
@media (max-width: 1100px) {
    .cfd-filters-banca-directa[b-yxcf3iybgb],
    .cfd-filters-listero-propio[b-yxcf3iybgb],
    .cfd-filters-banca-listero[b-yxcf3iybgb] {
        grid-template-columns: repeat(2, minmax(180px, 1fr));
    }

    .cfd-date-block[b-yxcf3iybgb],
    .cfd-block-game[b-yxcf3iybgb],
    .cfd-block-compact[b-yxcf3iybgb],
    .cfd-block-ticket[b-yxcf3iybgb],
    .cfd-filters-compact .cfd-block-btn[b-yxcf3iybgb] {
        min-width: 0;
        width: 100%;
    }

        .cfd-date-block .cfd-input[b-yxcf3iybgb] {
            min-width: 0;
            width: 100%;
        }

    .cfd-filters-compact .cfd-radio[b-yxcf3iybgb] {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
    }
}

/* ===== Teléfonos ===== */
@media (max-width: 700px) {
    .cfd-filters-banca-directa[b-yxcf3iybgb],
    .cfd-filters-listero-propio[b-yxcf3iybgb],
    .cfd-filters-banca-listero[b-yxcf3iybgb] {
        grid-template-columns: 1fr;
    }

    .cfd-date-block[b-yxcf3iybgb],
    .cfd-block-game[b-yxcf3iybgb],
    .cfd-block-compact[b-yxcf3iybgb],
    .cfd-block-ticket[b-yxcf3iybgb],
    .cfd-filters-compact .cfd-block-btn[b-yxcf3iybgb] {
        min-width: 0;
        width: 100%;
    }

        .cfd-date-block .cfd-input[b-yxcf3iybgb] {
            min-width: 0;
            width: 100%;
        }

    .cfd-filters-compact .cfd-radio[b-yxcf3iybgb] {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: 10px;
    }

    .cfd-filters-compact .cfd-btn[b-yxcf3iybgb] {
        width: 100%;
    }
}
@media (max-width: 520px) {
    .cfd-root[b-yxcf3iybgb] {
        padding: 8px;
    }

    .cfd-section[b-yxcf3iybgb] {
        padding: 10px;
        border-radius: 12px;
    }

    .cfd-section-title[b-yxcf3iybgb] {
        font-size: 1rem;
    }

    .cfd-section-sub[b-yxcf3iybgb] {
        font-size: .82rem;
    }

    .cfd-label[b-yxcf3iybgb] {
        font-size: .80rem;
    }

    .cfd-filters-compact .cfd-input[b-yxcf3iybgb],
    .cfd-filters-compact .cfd-btn[b-yxcf3iybgb] {
        height: 40px;
        font-size: .88rem;
        padding: 8px 10px;
    }

    .cfd-date-block .cfd-input[b-yxcf3iybgb] {
        width: 100%;
        min-width: 0;
    }

    .cfd-topbar-actions[b-yxcf3iybgb] {
        flex-direction: column;
        width: 100%;
    }

    .cfd-topbar-btn[b-yxcf3iybgb] {
        width: 100%;
    }
}
/* _content/SistemaLoteriaDashboard/Components/Banca/ConsultaFacturasBanca.razor.rz.scp.css */
/* Components/Banca/ConsultaFacturasBanca.razor.css */

.cf-root[b-bnktaf3cdh] {
    width: 100%;
    padding: 14px;
}

/* ===== HEADER / HERO ===== */
.cf-hero[b-bnktaf3cdh] {
    background: linear-gradient(180deg, #0b3a74 0%, #0f4a92 55%, #1253a3 100%);
    border-radius: 16px;
    padding: 18px 18px;
    box-shadow: 0 10px 22px rgba(0,0,0,.18);
    margin-bottom: 14px;
    position: relative;
    overflow: hidden;
}

    .cf-hero[b-bnktaf3cdh]:before {
        content: "";
        position: absolute;
        inset: -40px -60px auto auto;
        width: 240px;
        height: 240px;
        background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.25), rgba(255,255,255,0));
        border-radius: 50%;
        transform: rotate(10deg);
        pointer-events: none;
    }

.cf-hero-title[b-bnktaf3cdh] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cf-h1[b-bnktaf3cdh] {
    margin: 0;
    font-size: 1.45rem;
    font-weight: 900;
    letter-spacing: .2px;
    color: #fff;
}

.cf-h2[b-bnktaf3cdh] {
    font-size: .98rem;
    color: rgba(255,255,255,.85);
    font-weight: 600;
}

/* ===== FILTERS ===== */
.cf-filters[b-bnktaf3cdh] {
    background: #ffffff;
    border-radius: 16px;
    padding: 14px;
    box-shadow: 0 8px 18px rgba(0,0,0,.10);
    border: 1px solid rgba(15, 74, 146, .14);
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: flex-end;
}

.cf-block[b-bnktaf3cdh] {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 190px;
}

.cf-grow[b-bnktaf3cdh] {
    flex: 1 1 260px;
}

.cf-block-btn[b-bnktaf3cdh] {
    min-width: 160px;
    display: flex;
    justify-content: flex-end;
}

.cf-label[b-bnktaf3cdh] {
    font-size: .86rem;
    font-weight: 900;
    color: #153e75;
    letter-spacing: .2px;
}

/* Inputs */
.cf-input[b-bnktaf3cdh] {
    height: 42px;
    padding: 10px 12px;
    border-radius: 12px;
    border: 1px solid rgba(18, 83, 163, .20);
    outline: none;
    font-size: .98rem;
    background: #fbfdff;
    color: #0f1b2d;
    transition: box-shadow .12s ease, border-color .12s ease, transform .10s ease;
}

    .cf-input:focus[b-bnktaf3cdh] {
        border-color: rgba(18, 83, 163, .55);
        box-shadow: 0 0 0 4px rgba(18, 83, 163, .14);
    }

.cf-select[b-bnktaf3cdh] {
    appearance: none;
    background-image: linear-gradient(45deg, transparent 50%, #2b5fa5 50%), linear-gradient(135deg, #2b5fa5 50%, transparent 50%), linear-gradient(to right, rgba(18,83,163,.15), rgba(18,83,163,.15));
    background-position: calc(100% - 18px) 18px, calc(100% - 12px) 18px, calc(100% - 44px) 50%;
    background-size: 6px 6px, 6px 6px, 1px 60%;
    background-repeat: no-repeat;
    padding-right: 52px;
}

/* Radio group */
.cf-radio[b-bnktaf3cdh] {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
    padding: 6px 8px;
    border-radius: 12px;
    background: #f5f9ff;
    border: 1px solid rgba(18, 83, 163, .14);
    height: 42px;
}

    .cf-radio label[b-bnktaf3cdh] {
        display: flex;
        align-items: center;
        gap: 6px;
        font-weight: 800;
        font-size: .92rem;
        color: #163b6c;
        cursor: pointer;
        user-select: none;
    }

    .cf-radio input[type="radio"][b-bnktaf3cdh] {
        width: 16px;
        height: 16px;
        accent-color: #1253a3;
    }

/* Buttons */
.cf-btn[b-bnktaf3cdh] {
    border: none;
    border-radius: 12px;
    height: 42px;
    padding: 0 16px;
    font-weight: 900;
    cursor: pointer;
    transition: transform .08s ease, box-shadow .12s ease, filter .12s ease;
}

    .cf-btn:active[b-bnktaf3cdh] {
        transform: translateY(1px);
    }

.cf-btn-blue[b-bnktaf3cdh] {
    background: linear-gradient(180deg, #1a66c7 0%, #1253a3 100%);
    color: #fff;
    box-shadow: 0 10px 18px rgba(18,83,163,.22);
}

    .cf-btn-blue:hover[b-bnktaf3cdh] {
        filter: brightness(1.03);
        box-shadow: 0 12px 22px rgba(18,83,163,.26);
    }

/* ===== VENDEDOR CARD ===== */
.cf-vendedor-card[b-bnktaf3cdh] {
    background: #ffffff;
    border-radius: 16px;
    padding: 14px;
    border: 1px solid rgba(18,83,163,.16);
    box-shadow: 0 8px 18px rgba(0,0,0,.08);
}

.cf-date-row[b-bnktaf3cdh] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.cf-date-input[b-bnktaf3cdh] {
    flex: 1 1 auto;
}

.cf-date-btn[b-bnktaf3cdh] {
    padding: 10px 12px;
    flex: 0 0 auto;
}

.cf-vendedor-card-mobile-safe[b-bnktaf3cdh] {
    margin-top: 12px;
}

.cf-vendedor-title[b-bnktaf3cdh] {
    font-weight: 900;
    color: #153e75;
    font-size: 1.05rem;
}

.cf-vendedor-info[b-bnktaf3cdh] {
    margin-top: 6px;
    color: #123;
}

.cf-vendedor-row[b-bnktaf3cdh] {
    margin-bottom: 2px;
}

/* ===== ACTION CARDS ===== */
.cf-actions[b-bnktaf3cdh] {
    display: grid;
    grid-template-columns: repeat(4, minmax(180px, 1fr));
    gap: 12px;
    margin-top: 14px;
}


.cf-card[b-bnktaf3cdh] {
    width: 100%;
    text-align: left;
    border: none;
    border-radius: 16px;
    padding: 14px;
    cursor: pointer;
    background: #ffffff;
    border: 1px solid rgba(18,83,163,.14);
    box-shadow: 0 8px 18px rgba(0,0,0,.08);
    transition: transform .10s ease, box-shadow .12s ease, border-color .12s ease, filter .12s ease;
}

    .cf-card:hover[b-bnktaf3cdh] {
        transform: translateY(-1px);
        border-color: rgba(18,83,163,.28);
        box-shadow: 0 12px 26px rgba(0,0,0,.12);
    }

    .cf-card:disabled[b-bnktaf3cdh] {
        opacity: .55;
        cursor: not-allowed;
        transform: none;
        filter: grayscale(.25);
    }

.cf-card-top[b-bnktaf3cdh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 6px;
}

.cf-card-title[b-bnktaf3cdh] {
    font-weight: 950;
    color: #153e75;
    font-size: 1.05rem;
}

.cf-card-sub[b-bnktaf3cdh] {
    color: #223a5c;
    font-weight: 650;
    font-size: .95rem;
    opacity: .9;
}

.cf-card-pill[b-bnktaf3cdh] {
    background: #e9f2ff;
    color: #1253a3;
    border: 1px solid rgba(18,83,163,.16);
    font-weight: 900;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: .85rem;
}

/* ===== ERROR ===== */
.cf-error[b-bnktaf3cdh] {
    margin-top: 12px;
    background: #fff2f2;
    border: 1px solid rgba(220, 70, 70, .28);
    color: #7a1111;
    border-radius: 14px;
    padding: 12px 14px;
    font-weight: 900;
}

/* ===== Responsive ===== */
@media (max-width: 980px) {
    .cf-actions[b-bnktaf3cdh] {
        grid-template-columns: 1fr;
    }

    .cf-block[b-bnktaf3cdh] {
        min-width: 220px;
        flex: 1 1 220px;
    }

    .cf-block-btn[b-bnktaf3cdh] {
        width: 100%;
        justify-content: stretch;
    }

    .cf-btn[b-bnktaf3cdh] {
        width: 100%;
    }
}

@media (max-width: 520px) {
    .cf-root[b-bnktaf3cdh] {
        padding: 10px;
    }

    .cf-h1[b-bnktaf3cdh] {
        font-size: 1.25rem;
    }

    .cf-h2[b-bnktaf3cdh] {
        font-size: .92rem;
    }

    .cf-input[b-bnktaf3cdh] {
        height: 40px;
    }

    .cf-radio[b-bnktaf3cdh] {
        height: auto;
        padding: 10px;
    }
}

/* =========================================================
   MODALES SOLO DESDE ConsultaFacturasBanca (Blazor CSS Isolation)
   OJO: en Blazor se usa ::deep (NO :deep)
   ========================================================= */

.cf-root[b-bnktaf3cdh]  .tb-backdrop,
.cf-root[b-bnktaf3cdh]  .rf-backdrop {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(10, 18, 35, .55) !important;
    backdrop-filter: blur(6px) !important;
    z-index: 99990 !important;
}

.cf-root[b-bnktaf3cdh]  .tb-modal,
.cf-root[b-bnktaf3cdh]  .rf-modal,
.cf-root[b-bnktaf3cdh]  .tb-preview,
.cf-root[b-bnktaf3cdh]  .rf-preview {
    position: fixed !important;
    z-index: 99991 !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: min(1100px, calc(100vw - 24px)) !important;
    max-width: min(1100px, calc(100vw - 24px)) !important;
    max-height: calc(100vh - 24px) !important;
    border-radius: 18px !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    box-shadow: 0 18px 55px rgba(0,0,0,.45) !important;
    overflow: hidden !important;
    background: #ffffff !important;
}

.cf-root[b-bnktaf3cdh]  .tb-header,
.cf-root[b-bnktaf3cdh]  .rf-header {
    background: linear-gradient(180deg, #0b3a74 0%, #0f4a92 65%, #1253a3 100%) !important;
    color: #fff !important;
    border-bottom: 1px solid rgba(255,255,255,.12) !important;
}

.cf-root[b-bnktaf3cdh]  .tb-body,
.cf-root[b-bnktaf3cdh]  .rf-body,
.cf-root[b-bnktaf3cdh]  .tb-preview-body,
.cf-root[b-bnktaf3cdh]  .rf-preview-body {
    overflow: auto !important;
    max-height: calc(100vh - 170px) !important;
    background: #ffffff !important;
}

.cf-root[b-bnktaf3cdh]  .tb-close,
.cf-root[b-bnktaf3cdh]  .rf-close {
    width: 38px !important;
    height: 38px !important;
    border-radius: 12px !important;
    border: 1px solid rgba(255,255,255,.25) !important;
    background: rgba(255,255,255,.10) !important;
    color: #fff !important;
    font-weight: 900 !important;
    cursor: pointer !important;
}

/* Botones del modal (solo banca) */
.cf-root[b-bnktaf3cdh]  .tb-btn,
.cf-root[b-bnktaf3cdh]  .rf-btn,
.cf-root[b-bnktaf3cdh]  .tb-mini {
    border-radius: 12px !important;
    font-weight: 900 !important;
}

/* Preview: iframe que use todo el espacio */
.cf-root[b-bnktaf3cdh]  .tb-frame {
    width: 100% !important;
    height: calc(100vh - 240px) !important;
    border: 0 !important;
    background: #fff !important;
}
/* Variante más moderna */
.cf-select[b-bnktaf3cdh],
.cf-select option[b-bnktaf3cdh] {
    font-size: 1.1rem;
    font-family: "Inter", "Segoe UI", system-ui, sans-serif;
    font-weight: 600;
}

/* ===== SELECTOR DE SORTEOS - TEXTO MÁS GRUESO SIN CORTARSE ===== */
.cf-select[b-bnktaf3cdh] {
    font-size: 1.05rem; /* tamaño correcto */
    font-family: "Segoe UI", system-ui, sans-serif;
    font-weight: 600;
    line-height: 1.4; /* 🔴 CLAVE */
    padding: 10px 12px; /* 🔴 CLAVE */
    min-height: 42px; /* 🔴 CLAVE */

    display: flex;
    align-items: center;
}

    /* Opciones del dropdown */
    .cf-select option[b-bnktaf3cdh] {
        font-size: 1.05rem;
        font-family: "Segoe UI", system-ui, sans-serif;
        font-weight: 500;
        padding: 8px 10px;
    }

@media (max-width: 700px) {
    /* =========================
       CONSULTA FACTURAS BANCA
       SOLO MÓVIL
       NO TOCA ESCRITORIO
       ========================= */

    .cf-root[b-bnktaf3cdh] {
        width: 100%;
        padding: 10px;
        box-sizing: border-box;
        overflow-x: hidden;
    }

    /* ===== HERO ===== */
    .cf-hero[b-bnktaf3cdh] {
        border-radius: 14px;
        padding: 14px 14px;
        margin-bottom: 12px;
    }

    .cf-h1[b-bnktaf3cdh] {
        font-size: 1.16rem;
        line-height: 1.2;
    }

    .cf-h2[b-bnktaf3cdh] {
        font-size: 0.92rem;
        line-height: 1.35;
    }

    /* ===== FILTROS ===== */
    .cf-filters[b-bnktaf3cdh] {
        padding: 12px;
        border-radius: 14px;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .cf-block[b-bnktaf3cdh],
    .cf-grow[b-bnktaf3cdh],
    .cf-block-btn[b-bnktaf3cdh] {
        width: 100%;
        min-width: 0;
        flex: 1 1 auto;
    }

    .cf-block[b-bnktaf3cdh] {
        gap: 6px;
    }

    .cf-label[b-bnktaf3cdh] {
        font-size: 0.92rem;
        line-height: 1.2;
    }

    .cf-input[b-bnktaf3cdh],
    .cf-select[b-bnktaf3cdh] {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        min-height: 46px;
        height: 46px;
        font-size: 16px;
        box-sizing: border-box;
    }

    .cf-select[b-bnktaf3cdh] {
        padding-right: 52px;
    }

    /* ===== Juego ===== */
    .cf-radio[b-bnktaf3cdh] {
        height: auto;
        min-height: 0;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        padding: 10px 12px;
    }

        .cf-radio label[b-bnktaf3cdh] {
            width: 100%;
            font-size: 0.96rem;
            line-height: 1.25;
        }

        .cf-radio input[type="radio"][b-bnktaf3cdh] {
            width: 18px;
            height: 18px;
            flex: 0 0 auto;
        }

    /* ===== Fechas ===== */
    .cf-date-row[b-bnktaf3cdh] {
        display: flex;
        align-items: center;
        gap: 8px;
        width: 100%;
        min-width: 0;
    }

    .cf-date-input[b-bnktaf3cdh] {
        flex: 1 1 auto;
        min-width: 0;
    }

    .cf-date-btn[b-bnktaf3cdh] {
        flex: 0 0 46px;
        width: 46px;
        min-width: 46px;
        min-height: 46px;
        height: 46px;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 1rem;
    }

    /* ===== Botón buscar ===== */
    .cf-block-btn[b-bnktaf3cdh] {
        justify-content: stretch;
    }

    .cf-btn[b-bnktaf3cdh] {
        width: 100%;
        min-height: 46px;
        height: 46px;
        font-size: 0.96rem;
        box-sizing: border-box;
    }

    /* ===== Card vendedor ===== */
    .cf-vendedor-card[b-bnktaf3cdh] {
        border-radius: 14px;
        padding: 12px;
    }

    .cf-vendedor-title[b-bnktaf3cdh] {
        font-size: 1rem;
        line-height: 1.2;
    }

    .cf-vendedor-info[b-bnktaf3cdh] {
        margin-top: 8px;
        display: flex;
        flex-direction: column;
        gap: 4px;
        font-size: 0.95rem;
        line-height: 1.35;
        word-break: break-word;
    }

    .cf-vendedor-row[b-bnktaf3cdh] {
        margin: 0;
    }

    /* ===== Action cards ===== */
    .cf-actions[b-bnktaf3cdh],
    .cf-actions-mobile-safe[b-bnktaf3cdh] {
        grid-template-columns: 1fr;
        gap: 10px;
        margin-top: 12px;
    }

    .cf-card[b-bnktaf3cdh] {
        border-radius: 14px;
        padding: 12px;
        min-height: 0;
    }

    .cf-card-top[b-bnktaf3cdh] {
        align-items: flex-start;
        gap: 10px;
    }

    .cf-card-title[b-bnktaf3cdh] {
        font-size: 1rem;
        line-height: 1.2;
    }

    .cf-card-sub[b-bnktaf3cdh] {
        font-size: 0.92rem;
        line-height: 1.35;
    }

    .cf-card-pill[b-bnktaf3cdh] {
        font-size: 0.82rem;
        padding: 5px 9px;
        white-space: nowrap;
    }

    /* ===== Error ===== */
    .cf-error[b-bnktaf3cdh] {
        border-radius: 12px;
        padding: 12px;
        font-size: 0.94rem;
        line-height: 1.35;
    }

    /* =========================================================
       MODALES EMBEBIDOS (Borrados / Reimpresión)
       ========================================================= */

    .cf-root[b-bnktaf3cdh]  .tb-backdrop,
    .cf-root[b-bnktaf3cdh]  .rf-backdrop {
        position: fixed !important;
        inset: 0 !important;
        background: rgba(10, 18, 35, .58) !important;
        backdrop-filter: blur(4px) !important;
        z-index: 99990 !important;
        overflow: hidden !important;
        overscroll-behavior: contain !important;
        touch-action: none !important;
    }

    body:has(.tb-backdrop)[b-bnktaf3cdh],
    body:has(.rf-backdrop)[b-bnktaf3cdh] {
        overflow: hidden !important;
        touch-action: none !important;
        position: fixed;
        width: 100%;
    }

    .cf-root[b-bnktaf3cdh]  .tb-modal,
    .cf-root[b-bnktaf3cdh]  .rf-modal,
    .cf-root[b-bnktaf3cdh]  .tb-preview,
    .cf-root[b-bnktaf3cdh]  .rf-preview {
        position: fixed !important;
        z-index: 99991 !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        width: calc(100vw - 16px) !important;
        max-width: calc(100vw - 16px) !important;
        min-width: 0 !important;
        max-height: 90svh !important;
        border-radius: 14px !important;
        border: 1px solid rgba(255,255,255,.10) !important;
        box-shadow: 0 18px 55px rgba(0,0,0,.45) !important;
        overflow: hidden !important;
        background: #ffffff !important;
        box-sizing: border-box !important;
    }

    .cf-root[b-bnktaf3cdh]  .tb-header,
    .cf-root[b-bnktaf3cdh]  .rf-header {
        padding: 12px 14px !important;
        background: linear-gradient(180deg, #0b3a74 0%, #0f4a92 65%, #1253a3 100%) !important;
        color: #fff !important;
        border-bottom: 1px solid rgba(255,255,255,.12) !important;
    }

    .cf-root[b-bnktaf3cdh]  .tb-body,
    .cf-root[b-bnktaf3cdh]  .rf-body,
    .cf-root[b-bnktaf3cdh]  .tb-preview-body,
    .cf-root[b-bnktaf3cdh]  .rf-preview-body {
        overflow: auto !important;
        max-height: calc(90svh - 130px) !important;
        background: #ffffff !important;
        -webkit-overflow-scrolling: touch !important;
        overscroll-behavior: contain !important;
        touch-action: pan-y !important;
        padding: 12px !important;
        box-sizing: border-box !important;
    }

    .cf-root[b-bnktaf3cdh]  .tb-close,
    .cf-root[b-bnktaf3cdh]  .rf-close {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        min-height: 40px !important;
        border-radius: 12px !important;
        border: 1px solid rgba(255,255,255,.25) !important;
        background: rgba(255,255,255,.10) !important;
        color: #fff !important;
        font-weight: 900 !important;
        cursor: pointer !important;
        flex: 0 0 auto !important;
    }

    .cf-root[b-bnktaf3cdh]  .tb-btn,
    .cf-root[b-bnktaf3cdh]  .rf-btn,
    .cf-root[b-bnktaf3cdh]  .tb-mini {
        border-radius: 12px !important;
        font-weight: 900 !important;
        min-height: 44px !important;
    }

    .cf-root[b-bnktaf3cdh]  .tb-frame {
        width: 100% !important;
        height: calc(90svh - 190px) !important;
        border: 0 !important;
        background: #fff !important;
    }

    /* ===== Blindaje ===== */
    html[b-bnktaf3cdh],
    body[b-bnktaf3cdh] {
        overflow-x: hidden;
    }

    .cf-root *[b-bnktaf3cdh],
    .cf-root[b-bnktaf3cdh]  * {
        box-sizing: border-box;
        min-width: 0;
        max-width: 100%;
    }
}
/* _content/SistemaLoteriaDashboard/Components/Banca/ConsultaFacturasxNumero.razor.rz.scp.css */
.cfxn-card[b-efx9p5oz1r] {
    background: #fff;
    border-radius: 16px;
    padding: 16px;
    box-shadow: 0 10px 30px rgba(0,0,0,.08);
}

.cfxn-title[b-efx9p5oz1r] {
    font-weight: 950;
    font-size: 1.35rem;
    color: #153e75;
    margin-bottom: 12px;
}

.cfxn-wrap[b-efx9p5oz1r] {
    padding: 4px 2px 2px;
}

.cfxn-filtros[b-efx9p5oz1r] {
    display: grid;
    grid-template-columns: 170px 240px 240px 180px 180px 140px;
    gap: 12px;
    align-items: end;
    margin-bottom: 14px;
}

.cfxn-field[b-efx9p5oz1r] {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.cfxn-lbl[b-efx9p5oz1r] {
    font-weight: 900;
    color: #153e75;
    font-size: 1rem;
}

.cfxn-select[b-efx9p5oz1r],
.cfxn-input[b-efx9p5oz1r] {
    border: 1px solid #d6e2f2;
    border-radius: 12px;
    padding: 10px 12px;
    outline: none;
    background: #fff;
    font-weight: 850;
    color: #10233b;
    font-size: 1.02rem;
}

    .cfxn-select:focus[b-efx9p5oz1r],
    .cfxn-input:focus[b-efx9p5oz1r] {
        border-color: #153e75;
        box-shadow: 0 0 0 4px rgba(21,62,117,.12);
    }

.cfxn-btn[b-efx9p5oz1r],
.cfxn-btn-mini[b-efx9p5oz1r] {
    border: none;
    border-radius: 12px;
    min-height: 38px;
    padding: 0 14px;
    font-weight: 950;
    color: #fff;
    cursor: pointer;
    background: linear-gradient(180deg,#153e75,#0f2f5c);
    box-shadow: 0 10px 20px rgba(0,0,0,.12);
}

.cfxn-btn[b-efx9p5oz1r] {
    height: 44px;
    font-size: 1.02rem;
}

.cfxn-btn-mini[b-efx9p5oz1r] {
    min-height: 34px;
    font-size: .92rem;
}

    .cfxn-btn:hover[b-efx9p5oz1r],
    .cfxn-btn-mini:hover[b-efx9p5oz1r] {
        filter: brightness(1.05);
    }

.cfxn-btn-sec[b-efx9p5oz1r] {
    border: 1px solid #d6e2f2;
    border-radius: 14px;
    height: 44px;
    padding: 0 16px;
    font-weight: 950;
    font-size: 1.02rem;
    color: #153e75;
    cursor: pointer;
    background: #fff;
}

    .cfxn-btn-sec:hover[b-efx9p5oz1r] {
        background: #f3f7ff;
    }

.cfxn-error[b-efx9p5oz1r] {
    margin: 10px 0 12px;
    background: #ffe9e9;
    border: 1px solid #ffb7b7;
    color: #8a1111;
    padding: 12px 14px;
    border-radius: 14px;
    font-weight: 950;
    font-size: 1.02rem;
}

.cfxn-grid[b-efx9p5oz1r] {
    display: grid;
    grid-template-columns: repeat(10, 1fr);
    gap: 10px;
    margin-top: 6px;
}

.cfxn-num[b-efx9p5oz1r] {
    border: 1px solid #d7e2f1;
    background: linear-gradient(180deg,#ffffff,#f3f7ff);
    border-radius: 14px;
    padding: 12px 0;
    font-weight: 950;
    font-size: 1.08rem;
    color: #153e75;
    cursor: pointer;
    transition: transform .06s ease, box-shadow .06s ease;
}

    .cfxn-num:hover[b-efx9p5oz1r] {
        transform: translateY(-1px);
        box-shadow: 0 12px 22px rgba(0,0,0,.10);
    }

    .cfxn-num.sel[b-efx9p5oz1r] {
        background: linear-gradient(180deg,#153e75,#0f2f5c);
        color: #fff;
        border-color: #0f2f5c;
    }

.cfxn-info[b-efx9p5oz1r] {
    margin-top: 14px;
    padding: 14px;
    border-radius: 14px;
    background: #f6f8fb;
    border: 1px solid #e4eaf3;
    font-weight: 900;
    font-size: 1.05rem;
    color: #364a63;
}

/* MODALES */

.cfxn-backdrop[b-efx9p5oz1r] {
    position: fixed;
    inset: 0;
    background: rgba(10,18,35,.45);
    z-index: 9998;
}

.cfxn-modal[b-efx9p5oz1r],
.cfxn-preview[b-efx9p5oz1r] {
    position: fixed;
    inset: 0;
    margin: auto;
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 22px 60px rgba(0,0,0,.28);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.cfxn-modal[b-efx9p5oz1r] {
    width: min(980px, 94vw);
    height: auto;
    max-height: 88vh;
}

.cfxn-preview[b-efx9p5oz1r] {
    width: min(1050px, 96vw);
    height: min(780px, 94vh);
}

.cfxn-mh[b-efx9p5oz1r],
.cfxn-ph[b-efx9p5oz1r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    border-bottom: 1px solid #e7edf6;
    background: linear-gradient(180deg,#ffffff,#f7faff);
}

.cfxn-mt[b-efx9p5oz1r],
.cfxn-pt[b-efx9p5oz1r] {
    font-weight: 950;
    font-size: 1.12rem;
    color: #153e75;
}

.cfxn-pill[b-efx9p5oz1r] {
    display: inline-block;
    padding: 3px 12px;
    border-radius: 999px;
    background: #153e75;
    color: #fff;
    font-weight: 950;
}

.cfxn-x[b-efx9p5oz1r] {
    border: none;
    background: transparent;
    font-size: 1.25rem;
    font-weight: 950;
    cursor: pointer;
    color: #234;
}

.cfxn-mb[b-efx9p5oz1r],
.cfxn-pb[b-efx9p5oz1r] {
    padding: 12px 14px;
    overflow: auto;
    flex: 1;
}

.cfxn-pb[b-efx9p5oz1r] {
    background: #fff;
}

.cfxn-mf[b-efx9p5oz1r],
.cfxn-pf[b-efx9p5oz1r] {
    padding: 12px 14px;
    border-top: 1px solid #e7edf6;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    background: #fff;
}

.cfxn-frame[b-efx9p5oz1r] {
    width: 100%;
    height: 100%;
    border: 0;
}

/* LISTA DE FACTURAS DEL NÚMERO */

.cfxn-head[b-efx9p5oz1r],
.cfxn-row[b-efx9p5oz1r] {
    display: grid;
    grid-template-columns: 100px minmax(180px, 1fr) 220px 140px 90px;
    gap: 10px;
    align-items: center;
}

.cfxn-head[b-efx9p5oz1r] {
    font-weight: 950;
    font-size: 1.02rem;
    color: #153e75;
    padding: 12px;
    border-radius: 14px;
    background: linear-gradient(180deg,#eef5ff,#f8fbff);
    border: 1px solid #d9e7fb;
    position: sticky;
    top: 0;
    z-index: 1;
}

.cfxn-row[b-efx9p5oz1r] {
    padding: 12px;
    border: 1px solid #eef3fb;
    border-radius: 12px;
    background: #fff;
    margin-top: 6px;
}

    .cfxn-row:hover[b-efx9p5oz1r] {
        background: #fafcff;
    }

.cfxn-cell[b-efx9p5oz1r] {
    font-weight: 850;
    font-size: 1.02rem;
    color: #123;
}

.cfxn-right[b-efx9p5oz1r] {
    text-align: right;
}

.cfxn-act[b-efx9p5oz1r] {
    display: flex;
    justify-content: flex-end;
}

/* MODAL TICKET */

.cfxn-modal-ticket[b-efx9p5oz1r] {
    width: min(760px, 94vw);
    height: auto;
    max-height: 88vh;
}

.cfxn-modal-ticket-shell[b-efx9p5oz1r] {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}

.cfxn-ticket-modal-box[b-efx9p5oz1r] {
    background: #fff;
    border-radius: 16px;
    width: 100%;
    max-width: 760px;
    max-height: 88vh;
    overflow: auto;
    box-shadow: 0 22px 65px rgba(0,0,0,.35);
}

.cfxn-ticket-modal-head[b-efx9p5oz1r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.cfxn-ticket-modal-body[b-efx9p5oz1r] {
    padding: 16px;
    background: #f7f9fd;
}

.cfxn-ticket-wrap[b-efx9p5oz1r] {
    display: flex;
    justify-content: center;
    padding: 10px 0;
}

.cfxn-actions-mobile-safe[b-efx9p5oz1r] {
    margin-top: 12px;
    display: flex;
    gap: 10px;
    align-items: center;
}

.ticket-preview-box[b-efx9p5oz1r] {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 16px;
    background: #f3f6fb;
    border-radius: 14px;
}

.cfxn-ticket-img[b-efx9p5oz1r],
.cfxn-ticket-img-mobile-safe[b-efx9p5oz1r] {
    width: 340px;
    max-width: 100%;
    height: auto;
    image-rendering: auto;
    border-radius: 10px;
}

.ticket-preview-box img[b-efx9p5oz1r] {
    background: white;
    border: 2px solid #d0d0d0;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.18);
    padding: 8px;
}

/* TICKET OCULTO QUE SE CAPTURA */

#pos-ticket[b-efx9p5oz1r],
#pos-ticket-parley[b-efx9p5oz1r],
#pos-ticket-monazo[b-efx9p5oz1r] {
    width: 58mm !important;
    max-width: 58mm !important;
    background: #fff !important;
    color: #000 !important;
    font-family: Arial, sans-serif !important;
    font-size: 8.8px !important;
    line-height: 1.05 !important;
    padding: 5px !important;
    box-sizing: border-box !important;
}

    #pos-ticket .pos-center[b-efx9p5oz1r],
    #pos-ticket-parley .pos-center[b-efx9p5oz1r],
    #pos-ticket-monazo .pos-center[b-efx9p5oz1r] {
        text-align: center !important;
    }

    #pos-ticket .pos-title[b-efx9p5oz1r],
    #pos-ticket-parley .pos-title[b-efx9p5oz1r],
    #pos-ticket-monazo .pos-title[b-efx9p5oz1r] {
        font-size: 11px !important;
        line-height: 1 !important;
        font-weight: 900 !important;
        text-align: center !important;
        margin: 0 0 2px 0 !important;
        word-break: normal !important;
    }

    #pos-ticket .pos-sub[b-efx9p5oz1r],
    #pos-ticket-parley .pos-sub[b-efx9p5oz1r],
    #pos-ticket-monazo .pos-sub[b-efx9p5oz1r] {
        font-size: 8.8px !important;
        line-height: 1.08 !important;
        font-weight: 700 !important;
        text-align: center !important;
        margin: 0 !important;
    }

    #pos-ticket .pos-meta[b-efx9p5oz1r],
    #pos-ticket-parley .pos-meta[b-efx9p5oz1r],
    #pos-ticket-monazo .pos-meta[b-efx9p5oz1r] {
        font-size: 8.3px !important;
        line-height: 1.08 !important;
        text-align: center !important;
        margin: 0 !important;
    }

    #pos-ticket .pos-hr[b-efx9p5oz1r],
    #pos-ticket-parley .pos-hr[b-efx9p5oz1r],
    #pos-ticket-monazo .pos-hr[b-efx9p5oz1r] {
        margin: 3px 0 !important;
        border: 0 !important;
        border-top: 1px dashed #000 !important;
    }

    /* TABLAS DEL TICKET */

    #pos-ticket .pos-lines[b-efx9p5oz1r],
    #pos-ticket-parley .pos-lines[b-efx9p5oz1r],
    #pos-ticket-monazo .pos-lines[b-efx9p5oz1r] {
        width: 94% !important;
        margin: 0 auto !important;
        table-layout: fixed !important;
        border-collapse: collapse !important;
        font-size: 8.4px !important;
    }

        #pos-ticket .pos-lines th[b-efx9p5oz1r],
        #pos-ticket .pos-lines td[b-efx9p5oz1r],
        #pos-ticket-parley .pos-lines th[b-efx9p5oz1r],
        #pos-ticket-parley .pos-lines td[b-efx9p5oz1r],
        #pos-ticket-monazo .pos-lines th[b-efx9p5oz1r],
        #pos-ticket-monazo .pos-lines td[b-efx9p5oz1r] {
            padding: 0 !important;
            font-size: 8.4px !important;
            line-height: 1.02 !important;
            white-space: nowrap !important;
            overflow: hidden !important;
            text-overflow: clip !important;
            vertical-align: middle !important;
        }

            /* TIEMPOS NORMAL */

            #pos-ticket .pos-lines th.c-num[b-efx9p5oz1r],
            #pos-ticket .pos-lines td.c-num[b-efx9p5oz1r] {
                width: 28% !important;
                min-width: 28% !important;
                max-width: 28% !important;
                text-align: center !important;
            }

            #pos-ticket .pos-lines th.c-m[b-efx9p5oz1r],
            #pos-ticket .pos-lines td.c-m[b-efx9p5oz1r] {
                width: 36% !important;
                min-width: 36% !important;
                max-width: 36% !important;
                text-align: center !important;
            }

            #pos-ticket .pos-lines th.c-r[b-efx9p5oz1r],
            #pos-ticket .pos-lines td.c-r[b-efx9p5oz1r] {
                width: 36% !important;
                min-width: 36% !important;
                max-width: 36% !important;
                text-align: center !important;
            }

        /* REVENTADO */

        #pos-ticket .pos-lines:has(.c-r) th.c-num[b-efx9p5oz1r],
        #pos-ticket .pos-lines:has(.c-r) td.c-num[b-efx9p5oz1r] {
            width: 18% !important;
            min-width: 18% !important;
            max-width: 18% !important;
            text-align: center !important;
        }

        #pos-ticket .pos-lines:has(.c-r) th.c-m[b-efx9p5oz1r],
        #pos-ticket .pos-lines:has(.c-r) td.c-m[b-efx9p5oz1r] {
            width: 32% !important;
            min-width: 32% !important;
            max-width: 32% !important;
            text-align: center !important;
        }

        #pos-ticket .pos-lines:has(.c-r) th.c-r[b-efx9p5oz1r],
        #pos-ticket .pos-lines:has(.c-r) td.c-r[b-efx9p5oz1r] {
            width: 50% !important;
            min-width: 50% !important;
            max-width: 50% !important;
            text-align: center !important;
        }

        /* PARLEY */

        #pos-ticket-parley .pos-lines th.c-num[b-efx9p5oz1r],
        #pos-ticket-parley .pos-lines td.c-num[b-efx9p5oz1r] {
            width: 50% !important;
            text-align: center !important;
        }

        #pos-ticket-parley .pos-lines th.c-m[b-efx9p5oz1r],
        #pos-ticket-parley .pos-lines td.c-m[b-efx9p5oz1r] {
            width: 50% !important;
            text-align: center !important;
        }

    /* MONAZOS */

    #pos-ticket-monazo .pos-lines-monazo[b-efx9p5oz1r] {
        width: 96% !important;
    }

    #pos-ticket-monazo .c-num[b-efx9p5oz1r] {
        width: 32% !important;
        text-align: center !important;
    }

    #pos-ticket-monazo .c-mod[b-efx9p5oz1r] {
        width: 34% !important;
        text-align: center !important;
    }

    #pos-ticket-monazo .c-m[b-efx9p5oz1r] {
        width: 34% !important;
        text-align: center !important;
    }

    /* PAGOS, TOTAL Y FOOTER */

    #pos-ticket .pos-payrow[b-efx9p5oz1r],
    #pos-ticket-parley .pos-payrow[b-efx9p5oz1r],
    #pos-ticket-monazo .pos-payrow[b-efx9p5oz1r] {
        display: flex !important;
        justify-content: center !important;
        gap: 3px !important;
        flex-wrap: wrap !important;
        font-size: 8px !important;
        line-height: 1.05 !important;
        text-align: center !important;
    }

    #pos-ticket .pos-total-row[b-efx9p5oz1r],
    #pos-ticket-parley .pos-total-row[b-efx9p5oz1r],
    #pos-ticket-monazo .pos-total-row[b-efx9p5oz1r] {
        display: flex !important;
        justify-content: space-between !important;
        font-size: 10px !important;
        font-weight: 900 !important;
        line-height: 1.08 !important;
    }

    #pos-ticket .pos-msg[b-efx9p5oz1r],
    #pos-ticket-parley .pos-msg[b-efx9p5oz1r],
    #pos-ticket-monazo .pos-msg[b-efx9p5oz1r] {
        font-size: 8px !important;
        line-height: 1.08 !important;
        text-align: center !important;
        margin-top: 2px !important;
    }

    #pos-ticket .pos-footer[b-efx9p5oz1r],
    #pos-ticket-parley .pos-footer[b-efx9p5oz1r],
    #pos-ticket-monazo .pos-footer[b-efx9p5oz1r] {
        font-size: 8px !important;
        text-align: center !important;
        line-height: 1.05 !important;
    }

/* RESPONSIVE */

@media (max-width: 1100px) {
    .cfxn-filtros[b-efx9p5oz1r] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 700px) {
    .cfxn-card[b-efx9p5oz1r] {
        padding: 12px;
        border-radius: 14px;
        overflow-x: hidden;
    }

    .cfxn-title[b-efx9p5oz1r] {
        font-size: 1.12rem;
        line-height: 1.25;
        margin-bottom: 10px;
    }

    .cfxn-filtros[b-efx9p5oz1r] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        margin-bottom: 12px;
    }

    .cfxn-field[b-efx9p5oz1r] {
        width: 100%;
        min-width: 0;
    }

    .cfxn-lbl[b-efx9p5oz1r] {
        font-size: .94rem;
        line-height: 1.2;
    }

    .cfxn-select[b-efx9p5oz1r],
    .cfxn-input[b-efx9p5oz1r] {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        min-height: 46px;
        height: 46px;
        font-size: 16px;
        box-sizing: border-box;
    }

    .cfxn-btn[b-efx9p5oz1r],
    .cfxn-btn-sec[b-efx9p5oz1r],
    .cfxn-btn-mini[b-efx9p5oz1r] {
        width: 100%;
        min-height: 46px;
        box-sizing: border-box;
        font-size: .96rem;
        padding: 10px 12px;
        border-radius: 12px;
        text-align: center;
    }

    .cfxn-grid[b-efx9p5oz1r] {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 8px;
        margin-top: 8px;
    }

    .cfxn-num[b-efx9p5oz1r] {
        min-height: 58px;
        padding: 10px 0;
        border-radius: 12px;
        font-size: 1rem;
    }

    .cfxn-info[b-efx9p5oz1r],
    .cfxn-error[b-efx9p5oz1r] {
        padding: 12px;
        border-radius: 12px;
        font-size: .94rem;
        line-height: 1.35;
    }

    .cfxn-backdrop[b-efx9p5oz1r] {
        background: rgba(10,18,35,.52);
        overflow: hidden;
        overscroll-behavior: contain;
        touch-action: none;
    }

    .cfxn-modal[b-efx9p5oz1r],
    .cfxn-preview[b-efx9p5oz1r] {
        width: calc(100vw - 16px);
        max-width: calc(100vw - 16px);
        height: auto;
        max-height: 90svh;
        min-width: 0;
        border-radius: 14px;
    }

    .cfxn-mh[b-efx9p5oz1r],
    .cfxn-ph[b-efx9p5oz1r] {
        padding: 12px 14px;
        gap: 10px;
    }

    .cfxn-mt[b-efx9p5oz1r],
    .cfxn-pt[b-efx9p5oz1r] {
        font-size: .98rem;
        line-height: 1.25;
    }

    .cfxn-x[b-efx9p5oz1r] {
        min-width: 40px;
        min-height: 40px;
        border-radius: 10px;
    }

    .cfxn-mb[b-efx9p5oz1r],
    .cfxn-pb[b-efx9p5oz1r] {
        padding: 12px;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-y;
    }

    .cfxn-mf[b-efx9p5oz1r],
    .cfxn-pf[b-efx9p5oz1r] {
        padding: 10px 12px 12px;
        display: flex;
        flex-direction: column;
        gap: 8px;
        justify-content: stretch;
    }

    .cfxn-head[b-efx9p5oz1r],
    .cfxn-row[b-efx9p5oz1r] {
        min-width: 760px;
        grid-template-columns: 110px 180px 190px 130px 110px;
        gap: 10px;
    }

    .cfxn-cell[b-efx9p5oz1r] {
        font-size: .94rem;
        line-height: 1.25;
    }

    .cfxn-modal-ticket-shell[b-efx9p5oz1r] {
        align-items: flex-start;
        justify-content: center;
        padding: 10px;
        overflow: hidden;
        overscroll-behavior: contain;
        touch-action: none;
    }

    .cfxn-ticket-modal-box[b-efx9p5oz1r] {
        width: calc(100vw - 20px);
        max-width: calc(100vw - 20px);
        max-height: 90svh;
        border-radius: 14px;
        overflow: hidden;
        display: flex;
        flex-direction: column;
    }

    .cfxn-ticket-modal-body[b-efx9p5oz1r] {
        padding: 12px;
        overflow: auto;
        max-height: calc(90svh - 72px);
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-y;
    }

    .cfxn-actions-mobile-safe[b-efx9p5oz1r] {
        margin-top: 12px;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    .ticket-preview-box[b-efx9p5oz1r] {
        padding: 12px;
        border-radius: 12px;
        margin-top: 10px;
    }

    .cfxn-ticket-img[b-efx9p5oz1r],
    .cfxn-ticket-img-mobile-safe[b-efx9p5oz1r] {
        width: 100%;
        max-width: 320px;
        height: auto;
    }

    html[b-efx9p5oz1r],
    body[b-efx9p5oz1r] {
        overflow-x: hidden;
    }

    .cfxn-card *[b-efx9p5oz1r],
    .cfxn-modal *[b-efx9p5oz1r],
    .cfxn-preview *[b-efx9p5oz1r],
    .cfxn-ticket-modal-box *[b-efx9p5oz1r] {
        box-sizing: border-box;
        min-width: 0;
        max-width: 100%;
    }
}

#pos-ticket .pos-lines-rvta[b-efx9p5oz1r] {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
    font-size: 7.6px !important;
}

    #pos-ticket .pos-lines-rvta .col-num[b-efx9p5oz1r] {
        width: 17% !important;
    }

    #pos-ticket .pos-lines-rvta .col-monto[b-efx9p5oz1r] {
        width: 41.5% !important;
    }

    #pos-ticket .pos-lines-rvta .col-rvta[b-efx9p5oz1r] {
        width: 41.5% !important;
    }

    #pos-ticket .pos-lines-rvta th[b-efx9p5oz1r],
    #pos-ticket .pos-lines-rvta td[b-efx9p5oz1r] {
        padding: 0 !important;
        margin: 0 !important;
        line-height: 1 !important;
        font-size: 7.6px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-align: center !important;
        vertical-align: middle !important;
    }

    #pos-ticket .pos-lines-rvta .c-num[b-efx9p5oz1r] {
        text-align: center !important;
    }

    #pos-ticket .pos-lines-rvta .c-m[b-efx9p5oz1r],
    #pos-ticket .pos-lines-rvta .c-r[b-efx9p5oz1r] {
        text-align: center !important;
    }
/* _content/SistemaLoteriaDashboard/Components/Banca/ConsultaTotalesBanca.razor.rz.scp.css */
/* =========================
   CONSULTAS TOTALES (CG)
   ========================= */

.cg-header[b-v8srgo288g] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 14px;
}

.cg-shell[b-v8srgo288g] {
    width: 100%;
    max-width: none;
    min-height: calc(100dvh - 200px);
    padding: 22px 26px 30px;
    box-sizing: border-box;
    overflow: visible;
    display: flex;
    flex-direction: column;
}

.cg-title[b-v8srgo288g] {
    margin: 0;
    font-size: 30px;
    font-weight: 900;
    letter-spacing: .2px;
}

/* =========================
   FILTROS
   ========================= */
.cg-filters[b-v8srgo288g] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
    flex: 1 1 auto;
    min-height: calc(100dvh - 300px);
    padding: 18px;
    border-radius: 18px;
    background: rgba(255,255,255,.96);
    border: 1px solid rgba(15,23,42,.14);
    box-shadow: 0 18px 40px rgba(15,23,42,.12);
    overflow: visible;
    position: relative;
    z-index: 30;
}

.cg-filters-row[b-v8srgo288g] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 14px 18px;
    width: 100%;
    overflow: visible;
}

.cg-field[b-v8srgo288g] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.cg-vendedor-field[b-v8srgo288g] {
    flex: 0 1 380px;
    width: 380px;
    max-width: 100%;
    min-width: 260px;
    position: relative;
}

.cg-date-field[b-v8srgo288g] {
    flex: 0 0 200px;
    width: 200px;
    max-width: 100%;
    min-width: 160px;
}

.cg-action-field[b-v8srgo288g] {
    flex: 0 0 auto;
}

.cg-label-invisible[b-v8srgo288g] {
    visibility: hidden;
    height: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.cg-vendedor-wrap[b-v8srgo288g] {
    position: relative;
    width: 100%;
    max-width: 380px;
}

.cg-vendedor-input[b-v8srgo288g] {
    width: 100%;
    height: 56px;
    padding: 0 56px 0 16px;
    border-radius: 16px;
    font-size: 17px;
    font-weight: 800;
}

.cg-vendedor-toggle[b-v8srgo288g] {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    width: 38px;
    height: 38px;
    border-radius: 12px;
    border: 1px solid rgba(37,99,235,.16);
    background: linear-gradient(180deg, #ffffff, #eef4ff);
    cursor: pointer;
    font-size: 15px;
    font-weight: 900;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    z-index: 3;
    box-shadow: 0 8px 18px rgba(15,23,42,.10);
    transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
}

    .cg-vendedor-toggle:hover[b-v8srgo288g] {
        transform: translateY(-50%) scale(1.03);
        box-shadow: 0 12px 24px rgba(15,23,42,.14);
        background: linear-gradient(180deg, #ffffff, #e8f0ff);
    }

.cg-vendedor-dropdown[b-v8srgo288g] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    width: 100%;
    min-width: 100%;
    max-width: 380px;
    max-height: min(560px, calc(100dvh - 280px));
    z-index: 200;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border: 1px solid rgba(15,23,42,.12);
    box-shadow: 0 24px 56px rgba(15,23,42,.22);
    overflow: hidden;
    box-sizing: border-box;
}

label.cg-vendedor-item[b-v8srgo288g] {
    cursor: pointer;
    margin: 0;
}

.cg-vendedor-item-todos[b-v8srgo288g] {
    border-bottom: 1px solid rgba(15,23,42,.10);
    background: #f8fbff;
}

.cg-vendedor-dropdown-head[b-v8srgo288g] {
    padding: 10px 14px;
    font-size: 0.88rem;
    font-weight: 800;
    color: #52627a;
    border-bottom: 1px solid rgba(15,23,42,.08);
    flex-shrink: 0;
    background: #f8fbff;
}

.cg-vendedor-dropdown .cg-vendedor-actions[b-v8srgo288g] {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-top: 1px solid rgba(15,23,42,.08);
    flex-shrink: 0;
    flex-wrap: wrap;
    background: #fff;
}

.cg-vendedor-empty[b-v8srgo288g] {
    padding: 16px 18px;
    color: #52627a;
    font-size: .95rem;
}

.cg-vendedor-list[b-v8srgo288g] {
    overflow-y: auto;
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    background: #fff;
    -webkit-overflow-scrolling: touch;
}

.cg-vendedor-item[b-v8srgo288g] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-bottom: 1px solid rgba(15,23,42,.06);
    transition: background .12s ease;
    cursor: pointer;
}

    .cg-vendedor-item:hover[b-v8srgo288g] {
        background: rgba(37,99,235,.06);
    }

    .cg-vendedor-item.is-selected[b-v8srgo288g] {
        background: rgba(37,99,235,.10);
    }

.cg-vendedor-check[b-v8srgo288g] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    flex: 0 0 auto;
}

.cg-vendedor-item-text[b-v8srgo288g] {
    flex: 1;
    min-width: 0;
}

.cg-vendedor-item-name[b-v8srgo288g] {
    font-weight: 900;
    color: #153e75;
    line-height: 1.2;
    word-break: break-word;
}

.cg-vendedor-item-user[b-v8srgo288g] {
    font-weight: 700;
    color: #52627a;
}

.cg-vendedor-item-id[b-v8srgo288g] {
    font-size: .90rem;
    color: #64748b;
    margin-top: 3px;
}

.cg-vendedor-selected-info[b-v8srgo288g] {
    margin-top: 14px;
    width: 100%;
    padding: 14px 16px;
    border-radius: 16px;
    background: linear-gradient(180deg, #f8fbff, #eef4ff);
    border: 1px solid rgba(37,99,235,.18);
    box-shadow: 0 12px 28px rgba(15,23,42,.08);
}

.cg-vendedor-selected-title[b-v8srgo288g] {
    font-size: 12px;
    font-weight: 900;
    color: #1d4ed8;
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: .45px;
}

.cg-vendedor-selected-text[b-v8srgo288g] {
    font-size: 17px;
    font-weight: 900;
    color: #0f172a;
    line-height: 1.35;
}

.cg-vendedor-selected-ids[b-v8srgo288g] {
    margin-top: 6px;
    font-size: 13px;
    color: #52627a;
    line-height: 1.35;
    word-break: break-word;
}




/* =========================
   BOTÓN VER
   ========================= */
.cg-btn[b-v8srgo288g] {
    height: 56px;
    min-width: 112px;
    padding: 0 22px;
    border-radius: 16px;
    border: none;
    cursor: pointer;
    font-weight: 900;
    font-size: 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: linear-gradient(180deg,#2563eb,#1d4ed8);
    color: #fff;
    box-shadow: 0 16px 34px rgba(37,99,235,.25);
    transition: transform .12s ease, box-shadow .12s ease, opacity .12s ease;
    white-space: nowrap;
}

    .cg-btn:hover[b-v8srgo288g] {
        transform: translateY(-1px);
        box-shadow: 0 20px 44px rgba(37,99,235,.28);
    }

    .cg-btn:disabled[b-v8srgo288g] {
        opacity: .65;
        cursor: not-allowed;
        transform: none;
        box-shadow: none;
    }

    .cg-btn:hover[b-v8srgo288g] {
        transform: translateY(-1px);
        box-shadow: 0 20px 44px rgba(37,99,235,.28);
    }

    .cg-btn:disabled[b-v8srgo288g] {
        opacity: .65;
        cursor: not-allowed;
        transform: none;
        box-shadow: none;
    }

.cg-btn-ico[b-v8srgo288g] {
    font-size: 18px;
    filter: drop-shadow(0 8px 14px rgba(0,0,0,.18));
}

/* =========================
   MENSAJES
   ========================= */
.cg-hint[b-v8srgo288g] {
    margin-top: 14px;
    padding: 12px;
    border-radius: 14px;
    border: 1px dashed rgba(148,163,184,.65);
    background: rgba(2,132,199,.06);
}

.cg-alert[b-v8srgo288g] {
    margin-top: 14px;
    padding: 12px;
    border-radius: 14px;
    border: 1px solid rgba(148,163,184,.45);
    background: rgba(15,23,42,.03);
}

    .cg-alert .t[b-v8srgo288g] {
        font-weight: 900;
        margin-bottom: 4px;
    }

    .cg-alert .m[b-v8srgo288g] {
        opacity: .85;
    }

.cg-alert-danger[b-v8srgo288g] {
    border-color: rgba(239,68,68,.40);
    background: rgba(239,68,68,.08);
}

.cg-alert-soft[b-v8srgo288g] {
    border-color: rgba(148,163,184,.45);
    background: rgba(2,132,199,.04);
}

/* =========================
   MODAL FULL SCREEN
   ========================= */
.cg-modal-overlay[b-v8srgo288g] {
    position: fixed;
    inset: 0;
    background: rgba(2,6,23,.55);
    backdrop-filter: blur(6px);
    z-index: 5000;
}

.cg-modal[b-v8srgo288g] {
    position: fixed;
    inset: 18px;
    border-radius: 18px;
    background: rgba(255,255,255,.98);
    border: 1px solid rgba(148,163,184,.40);
    box-shadow: 0 30px 80px rgba(2,6,23,.35);
    z-index: 5100;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.cg-close[b-v8srgo288g] {
    position: absolute;
    top: 10px;
    right: 12px;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    border: 1px solid rgba(148,163,184,.45);
    background: rgba(255,255,255,.95);
    font-size: 22px;
    cursor: pointer;
}

/* =========================
   CABECERA MODAL + CHIPS
   ========================= */
.cg-modal-head[b-v8srgo288g] {
    padding: 18px 18px 10px 18px;
    border-bottom: 1px solid rgba(148,163,184,.45);
    background: linear-gradient(180deg, rgba(59,130,246,.12), rgba(15,23,42,.02));
    flex-shrink: 0;
}

.cg-modal-title[b-v8srgo288g] {
    font-size: 18px;
    font-weight: 950;
}

.cg-modal-sub[b-v8srgo288g] {
    margin-top: 4px;
    opacity: .85;
    font-weight: 800;
}

.cg-chips[b-v8srgo288g] {
    margin-top: 12px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.cg-chip[b-v8srgo288g] {
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(148,163,184,.45); /* 🔥 bordes más visibles */
    background: rgba(255,255,255,.92);
    box-shadow: 0 10px 25px rgba(15,23,42,.08);
    min-width: 150px;
}

    .cg-chip .k[b-v8srgo288g] {
        font-size: 12px;
        opacity: .80;
        font-weight: 900;
    }

    .cg-chip .v[b-v8srgo288g] {
        margin-top: 2px;
        font-size: 16px;
        font-weight: 950;
    }

/* chips suaves (Ahorro / Retiro / Dep) */
.cg-chip-soft[b-v8srgo288g] {
    background: rgba(2,132,199,.06);
}

/* chip fuerte (Saldo final) */
.cg-chip-strong[b-v8srgo288g] {
    background: linear-gradient(180deg, rgba(16,185,129,.18), rgba(15,23,42,.02));
    border-color: rgba(16,185,129,.35);
}

/* ✅ COLORES DE VALORES EN CHIPS (ARRIBA) */
.cg-chip-venta .v[b-v8srgo288g] {
    color: #1e40af;
}
/* azul */
.cg-chip-comi .v[b-v8srgo288g] {
    color: #0284c7;
}
/* celeste */
.cg-chip-prem .v[b-v8srgo288g] {
    color: #dc2626;
}
/* rojo */
.cg-chip-ahorro .v[b-v8srgo288g] {
    color: #7c3aed;
}
/* morado agradable */
.cg-chip-retiro .v[b-v8srgo288g] {
    color: #b45309;
}
/* ámbar/café */
.cg-chip-dep .v[b-v8srgo288g] {
    color: #0f766e;
}
/* teal */

/* ✅ SALDO FINAL ARRIBA (chip) - OSCURO */
.cg-chip-strong .v.saldo-pos[b-v8srgo288g] {
    color: #065f46;
}

.cg-chip-strong .v.saldo-neg[b-v8srgo288g] {
    color: #991b1b;
}

/* =========================
   TABLA
   ========================= */
.cg-table-wrap[b-v8srgo288g] {
    padding: 14px 18px 18px 18px;
    overflow: auto;
    height: 100%;
    border-top: 1px solid rgba(148,163,184,.45); /* 🔥 separador visible */
}

.cg-table[b-v8srgo288g] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    min-width: 1100px;
    margin: 0;
}

    .cg-table thead th[b-v8srgo288g] {
        position: sticky;
        top: 0;
        z-index: 2;
        background: #0f172a;
        color: #fff;
        font-weight: 950;
        font-size: 17px;
        padding: 15px 12px;
        border-bottom: 2px solid rgba(255,255,255,.14); /* 🔥 línea más marcada */
    }

    .cg-table th.num[b-v8srgo288g],
    .cg-table td.num[b-v8srgo288g] {
        text-align: right;
        font-variant-numeric: tabular-nums;
    }

    .cg-table tbody td[b-v8srgo288g] {
        padding: 14px 12px;
        font-size: 18px;
        font-weight: 850;
        border-bottom: 1px solid rgba(148,163,184,.55); /* 🔥 bordes más oscuros */
        background: rgba(255,255,255,.78);
    }

    .cg-table tbody tr:nth-child(even) td[b-v8srgo288g] {
        background: rgba(248,250,252,.95);
    }

    .cg-table tbody tr:nth-child(odd) td[b-v8srgo288g] {
        background: rgba(37,99,235,.10);
    }

    .cg-table tbody tr:hover td[b-v8srgo288g] {
        background: rgba(59,130,246,.22) !important;
    }

    /* columnas de valores (como en consulta sorteos) */
    .cg-table td.venta[b-v8srgo288g] {
        color: #1e40af;
        font-weight: 950;
    }

    .cg-table td.comi[b-v8srgo288g] {
        color: #0284c7;
        font-weight: 950;
    }

    .cg-table td.prem[b-v8srgo288g] {
        color: #dc2626;
        font-weight: 950;
    }

    .cg-table td.soft[b-v8srgo288g] {
        color: #475569;
        opacity: .90;
        font-weight: 850;
    }
    /* gris bonito */

    /* =========================
   ✅ SALDOS
   ========================= */

    /* ✅ Saldo por día = CLARO
   - cubre ambos casos: (pos/neg) y (saldo-pos/saldo-neg)
*/
    .cg-table td.saldo.pos[b-v8srgo288g],
    .cg-table td.saldo.saldo-pos[b-v8srgo288g] {
        color: rgba(5,150,105,1); /* verde claro */
        font-weight: 950;
    }

    .cg-table td.saldo.neg[b-v8srgo288g],
    .cg-table td.saldo.saldo-neg[b-v8srgo288g] {
        color: rgba(220,38,38,1); /* rojo claro */
        font-weight: 950;
    }

    /* =========================
   FOOTER (TOTAL GENERAL)
   ========================= */
    .cg-table tfoot td[b-v8srgo288g] {
        padding: 14px 12px;
        font-weight: 950;
        font-size: 18px;
        background: linear-gradient(180deg, rgba(15,23,42,.22), rgba(15,23,42,.14));
        border-top: 2px solid rgba(15,23,42,.26);
    }

    .cg-table .total-label[b-v8srgo288g] {
        text-transform: uppercase;
        letter-spacing: .5px;
    }

    /* ✅ Saldo final del TOTAL GENERAL = OSCURO */
    .cg-table tfoot .saldo-pos[b-v8srgo288g] {
        color: #065f46;
        font-weight: 950;
    }

    .cg-table tfoot .saldo-neg[b-v8srgo288g] {
        color: #991b1b;
        font-weight: 950;
    }

.cg-cancelado[b-v8srgo288g] {
    margin-top: 4px;
    color: #dc2626;
    font-weight: 800;
    font-size: 12px;
    line-height: 1;
}

.prestamo-tomado .cg-cancelado[b-v8srgo288g] {
    white-space: nowrap;
}

@media (max-width: 700px) {

    /* =========================
       CONTENEDOR GENERAL
       ========================= */
    .cg-shell[b-v8srgo288g] {
        padding: 10px;
        overflow-x: hidden;
        box-sizing: border-box;
    }

    .cg-title[b-v8srgo288g] {
        font-size: 1.2rem;
        line-height: 1.2;
    }

    /* =========================
       FILTROS
       ========================= */
    .cg-filters[b-v8srgo288g] {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        padding: 12px;
        min-height: 0 !important;
        flex: 0 0 auto !important;
    }

    .cg-shell[b-v8srgo288g] {
        min-height: 0 !important;
    }

    .cg-filters-row[b-v8srgo288g] {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
    }

    .cg-field[b-v8srgo288g] {
        flex: 0 0 auto !important;
        width: 100% !important;
        gap: 6px !important;
    }

    .cg-vendedor-field[b-v8srgo288g],
    .cg-date-field[b-v8srgo288g],
    .cg-action-field[b-v8srgo288g] {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .cg-label-invisible[b-v8srgo288g] {
        display: none !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .cg-date-wrap.sl-date-wrap[b-v8srgo288g] {
        width: 100%;
        position: relative;
    }

    .cg-date-picker-btn[b-v8srgo288g],
    .cg-date-wrap .sl-date-picker-btn[b-v8srgo288g] {
        position: absolute !important;
        top: 50% !important;
        right: 8px !important;
        transform: translateY(-50%) !important;
        width: 36px !important;
        height: 36px !important;
        margin: 0 !important;
    }

    .cg-field[b-v8srgo288g] {
        width: 100%;
        min-width: 0 !important;
    }

    .cg-vendedor-field[b-v8srgo288g] {
        min-width: 0 !important;
    }

    .cg-date[b-v8srgo288g] {
        height: 48px;
        min-height: 48px;
        padding: 0 48px 0 14px;
        border-radius: 14px;
        border: 1px solid rgba(15,23,42,.16);
        background: linear-gradient(180deg, #ffffff, #fcfdff);
        outline: none;
        font-size: 17px;
        font-weight: 800;
        color: #0f172a;
        box-shadow: 0 8px 20px rgba(15,23,42,.05);
        transition: border-color .12s ease, box-shadow .12s ease, transform .12s ease;
    }

        .cg-date:focus[b-v8srgo288g] {
            border-color: rgba(37,99,235,.70);
            box-shadow: 0 0 0 4px rgba(37,99,235,.14), 0 12px 24px rgba(37,99,235,.10);
            transform: translateY(-1px);
        }

    /* =========================
   DROPDOWN VENDEDOR
   ========================= */
    .cg-vendedor-wrap[b-v8srgo288g] {
        width: 100%;
        position: relative;
        display: flex;
        gap: 8px;
        align-items: center;
    }

    .cg-vendedor-input[b-v8srgo288g] {
        flex: 1;
        padding-right: 50px !important;
    }

    .cg-vendedor-toggle[b-v8srgo288g] {
        position: absolute;
        top: 50%;
        right: 8px;
        transform: translateY(-50%);
        width: 34px;
        height: 34px;
        border-radius: 10px;
        border: 1px solid rgba(0,0,0,.12);
        background: #fff;
        cursor: pointer;
        font-size: 14px;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        z-index: 2;
    }

    .cg-vendedor-backdrop[b-v8srgo288g] {
        z-index: 9998;
    }

    .cg-vendedor-dropdown[b-v8srgo288g] {
        position: fixed !important;
        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
        width: min(92vw, 400px) !important;
        max-width: min(92vw, 400px) !important;
        max-height: min(72dvh, 520px) !important;
        z-index: 500000 !important;
        background: #fff !important;
        border-radius: 20px !important;
        box-shadow: 0 18px 48px rgba(15, 23, 42, 0.28) !important;
    }

    .cg-vendedor-dropdown.sl-dropdown-panel[b-v8srgo288g] {
        border-radius: 20px;
    }

    .cg-vendedor-list[b-v8srgo288g] {
        min-height: 0;
        flex: 1 1 auto;
    }

    .cg-vendedor-empty[b-v8srgo288g] {
        padding: 14px 16px;
        color: #52627a;
        font-size: .95rem;
    }

    .cg-vendedor-actions[b-v8srgo288g] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 10px;
        padding: 12px 14px;
        border-bottom: 1px solid rgba(0,0,0,.08);
        flex-wrap: wrap;
        background: #fff;
        flex-shrink: 0;
    }

    .cg-vendedor-action[b-v8srgo288g] {
        position: static !important;
        transform: none !important;
        width: auto !important;
        height: auto !important;
        border-radius: 12px !important;
        border: 0 !important;
        background: transparent !important;
        cursor: pointer;
        font-size: 14px !important;
        font-weight: 800;
        padding: 6px 0 !important;
        line-height: 1.2;
        white-space: nowrap;
    }

    .cg-vendedor-action-primary[b-v8srgo288g] {
        color: #153e75;
    }

    .cg-vendedor-action-danger[b-v8srgo288g] {
        color: #a33;
    }

    .cg-vendedor-list[b-v8srgo288g] {
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        flex: 1;
        background: #fff;
    }

    .cg-vendedor-item[b-v8srgo288g] {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 14px 16px;
        border-bottom: 1px solid rgba(15,23,42,.06);
        transition: background .12s ease, transform .12s ease;
    }

        .cg-vendedor-item:hover[b-v8srgo288g] {
            background: rgba(37,99,235,.06);
            transform: translateX(1px);
        }

        .cg-vendedor-item.is-selected[b-v8srgo288g] {
            background: rgba(37,99,235,.10);
        }

    .cg-vendedor-item-name[b-v8srgo288g] {
        font-size: 16px;
        font-weight: 900;
        color: #153e75;
        line-height: 1.2;
        word-break: break-word;
    }

    .cg-vendedor-item-user[b-v8srgo288g] {
        font-weight: 700;
        color: #52627a;
        font-size: 14px;
    }

    .cg-vendedor-item-id[b-v8srgo288g] {
        font-size: 13px;
        color: #64748b;
        margin-top: 4px;
    }

    .cg-vendedor-item-text[b-v8srgo288g] {
        flex: 1;
        min-width: 0;
    }

    .cg-vendedor-check[b-v8srgo288g] {
        width: 18px;
        height: 18px;
        cursor: pointer;
        flex: 0 0 auto;
    }

    /* =========================
       BOTÓN VER
       ========================= */
    .cg-btn[b-v8srgo288g] {
        width: 100%;
        height: 48px;
        font-size: 1rem;
    }

    /* =========================
       MODAL
       ========================= */
    .cg-modal[b-v8srgo288g] {
        inset: 10px !important;
        border-radius: 16px;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        max-height: calc(100dvh - 20px);
    }

    .cg-modal-head[b-v8srgo288g] {
        padding: 14px;
        flex-shrink: 0;
    }

    .cg-modal-title[b-v8srgo288g] {
        font-size: 1.1rem;
    }

    .cg-modal-sub[b-v8srgo288g] {
        font-size: 0.9rem;
    }

    /* =========================
       CHIPS
       ========================= */
    .cg-chips[b-v8srgo288g] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }

    .cg-chip[b-v8srgo288g] {
        min-width: 0;
        width: 100%;
        padding: 10px;
    }

        .cg-chip .k[b-v8srgo288g] {
            font-size: 0.75rem;
        }

        .cg-chip .v[b-v8srgo288g] {
            font-size: 0.95rem;
        }


    /* =========================
   TABLA
   ========================= */
    .cg-table-wrap[b-v8srgo288g] {
        overflow-x: auto;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        padding: 10px;
        flex: 1 1 auto;
        min-height: 220px;
        height: auto;
    }

    .cg-table[b-v8srgo288g] {
        min-width: 1100px !important;
        width: max-content !important;
        border-collapse: separate;
        border-spacing: 0;
    }

        .cg-table thead[b-v8srgo288g] {
            display: table-header-group;
        }

        .cg-table tbody[b-v8srgo288g] {
            display: table-row-group;
        }

        .cg-table tfoot[b-v8srgo288g] {
            display: table-footer-group;
        }

            .cg-table thead th[b-v8srgo288g],
            .cg-table tbody td[b-v8srgo288g],
            .cg-table tfoot td[b-v8srgo288g] {
                display: table-cell;
                white-space: nowrap;
                font-size: 14px !important;
                padding: 10px 12px !important;
                text-align: right;
            }

                .cg-table thead th:first-child[b-v8srgo288g],
                .cg-table tbody td:first-child[b-v8srgo288g],
                .cg-table tfoot td:first-child[b-v8srgo288g] {
                    text-align: left;
                }

            .cg-table tbody tr[b-v8srgo288g],
            .cg-table tfoot tr[b-v8srgo288g] {
                display: table-row;
                width: auto;
                margin: 0;
                background: transparent;
                border: 0;
                border-radius: 0;
                box-shadow: none;
                overflow: visible;
            }


    /* =========================
   SEGURIDAD GENERAL
   ========================= */
    html[b-v8srgo288g], body[b-v8srgo288g] {
        overflow-x: hidden;
    }

    .cg-shell *[b-v8srgo288g],
    .cg-modal *[b-v8srgo288g] {
        box-sizing: border-box;
        min-width: 0;
    }

    .cg-modal-head[b-v8srgo288g] {
        flex-shrink: 0;
    }

    .cg-table-wrap[b-v8srgo288g] {
        flex: 1 1 auto;
        flex-shrink: 1;
    }


    .cg-inline-row[b-v8srgo288g] {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .cg-date-field[b-v8srgo288g] {
        width: 100%;
        min-width: 0;
        max-width: none;
        flex: 1 1 auto;
    }

    .cg-action-field[b-v8srgo288g] {
        width: 100%;
    }

        .cg-action-field .cg-btn[b-v8srgo288g] {
            width: 100%;
        }

    .cg-vendedor-wrap[b-v8srgo288g] {
        width: 100%;
    }

    .cg-vendedor-selected-info[b-v8srgo288g] {
        width: 100%;
        padding: 12px;
    }
}


/* =========================
   DROPDOWN VENDEDOR - BOTONES
   ========================= */
.cg-vendedor-dropdown .cg-vendedor-action[b-v8srgo288g] {
    appearance: none;
    position: static;
    transform: none;
    width: auto;
    height: auto;
    border: 1px solid rgba(37,99,235,.22);
    background: linear-gradient(180deg, #ffffff, #eef4ff);
    color: #153e75;
    border-radius: 10px;
    padding: 6px 12px;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.2;
    cursor: pointer;
    box-shadow: 0 6px 14px rgba(15,23,42,.08);
    transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
}

.cg-vendedor-dropdown .cg-vendedor-action:hover[b-v8srgo288g] {
    transform: translateY(-1px);
    box-shadow: 0 10px 18px rgba(15,23,42,.12);
    background: linear-gradient(180deg, #f8fbff, #e8f0ff);
}

.cg-vendedor-dropdown .cg-vendedor-action-primary[b-v8srgo288g] {
    color: #153e75;
}

.cg-vendedor-dropdown .cg-vendedor-action-danger[b-v8srgo288g] {
    color: #9f1239;
    border-color: rgba(190,24,93,.18);
    background: linear-gradient(180deg, #ffffff, #fff1f2);
}


/* =========================
   TOGGLES CONSULTAS TOTALES
   ========================= */
.cg-toggles[b-v8srgo288g] {
    margin-top: 14px;
    padding: 14px;
    border-radius: 16px;
    border: 1px solid rgba(148,163,184,.40);
    background: rgba(255,255,255,.88);
    box-shadow: 0 10px 24px rgba(15,23,42,.08);
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;
}

.cg-toggles-head[b-v8srgo288g] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-bottom: 4px;
}

.cg-toggles-title[b-v8srgo288g] {
    font-weight: 900;
    font-size: 14px;
    color: #0f172a;
}

.cg-toggles-actions[b-v8srgo288g] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.cg-toggle-btn[b-v8srgo288g] {
    border: none;
    border-radius: 12px;
    padding: 8px 12px;
    font-weight: 900;
    cursor: pointer;
    background: linear-gradient(180deg,#2563eb,#1d4ed8);
    color: #fff;
}

.cg-toggle-btn-soft[b-v8srgo288g] {
    background: #e2e8f0;
    color: #0f172a;
}

.cg-check[b-v8srgo288g] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 12px;
    background: rgba(248,250,252,.95);
    border: 1px solid rgba(148,163,184,.35);
    font-weight: 800;
    white-space: nowrap;
}

    .cg-check input[b-v8srgo288g] {
        width: 16px;
        height: 16px;
        accent-color: #2563eb;
    }

@media (max-width: 700px) {
    .cg-toggles[b-v8srgo288g] {
        padding: 12px;
        gap: 8px;
        max-height: 32vh;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .cg-toggles-head[b-v8srgo288g] {
        flex-direction: column;
        align-items: stretch;
    }

    .cg-toggles-actions[b-v8srgo288g] {
        width: 100%;
        justify-content: stretch;
    }

    .cg-toggle-btn[b-v8srgo288g] {
        flex: 1 1 auto;
        min-height: 42px;
    }

    .cg-check[b-v8srgo288g] {
        width: 100%;
        justify-content: flex-start;
        box-sizing: border-box;
    }
}

/* =========================
   OPCIONES MÓVILES CONSULTAS TOTALES
   ========================= */
.cg-mobile-options-bar[b-v8srgo288g] {
    display: none;
    margin-top: 14px;
}

.cg-mobile-options-btn[b-v8srgo288g] {
    width: 100%;
    min-height: 44px;
    border: none;
    border-radius: 14px;
    padding: 10px 14px;
    font-weight: 900;
    cursor: pointer;
    background: linear-gradient(180deg,#2563eb,#1d4ed8);
    color: #fff;
    box-shadow: 0 10px 22px rgba(37,99,235,.18);
}

@media (max-width: 700px) {
    .cg-mobile-options-bar[b-v8srgo288g] {
        display: block;
        margin-top: 0;
        margin-bottom: 12px;
    }

    .cg-toggles[b-v8srgo288g] {
        display: none;
    }

        .cg-toggles.is-open[b-v8srgo288g] {
            display: flex;
        }

    .cg-date-text[b-v8srgo288g],
    .cg-date[b-v8srgo288g] {
        height: 56px;
        font-size: 17px;
    }

    .cg-date-toggle[b-v8srgo288g] {
        width: 36px;
        height: 36px;
        font-size: 15px;
    }
}


/* =========================
   MEJORA VISUAL FINAL (DESKTOP)
   ========================= */

/* LABELS */
.cg-label[b-v8srgo288g] {
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .4px;
    text-transform: uppercase;
    color: #334155;
}

/* INPUTS (FECHAS Y VENDEDOR BASE) */
.cg-date[b-v8srgo288g],
.cg-vendedor-input[b-v8srgo288g] {
    border: 1px solid rgba(15,23,42,.16);
    background: linear-gradient(180deg, #ffffff, #f9fbff);
    outline: none;
    color: #0f172a;
    box-shadow: 0 8px 18px rgba(15,23,42,.05);
    transition: all .12s ease;
}

    /* FOCUS EFECTO */
    .cg-date:focus[b-v8srgo288g],
    .cg-vendedor-input:focus[b-v8srgo288g] {
        border-color: rgba(37,99,235,.70);
        box-shadow: 0 0 0 4px rgba(37,99,235,.14), 0 12px 24px rgba(37,99,235,.10);
        transform: translateY(-1px);
    }

/* MEJOR SEPARACIÓN DERECHA */
.cg-inline-row[b-v8srgo288g] {
    gap: 16px;
}

/* MEJOR ALINEACIÓN GENERAL */
.cg-filters-main[b-v8srgo288g] {
    align-items: center;
}

/* BOTÓN MÁS PRO */
.cg-btn[b-v8srgo288g] {
    letter-spacing: .4px;
}

/* INPUT VENDEDOR MÁS LIMPIO */
.cg-vendedor-input[b-v8srgo288g] {
    background: linear-gradient(180deg, #ffffff, #f8fbff);
}

/* DROPDOWN MÁS SUAVE */
.cg-vendedor-dropdown[b-v8srgo288g] {
    border: 1px solid rgba(15,23,42,.08);
    box-shadow: 0 30px 70px rgba(15,23,42,.16);
}

/* ITEMS MÁS MODERNOS */
.cg-vendedor-item[b-v8srgo288g] {
    transition: all .12s ease;
}

    .cg-vendedor-item:hover[b-v8srgo288g] {
        background: rgba(37,99,235,.06);
        transform: translateX(2px);
    }

/* =========================
   FECHAS MEJORADAS
   ========================= */


.cg-date-toggle[b-v8srgo288g] {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    width: 38px;
    height: 38px;
    border-radius: 12px;
    border: 1px solid rgba(37,99,235,.16);
    background: linear-gradient(180deg, #ffffff, #eef4ff);
    cursor: pointer;
    font-size: 16px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    z-index: 3;
    box-shadow: 0 8px 18px rgba(15,23,42,.10);
    transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
}

    .cg-date-toggle:hover[b-v8srgo288g] {
        transform: translateY(-50%) scale(1.03);
        box-shadow: 0 12px 24px rgba(15,23,42,.14);
        background: linear-gradient(180deg, #ffffff, #e8f0ff);
    }


.cg-date[b-v8srgo288g],
.cg-date-text[b-v8srgo288g] {
    height: 60px;
    font-size: 19px;
    font-weight: 900;
}

.cg-date-field[b-v8srgo288g] {
    min-width: 210px;
    max-width: 230px;
    flex: 0 0 230px;
}

/* =========================
   BOTÓN CALENDARIO NATIVO
   ========================= */


.cg-date-toggle[b-v8srgo288g] {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    border: 1px solid rgba(37,99,235,.16);
    background: linear-gradient(180deg, #ffffff, #eef4ff);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    line-height: 1;
    pointer-events: none;
}


/* =========================
   BOTÓN CALENDARIO FUNCIONAL
   ========================= */

.cg-date-wrap[b-v8srgo288g] {
    position: relative;
    width: 100%;
}

.cg-date-text[b-v8srgo288g] {
    width: 100%;
    padding-right: 56px;
}

.cg-date-picker-btn[b-v8srgo288g] {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    width: 38px;
    height: 38px;
    border-radius: 12px;
    border: 1px solid rgba(37,99,235,.16);
    background: linear-gradient(180deg, #ffffff, #eef4ff);
    z-index: 20;
    box-shadow: 0 8px 18px rgba(15,23,42,.10);
    cursor: pointer;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform .12s ease, box-shadow .12s ease;
}

    .cg-date-picker-btn:hover[b-v8srgo288g] {
        transform: translateY(-50%) scale(1.04);
        box-shadow: 0 12px 24px rgba(15,23,42,.14);
    }

.cg-date-toggle[b-v8srgo288g] {
    font-size: 16px;
    line-height: 1;
    user-select: none;
    pointer-events: none;
}
/* _content/SistemaLoteriaDashboard/Components/Banca/ListasEditor.razor.rz.scp.css */
/* =========================================================
   ✅ REDISEÑO MODERNO LISTAS / EDITOR
   - Fuentes más grandes
   - Selects más compactos (NO tan anchos)
   - Botones más modernos y agradables
   - Sin tocar lógica / Razor
   ========================================================= */

/* ====== Tarjeta principal de Listas ====== */
.listas-card[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#ffffff 0%, #fbfdff 100%);
    border: 1px solid rgba(15, 55, 120, .10);
    border-radius: 18px;
    padding: 22px 22px 20px;
    box-shadow: 0 14px 32px rgba(0,0,0,.08);
}

/* ====== Cabecera: título + badge ====== */
.listas-header[b-s5r11w0vs9] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.listas-titulos[b-s5r11w0vs9] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.listas-header .card-titulo[b-s5r11w0vs9] {
    margin-bottom: 0;
    font-size: 1.45rem; /* ✅ más grande */
    font-weight: 950;
    color: #0f2f6d;
    letter-spacing: .2px;
}

.listas-subtitulo[b-s5r11w0vs9] {
    font-size: 1.02rem; /* ✅ más grande */
    font-weight: 750;
    color: #5b6c86;
}

/* Badge a la derecha */
.listas-badge span[b-s5r11w0vs9] {
    display: inline-block;
    padding: 7px 12px;
    border-radius: 999px;
    font-size: 0.9rem; /* ✅ más grande */
    font-weight: 900;
    background: linear-gradient(180deg,#eaf4ff,#dceeff);
    color: #0d47a1;
    border: 1px solid rgba(13,71,161,.18);
    box-shadow: 0 8px 16px rgba(13,71,161,.10);
}

/* ====== BARRA DE FECHA (ARRIBA) ====== */
.listas-fecha-bar[b-s5r11w0vs9] {
    margin: 12px 0 16px;
    padding: 14px 16px;
    border-radius: 16px;
    background: linear-gradient(90deg, #f1f6ff, #e5f2ff);
    border: 1px solid rgba(13,71,161,.14);
    display: flex;
    flex-direction: column;
    gap: 10px;
    box-shadow: 0 10px 22px rgba(0,0,0,.06);
}

.listas-juego-bar[b-s5r11w0vs9] {
    margin-top: 10px;
}

.listas-juego-control[b-s5r11w0vs9] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.listas-juego-select[b-s5r11w0vs9] {
    max-width: 220px;
}

.listas-juego-hint[b-s5r11w0vs9] {
    margin-left: 10px;
}

.listas-sorteo-head[b-s5r11w0vs9] {
    display: flex;
    gap: 10px;
    align-items: end;
    margin-bottom: 6px;
}

.listas-sorteo-head-main[b-s5r11w0vs9] {
    flex: 1;
    margin: 0;
}

.listas-sorteo-head-lista[b-s5r11w0vs9] {
    width: 110px;
    margin: 0;
}

.listas-sorteo-row[b-s5r11w0vs9] {
    display: flex;
    gap: 10px;
    align-items: center;
}

.listas-sorteo-select[b-s5r11w0vs9] {
    flex: 1;
}

.listas-lista-numero[b-s5r11w0vs9] {
    width: 110px;
}

.listas-fecha-label[b-s5r11w0vs9] {
    font-size: 0.92rem; /* ✅ más grande */
    font-weight: 900;
    color: #123a6c;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.listas-fecha-control[b-s5r11w0vs9] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    width: fit-content;
    max-width: 100%;
}

/* Input de fecha compacto */
.input-fecha-compact[b-s5r11w0vs9] {
    max-width: 210px; /* ✅ un poquito más grande pero compacto */
}

/* Texto bonito de fecha */
.fecha-legible[b-s5r11w0vs9] {
    font-size: 1.05rem; /* ✅ más grande */
    font-weight: 900;
    color: #1f2933;
    text-transform: capitalize;
}

/* ====== Filtros: usuario / sorteo / botones ====== */
.listas-filtros[b-s5r11w0vs9] {
    display: grid;
    grid-template-columns: 1.2fr 1.2fr 1.0fr; /* ✅ más balanceado */
    gap: 14px;
    align-items: flex-start;
    margin-bottom: 14px;
}

/* Bloque de filtro (label + control + hint) */
.filtro[b-s5r11w0vs9] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

    .filtro > label[b-s5r11w0vs9] {
        font-size: 0.98rem; /* ✅ más grande */
        font-weight: 950;
        color: #123a6c;
    }

/* Hints debajo de los selects */
.hint[b-s5r11w0vs9] {
    font-size: 0.92rem; /* ✅ más grande */
    color: #7183a2;
    font-weight: 700;
}

/* ====== Inputs compactos solo dentro de esta tarjeta ====== */
.listas-card .input[b-s5r11w0vs9],
.listas-card select.input[b-s5r11w0vs9],
.listas-card .input-compact[b-s5r11w0vs9] {
    padding: 12px 14px; /* ✅ más cómodo */
    border-radius: 14px; /* ✅ más moderno */
    font-size: 1.05rem; /* ✅ más grande */
    font-weight: 850;
    border: 1px solid rgba(100,130,190,.40);
    background: linear-gradient(180deg,#ffffff,#f7fbff);
    box-shadow: 0 10px 18px rgba(0,0,0,.06);
    outline: none;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

    .listas-card .input:focus[b-s5r11w0vs9],
    .listas-card select.input:focus[b-s5r11w0vs9],
    .listas-card .input-compact:focus[b-s5r11w0vs9] {
        border-color: #2b7cff;
        box-shadow: 0 0 0 4px rgba(43,124,255,.14), 0 12px 24px rgba(0,0,0,.08);
    }

/* ✅ Selects NO tan anchos (compactos y bonitos)
   IMPORTANTE: no rompemos tu layout, solo limitamos el ancho visual.
*/
.select-usuario[b-s5r11w0vs9],
.select-sorteo[b-s5r11w0vs9] {
    width: 100%;
    max-width: 420px; /* ✅ evita que se vean gigantes */
}

/* Si tu grid les da mucho espacio, esto los mantiene “compactos” */
.filtro select.select-usuario[b-s5r11w0vs9],
.filtro select.select-sorteo[b-s5r11w0vs9] {
    justify-self: start;
}

/* Contenedor de los dos botones (Modificar / Crear) */
.filtro-boton[b-s5r11w0vs9] {
    align-self: stretch;
}

/* ===== Grupo de botones ===== */
.grupo-botones-lista[b-s5r11w0vs9] {
    display: flex;
    gap: 10px;
}

/* Botones modernos del módulo */
.btn-lista[b-s5r11w0vs9] {
    flex: 1;
    min-width: 120px;
    height: 50px; /* ✅ más alto */
    justify-content: center;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 1.02rem; /* ✅ más grande */
    font-weight: 950;
    border-radius: 16px;
    border: 1px solid rgba(0,0,0,.10);
    cursor: pointer;
    user-select: none;
    transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
    box-shadow: 0 12px 22px rgba(0,0,0,.10);
}

    .btn-lista:active[b-s5r11w0vs9] {
        transform: scale(.985);
    }

/* Botón principal y secundario dentro de este módulo */
.btn-modificar[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#1f6fff 0%, #0f3f9b 100%);
    color: #fff;
    border-color: rgba(15,63,155,.35);
}

.btn-crear[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#eef2ff 0%, #dfe8ff 100%);
    color: #123a6c;
    border-color: rgba(18,58,108,.18);
}

.btn-modificar:hover[b-s5r11w0vs9] {
    filter: brightness(1.05);
    box-shadow: 0 16px 30px rgba(15,63,155,.18);
}

.btn-crear:hover[b-s5r11w0vs9] {
    filter: brightness(1.03);
    box-shadow: 0 16px 30px rgba(18,58,108,.14);
}

/* ====== Placeholder del contenido de listas ====== */
.listas-contenido-placeholder[b-s5r11w0vs9] {
    margin-top: 10px;
    padding: 18px 20px;
    border-radius: 16px;
    border: 1px dashed rgba(13,71,161,.25);
    background: linear-gradient(180deg,#fbfdff,#f2f8ff);
    color: #5c6f8b;
    font-size: 1.02rem; /* ✅ más grande */
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    box-shadow: 0 12px 22px rgba(0,0,0,.06);
}

.placeholder-icono[b-s5r11w0vs9] {
    font-size: 2rem; /* ✅ más grande */
    margin-bottom: 2px;
}

.placeholder-texto-principal[b-s5r11w0vs9] {
    font-weight: 950;
    color: #243b63;
    font-size: 1.05rem;
}

.placeholder-texto-secundario[b-s5r11w0vs9] {
    font-size: 0.98rem;
    color: #6b7a93;
    font-weight: 750;
}

/* ====== Responsivo ====== */
@media (max-width: 900px) {
    .listas-filtros[b-s5r11w0vs9] {
        grid-template-columns: 1fr 1fr;
    }

    .select-usuario[b-s5r11w0vs9],
    .select-sorteo[b-s5r11w0vs9] {
        max-width: none; /* en móvil sí al 100% */
    }
}

@media (max-width: 650px) {
    .listas-filtros[b-s5r11w0vs9] {
        grid-template-columns: 1fr;
    }

    .listas-fecha-control[b-s5r11w0vs9] {
        flex-direction: column;
        align-items: flex-start;
    }

    .grupo-botones-lista[b-s5r11w0vs9] {
        flex-direction: row;
    }

    .btn-lista[b-s5r11w0vs9] {
        width: 100%;
    }
}

/* ===== MODAL VER LISTA (escala dinámica) ===== */
.modal-overlay[b-s5r11w0vs9] {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0,0,0,.55);
    z-index: 99998 !important;
}

/* ✅ Modal más moderno */
.modal-lista[b-s5r11w0vs9] {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 96vw !important;
    height: 90vh !important;
    background: linear-gradient(180deg,#f0f7ff,#eaf3fb);
    border: 1px solid rgba(13,71,161,.18);
    border-radius: 16px;
    padding: 12px 14px;
    padding-top: 0px;
    box-shadow: 0 18px 60px rgba(0,0,0,.28);
    z-index: 99999 !important;
    box-sizing: border-box;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

body.modal-open[b-s5r11w0vs9] {
    overflow: hidden !important;
}

/* Botón X moderno */
.modal-close[b-s5r11w0vs9] {
    border: none;
    background: linear-gradient(180deg,#ffecec,#ffd9d9);
    color: #b40000;
    cursor: pointer;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    font-size: 20px;
    position: absolute;
    top: 10px;
    right: 12px;
    z-index: 5;
    box-shadow: 0 10px 18px rgba(180,0,0,.12);
}

    .modal-close:hover[b-s5r11w0vs9] {
        filter: brightness(1.03);
        background: linear-gradient(180deg,#ffdede,#ffcaca);
    }

/* CONTENEDOR ÚNICO DEL CONTENIDO DE LA LISTA */
#listaCanvas[b-s5r11w0vs9] {
    width: 100%;
    height: 100%;
    padding: 12px 22px 22px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

#contentLista[b-s5r11w0vs9] {
    display: inline-block;
}

/* ============================
   🧱 ESTRUCTURA MODO NORMAL
   ============================ */
.lista-unica-normal[b-s5r11w0vs9] {
    width: 100%;
    max-width: 1180px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 0;
}

/* ============================
   🧱 ESTRUCTURA MODO REVENTADO
   ============================ */
.lista-unica-rev[b-s5r11w0vs9] {
    width: 100%;
    max-width: 1380px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 0;
}

/* === TÍTULO Y FECHA === */
.fila-titulo[b-s5r11w0vs9] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
}

/* ✅ Título más grande */
.titulo-sorteo-modal[b-s5r11w0vs9] {
    font-weight: 950;
    font-size: 1.85rem;
    color: #c68200;
    letter-spacing: .2px;
}

.fecha-modal[b-s5r11w0vs9] {
    font-weight: 850;
    font-size: 1.1rem;
    color: #255;
}

/* === TOTALES GENERALES (arriba) === */
.fila-totales-normal[b-s5r11w0vs9],
.fila-totales-rev[b-s5r11w0vs9] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
    margin-bottom: 8px;
    flex-wrap: wrap;
}

    .fila-totales-normal .label[b-s5r11w0vs9],
    .fila-totales-rev .label[b-s5r11w0vs9] {
        font-weight: 950;
        font-size: 1.05rem;
        color: #04192e;
    }

    .fila-totales-normal .valor[b-s5r11w0vs9],
    .fila-totales-rev .valor[b-s5r11w0vs9] {
        font-weight: 950;
        font-size: 1.05rem;
        color: #b31523;
    }

    .fila-totales-rev .sep[b-s5r11w0vs9] {
        margin: 0 8px;
        opacity: .6;
    }

/* ============================
   🧮 REJILLA PRINCIPAL
   ============================ */

/* Modo NORMAL */
.lista-unica-normal .fila-cabecera[b-s5r11w0vs9],
.lista-unica-normal .fila-numeros[b-s5r11w0vs9],
.lista-unica-normal .fila-totales-f[b-s5r11w0vs9] {
    display: grid;
    grid-template-columns: repeat(5, 70px 110px);
    column-gap: 6px;
    row-gap: 6px;
    justify-content: center;
}

/* Modo REVENTADO */
.lista-unica-rev .fila-cabecera[b-s5r11w0vs9],
.lista-unica-rev .fila-numeros[b-s5r11w0vs9],
.lista-unica-rev .fila-totales-f-rev[b-s5r11w0vs9] {
    display: grid;
    grid-template-columns: repeat(5, 70px 110px 110px);
    column-gap: 6px;
    row-gap: 6px;
    justify-content: center;
}

/* ============================
   🎨 CABECERAS
   ============================ */
.h-num[b-s5r11w0vs9],
.h-monto[b-s5r11w0vs9],
.h-monto-rev[b-s5r11w0vs9] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px; /* ✅ más grande */
    font-weight: 950;
    border-radius: 10px;
    height: 26px; /* ✅ más alto */
    box-sizing: border-box;
    box-shadow: 0 10px 18px rgba(0,0,0,.10);
}

/* 🔵 CABECERA N° */
.h-num[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#1e78ff,#0d47a1);
    color: white;
    border: 1px solid rgba(13,71,161,.45);
}

/* 🟢 CABECERA MONTO */
.h-monto[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#46c27b,#2e8b57);
    color: white;
    border: 1px solid rgba(46,139,87,.45);
}

/* 🔴 CABECERA REVENTADO */
.h-monto-rev[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#ff6b5f,#c0392b);
    color: white;
    border: 1px solid rgba(192,57,43,.45);
}

/* ============================
   🎨 CELDAS (N°, Monto, R)
   ============================ */
.celda-num[b-s5r11w0vs9],
.celda-monto[b-s5r11w0vs9],
.celda-monto-rev[b-s5r11w0vs9] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px; /* ✅ más grande */
    font-weight: 900;
    padding: 0 8px;
    border-radius: 12px;
    height: 28px; /* ✅ más alto */
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-shadow: 0 10px 18px rgba(0,0,0,.08);
}

/* Número */
.celda-num[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#e9f5ff,#dff0ff);
    color: #0a406e;
    border: 1px solid rgba(10,64,110,.22);
}

/* Monto normal */
.celda-monto[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#ecfff3,#def7ea);
    color: #0a5c38;
    border: 1px solid rgba(10,92,56,.22);
}

/* Monto reventado */
.celda-monto-rev[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#fff0f0,#fde3e3);
    color: #b02222;
    border: 1px solid rgba(176,34,34,.22);
}

/* Números prohibidos en rojo */
.celda-num.prohibido[b-s5r11w0vs9] {
    color: #d32f2f;
    font-size: 16px;
}

/* ============================
   TOTALES F1..F5 — MODO NORMAL
   ============================ */
.fila-totales-f[b-s5r11w0vs9] {
    display: grid;
    grid-template-columns: repeat(10, 1fr);
    gap: 6px;
    margin-top: 6px;
}

    .fila-totales-f .label[b-s5r11w0vs9],
    .fila-totales-f .valor[b-s5r11w0vs9] {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 30px;
        font-size: 15px; /* ✅ más grande */
        font-weight: 950;
        border-radius: 12px;
        box-sizing: border-box;
        padding: 0 8px;
        box-shadow: 0 10px 18px rgba(0,0,0,.08);
    }

    /* Label */
    .fila-totales-f .label[b-s5r11w0vs9] {
        background: linear-gradient(180deg,#eef8ff,#e5f3ff);
        color: #0c6aa6;
        border: 1px dashed rgba(12,106,166,.55);
        white-space: nowrap;
    }

    /* Monto */
    .fila-totales-f .valor[b-s5r11w0vs9] {
        background: linear-gradient(180deg,#f1fff5,#e6ffee);
        color: #0f7a3a;
        border: 1px dashed rgba(15,122,58,.55);
    }

/* ============================
   TOTALES F1..F5 — MODO REVENTADO
   ============================ */
.fila-totales-f-rev[b-s5r11w0vs9] {
    display: grid;
    grid-template-columns: repeat(15, 1fr);
    gap: 6px;
    margin-top: 6px;
}

    .fila-totales-f-rev .label[b-s5r11w0vs9],
    .fila-totales-f-rev .valor-normal[b-s5r11w0vs9],
    .fila-totales-f-rev .valor-rev[b-s5r11w0vs9] {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 30px;
        font-size: 15px; /* ✅ más grande */
        font-weight: 950;
        border-radius: 12px;
        box-sizing: border-box;
        padding: 0 8px;
        box-shadow: 0 10px 18px rgba(0,0,0,.08);
    }

    .fila-totales-f-rev .label[b-s5r11w0vs9] {
        background: linear-gradient(180deg,#eef8ff,#e5f3ff);
        color: #0c6aa6;
        border: 1px dashed rgba(12,106,166,.55);
        white-space: nowrap;
    }

    .fila-totales-f-rev .valor-normal[b-s5r11w0vs9] {
        background: linear-gradient(180deg,#f1fff5,#e6ffee);
        color: #0f7a3a;
        border: 1px dashed rgba(15,122,58,.55);
    }

    .fila-totales-f-rev .valor-rev[b-s5r11w0vs9] {
        background: linear-gradient(180deg,#fff5f5,#ffe3e3);
        color: #c62828;
        border: 1px dashed rgba(198,40,40,.55);
    }

/* Asegurar que nada se desborde raro */
#listaCanvas > div[b-s5r11w0vs9] {
    min-width: 0;
    min-height: 0;
}

/* === Popup de error de venta (centrado en la pantalla) === */
.venta-modal-backdrop[b-s5r11w0vs9] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.50);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999999;
}

.venta-modal[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#ffffff,#fbfdff);
    border-radius: 18px;
    padding: 20px 22px 22px;
    max-width: 460px;
    width: 92%;
    box-shadow: 0 22px 70px rgba(0, 0, 0, 0.35);
    animation: ventaModalIn-b-s5r11w0vs9 0.18s ease-out;
    text-align: left;
    border: 1px solid rgba(0,0,0,.10);
}

    .venta-modal h3[b-s5r11w0vs9] {
        margin: 0 0 10px 0;
        font-size: 1.25rem;
        font-weight: 950;
        color: #c62828;
    }

    .venta-modal p[b-s5r11w0vs9] {
        margin: 0 0 18px 0;
        line-height: 1.45;
        font-size: 1.05rem;
        white-space: pre-line;
        color: #333;
        font-weight: 650;
    }

    .venta-modal .btn.ok[b-s5r11w0vs9] {
        width: 100%;
        font-weight: 800;
        height: 48px;
        border-radius: 14px;
    }

@keyframes ventaModalIn-b-s5r11w0vs9 {
    from {
        opacity: 0;
        transform: translateY(10px) scale(0.97);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.input-monto-lista[b-s5r11w0vs9] {
    width: 100%;
    height: 100%;
    border: none;
    background: transparent;
    text-align: center;
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    outline: none;
    padding: 0;
    margin: 0;
}

/* Al enfocar, que solo marque el borde de la celda */
.celda-monto:focus-within[b-s5r11w0vs9] {
    box-shadow: 0 0 0 3px rgba(25, 118, 210, 0.35), 0 10px 18px rgba(0,0,0,.10);
}

.toast-modal-centro[b-s5r11w0vs9] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 18px 26px;
    border-radius: 14px;
    font-size: 1.35rem;
    font-weight: 900;
    color: white;
    text-align: center;
    z-index: 999999 !important;
    box-shadow: 0 18px 40px rgba(0,0,0,0.35);
}

/* Ya existentes */
.toast-ok[b-s5r11w0vs9] {
    background: #28a745;
}

.toast-error[b-s5r11w0vs9] {
    background: #dc3545;
}

/* 🔷 Header del modal: nombre + totales + barra de botones */
.fila-header-modal[b-s5r11w0vs9] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 8px;
}

/* Bloque izquierdo (nombre + totales) */
.header-info[b-s5r11w0vs9] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* Bloque derecho (botones) */
.header-acciones[b-s5r11w0vs9] {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Barra de acciones en la parte superior del modal (derecha) */
.modal-lista-actions[b-s5r11w0vs9] {
    position: absolute;
    top: 10px;
    right: 55px;
    display: flex;
    gap: 10px;
    z-index: 3;
}

/* Botones Guardar / Ingresar ventas dentro del modal de listas */
.btn-guardar-lista[b-s5r11w0vs9],
.btn-ingresar-lista[b-s5r11w0vs9] {
    min-width: 120px;
    padding: 10px 14px;
    border-radius: 14px;
    border: 1px solid rgba(13,71,161,.35);
    background: rgba(255,255,255,.85);
    color: #0d47a1;
    font-size: 0.98rem; /* ✅ más grande */
    font-weight: 950;
    cursor: pointer;
    box-shadow: 0 12px 22px rgba(0,0,0,.10);
    transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
}

    .btn-guardar-lista:hover[b-s5r11w0vs9],
    .btn-ingresar-lista:hover[b-s5r11w0vs9] {
        filter: brightness(1.03);
        transform: translateY(-1px);
        box-shadow: 0 16px 30px rgba(0,0,0,.12);
    }

/* ===== Modal pequeño para Ingresar ventas ===== */
.modal-ingreso-overlay[b-s5r11w0vs9] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.50);
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 20px 0 0 20px;
    z-index: 100000;
}

.modal-ingreso[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#ffffff,#fbfdff);
    border-radius: 16px;
    padding: 14px 14px 12px;
    width: 360px;
    max-width: 95vw;
    box-shadow: 0 22px 70px rgba(0,0,0,0.35);
    animation: ventaModalIn-b-s5r11w0vs9 0.18s ease-out;
    border: 1px solid rgba(0,0,0,.10);
}

/* Modal de ingreso más delgado en modo NORMAL */
.modal-ingreso-normal[b-s5r11w0vs9] {
    width: 245px;
}

.modal-ingreso-rev[b-s5r11w0vs9] {
    width: 360px;
}

.modal-ingreso h3[b-s5r11w0vs9] {
    margin: 0 0 6px 0;
    font-size: 1.15rem;
    font-weight: 950;
    color: #0d47a1;
}

.texto-modal-ingreso[b-s5r11w0vs9] {
    margin: 0 0 10px 0;
    font-size: 1.0rem;
    color: #444;
    font-weight: 700;
}

/* Tabla de ingreso */
.tabla-ingreso[b-s5r11w0vs9] {
    display: grid;
    grid-template-columns: 80px 120px 120px;
    gap: 6px;
    margin-bottom: 6px;
}

    .tabla-ingreso.encabezado[b-s5r11w0vs9] {
        font-size: 0.9rem;
        font-weight: 950;
        text-transform: uppercase;
        color: #123a6c;
    }

        .tabla-ingreso.encabezado .col-num[b-s5r11w0vs9],
        .tabla-ingreso.encabezado .col-monto[b-s5r11w0vs9],
        .tabla-ingreso.encabezado .col-monto-r[b-s5r11w0vs9] {
            border-radius: 10px;
            border: 1px solid rgba(0,0,0,.10);
            display: flex;
            align-items: center;
            justify-content: center;
        }

        /* Encabezados (más modernos) */
        .tabla-ingreso.encabezado .col-num[b-s5r11w0vs9] {
            background: linear-gradient(180deg,#d8ecff,#c6e2ff);
            border-color: rgba(13,71,161,.28);
        }

        .tabla-ingreso.encabezado .col-monto[b-s5r11w0vs9] {
            background: linear-gradient(180deg,#d7f4e5,#c9eddc);
            border-color: rgba(15,122,58,.25);
        }

        .tabla-ingreso.encabezado .col-monto-r[b-s5r11w0vs9] {
            background: linear-gradient(180deg,#ffd1d1,#f7bebe);
            border-color: rgba(176,34,34,.25);
        }

/* ============================
   ✅ ALINEACIÓN PERFECTA CABECERA vs FILAS
   ============================ */
.modal-ingreso-normal .tabla-ingreso[b-s5r11w0vs9] {
    grid-template-columns: 80px 120px !important;
}

.modal-ingreso-rev .tabla-ingreso[b-s5r11w0vs9] {
    grid-template-columns: 80px 120px 120px !important;
}

.modal-ingreso-parley .tabla-ingreso[b-s5r11w0vs9] {
    grid-template-columns: 80px 80px 120px !important;
}

/* Parley ancho intermedio */
.modal-ingreso-parley[b-s5r11w0vs9] {
    width: 300px;
}

/* Cabeceras */
.tabla-ingreso.encabezado .col-num[b-s5r11w0vs9],
.tabla-ingreso.encabezado .col-monto[b-s5r11w0vs9],
.tabla-ingreso.encabezado .col-monto-r[b-s5r11w0vs9] {
    width: 100%;
    box-sizing: border-box;
    padding: 0 !important;
    height: 30px;
    line-height: 30px;
}

/* Inputs */
.tabla-ingreso.fila .ingreso-input[b-s5r11w0vs9] {
    height: 30px;
    box-sizing: border-box;
    margin: 0;
}

/* Fila normal */
.tabla-ingreso.fila .ingreso-input[b-s5r11w0vs9] {
    width: 100%;
    padding: 6px 8px;
    border-radius: 10px;
    border: 2px solid rgba(148,163,184,.85);
    font-size: 1.0rem; /* ✅ más grande */
    font-weight: 850;
    text-align: center;
    box-sizing: border-box;
    background: #f8fafc;
    transition: box-shadow .12s ease, border-color .12s ease, background .12s ease;
}

    .tabla-ingreso.fila .ingreso-input:focus[b-s5r11w0vs9] {
        outline: none;
        border-color: #0d47a1;
        background: #eef4ff;
        box-shadow: 0 0 0 3px rgba(13,71,161,0.20);
    }

/* Footer */
.footer-ingreso[b-s5r11w0vs9] {
    margin-top: 10px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    font-size: 1.0rem; /* ✅ más grande */
}

.footer-ingreso-botones[b-s5r11w0vs9] {
    display: flex;
    gap: 8px;
    margin-top: 4px;
}

.footer-ingreso-total[b-s5r11w0vs9] {
    font-weight: 950;
    color: #0f5132;
}

/* Botones footer */
.footer-ingreso-botones .btn[b-s5r11w0vs9] {
    padding: 10px 12px;
    border-radius: 12px;
    font-size: 0.95rem;
    font-weight: 950;
    cursor: pointer;
    border: 1px solid rgba(0,0,0,.12);
    box-shadow: 0 12px 22px rgba(0,0,0,.10);
    transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
}

    .footer-ingreso-botones .btn:active[b-s5r11w0vs9] {
        transform: scale(.985);
    }

.footer-ingreso-botones .btn-primario[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#1f6fff,#0f3f9b);
    color: #fff;
    border: 1px solid rgba(15,63,155,.30);
}

.footer-ingreso-botones .btn-secundario[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#f2f4f8,#e6ebf5);
    color: #111827;
    border: 1px solid rgba(17,24,39,.12);
}

.footer-ingreso-botones .btn-primario:hover[b-s5r11w0vs9] {
    filter: brightness(1.05);
    box-shadow: 0 16px 30px rgba(15,63,155,.18);
}

.footer-ingreso-botones .btn-secundario:hover[b-s5r11w0vs9] {
    filter: brightness(1.02);
    box-shadow: 0 16px 30px rgba(0,0,0,.10);
}

/* ===========================
   ✅ FIX RAÍZ MODAL INGRESO
=========================== */
.modal-ingreso[b-s5r11w0vs9] {
    height: 520px;
    max-height: 520px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

/* ✅ El body scrollea vertical */
#ingresoBody[b-s5r11w0vs9] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-gutter: stable;
    box-sizing: border-box;
}

    #ingresoBody .tabla-ingreso[b-s5r11w0vs9] {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

/* Columnas estables */
.modal-ingreso-rev .tabla-ingreso[b-s5r11w0vs9] {
    grid-template-columns: 80px minmax(0, 1fr) minmax(0, 1fr);
}

.modal-ingreso-normal .tabla-ingreso[b-s5r11w0vs9] {
    grid-template-columns: 80px minmax(0, 1fr);
}

/* Inputs no empujan */
#ingresoBody .ingreso-input[b-s5r11w0vs9] {
    min-width: 0;
    width: 100%;
    box-sizing: border-box;
}

/* ===== Colores base un poco más oscuros ===== */
.tabla-ingreso.fila .ingreso-input[data-col="0"][b-s5r11w0vs9] {
    background: #d9ecff;
    border-color: #7aa7d9;
}

.tabla-ingreso.fila .ingreso-input[data-col="1"][b-s5r11w0vs9] {
    background: #d8f2e6;
    border-color: #7fb99a;
}

.tabla-ingreso.fila .ingreso-input[data-col="2"][b-s5r11w0vs9] {
    background: #ffdcdc;
    border-color: #d49a9a;
}

/* ===== Foco más intenso ===== */
.tabla-ingreso.fila .ingreso-input[data-col="0"]:focus[b-s5r11w0vs9] {
    background: #cfe5ff;
    border-color: #0d47a1;
    box-shadow: 0 0 0 3px rgba(13,71,161,0.22);
}

.tabla-ingreso.fila .ingreso-input[data-col="1"]:focus[b-s5r11w0vs9] {
    background: #cdeedd;
    border-color: #0f7a3a;
    box-shadow: 0 0 0 3px rgba(15,122,58,0.20);
}

.tabla-ingreso.fila .ingreso-input[data-col="2"]:focus[b-s5r11w0vs9] {
    background: #f9cccc;
    border-color: #b02222;
    box-shadow: 0 0 0 3px rgba(176,34,34,0.20);
}

/* ==================================================
   CABECERAS MÁS OSCURAS
   ================================================== */
.tabla-ingreso.encabezado .col-num[b-s5r11w0vs9] {
    background: #bcdcff;
    border-color: #0d47a1;
    color: #0a2e52;
}

.tabla-ingreso.encabezado .col-monto[b-s5r11w0vs9] {
    background: #bfe6cf;
    border-color: #0f7a3a;
    color: #0b4d2b;
}

.tabla-ingreso.encabezado .col-monto-r[b-s5r11w0vs9] {
    background: #f2bcbc;
    border-color: #b02222;
    color: #7f1d1d;
}

/* ✅ Selector de lista: compacto (NO ancho) y moderno */
.fila-lista-selector[b-s5r11w0vs9] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 6px;
    flex-wrap: wrap;
}

.label-lista[b-s5r11w0vs9] {
    font-weight: 950;
    color: #123a6c;
    font-size: 1.0rem; /* ✅ más grande */
}

/* ✅ clave: el select NO se ve gigante */
.select-lista[b-s5r11w0vs9] {
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(13,71,161,.22);
    font-weight: 950;
    font-size: 1.0rem; /* ✅ más grande */
    background: linear-gradient(180deg,#eef6ff,#e1f0ff);
    color: #0d47a1;
    outline: none;
    cursor: pointer;
    box-shadow: 0 12px 22px rgba(13,71,161,.10);
    width: auto; /* ✅ evita ancho full */
    max-width: 340px; /* ✅ compacto */
}

.titulo-sorteo-linea[b-s5r11w0vs9] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.fila-lista-selector[b-s5r11w0vs9] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* =========================
   Confirmación borrado
========================= */
.confirm-overlay[b-s5r11w0vs9] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.60);
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}

.confirm-box[b-s5r11w0vs9] {
    width: min(560px, 95vw);
    background: linear-gradient(180deg,#ffffff,#fbfdff);
    border: 1px solid rgba(0,0,0,.10);
    border-radius: 18px;
    box-shadow: 0 30px 90px rgba(0,0,0,.35);
    padding: 18px 18px 16px;
}

.confirm-title[b-s5r11w0vs9] {
    font-weight: 950;
    font-size: 1.2rem;
    color: #0f2f6d;
    margin-bottom: 10px;
}

.confirm-msg[b-s5r11w0vs9] {
    font-size: 1.05rem;
    line-height: 1.45;
    color: rgba(0,0,0,.78);
    margin-bottom: 14px;
    font-weight: 650;
}

.confirm-actions[b-s5r11w0vs9] {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}

/* =========================
   BOTONES TOP (Guardar / Borrar / Nueva / Ingresar)
========================= */
.modal-lista-actions.toolbar-acciones[b-s5r11w0vs9] {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    padding: 10px 12px;
    border: 1px solid rgba(0,0,0,.08);
    background: rgba(255,255,255,.72);
    border-radius: 16px;
    backdrop-filter: blur(7px);
    box-shadow: 0 12px 22px rgba(0,0,0,.10);
}

    .modal-lista-actions.toolbar-acciones .btn[b-s5r11w0vs9] {
        appearance: none;
        border: 1px solid rgba(0,0,0,.12);
        background: #fff;
        color: #123a75;
        font-weight: 950;
        font-size: 0.98rem; /* ✅ más grande */
        line-height: 1;
        padding: 10px 14px;
        border-radius: 14px;
        box-shadow: 0 12px 22px rgba(0,0,0,.10);
        transition: transform .12s ease, box-shadow .12s ease, background .12s ease, border-color .12s ease;
        cursor: pointer;
        user-select: none;
    }

        .modal-lista-actions.toolbar-acciones .btn:hover[b-s5r11w0vs9] {
            transform: translateY(-1px);
            box-shadow: 0 16px 30px rgba(0,0,0,.12);
            border-color: rgba(0,0,0,.18);
        }

        .modal-lista-actions.toolbar-acciones .btn:active[b-s5r11w0vs9] {
            transform: translateY(0px);
            box-shadow: 0 12px 20px rgba(0,0,0,.10);
        }

        .modal-lista-actions.toolbar-acciones .btn:focus[b-s5r11w0vs9] {
            outline: none;
            box-shadow: 0 0 0 4px rgba(33,105,255,.16), 0 16px 30px rgba(0,0,0,.12);
        }

    /* Guardar */
    .modal-lista-actions.toolbar-acciones .btn-guardar-lista[b-s5r11w0vs9] {
        background: linear-gradient(180deg, #1e63d7 0%, #0f3f9b 100%);
        color: #fff;
        border-color: rgba(15,63,155,.35);
    }

    /* Ingresar ventas */
    .modal-lista-actions.toolbar-acciones .btn-ingresar-lista[b-s5r11w0vs9] {
        background: rgba(255,255,255,.88);
        color: #123a75;
        border-color: rgba(18,58,117,.28);
    }

    /* Borrar lista */
    .modal-lista-actions.toolbar-acciones .btn-borrar-lista[b-s5r11w0vs9] {
        background: linear-gradient(180deg, #ff5a5f 0%, #d81e2b 100%);
        color: #fff;
        border-color: rgba(216,30,43,.35);
    }

    /* Si “Nueva lista” es el 3er botón usando btn-guardar-lista */
    .modal-lista-actions.toolbar-acciones .btn-guardar-lista:nth-of-type(3)[b-s5r11w0vs9] {
        background: linear-gradient(180deg, #f2f5fb 0%, #e6edf8 100%);
        color: #123a75;
        border-color: rgba(21,62,117,.20);
    }

    /* Botón Info */
    .modal-lista-actions.toolbar-acciones .btn-info-lista[b-s5r11w0vs9] {
        font-size: 0.92rem;
        padding: 10px 12px;
        border-radius: 14px;
        border: 1px solid rgba(25,118,210,.28);
        background: rgba(25,118,210,.10);
        color: #0b4aa3;
        font-weight: 950;
    }

        .modal-lista-actions.toolbar-acciones .btn-info-lista:hover[b-s5r11w0vs9] {
            background: rgba(25,118,210,.16);
        }

/* ===== Modal info (centrado, moderno) ===== */
.info-box[b-s5r11w0vs9] {
    width: min(600px, 96vw);
    background: linear-gradient(180deg,#ffffff,#fbfdff);
    border: 1px solid rgba(0,0,0,.12);
    border-radius: 18px;
    box-shadow: 0 24px 70px rgba(0,0,0,.28);
    padding: 14px 14px 12px;
}

.info-head[b-s5r11w0vs9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.info-title[b-s5r11w0vs9] {
    font-weight: 950;
    font-size: 1.1rem;
    color: #153e75;
}

.info-close[b-s5r11w0vs9] {
    width: 38px;
    height: 38px;
    border-radius: 14px;
    border: 1px solid rgba(0,0,0,.12);
    background: #fff;
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    box-shadow: 0 12px 22px rgba(0,0,0,.10);
}

.info-grid[b-s5r11w0vs9] {
    display: grid;
    grid-template-columns: 170px 1fr;
    gap: 10px 12px;
    font-size: 1.0rem;
}

    .info-grid .k[b-s5r11w0vs9] {
        font-weight: 950;
        color: #2a4c7f;
        opacity: .92;
    }

    .info-grid .v[b-s5r11w0vs9] {
        color: #0f2f57;
        font-weight: 750;
    }

.info-sep[b-s5r11w0vs9] {
    grid-column: 1 / -1;
    border: none;
    height: 1px;
    background: rgba(0,0,0,.10);
    margin: 8px 0;
}

.info-actions[b-s5r11w0vs9] {
    display: flex;
    justify-content: flex-end;
    margin-top: 12px;
}

/* ✅ Modal ingreso PARLEY: un poco más ancho */
.modal-ingreso.modal-ingreso-parley[b-s5r11w0vs9] {
    width: 280px;
}

/* ✅ PARLEY: 3 columnas (A + B + MONTO) */
.modal-ingreso-parley .tabla-ingreso[b-s5r11w0vs9] {
    grid-template-columns: 70px 70px minmax(0, 1fr) !important;
}

    .modal-ingreso-parley .tabla-ingreso.encabezado .col-monto[b-s5r11w0vs9] {
        white-space: nowrap;
    }

.admin-confirm-backdrop[b-s5r11w0vs9] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.55);
    z-index: 9998;
}

.admin-confirm-modal[b-s5r11w0vs9] {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    padding: 14px;
}

.admin-confirm-box[b-s5r11w0vs9] {
    width: min(560px, 95vw);
    background: #fff;
    border-radius: 16px;
    padding: 18px 18px 16px;
    box-shadow: 0 12px 40px rgba(0,0,0,.35);
    border: 3px solid #ff3b30;
}

.admin-confirm-title[b-s5r11w0vs9] {
    font-weight: 1000;
    font-size: 1.2rem;
    color: #ff3b30;
    text-align: center;
    margin-bottom: 10px;
    letter-spacing: .3px;
}

.admin-confirm-text[b-s5r11w0vs9] {
    font-size: 1.05rem;
    color: #1b2b3a;
    background: #fff3f2;
    border: 2px solid #ffb3ae;
    padding: 12px;
    border-radius: 12px;
    margin-bottom: 12px;
    line-height: 1.35;
    font-weight: 800;
}

.admin-confirm-sub[b-s5r11w0vs9] {
    font-size: 0.98rem;
    color: #203246;
    margin-bottom: 8px;
    font-weight: 800;
}

.admin-confirm-input[b-s5r11w0vs9] {
    width: 100%;
    padding: 12px 12px;
    border-radius: 12px;
    border: 2px solid #cfd8dc;
    font-size: 1.05rem;
    outline: none;
    font-weight: 800;
}

    .admin-confirm-input:focus[b-s5r11w0vs9] {
        border-color: #ff3b30;
        box-shadow: 0 0 0 3px rgba(255,59,48,.18);
    }

.admin-confirm-error[b-s5r11w0vs9] {
    margin-top: 10px;
    background: #ffe9e8;
    border: 2px solid #ffb3ae;
    color: #b00020;
    padding: 10px;
    border-radius: 12px;
    font-weight: 900;
}

.admin-confirm-actions[b-s5r11w0vs9] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 14px;
}

.admin-btn[b-s5r11w0vs9] {
    border: 0;
    border-radius: 12px;
    padding: 10px 14px;
    font-weight: 900;
    cursor: pointer;
}

.admin-btn-sec[b-s5r11w0vs9] {
    background: #e9eef3;
    color: #223;
}

.admin-btn-danger[b-s5r11w0vs9] {
    background: #ff3b30;
    color: #fff;
}

.btn-modificar-lista[b-s5r11w0vs9] {
    width: 100%;
    padding: 16px 24px;
    font-size: 1.25rem;
    font-weight: 800;
    letter-spacing: 0.5px;
    border-radius: 14px;
    border: none;
    background: linear-gradient(135deg, #1565c0, #0d47a1);
    color: #ffffff;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.25);
    transition: all 0.25s ease;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border-bottom: 4px solid #d32f2f;
}

    .btn-modificar-lista:hover[b-s5r11w0vs9] {
        background: linear-gradient(135deg, #1976d2, #0b3c91);
        transform: translateY(-2px);
        box-shadow: 0 12px 22px rgba(0, 0, 0, 0.35);
    }

    .btn-modificar-lista:active[b-s5r11w0vs9] {
        transform: scale(0.98);
    }

    .btn-modificar-lista:focus[b-s5r11w0vs9] {
        outline: 3px solid rgba(255, 193, 7, 0.7);
    }



/* =========================================================
   ✅ MODAL SUMA LISTAS (FULL SCREEN)
   - Ventana completa
   - Scroll interno
   - Tabla centrada y compacta (como imagen 1)
   - Soporta Normal y Reventado
   ========================================================= */

/* =========================
   OVERLAY SUMA
========================= */
.modal-suma-overlay[b-s5r11w0vs9] {
    position: fixed;
    inset: 0;
    z-index: 5200;
    background: rgba(0,0,0,.35);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    overscroll-behavior: contain; /* evita scroll encadenado */
}

/* =========================
   CONTENEDOR MODAL SUMA
========================= */
.modal-suma[b-s5r11w0vs9] {
    background: #fff;
    border-radius: 18px;
    border: 1px solid #e6edf8;
    box-shadow: 0 18px 60px rgba(0,0,0,.18);
    overflow: hidden;
}

    /* FULL SCREEN real */
    .modal-suma.modal-suma-xl[b-s5r11w0vs9] {
        width: 99vw;
        height: 96vh;
        max-width: none;
        max-height: none;
        padding: 16px 18px;
        display: flex;
        flex-direction: column;
        overflow: hidden; /* scroll va adentro */
        border-radius: 18px;
        box-sizing: border-box;
    }

/* =========================
   TOPBAR (1 línea arriba)
========================= */
.suma-topbar[b-s5r11w0vs9] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid #e6edf8;
    border-radius: 14px;
    background: linear-gradient(180deg,#ffffff 0%, #f6f9ff 100%);
    box-shadow: 0 10px 30px rgba(25,55,110,.10);
    flex-wrap: wrap; /* si no cabe, baja bonito */
}

/* IZQ: título */
.suma-topbar-title[b-s5r11w0vs9] {
    flex: 0 0 auto;
}

/* Título (solo una vez, sin duplicado) */
.suma-title[b-s5r11w0vs9] {
    font-weight: 950;
    font-size: 1.18rem;
    color: #b13b14;
}

.suma-title-name[b-s5r11w0vs9] {
    color: #0f2f66;
}

/* CENTRO: chips */
.suma-topbar-meta[b-s5r11w0vs9] {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    min-width: 320px;
}

.chip[b-s5r11w0vs9] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 10px;
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,.10);
    background: #fff;
    box-shadow: 0 8px 18px rgba(0,0,0,.06);
    font-weight: 850;
    font-size: .95rem;
    color: #0f2f66;
    white-space: nowrap;
}

    .chip b[b-s5r11w0vs9] {
        font-weight: 950;
    }

.chip-normal[b-s5r11w0vs9] {
    background: #eef6ff;
    border-color: #cfe0ff;
}

.chip-rev[b-s5r11w0vs9] {
    background: #fff1f1;
    border-color: #ffd0d0;
    color: #a11414;
}

.chip-total[b-s5r11w0vs9] {
    background: #fff7e6;
    border-color: #ffd59a;
    color: #7a4a00;
}

.chip-ok[b-s5r11w0vs9] {
    background: #f3fff6;
    border-color: #bfe8c7;
    color: #0f7a2b;
}

.chip-danger[b-s5r11w0vs9] {
    background: #fff2f2;
    border-color: #ffbdbd;
    color: #b00020;
}

/* DERECHA: botones */
.suma-topbar-actions[b-s5r11w0vs9] {
    flex: 0 0 auto;
    display: flex;
    gap: 8px;
    align-items: center;
}

.btn-suma[b-s5r11w0vs9] {
    border: 1px solid rgba(0,0,0,.12);
    border-radius: 14px;
    padding: 10px 14px;
    font-weight: 950;
    font-size: .95rem;
    cursor: pointer;
    box-shadow: 0 10px 22px rgba(0,0,0,.10);
    transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
    user-select: none;
    height: 42px;
}

    .btn-suma:active[b-s5r11w0vs9] {
        transform: scale(.985);
    }

.btn-suma-sec[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#f2f4f8,#e6ebf5);
    color: #111827;
}

.btn-suma-primary[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#1f6fff,#0f3f9b);
    color: #fff;
    border-color: rgba(15,63,155,.30);
}

.btn-suma-apply[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#22c55e,#15803d);
    color: #fff;
    border-color: rgba(21,128,61,.30);
}

.btn-suma[disabled][b-s5r11w0vs9] {
    opacity: .55;
    cursor: not-allowed;
    filter: grayscale(.35);
}

/* =========================
   BODY (SCROLL INTERNO)
========================= */
.suma-body-scroll[b-s5r11w0vs9] {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    overscroll-behavior: contain;
    padding: 10px 8px 12px;
    box-sizing: border-box;
    /* ✅ CLAVE: centramos el contenido (como #listaCanvas) */
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

/* =========================================================
   ✅ TABLA (COMO IMAGEN 1)
   - NO se estira
   - Se centra
   - Tiene max-width fijo según modo
   ========================================================= */

/* Contenedor tabla */
.modal-suma .lista-unica-normal[b-s5r11w0vs9] {
    width: 100%;
    max-width: 1180px; /* igual que tu modal lista normal */
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 0;
}

.modal-suma .lista-unica-rev[b-s5r11w0vs9] {
    width: 100%;
    max-width: 1380px; /* igual que tu modal lista rev */
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 0;
}

/* Rejilla NORMAL (10 columnas = 5 parejas N° + Monto) */
.modal-suma .lista-unica-normal .fila-cabecera[b-s5r11w0vs9],
.modal-suma .lista-unica-normal .fila-numeros[b-s5r11w0vs9],
.modal-suma .lista-unica-normal .fila-totales-f[b-s5r11w0vs9] {
    display: grid;
    grid-template-columns: repeat(5, 70px 110px);
    column-gap: 6px;
    row-gap: 6px;
    justify-content: center; /* ✅ centrado */
}

/* Rejilla REVENTADO (15 columnas = 5 ternas N° + Monto + R) */
.modal-suma .lista-unica-rev .fila-cabecera[b-s5r11w0vs9],
.modal-suma .lista-unica-rev .fila-numeros[b-s5r11w0vs9],
.modal-suma .lista-unica-rev .fila-totales-f-rev[b-s5r11w0vs9] {
    display: grid;
    grid-template-columns: repeat(5, 70px 110px 110px);
    column-gap: 6px;
    row-gap: 6px;
    justify-content: center; /* ✅ centrado */
}

/* =========================
   CABECERAS
========================= */
.h-num[b-s5r11w0vs9],
.h-monto[b-s5r11w0vs9],
.h-monto-rev[b-s5r11w0vs9] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 950;
    border-radius: 10px;
    height: 28px;
    box-sizing: border-box;
    box-shadow: 0 10px 18px rgba(0,0,0,.10);
}

.h-num[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#1e78ff,#0d47a1);
    color: #fff;
    border: 1px solid rgba(13,71,161,.45);
}

.h-monto[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#46c27b,#2e8b57);
    color: #fff;
    border: 1px solid rgba(46,139,87,.45);
}

.h-monto-rev[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#ff6b5f,#c0392b);
    color: #fff;
    border: 1px solid rgba(192,57,43,.45);
}

/* =========================
   CELDAS (contraste mejorado)
========================= */
.celda-num[b-s5r11w0vs9],
.celda-monto[b-s5r11w0vs9],
.celda-monto-rev[b-s5r11w0vs9] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    font-weight: 900;
    padding: 0 8px;
    border-radius: 12px;
    height: 28px;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-shadow: 0 10px 18px rgba(0,0,0,.08);
}

/* Azul */
.celda-num[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#d7ecff,#c9e3ff);
    color: #0a406e;
    border: 1px solid rgba(10,64,110,.28);
}

/* Verde */
.celda-monto[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#d7f4e5,#c6edd9);
    color: #0a5c38;
    border: 1px solid rgba(10,92,56,.28);
}

/* Rojo */
.celda-monto-rev[b-s5r11w0vs9] {
    background: linear-gradient(180deg,#ffd3d3,#f7bebe);
    color: #b02222;
    border: 1px solid rgba(176,34,34,.28);
}

/* Input dentro de celda */
.input-monto-lista[b-s5r11w0vs9] {
    width: 100%;
    height: 100%;
    border: none;
    background: transparent;
    text-align: center;
    font-weight: 900;
    font-size: 15px;
    color: inherit;
    outline: none;
    padding: 0;
    margin: 0;
}

/* Foco */
.celda-monto:focus-within[b-s5r11w0vs9],
.celda-monto-rev:focus-within[b-s5r11w0vs9] {
    box-shadow: 0 0 0 3px rgba(25, 118, 210, 0.35), 0 10px 18px rgba(0,0,0,.10);
}


/* =========================================================
   ✅ MODAL COMPARACIÓN / DIFERENCIAS (MEJORADO)
   - Bordes notorios
   - Secciones marcadas
   - Encabezado sticky en la tabla
   - Filas con separación real
   ========================================================= */

.modal-dif-overlay[b-s5r11w0vs9] {
    position: fixed;
    inset: 0;
    background: rgba(10, 20, 40, .55);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px;
    z-index: 6200;
    backdrop-filter: blur(2px);
}

/* Tarjeta principal */
.modal-dif[b-s5r11w0vs9] {
    background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
    border-radius: 18px;
    border: 2px solid rgba(15, 47, 102, .18);
    box-shadow: 0 30px 90px rgba(0,0,0,.30), 0 0 0 8px rgba(255,255,255,.35);
    overflow: hidden;
}

/* Tamaño grande */
.modal-dif-xl[b-s5r11w0vs9] {
    width: min(1500px, 98vw);
    height: min(900px, 94vh);
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
}

/* =========================
   HEADER (TOP)
========================= */
.dif-top[b-s5r11w0vs9] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 14px;
    padding: 14px 16px;
    border-radius: 14px;
    background: radial-gradient(1200px 220px at 10% 0%, rgba(31,111,255,.12), transparent 65%), radial-gradient(1200px 220px at 90% 0%, rgba(34,197,94,.10), transparent 60%), linear-gradient(180deg, #ffffff 0%, #f6f9ff 100%);
    border: 2px solid rgba(15, 47, 102, .12);
    box-shadow: 0 12px 30px rgba(25,55,110,.12);
    margin-bottom: 12px;
}

.dif-title[b-s5r11w0vs9] {
    font-weight: 950;
    font-size: 1.35rem;
    color: #0f2f66;
    letter-spacing: .2px;
}

.dif-title-name[b-s5r11w0vs9] {
    color: #b13b14;
}

/* Sub-info como “chips” */
.dif-sub[b-s5r11w0vs9] {
    margin-top: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    color: #2c4874;
    font-size: .98rem;
}

    .dif-sub > span[b-s5r11w0vs9],
    .dif-sub > div[b-s5r11w0vs9] {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        padding: 7px 10px;
        border-radius: 999px;
        background: #fff;
        border: 1px solid rgba(15,47,102,.14);
        box-shadow: 0 10px 18px rgba(0,0,0,.06);
        font-weight: 850;
    }

.dif-top-right[b-s5r11w0vs9] {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    justify-content: flex-end;
}

    /* Si tus botones no tienen estilo, esto los mejora sin romper */
    .dif-top-right button[b-s5r11w0vs9] {
        border: 1px solid rgba(0,0,0,.14);
        border-radius: 12px;
        padding: 9px 12px;
        font-weight: 950;
        cursor: pointer;
        background: linear-gradient(180deg,#f2f4f8,#e6ebf5);
        box-shadow: 0 10px 20px rgba(0,0,0,.10);
        transition: transform .12s ease, box-shadow .12s ease;
        height: 40px;
    }

        .dif-top-right button:active[b-s5r11w0vs9] {
            transform: scale(.985);
        }

/* =========================
   BODY
========================= */
.dif-body[b-s5r11w0vs9] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    gap: 10px;
}

/* Mensaje vacío más visible */
.dif-empty[b-s5r11w0vs9] {
    padding: 16px;
    border: 2px dashed rgba(15,47,102,.25);
    border-radius: 14px;
    background: linear-gradient(180deg,#fbfdff,#f4f8ff);
    color: #0f2f66;
    font-weight: 900;
}

/* =========================
   TABLA (HEAD + SCROLL)
========================= */

/* Encabezado tabla */
.dif-grid-head[b-s5r11w0vs9] {
    display: grid;
    grid-template-columns: 70px 1fr 1fr 1fr;
    gap: 12px;
    font-weight: 950;
    color: #0f2f66;
    padding: 10px 12px;
    border: 2px solid rgba(15,47,102,.12);
    border-radius: 14px;
    background: linear-gradient(180deg,#ffffff,#f2f7ff);
    box-shadow: 0 10px 22px rgba(0,0,0,.06);
}

/* Scroll contenedor con borde real */
.dif-scroll[b-s5r11w0vs9] {
    border: 2px solid rgba(15,47,102,.12);
    border-radius: 14px;
    background: #fff;
    overflow: auto;
    flex: 1;
    min-height: 0;
    padding: 10px 12px;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.6);
}

/* Para que el head se “sienta” fijo visualmente */
.dif-grid-head[b-s5r11w0vs9] {
    position: sticky;
    top: 0;
    z-index: 2;
}

/* Cada fila como tarjeta */
.dif-row[b-s5r11w0vs9] {
    display: grid;
    grid-template-columns: 70px 1fr 1fr 1fr;
    gap: 12px;
    align-items: center;
    padding: 10px 10px;
    margin: 8px 0;
    border-radius: 14px;
    background: linear-gradient(180deg,#ffffff,#fbfdff);
    border: 1px solid rgba(15,47,102,.12);
    box-shadow: 0 10px 20px rgba(0,0,0,.05);
}

    /* Alternado suave */
    .dif-row:nth-child(even)[b-s5r11w0vs9] {
        background: linear-gradient(180deg,#ffffff,#f6f9ff);
    }

/* Número más llamativo */
.dif-num[b-s5r11w0vs9] {
    font-weight: 950;
    color: #0f2f66;
    background: linear-gradient(180deg,#d7ecff,#c9e3ff);
    border: 1px solid rgba(10,64,110,.20);
    border-radius: 12px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 18px rgba(0,0,0,.06);
}

/* Columnas */
.dif-col[b-s5r11w0vs9] {
    color: #2c4874;
    font-weight: 850;
}

/* Input de corrección más “pro” */
.dif-input[b-s5r11w0vs9] {
    width: 100%;
    padding: 10px 12px;
    border: 2px solid rgba(91,140,255,.25);
    border-radius: 12px;
    font-weight: 950;
    outline: none;
    background: linear-gradient(180deg,#ffffff,#f7fbff);
    box-shadow: 0 10px 18px rgba(0,0,0,.06);
}

    .dif-input:focus[b-s5r11w0vs9] {
        border-color: #5b8cff;
        box-shadow: 0 0 0 4px rgba(91,140,255,.18), 0 10px 18px rgba(0,0,0,.10);
    }

/* ===========================
   Modal alerta (centrado, moderno)
   Solo lo usa ModalSumaNav
   =========================== */
.suma-alert-overlay[b-s5r11w0vs9] {
    position: fixed;
    inset: 0;
    background: rgba(10, 20, 35, .55);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999999; /* arriba de todo */
    padding: 18px;
}

.suma-alert-card[b-s5r11w0vs9] {
    width: min(520px, 96vw);
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 18px 60px rgba(0,0,0,.25);
    border: 1px solid rgba(0,0,0,.08);
    overflow: hidden;
    transform: translateY(0);
    animation: sumaAlertIn-b-s5r11w0vs9 .12s ease-out;
}

@keyframes sumaAlertIn-b-s5r11w0vs9 {
    from {
        transform: translateY(10px);
        opacity: .6;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.suma-alert-head[b-s5r11w0vs9] {
    padding: 14px 16px;
    background: linear-gradient(135deg, #ffefef, #fff);
    border-bottom: 1px solid rgba(0,0,0,.08);
    display: flex;
    gap: 10px;
    align-items: center;
}

.suma-alert-badge[b-s5r11w0vs9] {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    font-weight: 900;
    color: #fff;
    background: #e11d48; /* rojo moderno */
}

.suma-alert-title[b-s5r11w0vs9] {
    font-weight: 900;
    font-size: 1.02rem;
    color: #111827;
}

.suma-alert-body[b-s5r11w0vs9] {
    padding: 14px 16px 10px 16px;
    color: #334155;
    line-height: 1.35;
    font-size: .98rem;
    white-space: pre-line; /* respeta saltos de línea */
}

.suma-alert-actions[b-s5r11w0vs9] {
    padding: 12px 16px 16px 16px;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.suma-alert-btn[b-s5r11w0vs9] {
    border: 0;
    border-radius: 12px;
    padding: 10px 14px;
    font-weight: 800;
    cursor: pointer;
}

.suma-alert-btn-ok[b-s5r11w0vs9] {
    background: #2563eb;
    color: #fff;
}

    .suma-alert-btn-ok:active[b-s5r11w0vs9] {
        transform: scale(.98);
    }

/* =========================================
   MODAL CONFIRMAR CREACIÓN DE LISTA
   ========================================= */
.modal-backdrop-lista[b-s5r11w0vs9] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(3px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    padding: 20px;
}

.modal-confirm-lista[b-s5r11w0vs9] {
    position: relative;
    z-index: 100000;
    width: min(460px, 92vw);
    max-height: 88vh;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    border: 1px solid #d8e6fb;
    border-radius: 22px;
    box-shadow: 0 20px 60px rgba(15, 23, 42, 0.22);
    padding: 26px 24px 22px;
    text-align: center;
    animation: modalListaPop-b-s5r11w0vs9 0.18s ease-out;
    box-sizing: border-box;
}

.modal-confirm-icono[b-s5r11w0vs9] {
    font-size: 34px;
    line-height: 1;
    margin-bottom: 12px;
}

.modal-confirm-titulo[b-s5r11w0vs9] {
    font-size: 1.38rem;
    font-weight: 900;
    color: #123b7a;
    margin-bottom: 12px;
}

.modal-confirm-texto[b-s5r11w0vs9] {
    font-size: 1.10rem;
    line-height: 1.62;
    color: #334155;
    margin-bottom: 24px;
    white-space: pre-line;
    text-align: center;
}

    .modal-confirm-texto strong[b-s5r11w0vs9],
    .modal-confirm-texto b[b-s5r11w0vs9] {
        color: #123b7a;
    }

    .modal-confirm-texto[b-s5r11w0vs9]::-webkit-scrollbar {
        width: 10px;
    }

    .modal-confirm-texto[b-s5r11w0vs9]::-webkit-scrollbar-thumb {
        background: #b8cbe6;
        border-radius: 999px;
    }

    .modal-confirm-texto[b-s5r11w0vs9]::-webkit-scrollbar-track {
        background: transparent;
    }

.modal-confirm-botones[b-s5r11w0vs9] {
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
}

.btn-modal-secundario[b-s5r11w0vs9],
.btn-modal-primario[b-s5r11w0vs9] {
    min-width: 130px;
    border: none;
    border-radius: 14px;
    padding: 12px 18px;
    font-size: 0.98rem;
    font-weight: 800;
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
}

.btn-modal-secundario[b-s5r11w0vs9] {
    background: #e8eef8;
    color: #23406f;
    box-shadow: 0 6px 16px rgba(36, 64, 111, 0.12);
}

.btn-modal-primario[b-s5r11w0vs9] {
    background: linear-gradient(180deg, #1f66c2 0%, #114ea5 100%);
    color: #fff;
    box-shadow: 0 10px 24px rgba(17, 78, 165, 0.28);
}

    .btn-modal-secundario:hover[b-s5r11w0vs9],
    .btn-modal-primario:hover[b-s5r11w0vs9] {
        transform: translateY(-1px);
    }

@keyframes modalListaPop-b-s5r11w0vs9 {
    from {
        opacity: 0;
        transform: scale(0.96);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

.modal-confirm-texto-grande[b-s5r11w0vs9] {
    font-size: 1.16rem;
    line-height: 1.7;
}

@media (max-width: 700px) {
    .modal-confirm-lista[b-s5r11w0vs9] {
        width: min(96vw, 96vw);
        max-height: 90vh;
        padding: 20px 16px 18px;
    }

    .modal-confirm-texto[b-s5r11w0vs9] {
        font-size: 1.02rem;
        line-height: 1.55;
    }

    .modal-confirm-botones[b-s5r11w0vs9] {
        flex-direction: column;
    }

    .btn-modal-secundario[b-s5r11w0vs9],
    .btn-modal-primario[b-s5r11w0vs9] {
        width: 100%;
    }
}

/* ==============================
   MODAL CAMBIOS DE LISTA
   DISEÑO NUEVO
   ============================== */
.modal-cambios-lista[b-s5r11w0vs9] {
    width: min(980px, 94vw) !important;
    max-width: 980px !important;
    max-height: 82vh !important;
    padding: 18px 18px 16px !important;
    border-radius: 20px !important;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
    border: 1px solid #d7e5fb !important;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28) !important;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    position: relative;
}

.modal-cambios-close[b-s5r11w0vs9] {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 38px;
    height: 38px;
    border: none;
    border-radius: 12px;
    background: linear-gradient(180deg, #ffe4e4 0%, #ffd1d1 100%);
    color: #b42318;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 10px 18px rgba(180, 0, 0, 0.12);
    z-index: 2;
}

    .modal-cambios-close:hover[b-s5r11w0vs9] {
        filter: brightness(1.03);
        transform: translateY(-1px);
    }

.modal-cambios-header[b-s5r11w0vs9] {
    padding-right: 52px;
    margin-bottom: 12px;
    text-align: left;
}

.modal-cambios-titulo[b-s5r11w0vs9] {
    font-size: 1.28rem;
    font-weight: 950;
    color: #123b7a;
    line-height: 1.2;
    margin-bottom: 4px;
}

.modal-cambios-subtitulo[b-s5r11w0vs9] {
    font-size: 1rem;
    font-weight: 700;
    color: #5b6c86;
    line-height: 1.4;
}

.modal-cambios-body[b-s5r11w0vs9] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 6px 2px 6px 2px;
    margin-bottom: 14px;
}

.modal-cambios-grid[b-s5r11w0vs9] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    align-items: start;
}

.modal-cambios-col[b-s5r11w0vs9] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.modal-cambio-item[b-s5r11w0vs9] {
    font-size: 1rem;
    font-weight: 800;
    color: #1e293b;
    background: linear-gradient(180deg, #f7f9ff 0%, #edf3ff 100%);
    border: 1px solid #cfdcff;
    border-radius: 10px;
    padding: 7px 10px;
    line-height: 1.35;
    text-align: left;
    word-break: break-word;
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.05);
}

.modal-cambios-footer[b-s5r11w0vs9] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding-top: 12px;
    border-top: 1px solid #dbe7fb;
    background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(248,251,255,0.96) 100%);
}

.modal-cambios-btn[b-s5r11w0vs9] {
    min-width: 170px;
    height: 46px;
    border: none;
    border-radius: 14px;
    font-size: 1rem;
    font-weight: 900;
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
}

    .modal-cambios-btn:hover[b-s5r11w0vs9] {
        transform: translateY(-1px);
    }

.modal-cambios-btn-secundario[b-s5r11w0vs9] {
    background: linear-gradient(180deg, #eef2f8 0%, #e2e8f2 100%);
    color: #29415f;
    box-shadow: 0 8px 18px rgba(41, 65, 95, 0.12);
}

.modal-cambios-btn-primario[b-s5r11w0vs9] {
    background: linear-gradient(180deg, #1f66c2 0%, #114ea5 100%);
    color: #fff;
    box-shadow: 0 12px 24px rgba(17, 78, 165, 0.28);
}

.modal-cambios-body[b-s5r11w0vs9]::-webkit-scrollbar {
    width: 10px;
}

.modal-cambios-body[b-s5r11w0vs9]::-webkit-scrollbar-thumb {
    background: #bfd0ea;
    border-radius: 999px;
}

.modal-cambios-body[b-s5r11w0vs9]::-webkit-scrollbar-track {
    background: transparent;
}

@media (max-width: 900px) {
    .modal-cambios-lista[b-s5r11w0vs9] {
        width: min(94vw, 94vw) !important;
        max-height: 84vh !important;
    }

    .modal-cambios-grid[b-s5r11w0vs9] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .modal-cambios-btn[b-s5r11w0vs9] {
        min-width: 150px;
    }
}

@media (max-width: 640px) {
    .modal-cambios-lista[b-s5r11w0vs9] {
        padding: 16px 14px 14px !important;
    }

    .modal-cambios-grid[b-s5r11w0vs9] {
        grid-template-columns: 1fr;
    }

    .modal-cambios-footer[b-s5r11w0vs9] {
        flex-direction: column;
    }

    .modal-cambios-btn[b-s5r11w0vs9] {
        width: 100%;
    }

    .modal-cambios-titulo[b-s5r11w0vs9] {
        font-size: 1.15rem;
    }

    .modal-cambio-item[b-s5r11w0vs9] {
        font-size: 0.96rem;
    }
}


.btn-deshabilitado[b-s5r11w0vs9] {
    opacity: 0.55;
    cursor: not-allowed;
    filter: grayscale(0.15);
}

    .btn-deshabilitado:hover[b-s5r11w0vs9] {
        opacity: 0.55;
        cursor: not-allowed;
        filter: grayscale(0.15);
    }

    .btn-deshabilitado:active[b-s5r11w0vs9] {
        transform: none;
    }

@media (max-width: 700px) {
    /* =========================
       LISTAS EDITOR - SOLO MÓVIL
       NO TOCA ESCRITORIO
       ========================= */

    /* ===== Card principal ===== */
    .listas-card[b-s5r11w0vs9] {
        padding: 14px 12px 16px;
        border-radius: 16px;
        box-sizing: border-box;
        overflow-x: hidden;
    }

    .listas-header[b-s5r11w0vs9] {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

        .listas-header .card-titulo[b-s5r11w0vs9] {
            font-size: 1.22rem;
            line-height: 1.2;
        }

    .listas-subtitulo[b-s5r11w0vs9] {
        font-size: 0.94rem;
        line-height: 1.35;
    }

    .listas-badge[b-s5r11w0vs9] {
        width: 100%;
    }

        .listas-badge span[b-s5r11w0vs9] {
            width: 100%;
            text-align: center;
            box-sizing: border-box;
        }

    /* ===== Fecha / Juego ===== */
    .listas-fecha-bar[b-s5r11w0vs9] {
        margin: 10px 0 14px;
        padding: 12px;
        border-radius: 14px;
    }

    .listas-fecha-label[b-s5r11w0vs9] {
        font-size: 0.88rem;
        line-height: 1.15;
    }

    .listas-fecha-control[b-s5r11w0vs9],
    .listas-juego-control[b-s5r11w0vs9] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
        width: 100%;
    }

    .input-fecha-compact[b-s5r11w0vs9],
    .listas-juego-select[b-s5r11w0vs9] {
        max-width: 100%;
        width: 100%;
    }

    .fecha-legible[b-s5r11w0vs9] {
        font-size: 0.95rem;
        line-height: 1.3;
        word-break: break-word;
    }

    .listas-juego-hint[b-s5r11w0vs9] {
        margin-left: 0;
    }

    /* ===== Filtros superiores ===== */
    .listas-filtros[b-s5r11w0vs9] {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .filtro[b-s5r11w0vs9] {
        width: 100%;
        min-width: 0;
    }

        .filtro > label[b-s5r11w0vs9] {
            font-size: 0.94rem;
            line-height: 1.2;
        }

    .hint[b-s5r11w0vs9] {
        font-size: 0.88rem;
        line-height: 1.35;
    }

    .listas-card .input[b-s5r11w0vs9],
    .listas-card select.input[b-s5r11w0vs9],
    .listas-card .input-compact[b-s5r11w0vs9] {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        min-height: 46px;
        font-size: 16px;
        box-sizing: border-box;
    }

    .select-usuario[b-s5r11w0vs9],
    .select-sorteo[b-s5r11w0vs9],
    .listas-sorteo-select[b-s5r11w0vs9],
    .listas-lista-numero[b-s5r11w0vs9] {
        max-width: 100%;
        width: 100%;
    }

    .listas-sorteo-head[b-s5r11w0vs9] {
        display: grid;
        grid-template-columns: 1fr 84px;
        gap: 10px;
        align-items: end;
        margin-bottom: 6px;
    }

    .listas-sorteo-head-main[b-s5r11w0vs9],
    .listas-sorteo-head-lista[b-s5r11w0vs9] {
        width: auto;
        margin: 0;
    }

    .listas-sorteo-row[b-s5r11w0vs9] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
        width: 100%;
    }

    .listas-lista-numero[b-s5r11w0vs9] {
        width: 100%;
    }

    /* ===== Botones de filtros ===== */
    .grupo-botones-lista[b-s5r11w0vs9] {
        flex-direction: column;
        gap: 8px;
    }

    .btn-lista[b-s5r11w0vs9],
    .btn-modificar-lista[b-s5r11w0vs9] {
        width: 100%;
        min-height: 48px;
        box-sizing: border-box;
        font-size: 0.96rem;
    }

    /* =========================================================
       MODAL PRINCIPAL LISTA
       ========================================================= */
    .modal-overlay[b-s5r11w0vs9] {
        position: fixed !important;
        inset: 0 !important;
        background: rgba(0,0,0,.58);
        z-index: 99998 !important;
        overflow: hidden;
        overscroll-behavior: contain;
        touch-action: none;
    }

    body:has(.modal-overlay)[b-s5r11w0vs9],
    body:has(.modal-suma-overlay)[b-s5r11w0vs9],
    body:has(.modal-dif-overlay)[b-s5r11w0vs9],
    body:has(.confirm-overlay)[b-s5r11w0vs9],
    body:has(.venta-modal-backdrop)[b-s5r11w0vs9],
    body:has(.admin-confirm-backdrop)[b-s5r11w0vs9],
    body:has(.modal-backdrop-lista)[b-s5r11w0vs9],
    body:has(.modal-ingreso-overlay)[b-s5r11w0vs9],
    body:has(.suma-alert-overlay)[b-s5r11w0vs9] {
        overflow: hidden;
        touch-action: none;
        position: fixed;
        width: 100%;
    }

    .modal-lista[b-s5r11w0vs9] {
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        width: calc(100vw - 14px) !important;
        max-width: calc(100vw - 14px) !important;
        height: auto !important;
        max-height: 92svh !important;
        border-radius: 16px;
        padding: 10px 8px 12px;
        overflow: hidden !important;
        display: flex !important;
        flex-direction: column !important;
        box-sizing: border-box;
    }

    .modal-close[b-s5r11w0vs9] {
        top: 8px;
        right: 8px;
        width: 40px;
        height: 40px;
        font-size: 20px;
        border-radius: 10px;
        z-index: 60 !important;
        position: absolute !important;
        box-shadow: 0 8px 20px rgba(180, 0, 0, 0.35) !important;
    }

    .modal-lista-actions[b-s5r11w0vs9] {
        position: relative;
        z-index: 1;
        display: flex;
        flex-direction: column;
        gap: 8px;
        margin: 0 0 10px 0;
        padding-right: 48px;
        box-sizing: border-box;
    }

    .toolbar-acciones .btn[b-s5r11w0vs9],
    .btn-guardar-lista[b-s5r11w0vs9],
    .btn-ingresar-lista[b-s5r11w0vs9],
    .btn-borrar-lista[b-s5r11w0vs9],
    .btn-info-lista[b-s5r11w0vs9] {
        width: 100%;
        min-width: 0;
        min-height: 46px;
        box-sizing: border-box;
        font-size: 0.94rem;
        justify-content: center;
    }

    #listaCanvas[b-s5r11w0vs9] {
        flex: 1 1 auto;
        min-height: 0;
        width: 100%;
        max-width: none;
        height: auto;
        padding: 8px 2px 8px;
        overflow-x: auto !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: auto;
        touch-action: pan-x pan-y;
    }

    #contentLista[b-s5r11w0vs9] {
        display: block;
        width: max-content !important;
        min-width: 100%;
        max-width: none !important;
    }

    /* ===== Headers dentro de lista ===== */
    .fila-header-modal[b-s5r11w0vs9] {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        margin-bottom: 10px;
    }

    .header-info[b-s5r11w0vs9] {
        width: 100%;
        gap: 8px;
    }

    .header-acciones[b-s5r11w0vs9] {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .titulo-sorteo-linea[b-s5r11w0vs9] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    .titulo-sorteo-modal[b-s5r11w0vs9] {
        font-size: 1.2rem;
        line-height: 1.2;
        word-break: break-word;
    }

    .fila-lista-selector[b-s5r11w0vs9] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 6px;
    }

    .select-lista[b-s5r11w0vs9] {
        width: 100%;
        min-height: 44px;
        font-size: 16px;
        box-sizing: border-box;
    }

    /* ===== Rejillas de listas ===== */
    .lista-unica-normal[b-s5r11w0vs9],
    .lista-unica-rev[b-s5r11w0vs9] {
        width: max-content;
        min-width: 100%;
    }

        .lista-unica-normal .fila-cabecera[b-s5r11w0vs9],
        .lista-unica-normal .fila-numeros[b-s5r11w0vs9],
        .lista-unica-normal .fila-totales-f[b-s5r11w0vs9] {
            grid-template-columns: repeat(5, 60px 88px);
            column-gap: 4px;
            row-gap: 4px;
        }

        .lista-unica-rev .fila-cabecera[b-s5r11w0vs9],
        .lista-unica-rev .fila-numeros[b-s5r11w0vs9],
        .lista-unica-rev .fila-totales-f-rev[b-s5r11w0vs9] {
            grid-template-columns: repeat(5, 60px 88px 88px);
            column-gap: 4px;
            row-gap: 4px;
        }

    .h-num[b-s5r11w0vs9],
    .h-monto[b-s5r11w0vs9],
    .h-monto-rev[b-s5r11w0vs9] {
        height: 24px;
        font-size: 11px;
        border-radius: 8px;
    }

    .celda-num[b-s5r11w0vs9],
    .celda-monto[b-s5r11w0vs9],
    .celda-monto-rev[b-s5r11w0vs9] {
        height: 32px;
        font-size: 13px;
        border-radius: 10px;
        padding: 0 4px;
    }

    .fila-totales-normal[b-s5r11w0vs9],
    .fila-totales-rev[b-s5r11w0vs9] {
        gap: 6px;
        margin-top: 4px;
        margin-bottom: 6px;
    }

        .fila-totales-normal .label[b-s5r11w0vs9],
        .fila-totales-rev .label[b-s5r11w0vs9],
        .fila-totales-normal .valor[b-s5r11w0vs9],
        .fila-totales-rev .valor[b-s5r11w0vs9] {
            font-size: 0.92rem;
            line-height: 1.2;
        }

    .fila-totales-f .label[b-s5r11w0vs9],
    .fila-totales-f .valor[b-s5r11w0vs9],
    .fila-totales-f-rev .label[b-s5r11w0vs9],
    .fila-totales-f-rev .valor-normal[b-s5r11w0vs9],
    .fila-totales-f-rev .valor-rev[b-s5r11w0vs9] {
        height: 28px;
        font-size: 12px;
        border-radius: 10px;
        padding: 0 4px;
    }

    /* =========================================================
       MODAL INGRESAR VENTAS
       ========================================================= */
    .modal-ingreso-overlay[b-s5r11w0vs9] {
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,.56);
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 10px;
        z-index: 100000;
        overflow: hidden;
        overscroll-behavior: contain;
        touch-action: none;
    }

    .modal-ingreso[b-s5r11w0vs9],
    .modal-ingreso-normal[b-s5r11w0vs9],
    .modal-ingreso-rev[b-s5r11w0vs9],
    .modal-ingreso-parley[b-s5r11w0vs9] {
        width: calc(100vw - 20px) !important;
        max-width: calc(100vw - 20px) !important;
        border-radius: 16px;
        padding: 14px 12px 12px;
        box-sizing: border-box;
    }

        .modal-ingreso h3[b-s5r11w0vs9] {
            font-size: 1.05rem;
            line-height: 1.2;
        }

    .modal-ingreso-body[b-s5r11w0vs9] {
        max-height: 52svh;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-y;
    }

    .modal-ingreso-normal .tabla-ingreso[b-s5r11w0vs9] {
        grid-template-columns: 68px 1fr !important;
    }

    .modal-ingreso-rev .tabla-ingreso[b-s5r11w0vs9] {
        grid-template-columns: 68px 1fr 1fr !important;
    }

    .modal-ingreso-parley .tabla-ingreso[b-s5r11w0vs9] {
        grid-template-columns: 56px 56px 1fr !important;
    }

    .ingreso-input[b-s5r11w0vs9] {
        min-height: 44px;
        font-size: 16px;
        box-sizing: border-box;
    }

    .footer-ingreso[b-s5r11w0vs9] {
        display: flex;
        flex-direction: column;
        gap: 10px;
        align-items: stretch;
    }

    .footer-ingreso-botones[b-s5r11w0vs9] {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

        .footer-ingreso-botones .btn[b-s5r11w0vs9] {
            width: 100%;
            min-height: 46px;
        }

    /* =========================================================
       MODAL SUMA LISTAS
       ========================================================= */
    .modal-suma-overlay[b-s5r11w0vs9] {
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,.58);
        overflow: hidden;
        overscroll-behavior: contain;
        touch-action: none;
    }

    .modal-suma[b-s5r11w0vs9],
    .modal-suma-xl[b-s5r11w0vs9],
    .modal-suma-rev[b-s5r11w0vs9],
    .modal-suma-normal[b-s5r11w0vs9] {
        width: calc(100vw - 16px) !important;
        max-width: calc(100vw - 16px) !important;
        height: auto !important;
        max-height: 92svh !important;
        margin: 0 auto;
        border-radius: 16px;
        overflow: hidden;
        box-sizing: border-box;
    }

    .suma-topbar[b-s5r11w0vs9] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        padding: 12px;
    }

    .suma-topbar-title[b-s5r11w0vs9],
    .suma-topbar-meta[b-s5r11w0vs9],
    .suma-topbar-actions[b-s5r11w0vs9] {
        width: 100%;
    }

    .suma-topbar-meta[b-s5r11w0vs9] {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .suma-topbar-actions[b-s5r11w0vs9] {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .btn-suma[b-s5r11w0vs9],
    .btn-suma-sec[b-s5r11w0vs9],
    .btn-suma-primary[b-s5r11w0vs9],
    .btn-suma-apply[b-s5r11w0vs9] {
        width: 100%;
        min-height: 46px;
        box-sizing: border-box;
    }

    .suma-body-scroll[b-s5r11w0vs9] {
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-x pan-y;
        padding: 10px;
    }

    /* =========================================================
       MODAL DIFERENCIAS
       ========================================================= */
    .modal-dif-overlay[b-s5r11w0vs9] {
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,.56);
        overflow: hidden;
        overscroll-behavior: contain;
        touch-action: none;
    }

    .modal-dif[b-s5r11w0vs9],
    .modal-dif-xl[b-s5r11w0vs9] {
        width: calc(100vw - 16px) !important;
        max-width: calc(100vw - 16px) !important;
        height: auto !important;
        max-height: 92svh !important;
        border-radius: 16px;
        overflow: hidden;
        box-sizing: border-box;
    }

    .dif-top[b-s5r11w0vs9] {
        display: flex;
        flex-direction: column;
        gap: 10px;
        padding: 12px;
    }

    .dif-top-right[b-s5r11w0vs9] {
        display: flex;
        flex-direction: column;
        gap: 8px;
        align-items: stretch;
    }

        .dif-top-right .btn[b-s5r11w0vs9] {
            width: 100%;
        }

    .dif-body[b-s5r11w0vs9] {
        padding: 10px;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
    }

    .dif-grid-head[b-s5r11w0vs9],
    .dif-row[b-s5r11w0vs9] {
        min-width: 640px;
    }

    .dif-scroll[b-s5r11w0vs9] {
        overflow: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* =========================================================
       MODALES PEQUEÑOS / INFO / CONFIRMACIONES
       ========================================================= */
    .confirm-box[b-s5r11w0vs9],
    .info-box[b-s5r11w0vs9],
    .admin-confirm-box[b-s5r11w0vs9],
    .modal-confirm-lista[b-s5r11w0vs9],
    .venta-modal[b-s5r11w0vs9],
    .suma-alert-card[b-s5r11w0vs9],
    .modal-cambios-lista[b-s5r11w0vs9] {
        width: calc(100vw - 20px) !important;
        max-width: calc(100vw - 20px) !important;
        border-radius: 16px;
        box-sizing: border-box;
    }

    .confirm-actions[b-s5r11w0vs9],
    .info-actions[b-s5r11w0vs9],
    .admin-confirm-actions[b-s5r11w0vs9],
    .modal-confirm-botones[b-s5r11w0vs9],
    .modal-cambios-footer[b-s5r11w0vs9],
    .suma-alert-actions[b-s5r11w0vs9] {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

        .confirm-actions .btn[b-s5r11w0vs9],
        .info-actions .btn[b-s5r11w0vs9],
        .admin-confirm-actions .admin-btn[b-s5r11w0vs9],
        .modal-confirm-botones button[b-s5r11w0vs9],
        .modal-cambios-footer button[b-s5r11w0vs9],
        .suma-alert-actions button[b-s5r11w0vs9] {
            width: 100%;
            min-height: 46px;
        }

    .modal-cambios-body[b-s5r11w0vs9] {
        max-height: 50svh;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
    }

    .modal-cambios-grid[b-s5r11w0vs9] {
        grid-template-columns: 1fr;
    }

    /* ===== Toast ===== */
    .toast-modal-centro[b-s5r11w0vs9] {
        width: calc(100vw - 24px);
        max-width: calc(100vw - 24px);
        font-size: 1rem;
        padding: 14px 16px;
    }

    /* ===== Blindaje ===== */
    html[b-s5r11w0vs9],
    body[b-s5r11w0vs9] {
        overflow-x: hidden;
    }

    .listas-card *:not(#listaCanvas):not(#listaCanvas *):not(#contentLista):not(#contentLista *)[b-s5r11w0vs9],
    .modal-lista *:not(#listaCanvas):not(#listaCanvas *):not(#contentLista):not(#contentLista *):not(.lista-unica-normal):not(.lista-unica-normal *):not(.lista-unica-rev):not(.lista-unica-rev *)[b-s5r11w0vs9],
    .modal-ingreso *[b-s5r11w0vs9],
    .modal-suma *[b-s5r11w0vs9],
    .modal-dif *[b-s5r11w0vs9],
    .confirm-box *[b-s5r11w0vs9],
    .info-box *[b-s5r11w0vs9],
    .admin-confirm-box *[b-s5r11w0vs9],
    .modal-confirm-lista *[b-s5r11w0vs9],
    .venta-modal *[b-s5r11w0vs9],
    .suma-alert-card *[b-s5r11w0vs9],
    .modal-cambios-lista *[b-s5r11w0vs9] {
        box-sizing: border-box;
        min-width: 0;
        max-width: 100%;
    }

    #listaCanvas[b-s5r11w0vs9],
    #listaCanvas *[b-s5r11w0vs9],
    #contentLista[b-s5r11w0vs9],
    #contentLista *[b-s5r11w0vs9] {
        box-sizing: border-box;
    }
}
/* _content/SistemaLoteriaDashboard/Components/Banca/Noticias.razor.rz.scp.css */
/* =========================
   CONTENEDOR PRINCIPAL
   - Más ancho
   - Mejor uso horizontal
   ========================= */
.noticias-admin[b-eqowyv7o49] {
    width: 100%;
    max-width: 1400px; /* ✅ más ancho */
    margin: 0;
    padding: 10px 10px 14px;
    box-sizing: border-box;
}

/* =========================
   LAYOUT 2 COLUMNAS (HORIZONTAL)
   - Izquierda: formulario
   - Derecha: historial
   ========================= */
.noticias-layout[b-eqowyv7o49] {
    display: grid;
    grid-template-columns: minmax(520px, 620px) minmax(520px, 1fr);
    gap: 18px;
    align-items: start;
    width: 100%;
}

/* Columna izquierda */
.noticias-left[b-eqowyv7o49] {
    min-width: 520px;
}

/* Columna derecha */
.noticias-right[b-eqowyv7o49] {
    min-width: 520px;
}

/* =========================
   FORMULARIO
   - Más grande y moderno
   ========================= */
.grid-form[b-eqowyv7o49] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* Labels más grandes */
.campo label[b-eqowyv7o49] {
    font-weight: 900;
    color: #123a74;
    display: block;
    margin-bottom: 8px;
    font-size: 15px; /* ✅ más grande */
    letter-spacing: .2px;
}

/* Inputs más grandes */
.inp[b-eqowyv7o49] {
    width: 100%;
    height: 52px; /* ✅ más alto */
    border: 1px solid rgba(120, 150, 205, .85);
    border-radius: 12px;
    padding: 10px 14px;
    font-weight: 800;
    font-size: 16px; /* ✅ texto más grande */
    color: #123a74;
    background: linear-gradient(180deg, #ffffff, #f7fbff);
    box-sizing: border-box;
    outline: none;
    transition: box-shadow .15s ease, transform .15s ease, border-color .15s ease;
}

    .inp:focus[b-eqowyv7o49] {
        border-color: #2b7cff;
        box-shadow: 0 0 0 4px rgba(43,124,255,.15);
    }

    /* Textarea grande */
    .inp.area[b-eqowyv7o49] {
        min-height: 170px; /* ✅ más alto */
        height: auto;
        resize: vertical;
        font-weight: 700;
        line-height: 1.3;
    }

/* Acciones del form */
.acciones-form[b-eqowyv7o49] {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    padding-top: 6px;
}

/* Botones más grandes */
.btn[b-eqowyv7o49] {
    height: 52px; /* ✅ más alto */
    border-radius: 12px;
    padding: 0 18px;
    font-weight: 900;
    font-size: 15px; /* ✅ más grande */
    cursor: pointer;
    transition: transform .12s ease, box-shadow .12s ease, opacity .12s ease;
}

    .btn:active[b-eqowyv7o49] {
        transform: scale(.98);
    }

.btn-prim[b-eqowyv7o49] {
    background: linear-gradient(90deg, #1565c0, #1e88e5);
    color: #fff;
    border: none;
    box-shadow: 0 10px 18px rgba(21,101,192,.18);
}

    .btn-prim:hover[b-eqowyv7o49] {
        box-shadow: 0 12px 22px rgba(21,101,192,.24);
    }

.btn-buscar[b-eqowyv7o49] {
    border: 1px solid rgba(43,124,255,.25);
    background: linear-gradient(180deg,#eef6ff,#e3f2fd);
    color: #0d47a1;
}

    .btn-buscar:hover[b-eqowyv7o49] {
        box-shadow: 0 10px 18px rgba(13,71,161,.10);
    }

.btn-danger[b-eqowyv7o49] {
    background: linear-gradient(180deg,#ffecec,#ffdede);
    color: #b71c1c;
    border: 1px solid #ffc4c9;
}

    .btn-danger:hover[b-eqowyv7o49] {
        box-shadow: 0 10px 18px rgba(183,28,28,.08);
    }

/* =========================
   DESTINATARIOS (HORIZONTAL REAL)
   - Evita que "se caigan" cosas encima
   - Todo se reparte a lo largo
   ========================= */
.fila-destinatarios[b-eqowyv7o49] {
    display: grid;
    grid-template-columns: minmax(320px, 380px) 1fr;
    gap: 12px;
    width: 100%;
    align-items: start;
}

/* Selector vendedores (ancho fijo pero flexible) */
.vendor-select-root[b-eqowyv7o49] {
    position: relative;
    width: 100%;
}

/* Botón selector */
.vendor-select-btn[b-eqowyv7o49] {
    width: 100%;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid rgba(120, 150, 205, .85);
    background: linear-gradient(180deg, #ffffff, #f7fbff);
    border-radius: 12px;
    padding: 8px 12px;
    cursor: pointer;
    transition: box-shadow .15s ease, transform .15s ease, border-color .15s ease;
}

    .vendor-select-btn:hover[b-eqowyv7o49] {
        box-shadow: 0 10px 18px rgba(16, 60, 120, .10);
    }

.vs-left[b-eqowyv7o49] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    overflow: hidden;
}

.vs-title[b-eqowyv7o49] {
    font-weight: 900;
    font-size: 15px;
    color: #123a74;
    line-height: 1.05;
}

.vs-sub[b-eqowyv7o49] {
    font-weight: 800;
    font-size: 13px;
    color: #52627a;
    line-height: 1.05;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.vs-arrow[b-eqowyv7o49] {
    font-weight: 900;
    color: #0d47a1;
    font-size: 14px;
}

/* Dropdown vendedores
   ✅ IMPORTANTE: que no se encime con historial
   -> Lo dejamos dentro del flujo visual y con buen z-index
*/
.vendor-dropdown[b-eqowyv7o49] {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    width: 100%;
    z-index: 2000;
    background: #fff;
    border: 1px solid rgba(120, 150, 205, .9);
    border-radius: 14px;
    box-shadow: 0 14px 28px rgba(0,0,0,.14);
    padding: 10px;
    box-sizing: border-box;
}

/* Toolbar */
.vendor-toolbar[b-eqowyv7o49] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

.chk[b-eqowyv7o49] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 900;
    color: #123a74;
    font-size: 14px;
}

/* Lista de vendedores */
.vendor-list[b-eqowyv7o49] {
    max-height: 320px; /* ✅ más alto */
    overflow: auto;
    border: 1px solid #c7d6ef;
    border-radius: 12px;
    background: linear-gradient(180deg,#ffffff,#fbfdff);
}

/* Fila vendedor */
.u-item[b-eqowyv7o49] {
    display: grid;
    grid-template-columns: 18px 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 10px 10px;
    border-bottom: 1px solid #edf2fb;
    font-weight: 800;
    color: #123a74;
    cursor: pointer;
}

    .u-item:last-child[b-eqowyv7o49] {
        border-bottom: none;
    }

    .u-item:hover[b-eqowyv7o49] {
        background: #f5f9ff;
    }

    .u-item input[b-eqowyv7o49] {
        margin: 0;
    }

    .u-item.sel[b-eqowyv7o49] {
        background: #eef6ff;
    }

    .u-item.focus[b-eqowyv7o49] {
        outline: 3px solid rgba(255,179,0,.35);
        outline-offset: -3px;
    }

.u-nombre[b-eqowyv7o49] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.u-id[b-eqowyv7o49] {
    font-size: 12px;
    font-weight: 900;
    color: #0d47a1;
    background: #eaf2ff;
    border: 1px solid #cfe0f5;
    border-radius: 999px;
    padding: 2px 10px;
}

/* Buscador lateral (derecha de destinatarios) */
.buscador-lateral[b-eqowyv7o49] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
    align-items: center;
    width: 100%;
    min-width: 0;
}

.inp.buscador[b-eqowyv7o49] {
    height: 52px;
}

/* Texto “no hay vendedores” */
.usuarios-vacio[b-eqowyv7o49] {
    padding: 12px;
    font-weight: 800;
    color: #52627a;
    font-size: 14px;
}

/* =========================
   HISTORIAL (derecha)
   - Más grande
   - Scroll estable
   ========================= */
.noticias-right .lista[b-eqowyv7o49] {
    max-height: calc(100vh - 210px);
    overflow: auto;
    padding-right: 8px;
    scrollbar-gutter: stable;
}

/* Título historial */
.lista-titulo[b-eqowyv7o49] {
    font-weight: 900;
    color: #123a74;
    margin-bottom: 12px;
    font-size: 16px;
}

/* Item noticia */
.item[b-eqowyv7o49] {
    background: linear-gradient(180deg,#ffffff,#f9fbff);
    border: 1px solid rgba(120, 150, 205, .9);
    border-radius: 16px;
    padding: 14px;
    margin-bottom: 12px;
    box-shadow: 0 10px 18px rgba(20, 60, 120, .08);
}

/* Top: título + meta */
.top[b-eqowyv7o49] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
    align-items: start;
}

.t[b-eqowyv7o49] {
    font-weight: 950;
    color: #123a74;
    font-size: 16px;
    line-height: 1.1;
}

/* badges */
.meta[b-eqowyv7o49] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.badge[b-eqowyv7o49] {
    font-size: 12px;
    font-weight: 900;
    padding: 5px 10px;
    border-radius: 999px;
    border: 1px solid rgba(43,124,255,.22);
    background: #e3f2fd;
    color: #0d47a1;
}

    .badge.ok[b-eqowyv7o49] {
        background: #e8f5e9;
        color: #1b5e20;
        border-color: rgba(27,94,32,.18);
    }

    .badge.priv[b-eqowyv7o49] {
        background: #fff3e0;
        color: #e65100;
        border-color: rgba(230,81,0,.18);
    }

/* Body */
.body[b-eqowyv7o49] {
    margin: 10px 0 8px;
    font-weight: 750;
    font-size: 14.5px;
    color: #334155;
    line-height: 1.3;
}

.dest[b-eqowyv7o49] {
    font-weight: 850;
    color: #52627a;
    font-size: 13.5px;
}

/* Acciones item */
.acciones-item[b-eqowyv7o49] {
    display: flex;
    justify-content: flex-end;
    padding-top: 8px;
}

/* Empty */
.empty[b-eqowyv7o49] {
    padding: 12px;
    font-weight: 800;
    color: #52627a;
}

/* =========================
   RESPONSIVE
   - Solo en pantallas pequeñas baja a vertical
   ========================= */
@media (max-width: 1200px) {
    .noticias-layout[b-eqowyv7o49] {
        grid-template-columns: 1fr;
    }

    .noticias-left[b-eqowyv7o49],
    .noticias-right[b-eqowyv7o49] {
        min-width: 0;
    }

    .fila-destinatarios[b-eqowyv7o49] {
        grid-template-columns: 1fr;
    }

    .buscador-lateral[b-eqowyv7o49] {
        grid-template-columns: 1fr;
    }

    .acciones-form[b-eqowyv7o49] {
        justify-content: stretch;
    }

    .btn[b-eqowyv7o49] {
        width: 100%;
    }

    .noticias-right .lista[b-eqowyv7o49] {
        max-height: none;
    }
}

@media (max-width: 700px) {
    /* =========================
       NOTICIAS / MENSAJES
       SOLO MÓVIL
       NO TOCA ESCRITORIO
       ========================= */

    .noticias-admin[b-eqowyv7o49] {
        padding: 8px 8px 14px;
        border-radius: 14px;
        box-sizing: border-box;
        overflow-x: hidden;
    }

    .card-titulo[b-eqowyv7o49] {
        font-size: 1.08rem;
        line-height: 1.2;
        margin-bottom: 10px;
    }

    .noticias-layout[b-eqowyv7o49] {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .noticias-left[b-eqowyv7o49],
    .noticias-right[b-eqowyv7o49] {
        min-width: 0;
        width: 100%;
    }

    .grid-form[b-eqowyv7o49] {
        gap: 12px;
    }

    .campo label[b-eqowyv7o49] {
        font-size: 0.94rem;
        line-height: 1.2;
        margin-bottom: 6px;
    }

    .inp[b-eqowyv7o49] {
        height: 46px;
        padding: 10px 12px;
        font-size: 16px;
        border-radius: 12px;
        box-sizing: border-box;
    }

        .inp.area[b-eqowyv7o49] {
            min-height: 140px;
        }

    /* ===== Destinatarios ===== */
    .fila-destinatarios[b-eqowyv7o49] {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }

    .vendor-select-root[b-eqowyv7o49],
    .buscador-lateral[b-eqowyv7o49] {
        width: 100%;
        min-width: 0;
    }

    .vendor-select-btn[b-eqowyv7o49] {
        height: 52px;
        padding: 8px 12px;
        border-radius: 12px;
    }

    .vs-title[b-eqowyv7o49] {
        font-size: 0.96rem;
    }

    .vs-sub[b-eqowyv7o49] {
        font-size: 0.82rem;
        line-height: 1.15;
    }

    .vs-arrow[b-eqowyv7o49] {
        font-size: 13px;
        flex: 0 0 auto;
    }

    /* ===== Dropdown vendedores ===== */
    .vendor-dropdown[b-eqowyv7o49] {
        position: fixed;
        left: 10px;
        right: 10px;
        top: 50%;
        transform: translateY(-50%);
        width: auto;
        max-height: 76vh;
        border-radius: 16px;
        padding: 10px;
        z-index: 4000;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        overflow: hidden;
    }

    .vendor-toolbar[b-eqowyv7o49] {
        flex: 0 0 auto;
        margin-bottom: 10px;
        padding-bottom: 8px;
        border-bottom: 1px solid #e7eefb;
    }

    .chk[b-eqowyv7o49] {
        font-size: 0.95rem;
        line-height: 1.25;
    }

    .vendor-list[b-eqowyv7o49] {
        flex: 1 1 auto;
        max-height: none;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-y;
        border-radius: 12px;
    }

    .u-item[b-eqowyv7o49] {
        grid-template-columns: 18px 1fr auto;
        gap: 10px;
        padding: 10px 10px;
        min-height: 48px;
    }

    .u-nombre[b-eqowyv7o49] {
        white-space: normal;
        overflow: visible;
        text-overflow: unset;
        line-height: 1.25;
        word-break: break-word;
        font-size: 0.95rem;
    }

    .u-id[b-eqowyv7o49] {
        font-size: 11px;
        padding: 2px 8px;
    }

    .usuarios-vacio[b-eqowyv7o49] {
        font-size: 0.94rem;
        line-height: 1.3;
    }

    /* ===== Buscador lateral ===== */
    .buscador-lateral[b-eqowyv7o49] {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .inp.buscador[b-eqowyv7o49] {
        height: 46px;
    }

    .btn-buscar[b-eqowyv7o49] {
        width: 100%;
    }

    /* ===== Botones formulario ===== */
    .acciones-form[b-eqowyv7o49] {
        display: flex;
        flex-direction: column;
        gap: 8px;
        justify-content: stretch;
        padding-top: 4px;
    }

    .btn[b-eqowyv7o49] {
        width: 100%;
        height: 46px;
        font-size: 0.95rem;
        padding: 0 14px;
        border-radius: 12px;
        box-sizing: border-box;
    }

    /* ===== Historial ===== */
    .noticias-right .lista[b-eqowyv7o49] {
        max-height: none;
        overflow: visible;
        padding-right: 0;
    }

    .lista-titulo[b-eqowyv7o49] {
        font-size: 0.98rem;
        margin-bottom: 10px;
    }

    .item[b-eqowyv7o49] {
        border-radius: 14px;
        padding: 12px;
        margin-bottom: 10px;
    }

    .top[b-eqowyv7o49] {
        display: flex;
        flex-direction: column;
        gap: 8px;
        align-items: stretch;
    }

    .t[b-eqowyv7o49] {
        font-size: 1rem;
        line-height: 1.2;
    }

    .meta[b-eqowyv7o49] {
        justify-content: flex-start;
        gap: 6px;
    }

    .badge[b-eqowyv7o49] {
        font-size: 11px;
        padding: 5px 8px;
    }

    .body[b-eqowyv7o49] {
        margin: 8px 0 8px;
        font-size: 0.93rem;
        line-height: 1.35;
    }

    .dest[b-eqowyv7o49] {
        font-size: 0.88rem;
        line-height: 1.35;
        word-break: break-word;
    }

    .acciones-item[b-eqowyv7o49] {
        justify-content: stretch;
        padding-top: 8px;
    }

        .acciones-item .btn-danger[b-eqowyv7o49] {
            width: 100%;
        }

    .empty[b-eqowyv7o49] {
        font-size: 0.94rem;
        line-height: 1.3;
    }

    /* ===== Bloqueo de fondo cuando el dropdown está abierto ===== */
    .vendor-select-root[b-eqowyv7o49]::before {
        content: "";
        position: fixed;
        inset: 0;
        background: rgba(15, 23, 42, 0.42);
        z-index: 3999;
        opacity: 0;
        pointer-events: none;
        transition: opacity .12s ease;
    }

    .vendor-select-root:has(.vendor-dropdown)[b-eqowyv7o49]::before {
        opacity: 1;
        pointer-events: auto;
    }

    body:has(.vendor-dropdown)[b-eqowyv7o49] {
        overflow: hidden;
        touch-action: none;
        position: fixed;
        width: 100%;
    }

    /* ===== Blindaje general ===== */
    html[b-eqowyv7o49],
    body[b-eqowyv7o49] {
        overflow-x: hidden;
    }

    .noticias-admin *[b-eqowyv7o49],
    .vendor-dropdown *[b-eqowyv7o49] {
        box-sizing: border-box;
        min-width: 0;
        max-width: 100%;
    }
}
/* _content/SistemaLoteriaDashboard/Components/Banca/PagosRetiros.razor.rz.scp.css */
/* =========================================================
   PAGOS Y RETIROS (PR) - CSS FINAL
   - Corrige: Desde/Hasta (pr-datebox / pr-datebtn)
   - Corrige: alineación Monto vs ₡ con TD flex
   - NO toca: columna Fecha de la tabla
   ========================================================= */

/* ========== SHELL / HEADER ========== */
.pr-shell[b-cxcwgmjmur] {
    padding: 14px;
}

.pr-head[b-cxcwgmjmur] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 12px;
}

.pr-sub[b-cxcwgmjmur] {
    color: #52627a;
    font-size: .95rem;
}

/* ========== GRID PRINCIPAL ========== */
.pr-grid[b-cxcwgmjmur] {
    display: grid;
    grid-template-columns: 520px 1fr;
    gap: 14px;
    align-items: start;
}

@media (max-width:980px) {
    .pr-grid[b-cxcwgmjmur] {
        grid-template-columns: 1fr;
    }
}

/* ========== CARDS ========== */
.pr-card[b-cxcwgmjmur] {
    background: #fff;
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 14px;
    padding: 14px;
    box-shadow: 0 6px 16px rgba(0,0,0,.06);
    margin-bottom: 14px;
}

.pr-left .pr-card[b-cxcwgmjmur] {
    padding: 18px;
    border-radius: 16px;
}

.pr-card-title[b-cxcwgmjmur] {
    font-weight: 900;
    color: #153e75;
    margin-bottom: 10px;
}

.pr-left .pr-card-title[b-cxcwgmjmur] {
    font-size: 1.15rem;
    margin-bottom: 12px;
}

/* ========== TABS ========== */
.pr-tabs[b-cxcwgmjmur] {
    display: flex;
    background: #f2f6ff;
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 14px;
    overflow: hidden;
    margin-bottom: 12px;
}

.pr-tab[b-cxcwgmjmur] {
    flex: 1;
    border: 0;
    padding: 14px 14px;
    background: transparent;
    font-weight: 900;
    color: #2b3c55;
    cursor: pointer;
    font-size: 1.05rem;
}

    .pr-tab.active[b-cxcwgmjmur] {
        background: linear-gradient(90deg,#003366,#0066cc);
        color: #fff;
    }

/* ========== BUSCADOR / INPUTS ========== */
.pr-search-row[b-cxcwgmjmur] {
    display: flex;
    gap: 10px;
}

.pr-input[b-cxcwgmjmur], .pr-select[b-cxcwgmjmur], .pr-date[b-cxcwgmjmur] {
    width: 100%;
    border: 1px solid rgba(0,0,0,.10);
    border-radius: 12px;
    padding: 10px 12px;
    outline: none;
    font-size: .98rem;
}

.pr-left .pr-input[b-cxcwgmjmur],
.pr-left .pr-select[b-cxcwgmjmur] {
    padding: 14px 14px;
    font-size: 1.05rem;
    border-radius: 14px;
}

.pr-select-wrap[b-cxcwgmjmur] {
    margin-top: 10px;
}

/* ========== BOTONES ========== */
.pr-btn[b-cxcwgmjmur] {
    border: 0;
    border-radius: 12px;
    padding: 10px 12px;
    font-weight: 900;
    cursor: pointer;
    background: #dfeaff;
    color: #153e75;
}

.pr-left .pr-btn[b-cxcwgmjmur] {
    padding: 14px 14px;
    font-size: 1.05rem;
    border-radius: 14px;
}

.pr-btn:disabled[b-cxcwgmjmur] {
    opacity: .6;
    cursor: not-allowed;
}

.pr-btn-primary[b-cxcwgmjmur] {
    background: linear-gradient(90deg,#003366,#0066cc);
    color: #fff;
}

.pr-btn-soft[b-cxcwgmjmur] {
    background: #edf4ff;
    color: #153e75;
    border: 1px solid rgba(0,0,0,.08);
}

/* ========== FORM ========== */
.pr-form[b-cxcwgmjmur] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.pr-field label[b-cxcwgmjmur] {
    display: block;
    font-size: .85rem;
    color: #52627a;
    font-weight: 800;
    margin-bottom: 6px;
}

/* ========== VENDEDOR INFO ========== */
.pr-vend-info[b-cxcwgmjmur] {
    margin-top: 10px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.pr-vend-name[b-cxcwgmjmur] {
    font-weight: 950;
    color: #102a52;
    font-size: 1.15rem;
}

/* Saldo */
.pr-saldo-box[b-cxcwgmjmur] {
    padding: 14px;
    border-radius: 16px;
    border: 1px solid rgba(0,0,0,.08);
    background: #f7fbff;
}

    .pr-saldo-box .k[b-cxcwgmjmur] {
        color: #52627a;
        font-weight: 900;
        font-size: .95rem;
    }

    .pr-saldo-box .v[b-cxcwgmjmur] {
        font-size: 1.8rem;
        font-weight: 1000;
    }

    .pr-saldo-box.pos .v[b-cxcwgmjmur] {
        color: #0b7a2a;
    }

    .pr-saldo-box.neg .v[b-cxcwgmjmur] {
        color: #b00020;
    }

/* ========== RANGO HISTORIAL (ARREGLADO) ========== */
.pr-range-wrap[b-cxcwgmjmur] {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 12px;
}

/* ✅ en vez de "auto auto auto", aquí va estable:
   2 columnas iguales + botón */
.pr-range[b-cxcwgmjmur] {
    width: fit-content;
    max-width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    gap: 12px;
    align-items: end;
    padding: 12px;
    border-radius: 16px;
    border: 1px solid rgba(0,0,0,.10);
    background: linear-gradient(180deg, rgba(0,102,204,.10), rgba(0,51,102,.04));
}

/* Input date del lado derecho */
.pr-right .pr-date[b-cxcwgmjmur] {
    height: 52px;
    padding: 0 14px;
    font-size: 1.05rem;
    font-weight: 900;
    border-radius: 14px;
}

/* ✅ ESTO FALTABA (Tus clases del Razor) */
.pr-datebox[b-cxcwgmjmur] {
    display: block;
    width: 100%;
}

.pr-datebtn[b-cxcwgmjmur] {
    height: 52px;
    width: 44px;
    border-radius: 12px;
    border: 1px solid rgba(0,0,0,.10);
    background: #fff;
    cursor: pointer;
    font-weight: 900;
    line-height: 1;
}

    .pr-datebtn:hover[b-cxcwgmjmur] {
        background: #edf4ff;
    }

/* ========== TABLA HISTORIAL ========== */
.pr-table-wrap[b-cxcwgmjmur] {
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 12px;
    overflow: auto;
    max-height: 62vh;
}

/* ✅ mínimo ancho para que NO se aplaste; si no cabe, hay scroll */
.pr-table[b-cxcwgmjmur] {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    table-layout: fixed;
    font-size: 1.02rem;
}

    /* ✅ MISMO padding base en TH/TD (esto da alineación real) */
    .pr-table thead th[b-cxcwgmjmur],
    .pr-table tbody td[b-cxcwgmjmur] {
        box-sizing: border-box;
        padding: 12px 16px;
    }

    /* Header */
    .pr-table thead th[b-cxcwgmjmur] {
        background: #0b2a4a;
        color: #fff;
        font-weight: 950;
        font-size: 1.02rem;
        border-bottom: 1px solid rgba(0,0,0,.08);
        position: sticky;
        top: 0;
        z-index: 2;
        text-align: left;
    }

    /* Filas */
    .pr-table tbody td[b-cxcwgmjmur] {
        font-size: 1.10rem;
        font-weight: 900;
        border-bottom: 1px solid rgba(0,0,0,.06);
        color: #2b3c55;
        background: #fff;
    }

    .pr-table tbody tr:nth-child(even) td[b-cxcwgmjmur] {
        background: #f7fbff;
    }

    .pr-table tbody tr:hover td[b-cxcwgmjmur] {
        background: #e8f2ff;
    }

    /* ========== COLUMNAS (Fecha NO tocar) ========== */
    /* FECHA (NO tocar) */
    .pr-table th:nth-child(1)[b-cxcwgmjmur],
    .pr-table td:nth-child(1)[b-cxcwgmjmur] {
        width: 240px;
        white-space: nowrap;
    }

    /* TIPO */
    .pr-table th:nth-child(2)[b-cxcwgmjmur],
    .pr-table td:nth-child(2)[b-cxcwgmjmur] {
        width: 170px;
        text-align: center;
        padding-left: 100px; /* lo empuja a la derecha */
    }

    /* ✅ MONTO: clave final
   - TH y TD mismo ancho + mismo padding-right
   - TH right, TD right, y TD es flex por pr-monto-cell */
    .pr-table th:nth-child(3)[b-cxcwgmjmur],
    .pr-table td:nth-child(3)[b-cxcwgmjmur] {
        width: 450px;
        text-align: left;
        padding-left: 300px; /* ✅ tu ajuste, pero ahora SÍ queda idéntico en TH y TD */
    }

    /* NOTA (aire a la derecha) */
    .pr-table th:nth-child(4)[b-cxcwgmjmur],
    .pr-table td:nth-child(4)[b-cxcwgmjmur] {
        width: auto;
        padding-left: 200px;
        min-width: 50px;

    }

/* ✅ Celda monto (valor + botón) */
.pr-monto-cell[b-cxcwgmjmur] {
    display: flex;
    justify-content: flex-end;
    align-items: left;
    gap: 10px;
    width: 100%;
}

/* números “pro” */
.pr-monto-val[b-cxcwgmjmur] {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* Nota */
.pr-table td.note[b-cxcwgmjmur] {
    color: #52627a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Botón editar */
.pr-mini[b-cxcwgmjmur] {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    border: 1px solid rgba(0,0,0,.10);
    background: #fff;
    cursor: pointer;
    font-weight: 900;
    flex: 0 0 auto;
}


/* Badges */
.pr-badge[b-cxcwgmjmur] {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 999px;
    font-weight: 900;
    font-size: .85rem;
}

    .pr-badge.dep[b-cxcwgmjmur] {
        background: #eaf7ff;
        color: #0c4a6e;
        border: 1px solid rgba(0,0,0,.08);
    }

    .pr-badge.ret[b-cxcwgmjmur] {
        background: #fff0f0;
        color: #7a1111;
        border: 1px solid rgba(0,0,0,.08);
    }

/* ========== MODALES (igual que tenías) ========== */
.pr-modal-overlay[b-cxcwgmjmur] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.35);
    z-index: 9999;
}

.pr-modal[b-cxcwgmjmur] {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: min(560px,94vw);
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 18px 50px rgba(0,0,0,.28);
    z-index: 10000;
    overflow: hidden;
}

.pr-modal-head[b-cxcwgmjmur] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 14px;
    background: linear-gradient(90deg,#003366,#0066cc);
    color: #fff;
}

    .pr-modal-head .t[b-cxcwgmjmur] {
        font-weight: 1000;
    }

    .pr-modal-head .x[b-cxcwgmjmur] {
        border: 0;
        background: transparent;
        color: #fff;
        font-size: 22px;
        cursor: pointer;
    }

.pr-modal-body[b-cxcwgmjmur] {
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.pr-row[b-cxcwgmjmur] {
    display: grid;
    grid-template-columns: 140px 1fr;
    gap: 10px;
    align-items: center;
}

    .pr-row .k[b-cxcwgmjmur] {
        color: #52627a;
        font-weight: 900;
    }

    .pr-row .v[b-cxcwgmjmur] {
        font-weight: 900;
        color: #102a52;
    }

.pr-warn[b-cxcwgmjmur] {
    padding: 10px;
    border-radius: 12px;
    background: #fff7e6;
    border: 1px solid rgba(0,0,0,.08);
    color: #6b4e00;
    font-weight: 800;
}

.pr-confirm-text[b-cxcwgmjmur] {
    font-size: 1.02rem;
    color: #102a52;
}

.pr-modal-foot[b-cxcwgmjmur] {
    padding: 12px 14px;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    border-top: 1px solid rgba(0,0,0,.08);
}
/* ================================
   PR: Saldo anterior / actual (por fila)
   (Agregar al FINAL del CSS PR)
   ================================ */

.pr-monto-stack[b-cxcwgmjmur]{
    display:flex;
    flex-direction:column;
    gap:6px;
}

/* rojo: saldo antes */
.pr-saldo-antes[b-cxcwgmjmur]{
    font-size:.86rem;
    font-weight:900;
    color:#b00020;
}

/* verde: saldo después */
.pr-saldo-despues[b-cxcwgmjmur]{
    font-size:.86rem;
    font-weight:900;
    color:#0b7a2a;
}

/* =========================================================
   MODALES MÁS GRANDES + MONTO MÁS VISIBLE (Editar / Confirmar)
   Pegar al FINAL del CSS para que gane por cascada
   ========================================================= */

/* ✅ Modal general: más ancho y más padding */
.pr-modal[b-cxcwgmjmur] {
    width: min(780px, 95vw) !important;
    max-width: 95vw !important;
    padding: 0 !important;
    border-radius: 18px !important;
}

    /* ✅ Modal confirmación: un poco más ancho todavía */
    .pr-modal.pr-modal-confirm[b-cxcwgmjmur] {
        width: min(860px, 96vw) !important;
        max-width: 96vw !important;
    }

/* ✅ Cabecera del modal más grande */
.pr-modal-head[b-cxcwgmjmur] {
    padding: 18px 22px !important;
}

    .pr-modal-head .t[b-cxcwgmjmur] {
        font-size: 20px !important;
        font-weight: 800 !important;
    }

/* ✅ Cuerpo del modal: más espacio y letra más grande */
.pr-modal-body[b-cxcwgmjmur] {
    padding: 18px 22px 16px 22px !important;
    font-size: 16px !important;
}

    /* ✅ Filas dentro del modal (Vendedor / Tipo / Monto actual...) */
    .pr-modal-body .pr-row[b-cxcwgmjmur] {
        gap: 12px !important;
        padding: 10px 0 !important;
    }

        .pr-modal-body .pr-row .k[b-cxcwgmjmur] {
            font-size: 14px !important;
            opacity: .85 !important;
            font-weight: 700 !important;
        }

        .pr-modal-body .pr-row .v[b-cxcwgmjmur] {
            font-size: 18px !important;
            font-weight: 800 !important;
        }

/* ✅ Inputs del modal más grandes */
.pr-modal .pr-input[b-cxcwgmjmur] {
    font-size: 18px !important;
    padding: 12px 14px !important;
    border-radius: 12px !important;
}

    /* ✅ “Monto nuevo” aún más grande y notorio
   (aplica a cualquier input dentro del modal, pero lo reforzamos abajo con clase) */
    .pr-modal .pr-input.pr-input-monto[b-cxcwgmjmur] {
        font-size: 24px !important;
        font-weight: 900 !important;
        letter-spacing: .3px !important;
        padding: 14px 16px !important;
    }

/* ✅ Bloque de advertencia */
.pr-modal .pr-warn[b-cxcwgmjmur] {
    margin-top: 12px !important;
    padding: 12px 14px !important;
    font-size: 15px !important;
}

/* ✅ Pie del modal: botones más grandes */
.pr-modal-foot[b-cxcwgmjmur] {
    padding: 14px 22px 18px 22px !important;
    gap: 12px !important;
}

    .pr-modal-foot .pr-btn[b-cxcwgmjmur] {
        font-size: 16px !important;
        padding: 12px 16px !important;
        border-radius: 12px !important;
    }

/* ✅ Texto de confirmación más grande */
.pr-confirm-text[b-cxcwgmjmur] {
    font-size: 18px !important;
    line-height: 1.4 !important;
}

/* ✅ Evita que el panel derecho estire la página */
.pr-card-historial[b-cxcwgmjmur] {
    height: calc(100vh - 170px); /* ajusta si tu header superior es más alto */
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* ✅ El scroll pasa a ser interno */
.pr-table-wrap[b-cxcwgmjmur] {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    min-height: 0; /* CLAVE para que flex + overflow funcione */
}
/* =========================================================
   HISTORIAL: filas tipo "tarjeta" elegantes (Depósito/Retiro)
   ========================================================= */

.pr-table[b-cxcwgmjmur] {
    width: 100%;
    border-collapse: separate; /* clave para separar filas */
    border-spacing: 0 12px; /* espacio vertical entre movimientos */
}

    .pr-table thead th[b-cxcwgmjmur] {
        position: sticky; /* si el contenedor scrollea */
        top: 0;
        z-index: 2;
    }

    /* Cada movimiento (fila) se verá como bloque */
    .pr-table tbody tr.pr-rowline td[b-cxcwgmjmur] {
        background: #ffffff;
        border-top: 1px solid #e6eef8;
        border-bottom: 1px solid #e6eef8;
        padding-top: 12px;
        padding-bottom: 12px;
    }

        /* Bordes redondeados solo en extremos para que parezca tarjeta */
        .pr-table tbody tr.pr-rowline td:first-child[b-cxcwgmjmur] {
            border-left: 1px solid #e6eef8;
            border-top-left-radius: 12px;
            border-bottom-left-radius: 12px;
        }

        .pr-table tbody tr.pr-rowline td:last-child[b-cxcwgmjmur] {
            border-right: 1px solid #e6eef8;
            border-top-right-radius: 12px;
            border-bottom-right-radius: 12px;
        }

    /* Sombra suave al pasar el mouse para “intuitivo” */
    .pr-table tbody tr.pr-rowline:hover td[b-cxcwgmjmur] {
        box-shadow: 0 6px 16px rgba(0,0,0,0.06);
        border-color: #d7e6fb;
    }

/* Mejor separación visual dentro de la celda monto */
.pr-monto-stack[b-cxcwgmjmur] {
    gap: 6px;
}

/* Hacer más claro el saldo anterior / actual */
.pr-saldo-antes[b-cxcwgmjmur] {
    font-size: 12px;
    font-weight: 700;
    opacity: 0.95;
}

.pr-saldo-despues[b-cxcwgmjmur] {
    font-size: 12px;
    font-weight: 800;
    opacity: 0.95;
}

/* Monto principal un poco más importante visualmente */
.pr-monto-val[b-cxcwgmjmur] {
    font-size: 15px;
    font-weight: 800;
}

/* Rango compacto (sin panel grande) */
.pr-range-inline[b-cxcwgmjmur] {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    padding: 0;
    margin: 0 0 10px 0; /* pequeñito */
}

    .pr-range-inline .pr-field[b-cxcwgmjmur] {
        margin: 0;
    }

    .pr-range-inline label[b-cxcwgmjmur] {
        font-size: 12px;
        font-weight: 700;
        margin-bottom: 4px;
        opacity: .85;
    }

.pr-btn-range[b-cxcwgmjmur] {
    height: 38px; /* que calce con los date inputs */
    padding: 0 14px;
}

/* Letras más grandes dentro del historial */
.pr-saldo-antes[b-cxcwgmjmur] {
    font-size: 14px; /* antes 12 */
    font-weight: 800;
}

.pr-saldo-despues[b-cxcwgmjmur] {
    font-size: 14px; /* antes 12 */
    font-weight: 900;
}

.pr-monto-val[b-cxcwgmjmur] {
    font-size: 18px; /* antes 15 */
    font-weight: 900;
}

/* Si querés también agrandar el ₡monto y el botón edit para que se vea mejor */
.pr-mini-edit[b-cxcwgmjmur] {
    transform: scale(1.05);
}

.pr-mini-del[b-cxcwgmjmur] {
    margin-left: 6px;
    border: 1px solid rgba(217,48,37,.35);
    color: #d93025;
    background: #fff;
}

    .pr-mini-del:hover[b-cxcwgmjmur] {
        background: #fff1f1;
        border-color: #d93025;
    }

@media (max-width: 700px) {
    /* =========================
       PAGOS Y RETIROS - SOLO MÓVIL
       NO TOCA ESCRITORIO
       ========================= */

    .pr-shell[b-cxcwgmjmur] {
        padding: 10px;
        border-radius: 14px;
        box-sizing: border-box;
        overflow-x: hidden;
    }

    .pr-grid[b-cxcwgmjmur] {
        grid-template-columns: 1fr !important;
        gap: 12px;
    }

    .pr-left[b-cxcwgmjmur],
    .pr-right[b-cxcwgmjmur] {
        width: 100%;
        min-width: 0;
    }

    .pr-card[b-cxcwgmjmur] {
        padding: 12px !important;
        border-radius: 14px !important;
        margin-bottom: 12px;
        box-sizing: border-box;
    }

    .pr-card-title[b-cxcwgmjmur] {
        font-size: 1rem !important;
        line-height: 1.2;
        margin-bottom: 10px !important;
    }

    /* ===== Tabs ===== */
    .pr-tabs[b-cxcwgmjmur] {
        display: flex;
        flex-direction: column;
        gap: 8px;
        background: transparent;
        border: 0;
        border-radius: 0;
        overflow: visible;
        margin-bottom: 12px;
    }

    .pr-tab[b-cxcwgmjmur] {
        width: 100%;
        min-height: 46px;
        border-radius: 12px;
        border: 1px solid rgba(0,0,0,.08);
        background: #f2f6ff;
        font-size: 0.98rem;
        padding: 12px;
    }

        .pr-tab.active[b-cxcwgmjmur] {
            background: linear-gradient(90deg,#003366,#0066cc);
            color: #fff;
        }

    /* ===== Buscador / selector ===== */
    .pr-search-row[b-cxcwgmjmur] {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .pr-select-wrap[b-cxcwgmjmur] {
        margin-top: 8px;
    }

    .pr-input[b-cxcwgmjmur],
    .pr-select[b-cxcwgmjmur],
    .pr-date[b-cxcwgmjmur] {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        min-height: 46px;
        height: 46px;
        font-size: 16px !important;
        box-sizing: border-box;
        border-radius: 12px;
    }

    .pr-btn[b-cxcwgmjmur],
    .pr-btn-soft[b-cxcwgmjmur],
    .pr-btn-primary[b-cxcwgmjmur] {
        width: 100%;
        min-height: 46px;
        box-sizing: border-box;
        font-size: 0.96rem !important;
        border-radius: 12px;
        justify-content: center;
        text-align: center;
    }

    /* ===== Vendedor / saldo ===== */
    .pr-vend-info[b-cxcwgmjmur] {
        gap: 10px;
    }

    .pr-vend-name[b-cxcwgmjmur] {
        font-size: 1rem;
        line-height: 1.25;
        word-break: break-word;
    }

    .pr-saldo-box[b-cxcwgmjmur] {
        padding: 12px;
        border-radius: 14px;
    }

        .pr-saldo-box .k[b-cxcwgmjmur] {
            font-size: 0.9rem;
        }

        .pr-saldo-box .v[b-cxcwgmjmur] {
            font-size: 1.45rem;
            line-height: 1.15;
            word-break: break-word;
        }

    /* ===== Formulario ===== */
    .pr-form[b-cxcwgmjmur] {
        gap: 10px;
    }

    .pr-field label[b-cxcwgmjmur] {
        font-size: 0.9rem;
        line-height: 1.2;
        margin-bottom: 6px;
    }

    /* ===== Rango historial ===== */
    .pr-range-inline[b-cxcwgmjmur],
    .pr-range[b-cxcwgmjmur] {
        display: flex !important;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        width: 100%;
        max-width: 100%;
        padding: 12px;
        border-radius: 14px;
        box-sizing: border-box;
    }

        .pr-range-inline .pr-field[b-cxcwgmjmur],
        .pr-range .pr-field[b-cxcwgmjmur] {
            width: 100%;
            min-width: 0;
        }

    .pr-datebox[b-cxcwgmjmur] {
        display: block;
        width: 100%;
    }

    .pr-btn-range[b-cxcwgmjmur] {
        width: 100%;
        min-height: 46px;
    }

    /* ===== Historial como tarjetas en móvil ===== */
    .pr-table-wrap[b-cxcwgmjmur] {
        max-height: none;
        overflow: visible;
        border: 0;
        background: transparent;
        padding: 0;
    }

    .pr-table[b-cxcwgmjmur] {
        width: 100%;
        min-width: 0 !important;
        border-collapse: separate;
        border-spacing: 0;
        table-layout: auto;
        background: transparent;
    }

        .pr-table thead[b-cxcwgmjmur] {
            display: none;
        }

        .pr-table tbody[b-cxcwgmjmur] {
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

            .pr-table tbody tr[b-cxcwgmjmur],
            .pr-table tbody td[b-cxcwgmjmur] {
                display: block;
                width: 100%;
            }

                .pr-table tbody tr.pr-rowline[b-cxcwgmjmur] {
                    background: #fff;
                    border: 1px solid rgba(0,0,0,.08);
                    border-radius: 14px;
                    box-shadow: 0 8px 18px rgba(0,0,0,.06);
                    overflow: hidden;
                }

            .pr-table tbody td[b-cxcwgmjmur] {
                padding: 10px 12px !important;
                border-bottom: 1px solid rgba(0,0,0,.06);
                background: transparent !important;
                text-align: left !important;
                width: 100% !important;
                min-width: 0 !important;
                font-size: 0.95rem !important;
                line-height: 1.3;
            }

                .pr-table tbody td:last-child[b-cxcwgmjmur] {
                    border-bottom: none;
                }

                .pr-table tbody td:nth-child(1)[b-cxcwgmjmur]::before {
                    content: "Fecha";
                    display: block;
                    margin-bottom: 4px;
                    font-size: 0.78rem;
                    font-weight: 900;
                    color: #52627a;
                    text-transform: uppercase;
                    letter-spacing: .3px;
                }

                .pr-table tbody td:nth-child(2)[b-cxcwgmjmur]::before {
                    content: "Tipo";
                    display: block;
                    margin-bottom: 4px;
                    font-size: 0.78rem;
                    font-weight: 900;
                    color: #52627a;
                    text-transform: uppercase;
                    letter-spacing: .3px;
                }

                .pr-table tbody td:nth-child(3)[b-cxcwgmjmur]::before {
                    content: "Monto";
                    display: block;
                    margin-bottom: 6px;
                    font-size: 0.78rem;
                    font-weight: 900;
                    color: #52627a;
                    text-transform: uppercase;
                    letter-spacing: .3px;
                }

                .pr-table tbody td:nth-child(4)[b-cxcwgmjmur]::before {
                    content: "Nota";
                    display: block;
                    margin-bottom: 4px;
                    font-size: 0.78rem;
                    font-weight: 900;
                    color: #52627a;
                    text-transform: uppercase;
                    letter-spacing: .3px;
                }

    .pr-col-tipo[b-cxcwgmjmur],
    .pr-col-nota[b-cxcwgmjmur] {
        padding-left: 12px !important;
    }

    .pr-table td.note[b-cxcwgmjmur] {
        white-space: normal;
        overflow: visible;
        text-overflow: unset;
        word-break: break-word;
    }

    .pr-monto-stack[b-cxcwgmjmur] {
        gap: 8px;
    }

    .pr-monto-cell[b-cxcwgmjmur] {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 8px;
        flex-wrap: wrap;
    }

    .pr-monto-val[b-cxcwgmjmur] {
        font-size: 1.02rem;
        font-weight: 950;
    }

    .pr-mini[b-cxcwgmjmur] {
        width: 34px;
        height: 34px;
        border-radius: 10px;
        flex: 0 0 auto;
    }

    .pr-saldo-antes[b-cxcwgmjmur],
    .pr-saldo-despues[b-cxcwgmjmur] {
        font-size: 0.82rem;
        line-height: 1.25;
        word-break: break-word;
    }

    /* ===== Modal overlay ===== */
    .pr-modal-overlay[b-cxcwgmjmur] {
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,.45);
        z-index: 9999;
        overflow: hidden;
        overscroll-behavior: contain;
        touch-action: none;
    }

    body:has(.pr-modal-overlay)[b-cxcwgmjmur] {
        overflow: hidden;
        touch-action: none;
        position: fixed;
        width: 100%;
    }

    /* ===== Modales ===== */
    .pr-modal[b-cxcwgmjmur],
    .pr-modal.pr-modal-confirm[b-cxcwgmjmur],
    .pr-modal.pr-modal-danger[b-cxcwgmjmur] {
        width: calc(100vw - 20px) !important;
        max-width: calc(100vw - 20px) !important;
        max-height: 90svh;
        min-width: 0;
        border-radius: 16px !important;
        overflow: hidden;
        box-sizing: border-box;
    }

    .pr-modal-head[b-cxcwgmjmur] {
        padding: 12px 14px !important;
        gap: 10px;
    }

        .pr-modal-head .t[b-cxcwgmjmur] {
            font-size: 1rem !important;
            line-height: 1.25;
            min-width: 0;
        }

        .pr-modal-head .x[b-cxcwgmjmur] {
            min-width: 40px;
            min-height: 40px;
            flex: 0 0 auto;
        }

    .pr-modal-body[b-cxcwgmjmur] {
        padding: 12px !important;
        overflow: auto;
        max-height: calc(90svh - 120px);
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-y;
        font-size: 0.95rem !important;
    }

        .pr-modal-body .pr-row[b-cxcwgmjmur] {
            grid-template-columns: 1fr;
            gap: 6px !important;
            padding: 6px 0 !important;
        }

            .pr-modal-body .pr-row .k[b-cxcwgmjmur] {
                font-size: 0.86rem !important;
                line-height: 1.2;
            }

            .pr-modal-body .pr-row .v[b-cxcwgmjmur] {
                font-size: 1rem !important;
                line-height: 1.3;
                word-break: break-word;
            }

    .pr-modal .pr-input[b-cxcwgmjmur] {
        font-size: 16px !important;
        padding: 10px 12px !important;
        min-height: 46px;
    }

        .pr-modal .pr-input.pr-input-monto[b-cxcwgmjmur] {
            font-size: 1.2rem !important;
            padding: 12px 14px !important;
        }

    .pr-warn[b-cxcwgmjmur] {
        font-size: 0.9rem !important;
        line-height: 1.35;
        padding: 10px 12px !important;
    }

    .pr-confirm-text[b-cxcwgmjmur] {
        font-size: 0.98rem !important;
        line-height: 1.4 !important;
        word-break: break-word;
    }

    .pr-modal-foot[b-cxcwgmjmur] {
        padding: 10px 12px 12px !important;
        display: flex;
        flex-direction: column;
        gap: 8px !important;
        justify-content: stretch;
    }

        .pr-modal-foot .pr-btn[b-cxcwgmjmur] {
            width: 100%;
        }

    /* ===== Caja roja del modal borrar ===== */
    .pr-modal-danger .pr-confirm-text > div[style*="border:2px solid #ff3b3b"][b-cxcwgmjmur] {
        padding: 10px !important;
        border-radius: 12px !important;
        font-size: 0.92rem;
        line-height: 1.35;
    }

        .pr-modal-danger .pr-confirm-text > div[style*="border:2px solid #ff3b3b"] span[b-cxcwgmjmur] {
            font-size: 1.1rem !important;
        }

    .pr-modal-danger .pr-confirm-text b[style*="font-size:20px"][b-cxcwgmjmur] {
        font-size: 1.05rem !important;
    }

    .pr-modal-danger .pr-confirm-text div[style*="font-size:16px"][b-cxcwgmjmur] {
        font-size: 0.92rem !important;
        line-height: 1.35 !important;
    }

    .pr-modal-danger .pr-modal-foot .pr-btn-primary[style*="background:#d93025"][b-cxcwgmjmur] {
        width: 100%;
    }

    /* ===== Placeholder ===== */
    .fila-placeholder[b-cxcwgmjmur] {
        padding: 12px;
        border-radius: 12px;
        font-size: 0.94rem;
        line-height: 1.35;
    }

    /* ===== Blindaje ===== */
    html[b-cxcwgmjmur],
    body[b-cxcwgmjmur] {
        overflow-x: hidden;
    }

    .pr-shell *[b-cxcwgmjmur],
    .pr-modal *[b-cxcwgmjmur] {
        box-sizing: border-box;
        min-width: 0;
        max-width: 100%;
    }
}

/* =========================================================
   NUEVO TAB CENTRADO - LOTERÍA, CHANCES, RASPAS
   PASO 1 SOLO VISUAL
   ========================================================= */

.pr-tabs-wrap[b-cxcwgmjmur] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 12px;
}

.pr-tabs[b-cxcwgmjmur] {
    margin-bottom: 0;
}

.pr-tabs-center[b-cxcwgmjmur] {
    display: flex;
    justify-content: center;
}

.pr-tab-lcr[b-cxcwgmjmur] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    width: 240px;
    border: 0;
    padding: 14px 14px;
    background: #f2f6ff;
    font-weight: 900;
    color: #2b3c55;
    cursor: pointer;
    font-size: 1.05rem;
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 0;
}

.pr-tabs > .pr-tab:first-child[b-cxcwgmjmur] {
    border-top-left-radius: 14px;
    border-bottom-left-radius: 14px;
}

.pr-tabs > .pr-tab:last-child[b-cxcwgmjmur] {
    border-top-right-radius: 14px;
    border-bottom-right-radius: 14px;
}

.pr-tabs-center .pr-tab-lcr[b-cxcwgmjmur] {
    border-radius: 14px;
}

.pr-tabs-center .pr-tab-lcr[b-cxcwgmjmur] {
    border-radius: 0;
}

    .pr-tabs-center .pr-tab-lcr.active[b-cxcwgmjmur] {
        background: linear-gradient(90deg,#003366,#0066cc);
        color: #fff;
    }
.pr-lcr-placeholder[b-cxcwgmjmur] {
    border: 1px dashed rgba(0, 102, 204, 0.35);
    background: linear-gradient(180deg, rgba(0,102,204,0.08), rgba(0,51,102,0.03));
    border-radius: 14px;
    padding: 16px;
}

.pr-lcr-placeholder-title[b-cxcwgmjmur] {
    font-size: 1.05rem;
    font-weight: 900;
    color: #153e75;
    margin-bottom: 8px;
}

.pr-lcr-placeholder-text[b-cxcwgmjmur] {
    color: #52627a;
    font-size: .98rem;
    line-height: 1.45;
}

@media (max-width: 700px) {
    .pr-tabs-wrap[b-cxcwgmjmur] {
        gap: 8px;
    }

    .pr-tabs-center[b-cxcwgmjmur] {
        justify-content: stretch;
    }

    .pr-tab-lcr[b-cxcwgmjmur] {
        max-width: none;
        width: 100%;
        flex: 1 1 auto;
    }
}

/* =========================================================
   LCR - FORMULARIO VISUAL (PASO 3)
   ========================================================= */

.pr-lcr-type-row[b-cxcwgmjmur] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}

.pr-lcr-type[b-cxcwgmjmur] {
    border: 1px solid rgba(0,0,0,.10);
    background: #f7fbff;
    color: #153e75;
    border-radius: 12px;
    padding: 12px 10px;
    font-weight: 900;
    font-size: 1rem;
    cursor: pointer;
    transition: .18s ease;
}

    .pr-lcr-type.active[b-cxcwgmjmur] {
        background: linear-gradient(90deg,#003366,#0066cc);
        color: #fff;
        border-color: transparent;
    }

    .pr-lcr-type:hover[b-cxcwgmjmur] {
        transform: translateY(-1px);
    }

.pr-lcr-resumen[b-cxcwgmjmur] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px;
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(0,102,204,.08), rgba(0,51,102,.03));
    border: 1px solid rgba(0,102,204,.16);
}

.pr-lcr-resumen-row[b-cxcwgmjmur] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: #153e75;
    font-size: 1rem;
}

    .pr-lcr-resumen-row strong[b-cxcwgmjmur] {
        font-size: 1.15rem;
        color: #102a52;
    }

.pr-lcr-final[b-cxcwgmjmur] {
    padding-top: 10px;
    border-top: 1px dashed rgba(0,0,0,.12);
}

    .pr-lcr-final strong[b-cxcwgmjmur] {
        font-size: 1.3rem;
        color: #0b7a2a;
    }

.pr-lcr-helper[b-cxcwgmjmur] {
    font-size: .93rem;
    color: #52627a;
    line-height: 1.45;
    padding: 10px 12px;
    border-radius: 12px;
    background: #f7fbff;
    border: 1px solid rgba(0,0,0,.06);
}

.pr-lcr-preview-grid[b-cxcwgmjmur] {
    display: grid;
    grid-template-columns: repeat(2, minmax(180px, 1fr));
    gap: 10px 14px;
    margin-bottom: 12px;
    color: #102a52;
    font-size: .98rem;
}

@media (max-width: 720px) {
    .pr-lcr-type-row[b-cxcwgmjmur] {
        grid-template-columns: 1fr;
    }

    .pr-lcr-preview-grid[b-cxcwgmjmur] {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   LCR - SUBTABS ENTREGAR / LIQUIDAR
   ========================================================= */

.pr-lcr-subtabs[b-cxcwgmjmur] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    margin-bottom: 8px;
}

.pr-lcr-subtab[b-cxcwgmjmur] {
    border: 1px solid rgba(0,0,0,.10);
    background: #eef4ff;
    color: #153e75;
    border-radius: 12px;
    padding: 12px 10px;
    font-weight: 900;
    font-size: 1rem;
    cursor: pointer;
    transition: .18s ease;
}

    .pr-lcr-subtab.active[b-cxcwgmjmur] {
        background: linear-gradient(90deg,#003366,#0066cc);
        color: #fff;
        border-color: transparent;
    }

    .pr-lcr-subtab:hover[b-cxcwgmjmur] {
        transform: translateY(-1px);
    }

@media (max-width: 720px) {
    .pr-lcr-subtabs[b-cxcwgmjmur] {
        grid-template-columns: 1fr;
    }
}

/* ================================
   HISTORIAL LCR
   ================================ */
.pr-table-lcr[b-cxcwgmjmur] {
    min-width: 1120px;
}

    .pr-table-lcr th:nth-child(1)[b-cxcwgmjmur],
    .pr-table-lcr td:nth-child(1)[b-cxcwgmjmur] {
        width: 120px;
        padding-left: 16px !important;
        text-align: left;
    }

    .pr-table-lcr th:nth-child(2)[b-cxcwgmjmur],
    .pr-table-lcr td:nth-child(2)[b-cxcwgmjmur] {
        width: 320px;
        padding-left: 16px !important;
        text-align: left;
    }

    .pr-table-lcr th:nth-child(3)[b-cxcwgmjmur],
    .pr-table-lcr td:nth-child(3)[b-cxcwgmjmur],
    .pr-table-lcr th:nth-child(4)[b-cxcwgmjmur],
    .pr-table-lcr td:nth-child(4)[b-cxcwgmjmur],
    .pr-table-lcr th:nth-child(5)[b-cxcwgmjmur],
    .pr-table-lcr td:nth-child(5)[b-cxcwgmjmur],
    .pr-table-lcr th:nth-child(6)[b-cxcwgmjmur],
    .pr-table-lcr td:nth-child(6)[b-cxcwgmjmur],
    .pr-table-lcr th:nth-child(7)[b-cxcwgmjmur],
    .pr-table-lcr td:nth-child(7)[b-cxcwgmjmur] {
        width: 130px;
        padding-left: 16px !important;
        text-align: right;
    }

    .pr-table-lcr th:nth-child(8)[b-cxcwgmjmur],
    .pr-table-lcr td:nth-child(8)[b-cxcwgmjmur] {
        width: 130px;
        padding-left: 16px !important;
        text-align: center;
    }

/* ===== NOTAS MÁS VISIBLES ===== */
.pr-nota-cell[b-cxcwgmjmur] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
}

.pr-nota-text[b-cxcwgmjmur] {
    color: #163b6b;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.35;
    white-space: normal;
    word-break: break-word;
}

    .pr-nota-text.is-empty[b-cxcwgmjmur] {
        color: #7a8ca7;
        font-style: italic;
        font-weight: 700;
    }

.pr-mini-note[b-cxcwgmjmur] {
    flex: 0 0 auto;
    margin-left: 6px;
}

.pr-mini-edit[b-cxcwgmjmur] {
    border: 1px solid rgba(13, 71, 161, .22);
    color: #0d47a1;
    background: #f2f7ff;
}

    .pr-mini-edit:hover[b-cxcwgmjmur] {
        background: #e3efff;
        border-color: #0d47a1;
    }

/* LCR notas */
.pr-lcr-note-row[b-cxcwgmjmur] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    margin-top: 6px;
    padding: 8px 10px;
    border-radius: 10px;
    background: #f7fbff;
    border: 1px solid #dde9fb;
}

.pr-lcr-note-text[b-cxcwgmjmur] {
    color: #163b6b;
    font-size: .98rem;
    line-height: 1.35;
    font-weight: 800;
    white-space: normal;
    word-break: break-word;
}

/* editor de nota */
.pr-note-editor[b-cxcwgmjmur] {
    min-height: 110px;
    resize: vertical;
    font-size: 1rem;
    line-height: 1.4;
}

/* hacer que en historial normal la nota respire más */
.pr-table td.note[b-cxcwgmjmur] {
    color: #163b6b !important;
    font-weight: 800 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;
}

/* móvil */
@media (max-width: 980px) {
    .pr-nota-cell[b-cxcwgmjmur],
    .pr-lcr-note-row[b-cxcwgmjmur] {
        flex-direction: column;
        align-items: stretch;
    }

    .pr-mini-note[b-cxcwgmjmur] {
        align-self: flex-end;
        margin-left: 0;
    }

    .pr-note-editor[b-cxcwgmjmur] {
        min-height: 95px;
    }
}

/* ===== MENSAJE BONITO ===== */

.msg-overlay[b-cxcwgmjmur] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    backdrop-filter: blur(4px);
    z-index: 9999;
}

.msg-modal[b-cxcwgmjmur] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(1);
    width: 90%;
    max-width: 340px;
    background: white;
    border-radius: 20px;
    padding: 24px 20px;
    text-align: center;
    box-shadow: 0 20px 60px rgba(0,0,0,0.25);
    z-index: 10000;
    animation: msgFadeIn-b-cxcwgmjmur .25s ease;
}

.msg-icon[b-cxcwgmjmur] {
    width: 60px;
    height: 60px;
    margin: 0 auto 12px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    color: white;
}

    .msg-icon.success[b-cxcwgmjmur] {
        background: linear-gradient(135deg, #22c55e, #16a34a);
    }

    .msg-icon.error[b-cxcwgmjmur] {
        background: linear-gradient(135deg, #ef4444, #b91c1c);
    }

    .msg-icon.info[b-cxcwgmjmur] {
        background: linear-gradient(135deg, #3b82f6, #1d4ed8);
    }

.msg-text[b-cxcwgmjmur] {
    font-size: 15px;
    color: #1e293b;
    margin-bottom: 18px;
    font-weight: 600;
}

.msg-btn[b-cxcwgmjmur] {
    width: 100%;
    height: 44px;
    border-radius: 12px;
    border: none;
    background: #2563eb;
    color: white;
    font-weight: 800;
    cursor: pointer;
}

@keyframes msgFadeIn-b-cxcwgmjmur {
    from {
        transform: translate(-50%, -60%) scale(.9);
        opacity: 0;
    }

    to {
        transform: translate(-50%, -50%) scale(1);
        opacity: 1;
    }
}

/* móvil */
@media (max-width: 600px) {
    .msg-modal[b-cxcwgmjmur] {
        max-width: 92%;
        padding: 22px 16px;
    }

    .msg-text[b-cxcwgmjmur] {
        font-size: 14px;
    }
}
/* _content/SistemaLoteriaDashboard/Components/Banca/PantallaPrincipalBanca.razor.rz.scp.css */
/* =========================
   PantallaPrincipalBanca
   REDISEÑO COMPLETO VISUAL
   ========================= */

.ppb-load-banner[b-sio1qvlbhu] {
    margin-top: 6px;
    padding: 8px 12px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.22);
    color: #e0f2fe;
    font-size: 0.95rem;
    font-weight: 600;
}

.kpi-loading-pulse[b-sio1qvlbhu] {
    display: inline-block;
    font-size: 1.1rem;
    font-weight: 700;
    color: #64748b;
    animation: kpiPulse-b-sio1qvlbhu 1.2s ease-in-out infinite;
}

@keyframes kpiPulse-b-sio1qvlbhu {
    0%, 100% { opacity: 0.45; }
    50% { opacity: 1; }
}

.ppb-shell[b-sio1qvlbhu] {
    padding: 18px;
    border-radius: 8px;
    background: #f5f7fb;
    box-sizing: border-box;
}

.ppb-hero[b-sio1qvlbhu] {
    position: relative;
    overflow: hidden;
    margin-bottom: 18px;
    padding: 18px 20px;
    border-radius: 8px;
    background: #123a6c;
    border: 1px solid #0f315c;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.12);
    color: #fff;
}


.ppb-hero-copy[b-sio1qvlbhu] {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ppb-badge[b-sio1qvlbhu] {
    width: fit-content;
    padding: 7px 14px;
    border-radius: 999px;
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.18);
    color: #dbeafe;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
}

.ppb-title[b-sio1qvlbhu] {
    font-size: 32px;
    line-height: 1.05;
    font-weight: 950;
    letter-spacing: -0.4px;
    color: #ffffff;
    text-shadow: 0 2px 10px rgba(0,0,0,0.12);
}

.ppb-subtitle[b-sio1qvlbhu] {
    max-width: 860px;
    font-size: 14px;
    line-height: 1.5;
    font-weight: 600;
    color: rgba(255,255,255,0.82);
}

.ppb-section-head[b-sio1qvlbhu] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin: 20px 2px 12px;
}

.ppb-section-title[b-sio1qvlbhu] {
    font-size: 18px;
    font-weight: 900;
    color: #0f172a;
    letter-spacing: -0.2px;
}

.ppb-section-subtitle[b-sio1qvlbhu] {
    font-size: 13px;
    font-weight: 600;
    color: rgba(15, 23, 42, 0.62);
}

.ppb-featured-grid[b-sio1qvlbhu] {
    display: grid;
    grid-template-columns: repeat(3, minmax(260px, 1fr));
    gap: 18px;
    margin-bottom: 8px;
}

.ppb-lcr-grid[b-sio1qvlbhu] {
    display: grid;
    grid-template-columns: repeat(2, minmax(260px, 1fr));
    gap: 18px;
}

.kpi-grid[b-sio1qvlbhu] {
    display: grid;
    grid-template-columns: repeat(4, minmax(220px, 1fr));
    gap: 18px;
}

.kpi-card[b-sio1qvlbhu] {
    position: relative;
    overflow: hidden;
    min-width: 0;
    padding: 18px 18px 16px;
    background: rgba(255,255,255,0.90);
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 8px;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.08);
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

    .kpi-card:hover[b-sio1qvlbhu] {
        transform: translateY(-4px);
        box-shadow: 0 20px 44px rgba(15, 23, 42, 0.12), inset 0 1px 0 rgba(255,255,255,0.78);
        border-color: rgba(59, 130, 246, 0.24);
    }

    .kpi-card[b-sio1qvlbhu]::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(circle at top right, rgba(255,255,255,0.45), transparent 36%), radial-gradient(circle at bottom left, rgba(255,255,255,0.22), transparent 28%);
        pointer-events: none;
    }

.featured-card[b-sio1qvlbhu] {
    min-height: 168px;
    padding: 22px 22px 20px;
}

.kpi-topline[b-sio1qvlbhu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

.kpi-icon[b-sio1qvlbhu] {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, rgba(255,255,255,0.8), rgba(255,255,255,0.4));
    border: 1px solid rgba(255,255,255,0.6);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.9), 0 8px 18px rgba(0,0,0,0.08);
    backdrop-filter: blur(8px);
    color: #0f172a;
}

    .kpi-icon svg[b-sio1qvlbhu] {
        width: 18px;
        height: 18px;
    }

.kpi-titulo[b-sio1qvlbhu] {
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: rgba(15, 23, 42, 0.68);
    margin: 0;
}

.kpi-valor[b-sio1qvlbhu] {
    font-size: 38px;
    line-height: 1.05;
    font-weight: 950;
    letter-spacing: -0.8px;
    color: #0f172a;
    word-break: break-word;
}

.kpi-mini[b-sio1qvlbhu] {
    margin-top: 10px;
    font-size: 13px;
    line-height: 1.38;
    font-weight: 700;
    color: rgba(15, 23, 42, 0.62);
}

.kpi-mini-secundario[b-sio1qvlbhu] {
    margin-top: 7px;
    font-size: 12px;
    font-weight: 900;
    color: rgba(15, 23, 42, 0.70);
}

/* ========= TARJETAS DESTACADAS ========= */
.kpi-balance[b-sio1qvlbhu] {
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.16), rgba(255,255,255,0.94));
    border-color: rgba(59, 130, 246, 0.18);
}

.kpi-neto[b-sio1qvlbhu] {
    background: linear-gradient(135deg, rgba(14, 165, 233, 0.15), rgba(255,255,255,0.94));
    border-color: rgba(14, 165, 233, 0.18);
}

.kpi-ganancia[b-sio1qvlbhu] {
    border-color: rgba(16, 185, 129, 0.18);
}

    .kpi-ganancia.is-positive[b-sio1qvlbhu] {
        background: linear-gradient(135deg, rgba(16, 185, 129, 0.18), rgba(255,255,255,0.95));
    }

    .kpi-ganancia.is-negative[b-sio1qvlbhu] {
        background: linear-gradient(135deg, rgba(239, 68, 68, 0.18), rgba(255,255,255,0.95));
    }

        .kpi-ganancia.is-negative .kpi-valor[b-sio1qvlbhu] {
            color: #b91c1c;
        }

/* ========= LCR ========= */
.kpi-lcr-lc[b-sio1qvlbhu] {
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.16), rgba(255,255,255,0.94));
    border-color: rgba(99, 102, 241, 0.20);
}

.kpi-lcr-raspas[b-sio1qvlbhu] {
    background: linear-gradient(135deg, rgba(34, 197, 94, 0.16), rgba(255,255,255,0.94));
    border-color: rgba(34, 197, 94, 0.20);
}

/* ========= OPERACIÓN ========= */
.kpi-ventas[b-sio1qvlbhu] {
    background: linear-gradient(135deg, rgba(37, 99, 235, 0.14), rgba(255,255,255,0.94));
}

.kpi-premios[b-sio1qvlbhu] {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.16), rgba(255,255,255,0.94));
}

.kpi-comision[b-sio1qvlbhu] {
    background: linear-gradient(135deg, rgba(168, 85, 247, 0.16), rgba(255,255,255,0.94));
}

.kpi-depositos[b-sio1qvlbhu] {
    background: linear-gradient(135deg, rgba(236, 72, 153, 0.14), rgba(255,255,255,0.94));
}

.kpi-futuras[b-sio1qvlbhu] {
    background: linear-gradient(135deg, rgba(249, 115, 22, 0.16), rgba(255,255,255,0.94));
}

.kpi-tiquetes[b-sio1qvlbhu] {
    background: linear-gradient(135deg, rgba(22, 163, 74, 0.14), rgba(255,255,255,0.94));
}

.kpi-anulados[b-sio1qvlbhu] {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.14), rgba(255,255,255,0.94));
}

/* ========= RESPONSIVE ========= */
@media (max-width: 1250px) {
    .ppb-featured-grid[b-sio1qvlbhu] {
        grid-template-columns: repeat(2, minmax(260px, 1fr));
    }

    .kpi-grid[b-sio1qvlbhu] {
        grid-template-columns: repeat(3, minmax(220px, 1fr));
    }
}

@media (max-width: 950px) {
    .ppb-shell[b-sio1qvlbhu] {
        padding: 18px;
    }

    .ppb-featured-grid[b-sio1qvlbhu],
    .ppb-lcr-grid[b-sio1qvlbhu],
    .kpi-grid[b-sio1qvlbhu] {
        grid-template-columns: repeat(2, minmax(220px, 1fr));
    }

    .kpi-valor[b-sio1qvlbhu] {
        font-size: 34px;
    }

    .ppb-title[b-sio1qvlbhu] {
        font-size: 28px;
    }
}

@media (max-width: 700px) {
    .ppb-shell[b-sio1qvlbhu] {
        padding: 10px;
        border-radius: 18px;
        overflow-x: hidden;
        background: radial-gradient(circle at top left, rgba(37, 99, 235, 0.12), transparent 30%), linear-gradient(180deg, #f4f8fd 0%, #eef4fb 100%);
    }

    .ppb-hero[b-sio1qvlbhu] {
        margin-bottom: 16px;
        padding: 16px 15px 15px;
        border-radius: 20px;
    }

    .ppb-badge[b-sio1qvlbhu] {
        font-size: 11px;
        padding: 6px 12px;
    }

    .ppb-title[b-sio1qvlbhu] {
        font-size: 1.45rem;
        line-height: 1.1;
    }

    .ppb-subtitle[b-sio1qvlbhu] {
        font-size: 0.90rem;
        line-height: 1.4;
    }

    .ppb-section-head[b-sio1qvlbhu] {
        margin: 16px 2px 10px;
    }

    .ppb-section-title[b-sio1qvlbhu] {
        font-size: 1rem;
    }

    .ppb-section-subtitle[b-sio1qvlbhu] {
        font-size: 0.82rem;
        line-height: 1.35;
    }

    .ppb-featured-grid[b-sio1qvlbhu],
    .ppb-lcr-grid[b-sio1qvlbhu],
    .kpi-grid[b-sio1qvlbhu] {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .kpi-card[b-sio1qvlbhu],
    .featured-card[b-sio1qvlbhu] {
        border-radius: 18px;
        padding: 14px 14px 13px;
        min-height: 0;
        box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08), inset 0 1px 0 rgba(255,255,255,0.72);
    }

        .kpi-card:hover[b-sio1qvlbhu] {
            transform: none;
            box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08), inset 0 1px 0 rgba(255,255,255,0.72);
        }

    .kpi-topline[b-sio1qvlbhu] {
        margin-bottom: 8px;
    }

    .kpi-icon[b-sio1qvlbhu] {
        width: 28px;
        height: 28px;
        border-radius: 10px;
        font-size: 12px;
    }

    .kpi-titulo[b-sio1qvlbhu] {
        font-size: 0.73rem;
        letter-spacing: 0.8px;
    }

    .kpi-valor[b-sio1qvlbhu] {
        font-size: 1.9rem;
        line-height: 1.08;
    }

    .kpi-mini[b-sio1qvlbhu] {
        margin-top: 8px;
        font-size: 0.84rem;
        line-height: 1.32;
    }

    .kpi-mini-secundario[b-sio1qvlbhu] {
        font-size: 0.78rem;
    }

    html[b-sio1qvlbhu],
    body[b-sio1qvlbhu] {
        overflow-x: hidden;
    }

    .ppb-shell *[b-sio1qvlbhu] {
        box-sizing: border-box;
        min-width: 0;
        max-width: 100%;
    }
}


/* =========================
   PREMIUM EXTRA - FEATURED CARDS
   Rangos + negativos + lujo visual
   ========================= */

.featured-card[b-sio1qvlbhu] {
    position: relative;
    isolation: isolate;
    overflow: hidden;
}

    .featured-card[b-sio1qvlbhu]::after {
        content: "";
        position: absolute;
        inset: 0;
        border-radius: inherit;
        padding: 1px;
        background: linear-gradient(135deg, rgba(255,255,255,0.45), rgba(255,255,255,0.05), rgba(59,130,246,0.18));
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
        mask-composite: exclude;
        pointer-events: none;
        opacity: 0.9;
    }

    .featured-card .kpi-valor[b-sio1qvlbhu] {
        margin-top: 6px;
    }

.kpi-range-head[b-sio1qvlbhu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 2px 0 12px 0;
    position: relative;
    z-index: 2;
}

.kpi-range-chip[b-sio1qvlbhu] {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 6px 12px;
    border-radius: 999px;
    background: rgba(255,255,255,0.55);
    border: 1px solid rgba(255,255,255,0.55);
    color: rgba(15, 23, 42, 0.72);
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.72);
    backdrop-filter: blur(10px);
}

.kpi-range-btn[b-sio1qvlbhu] {
    height: 32px;
    padding: 0 12px;
    border: none;
    border-radius: 999px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.4px;
    color: #fff;
    background: linear-gradient(135deg, #1d4ed8, #2563eb);
    box-shadow: 0 10px 22px rgba(37, 99, 235, 0.24);
    transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}

    .kpi-range-btn:hover[b-sio1qvlbhu] {
        transform: translateY(-1px);
        box-shadow: 0 14px 26px rgba(37, 99, 235, 0.30);
        filter: brightness(1.03);
    }

    .kpi-range-btn:active[b-sio1qvlbhu] {
        transform: translateY(0);
    }

.kpi-range-panel[b-sio1qvlbhu] {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(2, minmax(120px, 1fr));
    gap: 10px;
    margin-bottom: 12px;
    padding: 12px;
    border-radius: 18px;
    background: rgba(255,255,255,0.55);
    border: 1px solid rgba(255,255,255,0.55);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.68);
    backdrop-filter: blur(10px);
}

.kpi-date-field[b-sio1qvlbhu] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

    .kpi-date-field label[b-sio1qvlbhu] {
        font-size: 11px;
        font-weight: 900;
        letter-spacing: 0.4px;
        text-transform: uppercase;
        color: rgba(15, 23, 42, 0.68);
    }

    .kpi-date-field input[type="date"][b-sio1qvlbhu] {
        width: 100%;
        min-width: 0;
        height: 40px;
        padding: 0 12px;
        border-radius: 12px;
        border: 1px solid rgba(148, 163, 184, 0.22);
        background: rgba(255,255,255,0.88);
        color: #0f172a;
        font-size: 13px;
        font-weight: 800;
        outline: none;
        transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
    }

        .kpi-date-field input[type="date"]:focus[b-sio1qvlbhu] {
            border-color: rgba(37, 99, 235, 0.42);
            box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.10);
            transform: translateY(-1px);
        }

.kpi-date-actions[b-sio1qvlbhu] {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 2px;
}

.kpi-date-btn[b-sio1qvlbhu] {
    height: 34px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid rgba(148, 163, 184, 0.22);
    background: rgba(255,255,255,0.88);
    color: #0f172a;
    font-size: 12px;
    font-weight: 900;
    cursor: pointer;
    transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}

    .kpi-date-btn.primary[b-sio1qvlbhu] {
        color: #fff;
        border: none;
        background: linear-gradient(135deg, #0f766e, #10b981);
        box-shadow: 0 10px 20px rgba(16, 185, 129, 0.22);
    }

    .kpi-date-btn:hover[b-sio1qvlbhu] {
        transform: translateY(-1px);
    }

.kpi-negative-value[b-sio1qvlbhu] {
    color: #c1121f !important;
    text-shadow: 0 0 12px rgba(193, 18, 31, 0.10);
    animation: kpiNegativePulse-b-sio1qvlbhu 1.8s ease-in-out infinite;
}

@keyframes kpiNegativePulse-b-sio1qvlbhu {
    0% {
        transform: scale(1);
        filter: drop-shadow(0 0 0 rgba(193, 18, 31, 0));
    }

    50% {
        transform: scale(1.015);
        filter: drop-shadow(0 0 10px rgba(193, 18, 31, 0.16));
    }

    100% {
        transform: scale(1);
        filter: drop-shadow(0 0 0 rgba(193, 18, 31, 0));
    }
}

/* brillo extra premium en las 3 grandes */
.kpi-balance.featured-card[b-sio1qvlbhu],
.kpi-neto.featured-card[b-sio1qvlbhu],
.kpi-ganancia.featured-card[b-sio1qvlbhu] {
    box-shadow: 0 22px 48px rgba(15, 23, 42, 0.12), inset 0 1px 0 rgba(255,255,255,0.78);
}

    .kpi-balance.featured-card:hover[b-sio1qvlbhu],
    .kpi-neto.featured-card:hover[b-sio1qvlbhu],
    .kpi-ganancia.featured-card:hover[b-sio1qvlbhu] {
        transform: translateY(-5px);
    }

/* móvil */
@media (max-width: 700px) {
    .kpi-range-head[b-sio1qvlbhu] {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
        margin-bottom: 10px;
    }

    .kpi-range-chip[b-sio1qvlbhu],
    .kpi-range-btn[b-sio1qvlbhu] {
        width: 100%;
        justify-content: center;
    }

    .kpi-range-panel[b-sio1qvlbhu] {
        grid-template-columns: 1fr;
        gap: 10px;
        padding: 10px;
        border-radius: 16px;
    }

    .kpi-date-actions[b-sio1qvlbhu] {
        justify-content: stretch;
        flex-direction: column;
    }

    .kpi-date-btn[b-sio1qvlbhu],
    .kpi-date-btn.primary[b-sio1qvlbhu] {
        width: 100%;
    }
}

.kpi-balance .kpi-icon[b-sio1qvlbhu] {
    color: #2563eb;
}

.kpi-neto .kpi-icon[b-sio1qvlbhu] {
    color: #0ea5e9;
}

.kpi-ganancia.is-positive .kpi-icon[b-sio1qvlbhu] {
    color: #10b981;
}

.kpi-ganancia.is-negative .kpi-icon[b-sio1qvlbhu] {
    color: #ef4444;
}

.kpi-lcr-lc .kpi-icon[b-sio1qvlbhu] {
    color: #6366f1;
}

.kpi-lcr-raspas .kpi-icon[b-sio1qvlbhu] {
    color: #22c55e;
}

.kpi-ventas .kpi-icon[b-sio1qvlbhu] {
    color: #2563eb;
}

.kpi-premios .kpi-icon[b-sio1qvlbhu] {
    color: #f59e0b;
}

.kpi-comision .kpi-icon[b-sio1qvlbhu] {
    color: #a855f7;
}

.kpi-depositos .kpi-icon[b-sio1qvlbhu] {
    color: #ec4899;
}

.kpi-futuras .kpi-icon[b-sio1qvlbhu] {
    color: #f97316;
}

.kpi-tiquetes .kpi-icon[b-sio1qvlbhu] {
    color: #16a34a;
}

.kpi-anulados .kpi-icon[b-sio1qvlbhu] {
    color: #ef4444;
}


/* =========================
   BOTÓN ACTUALIZAR CARDS
   ========================= */

.ppb-hero[b-sio1qvlbhu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

/* contenedor del botón */
.ppb-hero-actions[b-sio1qvlbhu] {
    position: relative;
    z-index: 2; /* encima de los efectos */
    display: flex;
    align-items: center;
    gap: 10px;
}

/* botón */
.ppb-refresh-btn[b-sio1qvlbhu] {
    border: none;
    border-radius: 14px;
    padding: 10px 18px;
    font-weight: 900;
    font-size: 13px;
    letter-spacing: 0.4px;
    cursor: pointer;
    color: #fff;
    background: linear-gradient(135deg, #10b981, #059669);
    box-shadow: 0 10px 22px rgba(16, 185, 129, 0.28), inset 0 1px 0 rgba(255,255,255,0.25);
    transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
}

    /* hover */
    .ppb-refresh-btn:hover:not(:disabled)[b-sio1qvlbhu] {
        transform: translateY(-2px);
        box-shadow: 0 16px 30px rgba(16, 185, 129, 0.35), inset 0 1px 0 rgba(255,255,255,0.3);
        filter: brightness(1.05);
    }

    /* click */
    .ppb-refresh-btn:active[b-sio1qvlbhu] {
        transform: translateY(0);
    }

    /* deshabilitado */
    .ppb-refresh-btn:disabled[b-sio1qvlbhu] {
        opacity: 0.7;
        cursor: not-allowed;
    }


.ppb-shell[b-sio1qvlbhu],
.ppb-shell button[b-sio1qvlbhu],
.ppb-shell .kpi-card[b-sio1qvlbhu],
.ppb-shell .kpi-icon[b-sio1qvlbhu],
.ppb-shell .kpi-valor[b-sio1qvlbhu],
.ppb-shell .kpi-mini[b-sio1qvlbhu],
.ppb-shell .kpi-titulo[b-sio1qvlbhu],
.ppb-shell .kpi-range-chip[b-sio1qvlbhu] {
    caret-color: transparent;
}

    .ppb-shell button[b-sio1qvlbhu],
    .ppb-shell .kpi-icon[b-sio1qvlbhu] {
        user-select: none;
    }

        .ppb-shell button:focus:not(:focus-visible)[b-sio1qvlbhu] {
            outline: none;
            box-shadow: none;
        }

    .ppb-shell input[b-sio1qvlbhu],
    .ppb-shell textarea[b-sio1qvlbhu],
    .ppb-shell select[b-sio1qvlbhu] {
        caret-color: auto;
        user-select: auto;
    }
/* _content/SistemaLoteriaDashboard/Components/Banca/Prestamos.razor.rz.scp.css */
.pr-panel[b-rq5f82bwbu] {
    padding: 18px;
    border-radius: 14px;
    background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
    border: 1px solid #dbe8fb;
    box-shadow: 0 10px 26px rgba(15, 23, 42, 0.08);
}

.pr-tabs[b-rq5f82bwbu] {
    display: flex;
    gap: 10px;
    margin-bottom: 14px;
}

.pr-tab[b-rq5f82bwbu] {
    height: 44px;
    padding: 0 16px;
    border-radius: 12px;
    border: 1px solid #cfe0f7;
    background: #fff;
    font-weight: 1100;
    font-size: 1.08rem;
    color: #144a8f;
    cursor: pointer;
    box-shadow: 0 8px 18px rgba(15,23,42,.06);
}

    .pr-tab.active[b-rq5f82bwbu] {
        background: linear-gradient(180deg, #1a5fb4, #144a8f);
        color: #fff;
        border-color: transparent;
        box-shadow: 0 12px 22px rgba(20,74,143,.22);
    }

.pr-busqueda[b-rq5f82bwbu] {
    display: grid;
    grid-template-columns: 360px 180px;
    gap: 14px;
    align-items: start;
}

@media (max-width: 980px) {
    .pr-busqueda[b-rq5f82bwbu] {
        grid-template-columns: 1fr;
    }
}

.pr-col[b-rq5f82bwbu] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}

    .pr-col label[b-rq5f82bwbu] {
        font-size: 1.12rem;
        font-weight: 1000;
        color: #213b63;
        margin-bottom: -2px;
    }

.pr-label-sub[b-rq5f82bwbu] {
    margin-top: 2px;
}

.pr-input-sm[b-rq5f82bwbu] {
    height: 44px;
    padding: 0 12px;
    border-radius: 12px;
    border: 1px solid #cfe0f7;
    outline: none;
    background: #fff;
    font-weight: 900;
    font-size: 1.12rem;
    color: #14243a;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
    width: 100%;
    min-width: 0;
    max-width: 100%;
}

    .pr-input-sm:focus[b-rq5f82bwbu] {
        border-color: #1a5fb4;
        box-shadow: 0 0 0 4px rgba(26,95,180,.18);
    }

    .pr-input-sm[b-rq5f82bwbu]::placeholder {
        color: #6a7a92;
        font-weight: 800;
    }

.pr-select[b-rq5f82bwbu] {
    appearance: none;
    background-image: linear-gradient(45deg, transparent 50%, #375e9a 50%), linear-gradient(135deg, #375e9a 50%, transparent 50%);
    background-position: calc(100% - 18px) 18px, calc(100% - 12px) 18px;
    background-size: 6px 6px, 6px 6px;
    background-repeat: no-repeat;
    padding-right: 34px;
}

/* ✅ IMPORTANTE: compactos (no exagerados) */
.pr-select-compact[b-rq5f82bwbu] {
    width: 100%;
    max-width: 360px;
}

.pr-input-id[b-rq5f82bwbu] {
    text-align: center;
}

.pr-seleccion[b-rq5f82bwbu] {
    margin: 18px 0 12px;
}

.pr-chip[b-rq5f82bwbu] {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    padding: 14px 16px;
    border-radius: 999px;
    border: 1px solid #b7f0ce;
    background: #ecfdf5;
    color: #065f46;
    font-weight: 1100;
    font-size: 1.10rem;
    max-width: 100%;
}

/* ✅ Más grande y notorio (Vendedor/Persona seleccionada) */
.pr-chip-big[b-rq5f82bwbu] {
    padding: 16px 18px;
    font-size: 1.22rem;
    font-weight: 1300;
    box-shadow: 0 14px 26px rgba(34,197,94,.10);
}

    .pr-chip-big b[b-rq5f82bwbu] {
        font-size: 1.28rem;
        font-weight: 1500;
    }

.pr-chip-warn[b-rq5f82bwbu] {
    border-color: #fdba74;
    background: #fff7ed;
    color: #9a3412;
}

.pr-dot[b-rq5f82bwbu] {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #22c55e;
    box-shadow: 0 0 0 4px rgba(34,197,94,.15);
}

.pr-dot-warn[b-rq5f82bwbu] {
    background: #f97316;
    box-shadow: 0 0 0 4px rgba(249,115,22,.16);
}

.pr-sep[b-rq5f82bwbu] {
    opacity: .65;
}

.pr-actions[b-rq5f82bwbu] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin: 12px 0 16px;
}

.pr-btn[b-rq5f82bwbu] {
    height: 44px;
    padding: 0 16px;
    border-radius: 12px;
    font-weight: 1100;
    font-size: 1.08rem;
    border: 1px solid transparent;
    cursor: pointer;
    transition: transform .12s ease, box-shadow .12s ease;
}

    .pr-btn:disabled[b-rq5f82bwbu] {
        opacity: .55;
        cursor: not-allowed;
        transform: none;
        box-shadow: none;
    }

    .pr-btn:hover[b-rq5f82bwbu] {
        transform: translateY(-1px);
    }

.pr-btn-primary[b-rq5f82bwbu] {
    background: linear-gradient(180deg, #1a5fb4, #144a8f);
    color: #fff;
    box-shadow: 0 10px 22px rgba(20,74,143,.22);
}

.pr-btn-ghost[b-rq5f82bwbu] {
    background: #fff;
    color: #144a8f;
    border-color: #cfe0f7;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

/* Botón apilado debajo del input ID */
.pr-btn-stack[b-rq5f82bwbu] {
    margin-top: 10px;
}

.pr-saldo-card[b-rq5f82bwbu] {
    margin-top: 12px;
    padding: 18px;
    border-radius: 14px;
    border: 1px solid #dbe8fb;
    background: linear-gradient(180deg, #ffffff 0%, #f2f8ff 100%);
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.10);
    max-width: 640px;
}

.pr-saldo-title[b-rq5f82bwbu] {
    font-weight: 1100;
    color: #153e75;
    font-size: 1.12rem;
    margin-bottom: 8px;
}

.pr-saldo-valor[b-rq5f82bwbu] {
    font-size: 2.05rem;
    font-weight: 1300;
    color: #0f2b4d;
}

.pr-saldo-sub[b-rq5f82bwbu] {
    margin-top: 8px;
    color: #52627a;
    font-weight: 1000;
    font-size: 1.05rem;
}

/* Interés */
.pr-interest[b-rq5f82bwbu] {
    margin-top: 14px;
    display: flex;
    gap: 14px;
    align-items: center;
    flex-wrap: wrap;
}

.pr-check[b-rq5f82bwbu] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 1100;
    color: #153e75;
    font-size: 1.05rem;
}

.pr-interest-box[b-rq5f82bwbu] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid #dbe8fb;
    background: #fff;
    box-shadow: 0 10px 22px rgba(15,23,42,.06);
}

    .pr-interest-box span[b-rq5f82bwbu] {
        font-weight: 1100;
        color: #1b2b45;
    }

    .pr-interest-box.disabled[b-rq5f82bwbu] {
        opacity: .55;
    }

/* Modals */
.pr-modal-backdrop[b-rq5f82bwbu] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    padding: 18px;
}

.pr-modal[b-rq5f82bwbu] {
    width: min(560px, 96vw);
    background: #fff;
    border-radius: 16px;
    padding: 16px;
    box-shadow: 0 18px 50px rgba(0,0,0,.28);
    border: 1px solid rgba(255,255,255,.35);
}

.pr-modal-lg[b-rq5f82bwbu] {
    width: min(700px,96vw);
}

.pr-modal-hist[b-rq5f82bwbu] {
    width: min(1200px, 96vw);
    max-width: none;
    overflow: hidden;
    border-radius: 18px;
    padding: 18px;
}

.pr-modal-title[b-rq5f82bwbu] {
    font-weight: 1200;
    font-size: 1.22rem;
    color: #153e75;
    margin-bottom: 8px;
}

.pr-modal-sub[b-rq5f82bwbu] {
    color: #1b2b45;
    font-weight: 1000;
    font-size: 1.06rem;
    margin-bottom: 12px;
}

.pr-modal-label[b-rq5f82bwbu] {
    font-weight: 1100;
    color: #304766;
    display: block;
    margin-bottom: 8px;
    font-size: 1.02rem;
}

.pr-modal-input[b-rq5f82bwbu] {
    height: 48px;
    font-size: 1.12rem;
    padding: 0 12px;
    border-radius: 12px;
    border: 1px solid #cfe0f7;
    outline: none;
    width: 100%;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
}

.pr-modal-actions[b-rq5f82bwbu] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 12px;
}

.pr-modal-grid[b-rq5f82bwbu] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 10px;
}

/* Historial table */
.pr-hist-head[b-rq5f82bwbu] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 10px 0 14px;
    flex-wrap: wrap;
}

.pr-hist-head-split[b-rq5f82bwbu] {
    justify-content: space-between;
    width: 100%;
}

.pr-hist-left[b-rq5f82bwbu] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.pr-hist-right[b-rq5f82bwbu] {
    display: flex;
    align-items: center;
}

.pr-hist-label[b-rq5f82bwbu] {
    font-weight: 1200;
    font-size: 1.06rem;
    color: #153e75;
}

.pr-hist-chip[b-rq5f82bwbu] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 999px;
    background: linear-gradient(180deg, #eef6ff 0%, #ffffff 100%);
    border: 1px solid #cfe0f7;
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.08);
    font-weight: 1200;
    font-size: 1.08rem;
    color: #0f2b4d;
}

.pr-hist-chip-id[b-rq5f82bwbu] {
    padding: 6px 10px;
    border-radius: 999px;
    background: #ecfdf5;
    border: 1px solid #b7f0ce;
    color: #065f46;
    font-weight: 1200;
    font-size: 1.00rem;
}

.pr-hist-totalbox[b-rq5f82bwbu] {
    text-align: right;
    padding: 10px 14px;
    border-radius: 16px;
    border: 1px solid #dbe8fb;
    background: linear-gradient(180deg, #ffffff 0%, #f2f8ff 100%);
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.08);
    min-width: 220px;
}

.pr-hist-total-title[b-rq5f82bwbu] {
    font-weight: 1100;
    color: #153e75;
    font-size: 1.02rem;
}

.pr-hist-total-amount[b-rq5f82bwbu] {
    font-weight: 1400;
    font-size: 1.45rem;
    color: #0f2b4d;
    line-height: 1.05;
}

.pr-hist-total-count[b-rq5f82bwbu] {
    margin-top: 2px;
    font-weight: 1000;
    font-size: 1.00rem;
    color: #52627a;
}

.pr-hist-wrap[b-rq5f82bwbu] {
    border: 1px solid #dbe8fb;
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f6fbff 100%);
    padding: 10px;
    max-height: calc(78vh - 190px);
    overflow: auto;
}

.pr-table[b-rq5f82bwbu] {
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}

.pr-table-head[b-rq5f82bwbu] {
    display: grid;
    grid-template-columns: 1.4fr 1fr .6fr;
    gap: 10px;
    padding: 14px 14px;
    background: linear-gradient(180deg, #eef6ff 0%, #ffffff 100%);
    color: #153e75;
    font-weight: 1200;
    font-size: 1.06rem;
    border-bottom: 1px solid #dbe8fb;
}

.pr-table-row[b-rq5f82bwbu] {
    display: grid;
    grid-template-columns: 1.4fr 1fr .6fr;
    gap: 10px;
    padding: 14px 14px;
    border-top: 1px solid #eef2f7;
    font-weight: 1000;
    font-size: 1.04rem;
    color: #1b2b45;
}

    .pr-table-row:nth-child(even)[b-rq5f82bwbu] {
        background: #fbfdff;
    }

.pr-hist-monto[b-rq5f82bwbu] {
    font-weight: 1300;
    color: #0f2b4d;
}

.pr-pill[b-rq5f82bwbu] {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: .95rem;
    font-weight: 1200;
    border: 1px solid #cfe0f7;
    background: #f4f9ff;
    color: #144a8f;
}

.pr-table-empty[b-rq5f82bwbu] {
    padding: 18px;
    color: #52627a;
    font-weight: 1100;
    font-size: 1.05rem;
}

.pr-chip-persona[b-rq5f82bwbu] {
    font-size: 19px;
    padding: 14px 16px;
}

    .pr-chip-persona b[b-rq5f82bwbu] {
        font-size: 21px;
    }
/* Layout 2 columnas (izquierda contenido / derecha saldo) */
.pr-layout[b-rq5f82bwbu] {
    display: grid;
    grid-template-columns: 520px 1fr;
    gap: 22px;
    align-items: start;
}

.pr-left[b-rq5f82bwbu] {
    min-width: 0;
}

.pr-right[b-rq5f82bwbu] {
    min-width: 0;
    display: flex;
    justify-content: flex-end;
}

/* Panel saldo en el área derecha */
.pr-saldo-card-right[b-rq5f82bwbu] {
    width: min(560px, 100%);
}

/* Más grande (3 puntos aprox) */
.pr-saldo-title[b-rq5f82bwbu] {
    font-size: 1.30rem;
}

.pr-saldo-valor[b-rq5f82bwbu] {
    font-size: 2.25rem;
}

/* ===== Layout 3 columnas: izquierda / centro / derecha ===== */
.pr-layout[b-rq5f82bwbu] {
    display: grid;
    grid-template-columns: 420px 1fr 360px;
    gap: 18px;
    align-items: start;
    margin-top: 8px;
}

@media (max-width: 1100px) {
    .pr-layout[b-rq5f82bwbu] {
        grid-template-columns: 1fr;
    }
}

/* Evita que el bloque interno use su grid viejo */
.pr-busqueda-single[b-rq5f82bwbu] {
    grid-template-columns: 1fr 140px;
    max-width: 100%;
}

/* Slot del aviso naranja, siempre debajo del selector */
.pr-warn-slot[b-rq5f82bwbu] {
    margin-top: 12px;
}

/* Centro: card que centra panel verde + botones */
.pr-center[b-rq5f82bwbu] {
    display: flex;
    justify-content: center;
}

.pr-center-card[b-rq5f82bwbu] {
    width: min(560px, 100%);
    display: flex;
    flex-direction: column;
    gap: 14px;
    align-items: center;
    padding-top: 6px;
}

/* Botones centrados */
.pr-actions-center[b-rq5f82bwbu] {
    justify-content: center;
}

/* Panel verde MÁS GRANDE */
.pr-chip-selected[b-rq5f82bwbu] {
    border-color: #b7f0ce;
    background: #ecfdf5;
    color: #065f46;
}

.pr-chip-selected-xl[b-rq5f82bwbu] {
    gap: 16px;
    padding: 18px 20px;
    font-size: 1.28rem;
    font-weight: 1500;
    box-shadow: 0 14px 30px rgba(34,197,94,.14);
}

    .pr-chip-selected-xl b[b-rq5f82bwbu] {
        font-size: 1.35rem;
    }

/* Saldo a la derecha (y más grande) */
.pr-saldo-card-right[b-rq5f82bwbu] {
    max-width: 100%;
}

.pr-saldo-title-lg[b-rq5f82bwbu] {
    font-size: 1.22rem;
}

.pr-saldo-valor-lg[b-rq5f82bwbu] {
    font-size: 2.35rem;
}

/* Botón ancho como en ahorros */
.pr-left-actions[b-rq5f82bwbu] {
    margin-top: 10px;
}

.pr-btn-wide[b-rq5f82bwbu] {
    width: 100%;
}

/* Modal resumen grande */
.pr-modal-resumen[b-rq5f82bwbu] {
    max-width: 1100px;
}

/* 5 columnas */
.pr-resumen-head[b-rq5f82bwbu],
.pr-resumen-row[b-rq5f82bwbu] {
    display: grid;
    grid-template-columns: 90px 1.4fr 180px 180px 220px;
    gap: 12px;
    align-items: center;
}

/* Alinear montos a la derecha */
.pr-resumen-right[b-rq5f82bwbu] {
    text-align: right;
}

/* Totales abajo: dos cajas */
.pr-resumen-totales[b-rq5f82bwbu] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-top: 14px;
}

.pr-resumen-totalbox[b-rq5f82bwbu] {
    background: rgba(15, 23, 42, 0.06);
    border: 1px solid rgba(15, 23, 42, 0.10);
    border-radius: 12px;
    padding: 12px 14px;
    display: flex;
    gap: 10px; /* 🔥 separación corta entre texto y monto */
    justify-content: flex-start; /* 🔥 ya NO se van a los lados */
    align-items: center;
    font-size: 16px;
}

/* =========================
   MODAL RESUMEN (GRANDE)
   Aplica a vendedores y particulares
   ========================= */
.pr-modal.pr-modal-resumen[b-rq5f82bwbu] {
    width: 92vw; /* casi toda la pantalla */
    max-width: 1400px; /* grande en PC */
    min-width: 980px; /* evita que se haga pequeño */

    max-height: 85vh; /* alto máximo visible */
    overflow: auto; /* si algo se pasa, scroll dentro del modal */

    padding: 22px 24px;
    border-radius: 18px;
}
/* =========================
   TOTALES RESUMEN PRÉSTAMOS
   GRANDES Y PEGADOS
   ========================= */

.pr-resumen-totales[b-rq5f82bwbu] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-top: 16px;
}

.pr-resumen-totalbox[b-rq5f82bwbu] {
    display: flex;
    align-items: baseline;
    gap: 10px; /* 🔥 separación corta entre texto y monto */
    justify-content: flex-start; /* 🔥 ya NO se van a los lados */
    padding: 16px 20px;
    border-radius: 14px;
    background: #f5f6f8;
    font-size: 18px;
    font-weight: 500;
}

    /* Texto: "Total saldo préstamos:" */
    .pr-resumen-totalbox span[b-rq5f82bwbu] {
        font-size: 18px;
        color: #374151;
        white-space: nowrap;
    }

    /* Monto ₡50 000 */
    .pr-resumen-totalbox b[b-rq5f82bwbu] {
        font-size: 28px; /* 🔥 MÁS GRANDE */
        font-weight: 700;
        color: #0f172a;
        white-space: nowrap;
    }

.pr-btn-mini[b-rq5f82bwbu] {
    padding: 6px 10px;
    font-size: 12px;
    border-radius: 10px;
}

@media (max-width: 700px) {
    /* =========================
       PRÉSTAMOS - SOLO MÓVIL
       NO TOCA ESCRITORIO
       ========================= */

    .pr-panel[b-rq5f82bwbu] {
        padding: 12px;
        border-radius: 12px;
    }

    /* ===== Tabs superiores ===== */
    .pr-tabs[b-rq5f82bwbu] {
        display: flex;
        flex-direction: column;
        gap: 8px;
        margin-bottom: 12px;
    }

    .pr-tab[b-rq5f82bwbu] {
        width: 100%;
        min-height: 46px;
        height: auto;
        padding: 10px 12px;
        font-size: 1rem;
        line-height: 1.2;
    }

    /* ===== Layout principal ===== */
    .pr-layout[b-rq5f82bwbu] {
        grid-template-columns: 1fr !important;
        gap: 14px;
        margin-top: 6px;
    }

    .pr-left[b-rq5f82bwbu],
    .pr-center[b-rq5f82bwbu],
    .pr-right[b-rq5f82bwbu] {
        width: 100%;
        min-width: 0;
    }

    .pr-right[b-rq5f82bwbu] {
        justify-content: stretch;
    }

    /* ===== Bloque búsqueda ===== */
    .pr-busqueda[b-rq5f82bwbu],
    .pr-busqueda-single[b-rq5f82bwbu] {
        grid-template-columns: 1fr !important;
        gap: 10px;
        max-width: 100%;
    }

    .pr-col[b-rq5f82bwbu] {
        gap: 8px;
    }

        .pr-col label[b-rq5f82bwbu] {
            font-size: 1rem;
            line-height: 1.2;
            margin-bottom: 0;
        }

    .pr-label-sub[b-rq5f82bwbu] {
        margin-top: 0;
    }

    .pr-input-sm[b-rq5f82bwbu],
    .pr-modal-input[b-rq5f82bwbu],
    .pr-select[b-rq5f82bwbu] {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
        font-size: 16px !important; /* evita zoom raro en iPhone */
    }

    .pr-input-sm[b-rq5f82bwbu] {
        height: 46px;
        padding: 0 12px;
    }

    .pr-input-id[b-rq5f82bwbu] {
        text-align: left;
    }

    .pr-select-compact[b-rq5f82bwbu] {
        max-width: 100%;
    }

    /* ===== Botones ===== */
    .pr-left-actions[b-rq5f82bwbu] {
        margin-top: 12px;
        display: flex;
        width: 100%;
    }

    .pr-actions[b-rq5f82bwbu],
    .pr-actions-center[b-rq5f82bwbu],
    .pr-modal-actions[b-rq5f82bwbu] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    .pr-btn[b-rq5f82bwbu],
    .pr-btn-wide[b-rq5f82bwbu],
    .pr-btn-stack[b-rq5f82bwbu] {
        width: 100%;
        min-height: 46px;
        height: auto;
        padding: 10px 12px;
        font-size: 1rem;
    }

    .pr-btn-stack[b-rq5f82bwbu] {
        margin-top: 8px;
    }

    /* ===== Card centro ===== */
    .pr-center[b-rq5f82bwbu] {
        justify-content: stretch;
    }

    .pr-center-card[b-rq5f82bwbu] {
        width: 100%;
        padding-top: 0;
        gap: 12px;
        align-items: stretch;
    }

    .pr-chip[b-rq5f82bwbu],
    .pr-chip-selected-xl[b-rq5f82bwbu],
    .pr-chip-big[b-rq5f82bwbu],
    .pr-chip-persona[b-rq5f82bwbu] {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        border-radius: 16px;
        white-space: normal;
        flex-wrap: wrap;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .pr-chip-selected-xl[b-rq5f82bwbu] {
        padding: 14px;
        font-size: 1rem;
        gap: 10px;
    }

        .pr-chip-selected-xl b[b-rq5f82bwbu] {
            font-size: 1.06rem;
        }

    /* ===== Saldo ===== */
    .pr-saldo-card[b-rq5f82bwbu],
    .pr-saldo-card-right[b-rq5f82bwbu] {
        width: 100%;
        max-width: 100%;
        margin-top: 0;
        padding: 14px;
        border-radius: 14px;
        box-sizing: border-box;
    }

    .pr-saldo-title[b-rq5f82bwbu],
    .pr-saldo-title-lg[b-rq5f82bwbu] {
        font-size: 1.02rem;
        line-height: 1.2;
        margin-bottom: 6px;
    }

    .pr-saldo-valor[b-rq5f82bwbu],
    .pr-saldo-valor-lg[b-rq5f82bwbu] {
        font-size: 1.8rem;
        line-height: 1.15;
        word-break: break-word;
    }

    .pr-saldo-sub[b-rq5f82bwbu] {
        font-size: 0.95rem;
        line-height: 1.35;
        word-break: break-word;
    }

    /* ===== Modales base ===== */
    .pr-modal-backdrop[b-rq5f82bwbu] {
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,45);
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 10px;
        overflow: hidden;
        overscroll-behavior: contain;
        touch-action: none;
        -webkit-overflow-scrolling: auto;
    }

    .pr-modal[b-rq5f82bwbu],
    .pr-modal-lg[b-rq5f82bwbu],
    .pr-modal-hist[b-rq5f82bwbu],
    .pr-modal-resumen[b-rq5f82bwbu] {
        width: 100%;
        max-width: 100%;
        min-width: 0 !important;
        box-sizing: border-box;
        border-radius: 14px;
        padding: 14px;
        touch-action: auto;
        overscroll-behavior: contain;
    }

    .pr-modal[b-rq5f82bwbu] {
        max-height: none;
    }

    .pr-modal-title[b-rq5f82bwbu] {
        font-size: 1.08rem;
        line-height: 1.25;
        margin-bottom: 8px;
    }

    .pr-modal-sub[b-rq5f82bwbu] {
        font-size: 0.96rem;
        line-height: 1.35;
        margin-bottom: 10px;
        word-break: break-word;
    }

    .pr-modal-label[b-rq5f82bwbu],
    .pr-check[b-rq5f82bwbu] {
        font-size: 0.96rem;
        line-height: 1.3;
    }

    .pr-modal-input[b-rq5f82bwbu] {
        height: 46px;
        padding: 0 12px;
    }

    .pr-modal-grid[b-rq5f82bwbu] {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .pr-interest-box[b-rq5f82bwbu] {
        width: 100%;
        box-sizing: border-box;
        flex-wrap: wrap;
    }

    /* ===== MODAL HISTORIAL ===== */
    .pr-modal-hist[b-rq5f82bwbu] {
        max-height: 90svh;
        overflow: hidden;
    }

    .pr-hist-head[b-rq5f82bwbu],
    .pr-hist-head-split[b-rq5f82bwbu],
    .pr-hist-left[b-rq5f82bwbu],
    .pr-hist-right[b-rq5f82bwbu] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
        width: 100%;
    }

    .pr-hist-chip[b-rq5f82bwbu] {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        border-radius: 14px;
        white-space: normal;
        flex-wrap: wrap;
        line-height: 1.3;
        font-size: 0.96rem;
    }

    .pr-hist-chip-id[b-rq5f82bwbu] {
        font-size: 0.9rem;
    }

    .pr-hist-totalbox[b-rq5f82bwbu] {
        min-width: 0;
        width: 100%;
        box-sizing: border-box;
        text-align: left;
    }

    .pr-hist-total-title[b-rq5f82bwbu] {
        font-size: 0.96rem;
    }

    .pr-hist-total-amount[b-rq5f82bwbu] {
        font-size: 1.2rem;
    }

    .pr-hist-total-count[b-rq5f82bwbu] {
        font-size: 0.92rem;
    }

    .pr-hist-wrap[b-rq5f82bwbu] {
        max-height: calc(90svh - 260px);
        padding: 8px;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-x pan-y;
    }

    .pr-table[b-rq5f82bwbu] {
        min-width: 0;
        box-shadow: none;
    }

    .pr-table-head[b-rq5f82bwbu],
    .pr-table-row[b-rq5f82bwbu] {
        min-width: 620px;
        grid-template-columns: 170px 120px 110px 120px;
        gap: 8px;
        padding: 12px;
        font-size: 0.95rem;
        align-items: center;
    }

    .pr-table-head[b-rq5f82bwbu] {
        font-size: 0.96rem;
    }

    .pr-table-empty[b-rq5f82bwbu] {
        padding: 14px;
        font-size: 0.95rem;
    }

    .pr-pill[b-rq5f82bwbu] {
        font-size: 0.88rem;
        padding: 6px 8px;
    }

    /* ===== MODAL RESUMEN PRESTAMOS ===== */
    .pr-modal.pr-modal-resumen[b-rq5f82bwbu] {
        width: 100%;
        max-width: 100%;
        min-width: 0 !important;
        max-height: 90svh;
        overflow: hidden;
        padding: 14px;
        border-radius: 14px;
    }

    .pr-resumen-wrap[b-rq5f82bwbu] {
        max-height: calc(90svh - 240px);
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-x pan-y;
    }

    .pr-resumen-head[b-rq5f82bwbu],
    .pr-resumen-row[b-rq5f82bwbu] {
        min-width: 860px;
        grid-template-columns: 80px 180px 140px 160px 220px;
        gap: 10px;
        padding: 12px;
        font-size: 0.94rem;
        align-items: center;
    }

    .pr-resumen-right[b-rq5f82bwbu] {
        text-align: right;
    }

    .pr-resumen-totales[b-rq5f82bwbu] {
        grid-template-columns: 1fr;
        gap: 10px;
        margin-top: 12px;
    }

    .pr-resumen-totalbox[b-rq5f82bwbu] {
        width: 100%;
        box-sizing: border-box;
        padding: 12px 14px;
        border-radius: 12px;
        flex-wrap: wrap;
        align-items: flex-start;
        gap: 4px 8px;
        font-size: 1rem;
    }

        .pr-resumen-totalbox span[b-rq5f82bwbu] {
            font-size: 0.96rem;
            white-space: normal;
        }

        .pr-resumen-totalbox b[b-rq5f82bwbu] {
            font-size: 1.2rem;
            line-height: 1.2;
        }
}

.pr-table-head-5[b-rq5f82bwbu],
.pr-table-row-5[b-rq5f82bwbu] {
    grid-template-columns: 1.3fr 1fr .8fr 1fr .8fr !important;
}

.pr-pill-ok[b-rq5f82bwbu] {
    background: #ecfdf5;
    border-color: #86efac;
    color: #065f46;
}

.pr-pill-no[b-rq5f82bwbu] {
    background: #fff7ed;
    border-color: #fdba74;
    color: #9a3412;
}

.pr-modal-hist[b-rq5f82bwbu] {
    width: min(1280px, 98vw) !important;
}

.pr-hist-wrap[b-rq5f82bwbu] {
    overflow-x: auto !important;
}

.pr-table[b-rq5f82bwbu] {
    min-width: 1040px !important;
}

.pr-table-head-5[b-rq5f82bwbu],
.pr-table-row-5[b-rq5f82bwbu] {
    display: grid !important;
    grid-template-columns: 230px 160px 130px 170px 220px !important;
    gap: 10px !important;
    align-items: center !important;
}

.pr-row-actions[b-rq5f82bwbu] {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
}

.pr-btn-danger[b-rq5f82bwbu] {
    background: #fee2e2 !important;
    color: #991b1b !important;
    border-color: #fecaca !important;
}

    .pr-btn-danger:hover[b-rq5f82bwbu] {
        background: #fecaca !important;
    }

.pr-resumen-head[b-rq5f82bwbu],
.pr-resumen-row[b-rq5f82bwbu] {
    grid-template-columns: 90px 1.4fr 180px 180px 220px 160px !important;
    min-width: 1060px !important;
}

.pr-resumen-head-vendedores[b-rq5f82bwbu],
.pr-resumen-row-vendedores[b-rq5f82bwbu] {
    grid-template-columns: 80px 1.4fr 160px 170px 170px 220px 170px !important;
    min-width: 1280px !important;
}

.pr-modal.pr-modal-resumen[b-rq5f82bwbu] {
    width: min(1450px, 98vw) !important;
    max-width: 1450px !important;
}

.pr-resumen-wrap[b-rq5f82bwbu] {
    overflow-x: auto !important;
}

.pr-resumen-table[b-rq5f82bwbu] {
    min-width: 1060px !important;
}


.pr-totales-pro[b-rq5f82bwbu] {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(180px, 1fr)) !important;
    gap: 10px !important;
    margin: 14px 0 10px !important;
}

.pr-total-pro[b-rq5f82bwbu] {
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
    border: 1px solid #dbe8fb !important;
    border-radius: 14px !important;
    padding: 10px 12px !important;
    min-height: 62px !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 3px !important;
}

    .pr-total-pro span[b-rq5f82bwbu] {
        font-size: .82rem !important;
        font-weight: 1100 !important;
        color: #475569 !important;
        line-height: 1.15 !important;
    }

    .pr-total-pro b[b-rq5f82bwbu] {
        font-size: 1.18rem !important;
        font-weight: 1400 !important;
        color: #0f172a !important;
        line-height: 1.1 !important;
    }

.pr-total-pro-ok[b-rq5f82bwbu] {
    border-color: #bbf7d0 !important;
    background: linear-gradient(180deg, #ffffff 0%, #f0fdf4 100%) !important;
}

.pr-total-pro-no[b-rq5f82bwbu] {
    border-color: #fed7aa !important;
    background: linear-gradient(180deg, #ffffff 0%, #fff7ed 100%) !important;
}

@media (max-width: 700px) {
    .pr-totales-pro[b-rq5f82bwbu] {
        grid-template-columns: 1fr 1fr !important;
    }

    .pr-total-pro[b-rq5f82bwbu] {
        min-height: 58px !important;
        padding: 9px 10px !important;
    }

        .pr-total-pro span[b-rq5f82bwbu] {
            font-size: .78rem !important;
        }

        .pr-total-pro b[b-rq5f82bwbu] {
            font-size: 1rem !important;
        }
}
/* _content/SistemaLoteriaDashboard/Components/Banca/Restricciones.razor.rz.scp.css */
/* ===== Estructura base ===== */
.rest-wrap[b-gzngsi3ocj] {
    padding: 14px 18px;
}

.rest-card[b-gzngsi3ocj] {
    background: #fff;
    border: 1px solid #e6edf8;
    border-radius: 12px;
    padding: 16px 18px;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
    margin-bottom: 16px;
}

.card-title[b-gzngsi3ocj] {
    font-weight: 900;
    color: #153e75;
    margin-bottom: 8px;
    font-size: 1.28rem;
}

.card-subtitle[b-gzngsi3ocj] {
    color: #4a5b78;
    font-size: 1.05rem;
    margin-bottom: 14px;
}

/* ===== Filtros (GRID FIJO) =====
   Fila 1: Fecha (arriba, NO gigante)
   Fila 2: Vendedores (izq) | Sorteos (der)
   Fila 3: Tipo (izq) | Tope/%/Base (der)
*/
.filtros[b-gzngsi3ocj] {
    display: grid;
    grid-template-columns: repeat(6, minmax(160px, 1fr));
    column-gap: 8px;
    row-gap: 12px;
    margin-bottom: 14px;
}

.campo[b-gzngsi3ocj] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

    .campo > label[b-gzngsi3ocj] {
        font-weight: 800;
        color: #244;
        font-size: 1.02rem;
    }

    .campo input[type="number"][b-gzngsi3ocj],
    .campo input[type="text"][b-gzngsi3ocj],
    .select-xl[b-gzngsi3ocj] {
        border: 1px solid #cfe0f5;
        border-radius: 10px;
        padding: 10px 12px;
        font-size: 1.08rem;
        line-height: 1.25;
        width: 100%;
        box-sizing: border-box;
        background: #fff;
    }

/* Radios */
.tipo .radios[b-gzngsi3ocj] {
    display: flex;
    gap: 16px;
    align-items: center;
    font-size: 1.06rem;
}

.radio[b-gzngsi3ocj] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Inputs con prefijo ₡ / % */
.input-money[b-gzngsi3ocj], .input-percent[b-gzngsi3ocj] {
    display: flex;
    align-items: center;
    gap: 8px;
}

    .input-money span[b-gzngsi3ocj], .input-percent span[b-gzngsi3ocj] {
        background: #eef5ff;
        border: 1px solid #cfe0f5;
        padding: 6px 8px;
        border-radius: 8px;
        font-weight: 800;
        color: #0a3c6b;
        font-size: 1.02rem;
    }

/* ===== InputDate tamaño (NORMAL como los selects) ===== */


    .campo input[type="date"][b-gzngsi3ocj]::-webkit-calendar-picker-indicator {
        cursor: pointer;
        opacity: .75;
    }

/* ===== POSICIONES EXACTAS ===== */

/* Fecha arriba: más angosta (sin renglón largo) */
.fecha-top[b-gzngsi3ocj] {
    grid-column: 1 / span 2; /* antes span 3 */
    grid-row: 1;
}

    /* Fecha: números más grandes (solo la fecha) */
    .fecha-top .select-xl[b-gzngsi3ocj],
    .fecha-top input[type="date"][b-gzngsi3ocj] {
        font-size: 1.30rem !important; /* sube tamaño */
        letter-spacing: .3px;
    }

/* Fila 2 */
.vendedor-fijo[b-gzngsi3ocj] {
    grid-column: 1 / span 3;
    grid-row: 2;
}

.sorteo-fijo[b-gzngsi3ocj] {
    grid-column: 4 / span 3;
    grid-row: 2;
}

/* ===== Selector de listeros ===== */
.listero-fijo[b-gzngsi3ocj] {
    grid-column: 4 / span 3;
    grid-row: 1;
}

    .listero-fijo .select-xl[b-gzngsi3ocj] {
        min-height: 48px;
        border-radius: 12px;
        border: 1px solid #cfe0f5;
        background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
        box-shadow: 0 2px 8px rgba(15, 23, 42, .04);
        font-size: 1.02rem;
        font-weight: 800;
        color: #153e75;
    }

/* Fila 3 */
/* Tipo (izq) */
.tipo-fijo[b-gzngsi3ocj] {
    grid-column: 1 / span 2; /* antes span 3 */
    grid-row: 3;
}

/* Textbox (Tope / % / Base) más pegados al tipo */
.slot-centro[b-gzngsi3ocj] {
    grid-column: 3 / span 4; /* antes empezaba en 4 */
    grid-row: 3;
}


/* Porcentaje: dos inputs a la par dentro del slot derecho */
.porc-grid[b-gzngsi3ocj] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    align-items: start;
}

.porc-ayuda[b-gzngsi3ocj] {
    margin-top: 6px;
}



/* ===== MultiSelect (dropdown con checks) ===== */
.ms-root[b-gzngsi3ocj] {
    position: relative;
    width: 100%;
}



.ms-btn[b-gzngsi3ocj] {
    width: 100%;
    height: 56px;
    border: 1px solid #cfe0f5;
    border-radius: 10px;
    background: #fff;
    padding: 10px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    cursor: pointer;
    box-sizing: border-box;
    box-shadow: 0 2px 6px rgba(15,23,42,.06);
}

    .ms-btn:hover[b-gzngsi3ocj] {
        border-color: #98bdf0;
        background: #fbfdff;
    }

.ms-btn-text[b-gzngsi3ocj] {
    font-size: 1.15rem;
    font-weight: 800;
    color: #153e75;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ms-caret[b-gzngsi3ocj] {
    color: #6b7a90;
    font-size: 1rem;
    font-weight: 900;
}

.ms-panel[b-gzngsi3ocj] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    width: 100%;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #d1d5db;
    box-shadow: 0 10px 24px rgba(15,23,42,.22);
    z-index: 1200;
    overflow: hidden;
}

.ms-top[b-gzngsi3ocj] {
    padding: 10px 12px;
    border-bottom: 1px solid #eef3fb;
    background: #f8fbff;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ms-check[b-gzngsi3ocj] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 800;
    color: #123a6c;
    font-size: 1.02rem;
}

    .ms-check input[b-gzngsi3ocj] {
        transform: scale(1.05);
    }

.ms-global[b-gzngsi3ocj] {
    color: #8a1c1c;
}

.ms-list[b-gzngsi3ocj] {
    max-height: 220px;
    overflow: auto;
    padding: 10px 12px;
    background: #fff;
}

.ms-item[b-gzngsi3ocj] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 10px;
    cursor: pointer;
    transition: background .12s ease;
}

    .ms-item:hover[b-gzngsi3ocj] {
        background: #f1f6ff;
    }

    .ms-item input[b-gzngsi3ocj] {
        transform: scale(1.05);
    }

.ms-item-text[b-gzngsi3ocj] {
    font-weight: 800;
    color: #153e75;
    font-size: 1.03rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ms-empty[b-gzngsi3ocj] {
    color: #567;
    font-style: italic;
    padding: 10px 6px;
}

.ms-footer[b-gzngsi3ocj] {
    padding: 10px 12px;
    border-top: 1px solid #eef3fb;
    background: #fbfdff;
    display: flex;
    justify-content: flex-end;
}

/* ===== Números (chips) ===== */
.numeros-editor[b-gzngsi3ocj] {
    margin-top: 16px;
}

.chips-input[b-gzngsi3ocj] {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

    .chips-input input[b-gzngsi3ocj] {
        min-width: 420px;
        font-size: 1.12rem;
        padding: 10px 12px;
        border-radius: 10px;
        border: 1px solid #cfe0f5;
    }

.chips-list[b-gzngsi3ocj] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 10px;
}

.chip[b-gzngsi3ocj] {
    background: #eaf6ff;
    border: 1px solid #9ec5ea;
    color: #d32f2f;
    font-weight: 900;
    font-size: 1.20rem;
    padding: 6px 14px;
    border-radius: 999px;
    display: inline-flex;
    gap: 8px;
    align-items: center;
    line-height: 1.2;
}

    .chip .x[b-gzngsi3ocj] {
        border: none;
        background: transparent;
        font-size: 18px;
        cursor: pointer;
        line-height: 1;
        color: #064a7a;
    }

        .chip .x:hover[b-gzngsi3ocj] {
            opacity: .85;
        }

.ayuda[b-gzngsi3ocj] {
    color: #6b7a90;
    font-style: italic;
    font-size: 1.02rem;
}

    .ayuda.peque[b-gzngsi3ocj] {
        font-size: .95rem;
        font-style: italic;
    }

/* ===== Acciones ===== */
.acciones[b-gzngsi3ocj] {
    display: flex;
    gap: 12px;
    margin-top: 14px;
}

.btn[b-gzngsi3ocj] {
    border: 1px solid #cfe0f5;
    background: #fff;
    padding: 10px 16px;
    border-radius: 10px;
    font-weight: 800;
    cursor: pointer;
    font-size: 1.02rem;
}

    .btn.ok[b-gzngsi3ocj] {
        background: #e7f9ef;
        border-color: #8fd0a8;
    }

    .btn.light[b-gzngsi3ocj] {
        background: #f6f7fb;
    }

    .btn.mini[b-gzngsi3ocj] {
        padding: 6px 10px;
        border-radius: 8px;
        font-size: 1rem;
    }

        .btn.mini.rojo[b-gzngsi3ocj] {
            border-color: #f0b3b3;
            background: #ffecec;
        }

/* =========================================================
   ✅ FIX DEFINITIVO: FECHA GRANDE (Chrome/Edge/Firefox)
   - Agranda números reales del <input type="date">
   - Evita la "línea" gigante: limita ancho y alinea a la izquierda
   ========================================================= */

/* La caja de fecha NO ocupa toda la fila visualmente */
.fecha-top[b-gzngsi3ocj] {
    grid-column: 1 / span 6; /* sigue arriba */
    grid-row: 1;
}

    /* Limitar ancho para que no se vea como un renglón infinito */
    .fecha-top .fecha-xl[b-gzngsi3ocj] {
        width: 420px !important; /* AJUSTA si quieres: 380 / 420 / 460 */
        max-width: 100% !important;
        justify-self: start;
    }

/* Tamaño de letra real del input */
.rest-card .fecha-top .fecha-xl[b-gzngsi3ocj] {
    height: 56px !important;
    padding: 10px 14px !important;
    font-size: 1.35rem !important; /* ✅ aquí crece */
    font-weight: 900 !important;
    color: #153e75 !important;
    border: 1px solid #cfe0f5 !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.06) !important;
    box-sizing: border-box !important;
    line-height: 1.2 !important;
}

    /* ✅ Chrome/Edge: el texto visible vive en estos pseudoelementos */
    .rest-card .fecha-top .fecha-xl[b-gzngsi3ocj]::-webkit-datetime-edit {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

    .rest-card .fecha-top .fecha-xl[b-gzngsi3ocj]::-webkit-datetime-edit-day-field,
    .rest-card .fecha-top .fecha-xl[b-gzngsi3ocj]::-webkit-datetime-edit-month-field,
    .rest-card .fecha-top .fecha-xl[b-gzngsi3ocj]::-webkit-datetime-edit-year-field {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

    .rest-card .fecha-top .fecha-xl[b-gzngsi3ocj]::-webkit-datetime-edit-text {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

    /* Icono calendario */
    .rest-card .fecha-top .fecha-xl[b-gzngsi3ocj]::-webkit-calendar-picker-indicator {
        cursor: pointer;
        opacity: .80;
    }

/* =========================
   FECHA NUEVA (TEXT INPUT)
   - Se ve igual en TODOS los navegadores
   - No ocupa todo el ancho
   ========================= */

.fecha-top[b-gzngsi3ocj] {
    grid-column: 1 / span 6; /* sigue en la fila 1 */
    grid-row: 1;
}

.fecha-row[b-gzngsi3ocj] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: fit-content; /* ✅ evita que se estire */
    max-width: 100%;
}

.fecha-input[b-gzngsi3ocj] {
    width: 260px; /* ✅ ancho real (ajusta si quieres 240/280) */
    height: 56px;
    border: 1px solid #cfe0f5;
    border-radius: 10px;
    padding: 10px 14px;
    font-size: 1.35rem; /* ✅ números grandes */
    font-weight: 900;
    color: #153e75;
    background: #fff;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.06);
    box-sizing: border-box;
}

    .fecha-input[b-gzngsi3ocj]::placeholder {
        color: #8aa0bf;
        font-weight: 800;
    }

.fecha-hoy[b-gzngsi3ocj] {
    height: 56px;
    padding: 0 14px;
    border-radius: 10px;
    border: 1px solid #cfe0f5;
    background: #f6f7fb;
    font-weight: 900;
    color: #153e75;
    cursor: pointer;
}

    .fecha-hoy:hover[b-gzngsi3ocj] {
        background: #eef5ff;
        border-color: #98bdf0;
    }


/* =========================
   MODAL GUARDADO (CENTRADO)
   ========================= */

.rest-modal-backdrop[b-gzngsi3ocj] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    padding: 16px;
}

.rest-modal[b-gzngsi3ocj] {
    width: min(520px, 92vw);
    background: #fff;
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 14px;
    box-shadow: 0 18px 60px rgba(0,0,0,.35);
    padding: 18px 18px 14px 18px;
}

.rest-modal-title[b-gzngsi3ocj] {
    font-size: 18px;
    font-weight: 900;
    color: #153e75;
    margin-bottom: 10px;
}

.rest-modal-msg[b-gzngsi3ocj] {
    white-space: pre-wrap;
    margin: 0 0 14px 0;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.6;
    background: #f0f7ff;
    border: 1px solid #cfe0f5;
    border-radius: 12px;
    padding: 16px 18px;
    max-height: 55vh;
    overflow: auto;
    color: #153e75;
}

@media (max-width: 700px) {

    /* =========================
       RESTRICCIONES - MÓVIL
       ========================= */

    .rest-wrap[b-gzngsi3ocj] {
        padding: 10px;
    }

    .rest-card[b-gzngsi3ocj] {
        padding: 12px;
        border-radius: 14px;
        box-sizing: border-box;
        overflow-x: hidden;
    }

    .card-title[b-gzngsi3ocj] {
        font-size: 1.1rem;
        line-height: 1.25;
    }

    .card-subtitle[b-gzngsi3ocj] {
        font-size: 0.95rem;
        line-height: 1.35;
    }

    /* ===== GRID FILTROS → COLUMNA ===== */
    .filtros[b-gzngsi3ocj] {
        display: flex;
        flex-direction: column;
        gap: 12px;
    }

    .campo[b-gzngsi3ocj] {
        width: 100%;
        min-width: 0;
    }

        .campo > label[b-gzngsi3ocj] {
            font-size: 0.95rem;
        }

    /* ===== FECHA ===== */
    .fecha-top[b-gzngsi3ocj] {
        grid-column: auto;
        width: 100%;
    }

        .fecha-top > div[b-gzngsi3ocj] {
            display: flex;
            flex-direction: column;
            gap: 8px;
        }

    .fecha-date[b-gzngsi3ocj] {
        width: 100%;
        min-height: 46px;
        font-size: 16px;
        box-sizing: border-box;
    }

    /* ===== MULTISELECT ===== */
    .ms-btn[b-gzngsi3ocj] {
        height: 48px;
        padding: 10px 12px;
        border-radius: 12px;
    }

    .ms-btn-text[b-gzngsi3ocj] {
        font-size: 1rem;
        line-height: 1.2;
    }

    .ms-caret[b-gzngsi3ocj] {
        flex: 0 0 auto;
    }

    .ms-panel[b-gzngsi3ocj] {
        position: fixed;
        left: 50%;
        transform: translate(-50%, -50%);
        width: calc(100vw - 24px);
        max-width: calc(100vw - 24px);
        top: 50%;
        max-height: 78vh;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        border-radius: 18px;
        z-index: 3001;
        box-sizing: border-box;
        background: #ffffff;
        border: 1px solid #d7e2f1;
        box-shadow: 0 24px 60px rgba(0,0,0,.28);
    }

    .ms-top[b-gzngsi3ocj] {
        padding: 14px 16px;
        flex: 0 0 auto;
        border-bottom: 1px solid #eef3fb;
        background: #f8fbff;
    }

    .ms-check[b-gzngsi3ocj] {
        display: grid;
        grid-template-columns: 28px 1fr;
        align-items: center;
        gap: 10px;
        font-size: 1rem;
        line-height: 1.25;
    }

        .ms-check input[b-gzngsi3ocj] {
            width: 22px;
            height: 22px;
            margin: 0;
            transform: none;
        }

    .ms-list[b-gzngsi3ocj] {
        flex: 1 1 auto;
        max-height: none;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        padding: 10px 12px;
        overscroll-behavior: contain;
        touch-action: pan-y;
        background: #ffffff;
    }

    .ms-item[b-gzngsi3ocj] {
        display: grid;
        grid-template-columns: 28px 1fr;
        align-items: center;
        gap: 10px;
        padding: 10px 12px;
        border-radius: 12px;
        min-height: 48px;
        width: 100%;
    }

        .ms-item input[b-gzngsi3ocj] {
            width: 22px;
            height: 22px;
            margin: 0;
            transform: none;
        }

    .ms-item-text[b-gzngsi3ocj] {
        font-size: 1rem;
        line-height: 1.25;
        white-space: normal;
        overflow: visible;
        text-overflow: unset;
        word-break: break-word;
    }

    .ms-empty[b-gzngsi3ocj] {
        padding: 14px 10px;
        font-size: 0.96rem;
        line-height: 1.3;
    }

    .ms-footer[b-gzngsi3ocj] {
        padding: 12px;
        flex: 0 0 auto;
        border-top: 1px solid #eef3fb;
        background: #fbfdff;
    }

        .ms-footer .btn[b-gzngsi3ocj] {
            width: 100%;
            min-height: 46px;
        }

    /* ===== RADIOS ===== */
    .tipo .radios[b-gzngsi3ocj] {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    /* ===== INPUTS ===== */
    .campo input[b-gzngsi3ocj],
    .input-money input[b-gzngsi3ocj],
    .input-percent input[b-gzngsi3ocj] {
        width: 100%;
        min-height: 46px;
        font-size: 16px;
        box-sizing: border-box;
    }

    /* ===== PORCENTAJE GRID ===== */
    .porc-grid[b-gzngsi3ocj] {
        grid-template-columns: 1fr;
    }

    /* ===== CHIPS ===== */
    .chips-input[b-gzngsi3ocj] {
        flex-direction: column;
        align-items: stretch;
    }

        .chips-input input[b-gzngsi3ocj] {
            min-width: 0;
            width: 100%;
        }

    .chips-list[b-gzngsi3ocj] {
        gap: 6px;
    }

    .chip[b-gzngsi3ocj] {
        font-size: 1.05rem;
        padding: 6px 10px;
    }

    /* ===== BOTONES ===== */
    .acciones[b-gzngsi3ocj] {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    .btn[b-gzngsi3ocj] {
        width: 100%;
        min-height: 46px;
        font-size: 0.95rem;
        box-sizing: border-box;
    }

        .btn.mini[b-gzngsi3ocj] {
            width: 100%;
        }

    /* ===== MODAL ===== */
    .rest-modal-backdrop[b-gzngsi3ocj] {
        padding: 10px;
        overflow: hidden;
        touch-action: none;
    }

    .rest-modal[b-gzngsi3ocj] {
        width: calc(100vw - 20px);
        max-width: calc(100vw - 20px);
        max-height: 85vh;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        box-sizing: border-box;
    }

    .rest-modal-msg[b-gzngsi3ocj] {
        font-size: 0.95rem;
        max-height: 60vh;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* ===== BLOQUEAR SCROLL HORIZONTAL ===== */
    html[b-gzngsi3ocj], body[b-gzngsi3ocj] {
        overflow-x: hidden;
    }

    .rest-card *[b-gzngsi3ocj],
    .rest-modal *[b-gzngsi3ocj],
    .ms-panel *[b-gzngsi3ocj] {
        box-sizing: border-box;
        max-width: 100%;
        min-width: 0;
    }

    .ms-root[b-gzngsi3ocj] {
        width: 100%;
        min-width: 0;
    }

    .ms-root[b-gzngsi3ocj],
    .ms-btn[b-gzngsi3ocj],
    .ms-panel[b-gzngsi3ocj],
    .ms-top[b-gzngsi3ocj],
    .ms-list[b-gzngsi3ocj],
    .ms-item[b-gzngsi3ocj],
    .ms-footer[b-gzngsi3ocj] {
        max-width: 100%;
        min-width: 0;
    }

    .ms-root[b-gzngsi3ocj] {
        position: relative;
    }

        .ms-root[b-gzngsi3ocj]::before {
            content: "";
            position: fixed;
            inset: 0;
            background: rgba(15, 23, 42, 0.40);
            z-index: 2999;
            opacity: 0;
            pointer-events: none;
            transition: opacity .12s ease;
        }

        .ms-root:has(.ms-panel)[b-gzngsi3ocj]::before {
            opacity: 1;
            pointer-events: auto;
        }

    .ms-panel[b-gzngsi3ocj] {
        overscroll-behavior: contain;
        touch-action: pan-y;
    }

    .ms-btn[b-gzngsi3ocj],
    .ms-panel[b-gzngsi3ocj],
    .ms-top[b-gzngsi3ocj],
    .ms-list[b-gzngsi3ocj],
    .ms-item[b-gzngsi3ocj],
    .ms-footer[b-gzngsi3ocj] {
        position: relative;
    }

        .ms-panel *[b-gzngsi3ocj] {
            position: relative;
            z-index: 1;
        }

    html[b-gzngsi3ocj],
    body[b-gzngsi3ocj] {
        overflow-x: hidden;
    }

        body:has(.ms-panel)[b-gzngsi3ocj] {
            overflow: hidden;
            touch-action: none;
            position: fixed;
            width: 100%;
        }

    .rest-wrap:has(.ms-panel)[b-gzngsi3ocj],
    .rest-card:has(.ms-panel)[b-gzngsi3ocj] {
        overflow: visible;
    }
}

/* =========================================================
   MEJORAS VISUALES - RESTRICCIONES
   ========================================================= */

.rest-card[b-gzngsi3ocj] {
    border-radius: 18px;
    border: 1px solid #dce8f8;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .06);
    padding: 20px 22px;
}

.card-title[b-gzngsi3ocj] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 1.42rem;
    margin-bottom: 6px;
}

.card-subtitle[b-gzngsi3ocj] {
    font-size: 1rem;
    color: #52627b;
    margin-bottom: 18px;
}

/* Grid más equilibrado */
.filtros[b-gzngsi3ocj] {
    grid-template-columns: 220px 220px minmax(180px, 240px) minmax(180px, 240px) minmax(180px, 240px) minmax(180px, 240px);
    column-gap: 14px;
    row-gap: 16px;
    align-items: start;
}

/* Fecha */
.fecha-top[b-gzngsi3ocj] {
    grid-column: 1 / span 3;
    grid-row: 1;
}

.fecha-barra[b-gzngsi3ocj] {
    display: flex;
    align-items: end;
    gap: 12px;
    flex-wrap: wrap;
}

.fecha-box[b-gzngsi3ocj] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.fecha-mini-label[b-gzngsi3ocj] {
    font-size: .95rem;
    font-weight: 800;
    color: #37506f;
    letter-spacing: .2px;
}

.fecha-sep[b-gzngsi3ocj] {
    align-self: center;
    margin-top: 24px;
    font-weight: 900;
    font-size: 1.1rem;
    color: #6782a3;
}

.fecha-date[b-gzngsi3ocj] {
    min-width: 190px;
}

.fecha-box[b-gzngsi3ocj]  .sl-date-wrap.sl-date-field-compact {
    width: 100%;
    min-width: 190px;
}

.fecha-box[b-gzngsi3ocj]  .sl-date-wrap input.sl-date-input.cg-date-input,
.fecha-box[b-gzngsi3ocj]  .sl-date-wrap input.sl-date-input.fecha-date {
    min-height: 48px;
    height: 48px;
    width: 100%;
    border: 1px solid #cfe0f5;
    border-radius: 12px;
    padding: 8px 12px;
    font-size: 1.08rem;
    font-weight: 900;
    color: #153e75;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    box-shadow: 0 2px 8px rgba(15, 23, 42, .04);
    font-family: inherit;
}

.fecha-hoy-btn[b-gzngsi3ocj] {
    min-height: 48px;
    padding: 0 14px !important;
}

/* Selectores más compactos */
.vendedor-fijo[b-gzngsi3ocj] {
    grid-column: 1 / span 2;
    grid-row: 2;
}

.sorteo-fijo[b-gzngsi3ocj] {
    grid-column: 3 / span 2;
    grid-row: 2;
}

.tipo-fijo[b-gzngsi3ocj] {
    grid-column: 1 / span 2;
    grid-row: 3;
}

.slot-centro[b-gzngsi3ocj] {
    grid-column: 3 / span 4;
    grid-row: 3;
}

.ms-btn.ms-btn-compact[b-gzngsi3ocj] {
    min-height: 58px;
    height: auto;
    padding: 10px 14px;
    border-radius: 14px;
    border: 1px solid #cfe0f5;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    box-shadow: 0 4px 12px rgba(15, 23, 42, .05);
}

    .ms-btn.ms-btn-compact:hover[b-gzngsi3ocj] {
        border-color: #95bdf0;
        background: linear-gradient(180deg, #ffffff 0%, #f2f8ff 100%);
    }

.ms-btn-meta[b-gzngsi3ocj] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    min-width: 0;
}

.ms-btn-label[b-gzngsi3ocj] {
    font-size: .78rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #6a7f9d;
}

.ms-btn-text[b-gzngsi3ocj] {
    font-size: 1.02rem;
    font-weight: 900;
    color: #143e75;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ms-caret[b-gzngsi3ocj] {
    font-size: 1rem;
    color: #5d7392;
}

.ms-panel[b-gzngsi3ocj] {
    border-radius: 16px;
    border: 1px solid #d9e5f5;
    box-shadow: 0 18px 40px rgba(15, 23, 42, .18);
    overflow: hidden;
}

.ms-top[b-gzngsi3ocj] {
    padding: 12px 14px;
    background: linear-gradient(180deg, #f8fbff 0%, #f1f6ff 100%);
}

.ms-check[b-gzngsi3ocj] {
    font-size: .98rem;
    color: #153e75;
}

.ms-list[b-gzngsi3ocj] {
    padding: 10px;
    max-height: 260px;
}

.ms-item[b-gzngsi3ocj] {
    border: 1px solid transparent;
    border-radius: 12px;
    min-height: 42px;
}

    .ms-item:hover[b-gzngsi3ocj] {
        background: #f3f8ff;
        border-color: #dbe9fb;
    }

.ms-item-text[b-gzngsi3ocj] {
    font-size: .98rem;
    font-weight: 800;
    color: #183f6f;
}

.ms-empty[b-gzngsi3ocj] {
    padding: 12px 10px;
    color: #64748b;
    font-style: normal;
}

.ms-footer[b-gzngsi3ocj] {
    padding: 10px 12px;
    background: #fbfdff;
}



/* Campos generales */
.campo > label[b-gzngsi3ocj] {
    font-size: 1rem;
    font-weight: 900;
    color: #233b5d;
}

.input-money span[b-gzngsi3ocj],
.input-percent span[b-gzngsi3ocj] {
    min-width: 40px;
    justify-content: center;
    border-radius: 10px;
    background: #eef5ff;
}

/* Números */
.numeros-editor[b-gzngsi3ocj] {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid #edf3fb;
}

    .numeros-editor > label[b-gzngsi3ocj] {
        display: inline-block;
        margin-bottom: 10px;
        font-size: 1rem;
        font-weight: 900;
        color: #233b5d;
    }

.chips-input input[b-gzngsi3ocj] {
    min-width: 340px;
    min-height: 46px;
    border-radius: 12px;
    border: 1px solid #cfe0f5;
    background: #fff;
}

.chip[b-gzngsi3ocj] {
    border-radius: 999px;
    padding: 7px 14px;
    font-size: 1.05rem;
    background: linear-gradient(180deg, #eef7ff 0%, #e2f0ff 100%);
    border: 1px solid #b7d4f3;
    color: #c62828;
}

/* Botones finales */
.acciones[b-gzngsi3ocj] {
    margin-top: 18px;
    gap: 10px;
}

.btn[b-gzngsi3ocj] {
    border-radius: 12px;
    min-height: 44px;
    transition: all .15s ease;
}

    .btn:hover[b-gzngsi3ocj] {
        transform: translateY(-1px);
    }

/* Responsive */
@media (max-width: 1200px) {
    .filtros[b-gzngsi3ocj] {
        grid-template-columns: repeat(2, minmax(220px, 1fr));
    }

    .fecha-top[b-gzngsi3ocj],
    .vendedor-fijo[b-gzngsi3ocj],
    .sorteo-fijo[b-gzngsi3ocj],
    .tipo-fijo[b-gzngsi3ocj],
    .slot-centro[b-gzngsi3ocj] {
        grid-column: auto;
        grid-row: auto;
    }
}

@media (max-width: 720px) {
    .filtros[b-gzngsi3ocj] {
        grid-template-columns: 1fr;
    }

    .fecha-barra[b-gzngsi3ocj] {
        flex-direction: column;
        align-items: stretch;
    }

    .fecha-sep[b-gzngsi3ocj] {
        display: none;
    }

    .fecha-date[b-gzngsi3ocj] {
        width: 100%;
        min-width: 0;
    }

    .ms-btn.ms-btn-compact[b-gzngsi3ocj] {
        min-height: 54px;
    }

    .chips-input input[b-gzngsi3ocj] {
        min-width: 0;
        width: 100%;
    }
}

/* =========================================================
   AVISO FLOTANTE PREMIUM - SELECCIÓN COMBINADA
   ========================================================= */

.rest-floating-modal-backdrop[b-gzngsi3ocj] {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(15, 23, 42, 0.38);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}

.rest-floating-modal[b-gzngsi3ocj] {
    width: 100%;
    display: flex;
    justify-content: center;
}

.rest-floating-alert[b-gzngsi3ocj] {
    display: flex;
    align-items: center;
    gap: 14px;
    width: min(720px, 100%);
    min-height: 84px;
    padding: 18px 18px;
    border-radius: 20px;
    border: 1px solid transparent;
    background: linear-gradient(180deg, #fffdf9 0%, #fff7ed 100%);
    box-shadow: 0 24px 60px rgba(15, 23, 42, .20), 0 10px 24px rgba(15, 23, 42, .10), 0 2px 8px rgba(15, 23, 42, .05);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}
.rest-floating-alert-warn[b-gzngsi3ocj] {
    border-color: #fdba74;
}

.rest-floating-icon[b-gzngsi3ocj] {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: linear-gradient(180deg, #ffedd5 0%, #fed7aa 100%);
    border: 1px solid #fdba74;
    color: #c2410c;
    font-weight: 900;
    font-size: 1.15rem;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.55);
}

.rest-floating-content[b-gzngsi3ocj] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.rest-floating-title[b-gzngsi3ocj] {
    color: #9a3412;
    font-weight: 900;
    font-size: 1.08rem;
    line-height: 1.15;
}

.rest-floating-text[b-gzngsi3ocj] {
    color: #b45309;
    font-size: 1rem;
    line-height: 1.45;
    word-break: break-word;
}

.rest-floating-btn[b-gzngsi3ocj] {
    margin-left: auto;
    flex: 0 0 auto;
    min-height: 42px;
    padding: 0 16px;
    border-radius: 12px;
    border: 1px solid #f59e0b;
    background: linear-gradient(180deg, #ffffff 0%, #fff7ed 100%);
    color: #92400e;
    font-weight: 900;
    font-size: 1rem;
    cursor: pointer;
    transition: all .15s ease;
    box-shadow: 0 2px 8px rgba(245, 158, 11, .10);
}
    .rest-floating-btn:hover[b-gzngsi3ocj] {
        transform: translateY(-1px);
        background: linear-gradient(180deg, #fffaf3 0%, #ffefdb 100%);
        border-color: #d97706;
    }

    .rest-floating-btn:active[b-gzngsi3ocj] {
        transform: translateY(0);
    }

/* Móvil */
@media (max-width: 720px) {
    .rest-floating-modal-backdrop[b-gzngsi3ocj] {
        padding: 14px;
        align-items: center;
        justify-content: center;
    }

    .rest-floating-alert[b-gzngsi3ocj] {
        width: 100%;
        max-width: 100%;
        align-items: flex-start;
        flex-wrap: wrap;
        padding: 16px 14px;
        border-radius: 16px;
    }

    .rest-floating-content[b-gzngsi3ocj] {
        flex: 1 1 220px;
    }

    .rest-floating-btn[b-gzngsi3ocj] {
        margin-left: 56px;
        margin-top: 6px;
    }
}
/* _content/SistemaLoteriaDashboard/Components/Banca/RifasConfigTab.razor.rz.scp.css */
/* ===== Misma base visual que SorteosTab ===== */

.rifas-tab .card[b-x2nqp5jvlx] {
    background: #fff;
    border: 1px solid #e6edf8;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    overflow: visible;
}

.rifas-tab .card-titulo[b-x2nqp5jvlx] {
    font-weight: 900;
    font-size: 1.35rem;
    color: #153e75;
    margin-bottom: 12px;
}

.rifas-intro[b-x2nqp5jvlx] {
    margin: 0 0 14px;
    font-size: 1.02rem;
    line-height: 1.5;
    color: #4a5f7a;
}

.rifas-tab .acciones[b-x2nqp5jvlx] {
    display: flex;
    gap: 10px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

.rifas-acciones-principales .btn[b-x2nqp5jvlx] {
    min-height: 44px;
}

.rifas-tab .btn[b-x2nqp5jvlx] {
    background: #0d47a1;
    color: #fff;
    border: none;
    padding: 11px 18px;
    border-radius: 8px;
    font-weight: 700;
    cursor: pointer;
    transition: 0.15s;
    font-size: 1.05rem;
    min-height: 44px;
}

.rifas-tab .btn:hover[b-x2nqp5jvlx] {
    filter: brightness(0.95);
}

.rifas-tab .btn-secondary[b-x2nqp5jvlx] {
    background: #6b84a8;
    color: #fff;
}

.rifas-tab .btn-danger[b-x2nqp5jvlx] {
    background: #e53935;
    color: #fff;
}

.rifas-tab .btn-small[b-x2nqp5jvlx] {
    padding: 9px 14px;
    font-weight: 600;
    border-radius: 7px;
    font-size: 1rem;
    min-height: 40px;
}

.rifas-tab .btn:disabled[b-x2nqp5jvlx] {
    opacity: 0.6;
    cursor: not-allowed;
}

.rifas-lista-titulo[b-x2nqp5jvlx] {
    font-size: 1.15rem;
    font-weight: 800;
    color: #153e75;
    margin-bottom: 10px;
}

.rifas-contador[b-x2nqp5jvlx] {
    display: inline-block;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 0.9rem;
    padding: 2px 10px;
    border-radius: 999px;
    margin-left: 6px;
    vertical-align: middle;
}

.rifas-tab .tabla[b-x2nqp5jvlx] {
    border: 1px solid #e6edf8;
    border-radius: 10px;
    overflow: hidden;
}

.rifas-tab .tabla-header:not(.tabla-rifas-header-ext)[b-x2nqp5jvlx],
.rifas-tab .tabla-body .fila:not(.tabla-rifas-fila-ext)[b-x2nqp5jvlx] {
    display: grid;
    gap: 0;
}

.rifas-tab .tabla-header[b-x2nqp5jvlx] {
    background: #f4f8ff;
    color: #123a6c;
    font-weight: 800;
    border-bottom: 1px solid #e6edf8;
    font-size: 1.05rem;
}

.rifas-tab .tabla-header > div[b-x2nqp5jvlx],
.rifas-tab .tabla-body .fila > div[b-x2nqp5jvlx] {
    padding: 12px 14px;
    border-right: 1px solid #eef3fb;
    font-size: 1.02rem;
    line-height: 1.4;
    align-content: center;
}

.rifas-tab .tabla-header > div:last-child[b-x2nqp5jvlx],
.rifas-tab .tabla-body .fila > div:last-child[b-x2nqp5jvlx] {
    border-right: none;
}

.rifas-tab .tabla-body .fila:nth-child(even)[b-x2nqp5jvlx] {
    background: #fcfeff;
}

.rifas-tab .fila-placeholder[b-x2nqp5jvlx] {
    padding: 18px;
    color: #6c7e97;
    font-style: italic;
    font-size: 1.02rem;
}

/* ===== Tabla HTML rifas activas (alineación fiable) ===== */
.rifas-tabla-wrap[b-x2nqp5jvlx] {
    width: 100%;
    overflow: visible;
    border: 1px solid #e6edf8;
    border-radius: 10px;
    background: #fff;
    padding-top: 8px;
    padding-bottom: 8px;
}

.rifas-tabla-activas[b-x2nqp5jvlx] {
    width: 100%;
    min-width: 1020px;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
    position: relative;
}

.rifas-tabla-activas col.rt-col-id[b-x2nqp5jvlx] { width: 38px; }
.rifas-tabla-activas col.rt-col-premio[b-x2nqp5jvlx] { width: 20%; }
.rifas-tabla-activas col.rt-col-sorteos[b-x2nqp5jvlx] { width: 118px; }
.rifas-tabla-activas col.rt-col-ventas[b-x2nqp5jvlx] { width: 96px; }
.rifas-tabla-activas col.rt-col-com-monto[b-x2nqp5jvlx] { width: 88px; }
.rifas-tabla-activas col.rt-col-com[b-x2nqp5jvlx] { width: 52px; }
.rifas-tabla-activas col.rt-col-mrifa[b-x2nqp5jvlx] { width: 84px; }
.rifas-tabla-activas col.rt-col-mnum[b-x2nqp5jvlx] { width: 98px; }
.rifas-tabla-activas col.rt-col-gan[b-x2nqp5jvlx] { width: 102px; }
.rifas-tabla-activas col.rt-col-fecha[b-x2nqp5jvlx] { width: 92px; }
.rifas-tabla-activas col.rt-col-vend[b-x2nqp5jvlx] { width: 118px; }
.rifas-tabla-activas col.rt-col-acc[b-x2nqp5jvlx] { width: 44px; }

.rifas-tabla-activas thead th[b-x2nqp5jvlx] {
    background: #f4f8ff;
    color: #123a6c;
    font-size: 0.84rem;
    font-weight: 800;
    text-align: center;
    padding: 11px 8px;
    border-bottom: 1px solid #dce7fb;
    border-right: 1px solid #eef3fb;
    white-space: nowrap;
    vertical-align: middle;
}

.rifas-tabla-activas thead th:last-child[b-x2nqp5jvlx] {
    border-right: none;
}

.rifas-tabla-activas tbody td[b-x2nqp5jvlx] {
    padding: 10px 8px;
    border-bottom: 1px solid #eef3fb;
    border-right: 1px solid #eef3fb;
    font-size: 0.94rem;
    line-height: 1.3;
    vertical-align: middle;
    text-align: center;
    color: #1e3a5f;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rifas-tabla-activas tbody td:last-child[b-x2nqp5jvlx] {
    border-right: none;
}

.rifas-tabla-activas tbody tr:nth-child(even)[b-x2nqp5jvlx] {
    background: #fcfeff;
}

.rifas-tabla-activas tbody tr:hover[b-x2nqp5jvlx] {
    background: #f5f9ff;
}

.rifas-tabla-activas tbody tr:has(details[open])[b-x2nqp5jvlx] {
    position: relative;
    z-index: 500;
}

.rifas-tabla-activas tbody tr:has(details[open]) td[b-x2nqp5jvlx] {
    position: relative;
    z-index: 501;
    overflow: visible !important;
    background: #ffffff;
}

.rifas-tabla-activas tbody tr:has(details[open]):nth-child(even) td[b-x2nqp5jvlx] {
    background: #fcfeff;
}

.rifas-tabla-empty[b-x2nqp5jvlx] {
    padding: 18px !important;
    text-align: center;
    color: #6c7e97;
    font-style: italic;
    white-space: normal !important;
}

.rt-td-id[b-x2nqp5jvlx] {
    text-align: center;
    font-weight: 800;
}

.rt-td-premio[b-x2nqp5jvlx] {
    white-space: nowrap;
    text-align: center;
}

.rt-td-premio .rifa-titulo-lista[b-x2nqp5jvlx] {
    display: inline;
    margin-right: 8px;
    max-width: none;
}

.rt-td-com[b-x2nqp5jvlx] {
    text-align: center;
    font-weight: 800;
}

.rt-td-num[b-x2nqp5jvlx] {
    text-align: center;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.rt-td-gan[b-x2nqp5jvlx] {
    text-align: center;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.rt-td-gan.rifa-resultado-ganancia[b-x2nqp5jvlx] {
    color: #166534;
}

.rt-td-gan.rifa-resultado-perdida[b-x2nqp5jvlx] {
    color: #b91c1c;
}

.rt-td-gan.rifa-resultado-pendiente[b-x2nqp5jvlx] {
    color: #64748b;
    font-weight: 800;
}

.rifa-filtro-sorteo[b-x2nqp5jvlx] {
    width: 100%;
    min-width: 140px;
    max-width: 220px;
    font-size: 0.85rem;
    padding: 6px 8px;
    border-radius: 10px;
}

.rt-td-gan.rifa-resultado-cero[b-x2nqp5jvlx] {
    color: #64748b;
}

.rt-td-fecha[b-x2nqp5jvlx] {
    text-align: center;
    font-weight: 700;
    color: #475569;
}

.rt-td-acc[b-x2nqp5jvlx] {
    text-align: center;
    overflow: visible !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
}

.rt-td-pop[b-x2nqp5jvlx] {
    overflow: visible !important;
}

.rt-td-sorteos[b-x2nqp5jvlx] {
    overflow: visible !important;
    white-space: normal;
    text-align: center;
}

.rt-td-vend[b-x2nqp5jvlx] {
    max-width: 118px;
}

.rifa-titulo-lista[b-x2nqp5jvlx] {
    flex: 1 1 auto;
    display: block;
    font-size: 0.96rem;
    font-weight: 700;
    color: #0f2a4d;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.rifa-ventas-inline[b-x2nqp5jvlx] {
    flex: 0 0 auto;
    font-size: 0.82rem;
    font-weight: 700;
    color: #475569;
    background: #eef4ff;
    border: 1px solid #dbeafe;
    border-radius: 6px;
    padding: 3px 8px;
    white-space: nowrap;
}

.rifa-celda-sorteos[b-x2nqp5jvlx] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.rt-td-sorteos .rifa-chip-unico[b-x2nqp5jvlx] {
    display: inline-block;
    max-width: none;
    overflow: visible;
    text-overflow: clip;
    white-space: nowrap;
}

.rifa-sorteos-drop[b-x2nqp5jvlx] {
    position: relative;
    display: inline-block;
    max-width: 100%;
    text-align: left;
}

.rifa-sorteos-drop-btn[b-x2nqp5jvlx] {
    list-style: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 4px 8px;
    border-radius: 8px;
    border: 1px solid rgba(30, 64, 175, 0.2);
    background: linear-gradient(180deg, #ffffff, #eef4ff);
    font-size: 0.8rem;
    font-weight: 800;
    color: #1e40af;
    white-space: nowrap;
}

.rifa-sorteos-drop-btn[b-x2nqp5jvlx]::-webkit-details-marker {
    display: none;
}

.rifa-sorteos-drop-panel[b-x2nqp5jvlx] {
    position: absolute;
    top: auto;
    bottom: calc(100% + 6px);
    left: 50%;
    transform: translateX(-50%);
    z-index: 10050;
    min-width: 180px;
    max-width: 280px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.14);
    border-radius: 10px;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.22);
    padding: 6px 0;
}

.rifa-sorteos-drop-item[b-x2nqp5jvlx] {
    padding: 7px 12px;
    font-size: 0.86rem;
    font-weight: 600;
    color: #1e40af;
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
    white-space: nowrap;
}

.rifa-sorteos-drop-item:last-child[b-x2nqp5jvlx] {
    border-bottom: none;
}


.rifa-vendedores-text[b-x2nqp5jvlx] {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.9rem;
    font-weight: 700;
    color: #1e3a5f;
}

.rifa-vend-drop[b-x2nqp5jvlx] {
    position: relative;
    display: block;
}

.rifa-vend-drop-btn[b-x2nqp5jvlx] {
    list-style: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    max-width: 100%;
    padding: 4px 8px;
    border-radius: 8px;
    border: 1px solid rgba(37, 99, 235, 0.22);
    background: linear-gradient(180deg, #ffffff, #eef4ff);
    font-size: 0.82rem;
    font-weight: 800;
    color: #1d4ed8;
    white-space: nowrap;
}

.rifa-vend-drop-btn[b-x2nqp5jvlx]::-webkit-details-marker {
    display: none;
}

.rifa-vend-drop-label[b-x2nqp5jvlx] {
    overflow: hidden;
    text-overflow: ellipsis;
}

.rifa-vend-drop-arrow[b-x2nqp5jvlx] {
    flex: 0 0 auto;
    font-size: 0.72rem;
    line-height: 1;
}

.rifa-vend-drop[open] .rifa-vend-drop-arrow[b-x2nqp5jvlx] {
    transform: rotate(180deg);
}

.rifa-vend-drop-panel[b-x2nqp5jvlx] {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 10050;
    min-width: 160px;
    max-width: 260px;
    max-height: 220px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 10px;
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.18);
    padding: 6px 0;
}

.rifa-vend-drop-item[b-x2nqp5jvlx] {
    padding: 8px 12px;
    font-size: 0.88rem;
    font-weight: 600;
    color: #1e3a5f;
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rifa-vend-drop-item:last-child[b-x2nqp5jvlx] {
    border-bottom: none;
}

.rifa-col-acciones[b-x2nqp5jvlx] {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible;
    padding: 4px 2px !important;
}

.btn-rifa-gear[b-x2nqp5jvlx] {
    width: 30px;
    height: 30px;
    min-width: 30px;
    min-height: 30px;
    padding: 0;
    border: 1px solid rgba(13, 71, 161, 0.25);
    border-radius: 8px;
    background: linear-gradient(180deg, #ffffff, #eef4ff);
    color: #0d47a1;
    font-size: 1.05rem;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.12s ease, box-shadow 0.12s ease;
}

.btn-rifa-gear:hover[b-x2nqp5jvlx] {
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(15, 23, 42, 0.12);
}

.rifa-celda-monto[b-x2nqp5jvlx] {
    font-weight: 800;
    color: #1e3a5f;
    font-size: 0.92rem;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.rifa-celda-resultado[b-x2nqp5jvlx] {
    font-weight: 900;
    font-size: 0.9rem;
    line-height: 1.2;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.rifa-resultado-ganancia[b-x2nqp5jvlx] {
    color: #166534;
}

.rifa-resultado-perdida[b-x2nqp5jvlx] {
    color: #b91c1c;
}

.rifa-resultado-cero[b-x2nqp5jvlx] {
    color: #64748b;
}


.rifa-detalle-linea[b-x2nqp5jvlx] {
    font-size: 0.98rem;
    color: #475569;
}

.rifa-etq[b-x2nqp5jvlx] {
    font-weight: 700;
    color: #1e3a5f;
}

.rifa-chip-sorteo[b-x2nqp5jvlx] {
    display: inline-block;
    background: #eef4ff;
    border: 1px solid #cfe0fb;
    color: #1e40af;
    border-radius: 5px;
    padding: 3px 7px;
    margin: 0;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.2;
}

.rifa-sin-dato[b-x2nqp5jvlx] {
    color: #94a3b8;
}

.rifas-error-box p[b-x2nqp5jvlx] {
    margin: 0 0 12px;
    color: #7f1d1d;
}

/* ===== MODAL (igual que Sorteos / Usuarios) ===== */

.modal-backdrop[b-x2nqp5jvlx] {
    position: fixed;
    inset: 0;
    background: rgba(6, 24, 61, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2000;
    padding: 16px;
    box-sizing: border-box;
}

.modal-dialog[b-x2nqp5jvlx] {
    background: #ffffff;
    border-radius: 14px;
    box-shadow: 0 18px 45px rgba(15, 35, 70, 0.35);
    animation: rifasModalFadeIn-b-x2nqp5jvlx 0.18s ease-out;
    border: 1px solid #dce7fb;
    width: 100%;
}

.rifas-modal.modal-dialog[b-x2nqp5jvlx] {
    overflow: visible;
}

.modal-dialog.modal-xl[b-x2nqp5jvlx],
.rifas-modal.modal-xl[b-x2nqp5jvlx] {
    width: min(1140px, 96vw);
    max-width: 96vw;
    max-height: 92vh;
    display: flex;
    flex-direction: column;
}

.modal-header[b-x2nqp5jvlx] {
    padding: 14px 20px;
    border-bottom: 1px solid #e4ecfa;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
}

.modal-header h3[b-x2nqp5jvlx] {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 800;
    color: #123a6c;
}

.modal-close[b-x2nqp5jvlx] {
    background: transparent;
    border: none;
    font-size: 1.4rem;
    font-weight: 800;
    cursor: pointer;
    color: #6b7a92;
    padding: 4px 10px;
    border-radius: 999px;
    line-height: 1;
}

.modal-close:hover[b-x2nqp5jvlx] {
    background: rgba(21, 62, 117, 0.08);
    color: #10294f;
}

.modal-body[b-x2nqp5jvlx] {
    padding: 16px 20px;
    overflow-y: auto;
    flex: 1 1 auto;
}

.modal-footer[b-x2nqp5jvlx] {
    padding: 12px 20px 16px;
    border-top: 1px solid #e4ecfa;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    flex-wrap: wrap;
    flex-shrink: 0;
}

.rifas-modal-footer .rifas-btn-footer[b-x2nqp5jvlx] {
    min-height: 46px;
    padding: 11px 20px;
    font-size: 1.05rem;
    font-weight: 700;
    border-radius: 8px;
    border: none;
    cursor: pointer;
}

.rifas-modal-footer .btn[b-x2nqp5jvlx] {
    background: #0d47a1;
    color: #fff;
}

.rifas-modal-footer .btn-secondary[b-x2nqp5jvlx] {
    background: #6b84a8;
    color: #fff;
}

.rifas-modal-footer .btn-danger[b-x2nqp5jvlx] {
    background: #e53935;
    color: #fff;
}

.rifas-modal-footer .btn:disabled[b-x2nqp5jvlx] {
    opacity: 0.6;
    cursor: not-allowed;
}

@keyframes rifasModalFadeIn-b-x2nqp5jvlx {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.conf-modal-grid[b-x2nqp5jvlx] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    align-items: start;
}

.conf-card[b-x2nqp5jvlx] {
    background: #fff;
    border: 1px solid #e6edf8;
    border-radius: 12px;
    padding: 14px 16px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.conf-title[b-x2nqp5jvlx] {
    font-weight: 800;
    font-size: 1.12rem;
    color: #153e75;
    margin-bottom: 12px;
}

.form-row[b-x2nqp5jvlx] {
    display: grid;
    grid-template-columns: 200px 1fr;
    align-items: start;
    gap: 14px;
    margin-bottom: 16px;
    font-size: 1.05rem;
}

.form-row > label[b-x2nqp5jvlx] {
    font-weight: 700;
    color: #123a6c;
    font-size: 1.05rem;
    padding-top: 10px;
}

.rifa-field-col[b-x2nqp5jvlx] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.help[b-x2nqp5jvlx] {
    font-size: 0.96rem;
    color: #6c7e97;
    margin-top: 2px;
}

.rifa-help-block[b-x2nqp5jvlx] {
    display: block;
    margin: 0 0 12px;
}

.input[b-x2nqp5jvlx],
select.input[b-x2nqp5jvlx],
textarea.input[b-x2nqp5jvlx] {
    padding: 11px 13px;
    border: 1px solid #e2e8f5;
    border-radius: 10px;
    outline: none;
    font: inherit;
    font-size: 1.08rem;
    background: #f9fbff;
    border-color: #d5e2fb;
    box-shadow: inset 0 0 0 1px #e1e9f8;
    transition: box-shadow 0.15s, border-color 0.15s;
    width: 100%;
    box-sizing: border-box;
}

.input:focus[b-x2nqp5jvlx],
select.input:focus[b-x2nqp5jvlx],
textarea.input:focus[b-x2nqp5jvlx] {
    box-shadow: 0 0 0 3px rgba(21, 62, 117, 0.12), inset 0 0 0 1px #c7d7fb;
    border-color: #c1d4ff;
}

.rifa-input-full[b-x2nqp5jvlx] {
    max-width: 100%;
}

.rifa-input-comision[b-x2nqp5jvlx] {
    max-width: 160px;
}

.rifa-textarea[b-x2nqp5jvlx] {
    min-height: 88px;
    resize: vertical;
    line-height: 1.45;
}

.rifa-select-sorteo[b-x2nqp5jvlx] {
    max-width: 100%;
    font-weight: 600;
}

.rifas-modal-body[b-x2nqp5jvlx] {
    max-height: 75vh;
    overflow-y: auto;
    overflow-x: hidden;
}

.rifa-card-izq .form-row:last-of-type[b-x2nqp5jvlx] {
    margin-bottom: 0;
}

.rifa-vendedores-block[b-x2nqp5jvlx] {
    margin-top: 10px;
    padding-top: 12px;
    border-top: 1px solid #e6edf8;
}

.rifa-vendedores-titulo[b-x2nqp5jvlx] {
    margin-bottom: 8px;
    font-size: 1.05rem;
}

.rifa-form-row-compact[b-x2nqp5jvlx] {
    margin-bottom: 10px;
}

.rifa-form-row-full[b-x2nqp5jvlx] {
    grid-template-columns: 200px 1fr;
}

.rifa-vendor-select-root[b-x2nqp5jvlx] {
    width: 100%;
}

.rifa-vendor-select-btn[b-x2nqp5jvlx] {
    width: 100%;
    min-height: 52px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid rgba(120, 150, 205, 0.85);
    background: linear-gradient(180deg, #ffffff, #f7fbff);
    border-radius: 12px;
    padding: 10px 14px;
    cursor: pointer;
    font: inherit;
}

.rifa-vendor-select-btn:hover[b-x2nqp5jvlx] {
    box-shadow: 0 8px 16px rgba(16, 60, 120, 0.1);
}

.rifa-vs-left[b-x2nqp5jvlx] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    text-align: left;
    overflow: hidden;
}

.rifa-vs-title[b-x2nqp5jvlx] {
    font-weight: 800;
    font-size: 1.05rem;
    color: #123a74;
}

.rifa-vs-sub[b-x2nqp5jvlx] {
    font-weight: 600;
    font-size: 0.95rem;
    color: #52627a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rifa-vs-arrow[b-x2nqp5jvlx] {
    font-weight: 800;
    color: #0d47a1;
    font-size: 1rem;
    margin-left: 12px;
}

/* Panel desplegable en flujo (no absolute): no lo recorta el modal */
.rifa-vendor-panel[b-x2nqp5jvlx] {
    margin-top: 8px;
    width: 100%;
    background: #fff;
    border: 1px solid #b8c9e8;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(15, 35, 70, 0.12);
    padding: 12px;
    box-sizing: border-box;
}

.rifa-vendor-toolbar[b-x2nqp5jvlx] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.rifa-chk-todos[b-x2nqp5jvlx] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 800;
    color: #123a74;
    font-size: 1rem;
    white-space: nowrap;
}

.rifa-chk-todos input[b-x2nqp5jvlx] {
    width: 18px;
    height: 18px;
    accent-color: #2563eb;
}

.rifa-vendor-buscar[b-x2nqp5jvlx] {
    flex: 1 1 180px;
    min-width: 160px;
}

.rifa-vendor-list[b-x2nqp5jvlx] {
    /* ~6 vendedores visibles; el resto con scroll */
    max-height: 270px;
    min-height: 0;
    overflow-y: auto;
    border: 1px solid #c7d6ef;
    border-radius: 10px;
    background: #fafcff;
}

.rifa-vendor-item[b-x2nqp5jvlx] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 12px;
    border-bottom: 1px solid #e8eef8;
    cursor: pointer;
    font-size: 1rem;
}

.rifa-vendor-item:last-child[b-x2nqp5jvlx] {
    border-bottom: none;
}

.rifa-vendor-item:hover[b-x2nqp5jvlx] {
    background: #f0f6ff;
}

.rifa-vendor-item.is-selected[b-x2nqp5jvlx] {
    background: #e8f1ff;
}

.rifa-vendor-item input[b-x2nqp5jvlx] {
    width: 18px;
    height: 18px;
    margin-top: 3px;
    accent-color: #2563eb;
    flex-shrink: 0;
}

.rifa-vendor-item-text[b-x2nqp5jvlx] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.rifa-vendor-item-name[b-x2nqp5jvlx] {
    font-weight: 700;
    color: #123a6c;
}

.rifa-vendor-item-full[b-x2nqp5jvlx] {
    font-size: 0.92rem;
    color: #64748b;
}

.rifa-vendor-item-id[b-x2nqp5jvlx] {
    font-size: 0.85rem;
    color: #94a3b8;
}

@media (max-width: 900px) {
    .conf-modal-grid[b-x2nqp5jvlx] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1100px) {
    .rifas-tabla-wrap[b-x2nqp5jvlx] {
        overflow-x: auto;
    }
}

@media (max-width: 700px) {
    .form-row[b-x2nqp5jvlx] {
        grid-template-columns: 1fr;
    }

    .form-row > label[b-x2nqp5jvlx] {
        padding-top: 0;
    }

    .rifas-tab .acciones .btn[b-x2nqp5jvlx] {
        width: 100%;
    }

    .rifas-modal-footer[b-x2nqp5jvlx] {
        flex-direction: column;
    }

    .rifas-modal-footer .rifas-btn-footer[b-x2nqp5jvlx] {
        width: 100%;
    }

    .modal-dialog.modal-xl[b-x2nqp5jvlx] {
        max-height: 95vh;
    }
}
/* _content/SistemaLoteriaDashboard/Components/Banca/RifasHistorialModal.razor.rz.scp.css */
/* ===== Modal historial rifas (alineado con Rifas / Banca) ===== */

.rifa-hist-backdrop[b-n5zl4z7trh] {
    position: fixed;
    inset: 0;
    z-index: 12000;
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 12px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
}

.rifa-hist-modal[b-n5zl4z7trh] {
    width: min(100%, 1100px);
    max-height: calc(100vh - 24px);
    margin: auto 0;
    background: #fff;
    border-radius: 14px;
    border: 1px solid #e6edf8;
    box-shadow: 0 24px 64px rgba(15, 23, 42, 0.28);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-sizing: border-box;
    font-size: 1rem;
}

.rifa-hist-header[b-n5zl4z7trh] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px;
    border-bottom: 1px solid #e6edf8;
    background: linear-gradient(180deg, #f4f8ff, #fff);
    flex-shrink: 0;
}

.rifa-hist-title[b-n5zl4z7trh] {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 900;
    color: #153e75;
}

.rifa-hist-sub[b-n5zl4z7trh] {
    margin: 6px 0 0;
    font-size: 0.95rem;
    color: #64748b;
    line-height: 1.45;
}

.rifa-hist-close[b-n5zl4z7trh] {
    border: none;
    background: #e2e8f0;
    color: #334155;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    flex-shrink: 0;
}

/* Toolbar filtros */
.rifa-hist-toolbar[b-n5zl4z7trh] {
    padding: 14px 20px 10px;
    border-bottom: 1px solid #eef3fb;
    background: #fcfeff;
    flex-shrink: 0;
}

.rifa-hist-form-row[b-n5zl4z7trh] {
    display: grid;
    grid-template-columns: 130px minmax(0, 1fr);
    gap: 10px 14px;
    align-items: center;
    margin-bottom: 12px;
}

.rifa-hist-form-row > label[b-n5zl4z7trh] {
    font-weight: 800;
    color: #123a6c;
    font-size: 0.98rem;
}

.rifa-hist-form-row .input[b-n5zl4z7trh],
.rifa-hist-form-row select.input[b-n5zl4z7trh] {
    width: 100%;
    min-height: 44px;
    border: 1px solid rgba(120, 150, 205, 0.85);
    border-radius: 10px;
    padding: 10px 12px;
    font-size: 1rem;
    box-sizing: border-box;
    background: #fff;
}

.rifa-hist-rango[b-n5zl4z7trh] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
}

.rifa-hist-rango-sep[b-n5zl4z7trh] {
    font-weight: 700;
    color: #64748b;
    padding: 0 2px;
}

.rifa-hist-toolbar[b-n5zl4z7trh]  .sl-date-wrap.sl-date-field-compact {
    flex: 1 1 140px;
    min-width: 130px;
    max-width: 200px;
}

.rifa-hist-toolbar[b-n5zl4z7trh]  .sl-date-wrap input.sl-date-input.cg-date-input {
    min-height: 44px;
    font-size: 1rem;
}

.rifa-hist-toolbar-grid[b-n5zl4z7trh] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 0 16px;
}

.rifa-hist-checks[b-n5zl4z7trh] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.rifa-hist-chk[b-n5zl4z7trh] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.95rem;
    color: #334155;
    cursor: pointer;
    font-weight: 600;
}

.rifa-hist-chk input[b-n5zl4z7trh] {
    width: 18px;
    height: 18px;
    accent-color: #2563eb;
    flex-shrink: 0;
}

.rifa-hist-chk-todos[b-n5zl4z7trh] {
    font-weight: 800;
    color: #123a74;
}

/* Selector vendedores (mismo patrón que programar rifa) */
.rifa-hist-vendor-root[b-n5zl4z7trh] {
    width: 100%;
    max-width: 520px;
}

.rifa-hist-vendor-btn[b-n5zl4z7trh] {
    width: 100%;
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid rgba(120, 150, 205, 0.85);
    background: linear-gradient(180deg, #ffffff, #f7fbff);
    border-radius: 12px;
    padding: 8px 14px;
    cursor: pointer;
    font: inherit;
    box-sizing: border-box;
}

.rifa-hist-vendor-btn:hover[b-n5zl4z7trh] {
    box-shadow: 0 6px 14px rgba(16, 60, 120, 0.1);
}

.rifa-hist-vendor-btn-text[b-n5zl4z7trh] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    text-align: left;
    min-width: 0;
    overflow: hidden;
}

.rifa-hist-vendor-btn-title[b-n5zl4z7trh] {
    font-weight: 800;
    font-size: 0.95rem;
    color: #123a74;
}

.rifa-hist-vendor-btn-sub[b-n5zl4z7trh] {
    font-weight: 600;
    font-size: 0.88rem;
    color: #52627a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rifa-hist-vendor-arrow[b-n5zl4z7trh] {
    font-weight: 800;
    color: #0d47a1;
    flex-shrink: 0;
}

.rifa-hist-vendor-panel[b-n5zl4z7trh] {
    margin-top: 8px;
    border: 1px solid #b8c9e8;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(15, 35, 70, 0.12);
    padding: 12px;
    box-sizing: border-box;
}

.rifa-hist-vendor-toolbar[b-n5zl4z7trh] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.rifa-hist-vendor-buscar[b-n5zl4z7trh] {
    flex: 1 1 160px;
    min-width: 140px;
    min-height: 42px;
}

.rifa-hist-vendor-list[b-n5zl4z7trh] {
    max-height: 220px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    border: 1px solid #c7d6ef;
    border-radius: 10px;
    background: #fafcff;
}

.rifa-hist-vendor-item[b-n5zl4z7trh] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 9px 12px;
    border-bottom: 1px solid #e8eef8;
    cursor: pointer;
}

.rifa-hist-vendor-item:last-child[b-n5zl4z7trh] {
    border-bottom: none;
}

.rifa-hist-vendor-item:hover[b-n5zl4z7trh] {
    background: #f0f6ff;
}

.rifa-hist-vendor-item.is-selected[b-n5zl4z7trh] {
    background: #e8f1ff;
}

.rifa-hist-vendor-item input[b-n5zl4z7trh] {
    width: 18px;
    height: 18px;
    margin-top: 3px;
    accent-color: #2563eb;
    flex-shrink: 0;
}

.rifa-hist-vendor-item-text[b-n5zl4z7trh] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.rifa-hist-vendor-name[b-n5zl4z7trh] {
    font-weight: 700;
    color: #123a6c;
    font-size: 0.95rem;
}

.rifa-hist-vendor-full[b-n5zl4z7trh] {
    font-size: 0.88rem;
    color: #64748b;
}

.rifa-hist-vendor-id[b-n5zl4z7trh] {
    font-size: 0.8rem;
    color: #94a3b8;
}

.rifa-hist-vendor-empty[b-n5zl4z7trh] {
    padding: 14px;
    color: #64748b;
    font-style: italic;
    text-align: center;
}

.rifa-hist-actions[b-n5zl4z7trh] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding-top: 4px;
}

.rifa-hist-modal .btn[b-n5zl4z7trh] {
    background: #0d47a1;
    color: #fff;
    border: none;
    padding: 11px 18px;
    border-radius: 8px;
    font-weight: 700;
    cursor: pointer;
    min-height: 44px;
    font-size: 1rem;
}

.rifa-hist-modal .btn-secondary[b-n5zl4z7trh] {
    background: #6b84a8;
    color: #fff;
}

.rifa-hist-modal .btn:disabled[b-n5zl4z7trh] {
    opacity: 0.6;
    cursor: not-allowed;
}

.rifa-hist-body[b-n5zl4z7trh] {
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    min-height: 0;
    padding-bottom: 8px;
}

.rifa-hist-error[b-n5zl4z7trh] {
    margin: 12px 20px;
    padding: 10px 12px;
    border-radius: 8px;
    background: #fef2f2;
    color: #b91c1c;
    border: 1px solid #fecaca;
}

.rifa-hist-summary[b-n5zl4z7trh] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 14px 20px;
}

.rifa-hist-chip[b-n5zl4z7trh] {
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 8px 12px;
    min-width: 96px;
}

.rifa-hist-chip .k[b-n5zl4z7trh] {
    display: block;
    font-size: 0.72rem;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.rifa-hist-chip strong[b-n5zl4z7trh] {
    font-size: 1rem;
    color: #0f172a;
}

.rifa-hist-chip-strong[b-n5zl4z7trh] {
    background: #eff6ff;
    border-color: #bfdbfe;
}

.rifa-hist-tabs[b-n5zl4z7trh] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0 20px 12px;
}

.rifa-hist-tab[b-n5zl4z7trh] {
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #334155;
    padding: 10px 16px;
    border-radius: 999px;
    font-weight: 700;
    cursor: pointer;
    min-height: 44px;
    font-size: 0.95rem;
}

.rifa-hist-tab.active[b-n5zl4z7trh] {
    background: #0d47a1;
    border-color: #0d47a1;
    color: #fff;
}

.rifa-hist-program-list[b-n5zl4z7trh],
.rifa-hist-events[b-n5zl4z7trh],
.rifa-hist-empty[b-n5zl4z7trh] {
    padding: 0 20px 16px;
}

.rifa-hist-program-list[b-n5zl4z7trh] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.rifa-hist-prog-card[b-n5zl4z7trh] {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 14px;
    background: #fafbff;
}

.rifa-hist-prog-top[b-n5zl4z7trh] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 10px;
}

.rifa-hist-prog-title[b-n5zl4z7trh] {
    font-size: 1.05rem;
    color: #153e75;
}

.rifa-hist-badge[b-n5zl4z7trh] {
    font-size: 0.75rem;
    font-weight: 800;
    padding: 4px 10px;
    border-radius: 999px;
    white-space: nowrap;
}

.rifa-hist-badge.activa[b-n5zl4z7trh] {
    background: #dcfce7;
    color: #166534;
}

.rifa-hist-badge.terminada[b-n5zl4z7trh] {
    background: #fee2e2;
    color: #991b1b;
}

.rifa-hist-prog-grid[b-n5zl4z7trh] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px 12px;
    font-size: 0.9rem;
}

.rifa-hist-prog-grid .lbl[b-n5zl4z7trh],
.rifa-hist-prog-tags .lbl[b-n5zl4z7trh] {
    display: block;
    font-size: 0.72rem;
    color: #64748b;
    font-weight: 700;
    text-transform: uppercase;
}

.rifa-hist-prog-tags[b-n5zl4z7trh] {
    margin-top: 10px;
    font-size: 0.88rem;
    color: #334155;
    line-height: 1.45;
}

/* Lista de eventos (sorteo/día) */
.rifa-hist-events[b-n5zl4z7trh] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.rifa-hist-event[b-n5zl4z7trh] {
    border: 1px solid #dce7fb;
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.rifa-hist-event.is-open[b-n5zl4z7trh] {
    border-color: #93c5fd;
    box-shadow: 0 4px 16px rgba(37, 99, 235, 0.12);
}

.rifa-hist-event-toggle[b-n5zl4z7trh] {
    width: 100%;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 12px 14px;
    border: none;
    background: #f8fafc;
    text-align: left;
    cursor: pointer;
    font: inherit;
    box-sizing: border-box;
}

.rifa-hist-event-toggle:hover[b-n5zl4z7trh] {
    background: #f1f5f9;
}

.rifa-hist-chevron[b-n5zl4z7trh] {
    width: 10px;
    height: 10px;
    border-right: 2.5px solid #0d47a1;
    border-bottom: 2.5px solid #0d47a1;
    transform: rotate(-45deg);
    transition: transform 0.2s ease;
    flex-shrink: 0;
    margin-top: -2px;
}

.rifa-hist-chevron.open[b-n5zl4z7trh] {
    transform: rotate(45deg);
    margin-top: 2px;
}

.rifa-hist-event-main[b-n5zl4z7trh] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.rifa-hist-event-line1[b-n5zl4z7trh] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.rifa-hist-event-date[b-n5zl4z7trh] {
    font-weight: 800;
    color: #153e75;
}

.rifa-hist-event-sorteo[b-n5zl4z7trh] {
    font-weight: 700;
    color: #334155;
}

.rifa-hist-pego[b-n5zl4z7trh] {
    font-size: 0.75rem;
    font-weight: 800;
    padding: 3px 8px;
    border-radius: 999px;
}

.rifa-hist-pego.si[b-n5zl4z7trh] {
    background: #dcfce7;
    color: #166534;
}

.rifa-hist-pego.no[b-n5zl4z7trh] {
    background: #f1f5f9;
    color: #64748b;
}

.rifa-hist-event-rifa[b-n5zl4z7trh] {
    font-size: 0.9rem;
    color: #475569;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rifa-hist-event-nums[b-n5zl4z7trh] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 16px;
    justify-content: flex-end;
}

.rifa-hist-event-kpi-inline[b-n5zl4z7trh] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 72px;
}

.rifa-hist-event-kpi-inline .lbl[b-n5zl4z7trh] {
    font-size: 0.68rem;
    font-weight: 700;
    color: #64748b;
    text-transform: uppercase;
}

.rifa-hist-event-kpi-inline strong[b-n5zl4z7trh] {
    font-size: 0.92rem;
    color: #0f172a;
}

.rifa-hist-event-body[b-n5zl4z7trh] {
    border-top: 1px solid #e2e8f0;
    background: #f8fafc;
    padding: 14px 16px;
}

/* Panel detalle (componente hijo) */
.rifa-hist-detail-panel[b-n5zl4z7trh] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    align-items: start;
}

.rifa-hist-detail-section[b-n5zl4z7trh] {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 12px 14px;
}

.rifa-hist-detail-wide[b-n5zl4z7trh] {
    grid-column: 1 / -1;
}

.rifa-hist-detail-heading[b-n5zl4z7trh] {
    margin: 0 0 10px;
    font-size: 0.92rem;
    font-weight: 800;
    color: #153e75;
}

.rifa-hist-kpi-grid[b-n5zl4z7trh] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.rifa-hist-kpi .lbl[b-n5zl4z7trh] {
    display: block;
    font-size: 0.68rem;
    font-weight: 700;
    color: #64748b;
    text-transform: uppercase;
    margin-bottom: 2px;
}

.rifa-hist-kpi .val[b-n5zl4z7trh] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #1e293b;
}

.rifa-hist-economico[b-n5zl4z7trh] {
    background: #f0f7ff;
    border-color: #bfdbfe;
}

.rifa-hist-econ-help[b-n5zl4z7trh] {
    margin: 0 0 12px;
    font-size: 0.88rem;
    color: #475569;
    line-height: 1.45;
}

.rifa-hist-econ-formula[b-n5zl4z7trh] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 10px;
}

.rifa-hist-econ-line[b-n5zl4z7trh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    font-size: 0.92rem;
    color: #334155;
}

.rifa-hist-econ-line strong[b-n5zl4z7trh] {
    font-size: 1rem;
}

.rifa-hist-econ-rest strong[b-n5zl4z7trh] {
    color: #b91c1c;
}

.rifa-hist-econ-total[b-n5zl4z7trh] {
    padding-top: 8px;
    margin-top: 4px;
    border-top: 1px dashed #cbd5e1;
    font-weight: 800;
}

.rifa-hist-econ-tags[b-n5zl4z7trh] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.rifa-hist-ganador-tag[b-n5zl4z7trh] {
    font-size: 0.82rem;
    font-weight: 700;
    color: #475569;
    padding: 4px 10px;
    background: #f1f5f9;
    border-radius: 999px;
}

.rifa-hist-mini-wrap[b-n5zl4z7trh] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.rifa-hist-mini-table[b-n5zl4z7trh] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88rem;
    min-width: 320px;
}

.rifa-hist-mini-table th[b-n5zl4z7trh],
.rifa-hist-mini-table td[b-n5zl4z7trh] {
    padding: 8px 10px;
    border-bottom: 1px solid #e2e8f0;
    text-align: left;
}

.rifa-hist-mini-table th[b-n5zl4z7trh] {
    background: #f1f5f9;
    font-weight: 800;
    color: #334155;
}

.rifa-hist-pos[b-n5zl4z7trh] { color: #15803d; font-weight: 800; }
.rifa-hist-neg[b-n5zl4z7trh] { color: #b91c1c; font-weight: 800; }
.rifa-hist-zero[b-n5zl4z7trh] { color: #64748b; font-weight: 800; }

.rifa-hist-empty[b-n5zl4z7trh] {
    padding: 24px;
    text-align: center;
    color: #64748b;
}

.rifa-hist-footer[b-n5zl4z7trh] {
    padding: 12px 20px;
    border-top: 1px solid #e2e8f0;
    display: flex;
    justify-content: flex-end;
    flex-shrink: 0;
    background: #fff;
}

@media (max-width: 900px) {
    .rifa-hist-toolbar-grid[b-n5zl4z7trh] {
        grid-template-columns: 1fr;
    }

    .rifa-hist-prog-grid[b-n5zl4z7trh] {
        grid-template-columns: 1fr 1fr;
    }

    .rifa-hist-detail-panel[b-n5zl4z7trh] {
        grid-template-columns: 1fr;
    }

    .rifa-hist-event-toggle[b-n5zl4z7trh] {
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-rows: auto auto;
    }

    .rifa-hist-event-nums[b-n5zl4z7trh] {
        grid-column: 1 / -1;
        justify-content: flex-start;
        padding-left: 22px;
    }
}

@media (max-width: 700px) {
    .rifa-hist-backdrop[b-n5zl4z7trh] {
        padding: 0;
        align-items: stretch;
    }

    .rifa-hist-modal[b-n5zl4z7trh] {
        width: 100%;
        max-height: 100vh;
        min-height: 100vh;
        border-radius: 0;
        margin: 0;
    }

    .rifa-hist-form-row[b-n5zl4z7trh] {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .rifa-hist-form-row > label[b-n5zl4z7trh] {
        padding-top: 0;
    }

    .rifa-hist-toolbar[b-n5zl4z7trh]  .sl-date-wrap.sl-date-field-compact {
        max-width: none;
        flex: 1 1 100%;
    }

    .rifa-hist-rango[b-n5zl4z7trh] {
        flex-direction: column;
        align-items: stretch;
    }

    .rifa-hist-rango-sep[b-n5zl4z7trh] {
        text-align: center;
    }

    .rifa-hist-vendor-root[b-n5zl4z7trh] {
        max-width: none;
    }

    .rifa-hist-actions .btn[b-n5zl4z7trh] {
        flex: 1 1 100%;
    }

    .rifa-hist-summary .rifa-hist-chip[b-n5zl4z7trh] {
        flex: 1 1 calc(50% - 8px);
        min-width: 0;
    }

    .rifa-hist-tabs[b-n5zl4z7trh] {
        flex-direction: column;
    }

    .rifa-hist-tab[b-n5zl4z7trh] {
        width: 100%;
        text-align: center;
    }

    .rifa-hist-prog-grid[b-n5zl4z7trh] {
        grid-template-columns: 1fr;
    }

    .rifa-hist-kpi-grid[b-n5zl4z7trh] {
        grid-template-columns: 1fr;
    }

    .rifa-hist-event-nums[b-n5zl4z7trh] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }

    .rifa-hist-event-kpi-inline[b-n5zl4z7trh] {
        min-width: 0;
    }
}
/* _content/SistemaLoteriaDashboard/Components/Banca/SaldosUsuariosBanca.razor.rz.scp.css */
body[b-y2gaznj17d] {
}

/* =========================================================
   SALDOS USUARIOS BANCA
   Diseño responsive + impresión
========================================================= */

.su-shell[b-y2gaznj17d] {
    background: radial-gradient(1200px 600px at 20% -10%, rgba(99,102,241,.18), transparent 60%), radial-gradient(900px 500px at 90% 0%, rgba(14,165,233,.14), transparent 55%), linear-gradient(180deg, #fbfcff 0%, #f3f7ff 100%);
    border: 1px solid rgba(148,163,184,.35);
    border-radius: 22px;
    box-shadow: 0 18px 40px rgba(15,23,42,.10);
    padding: 18px;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    box-sizing: border-box;
}

    .su-shell *[b-y2gaznj17d],
    .su-shell *[b-y2gaznj17d]::before,
    .su-shell *[b-y2gaznj17d]::after {
        box-sizing: border-box;
    }

.su-header[b-y2gaznj17d] {
    border-radius: 20px;
    padding: 18px;
    background: linear-gradient(135deg, #111827 0%, #1f2a44 45%, #0b1220 100%);
    box-shadow: 0 18px 36px rgba(0,0,0,.22);
    color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.su-title[b-y2gaznj17d] {
    font-size: 1.65rem;
    font-weight: 1000;
    line-height: 1.12;
}

.su-sub[b-y2gaznj17d] {
    margin-top: 4px;
    color: rgba(255,255,255,.78);
    font-weight: 850;
    line-height: 1.25;
}

.su-filters[b-y2gaznj17d] {
    margin-top: 14px;
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(148,163,184,.35);
    border-radius: 20px;
    padding: 14px;
    box-shadow: 0 14px 26px rgba(15,23,42,.08);
    display: flex;
    align-items: end;
    gap: 14px;
    flex-wrap: wrap;
}

.su-field[b-y2gaznj17d] {
    display: grid;
    gap: 6px;
    min-width: 180px;
}

    .su-field label[b-y2gaznj17d] {
        font-size: .95rem;
        font-weight: 1000;
        color: #0f172a;
    }

.su-date[b-y2gaznj17d] {
    height: 46px;
    width: 100%;
    border-radius: 16px;
    border: 1px solid rgba(148,163,184,.45);
    padding: 0 12px;
    outline: none;
    background: #ffffff;
    font-weight: 950;
    color: #0b1220;
    font-size: 16px;
    box-shadow: 0 10px 18px rgba(15,23,42,.06);
    -webkit-appearance: none;
    appearance: none;
}

    .su-date:focus[b-y2gaznj17d] {
        border-color: rgba(99,102,241,.85);
        box-shadow: 0 0 0 4px rgba(99,102,241,.18), 0 14px 24px rgba(15,23,42,.10);
    }

.su-btn[b-y2gaznj17d] {
    border: 0;
    border-radius: 16px;
    padding: 12px 16px;
    min-height: 46px;
    font-weight: 1000;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 1.02rem;
    color: #fff;
    background: linear-gradient(135deg, #6366f1 0%, #0ea5e9 100%);
    box-shadow: 0 16px 30px rgba(99,102,241,.22);
    user-select: none;
    white-space: nowrap;
}

    .su-btn:active[b-y2gaznj17d] {
        transform: translateY(1px);
    }

    .su-btn:disabled[b-y2gaznj17d] {
        opacity: .55;
        cursor: not-allowed;
        box-shadow: none;
    }

.su-btn-print[b-y2gaznj17d] {
    background: linear-gradient(135deg, #16a34a, #0f766e);
}

.su-alert[b-y2gaznj17d],
.su-empty[b-y2gaznj17d] {
    margin-top: 14px;
    padding: 14px;
    border-radius: 18px;
    font-weight: 950;
    background: #fff;
    border: 1px solid rgba(148,163,184,.35);
    box-shadow: 0 12px 22px rgba(15,23,42,.08);
}

.su-alert[b-y2gaznj17d] {
    color: #991b1b;
    background: linear-gradient(180deg, #fff5f5 0%, #ffffff 100%);
    border-color: rgba(239,68,68,.35);
}

.su-print-head[b-y2gaznj17d] {
    margin-top: 16px;
    padding: 14px 16px;
    border-radius: 18px;
    background: rgba(255,255,255,.9);
    border: 1px solid rgba(148,163,184,.35);
    box-shadow: 0 12px 22px rgba(15,23,42,.08);
}

.su-print-title[b-y2gaznj17d] {
    font-size: 1.25rem;
    font-weight: 1000;
    color: #0b1220;
    line-height: 1.15;
}

.su-print-sub[b-y2gaznj17d] {
    margin-top: 4px;
    font-weight: 900;
    color: #475569;
    line-height: 1.25;
}

.su-table-wrap[b-y2gaznj17d] {
    margin-top: 14px;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    border-radius: 18px;
    border: 1px solid rgba(148,163,184,.35);
    box-shadow: 0 14px 26px rgba(15,23,42,.08);
    scrollbar-gutter: stable;
}

.su-table[b-y2gaznj17d] {
    width: 100%;
    min-width: 760px;
    table-layout: auto;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
}

    .su-table thead th[b-y2gaznj17d] {
        padding: 12px;
        font-weight: 1000;
        text-align: left;
        font-size: 1rem;
        color: #0b1220;
        background: linear-gradient(135deg, #eef2ff 0%, #e0f2fe 60%, #f8fafc 100%);
        border-bottom: 1px solid rgba(148,163,184,.35);
        white-space: nowrap;
    }

    .su-table tbody td[b-y2gaznj17d] {
        padding: 12px;
        border-bottom: 1px solid rgba(226,232,240,.9);
        color: #0f172a;
        font-weight: 950;
        background: #fff;
        font-size: 1.02rem;
        white-space: nowrap;
    }

    .su-table tbody tr:nth-child(2n) td[b-y2gaznj17d] {
        background: #fbfdff;
    }

    .su-table tbody tr:hover td[b-y2gaznj17d] {
        background: #f1f5ff;
    }

    .su-table tfoot td[b-y2gaznj17d] {
        padding: 12px;
        font-weight: 1000;
        background: #0b1220;
        color: #fff;
        border-top: 1px solid rgba(255,255,255,.15);
        font-size: 1.05rem;
        white-space: nowrap;
    }

.num[b-y2gaznj17d] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.su-rol[b-y2gaznj17d] {
    display: inline-flex;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(59,130,246,.10);
    border: 1px solid rgba(59,130,246,.20);
    font-weight: 1000;
    color: #1d4ed8;
    white-space: nowrap;
}

.neg[b-y2gaznj17d] {
    color: #dc2626 !important;
}

.pos[b-y2gaznj17d] {
    color: #15803d !important;
}

/* =========================================================
   RESPONSIVE ANDROID / IPHONE / TABLET
========================================================= */

@media (max-width: 900px) {
    .su-shell[b-y2gaznj17d] {
        padding: 12px;
        border-radius: 18px;
    }

    .su-header[b-y2gaznj17d] {
        padding: 14px;
        border-radius: 16px;
        gap: 10px;
        align-items: stretch;
    }

    .su-title[b-y2gaznj17d] {
        font-size: 1.25rem;
    }

    .su-sub[b-y2gaznj17d] {
        font-size: .88rem;
    }

    .su-filters[b-y2gaznj17d] {
        padding: 12px;
        border-radius: 16px;
        gap: 10px;
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }

    .su-field[b-y2gaznj17d] {
        width: 100%;
        min-width: 0;
    }

    .su-date[b-y2gaznj17d] {
        width: 100%;
        min-width: 0;
        font-size: 16px;
    }

    .su-btn[b-y2gaznj17d] {
        width: 100%;
        min-height: 46px;
        font-size: .98rem;
    }

    .su-print-head[b-y2gaznj17d] {
        padding: 12px;
        border-radius: 16px;
    }

    .su-print-title[b-y2gaznj17d] {
        font-size: 1.08rem;
    }

    .su-print-sub[b-y2gaznj17d] {
        font-size: .88rem;
    }

    .su-table[b-y2gaznj17d] {
        min-width: 720px;
    }

        .su-table thead th[b-y2gaznj17d] {
            font-size: .88rem;
            padding: 10px 8px;
        }

        .su-table tbody td[b-y2gaznj17d] {
            font-size: .90rem;
            padding: 10px 8px;
        }

        .su-table tfoot td[b-y2gaznj17d] {
            font-size: .95rem;
            padding: 10px 8px;
        }

    .su-rol[b-y2gaznj17d] {
        font-size: .78rem;
        padding: 4px 8px;
    }
}

@media (max-width: 480px) {
    .su-shell[b-y2gaznj17d] {
        padding: 10px;
        border-radius: 16px;
    }

    .su-header[b-y2gaznj17d] {
        padding: 12px;
    }

    .su-title[b-y2gaznj17d] {
        font-size: 1.08rem;
    }

    .su-sub[b-y2gaznj17d] {
        font-size: .80rem;
    }

    .su-table[b-y2gaznj17d] {
        min-width: 680px;
    }

        .su-table thead th[b-y2gaznj17d],
        .su-table tbody td[b-y2gaznj17d],
        .su-table tfoot td[b-y2gaznj17d] {
            font-size: .82rem;
        }

    .su-alert[b-y2gaznj17d],
    .su-empty[b-y2gaznj17d] {
        padding: 12px;
        font-size: .90rem;
        border-radius: 14px;
    }
}

/* =========================================================
   IMPRESIÓN
========================================================= */

@media print {
    body *[b-y2gaznj17d] {
        visibility: hidden !important;
    }

    #suAreaImpresion[b-y2gaznj17d],
    #suAreaImpresion *[b-y2gaznj17d] {
        visibility: visible !important;
    }

    #suAreaImpresion[b-y2gaznj17d] {
        position: absolute !important;
        left: 0 !important;
        top: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        background: #fff !important;
        box-shadow: none !important;
        border: none !important;
        padding: 0 !important;
        overflow: visible !important;
    }

    .su-header[b-y2gaznj17d],
    .su-filters[b-y2gaznj17d],
    .su-btn[b-y2gaznj17d],
    .su-alert[b-y2gaznj17d],
    .su-empty[b-y2gaznj17d] {
        display: none !important;
    }

    .su-print-head[b-y2gaznj17d] {
        display: block !important;
        box-shadow: none !important;
        border: none !important;
        padding: 0 0 12px 0 !important;
        margin: 0 !important;
        background: #fff !important;
    }

    .su-print-title[b-y2gaznj17d] {
        text-align: center;
        font-size: 20px !important;
        font-weight: 1000;
        color: #000 !important;
    }

    .su-print-sub[b-y2gaznj17d] {
        text-align: center;
        font-size: 13px !important;
        color: #333 !important;
    }

    .su-table-wrap[b-y2gaznj17d] {
        width: 100% !important;
        max-width: 100% !important;
        overflow: visible !important;
        box-shadow: none !important;
        border: 1px solid #111827 !important;
        border-radius: 0 !important;
        margin-top: 10px !important;
    }

    .su-table[b-y2gaznj17d] {
        width: 100% !important;
        min-width: 0 !important;
        table-layout: fixed !important;
        border-collapse: collapse !important;
    }

        .su-table thead th[b-y2gaznj17d] {
            background: #111827 !important;
            color: #fff !important;
            border: 1px solid #111827 !important;
            padding: 7px !important;
            font-size: 12px !important;
            white-space: normal !important;
        }

        .su-table tbody td[b-y2gaznj17d] {
            border: 1px solid #d1d5db !important;
            padding: 6px !important;
            font-size: 12px !important;
            color: #000 !important;
            background: #fff !important;
            white-space: normal !important;
            word-break: break-word !important;
        }

        .su-table tfoot td[b-y2gaznj17d] {
            background: #111827 !important;
            color: #fff !important;
            border: 1px solid #111827 !important;
            padding: 8px !important;
            font-size: 13px !important;
            white-space: normal !important;
        }

    .su-rol[b-y2gaznj17d] {
        border: none !important;
        background: transparent !important;
        color: #000 !important;
        padding: 0 !important;
    }

    .neg[b-y2gaznj17d],
    .pos[b-y2gaznj17d] {
        color: #000 !important;
    }

    @page {
        size: letter portrait;
        margin: 12mm;
    }
}
/* _content/SistemaLoteriaDashboard/Components/Banca/SorteosTab.razor.rz.scp.css */
/* ===== Cards genéricas (SorteosTab) ===== */
.card[b-q61iu2hedu] {
    background: #fff;
    border: 1px solid #e6edf8;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 2px 8px rgba(0,0,0,.05);
}

.card-titulo[b-q61iu2hedu] {
    font-weight: 900;
    font-size: 1.35rem;
    color: #153e75;
    margin-bottom: 12px;
}

/* Acciones dentro de la card de sorteos */
.acciones[b-q61iu2hedu] {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
}

/* Botones (mismo diseño que en Banca) */
.btn[b-q61iu2hedu] {
    background: #0d47a1;
    color: #fff;
    border: none;
    padding: 10px 14px;
    border-radius: 8px;
    font-weight: 700;
    cursor: pointer;
    transition: .15s;
    font-size: 1.02rem;
}

    .btn:hover[b-q61iu2hedu] {
        filter: brightness(.95);
    }

.btn-secondary[b-q61iu2hedu] {
    background: #6b84a8;
    color: #fff;
}

.btn-danger[b-q61iu2hedu] {
    background: #e53935;
    color: #fff;
}

.btn-small[b-q61iu2hedu] {
    padding: 8px 12px;
    font-weight: 600;
    border-radius: 7px;
    font-size: 0.98rem;
}

.btn:disabled[b-q61iu2hedu] {
    opacity: .6;
    cursor: not-allowed;
}

/* Inputs / selects / textarea (estilo general de formulario) */
.input[b-q61iu2hedu],
select.input[b-q61iu2hedu],
textarea.input[b-q61iu2hedu] {
    padding: 11px 13px;
    border: 1px solid #e2e8f5;
    border-radius: 10px;
    outline: none;
    font: inherit;
    font-size: 1.08rem;
    background: #fff;
    transition: box-shadow .15s, border-color .15s, transform .08s;
}

    .input:focus[b-q61iu2hedu],
    select.input:focus[b-q61iu2hedu],
    textarea.input:focus[b-q61iu2hedu] {
        box-shadow: 0 0 0 3px rgba(21,62,117,.12);
        border-color: #cfe0fb;
    }

    .input:hover[b-q61iu2hedu] {
        border-color: #cfd9ee;
    }

    .input:focus-visible[b-q61iu2hedu] {
        transform: translateY(-1px);
    }

/* Campos numéricos sin flechas */
input[type="number"].input[b-q61iu2hedu] {
    -moz-appearance: textfield;
}

    input[type="number"].input[b-q61iu2hedu]::-webkit-outer-spin-button,
    input[type="number"].input[b-q61iu2hedu]::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

/* Filas de formulario (label + campo) */
.form-row[b-q61iu2hedu] {
    display: grid;
    grid-template-columns: 210px 1fr;
    align-items: center;
    gap: 14px;
    margin-bottom: 14px;
    font-size: 1.08rem;
}

    .form-row > label[b-q61iu2hedu] {
        font-weight: 700;
        color: #123a6c;
        font-size: 1.08rem;
    }

/* Subcard donde se edita el sorteo */
.subcard[b-q61iu2hedu] {
    border: 1px solid #e6edf8;
    border-radius: 10px;
    padding: 12px;
    background: #fbfdff;
    box-shadow: 0 1px 4px rgba(0,0,0,.04) inset;
}

/* Texto de ayuda pequeño bajo el ID */
.help[b-q61iu2hedu] {
    font-size: 0.96rem;
    color: #6c7e97;
    margin-top: 4px;
}

/* Toggle Activo (switch) */
.switch[b-q61iu2hedu] {
    position: relative;
    width: 44px;
    height: 24px;
}

    .switch input[b-q61iu2hedu] {
        appearance: none;
        width: 44px;
        height: 24px;
        background: #cdd9ee;
        border-radius: 999px;
        outline: none;
        cursor: pointer;
        transition: background .2s;
    }

        .switch input:checked[b-q61iu2hedu] {
            background: #3b73ff;
        }

        .switch input[b-q61iu2hedu]::after {
            content: "";
            position: absolute;
            width: 18px;
            height: 18px;
            top: 3px;
            left: 3px;
            background: #fff;
            border-radius: 50%;
            transition: transform .2s;
            box-shadow: 0 1px 3px rgba(0,0,0,.25);
        }

        .switch input:checked[b-q61iu2hedu]::after {
            transform: translateX(20px);
        }

/* Tabla base (igual que en Banca) */
.tabla[b-q61iu2hedu] {
    border: 1px solid #e6edf8;
    border-radius: 10px;
    overflow: hidden;
}

.tabla-header[b-q61iu2hedu],
.tabla-body .fila[b-q61iu2hedu] {
    display: grid; /* columnas definidas por tabla-xxx */
    gap: 0;
}

.tabla-header[b-q61iu2hedu] {
    background: #f4f8ff;
    color: #123a6c;
    font-weight: 800;
    border-bottom: 1px solid #e6edf8;
}

    .tabla-header > div[b-q61iu2hedu],
    .tabla-body .fila > div[b-q61iu2hedu] {
        padding: 10px 12px;
        border-right: 1px solid #eef3fb;
    }

        .tabla-header > div:last-child[b-q61iu2hedu],
        .tabla-body .fila > div:last-child[b-q61iu2hedu] {
            border-right: none;
        }

.tabla-body .fila:nth-child(even)[b-q61iu2hedu] {
    background: #fcfeff;
}

/* Placeholder sin datos */
.fila-placeholder[b-q61iu2hedu] {
    padding: 16px;
    color: #6c7e97;
    font-style: italic;
}

/* === ESPECÍFICO: TABLA SORTEOS === */
.tabla-sorteos .tabla-header[b-q61iu2hedu],
.tabla-sorteos .tabla-body .fila[b-q61iu2hedu] {
    /* ID | Nombre | Hora cierre | Activo | Acciones */
    grid-template-columns: .6fr 2fr 1.2fr .8fr 1.2fr;
}

.tabla-sorteos .tabla-header[b-q61iu2hedu] {
    font-size: 1.1rem;
}

.tabla-sorteos .tabla-body .fila[b-q61iu2hedu] {
    font-size: 1.1rem;
}

    .tabla-sorteos .tabla-header > div[b-q61iu2hedu],
    .tabla-sorteos .tabla-body .fila > div[b-q61iu2hedu] {
        font-size: 1.1rem;
    }

/* Responsive: formulario en una columna en pantallas pequeñas */
@media (max-width: 700px) {
    .form-row[b-q61iu2hedu] {
        grid-template-columns: 1fr;
    }
}

/* === Resaltar campos dentro de la card de Sorteos === */
.card .input[b-q61iu2hedu],
.card select.input[b-q61iu2hedu],
.card textarea.input[b-q61iu2hedu] {
    background: #f9fbff; /* fondo un poco más celeste */
    border-color: #d5e2fb; /* borde más marcado */
    box-shadow: inset 0 0 0 1px #e1e9f8;
}

    .card .input:focus[b-q61iu2hedu],
    .card select.input:focus[b-q61iu2hedu],
    .card textarea.input:focus[b-q61iu2hedu] {
        box-shadow: 0 0 0 3px rgba(21, 62, 117, .12), inset 0 0 0 1px #c7d7fb;
        border-color: #c1d4ff;
    }

/* ===== Estilo compacto moderno (ID, Nombre, Tipo) ===== */

/* Base compacta: comparte look con el select de tipo */
.input-compact[b-q61iu2hedu],
.tipo-sorteo-select[b-q61iu2hedu] {
    font-size: 1.1rem;
    padding: 8px 11px;
    border-radius: 8px;
    border: 1px solid #b9c6d2;
    background: #f8fbff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
    transition: 0.2s ease;
    font-weight: 600;
}

/* Ancho específico para el select de tipo (Normal/Reventado) */
.tipo-sorteo-select[b-q61iu2hedu] {
    width: 150px;
}

    /* Hover / focus compartidos */
    .input-compact:hover[b-q61iu2hedu],
    .tipo-sorteo-select:hover[b-q61iu2hedu] {
        border-color: #4a7bdc;
    }

    .input-compact:focus[b-q61iu2hedu],
    .tipo-sorteo-select:focus[b-q61iu2hedu] {
        outline: none;
        border-color: #2760ff;
        box-shadow: 0 0 4px rgba(39,96,255,0.35);
    }

/* Ancho compacto del ID */
.input-id-compact[b-q61iu2hedu] {
    width: 120px;
}

/* Ancho compacto del Nombre */
.input-nombre-compact[b-q61iu2hedu] {
    width: 260px;
    max-width: 100%;
}

/* ===== MODAL GENÉRICO (igual que en Usuarios) ===== */

.modal-backdrop[b-q61iu2hedu] {
    position: fixed;
    inset: 0; /* top/right/bottom/left:0 */
    background: rgba(6, 24, 61, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2000;
}

/* BASE COMPARTIDA DEL MODAL */
.modal-dialog[b-q61iu2hedu] {
    background: #ffffff;
    border-radius: 14px;
    box-shadow: 0 18px 45px rgba(15, 35, 70, 0.35);
    overflow: hidden;
    animation: modalFadeIn-b-q61iu2hedu 0.18s ease-out;
    border: 1px solid #dce7fb;
}

    /* Tamaño medio para el contenido del modal */
    .modal-dialog.modal-md[b-q61iu2hedu] {
        width: 520px;
        max-width: calc(100% - 40px);
    }

    /* Tamaño grande para editar sorteo */
    .modal-dialog.modal-xl[b-q61iu2hedu] {
        width: min(1100px, 96vw);
        max-width: 96vw;
    }

/* Cabecera del modal */
.modal-header[b-q61iu2hedu] {
    padding: 12px 18px;
    border-bottom: 1px solid #e4ecfa;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .modal-header h3[b-q61iu2hedu] {
        margin: 0;
        font-size: 1.28rem;
        font-weight: 800;
        color: #123a6c;
    }

/* Botón de cerrar (X) */
.modal-close[b-q61iu2hedu] {
    background: transparent;
    border: none;
    font-size: 1.2rem;
    font-weight: 800;
    cursor: pointer;
    color: #6b7a92;
    padding: 2px 6px;
    border-radius: 999px;
    transition: background 0.15s, color 0.15s;
}

    .modal-close:hover[b-q61iu2hedu] {
        background: rgba(21, 62, 117, 0.08);
        color: #10294f;
    }

/* Cuerpo del modal */
.modal-body[b-q61iu2hedu] {
    padding: 14px 18px 12px;
    max-height: 70vh;
    overflow-y: auto;
}

/* Pie del modal (botones) */
.modal-footer[b-q61iu2hedu] {
    padding: 10px 18px 14px;
    border-top: 1px solid #e4ecfa;
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

/* Animación simple de aparición */
@keyframes modalFadeIn-b-q61iu2hedu {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Alertas dentro del modal (por si no existen aún aquí) */
.alerta[b-q61iu2hedu] {
    border-radius: 10px;
    padding: 10px 12px;
    font-size: 0.9rem;
    line-height: 1.4;
}

.alerta-warning[b-q61iu2hedu] {
    background: #fff7e6;
    border: 1px solid #ffd48a;
    color: #8a5a11;
}

.conf-modal-grid[b-q61iu2hedu] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    align-items: start;
}

.conf-card[b-q61iu2hedu] {
    background: #fff;
    border: 1px solid #e6edf8;
    border-radius: 12px;
    padding: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,.05);
}

.conf-title[b-q61iu2hedu] {
    font-weight: 800;
    font-size: 1.08rem;
    color: #153e75;
    margin-bottom: 12px;
}

@media (max-width: 900px) {
    .conf-modal-grid[b-q61iu2hedu] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    /* =========================
       SORTEOS - SOLO MÓVIL
       NO TOCA ESCRITORIO
       ========================= */

    /* ===== Selector de juego ===== */
    .juego-select-mobile-safe[b-q61iu2hedu] {
        width: 100%;
        max-width: 100%;
        min-height: 46px;
        margin-bottom: 12px;
        box-sizing: border-box;
        font-size: 16px;
    }

    /* ===== Card principal ===== */
    .card[b-q61iu2hedu] {
        padding: 12px;
        border-radius: 14px;
        box-sizing: border-box;
        overflow-x: hidden;
    }

    .card-titulo[b-q61iu2hedu] {
        font-size: 1.08rem;
        line-height: 1.25;
        margin-bottom: 10px;
    }

    /* ===== Barra de acciones ===== */
    .acciones[b-q61iu2hedu] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
        margin-bottom: 12px;
    }

    .btn-masiva-mobile-safe[b-q61iu2hedu] {
        margin-left: 0 !important;
    }

    .btn[b-q61iu2hedu],
    .btn-small[b-q61iu2hedu],
    .btn-secondary[b-q61iu2hedu],
    .btn-danger[b-q61iu2hedu] {
        width: 100%;
        min-height: 46px;
        box-sizing: border-box;
        font-size: 0.96rem;
        padding: 10px 12px;
        text-align: center;
        justify-content: center;
    }

    /* ===== Tabla sorteos ===== */
    .tabla[b-q61iu2hedu] {
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
    }

    .tabla-sorteos .tabla-header[b-q61iu2hedu],
    .tabla-sorteos .tabla-body .fila[b-q61iu2hedu] {
        min-width: 760px;
        grid-template-columns: 90px 240px 150px 100px 180px;
    }

        .tabla-sorteos .tabla-header[b-q61iu2hedu],
        .tabla-sorteos .tabla-body .fila[b-q61iu2hedu],
        .tabla-sorteos .tabla-header > div[b-q61iu2hedu],
        .tabla-sorteos .tabla-body .fila > div[b-q61iu2hedu] {
            font-size: 0.96rem;
        }

    .fila-placeholder[b-q61iu2hedu] {
        padding: 14px;
        font-size: 0.95rem;
        line-height: 1.35;
    }

    /* ===== Modal backdrop ===== */
    .modal-backdrop[b-q61iu2hedu] {
        position: fixed;
        inset: 0;
        background: rgba(6, 24, 61, 0.45);
        display: flex;
        align-items: flex-start;
        justify-content: center;
        z-index: 2000;
        padding: 10px;
        overflow: hidden;
        overscroll-behavior: contain;
        touch-action: none;
    }

    body:has(.modal-backdrop)[b-q61iu2hedu] {
        overflow: hidden;
        touch-action: none;
        position: fixed;
        width: 100%;
    }

    /* ===== Modal base ===== */
    .modal-dialog[b-q61iu2hedu] {
        width: calc(100vw - 20px);
        max-width: calc(100vw - 20px);
        min-width: 0;
        max-height: 90svh;
        border-radius: 14px;
        overflow: hidden;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
    }

        .modal-dialog.modal-md[b-q61iu2hedu],
        .modal-dialog.modal-xl[b-q61iu2hedu] {
            width: calc(100vw - 20px);
            max-width: calc(100vw - 20px);
            min-width: 0;
        }

    .modal-header[b-q61iu2hedu] {
        padding: 12px 14px;
        gap: 10px;
        box-sizing: border-box;
    }

        .modal-header h3[b-q61iu2hedu] {
            font-size: 1rem;
            line-height: 1.25;
            min-width: 0;
        }

    .modal-close[b-q61iu2hedu] {
        min-width: 40px;
        min-height: 40px;
        flex: 0 0 auto;
    }

    .modal-body[b-q61iu2hedu] {
        padding: 12px;
        max-height: calc(90svh - 120px);
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-y;
        box-sizing: border-box;
    }

    .modal-footer[b-q61iu2hedu] {
        padding: 10px 12px 12px;
        display: flex;
        flex-direction: column;
        gap: 8px;
        justify-content: stretch;
        box-sizing: border-box;
    }

        .modal-footer .btn[b-q61iu2hedu] {
            width: 100%;
        }

    /* ===== Formulario del modal ===== */
    .form-row[b-q61iu2hedu] {
        grid-template-columns: 1fr;
        gap: 6px;
        margin-bottom: 12px;
        font-size: 0.98rem;
    }

        .form-row > label[b-q61iu2hedu] {
            font-size: 0.96rem;
            line-height: 1.2;
        }

    .input[b-q61iu2hedu],
    select.input[b-q61iu2hedu],
    textarea.input[b-q61iu2hedu] {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        min-height: 46px;
        font-size: 16px;
        box-sizing: border-box;
    }

    .input-id-compact[b-q61iu2hedu],
    .input-nombre-compact[b-q61iu2hedu],
    .tipo-sorteo-select[b-q61iu2hedu] {
        width: 100%;
        max-width: 100%;
    }

    .help[b-q61iu2hedu] {
        font-size: 0.9rem;
        line-height: 1.3;
    }

    /* ===== Bloques de hora ===== */
    .hora-inline-mobile-safe[b-q61iu2hedu] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
        width: 100%;
    }

    .hora-input-mobile-safe[b-q61iu2hedu],
    .hora-ampm-mobile-safe[b-q61iu2hedu] {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    /* ===== Modal edición Tiempos ===== */
    .conf-modal-grid[b-q61iu2hedu] {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .conf-card[b-q61iu2hedu] {
        padding: 12px;
        border-radius: 12px;
    }

    .conf-title[b-q61iu2hedu] {
        font-size: 1rem;
        line-height: 1.2;
        margin-bottom: 10px;
    }

    /* ===== Alertas cambio masivo ===== */
    .alerta[b-q61iu2hedu] {
        padding: 12px;
        font-size: 0.92rem;
        line-height: 1.4;
        word-break: break-word;
    }

        .alerta ul[b-q61iu2hedu] {
            margin: 8px 0 0 18px;
            padding: 0;
        }

        .alerta li[b-q61iu2hedu] {
            margin-bottom: 4px;
            word-break: break-word;
        }

    /* ===== Blindaje general ===== */
    html[b-q61iu2hedu],
    body[b-q61iu2hedu] {
        overflow-x: hidden;
    }

    .card *[b-q61iu2hedu],
    .modal-dialog *[b-q61iu2hedu],
    .modal-body *[b-q61iu2hedu],
    .modal-footer *[b-q61iu2hedu] {
        box-sizing: border-box;
        min-width: 0;
        max-width: 100%;
    }
}

/* ===== MODAL CONFIRMACION PREMIUM ===== */

.modal-overlay[b-q61iu2hedu] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(6px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.modal-confirmacion[b-q61iu2hedu] {
    width: 360px;
    padding: 26px 24px 22px;
    border-radius: 22px;
    background: linear-gradient(145deg, #ffffff, #f1f5f9);
    box-shadow: 0 25px 60px rgba(0,0,0,0.25);
    text-align: center;
    animation: modalFadeIn-b-q61iu2hedu 0.3s ease;
}

.modal-icono[b-q61iu2hedu] {
    width: 70px;
    height: 70px;
    margin: 0 auto 14px;
    border-radius: 50%;
    background: linear-gradient(135deg, #22c55e, #16a34a);
    color: white;
    font-size: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 25px rgba(34,197,94,0.4);
}

.modal-titulo[b-q61iu2hedu] {
    font-size: 20px;
    font-weight: 900;
    color: #0f172a;
    margin-bottom: 6px;
}

.modal-texto[b-q61iu2hedu] {
    font-size: 14px;
    color: #475569;
    margin-bottom: 18px;
}

.btn-confirmar[b-q61iu2hedu] {
    width: 100%;
    height: 42px;
    border-radius: 12px;
    border: none;
    font-weight: 800;
    font-size: 14px;
    cursor: pointer;
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    color: white;
    box-shadow: 0 10px 20px rgba(37,99,235,0.3);
    transition: all 0.2s ease;
}

    .btn-confirmar:hover[b-q61iu2hedu] {
        transform: translateY(-2px);
        box-shadow: 0 15px 30px rgba(37,99,235,0.4);
    }

@keyframes modalFadeIn-b-q61iu2hedu {
    from {
        transform: scale(0.9);
        opacity: 0;
    }

    to {
        transform: scale(1);
        opacity: 1;
    }
}


.rifa-usuarios-grid[b-q61iu2hedu] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 0.4rem 0.85rem;
    max-height: 240px;
    overflow-y: auto;
    margin-top: 0.35rem;
}

.rifa-usuario-chk[b-q61iu2hedu] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.95rem;
    color: #1e3a5f;
    cursor: pointer;
}
/* _content/SistemaLoteriaDashboard/Components/Banca/UsuariosTab.razor.rz.scp.css */
/* === EXISTENTE (no se toca la estructura) === */
.usuarios-wrap[b-1v4tgzl30n] {
    width: 100%;
    max-width: 100%;
}

/* acciones */
.acciones[b-1v4tgzl30n] {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    flex-wrap: wrap;
}

    .acciones .acciones-derecha[b-1v4tgzl30n] {
        display: flex;
        gap: 8px;
        align-items: center;
        flex-wrap: wrap;
    }

.input-buscar[b-1v4tgzl30n] {
    min-width: 220px;
}

/* subcard */
.subcard[b-1v4tgzl30n] {
    border: 1px solid #e6edf8;
    border-radius: 10px;
    padding: 12px;
    background: #fbfdff;
    box-shadow: 0 1px 4px rgba(0,0,0,.04) inset;
    width: 100%;
    max-width: 100%;
    display: block;
}

/* tabla usuarios (listado inferior) */
.tabla-usuarios .tabla-header[b-1v4tgzl30n],
.tabla-usuarios .tabla-body .fila[b-1v4tgzl30n] {
    display: grid;
    grid-template-columns: 1.2fr .8fr .9fr .5fr .9fr; /* Usuario | Rol | Tel | ID | Acciones */
}

/* ===== TABLA ASIGNACIÓN SORTEOS (HEADER + FILAS) ===== */

/* Base grid */
.tabla-usuarios-sorteos .tabla-header[b-1v4tgzl30n],
.tabla-usuarios-sorteos .tabla-body .fila[b-1v4tgzl30n] {
    display: grid;
}

/* Contenedor tabla */
.tabla-usuarios-sorteos[b-1v4tgzl30n] {
    width: 100%;
    max-width: 100%;
}

    /* ===== TIEMPOS: 12 columnas ===== */
    .tabla-usuarios-sorteos .tabla-header.tabla-us-sorteos-grid-tiempos[b-1v4tgzl30n],
    .tabla-usuarios-sorteos .tabla-body .fila.tabla-us-sorteos-grid[b-1v4tgzl30n] {
        width: 100%;
        grid-template-columns: 60px minmax(220px, 2.15fr) minmax(70px, 0.62fr) minmax(74px, 0.66fr) minmax(54px, 0.42fr) minmax(54px, 0.42fr) minmax(82px, 0.72fr) minmax(86px, 0.76fr) minmax(92px, 0.82fr) minmax(84px, 0.74fr) minmax(92px, 0.82fr) 90px;
        gap: 0;
    }

    /* ===== PARLEY: 9 columnas ===== */
    .tabla-usuarios-sorteos .tabla-header.tabla-us-sorteos-grid-simple[b-1v4tgzl30n],
    .tabla-usuarios-sorteos .tabla-body .fila.tabla-us-sorteos-grid-simple[b-1v4tgzl30n] {
        width: 100%;
        grid-template-columns: 60px minmax(180px, 2fr) minmax(90px, 1fr) minmax(90px, 1fr) minmax(80px, 0.9fr) minmax(80px, 0.9fr) minmax(95px, 1fr) minmax(95px, 1fr) 90px;
        gap: 0;
    }

    /* ===== MONAZOS: 10 columnas ===== */
    .tabla-usuarios-sorteos .tabla-header.tabla-us-sorteos-grid-monazos[b-1v4tgzl30n],
    .tabla-usuarios-sorteos .tabla-body .fila.tabla-us-sorteos-grid-monazos[b-1v4tgzl30n] {
        width: 100%;
        grid-template-columns: 60px minmax(180px, 2fr) minmax(90px, 1fr) minmax(90px, 1fr) minmax(90px, 0.95fr) minmax(100px, 1fr) minmax(100px, 1fr) minmax(100px, 1fr) minmax(95px, 1fr) 90px;
        gap: 0;
    }

    /* Header general de la tabla */
    .tabla-usuarios-sorteos .tabla-header[b-1v4tgzl30n] {
        font-size: 1.12rem;
        font-weight: 800;
        line-height: 1.25;
        border-bottom: 2px solid #d2defa;
    }

    /* Filas */
    .tabla-usuarios-sorteos .tabla-body .fila[b-1v4tgzl30n] {
        font-size: 1.18rem;
        line-height: 1.35;
        align-items: center;
    }

    /* Horas / números */
    .tabla-usuarios-sorteos .col-num[b-1v4tgzl30n],
    .tabla-usuarios-sorteos .col-hora[b-1v4tgzl30n],
    .tabla-usuarios-sorteos .col-cierre[b-1v4tgzl30n] {
        text-align: center;
        font-size: 1rem;
        font-variant-numeric: tabular-nums;
        letter-spacing: 0.2px;
        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        min-width: 0;
    }

    /* Padding de celdas */
    .tabla-usuarios-sorteos .tabla-header > div[b-1v4tgzl30n],
    .tabla-usuarios-sorteos .tabla-body .fila > div[b-1v4tgzl30n] {
        padding: 8px 8px;
    }

    /* Nombre del sorteo */
    .tabla-usuarios-sorteos .col-sorteo[b-1v4tgzl30n] {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 260px;
        min-width: 0;
    }

    .tabla-usuarios-sorteos .col-num-compact[b-1v4tgzl30n] {
        font-size: 0.95rem;
        padding-left: 4px !important;
        padding-right: 4px !important;
    }

    /* Centro para switch y acciones */
    .tabla-usuarios-sorteos .col-asig[b-1v4tgzl30n],
    .tabla-usuarios-sorteos .col-acc[b-1v4tgzl30n] {
        text-align: center;
    }

    /* Botón acciones */
    .tabla-usuarios-sorteos .btn-small[b-1v4tgzl30n] {
        padding: 8px 12px;
        font-size: 0.95rem;
        border-radius: 8px;
    }

/* === edición inline dentro de celdas === */
.input-inline-num[b-1v4tgzl30n] {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    padding: 4px 6px !important;
    height: 30px;
    font-size: 0.88rem !important;
    text-align: center;
    border-radius: 6px !important;
}

.tabla-usuarios-sorteos .col-num.celda-editable[b-1v4tgzl30n] {
    padding: 4px 6px !important;
    overflow: hidden;
}

.tabla-usuarios-sorteos .col-acc[b-1v4tgzl30n] {
    padding: 4px 6px !important;
    overflow: hidden;
}

    .tabla-usuarios-sorteos .col-acc .btn-small[b-1v4tgzl30n] {
        padding: 4px 8px;
        font-size: 0.82rem;
        white-space: nowrap;
    }

/* Switch en tabla */
.tabla-usuarios-sorteos .switch[b-1v4tgzl30n] {
    transform: scale(1.07);
    transform-origin: left center;
}

/* Separadores */
.tabla-usuarios-sorteos .tabla-header > div[b-1v4tgzl30n],
.tabla-usuarios-sorteos .tabla-body .fila > div[b-1v4tgzl30n] {
    border-right: 2px solid #d6e2fb;
}

    .tabla-usuarios-sorteos .tabla-header > div:last-child[b-1v4tgzl30n],
    .tabla-usuarios-sorteos .tabla-body .fila > div:last-child[b-1v4tgzl30n] {
        border-right: none;
    }

/* Bandas */
.tabla-usuarios-sorteos .tabla-body .fila:nth-child(even)[b-1v4tgzl30n] {
    background: #f7faff;
}

/* Hover */
.tabla-usuarios-sorteos .tabla-body .fila:hover[b-1v4tgzl30n] {
    background: #e9f2ff;
}

/* Títulos de columnas */
.tabla-usuarios-sorteos .tabla-header > div[b-1v4tgzl30n] {
    text-align: center;
    justify-content: center;
    align-items: center;
    display: flex;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    font-size: 0.95rem;
}

/* Responsive */
@media (max-width: 1200px) {
    .tabla-usuarios-sorteos .tabla-header.tabla-us-sorteos-grid-tiempos[b-1v4tgzl30n],
    .tabla-usuarios-sorteos .tabla-body .fila.tabla-us-sorteos-grid[b-1v4tgzl30n] {
        grid-template-columns: 56px minmax(190px, 1.9fr) minmax(64px, 0.6fr) minmax(66px, 0.62fr) minmax(50px, 0.42fr) minmax(50px, 0.42fr) minmax(74px, 0.7fr) minmax(78px, 0.74fr) minmax(84px, 0.78fr) minmax(78px, 0.72fr) minmax(84px, 0.78fr) 88px;
    }

    .tabla-usuarios-sorteos .tabla-header.tabla-us-sorteos-grid-simple[b-1v4tgzl30n],
    .tabla-usuarios-sorteos .tabla-body .fila.tabla-us-sorteos-grid-simple[b-1v4tgzl30n] {
        grid-template-columns: 56px minmax(140px, 1.6fr) minmax(72px, 0.8fr) minmax(72px, 0.8fr) minmax(72px, 0.8fr) minmax(72px, 0.8fr) minmax(82px, 0.9fr) minmax(82px, 0.9fr) 90px;
    }

    .tabla-usuarios-sorteos .tabla-header.tabla-us-sorteos-grid-monazos[b-1v4tgzl30n],
    .tabla-usuarios-sorteos .tabla-body .fila.tabla-us-sorteos-grid-monazos[b-1v4tgzl30n] {
        grid-template-columns: 56px minmax(140px, 1.6fr) minmax(72px, 0.8fr) minmax(72px, 0.8fr) minmax(78px, 0.85fr) minmax(88px, 0.95fr) minmax(88px, 0.95fr) minmax(88px, 0.95fr) minmax(82px, 0.9fr) 90px;
    }
}

/* utilidades ya conocidas */
.form-row[b-1v4tgzl30n] {
    display: grid;
    grid-template-columns: 170px minmax(300px, 420px);
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

    .form-row > label[b-1v4tgzl30n] {
        font-weight: 700;
        color: #123a6c;
    }

.input[b-1v4tgzl30n],
select.input[b-1v4tgzl30n] {
    padding: 10px 12px;
    border: 1px solid #e2e8f5;
    border-radius: 10px;
    outline: none;
    font: inherit;
    background: #fff;
}

    .input:focus[b-1v4tgzl30n],
    select.input:focus[b-1v4tgzl30n] {
        box-shadow: 0 0 0 3px rgba(21,62,117,.12);
        border-color: #cfe0fb;
    }

.btn[b-1v4tgzl30n] {
    background: #0d47a1;
    color: #fff;
    border: none;
    padding: 8px 12px;
    border-radius: 8px;
    font-weight: 700;
    cursor: pointer;
}

    .btn:hover[b-1v4tgzl30n] {
        filter: brightness(.95);
    }

.btn-secondary[b-1v4tgzl30n] {
    background: #6b84a8;
    color: #fff;
}

.btn-danger[b-1v4tgzl30n] {
    background: #e53935;
    color: #fff;
}

.btn-small[b-1v4tgzl30n] {
    padding: 6px 10px;
    font-weight: 600;
    border-radius: 7px;
}

.pill[b-1v4tgzl30n] {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 700;
    background: #eef3ff;
    color: #264d99;
}

.divisor[b-1v4tgzl30n] {
    height: 1px;
    background: linear-gradient(90deg, transparent, #e8eefb, transparent);
    margin: 10px 0;
}

.form-actions[b-1v4tgzl30n] {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    margin-top: 8px;
}

/* switch */
.switch[b-1v4tgzl30n] {
    position: relative;
    width: 44px;
    height: 24px;
}

    .switch input[b-1v4tgzl30n] {
        appearance: none;
        width: 44px;
        height: 24px;
        background: #cdd9ee;
        border-radius: 999px;
        cursor: pointer;
        transition: background .2s;
        outline: none;
        border: none;
    }

        .switch input:checked[b-1v4tgzl30n] {
            background: #3b73ff;
        }

        .switch input[b-1v4tgzl30n]::after {
            content: "";
            position: absolute;
            width: 18px;
            height: 18px;
            top: 3px;
            left: 3px;
            background: #fff;
            border-radius: 50%;
            transition: transform .2s;
            box-shadow: 0 1px 3px rgba(0,0,0,.25);
        }

        .switch input:checked[b-1v4tgzl30n]::after {
            transform: translateX(20px);
        }

/* modal base */
.modal-backdrop[b-1v4tgzl30n] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.35);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

.modal[b-1v4tgzl30n] {
    width: min(640px, 95vw);
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 10px 28px rgba(0,0,0,.2);
    border: 1px solid #e6edf8;
    overflow: hidden;
    animation: pop-b-1v4tgzl30n .12s ease-out;
}

@keyframes pop-b-1v4tgzl30n {
    from {
        transform: scale(.98);
        opacity: .5;
    }

    to {
        transform: scale(1);
        opacity: 1;
    }
}

.modal-header[b-1v4tgzl30n] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 14px;
    border-bottom: 1px solid #eef3fb;
    background: #f7fbff;
}

.modal-title[b-1v4tgzl30n] {
    font-weight: 900;
    color: #153e75;
}

.modal-close[b-1v4tgzl30n] {
    background: transparent;
    border: none;
    font-size: 18px;
    cursor: pointer;
}

.modal-body[b-1v4tgzl30n] {
    padding: 14px;
    max-height: 78vh;
    overflow-y: auto;
}


.modal-actions[b-1v4tgzl30n] {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    padding: 12px 14px;
    border-top: 1px solid #eef3fb;
    background: #fbfdff;
}

/* grupo asignación header */
.asignacion-actions[b-1v4tgzl30n] {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    margin: 8px 0 10px;
    flex-wrap: wrap;
}

    .asignacion-actions .left[b-1v4tgzl30n],
    .asignacion-actions .right[b-1v4tgzl30n] {
        display: flex;
        gap: 8px;
        align-items: center;
        flex-wrap: wrap;
    }

/* tabla base genérica */
.tabla[b-1v4tgzl30n] {
    border: 1px solid #e6edf8;
    border-radius: 10px;
    overflow-x: auto;
    width: 100%;
}

.tabla-header[b-1v4tgzl30n],
.tabla-body .fila[b-1v4tgzl30n] {
    display: grid;
    gap: 0;
}

.tabla-header[b-1v4tgzl30n] {
    background: #f4f8ff;
    color: #123a6c;
    font-weight: 800;
    border-bottom: 1px solid #e6edf8;
}

    .tabla-header > div[b-1v4tgzl30n],
    .tabla-body .fila > div[b-1v4tgzl30n] {
        padding: 10px 12px;
        border-right: 1px solid #eef3fb;
    }

        .tabla-body .fila > div:last-child[b-1v4tgzl30n],
        .tabla-header > div:last-child[b-1v4tgzl30n] {
            border-right: none;
        }

.tabla-body .fila:nth-child(even)[b-1v4tgzl30n] {
    background: #fcfeff;
}

.fila-placeholder[b-1v4tgzl30n] {
    padding: 16px;
    color: #6c7e97;
    font-style: italic;
}

/* responsivo genérico de form-row */
@media (max-width: 760px) {
    .form-row[b-1v4tgzl30n] {
        grid-template-columns: 1fr;
    }
}

/* ===== Modal Config (dos columnas) ===== */
.modal.modal-conf[b-1v4tgzl30n] {
    width: min(1180px, 98vw);
}

.conf-modal-grid[b-1v4tgzl30n] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}



.conf-card[b-1v4tgzl30n] {
    background: #fff;
    border: 1px solid #e6edf8;
    border-radius: 12px;
    padding: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,.05);
}

.conf-title[b-1v4tgzl30n] {
    font-weight: 900;
    color: #153e75;
    margin-bottom: 10px;
}

.conf-subtitle[b-1v4tgzl30n] {
    font-weight: 800;
    color: #1b4a8f;
    margin: 6px 0 8px 0;
}

/* variantes y utilidades usadas por los modales */
.rojo[b-1v4tgzl30n] {
    color: #e53935;
}

.conf-title.rojo[b-1v4tgzl30n] {
    color: #e53935;
}

.hint[b-1v4tgzl30n] {
    font-size: .86rem;
    color: #6c7e97;
    background: #f8fbff;
    border: 1px dashed #e2e8f5;
    padding: 6px 8px;
    border-radius: 8px;
}

.radio-group[b-1v4tgzl30n] {
    display: flex;
    align-items: center;
    gap: 16px;
}

    .radio-group label[b-1v4tgzl30n] {
        display: inline-flex;
        align-items: center;
        gap: 6px;
    }

@media (max-width: 820px) {
    .conf-modal-grid[b-1v4tgzl30n] {
        grid-template-columns: 1fr;
    }
}

/* Select con flecha SVG */
select.input[b-1v4tgzl30n] {
    appearance: none;
    background: #fff url("data:image/svg+xml;utf8,<svg fill='%23153e75' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path d='M5 7l5 5 5-5H5z'/></svg>") no-repeat right 10px center;
    background-size: 14px;
    padding-right: 30px;
    font-weight: 600;
}

/* ===============================
   INPUTS MÁS VISIBLES (Usuarios)
   =============================== */

.usuarios-wrap .input[b-1v4tgzl30n],
.usuarios-wrap input.input[b-1v4tgzl30n],
.usuarios-wrap select.input[b-1v4tgzl30n] {
    background: #f7f9fc !important;
    border: 1.5px solid #b7c3d6 !important;
    padding: 8px 10px !important;
    border-radius: 8px !important;
    font-size: 1.02rem;
    transition: 0.15s ease-in-out;
    color: #1d2939;
}

    .usuarios-wrap .input:focus[b-1v4tgzl30n],
    .usuarios-wrap input.input:focus[b-1v4tgzl30n],
    .usuarios-wrap select.input:focus[b-1v4tgzl30n] {
        background: #eef3fb !important;
        border-color: #3a6ff7 !important;
        outline: none !important;
        box-shadow: 0 0 0 2px rgba(58, 111, 247, 0.15);
    }

/* ==========================================
   INPUTS dentro de los MODALES (Grupo/Individual)
   ========================================== */

.modal-conf .input[b-1v4tgzl30n],
.modal-conf input.input[b-1v4tgzl30n],
.modal-conf select.input[b-1v4tgzl30n] {
    background: #f8fafc !important;
    border: 1.4px solid #b8c6dd !important;
    padding: 8px 10px !important;
    font-size: 1.01rem;
    border-radius: 7px;
    transition: 0.15s ease-in-out;
}

    .modal-conf .input:focus[b-1v4tgzl30n],
    .modal-conf input.input:focus[b-1v4tgzl30n],
    .modal-conf select.input:focus[b-1v4tgzl30n] {
        border-color: #4a7bff !important;
        background: #eef3fd !important;
        box-shadow: 0 0 0 2px rgba(74, 123, 255, 0.18);
        outline: none;
    }

.select-juego[b-1v4tgzl30n] {
    appearance: auto;
    -webkit-appearance: auto;
    -moz-appearance: auto;
    background-color: #fff;
}

.selector-juego-wrap[b-1v4tgzl30n] {
    display: inline-flex;
    flex-direction: column;
    gap: 6px;
    margin: 6px 0 10px;
    padding: 10px 12px;
    background: linear-gradient(180deg, #f7fbff 0%, #eef4ff 100%);
    border: 1px solid #d7e4fb;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(13, 71, 161, 0.08);
    min-width: 260px;
}

.selector-juego-titulo[b-1v4tgzl30n] {
    font-size: 0.82rem;
    font-weight: 800;
    color: #123a6c;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.select-juego-grande[b-1v4tgzl30n] {
    min-width: 260px;
    max-width: 320px;
    font-size: 1.08rem !important;
    font-weight: 800;
    color: #0d47a1;
    padding: 12px 40px 12px 14px !important;
    border: 1.8px solid #9db8ea !important;
    border-radius: 10px !important;
    background-color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(13, 71, 161, 0.10);
}

    .select-juego-grande:focus[b-1v4tgzl30n] {
        border-color: #3a6ff7 !important;
        box-shadow: 0 0 0 3px rgba(58, 111, 247, 0.18), 0 2px 8px rgba(13, 71, 161, 0.10);
    }


/* =========================
   MODAL MONAZOS: 2 columnas
   ========================= */
.monazo-grid-2col[b-1v4tgzl30n] {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 12px;
    align-items: start;
}

@media (max-width: 980px) {
    .monazo-grid-2col[b-1v4tgzl30n] {
        grid-template-columns: 1fr;
    }
}

.monazo-card-right[b-1v4tgzl30n] {
    position: sticky;
    top: 12px;
}

/* =========================
   TARJETA DATOS USUARIO
   ========================= */

.usuario-datos-card[b-1v4tgzl30n] {
    border: 1px solid #d6e2fb;
    border-radius: 14px;
    padding: 16px 18px;
    background: linear-gradient(180deg, #f9fbff 0%, #eef4ff 100%);
    box-shadow: 0 3px 12px rgba(13, 71, 161, 0.08);
    margin-bottom: 12px;
}

.usuario-datos-grid[b-1v4tgzl30n] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 22px;
    align-items: start;
}

.usuario-datos-col[b-1v4tgzl30n] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.usuario-datos-card .form-row[b-1v4tgzl30n] {
    display: grid;
    grid-template-columns: 150px minmax(220px, 1fr);
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}

.usuario-datos-footer[b-1v4tgzl30n] {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed #d6e2fb;
    display: flex;
    align-items: center;
    gap: 12px;
}

    .usuario-datos-footer > label:first-child[b-1v4tgzl30n] {
        font-weight: 700;
        color: #123a6c;
    }

@media (max-width: 900px) {
    .usuario-datos-grid[b-1v4tgzl30n] {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .usuario-datos-card .form-row[b-1v4tgzl30n] {
        grid-template-columns: 1fr;
    }

    .usuario-datos-footer[b-1v4tgzl30n] {
        justify-content: flex-start;
    }
}

@media (max-width: 700px) {
    /* =========================
       USUARIOS / ASIGNACIÓN
       SOLO MÓVIL
       NO TOCA ESCRITORIO
       ========================= */

    .usuarios-wrap[b-1v4tgzl30n] {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
        box-sizing: border-box;
    }

    /* ===== Acciones superiores ===== */
    .acciones[b-1v4tgzl30n] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
        margin-bottom: 12px;
    }

        .acciones .acciones-derecha[b-1v4tgzl30n] {
            display: flex;
            flex-direction: column;
            align-items: stretch;
            gap: 8px;
            width: 100%;
        }

    .input-buscar[b-1v4tgzl30n] {
        width: 100%;
        min-width: 0;
    }

    .acciones .btn[b-1v4tgzl30n],
    .acciones .btn-secondary[b-1v4tgzl30n] {
        width: 100%;
        min-height: 46px;
        box-sizing: border-box;
    }

    /* ===== Subcard principal ===== */
    .subcard[b-1v4tgzl30n] {
        padding: 12px;
        border-radius: 14px;
        overflow: hidden;
        box-sizing: border-box;
    }

        .subcard .card-titulo[b-1v4tgzl30n] {
            font-size: 1.02rem;
            line-height: 1.2;
            margin-bottom: 10px;
        }

    /* ===== Datos del usuario ===== */
    .usuario-datos-grid[b-1v4tgzl30n] {
        display: grid;
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .usuario-datos-col[b-1v4tgzl30n] {
        width: 100%;
        min-width: 0;
    }

    .form-row[b-1v4tgzl30n] {
        display: grid;
        grid-template-columns: 1fr;
        gap: 6px;
        margin-bottom: 12px;
    }

        .form-row > label[b-1v4tgzl30n] {
            font-size: 0.92rem;
            line-height: 1.2;
        }

    .usuarios-wrap .input[b-1v4tgzl30n],
    .usuarios-wrap input.input[b-1v4tgzl30n],
    .usuarios-wrap select.input[b-1v4tgzl30n] {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        min-height: 46px;
        font-size: 16px !important;
        box-sizing: border-box;
    }

    .usuario-datos-footer[b-1v4tgzl30n] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 10px;
        margin-top: 6px;
        flex-wrap: wrap;
    }

    /* ===== Selector de juego ===== */
    .selector-juego-wrap[b-1v4tgzl30n] {
        display: flex;
        flex-direction: column;
        gap: 6px;
        width: 100%;
        min-width: 0;
        margin: 8px 0 12px;
        padding: 12px;
        border-radius: 14px;
        box-sizing: border-box;
    }

    .selector-juego-titulo[b-1v4tgzl30n] {
        font-size: 0.82rem;
        line-height: 1.15;
    }

    .select-juego-grande[b-1v4tgzl30n] {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        min-height: 46px;
        font-size: 16px;
        box-sizing: border-box;
    }

    /* ===== Acciones asignación ===== */
    .asignacion-actions[b-1v4tgzl30n] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        margin-bottom: 10px;
    }

        .asignacion-actions .left[b-1v4tgzl30n],
        .asignacion-actions .right[b-1v4tgzl30n] {
            display: flex;
            flex-direction: column;
            align-items: stretch;
            gap: 8px;
            width: 100%;
        }

        .asignacion-actions .btn[b-1v4tgzl30n],
        .asignacion-actions .btn-small[b-1v4tgzl30n],
        .asignacion-actions .btn-secondary[b-1v4tgzl30n] {
            width: 100%;
            min-height: 46px;
            box-sizing: border-box;
            font-size: 0.95rem;
        }

    /* ===== Tabla asignación sorteos ===== */
    .tabla-usuarios-sorteos[b-1v4tgzl30n] {
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        border-radius: 12px;
    }

        .tabla-usuarios-sorteos .tabla-body[b-1v4tgzl30n] {
            min-width: 0;
        }

            .tabla-usuarios-sorteos .tabla-header.tabla-us-sorteos-grid-tiempos[b-1v4tgzl30n],
            .tabla-usuarios-sorteos .tabla-body .fila.tabla-us-sorteos-grid[b-1v4tgzl30n] {
                min-width: 1260px;
            }

            .tabla-usuarios-sorteos .tabla-header.tabla-us-sorteos-grid-simple[b-1v4tgzl30n],
            .tabla-usuarios-sorteos .tabla-body .fila.tabla-us-sorteos-grid-simple[b-1v4tgzl30n] {
                min-width: 980px;
            }

        .tabla-usuarios-sorteos .tabla-header[b-1v4tgzl30n] {
            font-size: 0.9rem;
            line-height: 1.2;
        }

        .tabla-usuarios-sorteos .tabla-body .fila[b-1v4tgzl30n] {
            font-size: 0.96rem;
            line-height: 1.25;
        }

            .tabla-usuarios-sorteos .tabla-header > div[b-1v4tgzl30n],
            .tabla-usuarios-sorteos .tabla-body .fila > div[b-1v4tgzl30n] {
                padding: 8px 6px;
                box-sizing: border-box;
            }

        .tabla-usuarios-sorteos .col-sorteo[b-1v4tgzl30n] {
            max-width: none;
        }

        .tabla-usuarios-sorteos .btn-small[b-1v4tgzl30n] {
            min-height: 34px;
            padding: 6px 8px;
            font-size: 0.82rem;
        }

    .input-inline-num[b-1v4tgzl30n] {
        min-height: 34px;
        font-size: 0.9rem !important;
    }

    .fila-placeholder[b-1v4tgzl30n] {
        padding: 14px 10px;
        font-size: 0.94rem;
        line-height: 1.35;
    }

    /* ===== Acciones finales ===== */
    .form-actions[b-1v4tgzl30n] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
        justify-content: stretch;
        margin-top: 12px;
    }

        .form-actions .btn[b-1v4tgzl30n],
        .form-actions .btn-danger[b-1v4tgzl30n],
        .form-actions .btn-secondary[b-1v4tgzl30n] {
            width: 100%;
            min-height: 46px;
            box-sizing: border-box;
        }

    /* ===== Tabla listado de usuarios ===== */
    .tabla-usuarios[b-1v4tgzl30n] {
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        margin-top: 12px !important;
    }

        .tabla-usuarios .tabla-header[b-1v4tgzl30n],
        .tabla-usuarios .tabla-body .fila[b-1v4tgzl30n] {
            min-width: 700px;
        }

            .tabla-usuarios .tabla-header > div[b-1v4tgzl30n],
            .tabla-usuarios .tabla-body .fila > div[b-1v4tgzl30n] {
                padding: 10px 8px;
                box-sizing: border-box;
                font-size: 0.94rem;
                line-height: 1.25;
            }

    /* ===== Modales ===== */
    .modal-backdrop[b-1v4tgzl30n] {
        position: fixed;
        inset: 0;
        background: rgba(15, 23, 42, 0.52);
        display: flex;
        align-items: flex-start;
        justify-content: center;
        z-index: 99998;
        padding: 10px;
        overflow: hidden;
        overscroll-behavior: contain;
        touch-action: none;
    }

    body:has(.modal-backdrop)[b-1v4tgzl30n] {
        overflow: hidden;
        touch-action: none;
        position: fixed;
        width: 100%;
    }

    .modal.modal-conf[b-1v4tgzl30n],
    .modal[b-1v4tgzl30n] {
        width: calc(100vw - 20px) !important;
        max-width: calc(100vw - 20px) !important;
        max-height: 90svh;
        min-width: 0;
        border-radius: 16px;
        overflow: hidden;
        box-sizing: border-box;
    }

    .modal-header[b-1v4tgzl30n] {
        padding: 12px 14px;
        gap: 10px;
    }

        .modal-header h3[b-1v4tgzl30n],
        .modal-title[b-1v4tgzl30n] {
            font-size: 1rem !important;
            line-height: 1.25;
            min-width: 0;
        }

    .modal-close[b-1v4tgzl30n] {
        min-width: 40px;
        min-height: 40px;
        flex: 0 0 auto;
        border-radius: 12px;
    }

    .modal-body[b-1v4tgzl30n] {
        padding: 12px;
        max-height: calc(90svh - 120px);
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-y;
        box-sizing: border-box;
    }

    .modal-footer[b-1v4tgzl30n],
    .modal-actions[b-1v4tgzl30n] {
        padding: 10px 12px 12px;
        display: flex;
        flex-direction: column;
        gap: 8px;
        justify-content: stretch;
        box-sizing: border-box;
    }

        .modal-footer .btn[b-1v4tgzl30n],
        .modal-actions .btn[b-1v4tgzl30n],
        .modal-actions .btn-small[b-1v4tgzl30n] {
            width: 100%;
            min-height: 46px;
        }

    /* ===== Grid modal configuración ===== */
    .conf-modal-grid[b-1v4tgzl30n] {
        grid-template-columns: 1fr !important;
        gap: 12px;
    }

    .conf-card[b-1v4tgzl30n] {
        padding: 12px;
        border-radius: 12px;
    }

    .conf-title[b-1v4tgzl30n] {
        font-size: 1rem;
        line-height: 1.2;
        margin-bottom: 10px;
    }

    .conf-subtitle[b-1v4tgzl30n] {
        font-size: 0.92rem;
        line-height: 1.25;
    }

    .radio-group[b-1v4tgzl30n] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

        .radio-group label[b-1v4tgzl30n] {
            display: flex;
            align-items: center;
            gap: 8px;
            line-height: 1.25;
        }

    .hint[b-1v4tgzl30n] {
        font-size: 0.88rem;
        line-height: 1.35;
    }

    /* ===== Blindaje ===== */
    html[b-1v4tgzl30n],
    body[b-1v4tgzl30n] {
        overflow-x: hidden;
    }

    .usuarios-wrap *[b-1v4tgzl30n],
    .modal *[b-1v4tgzl30n] {
        box-sizing: border-box;
        min-width: 0;
        max-width: 100%;
    }
}

.conf-section-title[b-1v4tgzl30n] {
    font-weight: 900;
    font-size: 13px;
    margin: 6px 0 10px 0;
    padding: 6px 10px;
    border-radius: 8px;
    border-left: 4px solid transparent;
    background: #f6f9ff;
}

    .conf-section-title.limites-generales[b-1v4tgzl30n] {
        color: #1d4ed8;
        border-left-color: #1d4ed8;
        background: #eff6ff;
    }

    .conf-section-title.numeros-prohibidos[b-1v4tgzl30n] {
        color: #b91c1c;
        border-left-color: #ef4444;
        background: #fef2f2;
    }

    .conf-section-title.rvta-compartida[b-1v4tgzl30n] {
        color: #7c3aed;
        border-left-color: #8b5cf6;
        background: #f5f3ff;
    }

    .conf-section-title.rvta-solo[b-1v4tgzl30n] {
        color: #b45309;
        border-left-color: #f59e0b;
        background: #fffbeb;
    }
/* _content/SistemaLoteriaDashboard/Components/Banca/VentaAdministrativa.razor.rz.scp.css */
.venta-admin-wrap[b-rap9jp6sag] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.venta-admin-header[b-rap9jp6sag] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #fff;
    border-radius: 22px;
    padding: 20px;
    border: 1px solid #dbe7ff;
}

.venta-admin-title[b-rap9jp6sag] {
    font-size: 2rem;
    font-weight: 1000;
    color: #0b2a55;
}

.venta-admin-subtitle[b-rap9jp6sag] {
    color: #52627a;
    margin-top: 4px;
    font-weight: 750;
}

.venta-admin-badge[b-rap9jp6sag] {
    background: linear-gradient(135deg,#0d47a1,#1e88e5);
    color: #fff;
    padding: 10px 18px;
    border-radius: 999px;
    font-weight: 1000;
}

/* TOP: juegos arriba y fecha a la par de Monazos */
.venta-admin-topbar[b-rap9jp6sag] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.venta-admin-juegos[b-rap9jp6sag] {
    display: flex;
    gap: 10px;
    align-items: center;
}

.juego-btn[b-rap9jp6sag] {
    border: 1px solid #cfe0fb;
    padding: 12px 22px;
    border-radius: 14px;
    background: linear-gradient(180deg,#eef6ff,#e5f0ff);
    color: #0b3a74;
    font-weight: 1000;
    cursor: pointer;
    box-shadow: 0 8px 18px rgba(15, 65, 120, .08);
}

    .juego-btn.active[b-rap9jp6sag] {
        background: linear-gradient(135deg,#0d47a1,#1e88e5);
        color: #fff;
        border-color: #0d47a1;
    }

.venta-admin-fecha[b-rap9jp6sag] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: 4px;
}

    .venta-admin-fecha label[b-rap9jp6sag],
    .venta-admin-field label[b-rap9jp6sag] {
        font-weight: 950;
        color: #0b2a55;
    }

/* Selectores debajo, proporcionales */
.venta-admin-selectores[b-rap9jp6sag] {
    display: flex;
    gap: 14px;
    align-items: end;
    flex-wrap: wrap;
}

.venta-admin-field[b-rap9jp6sag] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.va-select-pro[b-rap9jp6sag] {
    width: auto;
    min-width: 220px;
    max-width: 390px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid #cfe0fb;
    background: linear-gradient(180deg,#ffffff,#f4f8ff);
    color: #0b2a55;
    font-weight: 900;
    padding: 0 14px;
    outline: none;
    box-shadow: 0 8px 18px rgba(15, 65, 120, .06);
}

.va-date-pro[b-rap9jp6sag] {
    min-width: 160px;
    max-width: 180px;
}

.va-select-pro:focus[b-rap9jp6sag] {
    border-color: #1e88e5;
    box-shadow: 0 0 0 4px rgba(30,136,229,.14);
}

/* cuerpo como ventas: panel pequeño + total pegado */
.venta-admin-body[b-rap9jp6sag] {
    display: flex;
    align-items: flex-start;
    gap: 18px;
}

.venta-admin-panel[b-rap9jp6sag] {
    width: 560px;
    max-width: 560px;
    background: #fff;
    border-radius: 18px;
    padding: 14px;
    border: 1px solid #dbe7ff;
    box-shadow: 0 8px 22px rgba(15,23,42,.05);
}

.venta-admin-side[b-rap9jp6sag] {
    width: 210px;
    background: #fff;
    border-radius: 18px;
    padding: 14px;
    border: 1px solid #dbe7ff;
    box-shadow: 0 8px 22px rgba(15,23,42,.05);
}

.side-card[b-rap9jp6sag] {
    padding: 18px;
    border-radius: 18px;
    background: #f4f9ff;
}

.side-label[b-rap9jp6sag] {
    font-weight: 850;
    color: #52627a;
}

.side-total[b-rap9jp6sag] {
    font-size: 2rem;
    font-weight: 1000;
    color: #0d47a1;
}

.btn-guardar[b-rap9jp6sag] {
    width: 100%;
    margin-top: 14px;
    border: none;
    border-radius: 16px;
    padding: 15px;
    background: linear-gradient(135deg,#0d47a1,#1e88e5);
    color: #fff;
    font-weight: 1000;
    cursor: pointer;
}

/* Panel Tiempos */
.va-panel-tiempos[b-rap9jp6sag] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.va-lista[b-rap9jp6sag] {
    border: 2px solid #e0e6f1;
    border-radius: 10px;
    background: #ffffff;
    max-height: 260px;
    min-height: 120px;
    overflow-y: auto;
    overflow-x: hidden;
}

.va-tabla[b-rap9jp6sag] {
    display: block;
    width: 100%;
}

.va-fila[b-rap9jp6sag] {
    display: grid;
    grid-template-columns: 120px 170px 52px;
    width: 100%;
    align-items: center;
}

.va-tabla.reventado .va-fila[b-rap9jp6sag] {
    grid-template-columns: 90px 125px 125px 45px;
}

.va-celda[b-rap9jp6sag] {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 46px;
    padding: 8px 10px;
    border-bottom: 1px solid #e6ecf6;
    font-weight: 900;
    font-size: 19px;
    color: #0b2a55;
    font-variant-numeric: tabular-nums;
}

.va-head .va-celda[b-rap9jp6sag] {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #f7f9fc;
    border-bottom: 2px solid #d9e0ef;
    font-size: 20px;
    color: #1c2b4d;
}

.va-item .va-numero[b-rap9jp6sag] {
    color: #0d47a1;
}

.va-item .va-monto[b-rap9jp6sag] {
    color: #087f3f;
}

.va-item .va-rvta[b-rap9jp6sag] {
    color: #b91c1c;
}

.va-empty[b-rap9jp6sag] {
    min-height: 92px;
    display: grid;
    place-items: center;
    color: #64748b;
    font-weight: 900;
    text-align: center;
    padding: 12px;
}

.va-btn-x[b-rap9jp6sag] {
    position: relative;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 10px;
    background: linear-gradient(180deg,#ff5c5c,#d93636);
    cursor: pointer;
    box-shadow: 0 6px 14px rgba(217,54,54,.25), inset 0 1px 0 rgba(255,255,255,.28);
}

    .va-btn-x[b-rap9jp6sag]::before,
    .va-btn-x[b-rap9jp6sag]::after {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        width: 14px;
        height: 2px;
        background: #fff;
        border-radius: 2px;
        transform-origin: center;
    }

    .va-btn-x[b-rap9jp6sag]::before {
        transform: translate(-50%,-50%) rotate(45deg);
    }

    .va-btn-x[b-rap9jp6sag]::after {
        transform: translate(-50%,-50%) rotate(-45deg);
    }

.va-form[b-rap9jp6sag] {
    border-top: 2px solid #d9e0ef;
    padding-top: 14px;
}

.va-input-linea[b-rap9jp6sag] {
    display: flex;
    gap: 10px;
    justify-content: center;
    flex-wrap: wrap;
}

.va-input[b-rap9jp6sag] {
    padding: 10px 12px;
    font-size: 24px;
    font-weight: 900;
    border: 2px solid #cfd8e3;
    border-radius: 12px;
    text-align: center;
    transition: .2s;
    width: 145px;
    background: #ffffff;
    color: #0b2a55;
}

    .va-input:focus[b-rap9jp6sag] {
        border-color: #1e88e5;
        box-shadow: 0 0 0 4px rgba(30,136,229,.16);
        outline: none;
    }

.va-actions[b-rap9jp6sag] {
    margin-top: 12px;
    display: flex;
    justify-content: center;
}

.va-btn-add[b-rap9jp6sag],
.va-btn-lista-side[b-rap9jp6sag] {
    border: none;
    border-radius: 14px;
    padding: 12px 18px;
    font-weight: 1000;
    cursor: pointer;
}

.va-btn-add[b-rap9jp6sag] {
    background: linear-gradient(90deg,#1976d2,#1e88e5);
    color: white;
}

.va-btn-lista-side[b-rap9jp6sag] {
    width: 100%;
    margin-bottom: 12px;
    background: #eaf3ff;
    color: #0d47a1;
    border: 1px solid #b9d7ff;
}

.va-total[b-rap9jp6sag] {
    margin-top: 12px;
    text-align: right;
    font-size: 20px;
    font-weight: 950;
    color: #003c8f;
}

/* Parley / Monazos temporal */
.venta-admin-grid[b-rap9jp6sag] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px;
}

.grid-head[b-rap9jp6sag] {
    font-weight: 1000;
    color: #0b2a55;
}

.btn-add[b-rap9jp6sag] {
    margin-top: 16px;
    border: none;
    border-radius: 14px;
    padding: 12px 18px;
    background: #eaf3ff;
    font-weight: 1000;
}

/* mensajes */
.venta-admin-msg-backdrop[b-rap9jp6sag] {
    position: fixed;
    inset: 0;
    z-index: 5000;
    background: rgba(15,23,42,.58);
    backdrop-filter: blur(6px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
}

.venta-admin-msg[b-rap9jp6sag] {
    width: min(430px, 94vw);
    background: #ffffff;
    border-radius: 26px;
    padding: 24px;
    text-align: center;
    box-shadow: 0 34px 90px rgba(15,23,42,.38);
}

.venta-admin-msg-icon[b-rap9jp6sag] {
    width: 64px;
    height: 64px;
    margin: 0 auto 12px;
    border-radius: 22px;
    display: grid;
    place-items: center;
    font-size: 2rem;
    font-weight: 1000;
    color: #ffffff;
    background: linear-gradient(135deg,#16a34a,#22c55e);
}

.venta-admin-msg.error .venta-admin-msg-icon[b-rap9jp6sag] {
    background: linear-gradient(135deg,#dc2626,#ef4444);
}

.venta-admin-msg-title[b-rap9jp6sag] {
    font-size: 1.25rem;
    font-weight: 1000;
    color: #0b1220;
}

.venta-admin-msg-text[b-rap9jp6sag] {
    margin-top: 8px;
    white-space: pre-line;
    color: #475569;
    font-weight: 850;
}

.venta-admin-msg-btn[b-rap9jp6sag] {
    margin-top: 18px;
    width: 100%;
    min-height: 46px;
    border: 0;
    border-radius: 15px;
    color: #ffffff;
    font-weight: 1000;
    background: linear-gradient(135deg,#0d47a1,#1e88e5);
}

/* modal ver lista */
.va-lista-overlay[b-rap9jp6sag] {
    position: fixed;
    inset: 0;
    z-index: 7000;
    background: rgba(15,23,42,.58);
    backdrop-filter: blur(5px);
}

.va-modal-lista[b-rap9jp6sag] {
    position: fixed;
    inset: 0;
    margin: auto;
    width: min(1180px, 96vw);
    height: min(720px, 92vh);
    z-index: 7001;
    background: #eaf3fb;
    border: 1px solid #b6d0e8;
    border-radius: 18px;
    padding: 14px;
    box-shadow: 0 28px 80px rgba(15,23,42,.38);
    overflow: auto;
}

.va-modal-close[b-rap9jp6sag] {
    position: sticky;
    top: 0;
    margin-left: auto;
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 10px;
    background: #ffeded;
    color: #b40000;
    font-size: 22px;
    font-weight: 1000;
    cursor: pointer;
    z-index: 5;
}

.va-lista-canvas[b-rap9jp6sag] {
    width: 100%;
    display: flex;
    justify-content: center;
}

.va-lista-normal[b-rap9jp6sag],
.va-lista-rev[b-rap9jp6sag] {
    background: #ffffff;
    border: 1px solid #c7dcf4;
    border-radius: 14px;
    padding: 16px;
    width: 100%;
    box-shadow: 0 10px 24px rgba(15,23,42,.12);
}

.va-lista-normal[b-rap9jp6sag] {
    max-width: 1080px;
}

.va-lista-rev[b-rap9jp6sag] {
    max-width: 1320px;
}

.va-lista-titulo[b-rap9jp6sag] {
    text-align: center;
    color: #0b2a55;
    font-weight: 1000;
    font-size: 1.25rem;
    margin-bottom: 8px;
}

.va-lista-fecha[b-rap9jp6sag],
.va-lista-vendedor[b-rap9jp6sag] {
    font-size: .95rem;
    color: #475569;
    margin-top: 3px;
}

.va-lista-total[b-rap9jp6sag] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    color: #0b2a55;
    font-size: 1.1rem;
    font-weight: 1000;
}

    .va-lista-total.rev[b-rap9jp6sag] {
        flex-wrap: wrap;
    }

    .va-lista-total strong[b-rap9jp6sag] {
        color: #0d47a1;
    }

.va-lista-cabecera[b-rap9jp6sag],
.va-lista-fila[b-rap9jp6sag],
.va-lista-totales-f[b-rap9jp6sag] {
    display: grid;
    align-items: center;
    text-align: center;
}

    .va-lista-cabecera.normal[b-rap9jp6sag],
    .va-lista-fila.normal[b-rap9jp6sag],
    .va-lista-totales-f.normal[b-rap9jp6sag] {
        grid-template-columns: repeat(5, 58px 118px);
    }

    .va-lista-cabecera.rev[b-rap9jp6sag],
    .va-lista-fila.rev[b-rap9jp6sag],
    .va-lista-totales-f.rev[b-rap9jp6sag] {
        grid-template-columns: repeat(5, 50px 94px 72px);
    }

    .va-lista-cabecera > div[b-rap9jp6sag] {
        background: #0d47a1;
        color: white;
        font-weight: 1000;
        padding: 7px 4px;
        border: 1px solid #09316e;
    }

    .va-lista-fila > div[b-rap9jp6sag],
    .va-lista-totales-f > div[b-rap9jp6sag] {
        min-height: 30px;
        padding: 5px 4px;
        border: 1px solid #d6e2f2;
        font-weight: 900;
        font-variant-numeric: tabular-nums;
    }

.va-num[b-rap9jp6sag] {
    background: #f8fbff;
    color: #0d47a1;
}

.va-monto[b-rap9jp6sag] {
    background: #ffffff;
    color: #0f5132;
}

.va-r[b-rap9jp6sag] {
    background: #fff5f5;
    color: #b91c1c;
}

.va-lista-totales-f[b-rap9jp6sag] {
    margin-top: 8px;
}

    .va-lista-totales-f > div[b-rap9jp6sag] {
        background: #eef5ff;
        color: #0b2a55;
    }

/* responsive */
@media (max-width: 900px) {
    .venta-admin-body[b-rap9jp6sag] {
        flex-direction: column;
    }

    .venta-admin-panel[b-rap9jp6sag],
    .venta-admin-side[b-rap9jp6sag] {
        width: 100%;
        max-width: 100%;
    }

    .venta-admin-selectores[b-rap9jp6sag] {
        flex-direction: column;
        align-items: stretch;
    }

    .va-select-pro[b-rap9jp6sag] {
        width: 100%;
        max-width: 100%;
    }
}

@media (max-width: 700px) {
    .venta-admin-header[b-rap9jp6sag] {
        align-items: flex-start;
        gap: 12px;
        flex-direction: column;
    }

    .venta-admin-topbar[b-rap9jp6sag] {
        flex-direction: column;
        align-items: stretch;
    }

    .venta-admin-juegos[b-rap9jp6sag] {
        width: 100%;
        justify-content: space-between;
    }

    .juego-btn[b-rap9jp6sag] {
        flex: 1;
        padding: 11px 8px;
    }

    .venta-admin-fecha[b-rap9jp6sag] {
        width: 100%;
        margin-left: 0;
    }

    .va-date-pro[b-rap9jp6sag] {
        width: 100%;
        max-width: 100%;
    }

    .va-fila[b-rap9jp6sag] {
        grid-template-columns: 95px 135px 46px;
    }

    .va-tabla.reventado .va-fila[b-rap9jp6sag] {
        grid-template-columns: minmax(70px, 1fr) minmax(90px, 1.2fr) minmax(90px, 1.2fr) minmax(34px, .5fr);
    }

    .va-celda[b-rap9jp6sag] {
        font-size: 17px;
        padding: 8px;
    }

    .va-input[b-rap9jp6sag] {
        width: 100%;
        font-size: 20px;
    }

    .va-modal-lista[b-rap9jp6sag] {
        width: calc(100vw - 14px);
        height: 90svh;
        padding: 10px;
    }

    .va-lista-normal[b-rap9jp6sag],
    .va-lista-rev[b-rap9jp6sag] {
        overflow-x: auto;
    }

    .va-lista-cabecera.normal[b-rap9jp6sag],
    .va-lista-fila.normal[b-rap9jp6sag],
    .va-lista-totales-f.normal[b-rap9jp6sag] {
        min-width: 880px;
    }

    .va-lista-cabecera.rev[b-rap9jp6sag],
    .va-lista-fila.rev[b-rap9jp6sag],
    .va-lista-totales-f.rev[b-rap9jp6sag] {
        min-width: 1080px;
    }
}

.va-lista-derecha[b-rap9jp6sag] {
    width: min(1120px, calc(100vw - 810px));
    min-width: 720px;
    max-width: 1120px;
    border-radius: 18px;
    border: 1px solid #cfe0fb;
    background: #f8fbff;
    padding: 12px;
    height: auto;
    max-height: none;
    overflow: visible;
    box-shadow: 0 8px 22px rgba(15,23,42,.05);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.va-lista-derecha-title[b-rap9jp6sag] {
    text-align: center;
    font-weight: 1000;
    color: #0b2a55;
    font-size: 1.05rem;
    line-height: 1.2;
    margin-bottom: 4px;
}

.va-lista-derecha-total[b-rap9jp6sag] {
    text-align: center;
    margin: 4px 0 10px;
    font-weight: 1000;
    color: #0d47a1;
}

    .va-lista-derecha-total.rev[b-rap9jp6sag] {
        display: flex;
        justify-content: center;
        gap: 14px;
        flex-wrap: wrap;
    }

.va-lista-derecha-head[b-rap9jp6sag],
.va-lista-derecha-row[b-rap9jp6sag],
.va-lista-derecha-foot[b-rap9jp6sag] {
    display: grid;
    align-items: center;
    text-align: center;
    justify-content: center;
}

    .va-lista-derecha-head.normal[b-rap9jp6sag],
    .va-lista-derecha-row.normal[b-rap9jp6sag],
    .va-lista-derecha-foot.normal[b-rap9jp6sag] {
        grid-template-columns: repeat(5, 48px 120px);
    }

    .va-lista-derecha-head.rev[b-rap9jp6sag],
    .va-lista-derecha-row.rev[b-rap9jp6sag],
    .va-lista-derecha-foot.rev[b-rap9jp6sag] {
        grid-template-columns: repeat(5, 42px 86px 72px);
    }

    .va-lista-derecha-head > div[b-rap9jp6sag] {
        background: linear-gradient(180deg,#0d47a1,#0b3a83);
        color: white;
        font-weight: 1000;
        padding: 5px 4px;
        border: 1px solid #09316e;
    }

    .va-lista-derecha-num[b-rap9jp6sag],
    .va-lista-derecha-mon[b-rap9jp6sag],
    .va-lista-derecha-r[b-rap9jp6sag],
    .va-lista-derecha-foot > div[b-rap9jp6sag] {
        min-height: 24px;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #d6e2f2;
        font-weight: 900;
        font-variant-numeric: tabular-nums;
    }

.va-lista-derecha-num[b-rap9jp6sag] {
    background: #eef6ff;
    color: #0d47a1;
}

.va-lista-derecha-mon[b-rap9jp6sag] {
    background: #ffffff;
    color: #087f3f;
}

.va-lista-derecha-r[b-rap9jp6sag] {
    background: #fff5f5;
    color: #b91c1c;
}

.va-lista-derecha-foot[b-rap9jp6sag] {
    margin-top: 8px;
}

    .va-lista-derecha-foot > div[b-rap9jp6sag] {
        background: #eaf3ff;
        color: #0b2a55;
    }

@media (max-width: 1300px) {
    .va-lista-derecha[b-rap9jp6sag] {
        width: 100%;
        min-width: 720px;
    }
}

.va-lista-derecha-head.normal[b-rap9jp6sag],
.va-lista-derecha-row.normal[b-rap9jp6sag],
.va-lista-derecha-foot.normal[b-rap9jp6sag],
.va-lista-derecha-head.rev[b-rap9jp6sag],
.va-lista-derecha-row.rev[b-rap9jp6sag],
.va-lista-derecha-foot.rev[b-rap9jp6sag] {
    margin-left: auto;
    margin-right: auto;
}
/* _content/SistemaLoteriaDashboard/Components/Layout/MainLayout.razor.rz.scp.css */
.app-shell[b-d4799dx4fl] {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    min-height: 100dvh;
    box-sizing: border-box;
}

.page[b-d4799dx4fl] {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 100dvh;
}

main[b-d4799dx4fl] {
    flex: 1;
}

.sidebar[b-d4799dx4fl] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-d4799dx4fl] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-d4799dx4fl]  a, .top-row[b-d4799dx4fl]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-d4799dx4fl]  a:hover, .top-row[b-d4799dx4fl]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-d4799dx4fl]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-d4799dx4fl] {
        justify-content: space-between;
    }

    .top-row[b-d4799dx4fl]  a, .top-row[b-d4799dx4fl]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-d4799dx4fl] {
        flex-direction: row;
    }

    .sidebar[b-d4799dx4fl] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-d4799dx4fl] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-d4799dx4fl]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-d4799dx4fl], article[b-d4799dx4fl] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-d4799dx4fl] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-d4799dx4fl] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* _content/SistemaLoteriaDashboard/Components/Shared/PanelNoticias.razor.rz.scp.css */
/* ===========================
   PANEL DE NOTICIAS (derecha)
   =========================== */
.panel-noticias[b-oltototfaa] {
    position: relative;
    width: 520px;
    background: #f7fbff;
    border: 2px solid #e0e6f1;
    border-radius: 12px;
    padding: 14px 16px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
    height: auto;
    z-index: 10;
    margin-top: 0;
    margin-left: 0;
}

    .panel-noticias .header[b-oltototfaa] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        margin-bottom: 10px;
    }

        .panel-noticias .header h3[b-oltototfaa] {
            margin: 0;
            font-size: 1.25rem;
            font-weight: 900;
            color: #0d47a1;
            letter-spacing: .3px;
        }

    .panel-noticias .acciones[b-oltototfaa] {
        display: flex;
        gap: 8px;
    }

.btn-icono[b-oltototfaa] {
    border: 1px solid #c5d6f2;
    background: #e9f2ff;
    border-radius: 8px;
    padding: 6px 10px;
    font-weight: 700;
    cursor: pointer;
    transition: .2s;
}

    .btn-icono:hover[b-oltototfaa] {
        background: #d9eaff;
    }

.noticias-scroll[b-oltototfaa] {
    max-height: 520px;
    overflow-y: auto;
    padding-right: 6px;
    scrollbar-gutter: stable;
}

.noticia-card[b-oltototfaa] {
    background: #ffffff;
    border: 2px solid #e6edf8;
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 10px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.04);
    transition: transform .15s ease, box-shadow .2s ease;
}

    .noticia-card:hover[b-oltototfaa] {
        transform: translateY(-1px);
        box-shadow: 0 6px 16px rgba(0,0,0,0.08);
    }

.noticia-top[b-oltototfaa] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 6px;
}

.noticia-titulo[b-oltototfaa] {
    font-weight: 900;
    font-size: 1.05rem;
    color: #153e75;
    margin: 0;
}

.badges[b-oltototfaa] {
    display: flex;
    gap: 6px;
    align-items: center;
}

.badge[b-oltototfaa] {
    padding: 3px 8px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 800;
}

.badge-todos[b-oltototfaa] {
    background: #e8f5e9;
    color: #1b5e20;
    border: 1px solid #c8e6c9;
}

.badge-priv[b-oltototfaa] {
    background: #fff3e0;
    color: #e65100;
    border: 1px solid #ffe0b2;
}

.badge-fecha[b-oltototfaa] {
    background: #e3f2fd;
    color: #0d47a1;
    border: 1px solid #bbdefb;
}

/* ✅ Nuevo */
.badge-nuevo[b-oltototfaa] {
    margin-left: 8px;
    background: #e8f1ff;
    color: #0d47a1;
    border: 1px solid #bbdefb;
}

.noticia-body[b-oltototfaa] {
    color: #334155;
    line-height: 1.45;
    white-space: pre-wrap;
    margin-bottom: 8px;
}

.noticia-acciones[b-oltototfaa] {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.btn-cerrar[b-oltototfaa] {
    background: #ffe5e5;
    color: #b71c1c;
    border: 1px solid #ffcdd2;
    border-radius: 8px;
    padding: 6px 10px;
    font-weight: 800;
    cursor: pointer;
    transition: .2s;
}

    .btn-cerrar:hover[b-oltototfaa] {
        background: #ffcccc;
    }

.noticia-leida[b-oltototfaa] {
    opacity: .55;
}

.noticia-no-leida[b-oltototfaa] {
    opacity: 1;
}
/* _content/SistemaLoteriaDashboard/Components/Shared/SafeSectionBoundary.razor.rz.scp.css */
.sl-safe-boundary[b-ve3a1bme37] {
    margin: 12px;
    padding: 14px 16px;
    border: 1px solid #f5c2c7;
    background: #fff5f5;
    border-radius: 8px;
    color: #842029;
}

.sl-safe-boundary-title[b-ve3a1bme37] {
    font-weight: 700;
    margin-bottom: 6px;
}

.sl-safe-boundary-msg[b-ve3a1bme37] {
    margin: 0 0 10px;
    font-size: 0.95rem;
}

.sl-safe-boundary-btn[b-ve3a1bme37] {
    padding: 6px 14px;
    border-radius: 6px;
    border: 1px solid #842029;
    background: #fff;
    cursor: pointer;
    font-weight: 600;
}
/* _content/SistemaLoteriaDashboard/Components/Ventas/BorrarTiqueteModal.razor.rz.scp.css */
body[b-xlhohak2zh] {
}
.rt-backdrop[b-xlhohak2zh] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    z-index: 9998;
}

.rt-modal[b-xlhohak2zh] {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: min(1050px, 95vw);
    max-height: 92vh;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 20px 60px rgba(0,0,0,.25);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    /* ✅ borde más oscuro para que destaque */
    border: 1px solid #7ea6df;
}

.rt-header[b-xlhohak2zh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    background: #d8e7ff;
    /* ✅ borde más oscuro */
    border-bottom: 1px solid #7ea6df;
}

.rt-title[b-xlhohak2zh] {
    display: flex;
    gap: 10px;
    align-items: center;
}

.rt-icon[b-xlhohak2zh] {
    font-size: 22px;
}

.rt-h1[b-xlhohak2zh] {
    font-weight: 900;
    color: #0b3b91;
    font-size: 18px;
}

.rt-h2[b-xlhohak2zh] {
    font-weight: 700;
    color: #0b3b91;
    opacity: .85;
    font-size: 13px;
}

.rt-close[b-xlhohak2zh] {
    width: 34px;
    height: 34px;
    border: 1px solid #7ea6df; /* ✅ */
    border-radius: 10px;
    background: #ffffff;
    cursor: pointer;
    font-weight: 900;
}

.rt-tools[b-xlhohak2zh] {
    display: flex;
    gap: 12px;
    padding: 12px 16px;
    background: #f6f9ff;
    /* ✅ borde más oscuro */
    border-bottom: 1px solid #7ea6df;
    flex-wrap: wrap;
    align-items: flex-end;
}

.rt-field[b-xlhohak2zh] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

    .rt-field label[b-xlhohak2zh] {
        font-size: 12px;
        font-weight: 800;
        color: #153e75;
    }

/* ✅ Fecha más grande */
.rt-date .rt-input[b-xlhohak2zh] {
    height: 44px;
    font-size: 16px;
    font-weight: 800;
    padding: 0 12px;
}

/* ✅ inputs con borde más oscuro */
.rt-input[b-xlhohak2zh] {
    height: 38px;
    border: 1px solid #7ea6df;
    border-radius: 10px;
    padding: 0 10px;
    outline: none;
}

    .rt-input:focus[b-xlhohak2zh] {
        border-color: #1d6fe8;
        box-shadow: 0 0 0 3px rgba(29,111,232,.18);
    }

/* ✅ BUSCADOR: input pequeño y botón al lado */
.rt-buscar[b-xlhohak2zh] {
    flex: 1;
    min-width: 320px;
    display: flex;
    flex-direction: column;
}

.rt-buscar-row[b-xlhohak2zh] {
    display: flex;
    gap: 10px;
    align-items: center;
}

.rt-searchbox[b-xlhohak2zh] {
    flex: 0 1 420px; /* ✅ no tan grande */
    height: 34px; /* ✅ más pequeño */
    font-size: 13px;
    padding: 0 10px;
}

/* ✅ botón buscar cuadrado */
.rt-btn[b-xlhohak2zh] {
    height: 34px;
    width: 42px;
    border: 1px solid #0f55bf; /* borde para que se note */
    border-radius: 10px;
    background: #1d6fe8;
    color: #fff;
    font-weight: 900;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    .rt-btn span[b-xlhohak2zh] {
        display: none; /* ✅ ocultamos texto si lo tienes */
    }

    .rt-btn i[b-xlhohak2zh], .rt-btn .rt-btn-ico[b-xlhohak2zh] {
        font-size: 16px; /* ✅ icono visible */
        line-height: 1;
    }

.rt-body[b-xlhohak2zh] {
    padding: 12px 16px;
    overflow: auto;
}

.rt-loading[b-xlhohak2zh], .rt-empty[b-xlhohak2zh] {
    padding: 18px;
    border: 1px dashed #7ea6df; /* ✅ */
    border-radius: 12px;
    background: #fbfdff;
    color: #153e75;
    font-weight: 800;
}

.rt-table[b-xlhohak2zh] {
    width: 100%;
}

/* ✅ filas con bordes más oscuros */
.rt-row[b-xlhohak2zh] {
    display: grid;
    grid-template-columns: 90px 80px 110px 110px 1.6fr 120px 60px;
    gap: 0;
    align-items: center;
    border: 1px solid #7ea6df; /* ✅ */
    border-radius: 10px;
    margin-bottom: 8px;
    overflow: hidden;
    cursor: pointer;
}

.rt-head[b-xlhohak2zh] {
    background: #1b73d1;
    color: #fff;
    font-weight: 900;
    cursor: default;
    border-color: #1b73d1;
}

.rt-row > div[b-xlhohak2zh] {
    padding: 10px 10px;
    background: #fff;
    border-right: 1px solid #d0def4; /* ✅ separadores un poquito más notables */
}

    .rt-row > div:last-child[b-xlhohak2zh] {
        border-right: none;
    }

.rt-head > div[b-xlhohak2zh] {
    background: transparent;
    border-right: 1px solid rgba(255,255,255,.25);
}

/* ✅ selección MUY visible */
/* ✅ SELECCIÓN CLARAMENTE VISIBLE */
.rt-row.rt-selected[b-xlhohak2zh] {
    background: #cfe0ff; /* fondo fuerte */
    border-color: #1d6fe8; /* borde azul intenso */
    box-shadow: inset 0 0 0 2px #1d6fe8, /* borde interno */
    0 4px 12px rgba(29,111,232,.35); /* sombra externa */
}

    /* ✅ Celdas internas también se resaltan */
    .rt-row.rt-selected > div[b-xlhohak2zh] {
        background: #e8f0ff !important;
        font-weight: 900;
        color: #0b3b91;
    }

    /* ✅ Barra lateral de selección */
    .rt-row.rt-selected[b-xlhohak2zh]::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 6px;
        background: #1d6fe8;
    }



/* ✅ hover para ver mejor el foco */
.rt-row:not(.rt-head):hover[b-xlhohak2zh] {
    outline: 2px solid rgba(29,111,232,.20);
}

.rt-col-print[b-xlhohak2zh] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.rt-print[b-xlhohak2zh] {
    width: 36px;
    height: 30px;
    border: 1px solid #1b8a35; /* ✅ */
    border-radius: 8px;
    background: #33b14a;
    color: #fff;
    cursor: pointer;
}

.rt-hide[b-xlhohak2zh] {
    display: none !important;
}

.rt-footer[b-xlhohak2zh] {
    padding: 12px 16px;
    border-top: 1px solid #7ea6df; /* ✅ */
    display: flex;
    justify-content: flex-end;
    background: #fff;
}

.rt-btn-sec[b-xlhohak2zh] {
    background: #e9f1ff;
    color: #0b3b91;
    border: 1px solid #7ea6df;
}

/* ✅ Buscador: número más grande + negrita */
.rt-searchbox[b-xlhohak2zh] {
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .3px;
}

/* ✅ Botón buscar: más pequeño y cuadrado */
.rt-buscar-row .rt-btn[b-xlhohak2zh] {
    width: 38px;
    min-width: 38px;
    padding: 0;
}

/* ✅ Bordes más oscuros para que se noten */
.rt-row[b-xlhohak2zh] {
    border-color: #a9bddf;
    position: relative;
}

    .rt-row > div[b-xlhohak2zh] {
        border-right: 1px solid #a9bddf;
    }

        .rt-row > div:last-child[b-xlhohak2zh] {
            border-right: none;
        }

    .rt-row.rt-selected[b-xlhohak2zh]::before {
        pointer-events: none;
    }
}

.rt-del[b-xlhohak2zh] {
    border: 0;
    background: transparent;
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    padding: 4px 6px;
}

    .rt-del:hover[b-xlhohak2zh] {
        transform: scale(1.08);
    }
/* _content/SistemaLoteriaDashboard/Components/Ventas/ConfiguracionPuesto.razor.rz.scp.css */
.cfg-wrap[b-5wbwpc1qlv] {
    padding: 18px;
}

.cfg-header[b-5wbwpc1qlv] {
    margin-bottom: 14px;
}

.cfg-title[b-5wbwpc1qlv] {
    font-size: 22px;
    font-weight: 900;
    letter-spacing: .2px;
}

.cfg-sub[b-5wbwpc1qlv] {
    margin-top: 4px;
    font-size: 14px;
    opacity: .9;
}

.cfg-grid[b-5wbwpc1qlv] {
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: 14px;
    align-items: start;
}

.cfg-card[b-5wbwpc1qlv] {
    background: #ffffff;
    border: 1px solid #dbe3f1;
    border-radius: 14px;
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.10);
    padding: 14px;
}

.cfg-card-title[b-5wbwpc1qlv] {
    font-size: 16px;
    font-weight: 900;
    margin-bottom: 10px;
}

.cfg-loading[b-5wbwpc1qlv] {
    font-weight: 800;
    opacity: .8;
}

.cfg-error[b-5wbwpc1qlv] {
    color: #b91c1c;
    font-weight: 900;
    background: #fee2e2;
    border: 1px solid #fecaca;
    padding: 10px;
    border-radius: 10px;
}

.cfg-form[b-5wbwpc1qlv] {
    display: grid;
    gap: 12px;
}

.cfg-field[b-5wbwpc1qlv] {
    display: grid;
    gap: 6px;
}

.cfg-label[b-5wbwpc1qlv] {
    font-size: 13px;
    font-weight: 900;
    opacity: .9;
}

.cfg-input[b-5wbwpc1qlv], .cfg-textarea[b-5wbwpc1qlv] {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    padding: 12px 12px;
    font-size: 16px;
    font-weight: 800;
    outline: none;
    background: #fbfdff;
}

.cfg-textarea[b-5wbwpc1qlv] {
    min-height: 110px;
    resize: vertical;
    line-height: 1.25;
}

    .cfg-input:focus[b-5wbwpc1qlv], .cfg-textarea:focus[b-5wbwpc1qlv] {
        border-color: #2563eb;
        box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.15);
    }

.cfg-hint[b-5wbwpc1qlv] {
    font-size: 12px;
    opacity: .8;
    font-weight: 700;
}

.cfg-actions[b-5wbwpc1qlv] {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 4px;
}

.cfg-btn[b-5wbwpc1qlv] {
    border: none;
    border-radius: 12px;
    padding: 11px 14px;
    font-size: 15px;
    font-weight: 900;
    cursor: pointer;
    background: #2563eb;
    color: #fff;
}

    .cfg-btn:disabled[b-5wbwpc1qlv] {
        opacity: .65;
        cursor: not-allowed;
    }

.cfg-ok[b-5wbwpc1qlv] {
    font-weight: 900;
    color: #0f766e;
}

/* ===== Preview ===== */
.cfg-preview[b-5wbwpc1qlv] {
    display: grid;
    gap: 10px;
    justify-items: center;
    padding: 6px 0;
}

.cfg-ticket-preview[b-5wbwpc1qlv] {
    padding: 8px;
    border-radius: 14px;
    border: 1px dashed #94a3b8;
    background: #f8fafc;
}

    /* IMPORTANTE: limitamos el estilo del ticket SOLO a esta página */
    .cfg-ticket-preview #pos-ticket[b-5wbwpc1qlv] {
        width: var(--posWidth, 260px);
        margin: 0 auto;
    }

/* responsive */
@media (max-width: 1100px) {
    .cfg-grid[b-5wbwpc1qlv] {
        grid-template-columns: 1fr;
    }
}
/* _content/SistemaLoteriaDashboard/Components/Ventas/ConsultaFacturas.razor.rz.scp.css */
/* =========================
   CONSULTA FACTURAS (CF) - HEADER COMO (CG) + UI MÁS GRANDE (+2px TODO)
   ========================= */

.cf-root[b-4qtll9qrpb] {
    padding: 22px 26px 30px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* Header limpio tipo CG */
.cf-hero[b-4qtll9qrpb] {
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
    margin-top: 0;
}

.cf-hero-title[b-4qtll9qrpb] {
    display: flex;
    flex-direction: column;
    gap: 6px; /* +2 visual */
}

/* 🔹 TÍTULO */
.cf-h1[b-4qtll9qrpb] {
    margin: 0;
    font-size: 32px; /* 30 → 32 */
    font-weight: 900;
    letter-spacing: .2px;
}

/* 🔹 SUBTÍTULO */
.cf-h2[b-4qtll9qrpb] {
    margin: 0;
    font-size: 16px; /* 14 → 16 */
    font-weight: 800;
    opacity: .78;
    letter-spacing: .2px;
}

/* =========================
   FILTROS
   ========================= */

.cf-filters[b-4qtll9qrpb] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px; /* +2 visual */
    padding: 12px;
    border: 1px solid rgba(0,0,0,.12);
    border-radius: 14px;
    background: #fff;
    align-items: flex-start;
}

.cf-block[b-4qtll9qrpb] {
    display: flex;
    flex-direction: column;
    gap: 8px; /* 6 → 8 */
    min-width: 150px;
}

/* bloque botón */
.cf-block-btn[b-4qtll9qrpb] {
    display: flex;
    align-items: flex-end;
}

.cf-grow[b-4qtll9qrpb] {
    flex: 0 0 auto;
    min-width: 240px;
}

/* 🔹 LABELS */
.cf-label[b-4qtll9qrpb] {
    font-size: 14px; /* 12 → 14 */
    font-weight: 900;
    opacity: .85;
    letter-spacing: .2px;
}

/* 🔹 INPUTS / FECHAS */
.cf-input[b-4qtll9qrpb] {
    height: 44px; /* 42 → 44 */
    border: 1px solid rgba(0,0,0,.18);
    border-radius: 12px;
    padding: 0 14px; /* +2 */
    outline: none;
    font-size: 16px; /* 14 → 16 */
    font-weight: 800;
}

/* 🔹 SELECT */
.cf-select[b-4qtll9qrpb] {
    font-size: 16px; /* 14 → 16 */
    font-weight: 850;
}

    .cf-select option[b-4qtll9qrpb] {
        font-size: 18px; /* 16 → 18 */
        font-weight: 800;
    }

/* =========================
   BOTÓN BUSCAR
   ========================= */

.cf-btn[b-4qtll9qrpb] {
    height: 44px; /* 42 → 44 */
    border: none;
    border-radius: 12px;
    padding: 0 20px; /* +2 */
    font-size: 16px; /* NUEVO (+2 implícito) */
    font-weight: 950;
    cursor: pointer;
    background: linear-gradient(180deg, #0f172a, #0b1220);
    color: white;
    box-shadow: 0 14px 26px rgba(15,23,42,.18);
    transition: transform .12s ease, box-shadow .12s ease;
}

    .cf-btn:hover[b-4qtll9qrpb] {
        transform: translateY(-1px);
        box-shadow: 0 18px 34px rgba(15,23,42,.22);
    }

/* 🔵 azul */
.cf-btn-blue[b-4qtll9qrpb] {
    background: linear-gradient(180deg, #2563eb, #1d4ed8);
    box-shadow: 0 14px 30px rgba(37,99,235,.30);
}

    .cf-btn-blue:hover[b-4qtll9qrpb] {
        box-shadow: 0 18px 40px rgba(37,99,235,.35);
    }

/* ajuste vertical */
.cf-block button.cf-btn[b-4qtll9qrpb] {
    margin-top: 24px; /* 22 → 24 */
}

/* =========================
   RADIOS
   ========================= */

.cf-radio[b-4qtll9qrpb] {
    display: flex;
    gap: 16px; /* 14 → 16 */
    align-items: center;
    height: 44px; /* 42 → 44 */
}

    .cf-radio label[b-4qtll9qrpb] {
        display: flex;
        align-items: center;
        gap: 8px;
        font-weight: 850;
        font-size: 16px; /* 14 → 16 */
    }

.cf-disabled[b-4qtll9qrpb] {
    opacity: .5;
}

/* =========================
   CARDS
   ========================= */

.cf-actions[b-4qtll9qrpb] {
    display: grid;
    grid-template-columns: repeat(4, minmax(220px, 1fr));
    gap: 14px;
}

@media (max-width: 1200px) {
    .cf-actions[b-4qtll9qrpb] {
        grid-template-columns: repeat(2, minmax(220px, 1fr));
    }
}

@media (max-width: 640px) {
    .cf-actions[b-4qtll9qrpb] {
        grid-template-columns: 1fr;
    }
}

.cf-card[b-4qtll9qrpb] {
    text-align: left;
    padding: 16px; /* 14 → 16 */
    border-radius: 16px;
    border: 1px solid rgba(0,0,0,.12);
    background: #fff;
    cursor: pointer;
    transition: transform .08s ease, box-shadow .12s ease, border-color .12s ease;
    box-shadow: 0 10px 22px rgba(15,23,42,.06);
}

    .cf-card:hover[b-4qtll9qrpb] {
        border-color: rgba(59,130,246,.28);
        box-shadow: 0 14px 30px rgba(59,130,246,.10);
    }

    .cf-card:active[b-4qtll9qrpb] {
        transform: scale(.99);
    }

    .cf-card:disabled[b-4qtll9qrpb] {
        opacity: .55;
        cursor: not-allowed;
    }

/* cabecera card */
.cf-card-top[b-4qtll9qrpb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

/* pill VER */
.cf-card-pill[b-4qtll9qrpb] {
    min-width: 56px; /* +2 */
    height: 30px; /* 28 → 30 */
    padding: 0 12px;
    border-radius: 999px;
    font-weight: 950;
    font-size: 14px; /* 12 → 14 */
    color: rgba(15,23,42,.85);
    background: linear-gradient(180deg, #ffffff, #f2f4f8);
    border: 1px solid rgba(15,23,42,.14);
}

/* títulos card */
.cf-card-title[b-4qtll9qrpb] {
    font-weight: 950;
    font-size: 18px; /* 16 → 18 */
    color: #0f172a;
}

.cf-card-sub[b-4qtll9qrpb] {
    font-size: 14px; /* 12 → 14 */
    opacity: .75;
    margin-top: 6px;
    font-weight: 750;
}

/* =========================
   ERROR
   ========================= */

.cf-error[b-4qtll9qrpb] {
    padding: 12px 14px; /* +2 */
    border-radius: 12px;
    background: #ffecec;
    border: 1px solid #ffbcbc;
    color: #8a0d0d;
    font-weight: 800;
    font-size: 16px; /* NUEVO */
}

/* =========================
   SELECT SORTEOS
   ========================= */

.cf-select[b-4qtll9qrpb] {
    width: 320px;
    max-width: 100%;
}
/* _content/SistemaLoteriaDashboard/Components/Ventas/ConsultaGeneral.razor.rz.scp.css */
/* =========================
   CONSULTAS TOTALES (CG)
   ========================= */

.cg-header[b-mynz86p08s] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 14px;
}

.cg-shell[b-mynz86p08s] {
    width: 100%;
    max-width: none;
    padding: 22px 26px 30px;
    box-sizing: border-box;
}

.cg-title[b-mynz86p08s] {
    margin: 0;
    font-size: 30px;
    font-weight: 900;
    letter-spacing: .2px;
}

/* =========================
   FILTROS
   ========================= */
.cg-filters[b-mynz86p08s] {
    display: flex;
    align-items: flex-end;
    gap: 14px;
    flex-wrap: wrap;
    padding: 16px 16px;
    border-radius: 18px;
    background: rgba(255,255,255,.80);
    border: 1px solid rgba(15,23,42,.14); /* 🔥 un poco más oscuro */
    box-shadow: 0 18px 40px rgba(15,23,42,.12);
    backdrop-filter: blur(10px);
}

.cg-field[b-mynz86p08s] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 220px;
}

.cg-label[b-mynz86p08s] {
    font-size: 14px;
    font-weight: 900;
    opacity: .78;
    letter-spacing: .2px;
}

/* Fechas: SlDateInput (mismo patrón que Consulta Facturas / Sorteos) */
.cg-date-field[b-mynz86p08s]  .sl-date-wrap {
    width: 100%;
    display: block;
}

.cg-date-field[b-mynz86p08s]  input.sl-date-input {
    width: 100%;
    height: 46px;
    padding: 0 14px;
    padding-right: 42px !important;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, .18);
    background: #fff;
    outline: none;
    font-size: 16px;
    font-weight: 800;
    box-sizing: border-box;
    font-variant-numeric: tabular-nums;
    letter-spacing: .06em;
}

.cg-date-field[b-mynz86p08s]  input.sl-date-input:focus {
    border-color: rgba(37, 99, 235, .70);
    box-shadow: 0 0 0 4px rgba(37, 99, 235, .16);
}

/* =========================
   BOTÓN VER
   ========================= */
.cg-btn[b-mynz86p08s] {
    height: 46px;
    padding: 0 18px;
    border-radius: 14px;
    border: none;
    cursor: pointer;
    font-weight: 900;
    font-size: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: linear-gradient(180deg,#2563eb,#1d4ed8);
    color: #fff;
    box-shadow: 0 16px 34px rgba(37,99,235,.25);
    transition: transform .12s ease, box-shadow .12s ease, opacity .12s ease;
    white-space: nowrap;
}

    .cg-btn:hover[b-mynz86p08s] {
        transform: translateY(-1px);
        box-shadow: 0 20px 44px rgba(37,99,235,.28);
    }

    .cg-btn:disabled[b-mynz86p08s] {
        opacity: .65;
        cursor: not-allowed;
        transform: none;
        box-shadow: none;
    }

.cg-btn-ico[b-mynz86p08s] {
    font-size: 18px;
    filter: drop-shadow(0 8px 14px rgba(0,0,0,.18));
}

/* =========================
   MENSAJES
   ========================= */
.cg-hint[b-mynz86p08s] {
    margin-top: 14px;
    padding: 12px;
    border-radius: 14px;
    border: 1px dashed rgba(148,163,184,.65);
    background: rgba(2,132,199,.06);
}

.cg-alert[b-mynz86p08s] {
    margin-top: 14px;
    padding: 12px;
    border-radius: 14px;
    border: 1px solid rgba(148,163,184,.45);
    background: rgba(15,23,42,.03);
}

    .cg-alert .t[b-mynz86p08s] {
        font-weight: 900;
        margin-bottom: 4px;
    }

    .cg-alert .m[b-mynz86p08s] {
        opacity: .85;
    }

.cg-alert-danger[b-mynz86p08s] {
    border-color: rgba(239,68,68,.40);
    background: rgba(239,68,68,.08);
}

.cg-alert-soft[b-mynz86p08s] {
    border-color: rgba(148,163,184,.45);
    background: rgba(2,132,199,.04);
}

/* =========================
   MODAL FULL SCREEN
   ========================= */
.cg-modal-overlay[b-mynz86p08s] {
    position: fixed;
    inset: 0;
    background: rgba(2,6,23,.55);
    backdrop-filter: blur(6px);
    z-index: 5000;
}

.cg-modal[b-mynz86p08s] {
    position: fixed;
    inset: 18px;
    border-radius: 18px;
    background: rgba(255,255,255,.98);
    border: 1px solid rgba(148,163,184,.40);
    box-shadow: 0 30px 80px rgba(2,6,23,.35);
    z-index: 5100;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.cg-close[b-mynz86p08s] {
    position: absolute;
    top: 10px;
    right: 12px;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    border: 1px solid rgba(148,163,184,.45);
    background: rgba(255,255,255,.95);
    font-size: 22px;
    cursor: pointer;
}

/* =========================
   CABECERA MODAL + CHIPS
   ========================= */
.cg-modal-head[b-mynz86p08s] {
    padding: 18px 18px 10px 18px;
    border-bottom: 1px solid rgba(148,163,184,.45);
    background: linear-gradient(180deg, rgba(59,130,246,.12), rgba(15,23,42,.02));
}

.cg-modal-title[b-mynz86p08s] {
    font-size: 18px;
    font-weight: 950;
}

.cg-modal-sub[b-mynz86p08s] {
    margin-top: 4px;
    opacity: .85;
    font-weight: 800;
}

.cg-chips[b-mynz86p08s] {
    margin-top: 12px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.cg-chip[b-mynz86p08s] {
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(148,163,184,.45); /* 🔥 bordes más visibles */
    background: rgba(255,255,255,.92);
    box-shadow: 0 10px 25px rgba(15,23,42,.08);
    min-width: 150px;
}

    .cg-chip .k[b-mynz86p08s] {
        font-size: 12px;
        opacity: .80;
        font-weight: 900;
    }

    .cg-chip .v[b-mynz86p08s] {
        margin-top: 2px;
        font-size: 16px;
        font-weight: 950;
    }

/* chips suaves (Ahorro / Retiro / Dep) */
.cg-chip-soft[b-mynz86p08s] {
    background: rgba(2,132,199,.06);
}

/* chip fuerte (Saldo final) */
.cg-chip-strong[b-mynz86p08s] {
    background: linear-gradient(180deg, rgba(16,185,129,.18), rgba(15,23,42,.02));
    border-color: rgba(16,185,129,.35);
}

/* ✅ COLORES DE VALORES EN CHIPS (ARRIBA) */
.cg-chip-venta .v[b-mynz86p08s] {
    color: #1e40af;
}
/* azul */
.cg-chip-comi .v[b-mynz86p08s] {
    color: #0284c7;
}
/* celeste */
.cg-chip-prem .v[b-mynz86p08s] {
    color: #dc2626;
}
/* rojo */
.cg-chip-ahorro .v[b-mynz86p08s] {
    color: #7c3aed;
}
/* morado agradable */
.cg-chip-retiro .v[b-mynz86p08s] {
    color: #b45309;
}
/* ámbar/café */
.cg-chip-dep .v[b-mynz86p08s] {
    color: #0f766e;
}
/* teal */

/* ✅ SALDO FINAL ARRIBA (chip) - OSCURO */
.cg-chip-strong .v.saldo-pos[b-mynz86p08s] {
    color: #065f46;
}

.cg-chip-strong .v.saldo-neg[b-mynz86p08s] {
    color: #991b1b;
}

/* =========================
   TABLA
   ========================= */
.cg-table-wrap[b-mynz86p08s] {
    padding: 14px 18px 18px 18px;
    overflow: auto;
    height: 100%;
    border-top: 1px solid rgba(148,163,184,.45); /* 🔥 separador visible */
}

.cg-table[b-mynz86p08s] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    min-width: 1100px;
    margin: 0;
}

    .cg-table thead th[b-mynz86p08s] {
        position: sticky;
        top: 0;
        z-index: 2;
        background: #0f172a;
        color: #fff;
        font-weight: 950;
        font-size: 17px;
        padding: 15px 12px;
        border-bottom: 2px solid rgba(255,255,255,.14); /* 🔥 línea más marcada */
    }

    .cg-table th.num[b-mynz86p08s],
    .cg-table td.num[b-mynz86p08s] {
        text-align: right;
        font-variant-numeric: tabular-nums;
    }

    .cg-table tbody td[b-mynz86p08s] {
        padding: 14px 12px;
        font-size: 18px;
        font-weight: 850;
        border-bottom: 1px solid rgba(148,163,184,.55); /* 🔥 bordes más oscuros */
        background: rgba(255,255,255,.78);
    }

    .cg-table tbody tr:nth-child(even) td[b-mynz86p08s] {
        background: rgba(248,250,252,.95);
    }

    .cg-table tbody tr:nth-child(odd) td[b-mynz86p08s] {
        background: rgba(37,99,235,.10);
    }

    .cg-table tbody tr:hover td[b-mynz86p08s] {
        background: rgba(59,130,246,.22) !important;
    }

    /* columnas de valores (como en consulta sorteos) */
    .cg-table td.venta[b-mynz86p08s] {
        color: #1e40af;
        font-weight: 950;
    }

    .cg-table td.comi[b-mynz86p08s] {
        color: #0284c7;
        font-weight: 950;
    }

    .cg-table td.prem[b-mynz86p08s] {
        color: #dc2626;
        font-weight: 950;
    }

    .cg-table td.soft[b-mynz86p08s] {
        color: #475569;
        opacity: .90;
        font-weight: 850;
    }
    /* gris bonito */

    /* =========================
   ✅ SALDOS
   ========================= */

    /* ✅ Saldo por día = CLARO
   - cubre ambos casos: (pos/neg) y (saldo-pos/saldo-neg)
*/
    .cg-table td.saldo.pos[b-mynz86p08s],
    .cg-table td.saldo.saldo-pos[b-mynz86p08s] {
        color: rgba(5,150,105,1); /* verde claro */
        font-weight: 950;
    }

    .cg-table td.saldo.neg[b-mynz86p08s],
    .cg-table td.saldo.saldo-neg[b-mynz86p08s] {
        color: rgba(220,38,38,1); /* rojo claro */
        font-weight: 950;
    }

    /* =========================
   FOOTER (TOTAL GENERAL)
   ========================= */
    .cg-table tfoot td[b-mynz86p08s] {
        padding: 14px 12px;
        font-weight: 950;
        font-size: 18px;
        background: linear-gradient(180deg, rgba(15,23,42,.22), rgba(15,23,42,.14));
        border-top: 2px solid rgba(15,23,42,.26);
    }

    .cg-table .total-label[b-mynz86p08s] {
        text-transform: uppercase;
        letter-spacing: .5px;
    }

    /* ✅ Saldo final del TOTAL GENERAL = OSCURO */
    .cg-table tfoot .saldo-pos[b-mynz86p08s] {
        color: #065f46;
        font-weight: 950;
    }

    .cg-table tfoot .saldo-neg[b-mynz86p08s] {
        color: #991b1b;
        font-weight: 950;
    }

.cg-cancelado[b-mynz86p08s] {
    margin-top: 4px;
    color: #dc2626;
    font-weight: 800;
    font-size: 12px;
    line-height: 1;
}

.prestamo-tomado .cg-cancelado[b-mynz86p08s] {
    white-space: nowrap;
}


/* =========================
   TOGGLES CONSULTA GENERAL
   ========================= */
.cg-toggles[b-mynz86p08s] {
    margin-top: 14px;
    padding: 14px;
    border-radius: 16px;
    border: 1px solid rgba(148,163,184,.40);
    background: rgba(255,255,255,.88);
    box-shadow: 0 10px 24px rgba(15,23,42,.08);
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;
}

.cg-toggles-head[b-mynz86p08s] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-bottom: 4px;
}

.cg-toggles-title[b-mynz86p08s] {
    font-weight: 900;
    font-size: 14px;
    color: #0f172a;
}

.cg-toggles-actions[b-mynz86p08s] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.cg-toggle-btn[b-mynz86p08s] {
    border: none;
    border-radius: 12px;
    padding: 8px 12px;
    font-weight: 900;
    cursor: pointer;
    background: linear-gradient(180deg,#2563eb,#1d4ed8);
    color: #fff;
}

.cg-toggle-btn-soft[b-mynz86p08s] {
    background: #e2e8f0;
    color: #0f172a;
}

.cg-check[b-mynz86p08s] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 12px;
    background: rgba(248,250,252,.95);
    border: 1px solid rgba(148,163,184,.35);
    font-weight: 800;
    white-space: nowrap;
}

    .cg-check input[b-mynz86p08s] {
        width: 16px;
        height: 16px;
        accent-color: #2563eb;
    }
/* _content/SistemaLoteriaDashboard/Components/Ventas/ConsultaSorteos.razor.rz.scp.css */
/* ======= LAYOUT FULL WIDTH + ZOOM FRIENDLY ======= */
.cs-shell[b-rhkq3vc24a] {
    width: 100%;
    max-width: none;
    padding: 22px 26px 30px;
    box-sizing: border-box;
}

/* ======= HEADER ======= */
.cs-header[b-rhkq3vc24a] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.cs-title[b-rhkq3vc24a] {
    margin: 0;
    font-size: 30px;
    font-weight: 900;
    letter-spacing: .2px;
}

.cs-subtitle[b-rhkq3vc24a] {
    display: none;
}

/* ======= FILTERS ======= */
.cs-filters[b-rhkq3vc24a] {
    display: flex;
    align-items: flex-end;
    gap: 14px;
    flex-wrap: wrap;
    padding: 16px 16px;
    border-radius: 18px;
    background: rgba(255,255,255,.80);
    border: 1px solid rgba(15, 23, 42, .12);
    box-shadow: 0 18px 40px rgba(15, 23, 42, .12);
    backdrop-filter: blur(10px);
}

.cs-field[b-rhkq3vc24a] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 220px;
}

.cs-label[b-rhkq3vc24a] {
    font-size: 14px;
    font-weight: 900;
    opacity: .78;
    letter-spacing: .2px;
}

.cs-select[b-rhkq3vc24a], .cs-date[b-rhkq3vc24a] {
    height: 46px;
    padding: 0 14px;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, .18);
    background: #fff;
    outline: none;
    font-size: 16px;
    font-weight: 800;
}

    .cs-select:focus[b-rhkq3vc24a], .cs-date:focus[b-rhkq3vc24a] {
        border-color: rgba(37, 99, 235, .70);
        box-shadow: 0 0 0 4px rgba(37,99,235,.16);
    }

/* ======= BUTTONS ======= */
.cs-btn[b-rhkq3vc24a] {
    height: 46px;
    padding: 0 18px;
    border-radius: 14px;
    border: none;
    cursor: pointer;
    font-weight: 900;
    font-size: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: linear-gradient(180deg, #2563eb, #1d4ed8);
    color: #fff;
    box-shadow: 0 16px 34px rgba(37,99,235,.25);
    transition: transform .12s ease, box-shadow .12s ease, opacity .12s ease;
    white-space: nowrap;
    align-self: flex-end;
}

    .cs-btn:hover[b-rhkq3vc24a] {
        transform: translateY(-1px);
        box-shadow: 0 20px 44px rgba(37,99,235,.28);
    }

    .cs-btn:disabled[b-rhkq3vc24a] {
        opacity: .65;
        cursor: not-allowed;
        transform: none;
        box-shadow: none;
    }

.cs-btn-icon[b-rhkq3vc24a] {
    font-size: 18px;
    filter: drop-shadow(0 8px 14px rgba(0,0,0,.18));
}

/* Botón alternativo (Históricos) */
.cs-btn-alt[b-rhkq3vc24a] {
    background: linear-gradient(180deg, #0f172a, #111827);
    box-shadow: 0 16px 34px rgba(2, 6, 23, .22);
}

    .cs-btn-alt:hover[b-rhkq3vc24a] {
        box-shadow: 0 20px 44px rgba(2, 6, 23, .28);
    }

/* ======= INFO STATES ======= */
.cs-hint[b-rhkq3vc24a] {
    margin-top: 16px;
    padding: 14px 16px;
    border-radius: 16px;
    border: 1px dashed rgba(15,23,42,.22);
    background: rgba(255,255,255,.62);
    font-size: 15px;
    font-weight: 700;
}

.cs-alert[b-rhkq3vc24a] {
    margin-top: 16px;
    padding: 14px 16px;
    border-radius: 16px;
    border: 1px solid rgba(15,23,42,.12);
    background: rgba(255,255,255,.75);
}

.cs-alert-title[b-rhkq3vc24a] {
    font-weight: 900;
    margin-bottom: 4px;
    font-size: 16px;
}

.cs-alert-msg[b-rhkq3vc24a] {
    font-size: 14px;
    opacity: .88;
    font-weight: 700;
}

.cs-alert-danger[b-rhkq3vc24a] {
    border-color: rgba(239,68,68,.26);
    background: rgba(239,68,68,.08);
}

.cs-alert-soft[b-rhkq3vc24a] {
    background: rgba(59,130,246,.07);
    border-color: rgba(59,130,246,.20);
}

/* ======= CARD ======= */
.cs-card[b-rhkq3vc24a] {
    margin-top: 16px;
    border-radius: 20px;
    background: rgba(255,255,255,.82);
    border: 1px solid rgba(15, 23, 42, .10);
    box-shadow: 0 22px 52px rgba(15, 23, 42, .14);
    overflow: hidden;
}

.cs-card-top[b-rhkq3vc24a] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 16px 12px;
    border-bottom: 1px solid rgba(15, 23, 42, .08);
    background: linear-gradient(180deg, rgba(248,250,252,.98), rgba(255,255,255,.76));
}

.cs-card-title[b-rhkq3vc24a] {
    font-weight: 950;
    font-size: 18px;
}

.cs-card-sub[b-rhkq3vc24a] {
    margin-top: 4px;
    font-size: 14px;
    opacity: .80;
    font-weight: 800;
}

/* Totals chips */
.cs-totals[b-rhkq3vc24a] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.cs-total-chip[b-rhkq3vc24a] {
    min-width: 150px;
    padding: 12px 14px;
    border-radius: 16px;
    background: rgba(255,255,255,.90);
    border: 1px solid rgba(15,23,42,.10);
    box-shadow: 0 14px 28px rgba(15,23,42,.10);
    text-align: right;
}

    .cs-total-chip .k[b-rhkq3vc24a] {
        font-size: 12px;
        font-weight: 950;
        opacity: .65;
        letter-spacing: .2px;
    }

    .cs-total-chip .v[b-rhkq3vc24a] {
        margin-top: 2px;
        font-size: 18px;
        font-weight: 950;
        letter-spacing: .2px;
    }

.cs-total-chip-strong[b-rhkq3vc24a] {
    border-color: rgba(34,197,94,.22);
    background: rgba(34,197,94,.10);
}

/* ======= TABLE ======= */
.cs-table-wrap[b-rhkq3vc24a] {
    width: 100%;
    overflow: auto;
    box-sizing: border-box;
    padding: 0;
    scrollbar-gutter: stable both-edges;
}

.cs-table[b-rhkq3vc24a] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    min-width: 980px;
    margin: 0;
}

    /* Cabecera */
    .cs-table thead th[b-rhkq3vc24a] {
        position: sticky;
        top: 0;
        z-index: 2;
        background: #0f172a;
        color: #fff;
        font-weight: 950;
        font-size: 16px;
        padding: 14px 12px;
        border-bottom: 1px solid rgba(255,255,255,.12);
    }

        .cs-table thead th:first-child[b-rhkq3vc24a] {
            border-top-left-radius: 14px;
        }

        .cs-table thead th:last-child[b-rhkq3vc24a] {
            border-top-right-radius: 14px;
        }

    /* ✅ FILAS PRINCIPALES: más marcadas (fuerte + claro) */
    .cs-table tbody td[b-rhkq3vc24a] {
        padding: 14px 12px;
        font-size: 17px;
        font-weight: 800;
        border-bottom: 1px solid rgba(15,23,42,.14); /* ✅ más oscuro */
        background: transparent;
    }

    .cs-table tbody tr:nth-child(odd) td[b-rhkq3vc24a] {
        background: rgba(37, 99, 235, .16); /* ✅ más fuerte */
    }

    .cs-table tbody tr:nth-child(even) td[b-rhkq3vc24a] {
        background: rgba(37, 99, 235, .09); /* ✅ más claro */
    }

    /* Hover visible */
    .cs-table tbody tr:hover td[b-rhkq3vc24a] {
        background: rgba(59,130,246,.22) !important;
    }

    /* Footer */
    .cs-table tfoot td[b-rhkq3vc24a] {
        padding: 14px 12px;
        font-weight: 950;
        font-size: 17px;
        background: rgba(15, 23, 42, .16);
        border-top: 2px solid rgba(15, 23, 42, .22);
    }

.name .cs-name[b-rhkq3vc24a] {
    font-weight: 950;
    font-size: 15px;
}

.cs-mini[b-rhkq3vc24a] {
    display: none;
}

.num[b-rhkq3vc24a] {
    text-align: right;
    font-variant-numeric: tabular-nums;
    font-weight: 950;
}

.venta[b-rhkq3vc24a] {
    opacity: .98;
}

.comi[b-rhkq3vc24a] {
    opacity: .95;
}

.prem[b-rhkq3vc24a] {
    opacity: .95;
}

.saldo[b-rhkq3vc24a] {
    color: #047857;
}

.win[b-rhkq3vc24a] {
    text-align: center;
    width: 170px;
}

.act[b-rhkq3vc24a] {
    text-align: center;
    width: 90px;
}

/* Ganador pill */
.cs-pill[b-rhkq3vc24a] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px; /* ✅ para bola al lado */
    min-width: 70px;
    height: 38px;
    padding: 0 14px;
    border-radius: 999px;
    font-weight: 900;
    font-size: 18px;
    letter-spacing: .8px;
    color: #7a0f14;
    background: radial-gradient(circle at 20% 20%, rgba(255,255,255,.9), rgba(255,255,255,0) 55%), linear-gradient(180deg, #ffd6d6, #ff9a9a);
    border: 1px solid rgba(122,15,20,.25);
    box-shadow: 0 14px 26px rgba(220,38,38,.25), 0 8px 16px rgba(15,23,42,.12);
    position: relative;
    overflow: hidden;
    animation: csPulse-b-rhkq3vc24a 1.8s ease-in-out infinite;
}

    .cs-pill[b-rhkq3vc24a]::after {
        content: "";
        position: absolute;
        top: -40%;
        left: -60%;
        width: 45%;
        height: 180%;
        transform: rotate(18deg);
        background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.45), rgba(255,255,255,0));
        animation: csShine-b-rhkq3vc24a 3s ease-in-out infinite;
        pointer-events: none;
    }

@keyframes csPulse-b-rhkq3vc24a {
    0%,100% {
        transform: translateY(0) scale(1);
    }

    50% {
        transform: translateY(-1px) scale(1.04);
    }
}

@keyframes csShine-b-rhkq3vc24a {
    0% {
        left: -55%;
        opacity: 0;
    }

    15% {
        opacity: .85;
    }

    55% {
        opacity: .35;
    }

    100% {
        left: 120%;
        opacity: 0;
    }
}

.cs-muted[b-rhkq3vc24a] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 52px;
    height: 32px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px dashed rgba(15,23,42,.25);
    background: rgba(15,23,42,.04);
    opacity: .7;
    font-weight: 900;
}

/* Icon button */
.cs-icon[b-rhkq3vc24a] {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    border: 1px solid rgba(15,23,42,.14);
    background: rgba(255,255,255,.90);
    cursor: pointer;
    transition: transform .12s ease, box-shadow .12s ease;
    font-size: 18px;
}

    .cs-icon:hover[b-rhkq3vc24a] {
        transform: translateY(-1px);
        box-shadow: 0 14px 28px rgba(15,23,42,.14);
    }

.total-label[b-rhkq3vc24a] {
    font-weight: 950;
}

/* ===========================
   ✅ BOLITA ROJA / BLANCA / MIX
   =========================== */
.cs-bola[b-rhkq3vc24a] {
    width: 16px;
    height: 16px;
    border-radius: 999px;
    display: inline-block;
    flex: 0 0 16px;
    border: 1px solid rgba(15,23,42,.25);
    box-shadow: 0 10px 18px rgba(15,23,42,.18);
    position: relative;
    transform: translateZ(0);
    animation: bolaFloat-b-rhkq3vc24a 1.2s ease-in-out infinite;
}

    .cs-bola[b-rhkq3vc24a]::after {
        content: "";
        position: absolute;
        inset: 2px auto auto 3px;
        width: 6px;
        height: 6px;
        border-radius: 999px;
        background: rgba(255,255,255,.85);
        filter: blur(.2px);
    }

.cs-bola-roja[b-rhkq3vc24a] {
    background: radial-gradient(circle at 30% 30%, #fff, rgba(255,255,255,.15) 30%), linear-gradient(180deg, #ff4d4d, #b91c1c);
    border-color: rgba(185, 28, 28, .45);
}

.cs-bola-blanca[b-rhkq3vc24a] {
    background: radial-gradient(circle at 30% 30%, #fff, rgba(255,255,255,.25) 30%), linear-gradient(180deg, #ffffff, #e5e7eb);
    border-color: rgba(148,163,184,.55);
}

.cs-bola-mix[b-rhkq3vc24a] {
    background: linear-gradient(90deg, #b91c1c 0 50%, #e5e7eb 50% 100%);
    border-color: rgba(15,23,42,.28);
}

@keyframes bolaFloat-b-rhkq3vc24a {
    0%,100% {
        transform: translateY(0) scale(1);
    }

    50% {
        transform: translateY(-2px) scale(1.06);
    }
}

@media (prefers-reduced-motion: reduce) {
    .cs-pill[b-rhkq3vc24a],
    .cs-bola[b-rhkq3vc24a] {
        animation: none !important;
    }
}

/* ================================
   GANADOR (ARRIBA) - SOLO MODAL LISTA
   ================================ */
#modalLista .cs-win-pill[b-rhkq3vc24a] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px; /* ✅ para la bola */
    padding: 8px 14px;
    border-radius: 999px;
    font-weight: 950;
    letter-spacing: .5px;
    line-height: 1;
    transform: translateZ(0);
}

    #modalLista .cs-win-pill.cs-win-soft-red[b-rhkq3vc24a] {
        font-size: 1.15rem;
        color: #8b1b1b;
        background: linear-gradient(180deg, #ffe9e9, #ffd0d0);
        border: 1px solid rgba(183, 28, 28, 0.28);
        box-shadow: 0 10px 22px rgba(183, 28, 28, 0.14);
        animation: csWinGlow-b-rhkq3vc24a 1.2s ease-in-out infinite alternate;
    }

@keyframes csWinGlow-b-rhkq3vc24a {
    from {
        transform: scale(1);
        filter: saturate(1);
    }

    to {
        transform: scale(1.04);
        filter: saturate(1.15);
    }
}

@media (prefers-reduced-motion: reduce) {
    #modalLista .cs-win-pill.cs-win-soft-red[b-rhkq3vc24a] {
        animation: none !important;
    }
}

/* ==========================================
   GANADOR EN LISTA (00..99) - SOLO MODAL
   ========================================== */
#modalLista .celda-num.ganador[b-rhkq3vc24a] {
    background: linear-gradient(180deg, #fff0f0, #ffdede);
    border: 1px solid rgba(183,28,28,.35);
    color: #8b1b1b;
    font-weight: 950;
    font-size: 15px;
    box-shadow: 0 10px 22px rgba(183, 28, 28, 0.12);
    animation: csCellPulse-b-rhkq3vc24a 1.1s ease-in-out infinite alternate;
}

#modalLista .celda-monto.ganador-monto[b-rhkq3vc24a] {
    background: linear-gradient(180deg, #fff7e7, #ffe0a8);
    border: 1px solid rgba(198, 130, 0, 0.35);
    color: #7a3c00;
    font-weight: 950;
    font-size: 14px;
    box-shadow: 0 10px 22px rgba(198, 130, 0, 0.12);
    animation: csCellPulse-b-rhkq3vc24a 1.1s ease-in-out infinite alternate;
}

@keyframes csCellPulse-b-rhkq3vc24a {
    from {
        transform: scale(1);
        filter: brightness(1);
    }

    to {
        transform: scale(1.05);
        filter: brightness(1.05);
    }
}

@media (prefers-reduced-motion: reduce) {
    #modalLista .celda-num.ganador[b-rhkq3vc24a],
    #modalLista .celda-monto.ganador-monto[b-rhkq3vc24a] {
        animation: none !important;
    }
}

/* ===========================
   PARLEY EN MODAL
   =========================== */
.lista-unica-parley[b-rhkq3vc24a] {
    width: fit-content;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0 auto;
}

    .lista-unica-parley .fila-cabecera.parley[b-rhkq3vc24a],
    .lista-unica-parley .fila-numeros.parley[b-rhkq3vc24a] {
        display: grid;
        grid-template-columns: repeat(5, 90px 95px);
        column-gap: 4px;
        row-gap: 4px;
        justify-content: center;
    }

    .lista-unica-parley .celda-num.parley[b-rhkq3vc24a] {
        font-size: 13px;
        font-weight: 900;
    }

    .lista-unica-parley .celda-num.ganador[b-rhkq3vc24a],
    .lista-unica-parley .celda-monto.ganador-monto[b-rhkq3vc24a] {
        animation: winnerPulse-b-rhkq3vc24a 1.2s ease-in-out infinite;
        border-color: rgba(220, 38, 38, .45);
        box-shadow: 0 10px 24px rgba(220, 38, 38, .18);
    }

@keyframes winnerPulse-b-rhkq3vc24a {
    0% {
        transform: translateY(0) scale(1);
        filter: saturate(1);
    }

    50% {
        transform: translateY(-1px) scale(1.03);
        filter: saturate(1.05);
    }

    100% {
        transform: translateY(0) scale(1);
        filter: saturate(1);
    }
}

/* ===========================
   Z-INDEX: MODALES
   =========================== */

/* overlay histórico */
.modal-overlay-hist[b-rhkq3vc24a] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    z-index: 2200;
}

/* overlay lista (debe ir encima del histórico) */
.modal-overlay[b-rhkq3vc24a] {
    z-index: 2300 !important;
}

/* modal lista encima */
.modal-lista[b-rhkq3vc24a], #modalLista[b-rhkq3vc24a] {
    z-index: 2310 !important;
}

/* ===========================
   MODAL HISTÓRICOS (PEQUEÑO)
   =========================== */
.modal-hist[b-rhkq3vc24a] {
    position: fixed;
    inset: 50% auto auto 50%;
    transform: translate(-50%, -50%);
    width: min(680px, calc(100vw - 28px));
    max-width: 680px;
    background: rgba(255,255,255,.96);
    border-radius: 20px;
    box-shadow: 0 30px 80px rgba(15,23,42,.40);
    border: 1px solid rgba(148,163,184,.35);
    z-index: 2210;
    padding: 22px 24px 20px;
    backdrop-filter: blur(10px);
}

.hist-title .t1[b-rhkq3vc24a] {
    font-size: 26px;
    font-weight: 950;
}

.hist-title .t2[b-rhkq3vc24a] {
    margin-top: 4px;
    color: #64748b;
    font-size: 15px;
    font-weight: 800;
}

.hist-grid[b-rhkq3vc24a] {
    margin-top: 14px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 120px;
    gap: 14px;
    align-items: end;
}

.hist-field label[b-rhkq3vc24a] {
    display: block;
    font-size: 13px;
    color: #475569;
    margin-bottom: 6px;
    font-weight: 800;
}

.hist-field input[b-rhkq3vc24a] {
    width: 100%;
    height: 52px;
    border-radius: 14px;
    font-size: 18px;
    font-weight: 800;
}

.hist-field select[b-rhkq3vc24a] {
    width: 100%;
    height: 48px;
    border-radius: 14px;
    border: 1px solid rgba(148,163,184,.55);
    padding: 0 12px;
    font-size: 17px;
    font-weight: 800;
    outline: none;
    background: rgba(255,255,255,.92);
}

    .hist-field input:focus[b-rhkq3vc24a],
    .hist-field select:focus[b-rhkq3vc24a] {
        border-color: rgba(37, 99, 235, .55);
        box-shadow: 0 0 0 4px rgba(37,99,235,.14);
    }

.hist-actions[b-rhkq3vc24a] {
    display: flex;
    justify-content: stretch;
}

    .hist-actions .hist-btn[b-rhkq3vc24a] {
        width: 100%;
    }

.modal-hist .hist-actions .cs-btn[b-rhkq3vc24a] {
    height: 48px;
    border-radius: 14px;
    font-size: 17px;
    padding: 0 22px;
}

/* ===== Barra título lista: izquierda + derecha ===== */
.titulo-bar[b-rhkq3vc24a] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}

    .titulo-bar .der[b-rhkq3vc24a] {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        justify-content: flex-end;
        align-items: center;
    }

    .titulo-bar .tag[b-rhkq3vc24a] {
        min-height: 34px;
        padding: 6px 12px;
        border-radius: 999px;
        background: linear-gradient(180deg, #f8fafc, #e2e8f0);
        border: 1px solid rgba(148,163,184,.45);
        font-size: 14px;
        font-weight: 900;
        color: #d48a00;
        box-shadow: 0 8px 18px rgba(15,23,42,.08);
    }

        .titulo-bar .tag b[b-rhkq3vc24a] {
            font-size: 16px;
            font-weight: 1000;
        }

    .titulo-bar .tag-neto[b-rhkq3vc24a] {
        background: linear-gradient(180deg, #ecfdf5, #d1fae5);
        border-color: rgba(16,185,129,.35);
    }
/* ===========================
   MODAL RESUMEN HISTÓRICO (FULL SCREEN)
   =========================== */
.modal-hist.modal-hist-wide[b-rhkq3vc24a] {
    inset: 12px !important;
    transform: none !important;
    width: auto !important;
    height: auto !important;
    max-height: none !important;
    overflow: hidden;
    border-radius: 18px;
    padding: 18px 18px 14px;
}

    /* tabla ocupa el espacio y NO se corre */
    .modal-hist.modal-hist-wide .cs-table-wrap[b-rhkq3vc24a] {
        height: calc(100vh - 170px) !important;
        max-height: none !important;
        overflow: auto !important;
        border-radius: 14px;
        border: 1px solid rgba(148,163,184,.28);
        background: rgba(255,255,255,.72);
        box-shadow: inset 0 0 0 1px rgba(15,23,42,.03);
        padding: 0 !important;
        scrollbar-gutter: stable both-edges;
    }

        /* scrollbar moderno */
        .modal-hist.modal-hist-wide .cs-table-wrap[b-rhkq3vc24a]::-webkit-scrollbar {
            width: 10px;
            height: 10px;
        }

        .modal-hist.modal-hist-wide .cs-table-wrap[b-rhkq3vc24a]::-webkit-scrollbar-thumb {
            background: rgba(15,23,42,.22);
            border-radius: 999px;
            border: 2px solid rgba(255,255,255,.70);
        }

        .modal-hist.modal-hist-wide .cs-table-wrap[b-rhkq3vc24a]::-webkit-scrollbar-track {
            background: rgba(15,23,42,.06);
            border-radius: 999px;
        }

    /* tabla premium */
    .modal-hist.modal-hist-wide .cs-table[b-rhkq3vc24a] {
        min-width: 980px;
        border-spacing: 0;
        margin: 0;
    }

        /* cabecera */
        .modal-hist.modal-hist-wide .cs-table thead th[b-rhkq3vc24a] {
            background: linear-gradient(180deg, #0f172a, #111827);
            font-size: 17px;
            padding: 15px 12px;
            letter-spacing: .2px;
            box-shadow: 0 8px 20px rgba(0,0,0,.18);
        }

        /* texto filas */
        .modal-hist.modal-hist-wide .cs-table tbody td[b-rhkq3vc24a] {
            font-size: 18px;
            padding: 14px 12px;
        }

    /* nombre sorteo */
    .modal-hist.modal-hist-wide .name .cs-name[b-rhkq3vc24a] {
        font-size: 16px;
    }

/* Saldo por fila (normal) */
.saldo-pos[b-rhkq3vc24a] {
    color: #047857;
    font-weight: 950;
}

.saldo-neg[b-rhkq3vc24a] {
    color: #dc2626;
    font-weight: 950;
}

/* Saldo del TOTAL (más oscuro) */
.cs-table tfoot .saldo-pos[b-rhkq3vc24a] {
    color: #065f46;
}

.cs-table tfoot .saldo-neg[b-rhkq3vc24a] {
    color: #991b1b;
}

/* ===== Botón cerrar ===== */
.modal-lista-actions[b-rhkq3vc24a] {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 8px;
}

.cs-modal-print[b-rhkq3vc24a] {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    border: 1px solid rgba(37, 99, 235, 0.35);
    background: #eff6ff;
    color: #1d4ed8;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.cs-modal-print:hover[b-rhkq3vc24a] {
    background: #dbeafe;
}

.modal-lista-actions .modal-close[b-rhkq3vc24a] {
    position: static;
}

.modal-fox-qr[b-rhkq3vc24a] {
    z-index: 2400 !important;
    max-width: 520px !important;
    width: min(520px, 96vw) !important;
    height: auto !important;
    max-height: 92vh !important;
    transform: translate(-50%, -50%) !important;
}

.modal-fox-qr .fox-qr-stack[b-rhkq3vc24a] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    padding: 8px 12px 16px;
}

.modal-fox-qr .fox-qr-img[b-rhkq3vc24a] {
    width: 320px;
    max-width: 100%;
    border: 1px solid rgba(148, 163, 184, 0.35);
    border-radius: 12px;
    background: #fff;
    padding: 10px;
    box-sizing: border-box;
}

.modal-fox-qr .fox-qr-actions[b-rhkq3vc24a] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
}

.fox-qr-modo-toggle[b-rhkq3vc24a] {
    display: flex;
    gap: 8px;
    justify-content: center;
    flex-wrap: wrap;
}

.fox-qr-modo-btn[b-rhkq3vc24a] {
    min-width: 96px;
    height: 36px;
    padding: 0 14px;
    border-radius: 10px;
    border: 1px solid rgba(37, 99, 235, 0.35);
    background: #fff;
    color: #1d4ed8;
    font-weight: 900;
    font-size: 13px;
    cursor: pointer;
}

.fox-qr-modo-btn.active[b-rhkq3vc24a] {
    background: #1d4ed8;
    color: #fff;
    border-color: #1d4ed8;
}

.modal-close[b-rhkq3vc24a] {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 40px;
    height: 40px;
    border: none;
    background: transparent;
    font-size: 22px;
    font-weight: 900;
    cursor: pointer;
    color: #ef4444;
}

    .modal-close:hover[b-rhkq3vc24a] {
        filter: brightness(.9);
    }

/* ✅ FORZAR FULL SCREEN SOLO PARA "Resumen histórico" */
.modal-resumen-hist[b-rhkq3vc24a] {
    position: fixed !important;
    inset: 12px !important;
    transform: none !important;
    width: auto !important;
    height: auto !important;
    max-width: none !important;
    max-height: none !important;
    overflow: hidden !important;
    border-radius: 18px !important;
}

    /* ✅ La tabla usa TODO el alto */
    .modal-resumen-hist .cs-table-wrap[b-rhkq3vc24a] {
        height: calc(100vh - 170px) !important;
        max-height: none !important;
        overflow: auto !important;
    }

/* ✅ HISTÓRICO: 2 TONOS alternados */
.modal-hist-wide .cs-table tbody td[b-rhkq3vc24a] {
    background: transparent !important;
}

.modal-hist-wide .cs-table tbody tr:nth-child(odd) td[b-rhkq3vc24a] {
    background: rgba(37, 99, 235, .18) !important;
}

.modal-hist-wide .cs-table tbody tr:nth-child(even) td[b-rhkq3vc24a] {
    background: rgba(37, 99, 235, .11) !important;
}

.modal-hist-wide .cs-table tbody tr:hover td[b-rhkq3vc24a] {
    background: rgba(59, 130, 246, .22) !important;
}

.hist-btn[b-rhkq3vc24a] {
    height: 52px;
    border-radius: 14px;
    font-size: 18px;
    padding: 0 24px;
    min-width: 110px;
}

.cs-sub[b-rhkq3vc24a] {
    font-size: .82rem;
    opacity: .75;
    margin-top: 2px;
    white-space: nowrap;
}

/* =========================
   TIEMPOS (Modal) - Reventado
   (ENCERRADO SOLO EN #modalLista para evitar duplicados)
========================= */

/* ===== Medidas exactas de la grilla (deben ser iguales en TODO) ===== */
#modalLista[b-rhkq3vc24a] {
    --w-num: 90px;
    --w-monto: 95px;
    --w-r: 95px;
    --gap-col: 4px;
}

    #modalLista .fila-cabecera[b-rhkq3vc24a],
    #modalLista .fila-numeros[b-rhkq3vc24a] {
        display: grid;
        grid-template-columns: repeat(5, 90px 95px);
        column-gap: 4px;
        row-gap: 4px;
        justify-content: center;
        align-items: center;
    }

        /* ===== Reventado: MISMO ANCHO para cabecera + filas + totales ===== */
        #modalLista .fila-cabecera.cabecera-reventado[b-rhkq3vc24a],
        #modalLista .fila-numeros.fila-reventado[b-rhkq3vc24a],
        #modalLista .fila-totales-f.totales-reventado[b-rhkq3vc24a] {
            grid-template-columns: repeat(5, var(--w-num) var(--w-monto) var(--w-r)) !important;
            column-gap: var(--gap-col) !important;
            width: max-content !important;
            margin-left: auto !important;
            margin-right: auto !important;
            justify-content: center !important;
        }

        /* headers */
        #modalLista .fila-cabecera .h-num[b-rhkq3vc24a],
        #modalLista .fila-cabecera .h-monto[b-rhkq3vc24a],
        #modalLista .fila-cabecera .h-r[b-rhkq3vc24a] {
            height: 26px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: 900;
            font-size: 13px;
            color: #fff;
            border-radius: 10px;
        }

        #modalLista .fila-cabecera .h-num[b-rhkq3vc24a] {
            background: linear-gradient(180deg,#2563eb,#1d4ed8);
        }

        #modalLista .fila-cabecera .h-monto[b-rhkq3vc24a] {
            background: linear-gradient(180deg,#16a34a,#15803d);
        }

        #modalLista .fila-cabecera .h-r[b-rhkq3vc24a] {
            background: linear-gradient(180deg,#ef4444,#dc2626);
        }

    /* celdas */
    #modalLista .celda-num[b-rhkq3vc24a] {
        height: 26px;
        border-radius: 10px;
        border: 1px solid rgba(37,99,235,.22);
        background: linear-gradient(180deg, rgba(37,99,235,.14), rgba(37,99,235,.08));
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 13px;
        font-weight: 950;
        color: #1d4ed8;
    }

    #modalLista .celda-monto[b-rhkq3vc24a] {
        height: 26px;
        border-radius: 10px;
        border: 1px solid rgba(22,163,74,.22);
        background: linear-gradient(180deg, rgba(22,163,74,.14), rgba(22,163,74,.08));
        display: flex;
        align-items: center;
        justify-content: flex-end;
        padding-right: 10px;
        font-size: 13px;
        font-weight: 950;
        font-variant-numeric: tabular-nums;
        color: #15803d;
    }

    #modalLista .celda-monto-r[b-rhkq3vc24a] {
        height: 26px;
        border-radius: 10px;
        border: 1px solid rgba(220,38,38,.22);
        background: linear-gradient(180deg, rgba(239,68,68,.16), rgba(239,68,68,.08));
        display: flex;
        align-items: center;
        justify-content: flex-end;
        padding-right: 10px;
        font-size: 13px;
        font-weight: 950;
        font-variant-numeric: tabular-nums;
        color: #b91c1c;
    }

    /* ganador (en la grilla) */
    #modalLista .celda-num.ganador[b-rhkq3vc24a] {
        background: linear-gradient(180deg,#fff0f0,#ffdede);
        border: 1px solid rgba(183,28,28,.35);
        color: #8b1b1b;
        font-weight: 950;
    }

    #modalLista .celda-monto.ganador-monto[b-rhkq3vc24a] {
        background: linear-gradient(180deg,#fff7e7,#ffe0a8);
        border: 1px solid rgba(198,130,0,.35);
        color: #7a3c00;
        font-weight: 950;
    }

    #modalLista .celda-monto-r.ganador-monto-r[b-rhkq3vc24a] {
        background: #ffd0d0;
        border-color: #e35d5b;
        color: #7a0000;
    }

    /* =========================
   Totales Normal
========================= */
    #modalLista .fila-totales-f[b-rhkq3vc24a] {
        width: fit-content;
        margin: 6px auto 0;
        display: grid;
        grid-template-columns: repeat(5, 90px 95px);
        column-gap: 4px;
        row-gap: 6px;
        justify-content: center;
        align-items: center;
    }

        #modalLista .fila-totales-f .label[b-rhkq3vc24a] {
            font-size: 13px;
            font-weight: 950;
            color: #1d4ed8;
        }

        #modalLista .fila-totales-f .valor[b-rhkq3vc24a] {
            margin-top: 4px;
            font-size: 16px;
            font-weight: 1000;
            color: #0b1220;
            font-variant-numeric: tabular-nums;
        }

        /* =========================
   Totales Reventado (ALINEADO A COLUMNAS)
========================= */
        #modalLista .fila-totales-f.totales-reventado[b-rhkq3vc24a] {
            display: grid;
            grid-template-columns: repeat(5, 90px 95px 95px) !important;
            /* ✅ igual que la grilla de arriba */
            column-gap: 4px;
            row-gap: 6px;
            align-items: center;
            /* ✅ CLAVE: que el ancho sea el mismo “tipo” de ancho que la grilla */
            width: max-content;
            margin: 10px auto 0;
            /* ✅ igual que .fila-numeros (centrado real) */
            justify-content: center;
        }

            /* label debajo de N° */
            #modalLista .fila-totales-f.totales-reventado .t-label[b-rhkq3vc24a] {
                height: 34px;
                display: flex;
                align-items: center;
                justify-content: center;
                border-radius: 12px;
                border: 1px dashed rgba(15,23,42,.25);
                background: rgba(226,232,240,.55);
                font-size: 13px;
                font-weight: 950;
                color: #1d4ed8;
            }

            /* valor base debajo de Monto */
            #modalLista .fila-totales-f.totales-reventado .t-base[b-rhkq3vc24a] {
                height: 34px;
                display: flex;
                align-items: center;
                justify-content: center;
                border-radius: 12px;
                border: 1px solid rgba(22,163,74,.22);
                background: linear-gradient(180deg, rgba(22,163,74,.14), rgba(22,163,74,.08));
                font-size: 16px;
                font-weight: 1000;
                color: #0b1220;
                font-variant-numeric: tabular-nums;
            }

            /* valor rev debajo de R */
            #modalLista .fila-totales-f.totales-reventado .t-rev[b-rhkq3vc24a] {
                height: 34px;
                display: flex;
                align-items: center;
                justify-content: center;
                border-radius: 12px;
                border: 1px solid rgba(220,38,38,.22);
                background: linear-gradient(180deg, rgba(239,68,68,.16), rgba(239,68,68,.08));
                font-size: 16px;
                font-weight: 1000;
                color: #0b1220;
                font-variant-numeric: tabular-nums;
            }

    /* ==========================================
   FIX DEFINITIVO: CENTRADO REAL DEL MODAL LISTA
   (evita corrimientos por padding/margins heredados)
========================================== */

    /* 1) Asegura que el modal esté realmente centrado */
    #modalLista.modal-lista[b-rhkq3vc24a] {
        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
        right: auto !important;
        bottom: auto !important;
    }

    /* 2) Quita cualquier empuje interno (padding/margin) que lo corra */
    #modalLista #listaCanvas[b-rhkq3vc24a],
    #modalLista .modal-grilla-lista[b-rhkq3vc24a] {
        width: 100% !important;
        margin: 0 auto !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    /* 3) ESTE ES EL PUNTO CLAVE:
      centramos TODO el contenido del modal usando layout del contenedor */
    #modalLista #contentLista[b-rhkq3vc24a] {
        width: 100% !important;
        max-width: 1280px !important;
        margin: 0 auto !important;
        padding: 0 10px 10px !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    /* 4) La grilla (cabecera + filas + totales) se mantiene en su ancho real */
    #modalLista .fila-cabecera[b-rhkq3vc24a],
    #modalLista .fila-numeros[b-rhkq3vc24a],
    #modalLista .fila-totales-f[b-rhkq3vc24a] {
        width: fit-content !important;
        margin: 0 auto !important; /* ✅ centrado dentro del flex */
    }

    /* ==========================================
   FIX CENTRADO PROFESIONAL MODAL LISTA
   Normal + Reventado + Parley
========================================== */

    /* Bloque superior completo */
    #modalLista .fila-titulo[b-rhkq3vc24a] {
        width: 100%;
        max-width: 1280px;
        margin: 0 auto 10px auto !important;
        display: flex;
        justify-content: center;
    }

    /* Caja visual del título */
    #modalLista .titulo-sorteo-modal[b-rhkq3vc24a] {
        width: 100%;
        border-radius: 18px;
        background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(241,245,249,.92));
        border: 1px solid rgba(148,163,184,.35);
        box-shadow: 0 18px 34px rgba(15,23,42,.10);
        padding: 14px 16px;
        box-sizing: border-box;
    }

    /* Barra interna del título */
    #modalLista .titulo-bar[b-rhkq3vc24a] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        flex-wrap: wrap;
    }

        /* Texto izquierdo */
        #modalLista .titulo-bar .izq[b-rhkq3vc24a] {
            font-size: 19px;
            font-weight: 950;
            color: #c77d00;
            display: flex;
            align-items: center;
            gap: 6px;
        }

            #modalLista .titulo-bar .izq strong[b-rhkq3vc24a] {
                color: #c77d00;
                font-size: 20px;
                font-weight: 1000;
            }

        /* Chips derechos */
        #modalLista .titulo-bar .der[b-rhkq3vc24a] {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            justify-content: flex-end;
            align-items: center;
        }

        #modalLista .titulo-bar .tag[b-rhkq3vc24a] {
            min-height: 34px;
            padding: 6px 12px;
            border-radius: 999px;
            background: linear-gradient(180deg, #f8fafc, #e2e8f0);
            border: 1px solid rgba(148,163,184,.45);
            font-size: 14px;
            font-weight: 900;
            color: #d48a00;
            box-shadow: 0 8px 18px rgba(15,23,42,.08);
        }

            #modalLista .titulo-bar .tag b[b-rhkq3vc24a] {
                font-size: 16px;
                font-weight: 1000;
            }

        #modalLista .titulo-bar .tag-neto[b-rhkq3vc24a] {
            background: linear-gradient(180deg, #ecfdf5, #d1fae5);
            border-color: rgba(16,185,129,.35);
        }

    /* Bloque de total y ganador */
    #modalLista .fila-totales-normal[b-rhkq3vc24a] {
        width: fit-content;
        max-width: 100%;
        margin: 2px auto 14px auto !important;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        gap: 10px;
        text-align: center;
    }

        #modalLista .fila-totales-normal .label[b-rhkq3vc24a] {
            font-size: 22px;
            font-weight: 1000;
            color: #0f172a;
        }

        #modalLista .fila-totales-normal .valor[b-rhkq3vc24a] {
            font-size: 28px;
            font-weight: 1000;
            color: #7a0000;
            line-height: 1;
        }

        #modalLista .fila-totales-normal .sep[b-rhkq3vc24a] {
            font-size: 20px;
            font-weight: 900;
            color: rgba(15,23,42,.45);
        }

    /* Área donde vive la tabla */
    #modalLista .modal-grilla-lista[b-rhkq3vc24a] {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
    }

    /* Parley también centrado */
    #modalLista .lista-unica-parley[b-rhkq3vc24a] {
        width: fit-content;
        max-width: 100%;
        margin: 0 auto !important;
    }

    /* Grillas tiempos centradas */
    #modalLista .fila-cabecera[b-rhkq3vc24a],
    #modalLista .fila-numeros[b-rhkq3vc24a],
    #modalLista .fila-totales-f[b-rhkq3vc24a] {
        margin-left: auto !important;
        margin-right: auto !important;
    }

/* Responsive */
@media (max-width: 1100px) {
    #modalLista .titulo-bar[b-rhkq3vc24a] {
        justify-content: center;
        text-align: center;
    }

        #modalLista .titulo-bar .izq[b-rhkq3vc24a] {
            justify-content: center;
            width: 100%;
        }

        #modalLista .titulo-bar .der[b-rhkq3vc24a] {
            justify-content: center;
            width: 100%;
        }
}

/* ==========================================
   REDISEÑO SUPERIOR DEL MODAL LISTA
========================================== */
#modalLista .fila-titulo[b-rhkq3vc24a] {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto 14px auto !important;
    display: flex;
    justify-content: center;
}

#modalLista .titulo-sorteo-modal[b-rhkq3vc24a] {
    width: 100%;
    border-radius: 22px;
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(241,245,249,.95));
    border: 1px solid rgba(148,163,184,.30);
    box-shadow: 0 18px 36px rgba(15,23,42,.10);
    padding: 14px 18px;
    box-sizing: border-box;
}

#modalLista .titulo-bar[b-rhkq3vc24a] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

    #modalLista .titulo-bar .izq[b-rhkq3vc24a] {
        font-size: 22px;
        font-weight: 1000;
        color: #c77d00;
        display: flex;
        align-items: center;
        gap: 8px;
        line-height: 1.15;
    }

        #modalLista .titulo-bar .izq strong[b-rhkq3vc24a] {
            font-size: 24px;
            font-weight: 1000;
            color: #c77d00;
        }

    #modalLista .titulo-bar .der[b-rhkq3vc24a] {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        justify-content: flex-end;
        align-items: center;
    }

    #modalLista .titulo-bar .tag[b-rhkq3vc24a] {
        min-height: 38px;
        padding: 7px 14px;
        border-radius: 999px;
        border: 1px solid rgba(148,163,184,.35);
        font-size: 14px;
        font-weight: 900;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        box-shadow: 0 8px 18px rgba(15,23,42,.08);
        color: #334155;
        background: linear-gradient(180deg, #ffffff, #f1f5f9);
    }

        #modalLista .titulo-bar .tag b[b-rhkq3vc24a] {
            font-size: 17px;
            font-weight: 1000;
        }

    #modalLista .titulo-bar .tag-soft-blue[b-rhkq3vc24a] {
        background: linear-gradient(180deg, #eff6ff, #dbeafe);
        border-color: rgba(59,130,246,.30);
        color: #1d4ed8;
    }

    #modalLista .titulo-bar .tag-soft-red[b-rhkq3vc24a] {
        background: linear-gradient(180deg, #fef2f2, #fee2e2);
        border-color: rgba(239,68,68,.30);
        color: #dc2626;
    }

    #modalLista .titulo-bar .tag-soft-gold[b-rhkq3vc24a] {
        background: linear-gradient(180deg, #fff7ed, #ffedd5);
        border-color: rgba(245,158,11,.30);
        color: #c2410c;
    }

    #modalLista .titulo-bar .tag-soft-green[b-rhkq3vc24a] {
        background: linear-gradient(180deg, #ecfdf5, #d1fae5);
        border-color: rgba(16,185,129,.30);
        color: #047857;
    }

    #modalLista .titulo-bar .tag-soft-amber[b-rhkq3vc24a] {
        background: linear-gradient(180deg, #fffbeb, #fef3c7);
        border-color: rgba(245,158,11,.28);
        color: #b45309;
    }

    #modalLista .titulo-bar .tag-soft-rose[b-rhkq3vc24a] {
        background: linear-gradient(180deg, #fff1f2, #ffe4e6);
        border-color: rgba(244,63,94,.25);
        color: #be123c;
    }

    #modalLista .titulo-bar .tag-neto[b-rhkq3vc24a] {
        background: linear-gradient(180deg, #ecfdf5, #d1fae5);
        border-color: rgba(16,185,129,.35);
        color: #047857;
    }

@media (max-width: 1100px) {
    #modalLista .titulo-bar[b-rhkq3vc24a] {
        justify-content: center;
        text-align: center;
    }

        #modalLista .titulo-bar .izq[b-rhkq3vc24a] {
            justify-content: center;
            width: 100%;
        }

        #modalLista .titulo-bar .der[b-rhkq3vc24a] {
            justify-content: center;
            width: 100%;
        }
}

#modalLista .modal-grilla-lista > .fila-cabecera.cabecera-reventado[b-rhkq3vc24a],
#modalLista .modal-grilla-lista > .fila-numeros.fila-reventado[b-rhkq3vc24a],
#modalLista .modal-grilla-lista > .fila-totales-f.totales-reventado[b-rhkq3vc24a] {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}

/* =========================
   HISTÓRICO PRO: HEADER + TOTALES
========================= */
.cs-hist-top[b-rhkq3vc24a] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 12px;
    padding-right: 44px; /* espacio para la X */
}

.cs-hist-totals[b-rhkq3vc24a] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.modal-resumen-hist .cs-total-chip[b-rhkq3vc24a] {
    min-width: 160px;
}

    .modal-resumen-hist .cs-total-chip .v[b-rhkq3vc24a] {
        font-size: 18px;
    }

@media (max-width: 900px) {
    .cs-hist-top[b-rhkq3vc24a] {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
        padding-right: 0;
    }

    .cs-hist-totals[b-rhkq3vc24a] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
        justify-content: stretch;
    }

    .modal-resumen-hist .cs-total-chip[b-rhkq3vc24a] {
        min-width: 0;
        width: 100%;
    }
}

@media (max-width: 560px) {
    .cs-hist-totals[b-rhkq3vc24a] {
        grid-template-columns: 1fr;
    }
}

/* =========================
   CALENDARIO EN FECHAS
   ========================= */
.cs-date-wrap[b-rhkq3vc24a] {
    position: relative;
    width: 100%;
}

    .cs-date-wrap .cs-date[b-rhkq3vc24a] {
        width: 100%;
        padding-right: 46px;
        box-sizing: border-box;
    }

.cs-date-icon-box[b-rhkq3vc24a] {
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cs-date-icon[b-rhkq3vc24a] {
    font-size: 17px;
    line-height: 1;
    pointer-events: none;
    opacity: 0.9;
}

.cs-date-native[b-rhkq3vc24a] {
    position: absolute;
    inset: 0;
    width: 22px;
    height: 22px;
    opacity: 0;
    cursor: pointer;
    border: none;
    background: transparent;
}

/* Consulta Sorteos: lista visible y alineada en navegadores móviles.
   Encapsulado en este componente para no alterar la experiencia de PC. */
@media (max-width: 900px) {
    #modalLista.modal-lista[b-rhkq3vc24a] {
        position: fixed !important;
        inset: max(6px, env(safe-area-inset-top)) max(6px, env(safe-area-inset-right)) max(6px, env(safe-area-inset-bottom)) max(6px, env(safe-area-inset-left)) !important;
        top: max(6px, env(safe-area-inset-top)) !important;
        left: max(6px, env(safe-area-inset-left)) !important;
        right: max(6px, env(safe-area-inset-right)) !important;
        bottom: max(6px, env(safe-area-inset-bottom)) !important;
        width: auto !important;
        max-width: none !important;
        height: auto !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 54px 8px 8px !important;
        transform: none !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    #modalLista .modal-lista-actions[b-rhkq3vc24a] {
        position: absolute !important;
        top: 8px !important;
        right: 8px !important;
        z-index: 60 !important;
    }

    #modalLista #listaCanvas[b-rhkq3vc24a] {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        width: 100% !important;
        max-width: none !important;
        padding: 0 4px 10px !important;
        overflow-x: auto !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
        touch-action: pan-x pan-y !important;
        box-sizing: border-box !important;
    }

    #modalLista #contentLista[b-rhkq3vc24a],
    #modalLista .modal-grilla-lista[b-rhkq3vc24a] {
        width: max-content !important;
        min-width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        align-items: flex-start !important;
        box-sizing: border-box !important;
    }

    #modalLista .fila-titulo[b-rhkq3vc24a] {
        width: min(100%, 1280px) !important;
        margin: 0 0 10px !important;
    }

    #modalLista .fila-cabecera[b-rhkq3vc24a],
    #modalLista .fila-numeros[b-rhkq3vc24a],
    #modalLista .fila-totales-f[b-rhkq3vc24a],
    #modalLista .fila-totales-f.totales-reventado[b-rhkq3vc24a] {
        width: max-content !important;
        max-width: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        justify-content: start !important;
    }
}

@media (max-width: 900px) and (orientation: landscape) {
    #modalLista.modal-lista[b-rhkq3vc24a] {
        inset: 4px !important;
        top: 4px !important;
        left: 4px !important;
        right: 4px !important;
        bottom: 4px !important;
        padding-top: 48px !important;
    }
}
/* _content/SistemaLoteriaDashboard/Components/Ventas/ConsultasTab.razor.rz.scp.css */
/* ============================= */
/*        CONSULTAS TAB          */
/*  CSS sincronizado con Razor   */
/* ============================= */

.consultas-root[b-lh0buzb5zo] {
    position: relative;
}

/* SUBMENÚ */
.consultas-dropdown[b-lh0buzb5zo] {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 6px;
    background: #fff;
    border-radius: 14px;
    border: 1px solid #dbe7ff;
    box-shadow: 0 14px 34px rgba(15,23,42,.22);
    min-width: 240px;
    padding: 6px;
    z-index: 1200;
    overflow: hidden;
}

.consultas-item[b-lh0buzb5zo] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: .9rem;
    color: #0f172a;
    text-align: left;
    font-family: inherit;
    border-radius: 12px;
    transition: background .12s ease, transform .12s ease;
}

.consultas-bullet[b-lh0buzb5zo] {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #eef6ff;
    color: #1d4ed8;
    font-size: 1.1rem;
    line-height: 1;
    box-shadow: inset 0 0 0 1px rgba(37,99,235,.18);
}

.consultas-texto[b-lh0buzb5zo] {
    flex: 1;
    font-weight: 800;
    color: #0b2a5b;
}

.consultas-item:hover[b-lh0buzb5zo] {
    background: #f2f7ff;
    transform: translateY(-1px);
}

.consultas-item:active[b-lh0buzb5zo] {
    transform: translateY(0);
}

/* MODAL */
.modal-overlay[b-lh0buzb5zo] {
    position: fixed;
    inset: 0;
    background: rgba(2,6,23,.55);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2000;
    backdrop-filter: blur(3px);
}

.modal-consultas[b-lh0buzb5zo] {
    background: #fff;
    border-radius: 18px;
    max-width: 1050px;
    width: min(96%,1050px);
    max-height: 92vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 28px 70px rgba(15,23,42,.55);
    padding: 16px 18px 16px;
    border: 1px solid rgba(148,163,184,.45);
}

/* Header */
.modal-header[b-lh0buzb5zo] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.modal-header-titulo[b-lh0buzb5zo] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.modal-header h3[b-lh0buzb5zo] {
    margin: 0;
    font-size: 1.45rem;
    font-weight: 1000;
    color: #0b3b78;
    letter-spacing: .2px;
}

.modal-header-sub[b-lh0buzb5zo] {
    font-size: 1.02rem;
    line-height: 1.25rem;
    color: #64748b;
    max-width: 760px;
}

.modal-header-actions[b-lh0buzb5zo] {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* POS selector */
.pos-size[b-lh0buzb5zo] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: flex-start;
}

    .pos-size label[b-lh0buzb5zo] {
        font-size: .74rem;
        font-weight: 900;
        color: #334155;
    }

.pos-size-select[b-lh0buzb5zo] {
    border-radius: 10px;
    border: 1px solid #cfe0ff;
    padding: 6px 8px;
    background: #fff;
    font-weight: 900;
    min-height: 34px;
}

/* Print button */
.btn-print[b-lh0buzb5zo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: none;
    cursor: pointer;
    padding: 9px 12px;
    border-radius: 999px;
    background: linear-gradient(90deg,#0b67c2,#2b8ef5);
    color: #fff;
    font-weight: 1000;
    font-size: .9rem;
    box-shadow: 0 10px 18px rgba(43,142,245,.30);
    transition: transform .12s ease, box-shadow .16s ease, filter .18s ease;
    min-height: 36px;
    min-width: 44px;
}

    .btn-print:hover[b-lh0buzb5zo] {
        transform: translateY(-1px);
        box-shadow: 0 14px 24px rgba(43,142,245,.38);
        filter: brightness(1.02);
    }

    .btn-print:active[b-lh0buzb5zo] {
        transform: translateY(0);
        box-shadow: 0 8px 16px rgba(43,142,245,.30);
    }

/* Close */
.modal-close[b-lh0buzb5zo] {
    border: none;
    background: #ffecec;
    color: #b40000;
    cursor: pointer;
    width: 36px;
    height: 36px;
    border-radius: 12px;
    font-size: 22px;
    line-height: 1;
    display: grid;
    place-items: center;
    transition: background .12s ease, transform .12s ease;
    box-shadow: inset 0 0 0 1px rgba(180,0,0,.12);
}

    .modal-close:hover[b-lh0buzb5zo] {
        background: #ffd6d6;
        transform: translateY(-1px);
    }

    .modal-close:active[b-lh0buzb5zo] {
        transform: translateY(0);
    }

/* FILTROS */
.consulta-filtros[b-lh0buzb5zo] {
    border-radius: 16px;
    background: linear-gradient(180deg,#f7fbff,#f1f6ff);
    padding: 12px 12px 10px;
    margin-bottom: 12px;
    border: 1px solid #d7e6ff;
    box-shadow: 0 10px 18px rgba(15,23,42,.05);
}

.consulta-fila[b-lh0buzb5zo] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: flex-end;
}

.consulta-campo[b-lh0buzb5zo] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 180px;
}

.consulta-campo[b-lh0buzb5zo]  .sl-date-wrap.sl-date-field-compact {
    width: 100%;
    max-width: 220px;
}

.consulta-campo[b-lh0buzb5zo]  .sl-date-wrap input.sl-date-input.cg-date-input {
    min-height: 48px;
    height: 48px;
    border-radius: 14px;
    font-size: 1.05rem;
    font-weight: 900;
}

    .consulta-campo label[b-lh0buzb5zo] {
        font-size: .98rem;
        font-weight: 1000;
        color: #1f2937;
        letter-spacing: .2px;
    }

.consulta-input[b-lh0buzb5zo] {
    border-radius: 14px;
    border: 1px solid #cfe0ff;
    font-family: inherit;
    min-height: 48px;
    height: 48px;
    line-height: 48px;
    font-size: 1.05rem;
    padding: 0 14px;
    background: #fff;
    box-shadow: inset 0 0 0 1px rgba(226,232,240,.55);
    transition: box-shadow .12s ease, border-color .12s ease, transform .12s ease;
}

    .consulta-input:focus[b-lh0buzb5zo] {
        outline: none;
        border-color: #3b82f6;
        box-shadow: 0 0 0 4px rgba(59,130,246,.18);
        transform: translateY(-1px);
    }

    .consulta-input[type="date"][b-lh0buzb5zo] {
        appearance: none;
        -webkit-appearance: none;
        -moz-appearance: none;
        background: #fff;
    }

.consulta-filtros select.input[b-lh0buzb5zo],
.consulta-filtros select.pos-size-select[b-lh0buzb5zo] {
    min-height: 48px;
    height: 48px;
    font-size: 1.05rem;
    padding: 12px 14px;
    border-radius: 14px;
    font-weight: 900;
}

.consulta-filtros select.input[b-lh0buzb5zo] {
    background: #fff;
    border: 1px solid #cfe0ff;
    box-shadow: inset 0 0 0 1px rgba(226,232,240,.55);
}

    .consulta-filtros select.input:focus[b-lh0buzb5zo],
    .consulta-filtros select.pos-size-select:focus[b-lh0buzb5zo] {
        outline: none;
        border-color: #3b82f6;
        box-shadow: 0 0 0 4px rgba(59,130,246,.18);
        transform: translateY(-1px);
    }

.consulta-boton-buscar[b-lh0buzb5zo] {
    justify-content: flex-end;
    min-width: 220px;
}

.consulta-btn-buscar[b-lh0buzb5zo] {
    align-self: flex-start;
    background: linear-gradient(90deg,#0b67c2,#2b8ef5);
    color: #fff;
    border: none;
    border-radius: 999px;
    padding: 12px 22px;
    cursor: pointer;
    font-weight: 900;
    font-size: 1.03rem;
    box-shadow: 0 10px 18px rgba(43,142,245,.30);
    transition: transform .12s ease, box-shadow .16s ease, filter .18s ease;
}

    .consulta-btn-buscar:hover[b-lh0buzb5zo] {
        transform: translateY(-1px);
        box-shadow: 0 14px 24px rgba(43,142,245,.38);
        filter: brightness(1.02);
    }

    .consulta-btn-buscar:active[b-lh0buzb5zo] {
        transform: translateY(0);
        box-shadow: 0 8px 16px rgba(43,142,245,.30);
    }

/* RESULTADOS */
.consulta-resultados[b-lh0buzb5zo] {
    flex: 1;
    overflow: hidden;
    margin-top: 6px;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    background: #fff;
    display: flex;
    flex-direction: column;
}

.consulta-empty[b-lh0buzb5zo] {
    padding: 20px 16px;
    font-size: 1.05rem;
    font-weight: 900;
    color: #334155;
}

/* SUPERBANNER */
.consulta-superbanner[b-lh0buzb5zo] {
    margin: 12px 12px 10px;
    border-radius: 18px;
    border: 1px solid #dbeafe;
    background: linear-gradient(180deg,#f8fbff,#eef6ff);
    padding: 14px 14px 12px;
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 14px;
    box-shadow: 0 14px 24px rgba(15,23,42,.08);
}

.csb-left[b-lh0buzb5zo] {
    min-width: 240px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: center;
    justify-content: center;
    padding: 6px 10px;
    border-radius: 14px;
    background: rgba(255,255,255,.55);
    border: 1px solid rgba(219,234,254,.8);
}

.csb-title[b-lh0buzb5zo] {
    font-weight: 1000;
    letter-spacing: .8px;
    color: #0b3b78;
    font-size: 1.05rem;
}

.csb-number[b-lh0buzb5zo] {
    font-weight: 1000;
    font-size: 3.1rem;
    line-height: 1;
    color: #0d47a1;
    text-shadow: 0 2px 0 rgba(0,0,0,.04);
}

.csb-bola[b-lh0buzb5zo] {
    font-weight: 1000;
    border-radius: 999px;
    padding: 7px 12px;
    font-size: .86rem;
    border: 1px solid transparent;
    box-shadow: 0 8px 14px rgba(15,23,42,.08);
}

    .csb-bola.bola-blanca[b-lh0buzb5zo] {
        background: #fff;
        border-color: #cbd5e1;
        color: #0f172a;
    }

    .csb-bola.bola-roja[b-lh0buzb5zo] {
        background: #ffecec;
        border-color: #ffb4b4;
        color: #b40000;
    }

.csb-right[b-lh0buzb5zo] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
    justify-content: center;
    padding: 6px 4px;
}

.csb-line[b-lh0buzb5zo] {
    display: flex;
    align-items: baseline;
    gap: 8px;
    flex-wrap: wrap;
}

.csb-label[b-lh0buzb5zo] {
    font-size: .98rem;
    font-weight: 900;
    color: #334155;
}

.csb-value[b-lh0buzb5zo] {
    font-size: 1.18rem;
    font-weight: 1000;
    color: #0b2a5b;
}

.csb-pagos[b-lh0buzb5zo] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 2px;
}

.pago-chip[b-lh0buzb5zo] {
    border-radius: 999px;
    padding: 8px 12px;
    font-weight: 900;
    font-size: .9rem;
    border: 1px solid transparent;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    box-shadow: 0 10px 18px rgba(15,23,42,.08);
}

    .pago-chip.base[b-lh0buzb5zo] {
        background: #ecfeff;
        border-color: #a5f3fc;
        color: #155e75;
    }

    .pago-chip.rev[b-lh0buzb5zo] {
        background: #fff1f2;
        border-color: #fecdd3;
        color: #9f1239;
    }

.pago-sub[b-lh0buzb5zo] {
    font-weight: 900;
    opacity: .9;
    margin-left: 4px;
}

/* ============================ */
/* TABLA ÚNICA + THEAD STICKY   */
/* ============================ */

.consulta-tabla-wrap[b-lh0buzb5zo] {
    margin: 0 12px 12px;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    overflow: hidden;
    box-shadow: 0 10px 18px rgba(15,23,42,.06);
    background: #fff;
    display: flex;
    flex-direction: column;
}

/* SOLO AQUÍ VA EL SCROLL */
.consulta-lineas-scroll[b-lh0buzb5zo] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    background: #fff;
}

/* Tabla única */
.consulta-tabla[b-lh0buzb5zo] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
}

    /* Header sticky */
    .consulta-tabla thead th[b-lh0buzb5zo] {
        position: sticky;
        top: 0;
        z-index: 5;
        background: linear-gradient(90deg,#0b67c2,#2b8ef5);
        color: #fff;
        padding: 12px 12px;
        text-align: left;
        white-space: nowrap;
        font-weight: 900;
        font-size: .92rem;
        letter-spacing: .2px;
    }

    /* Body */
    .consulta-tabla tbody td[b-lh0buzb5zo] {
        padding: 12px 12px;
        border-bottom: 1px solid #e2e8f0;
        text-align: left;
        white-space: nowrap;
        font-size: 1.12rem;
        font-variant-numeric: tabular-nums;
    }

    .consulta-tabla tbody tr:nth-child(even)[b-lh0buzb5zo] {
        background: #f8fafc;
    }

    .consulta-tabla tbody tr:hover[b-lh0buzb5zo] {
        background: #eaf2ff;
    }

/* Anchos por columna */
.col-no[b-lh0buzb5zo] {
    width: 12%;
}

.col-monto[b-lh0buzb5zo] {
    width: 38%;
}

.col-premio[b-lh0buzb5zo] {
    width: 25%;
}

.col-tiquete[b-lh0buzb5zo] {
    width: 25%;
}

/* Premio en negrita */
.consulta-tabla tbody td:nth-child(3)[b-lh0buzb5zo] {
    font-weight: 1000;
}

/* Etiqueta reventado */
.tag-rvta[b-lh0buzb5zo] {
    margin-left: 6px;
    font-weight: 800;
    opacity: .85;
}

/* TOTALES */
.consulta-totales[b-lh0buzb5zo] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: flex-end;
    align-items: center;
    padding: 12px 14px;
    margin: 0 12px 14px;
    background: linear-gradient(180deg,#fff7f7,#fff1f2);
    border: 1px solid #fecdd3;
    border-radius: 16px;
    box-shadow: 0 10px 18px rgba(15,23,42,.06);
}

.consulta-totales-label[b-lh0buzb5zo] {
    font-weight: 1000;
    font-size: 1.05rem;
    color: #7f1d1d;
    letter-spacing: .3px;
}

.consulta-totales-monto[b-lh0buzb5zo],
.consulta-totales-premio[b-lh0buzb5zo] {
    font-weight: 1000;
    font-size: 1.05rem;
    color: #b40000;
}

/* ✅ Botones de juego */
.consulta-juego-row[b-lh0buzb5zo] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.consulta-btn-juego[b-lh0buzb5zo] {
    border: 1px solid #d1d5db;
    background: #fff;
    border-radius: 10px;
    padding: 8px 12px;
    font-weight: 700;
    cursor: pointer;
    transition: all .15s ease;
}

    .consulta-btn-juego:hover[b-lh0buzb5zo] {
        transform: translateY(-1px);
        box-shadow: 0 8px 18px rgba(15,23,42,.10);
    }

    .consulta-btn-juego.activo[b-lh0buzb5zo] {
        background: #111827;
        color: #fff;
        border-color: #111827;
    }

@media (max-width:820px) {
    .consulta-superbanner[b-lh0buzb5zo] {
        flex-direction: column;
    }

    .csb-left[b-lh0buzb5zo] {
        width: 100%;
        min-width: 0;
    }

    .consulta-tabla-wrap[b-lh0buzb5zo] {
        margin: 0 8px 10px;
    }

    .consulta-totales[b-lh0buzb5zo] {
        margin: 0 8px 12px;
    }
}

@media (max-width:520px) {
    .consulta-juego-row[b-lh0buzb5zo] {
        flex-wrap: wrap;
    }

    .consulta-btn-juego[b-lh0buzb5zo] {
        flex: 1;
        min-width: 120px;
        justify-content: center;
    }
}

/* ========================= */
/* Ticket POS (solo print)   */
/* ========================= */

.pos-ticket[b-lh0buzb5zo] {
    display: none;
    width: var(--posWidth);
    max-width: var(--posWidth);
    box-sizing: border-box;
    font-family: "Courier New", Courier, "Lucida Console", Consolas, monospace;
    font-kerning: none;
    letter-spacing: 0;
    font-variant-ligatures: none;
    font-size: 12px;
    line-height: 1.25;
    padding: 6px 6px 10px;
    color: #000;
    background: #fff;
    transform-origin: top left;
}

    .pos-ticket *[b-lh0buzb5zo] {
        box-sizing: border-box;
        min-width: 0;
    }

    .pos-ticket.pos-fit[b-lh0buzb5zo] {
        transform: scale(var(--ptScale, 1));
    }

.pt-center[b-lh0buzb5zo] {
    text-align: center;
}

.pt-right[b-lh0buzb5zo] {
    text-align: right;
}

.pt-bold[b-lh0buzb5zo] {
    font-weight: 1000;
}

.pt-muted[b-lh0buzb5zo] {
    opacity: .75;
}

.pt-sep[b-lh0buzb5zo] {
    border-top: 1px dashed #000;
    margin: 8px 0;
}

    .pt-sep.thin[b-lh0buzb5zo] {
        border-top: 1px dotted #000;
        margin: 4px 0;
    }

.pt-line[b-lh0buzb5zo] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin: 2px 0;
}

    .pt-line > span[b-lh0buzb5zo] {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .pt-line.pt-total[b-lh0buzb5zo] {
        grid-template-columns: auto 1fr;
        gap: 8px;
    }

        .pt-line.pt-total > span[b-lh0buzb5zo] {
            overflow: visible;
            text-overflow: clip;
        }

            .pt-line.pt-total > span:first-child[b-lh0buzb5zo] {
                white-space: normal;
            }

            .pt-line.pt-total > span:last-child[b-lh0buzb5zo] {
                white-space: nowrap;
                justify-self: end;
                text-align: right;
            }

    .pt-line > span:last-child[b-lh0buzb5zo] {
        justify-self: end;
        text-align: right;
    }

.pt-head[b-lh0buzb5zo],
.pt-row[b-lh0buzb5zo] {
    display: grid;
    grid-template-columns: var(--pt-c1, 2ch) var(--pt-ct, 1ch) var(--pt-c2, 6ch) var(--pt-c3, 9ch) var(--pt-c4, 10ch);
    column-gap: 1ch;
    margin: 2px 0;
}

    .pt-head > div[b-lh0buzb5zo],
    .pt-row > div[b-lh0buzb5zo] {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-kerning: none;
        letter-spacing: 0;
        font-variant-ligatures: none;
    }

.pt-col[b-lh0buzb5zo] {
    justify-self: start;
    text-align: left;
}

.pt-tcol[b-lh0buzb5zo] {
    justify-self: center;
    text-align: center;
}

.pos-ticket.pos-tiempos[b-lh0buzb5zo] {
    --pt-c1: 2ch;
    --pt-ct: 1ch;
    --pt-c2: 6ch;
    --pt-c3: 9ch;
    --pt-c4: 10ch;
}

.pos-ticket.pos-parley[b-lh0buzb5zo] {
    --pt-c1: 5ch;
    --pt-ct: 1ch;
    --pt-c2: 6ch;
    --pt-c3: 9ch;
    --pt-c4: 10ch;
}

    .pos-ticket.pos-parley .pt-head[b-lh0buzb5zo],
    .pos-ticket.pos-parley .pt-row[b-lh0buzb5zo] {
        column-gap: .7ch;
    }


    {
    body.print-pos * {
        visibility: hidden !important;
    }

    body.print-pos #pos-ticket[b-lh0buzb5zo],
    body.print-pos #pos-ticket *[b-lh0buzb5zo] {
        visibility: visible !important;
    }

    body.print-pos #pos-ticket[b-lh0buzb5zo] {
        position: fixed !important;
        left: 0 !important;
        top: 0 !important;
        display: block !important;
    }
}

/* SOLO para la tabla de premiados (Monazos) */
.col-modo[b-lh0buzb5zo] {
    width: 170px; /* ajusta si quieres más/menos */
    white-space: nowrap;
}

/* Acciones de filtros: Buscar + Imprimir en una misma fila */
.consulta-acciones[b-lh0buzb5zo] {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
}

/* Variante del botón print para usarse dentro de filtros */
.btn-print-inline[b-lh0buzb5zo] {
    padding: 12px 18px;
    min-width: auto;
    border-radius: 999px;
    font-size: 1.03rem;
}

/* X fija en la esquina superior derecha del MODAL */
.modal-consultas[b-lh0buzb5zo] {
    position: relative; /* referencia para la X */
}

.modal-close-corner[b-lh0buzb5zo] {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 5;
}

/* _content/SistemaLoteriaDashboard/Components/Ventas/JalaTiquete.razor.rz.scp.css */
.rt-backdrop[b-cy1xlo4649] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    z-index: 9998;
}

.rt-modal[b-cy1xlo4649] {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: min(1050px, 95vw);
    max-height: 92vh;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 20px 60px rgba(0,0,0,.25);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    /* ✅ borde más oscuro para que destaque */
    border: 1px solid #7ea6df;
}

.rt-header[b-cy1xlo4649] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    background: #d8e7ff;
    /* ✅ borde más oscuro */
    border-bottom: 1px solid #7ea6df;
}

.rt-title[b-cy1xlo4649] {
    display: flex;
    gap: 10px;
    align-items: center;
}

.rt-icon[b-cy1xlo4649] {
    font-size: 22px;
}

.rt-h1[b-cy1xlo4649] {
    font-weight: 900;
    color: #0b3b91;
    font-size: 18px;
}

.rt-h2[b-cy1xlo4649] {
    font-weight: 700;
    color: #0b3b91;
    opacity: .85;
    font-size: 13px;
}

.rt-close[b-cy1xlo4649] {
    width: 34px;
    height: 34px;
    border: 1px solid #7ea6df; /* ✅ */
    border-radius: 10px;
    background: #ffffff;
    cursor: pointer;
    font-weight: 900;
}

.rt-tools[b-cy1xlo4649] {
    display: flex;
    gap: 12px;
    padding: 12px 16px;
    background: #f6f9ff;
    /* ✅ borde más oscuro */
    border-bottom: 1px solid #7ea6df;
    flex-wrap: wrap;
    align-items: flex-end;
}

.rt-field[b-cy1xlo4649] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

    .rt-field label[b-cy1xlo4649] {
        font-size: 12px;
        font-weight: 800;
        color: #153e75;
    }

/* ✅ Fecha más grande */
.rt-date .rt-input[b-cy1xlo4649] {
    height: 44px;
    font-size: 16px;
    font-weight: 800;
    padding: 0 12px;
}

/* ✅ inputs con borde más oscuro */
.rt-input[b-cy1xlo4649] {
    height: 38px;
    border: 1px solid #7ea6df;
    border-radius: 10px;
    padding: 0 10px;
    outline: none;
}

    .rt-input:focus[b-cy1xlo4649] {
        border-color: #1d6fe8;
        box-shadow: 0 0 0 3px rgba(29,111,232,.18);
    }

/* ✅ BUSCADOR: input pequeño y botón al lado */
.rt-buscar[b-cy1xlo4649] {
    flex: 1;
    min-width: 320px;
    display: flex;
    flex-direction: column;
}

.rt-buscar-row[b-cy1xlo4649] {
    display: flex;
    gap: 10px;
    align-items: center;
}

.rt-searchbox[b-cy1xlo4649] {
    flex: 0 1 420px; /* ✅ no tan grande */
    height: 34px; /* ✅ más pequeño */
    font-size: 13px;
    padding: 0 10px;
}

/* ✅ botón buscar cuadrado */
.rt-btn[b-cy1xlo4649] {
    height: 34px;
    width: 42px;
    border: 1px solid #0f55bf; /* borde para que se note */
    border-radius: 10px;
    background: #1d6fe8;
    color: #fff;
    font-weight: 900;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    .rt-btn span[b-cy1xlo4649] {
        display: none; /* ✅ ocultamos texto si lo tienes */
    }

    .rt-btn i[b-cy1xlo4649], .rt-btn .rt-btn-ico[b-cy1xlo4649] {
        font-size: 16px; /* ✅ icono visible */
        line-height: 1;
    }

.rt-body[b-cy1xlo4649] {
    padding: 12px 16px;
    overflow: auto;
}

.rt-loading[b-cy1xlo4649], .rt-empty[b-cy1xlo4649] {
    padding: 18px;
    border: 1px dashed #7ea6df; /* ✅ */
    border-radius: 12px;
    background: #fbfdff;
    color: #153e75;
    font-weight: 800;
}

.rt-table[b-cy1xlo4649] {
    width: 100%;
}

/* ✅ filas con bordes más oscuros */
.rt-row[b-cy1xlo4649] {
    display: grid;
    grid-template-columns: 90px 80px 110px 110px 1.6fr 120px 60px;
    gap: 0;
    align-items: center;
    border: 1px solid #7ea6df; /* ✅ */
    border-radius: 10px;
    margin-bottom: 8px;
    overflow: hidden;
    cursor: pointer;
}

.rt-head[b-cy1xlo4649] {
    background: #1b73d1;
    color: #fff;
    font-weight: 900;
    cursor: default;
    border-color: #1b73d1;
}

.rt-row > div[b-cy1xlo4649] {
    padding: 10px 10px;
    background: #fff;
    border-right: 1px solid #d0def4; /* ✅ separadores un poquito más notables */
}

    .rt-row > div:last-child[b-cy1xlo4649] {
        border-right: none;
    }

.rt-head > div[b-cy1xlo4649] {
    background: transparent;
    border-right: 1px solid rgba(255,255,255,.25);
}

/* ✅ selección MUY visible */
/* ✅ SELECCIÓN CLARAMENTE VISIBLE */
.rt-row.rt-selected[b-cy1xlo4649] {
    background: #cfe0ff; /* fondo fuerte */
    border-color: #1d6fe8; /* borde azul intenso */
    box-shadow: inset 0 0 0 2px #1d6fe8, /* borde interno */
    0 4px 12px rgba(29,111,232,.35); /* sombra externa */
}

    /* ✅ Celdas internas también se resaltan */
    .rt-row.rt-selected > div[b-cy1xlo4649] {
        background: #e8f0ff !important;
        font-weight: 900;
        color: #0b3b91;
    }

    /* ✅ Barra lateral de selección */
    .rt-row.rt-selected[b-cy1xlo4649]::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 6px;
        background: #1d6fe8;
    }



/* ✅ hover para ver mejor el foco */
.rt-row:not(.rt-head):hover[b-cy1xlo4649] {
    outline: 2px solid rgba(29,111,232,.20);
}

.rt-col-print[b-cy1xlo4649] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.rt-print[b-cy1xlo4649] {
    width: 36px;
    height: 30px;
    border: 1px solid #1b8a35; /* ✅ */
    border-radius: 8px;
    background: #33b14a;
    color: #fff;
    cursor: pointer;
}

.rt-hide[b-cy1xlo4649] {
    display: none !important;
}

.rt-footer[b-cy1xlo4649] {
    padding: 12px 16px;
    border-top: 1px solid #7ea6df; /* ✅ */
    display: flex;
    justify-content: flex-end;
    background: #fff;
}

.rt-btn-sec[b-cy1xlo4649] {
    background: #e9f1ff;
    color: #0b3b91;
    border: 1px solid #7ea6df;
}

/* ✅ Buscador: número más grande + negrita */
.rt-searchbox[b-cy1xlo4649] {
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .3px;
}

/* ✅ Botón buscar: más pequeño y cuadrado */
.rt-buscar-row .rt-btn[b-cy1xlo4649] {
    width: 38px;
    min-width: 38px;
    padding: 0;
}

/* ✅ Bordes más oscuros para que se noten */
.rt-row[b-cy1xlo4649] {
    border-color: #a9bddf;
    position: relative;
}

    .rt-row > div[b-cy1xlo4649] {
        border-right: 1px solid #a9bddf;
    }

        .rt-row > div:last-child[b-cy1xlo4649] {
            border-right: none;
        }

    .rt-row.rt-selected[b-cy1xlo4649]::before {
        pointer-events: none;
    }
/* _content/SistemaLoteriaDashboard/Components/Ventas/ModalFacturasAdmin.razor.rz.scp.css */
.fa-backdrop[b-4ee23ho6p4] {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99990 !important;
    background: rgba(10,18,35,.58) !important;
    backdrop-filter: blur(6px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 18px !important;
}

.fa-modal[b-4ee23ho6p4] {
    width: min(1050px, calc(100vw - 24px)) !important;
    max-height: calc(100vh - 24px) !important;
    background: #ffffff !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    box-shadow: 0 24px 70px rgba(0,0,0,.42) !important;
    display: flex !important;
    flex-direction: column !important;
}

.fa-header[b-4ee23ho6p4],
.fa-preview-head[b-4ee23ho6p4] {
    padding: 16px 20px !important;
    background: linear-gradient(180deg, #0b3a74 0%, #0f4a92 65%, #1253a3 100%) !important;
    color: white !important;
    display: flex !important;
    justify-content: space-between !important;
    gap: 14px !important;
    align-items: center !important;
}

.fa-title[b-4ee23ho6p4] {
    font-size: 1.35rem !important;
    font-weight: 1000 !important;
}

.fa-sub[b-4ee23ho6p4],
.fa-preview-sub[b-4ee23ho6p4] {
    margin-top: 3px !important;
    font-weight: 750 !important;
    opacity: .88 !important;
}

.fa-close[b-4ee23ho6p4] {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    border-radius: 12px !important;
    border: 1px solid rgba(255,255,255,.25) !important;
    background: rgba(255,255,255,.12) !important;
    color: white !important;
    font-size: 18px !important;
    font-weight: 1000 !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    font-family: Arial, sans-serif !important;
}

    .fa-close[b-4ee23ho6p4]::before,
    .fa-close[b-4ee23ho6p4]::after {
        content: none !important;
        display: none !important;
    }

.fa-body[b-4ee23ho6p4] {
    padding: 16px !important;
    overflow: auto !important;
    background: #f8fbff !important;
}

.fa-info[b-4ee23ho6p4] {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(130px, 1fr)) !important;
    gap: 10px !important;
    margin-bottom: 14px !important;
}

    .fa-info div[b-4ee23ho6p4] {
        background: white !important;
        border: 1px solid #dbe7ff !important;
        border-radius: 14px !important;
        padding: 10px !important;
        font-weight: 850 !important;
        color: #0f172a !important;
    }

.fa-empty[b-4ee23ho6p4],
.fa-error[b-4ee23ho6p4] {
    background: white !important;
    border-radius: 16px !important;
    padding: 18px !important;
    border: 1px solid #dbe7ff !important;
    font-weight: 900 !important;
    color: #475569 !important;
    text-align: center !important;
}

.fa-error[b-4ee23ho6p4] {
    color: #991b1b !important;
    background: #fff2f2 !important;
    border-color: #fecaca !important;
}

.fa-table[b-4ee23ho6p4] {
    background: white !important;
    border: 1px solid #dbe7ff !important;
    border-radius: 16px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
}

.fa-row[b-4ee23ho6p4] {
    display: grid !important;
    grid-template-columns: 95px 190px 105px 110px 95px 130px !important;
    gap: 8px !important;
    padding: 11px 12px !important;
    align-items: center !important;
    border-bottom: 1px solid #e6efff !important;
    font-weight: 850 !important;
    min-width: 790px !important;
}

.fa-head[b-4ee23ho6p4] {
    background: #0f4a92 !important;
    color: white !important;
    font-weight: 1000 !important;
}

.fa-ticket[b-4ee23ho6p4] {
    font-weight: 1000 !important;
    color: #0d47a1 !important;
}

.fa-badge[b-4ee23ho6p4] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 5px 10px !important;
    border-radius: 999px !important;
    background: #fff3cd !important;
    color: #8a5a00 !important;
    border: 1px solid #facc15 !important;
    font-weight: 1000 !important;
    font-size: .82rem !important;
}

.fa-mini-btn[b-4ee23ho6p4] {
    border: 0 !important;
    border-radius: 10px !important;
    padding: 8px 12px !important;
    background: linear-gradient(180deg, #1a66c7 0%, #1253a3 100%) !important;
    color: white !important;
    font-weight: 950 !important;
    cursor: pointer !important;
}

.fa-total[b-4ee23ho6p4] {
    margin-top: 12px !important;
    background: white !important;
    border: 1px solid #dbe7ff !important;
    border-radius: 16px !important;
    padding: 12px !important;
    display: flex !important;
    justify-content: flex-end !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
    font-weight: 900 !important;
}

    .fa-total strong[b-4ee23ho6p4] {
        color: #0d47a1 !important;
    }

.fa-footer[b-4ee23ho6p4] {
    padding: 12px 16px !important;
    background: white !important;
    border-top: 1px solid #dbe7ff !important;
    display: flex !important;
    justify-content: flex-end !important;
}

.fa-btn[b-4ee23ho6p4] {
    min-height: 42px !important;
    padding: 0 18px !important;
    border: 0 !important;
    border-radius: 13px !important;
    background: linear-gradient(180deg, #1a66c7 0%, #1253a3 100%) !important;
    color: white !important;
    font-weight: 1000 !important;
    cursor: pointer !important;
}

/* FACTURA PREVIEW GRANDE */
.fa-preview-backdrop[b-4ee23ho6p4] {
    position: fixed !important;
    inset: 0 !important;
    z-index: 100000 !important;
    background: rgba(10,18,35,.68) !important;
    backdrop-filter: blur(7px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 18px !important;
}

.fa-preview-modal[b-4ee23ho6p4] {
    width: min(900px, calc(100vw - 24px)) !important;
    max-height: calc(100vh - 24px) !important;
    background: #ffffff !important;
    border-radius: 22px !important;
    overflow: hidden !important;
    box-shadow: 0 30px 90px rgba(0,0,0,.48) !important;
    display: flex !important;
    flex-direction: column !important;
}

.fa-preview-title[b-4ee23ho6p4] {
    font-size: 1.35rem !important;
    font-weight: 1000 !important;
}

.fa-preview-body[b-4ee23ho6p4] {
    overflow: auto !important;
    padding: 24px !important;
    background: #f8fbff !important;
}

.ticket-admin-preview[b-4ee23ho6p4] {
    width: 520px !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    background: white !important;
    color: #111 !important;
    padding: 18px !important;
    border-radius: 10px !important;
    font-family: "Consolas", "Courier New", monospace !important;
    font-size: 20px !important;
    line-height: 1.25 !important;
    box-shadow: 0 16px 36px rgba(0,0,0,.18) !important;
    transform: scale(1) !important;
    transform-origin: top center !important;
}

.ticket-center[b-4ee23ho6p4] {
    text-align: center !important;
}

.ticket-title[b-4ee23ho6p4] {
    font-size: 24px !important;
    font-weight: 1000 !important;
}

.ticket-sub[b-4ee23ho6p4] {
    font-size: 18px !important;
    font-weight: 800 !important;
}

.ticket-meta[b-4ee23ho6p4] {
    font-size: 17px !important;
    margin-top: 4px !important;
    font-weight: 700 !important;
}

.ticket-admin-preview hr[b-4ee23ho6p4] {
    border: 0 !important;
    border-top: 2px dashed #111 !important;
    margin: 10px 0 !important;
}

.ticket-table[b-4ee23ho6p4] {
    width: 100% !important;
    border-collapse: collapse !important;
    font-size: 18px !important;
}

    .ticket-table th[b-4ee23ho6p4],
    .ticket-table td[b-4ee23ho6p4] {
        padding: 4px 6px !important;
        text-align: center !important;
    }

    .ticket-table th[b-4ee23ho6p4] {
        font-weight: 1000 !important;
    }

.ticket-pay[b-4ee23ho6p4],
.ticket-pay-row[b-4ee23ho6p4] {
    text-align: center !important;
    font-weight: 900 !important;
    font-size: 17px !important;
}

.ticket-pay-row[b-4ee23ho6p4] {
    display: flex !important;
    justify-content: center !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
}

.ticket-total[b-4ee23ho6p4] {
    display: flex !important;
    justify-content: space-between !important;
    font-size: 21px !important;
    font-weight: 1000 !important;
}

.ticket-msg[b-4ee23ho6p4] {
    text-align: center !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    margin-top: 6px !important;
}

.ticket-footer[b-4ee23ho6p4] {
    font-size: 19px !important;
    font-weight: 1000 !important;
}

@media (max-width: 700px) {
    .fa-modal[b-4ee23ho6p4] {
        width: calc(100vw - 16px) !important;
        max-height: 90svh !important;
    }

    .fa-info[b-4ee23ho6p4] {
        grid-template-columns: 1fr !important;
    }

    .fa-body[b-4ee23ho6p4] {
        padding: 12px !important;
    }

    .fa-row[b-4ee23ho6p4] {
        min-width: 790px !important;
    }

    .fa-footer[b-4ee23ho6p4] {
        justify-content: stretch !important;
    }

    .fa-btn[b-4ee23ho6p4] {
        width: 100% !important;
    }

    .fa-preview-modal[b-4ee23ho6p4] {
        width: calc(100vw - 16px) !important;
        max-height: 92svh !important;
    }

    .fa-preview-body[b-4ee23ho6p4] {
        padding: 14px !important;
    }

    .ticket-admin-preview[b-4ee23ho6p4] {
        width: 100% !important;
        font-size: 16px !important;
        padding: 14px !important;
    }

    .ticket-title[b-4ee23ho6p4] {
        font-size: 20px !important;
    }

    .ticket-sub[b-4ee23ho6p4],
    .ticket-meta[b-4ee23ho6p4],
    .ticket-pay[b-4ee23ho6p4],
    .ticket-pay-row[b-4ee23ho6p4],
    .ticket-msg[b-4ee23ho6p4] {
        font-size: 14px !important;
    }

    .ticket-table[b-4ee23ho6p4] {
        font-size: 15px !important;
    }

    .ticket-total[b-4ee23ho6p4] {
        font-size: 18px !important;
    }
}
/* _content/SistemaLoteriaDashboard/Components/Ventas/ModalResumenFacturas.razor.rz.scp.css */
/* =========================
   RESUMEN (RF) - HEADER IGUAL AL RESTO + CUERPO MEJORADO
   ========================= */

/* ====== BACKDROP ====== */
.rf-backdrop[b-e4bzqzgh4q] {
    position: fixed;
    inset: 0;
    background: rgba(2,6,23,.62);
    backdrop-filter: blur(6px);
    z-index: 2500;
}

/* ====== MODAL ====== */
.rf-modal[b-e4bzqzgh4q] {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: min(1320px, 95vw);
    height: min(86vh, 860px);
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border-radius: 24px;
    box-shadow: 0 30px 90px rgba(0,0,0,.34);
    border: 1px solid rgba(37,99,235,.18);
    z-index: 2600;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* ====== HEADER (IGUAL QUE TB) ====== */
.rf-header[b-e4bzqzgh4q] {
    padding: 18px 18px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(15,23,42,.14);
    background: linear-gradient(135deg, #0b1220, #122a57);
    color: #ffffff;
}

.rf-titlewrap[b-e4bzqzgh4q] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 380px;
}

.rf-h1[b-e4bzqzgh4q] {
    font-weight: 950;
    font-size: 26px;
    letter-spacing: .2px;
    color: #ffffff;
}

.rf-badgebar[b-e4bzqzgh4q] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

.rf-badge[b-e4bzqzgh4q] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 999px;
    font-weight: 900;
    font-size: 14px;
    border: 1px solid rgba(255,255,255,.20);
    background: rgba(255,255,255,.10);
    color: #ffffff;
    box-shadow: 0 10px 22px rgba(0,0,0,.18);
}

.rf-badge-sorteo[b-e4bzqzgh4q] {
    background: rgba(34,197,94,.14);
    border-color: rgba(34,197,94,.30);
}

.rf-badge-juego[b-e4bzqzgh4q] {
    background: rgba(59,130,246,.16);
    border-color: rgba(59,130,246,.34);
}

.rf-badge-fechas[b-e4bzqzgh4q] {
    background: rgba(251,191,36,.16);
    border-color: rgba(251,191,36,.34);
}

.rf-header-right[b-e4bzqzgh4q] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* ====== CLOSE (IGUAL QUE TB) ====== */
.rf-close[b-e4bzqzgh4q] {
    border: 1px solid rgba(255,255,255,.22);
    background: rgba(255,255,255,.12);
    color: #ffffff;
    font-size: 18px;
    cursor: pointer;
    padding: 9px 12px;
    border-radius: 14px;
    box-shadow: 0 12px 24px rgba(0,0,0,.18);
    transition: transform .12s ease, box-shadow .12s ease;
}

    .rf-close:hover[b-e4bzqzgh4q] {
        transform: translateY(-1px);
        box-shadow: 0 16px 30px rgba(0,0,0,.24);
    }

/* ====== BODY ====== */
.rf-body[b-e4bzqzgh4q] {
    padding: 18px 18px;
    flex: 1;
    overflow: auto;
    background: radial-gradient(1200px 600px at 20% 0%, rgba(59,130,246,.10), transparent 60%), radial-gradient(900px 500px at 90% 30%, rgba(34,197,94,.10), transparent 60%), #f4f7ff;
}

    /* Scrollbar */
    .rf-body[b-e4bzqzgh4q]::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    .rf-body[b-e4bzqzgh4q]::-webkit-scrollbar-thumb {
        background: rgba(15,23,42,.22);
        border-radius: 12px;
    }

    .rf-body[b-e4bzqzgh4q]::-webkit-scrollbar-track {
        background: transparent;
    }

/* ====== GRID ====== */
.rf-grid[b-e4bzqzgh4q] {
    display: grid;
    grid-template-columns: repeat(3, minmax(240px, 1fr));
    gap: 14px;
}

/* responsivo */
@media (max-width: 1050px) {
    .rf-grid[b-e4bzqzgh4q] {
        grid-template-columns: repeat(2, minmax(240px, 1fr));
    }
}

@media (max-width: 720px) {
    .rf-grid[b-e4bzqzgh4q] {
        grid-template-columns: 1fr;
    }
}

/* ====== BOX / CARD ====== */
.rf-box[b-e4bzqzgh4q] {
    border: 1px solid rgba(15,23,42,.14);
    border-radius: 18px;
    padding: 16px 16px;
    background: linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 10px 24px rgba(15,23,42,.08);
    transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}

    .rf-box:hover[b-e4bzqzgh4q] {
        transform: translateY(-1px);
        border-color: rgba(59,130,246,.30);
        box-shadow: 0 16px 34px rgba(59,130,246,.12);
    }

.rf-k[b-e4bzqzgh4q] {
    font-weight: 950;
    font-size: 12px;
    letter-spacing: .2px;
    color: rgba(15,23,42,.70);
    text-transform: uppercase;
}

.rf-v[b-e4bzqzgh4q] {
    font-weight: 950;
    font-size: 28px;
    margin-top: 8px;
    color: #0f172a;
}

/* ✅ subtexto (incluye borrados) */
.rf-sub[b-e4bzqzgh4q] {
    margin-top: 6px;
    font-weight: 900;
    font-size: 13px;
    color: rgba(15,23,42,.62);
}

/* ✅ para que Total vendido se vea más pro */
.rf-box-wide[b-e4bzqzgh4q] {
    grid-column: span 3;
}

@media (max-width: 1050px) {
    .rf-box-wide[b-e4bzqzgh4q] {
        grid-column: span 2;
    }
}

@media (max-width: 720px) {
    .rf-box-wide[b-e4bzqzgh4q] {
        grid-column: span 1;
    }
}

/* ====== FOOTER ====== */
.rf-footer[b-e4bzqzgh4q] {
    padding: 14px 18px;
    border-top: 1px solid rgba(15,23,42,.14);
    display: flex;
    justify-content: flex-end;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
}

.rf-btn[b-e4bzqzgh4q] {
    border: none;
    border-radius: 16px;
    padding: 12px 18px;
    font-weight: 950;
    font-size: 15px;
    cursor: pointer;
    background: linear-gradient(180deg, #0f172a, #0b1220);
    color: #ffffff;
    box-shadow: 0 14px 28px rgba(15,23,42,.22);
    transition: transform .12s ease, box-shadow .12s ease;
}

    .rf-btn:hover[b-e4bzqzgh4q] {
        transform: translateY(-1px);
        box-shadow: 0 18px 34px rgba(15,23,42,.26);
    }

/* =========================
   ✅ TABS (Resumen / Impresos / WhatsApp)
   - Se integra al diseño RF (mismo look del modal)
   ========================= */

.rf-tabs[b-e4bzqzgh4q] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
    margin: 0 0 14px 0;
    padding: 12px 12px;
    border: 1px solid rgba(15,23,42,.14);
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 10px 24px rgba(15,23,42,.08);
}

.rf-tab[b-e4bzqzgh4q] {
    border: 1px solid rgba(15,23,42,.14);
    background: rgba(255,255,255,.92);
    color: #0f172a;
    font-weight: 950;
    font-size: 14px;
    padding: 10px 14px;
    border-radius: 14px;
    cursor: pointer;
    transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
    box-shadow: 0 10px 18px rgba(15,23,42,.10);
}

    .rf-tab:hover[b-e4bzqzgh4q] {
        transform: translateY(-1px);
        border-color: rgba(59,130,246,.30);
        box-shadow: 0 16px 28px rgba(59,130,246,.14);
    }

    .rf-tab.active[b-e4bzqzgh4q] {
        background: linear-gradient(135deg, #0b1220, #122a57);
        color: #ffffff;
        border-color: rgba(255,255,255,.20);
        box-shadow: 0 18px 34px rgba(0,0,0,.22);
    }

@media (max-width: 720px) {
    .rf-tabs[b-e4bzqzgh4q] {
        padding: 10px 10px;
    }

    .rf-tab[b-e4bzqzgh4q] {
        width: 100%;
        text-align: center;
    }
}
/* _content/SistemaLoteriaDashboard/Components/Ventas/ModalTiquetesBorrados.razor.rz.scp.css */
/* ====== BACKDROP ====== */
.tb-backdrop[b-sqd923my0z] {
    position: fixed;
    inset: 0;
    background: rgba(2,6,23,.62);
    backdrop-filter: blur(6px);
    z-index: 2500;
}

/* ====== MODAL ====== */
.tb-modal[b-sqd923my0z] {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: min(1320px, 95vw);
    height: min(86vh, 860px);
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border-radius: 24px;
    box-shadow: 0 30px 90px rgba(0,0,0,.34);
    border: 1px solid rgba(37,99,235,.18);
    z-index: 2600;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* ====== HEADER ====== */
.tb-header[b-sqd923my0z] {
    padding: 18px 18px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(15,23,42,.14);
    background: linear-gradient(135deg, #0b1220, #122a57);
    color: #ffffff;
}

.tb-titlewrap[b-sqd923my0z] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 380px;
}

.tb-h1[b-sqd923my0z] {
    font-weight: 950;
    font-size: 26px;
    letter-spacing: .2px;
    color: #ffffff;
}

.tb-h2[b-sqd923my0z] { /* ya no se usa, pero lo dejo por si algo */
    opacity: .92;
    font-size: 16px;
    margin-top: 4px;
    color: rgba(255,255,255,.86);
    font-weight: 700;
}

/* ====== BADGES (Sorteo / Juego / Fechas) ====== */
.tb-badgebar[b-sqd923my0z] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

.tb-badge[b-sqd923my0z] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 999px;
    font-weight: 900;
    font-size: 14px;
    border: 1px solid rgba(255,255,255,.20);
    background: rgba(255,255,255,.10);
    color: #ffffff;
    box-shadow: 0 10px 22px rgba(0,0,0,.18);
}

.tb-badge-sorteo[b-sqd923my0z] {
    background: rgba(34,197,94,.14);
    border-color: rgba(34,197,94,.30);
}

.tb-badge-juego[b-sqd923my0z] {
    background: rgba(59,130,246,.16);
    border-color: rgba(59,130,246,.34);
}

.tb-badge-fechas[b-sqd923my0z] {
    background: rgba(251,191,36,.16);
    border-color: rgba(251,191,36,.34);
}

/* ====== HEADER RIGHT ====== */
.tb-header-right[b-sqd923my0z] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* ====== SEARCH BAR ====== */
.tb-search[b-sqd923my0z] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 16px;
    background: rgba(255,255,255,.10);
    border: 1px solid rgba(255,255,255,.22);
    box-shadow: 0 12px 24px rgba(0,0,0,.18);
}

.tb-search-label[b-sqd923my0z] {
    font-weight: 950;
    font-size: 14px;
    letter-spacing: .2px;
    padding: 7px 10px;
    border-radius: 12px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.22);
    color: #ffffff;
}

.tb-search-btn[b-sqd923my0z] {
    border: 1px solid rgba(255,255,255,.22);
    background: rgba(255,255,255,.18);
    color: #ffffff;
    border-radius: 12px;
    padding: 9px 12px;
    font-weight: 950;
    font-size: 14px;
    cursor: pointer;
    transition: transform .12s ease, box-shadow .12s ease;
}

    .tb-search-btn:hover[b-sqd923my0z] {
        transform: translateY(-1px);
        box-shadow: 0 14px 26px rgba(0,0,0,.22);
    }

/* ====== CLOSE ====== */
.tb-close[b-sqd923my0z] {
    border: 1px solid rgba(255,255,255,.22);
    background: rgba(255,255,255,.12);
    color: #ffffff;
    font-size: 18px;
    cursor: pointer;
    padding: 9px 12px;
    border-radius: 14px;
    box-shadow: 0 12px 24px rgba(0,0,0,.18);
    transition: transform .12s ease, box-shadow .12s ease;
}

    .tb-close:hover[b-sqd923my0z] {
        transform: translateY(-1px);
        box-shadow: 0 16px 30px rgba(0,0,0,.24);
    }

/* ====== BODY ====== */
.tb-body[b-sqd923my0z] {
    padding: 18px 18px;
    flex: 1;
    overflow: auto;
    background: radial-gradient(1200px 600px at 20% 0%, rgba(59,130,246,.10), transparent 60%), radial-gradient(900px 500px at 90% 30%, rgba(34,197,94,.10), transparent 60%), #f4f7ff;
}

    /* Scrollbar */
    .tb-body[b-sqd923my0z]::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    .tb-body[b-sqd923my0z]::-webkit-scrollbar-thumb {
        background: rgba(15,23,42,.22);
        border-radius: 12px;
    }

    .tb-body[b-sqd923my0z]::-webkit-scrollbar-track {
        background: transparent;
    }

.tb-info[b-sqd923my0z] {
    padding: 14px;
    font-weight: 900;
    font-size: 18px;
    color: #0f172a;
    opacity: .95;
}

/* ====== TABLE WRAP ====== */
.tb-table[b-sqd923my0z] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* ====== ROWS ====== */
.tb-row[b-sqd923my0z] {
    display: grid;
    grid-template-columns: 110px 160px 150px 150px 150px 210px 150px;
    gap: 12px;
    padding: 16px 16px;
    border-radius: 18px;
    border: 1px solid rgba(15,23,42,.16);
    background: linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 10px 24px rgba(15,23,42,.07);
    color: #0f172a;
    font-size: 16px;
    font-weight: 750;
}

    .tb-row:hover[b-sqd923my0z] {
        border-color: rgba(59,130,246,.35);
        box-shadow: 0 16px 34px rgba(59,130,246,.12);
    }

/* ====== HEADER ROW (sticky) ====== */
.tb-head[b-sqd923my0z] {
    background: linear-gradient(180deg, #e8f0ff, #f4f7ff);
    font-weight: 950;
    font-size: 15px;
    letter-spacing: .3px;
    position: sticky;
    top: 0;
    z-index: 2;
    border-color: rgba(59,130,246,.22);
}

/* ====== ACTIONS ====== */
.tb-actions[b-sqd923my0z] {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}

.tb-mini[b-sqd923my0z] {
    border: 1px solid rgba(15,23,42,.18);
    background: linear-gradient(180deg, #ffffff, #f6f7fb);
    border-radius: 14px;
    padding: 10px 14px;
    font-weight: 950;
    font-size: 14px;
    cursor: pointer;
    box-shadow: 0 10px 20px rgba(0,0,0,.10);
    transition: transform .12s ease, box-shadow .12s ease;
}

    .tb-mini:hover[b-sqd923my0z] {
        transform: translateY(-1px);
        box-shadow: 0 14px 26px rgba(0,0,0,.14);
    }

/* ====== FOOTER ====== */
.tb-footer[b-sqd923my0z] {
    padding: 14px 18px;
    border-top: 1px solid rgba(15,23,42,.14);
    display: flex;
    justify-content: flex-end;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
}

.tb-btn[b-sqd923my0z] {
    border: none;
    border-radius: 16px;
    padding: 12px 18px;
    font-weight: 950;
    font-size: 15px;
    cursor: pointer;
    background: linear-gradient(180deg, #0f172a, #0b1220);
    color: #ffffff;
    box-shadow: 0 14px 28px rgba(15,23,42,.22);
    transition: transform .12s ease, box-shadow .12s ease;
}

    .tb-btn:hover[b-sqd923my0z] {
        transform: translateY(-1px);
        box-shadow: 0 18px 34px rgba(15,23,42,.26);
    }

.tb-btn-sec[b-sqd923my0z] {
    background: linear-gradient(180deg, #e5e7eb, #dfe3ea);
    color: #111827;
    box-shadow: none;
}

/* ====== PREVIEW MODAL ====== */
.tb-preview[b-sqd923my0z] {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: min(1100px, 95vw);
    height: min(86vh, 860px);
    background: #ffffff;
    border-radius: 24px;
    box-shadow: 0 30px 90px rgba(0,0,0,.34);
    border: 1px solid rgba(59,130,246,.18);
    z-index: 2700;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.tb-preview-header[b-sqd923my0z] {
    padding: 16px 18px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(15,23,42,.12);
    background: linear-gradient(180deg, #ffffff, #fbfcff);
}

.tb-preview-title[b-sqd923my0z] {
    font-weight: 950;
    font-size: 18px;
    color: #0f172a;
}

.tb-preview-body[b-sqd923my0z] {
    flex: 1;
    overflow: hidden;
    background: #f4f7ff;
}

.tb-frame[b-sqd923my0z] {
    width: 100%;
    height: 100%;
    border: 0;
}

.tb-preview-footer[b-sqd923my0z] {
    padding: 14px 16px;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    border-top: 1px solid rgba(15,23,42,.12);
    background: #ffffff;
}

/* ====== INPUT BUSCAR TICKET ====== */
.tb-input-ticket[b-sqd923my0z] {
    width: 180px;
    height: 40px;
    background: #ffffff;
    color: #0f172a;
    font-weight: 900;
    font-size: 16px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.28);
    padding: 0 12px;
    outline: none;
}

    .tb-input-ticket[b-sqd923my0z]::placeholder {
        color: rgba(255,255,255,.72);
        font-weight: 800;
    }

/* en header oscuro, se ve mejor si el input es translúcido */
.tb-search .tb-input-ticket[b-sqd923my0z] {
    background: rgba(255,255,255,.12);
    color: #ffffff;
    border-color: rgba(255,255,255,.22);
}

    .tb-search .tb-input-ticket[b-sqd923my0z]::placeholder {
        color: rgba(255,255,255,.72);
    }

    .tb-search .tb-input-ticket:focus[b-sqd923my0z] {
        border-color: rgba(34,197,94,.55);
        box-shadow: 0 0 0 3px rgba(34,197,94,.18);
    }
/* _content/SistemaLoteriaDashboard/Components/Ventas/ReimpresionesFacturasModal.razor.rz.scp.css */
/* =========================
   REIMPRESIONES (RF) - MISMO DISEÑO QUE TB
   ========================= */

/* ====== BACKDROP ====== */
.rf-backdrop[b-sbbiaz5xg0] {
    position: fixed;
    inset: 0;
    background: rgba(2,6,23,.62);
    backdrop-filter: blur(6px);
    z-index: 4000;
}

/* ====== MODAL ====== */
.rf-modal[b-sbbiaz5xg0] {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: min(1320px, 95vw);
    height: min(86vh, 860px);
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    border-radius: 24px;
    box-shadow: 0 30px 90px rgba(0,0,0,.34);
    border: 1px solid rgba(37,99,235,.18);
    z-index: 4010;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* Si tienes un modal preview interno */
.rf-preview[b-sbbiaz5xg0] {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: min(1100px, 95vw);
    height: min(86vh, 860px);
    background: #ffffff;
    border-radius: 24px;
    box-shadow: 0 30px 90px rgba(0,0,0,.34);
    border: 1px solid rgba(59,130,246,.18);
    z-index: 4020;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* ====== HEADER ====== */
.rf-header[b-sbbiaz5xg0] {
    padding: 18px 18px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(15,23,42,.14);
    background: linear-gradient(135deg, #0b1220, #122a57);
    color: #ffffff;
}

.rf-title[b-sbbiaz5xg0] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 380px;
}

.rf-h1[b-sbbiaz5xg0] {
    font-weight: 950;
    font-size: 26px;
    letter-spacing: .2px;
    color: #ffffff;
}

.rf-h2[b-sbbiaz5xg0] {
    opacity: .92;
    font-size: 16px;
    margin-top: 4px;
    color: rgba(255,255,255,.86);
    font-weight: 700;
}

/* ====== BADGES (Sorteo / Juego / Fechas) ====== */
.rf-badgebar[b-sbbiaz5xg0] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

.rf-badge[b-sbbiaz5xg0] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 999px;
    font-weight: 900;
    font-size: 14px;
    border: 1px solid rgba(255,255,255,.20);
    background: rgba(255,255,255,.10);
    color: #ffffff;
    box-shadow: 0 10px 22px rgba(0,0,0,.18);
}

.rf-badge-sorteo[b-sbbiaz5xg0] {
    background: rgba(34,197,94,.14);
    border-color: rgba(34,197,94,.30);
}

.rf-badge-juego[b-sbbiaz5xg0] {
    background: rgba(59,130,246,.16);
    border-color: rgba(59,130,246,.34);
}

.rf-badge-fechas[b-sbbiaz5xg0] {
    background: rgba(251,191,36,.16);
    border-color: rgba(251,191,36,.34);
}

/* ====== HEADER RIGHT ====== */
.rf-header-right[b-sbbiaz5xg0] {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* ====== BOTÓN CERRAR ====== */
.rf-close[b-sbbiaz5xg0] {
    border: 1px solid rgba(255,255,255,.22);
    background: rgba(255,255,255,.12);
    color: #ffffff;
    font-size: 18px;
    cursor: pointer;
    padding: 9px 12px;
    border-radius: 14px;
    box-shadow: 0 12px 24px rgba(0,0,0,.18);
    transition: transform .12s ease, box-shadow .12s ease;
}

    .rf-close:hover[b-sbbiaz5xg0] {
        transform: translateY(-1px);
        box-shadow: 0 16px 30px rgba(0,0,0,.24);
    }

/* ====== TOOLBAR (si usas recargar) ====== */
.rf-toolbar[b-sbbiaz5xg0] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 18px;
    border-bottom: 1px solid rgba(15,23,42,.14);
    background: linear-gradient(180deg, #ffffff, #f8fbff);
}

.rf-mini[b-sbbiaz5xg0] {
    border: 1px solid rgba(15,23,42,.18);
    background: linear-gradient(180deg, #ffffff, #f6f7fb);
    border-radius: 14px;
    padding: 10px 14px;
    font-weight: 950;
    font-size: 14px;
    cursor: pointer;
    box-shadow: 0 10px 20px rgba(0,0,0,.10);
    transition: transform .12s ease, box-shadow .12s ease;
}

    .rf-mini:hover[b-sbbiaz5xg0] {
        transform: translateY(-1px);
        box-shadow: 0 14px 26px rgba(0,0,0,.14);
    }

/* ====== BODY ====== */
.rf-body[b-sbbiaz5xg0] {
    padding: 18px 18px;
    overflow: auto;
    flex: 1;
    background: radial-gradient(1200px 600px at 20% 0%, rgba(59,130,246,.10), transparent 60%), radial-gradient(900px 500px at 90% 30%, rgba(34,197,94,.10), transparent 60%), #f4f7ff;
}

    .rf-body[b-sbbiaz5xg0]::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    .rf-body[b-sbbiaz5xg0]::-webkit-scrollbar-thumb {
        background: rgba(15,23,42,.22);
        border-radius: 12px;
    }

    .rf-body[b-sbbiaz5xg0]::-webkit-scrollbar-track {
        background: transparent;
    }

.rf-loading[b-sbbiaz5xg0],
.rf-empty[b-sbbiaz5xg0] {
    padding: 14px;
    font-weight: 900;
    font-size: 18px;
    color: #0f172a;
    opacity: .95;
    text-align: center;
}

/* ====== TABLE ====== */
.rf-table[b-sbbiaz5xg0] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.rf-row[b-sbbiaz5xg0] {
    display: grid;
    /* ajusta columnas a tu contenido real */
    grid-template-columns: 140px 160px 220px 70px;
    align-items: center;
    gap: 12px;
    padding: 16px 16px;
    border-radius: 18px;
    border: 1px solid rgba(15,23,42,.16);
    background: linear-gradient(180deg, #ffffff, #fbfdff);
    box-shadow: 0 10px 24px rgba(15,23,42,.07);
    color: #0f172a;
    font-size: 16px;
    font-weight: 750;
}

    .rf-row:hover[b-sbbiaz5xg0] {
        border-color: rgba(59,130,246,.35);
        box-shadow: 0 16px 34px rgba(59,130,246,.12);
    }

.rf-head[b-sbbiaz5xg0] {
    background: linear-gradient(180deg, #e8f0ff, #f4f7ff);
    font-weight: 950;
    font-size: 15px;
    letter-spacing: .3px;
    position: sticky;
    top: 0;
    z-index: 2;
    border-color: rgba(59,130,246,.22);
    color: #0f172a;
}

.rf-ticket[b-sbbiaz5xg0] {
    font-weight: 950;
    color: #0f172a;
}

/* Acciones */
.rf-col-actions[b-sbbiaz5xg0] {
    display: flex;
    justify-content: center;
    gap: 10px;
}

.rf-iconbtn[b-sbbiaz5xg0] {
    border: 1px solid rgba(15,23,42,.18);
    background: linear-gradient(180deg, #ffffff, #f6f7fb);
    border-radius: 14px;
    padding: 10px 14px;
    font-weight: 950;
    font-size: 14px;
    cursor: pointer;
    box-shadow: 0 10px 20px rgba(0,0,0,.10);
    transition: transform .12s ease, box-shadow .12s ease;
}

    .rf-iconbtn:hover[b-sbbiaz5xg0] {
        transform: translateY(-1px);
        box-shadow: 0 14px 26px rgba(0,0,0,.14);
    }

/* ====== FOOTER ====== */
.rf-footer[b-sbbiaz5xg0] {
    padding: 14px 18px;
    border-top: 1px solid rgba(15,23,42,.14);
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    background: linear-gradient(180deg, #ffffff, #f8fbff);
}

.rf-btn[b-sbbiaz5xg0] {
    border: none;
    border-radius: 16px;
    padding: 12px 18px;
    font-weight: 950;
    font-size: 15px;
    cursor: pointer;
    background: linear-gradient(180deg, #0f172a, #0b1220);
    color: #ffffff;
    box-shadow: 0 14px 28px rgba(15,23,42,.22);
    transition: transform .12s ease, box-shadow .12s ease;
}

    .rf-btn:hover[b-sbbiaz5xg0] {
        transform: translateY(-1px);
        box-shadow: 0 18px 34px rgba(15,23,42,.26);
    }

.rf-btn-sec[b-sbbiaz5xg0] {
    background: linear-gradient(180deg, #e5e7eb, #dfe3ea);
    color: #111827;
    box-shadow: none;
}

/* ====== IFRAME PREVIEW ====== */
.rf-iframe[b-sbbiaz5xg0] {
    width: 100%;
    height: 700px; /* ⬅ más alto */
    border: 0;
    /* 🔍 ZOOM visual del ticket */
    zoom: 1.90; /* ⬅ AUMENTA tamaño (1.25–1.5 recomendado) */
}

.rf-ticket-preview-wrap[b-sbbiaz5xg0] {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 18px;
}

.rf-ticket-preview[b-sbbiaz5xg0] {
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 18px 40px rgba(0,0,0,.18);
    border: 1px solid rgba(15,23,42,.15);
    padding: 10px 8px;
}

/* _content/SistemaLoteriaDashboard/Components/Ventas/ReimpresionTiemposModal.razor.rz.scp.css */
.rt-backdrop[b-zgnwole1vp] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    z-index: 9998;
}

.rt-modal[b-zgnwole1vp] {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    width: min(1050px, 95vw);
    max-height: 92vh;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 20px 60px rgba(0,0,0,.25);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    /* ✅ borde más oscuro para que destaque */
    border: 1px solid #7ea6df;
}

.rt-header[b-zgnwole1vp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    background: #d8e7ff;
    /* ✅ borde más oscuro */
    border-bottom: 1px solid #7ea6df;
}

.rt-title[b-zgnwole1vp] {
    display: flex;
    gap: 10px;
    align-items: center;
}

.rt-icon[b-zgnwole1vp] {
    font-size: 22px;
}

.rt-h1[b-zgnwole1vp] {
    font-weight: 900;
    color: #0b3b91;
    font-size: 18px;
}

.rt-h2[b-zgnwole1vp] {
    font-weight: 700;
    color: #0b3b91;
    opacity: .85;
    font-size: 13px;
}

.rt-close[b-zgnwole1vp] {
    width: 34px;
    height: 34px;
    border: 1px solid #7ea6df; /* ✅ */
    border-radius: 10px;
    background: #ffffff;
    cursor: pointer;
    font-weight: 900;
}

.rt-tools[b-zgnwole1vp] {
    display: flex;
    gap: 12px;
    padding: 12px 16px;
    background: #f6f9ff;
    /* ✅ borde más oscuro */
    border-bottom: 1px solid #7ea6df;
    flex-wrap: wrap;
    align-items: flex-end;
}

.rt-field[b-zgnwole1vp] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

    .rt-field label[b-zgnwole1vp] {
        font-size: 12px;
        font-weight: 800;
        color: #153e75;
    }

/* ✅ Fecha más grande */
.rt-date .rt-input[b-zgnwole1vp] {
    height: 44px;
    font-size: 16px;
    font-weight: 800;
    padding: 0 12px;
}

/* ✅ inputs con borde más oscuro */
.rt-input[b-zgnwole1vp] {
    height: 38px;
    border: 1px solid #7ea6df;
    border-radius: 10px;
    padding: 0 10px;
    outline: none;
}

    .rt-input:focus[b-zgnwole1vp] {
        border-color: #1d6fe8;
        box-shadow: 0 0 0 3px rgba(29,111,232,.18);
    }

/* ✅ BUSCADOR: input pequeño y botón al lado */
.rt-buscar[b-zgnwole1vp] {
    flex: 1;
    min-width: 320px;
    display: flex;
    flex-direction: column;
}

.rt-buscar-row[b-zgnwole1vp] {
    display: flex;
    gap: 10px;
    align-items: center;
}

.rt-searchbox[b-zgnwole1vp] {
    flex: 0 1 420px; /* ✅ no tan grande */
    height: 34px; /* ✅ más pequeño */
    font-size: 13px;
    padding: 0 10px;
}

/* ✅ botón buscar cuadrado */
.rt-btn[b-zgnwole1vp] {
    height: 34px;
    width: 42px;
    border: 1px solid #0f55bf; /* borde para que se note */
    border-radius: 10px;
    background: #1d6fe8;
    color: #fff;
    font-weight: 900;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    .rt-btn span[b-zgnwole1vp] {
        display: none; /* ✅ ocultamos texto si lo tienes */
    }

    .rt-btn i[b-zgnwole1vp], .rt-btn .rt-btn-ico[b-zgnwole1vp] {
        font-size: 16px; /* ✅ icono visible */
        line-height: 1;
    }

.rt-body[b-zgnwole1vp] {
    padding: 12px 16px;
    overflow: auto;
}

.rt-loading[b-zgnwole1vp], .rt-empty[b-zgnwole1vp] {
    padding: 18px;
    border: 1px dashed #7ea6df; /* ✅ */
    border-radius: 12px;
    background: #fbfdff;
    color: #153e75;
    font-weight: 800;
}

.rt-table[b-zgnwole1vp] {
    width: 100%;
}

/* ✅ filas con bordes más oscuros */
.rt-row[b-zgnwole1vp] {
    display: grid;
    gap: 0;
    align-items: center;
    border: 1px solid #7ea6df; /* ✅ */
    border-radius: 10px;
    margin-bottom: 8px;
    overflow: hidden;
    cursor: pointer;
}

/* =========================================================
   ✅ COLUMNAS CORRECTAS según modo (SIN/CON REVENTADO)
   - rt-norm  = 5 columnas
   - rt-rvta  = 6 columnas
   ========================================================= */

/* SIN Reventado: #Ticket | Total Base | Tipo Sorteo | Fecha | Botón */
.rt-table.rt-norm .rt-row[b-zgnwole1vp] {
    grid-template-columns: 110px 140px 2.3fr 140px 44px;
}

/* CON Reventado: #Ticket | Total Base | Total Rvta | Tipo Sorteo | Fecha | Botón */
.rt-table.rt-rvta .rt-row[b-zgnwole1vp] {
    grid-template-columns: 110px 120px 120px 2.1fr 140px 44px;
}

    /* =========================================================
   ✅ Tipo Sorteo en 1 sola línea (sin brincos)
   ========================================================= */
    .rt-table.rt-norm .rt-row > div:nth-child(3)[b-zgnwole1vp],
    .rt-table.rt-rvta .rt-row > div:nth-child(4)[b-zgnwole1vp] {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* Fecha también sin brincos */
    .rt-table.rt-norm .rt-row > div:nth-child(4)[b-zgnwole1vp],
    .rt-table.rt-rvta .rt-row > div:nth-child(5)[b-zgnwole1vp] {
        white-space: nowrap;
    }

/* =========================================================
   ✅ Última columna (botón imprimir) MUCHO más pequeña
   ========================================================= */
.rt-col-print[b-zgnwole1vp] {
    justify-content: center;
    align-items: center;
}

.rt-print[b-zgnwole1vp] {
    width: 28px;
    height: 26px;
    border-radius: 7px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
}

/* Un poco menos de padding en la última celda (para que no se vea “gorda”) */
.rt-row > div:last-child[b-zgnwole1vp] {
    padding: 6px 6px;
}

.rt-head[b-zgnwole1vp] {
    background: #1b73d1;
    color: #fff;
    font-weight: 900;
    cursor: default;
    border-color: #1b73d1;
}

.rt-row > div[b-zgnwole1vp] {
    padding: 10px 10px;
    background: #fff;
    border-right: 1px solid #d0def4; /* ✅ separadores un poquito más notables */
}

    .rt-row > div:last-child[b-zgnwole1vp] {
        border-right: none;
    }

.rt-head > div[b-zgnwole1vp] {
    background: transparent;
    border-right: 1px solid rgba(255,255,255,.25);
}

/* ✅ selección MUY visible */
/* ✅ SELECCIÓN CLARAMENTE VISIBLE */
.rt-row.rt-selected[b-zgnwole1vp] {
    background: #cfe0ff; /* fondo fuerte */
    border-color: #1d6fe8; /* borde azul intenso */
    box-shadow: inset 0 0 0 2px #1d6fe8, /* borde interno */
    0 4px 12px rgba(29,111,232,.35); /* sombra externa */
}

    /* ✅ Celdas internas también se resaltan */
    .rt-row.rt-selected > div[b-zgnwole1vp] {
        background: #e8f0ff !important;
        font-weight: 900;
        color: #0b3b91;
    }

    /* ✅ Barra lateral de selección */
    .rt-row.rt-selected[b-zgnwole1vp]::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 6px;
        background: #1d6fe8;
    }



/* ✅ hover para ver mejor el foco */
.rt-row:not(.rt-head):hover[b-zgnwole1vp] {
    outline: 2px solid rgba(29,111,232,.20);
}

.rt-col-print[b-zgnwole1vp] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.rt-print[b-zgnwole1vp] {
    width: 36px;
    height: 30px;
    border: 1px solid #1b8a35; /* ✅ */
    border-radius: 8px;
    background: #33b14a;
    color: #fff;
    cursor: pointer;
}

.rt-hide[b-zgnwole1vp] {
    display: none !important;
}

.rt-footer[b-zgnwole1vp] {
    padding: 12px 16px;
    border-top: 1px solid #7ea6df; /* ✅ */
    display: flex;
    justify-content: flex-end;
    background: #fff;
}

.rt-btn-sec[b-zgnwole1vp] {
    background: #e9f1ff;
    color: #0b3b91;
    border: 1px solid #7ea6df;
}

/* ✅ Buscador: número más grande + negrita */
.rt-searchbox[b-zgnwole1vp] {
    font-size: 15px;
    font-weight: 800;
    letter-spacing: .3px;
}

/* ✅ Botón buscar: más pequeño y cuadrado */
.rt-buscar-row .rt-btn[b-zgnwole1vp] {
    width: 38px;
    min-width: 38px;
    padding: 0;
}

/* ✅ Bordes más oscuros para que se noten */
.rt-row[b-zgnwole1vp] {
    border-color: #a9bddf;
    position: relative;
}

    .rt-row > div[b-zgnwole1vp] {
        border-right: 1px solid #a9bddf;
    }

        .rt-row > div:last-child[b-zgnwole1vp] {
            border-right: none;
        }

    .rt-row.rt-selected[b-zgnwole1vp]::before {
        pointer-events: none;
    }

/* _content/SistemaLoteriaDashboard/Components/Ventas/VentasMonazos.razor.rz.scp.css */
/* ==========================================================
   🧩 LAYOUT PRINCIPAL
   ========================================================== */
/* ==========================================================
   🧩 LAYOUT PRINCIPAL (3 COLUMNAS reales)
   ========================================================== */
:root[b-lhcb8y1bi1] {
    --ancho-prohibidos: 360px;
    --ancho-noticias: 360px;
    --ancho-izquierda: 700px;
}

.ventas-contenido[b-lhcb8y1bi1] {
    display: grid;
    grid-template-columns: minmax(640px, var(--ancho-izquierda)) minmax(280px, var(--ancho-prohibidos)) minmax(280px, var(--ancho-noticias));
    gap: 24px;
    align-items: start;
    max-width: 1400px;
    margin: 12px auto 0;
    padding: 0 20px; /* ✅ iguala con encabezado (que usa 20px) */
    width: 100%;
    box-sizing: border-box;
}


/* ==========================================================
   🧩 PANEL IZQUIERDO (VENTAS)
   ========================================================== */
.ventas-izquierda[b-lhcb8y1bi1] {
    flex: 1;
    min-width: 400px;
    max-width: 700px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    background: #fff;
    border: 2px solid #e0e0e0;
    border-radius: 10px;
    padding: 15px;
    box-sizing: border-box;
    min-height: 300px;
    margin: 0;
}

/* ====== LISTA (contenedor con scroll) ====== */
.ventas-lista[b-lhcb8y1bi1] {
    position: relative;
    border: 2px solid #e0e6f1;
    border-radius: 8px;
    background: #fff;
    max-height: 420px;
    overflow-y: auto;
    overflow-x: hidden;
    scroll-behavior: smooth;
    scrollbar-gutter: stable;
    padding: 0;
}

/* ====== GRID UNIFICADO (cabecera + filas) ====== */
.tabla-lista[b-lhcb8y1bi1] {
    display: grid;
    grid-template-columns: 120px 170px 56px;
    width: 100%;
    row-gap: 0;
    justify-content: center;
    margin: 0 auto;
}

    /* Modo BASE con reventado: columnas flexibles para que no se salgan con zoom */
    .tabla-lista.reventado[b-lhcb8y1bi1] {
        grid-template-columns: minmax(90px, 1.1fr) /* N°  */
        minmax(120px, 1.4fr) /* Monto normal */
        minmax(120px, 1.4fr) /* Monto reventado */
        minmax(40px, 0.6fr); /* Botón X */
    }

/* Cabecera y filas comparten el MISMO grid */
.fila-cabecera[b-lhcb8y1bi1],
.fila-item[b-lhcb8y1bi1] {
    display: contents;
}

/* ====== CELDAS ====== */
.celda[b-lhcb8y1bi1] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    text-align: right;
    padding: 10px 12px;
    min-height: 44px;
    font-weight: 800;
    font-size: 20px;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
    border-bottom: 1px solid #e6ecf6;
}

    /* CABECERA (títulos centrados y más grandes) */
    .celda.titulo[b-lhcb8y1bi1] {
        position: sticky;
        top: 0;
        z-index: 10;
        background: #f7f9fc;
        border-bottom: 2px solid #e0e6f1;
        box-shadow: 0 1px 0 #e0e6f1;
        text-align: center;
        justify-content: center;
        align-items: center;
        font-weight: 900;
        font-size: 22px;
        color: #1c2b4d;
        height: 48px;
    }

        /* La celda de cabecera de la columna de la X (vacía pero sticky) */
        .celda.titulo.th-x[b-lhcb8y1bi1] {
            background: #f7f9fc;
            pointer-events: none;
        }

/* Celdas normales (centradas igual) */
.celda[b-lhcb8y1bi1],
.fila-item .numero[b-lhcb8y1bi1],
.fila-item .monto[b-lhcb8y1bi1] {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 800;
    font-size: 20px;
    height: 48px;
}

/* Guion perfectamente centrado entre Número y Monto */
.fila-item .celda.numero[b-lhcb8y1bi1]::after {
    content: "–";
    color: #76acfe;
    font-weight: 600;
    font-size: 20px;
    position: relative;
    left: 65%;
    transform: translateX(-50%);
    top: 25%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

/* ========== BOTÓN ELIMINAR (moderno y elegante) ========== */
.btn-eliminar[b-lhcb8y1bi1] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 10px;
    background: linear-gradient(180deg,#ff5c5c,#d93636);
    box-shadow: 0 6px 14px rgba(217,54,54,.25), inset 0 1px 0 rgba(255,255,255,.28);
    cursor: pointer;
    padding: 0;
    font-size: 0;
    line-height: 1;
    margin: auto;
    z-index: 1;
    transition: transform .12s ease, box-shadow .18s ease, filter .18s ease, background .18s ease;
}

    .btn-eliminar[b-lhcb8y1bi1]::before,
    .btn-eliminar[b-lhcb8y1bi1]::after {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        width: 14px;
        height: 2px;
        background: #fff;
        border-radius: 2px;
        transform-origin: center;
        box-shadow: 0 0 1px rgba(0,0,0,.25);
    }

    .btn-eliminar[b-lhcb8y1bi1]::before {
        transform: translate(-50%,-50%) rotate(45deg);
    }

    .btn-eliminar[b-lhcb8y1bi1]::after {
        transform: translate(-50%,-50%) rotate(-45deg);
    }

    .btn-eliminar:hover[b-lhcb8y1bi1] {
        transform: translateY(-1px) scale(1.03);
        filter: saturate(1.06);
        box-shadow: 0 10px 20px rgba(217,54,54,.28), inset 0 1px 0 rgba(255,255,255,.32);
    }

    .btn-eliminar:active[b-lhcb8y1bi1] {
        transform: translateY(0) scale(.97);
        box-shadow: 0 4px 10px rgba(217,54,54,.22), inset 0 1px 0 rgba(255,255,255,.24);
    }

    .btn-eliminar:focus-visible[b-lhcb8y1bi1] {
        outline: 3px solid rgba(25,118,210,.35);
        outline-offset: 2px;
        box-shadow: 0 0 0 4px rgba(25,118,210,.15), 0 8px 18px rgba(217,54,54,.25), inset 0 1px 0 rgba(255,255,255,.28);
    }

@media (prefers-reduced-motion: reduce) {
    .btn-eliminar[b-lhcb8y1bi1] {
        transition: none;
    }
}

/* ====== SEPARADOR ====== */
.separador[b-lhcb8y1bi1] {
    border: none;
    border-top: 2px solid #d9e0ef;
    margin: 8px 0;
}

/* ====== CAMPOS DE ENTRADA ====== */
.input-linea[b-lhcb8y1bi1] {
    display: flex;
    gap: 10px;
    margin: 10px 0;
    justify-content: center;
    /* 👇 NUEVO: si con 3 cajas no cabe, que hagan otra fila
       en vez de salirse del panel al hacer zoom */
    flex-wrap: wrap;
    max-width: 100%;
}

.input-pequeno[b-lhcb8y1bi1] {
    padding: 12px;
    font-size: 24px;
    font-weight: 800;
    border: 2px solid #ccc;
    border-radius: 8px;
    text-align: center;
    transition: .2s;
    /* 👇 NUEVO: ancho base, pero puede encogerse si hace falta */
    flex: 1 1 120px;
    max-width: 210px;
}

    .input-pequeno:focus[b-lhcb8y1bi1] {
        border-color: #1e88e5;
        box-shadow: 0 0 5px rgba(30,136,229,.4);
        outline: none;
    }

.monto-corto[b-lhcb8y1bi1] {
    width: 120px;
}

.numero-corto[b-lhcb8y1bi1] {
    width: 120px;
}

/* ====== BOTÓN GUARDAR / IMPRIMIR ====== */
.btn-guardar[b-lhcb8y1bi1] {
    background: linear-gradient(90deg,#1976d2,#1e88e5);
    color: #fff;
    border: none;
    border-radius: 10px;
    padding: 12px 22px;
    cursor: pointer;
    font-weight: 800;
    font-size: 16px;
    transition: .2s;
}

    .btn-guardar:hover[b-lhcb8y1bi1] {
        background: linear-gradient(90deg,#1565c0,#1976d2);
    }

/* ====== TOTAL ====== */
.total[b-lhcb8y1bi1] {
    font-size: 22px;
    font-weight: 800;
    text-align: right;
    color: #003c8f;
    margin-top: 10px;
}

@media (max-width:520px) {
    .tabla-lista[b-lhcb8y1bi1] {
        grid-template-columns: 100px 140px 46px;
    }

        .tabla-lista.reventado[b-lhcb8y1bi1] {
            grid-template-columns: minmax(70px, 1.1fr) /* N° */
            minmax(90px, 1.3fr) /* Monto */
            minmax(90px, 1.3fr) /* Monto R */
            minmax(34px, 0.5fr); /* X */
        }

    .celda[b-lhcb8y1bi1] {
        font-size: 18px;
    }
}

/* ===== Panel de Números Prohibidos con título rojo, fecha y ajuste dinámico ===== */
.numeros-prohibidos-panel[b-lhcb8y1bi1] {
    align-self: flex-start;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.1);
    padding: 16px 24px;
    border: 2px solid #c62828;
    text-align: center;
    display: inline-block;
    transition: all 0.3s ease;
    width: auto;
    height: auto;
    min-width: 240px;
}

    .numeros-prohibidos-panel h4[b-lhcb8y1bi1] {
        color: #c62828;
        font-weight: 800;
        font-size: 1.45em;
        margin: 0 0 8px 0;
    }

.np-fecha[b-lhcb8y1bi1] {
    font-size: 1.1em;
    font-weight: 700;
    color: #333;
    margin-top: 2px;
    margin-bottom: 10px;
    text-transform: capitalize;
}

.numeros-prohibidos[b-lhcb8y1bi1] {
    list-style: none;
    padding: 0;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
}

    .numeros-prohibidos li[b-lhcb8y1bi1] {
        color: #e53935;
        font-weight: 700;
        background: #ffebee;
        padding: 6px 12px;
        border-radius: 8px;
        min-width: 40px;
        text-align: center;
        font-size: 1.15em;
        transition: transform 0.2s ease, background 0.2s ease;
    }

        .numeros-prohibidos li:hover[b-lhcb8y1bi1] {
            background: #ffcdd2;
            transform: scale(1.08);
        }

/* ==========================================================
   🧩 ENCABEZADO
   ========================================================== */
.ventas-encabezado[b-lhcb8y1bi1] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding: 15px 25px 25px;
    background: linear-gradient(90deg, #f7f9fb, #e3f2fd);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    margin: 10px 20px 0;
}

.titulo-sorteo[b-lhcb8y1bi1] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    position: relative;
}

.sorteo-selector-titulo[b-lhcb8y1bi1] {
    position: relative;
    cursor: pointer;
    user-select: none;
    display: inline-block;
}

.sorteo-nombre[b-lhcb8y1bi1] {
    font-size: 2.2em;
    font-weight: 800;
    color: #004aad;
    letter-spacing: 1px;
    margin: 0;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.15);
    animation: colorCambio-b-lhcb8y1bi1 4s linear infinite;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: transform 0.2s ease;
}

    .sorteo-nombre:hover[b-lhcb8y1bi1] {
        transform: scale(1.02);
    }

.flecha[b-lhcb8y1bi1] {
    font-size: 0.6em;
    margin-left: 6px;
    transition: transform 0.3s ease;
}

.sorteo-selector-titulo:hover .flecha[b-lhcb8y1bi1] {
    transform: rotate(180deg);
}

.menu-sorteos[b-lhcb8y1bi1] {
    position: absolute;
    top: 100%;
    left: 0;
    transform: none;
    width: 220px;
    background: #ffffff;
    border: 2px solid #cfd8dc;
    border-radius: 10px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
    margin-top: 8px;
    padding: 6px 0;
    list-style: none;
    z-index: 20;
    animation: aparecerMenu-b-lhcb8y1bi1 0.2s ease-out forwards;
}

    .menu-sorteos li[b-lhcb8y1bi1] {
        font-weight: 700;
        color: #0d47a1;
        font-size: 1.1em;
        padding: 10px 16px;
        text-align: center;
        transition: all 0.2s ease;
        border-radius: 6px;
    }

        .menu-sorteos li:hover[b-lhcb8y1bi1] {
            background: #e3f2fd;
            color: #003c8f;
            transform: scale(1.03);
        }

        .menu-sorteos li.activo[b-lhcb8y1bi1] {
            background: #bbdefb;
            color: #0d47a1;
        }

@keyframes aparecerMenu-b-lhcb8y1bi1 {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes colorCambio-b-lhcb8y1bi1 {
    0% {
        color: #e53935;
    }

    25% {
        color: #f9a825;
    }

    50% {
        color: #1e88e5;
    }

    75% {
        color: #43a047;
    }

    100% {
        color: #e53935;
    }
}

.hora-info[b-lhcb8y1bi1] {
    font-size: 1.05em;
    color: #0d47a1;
    font-weight: 600;
}

    .hora-info strong[b-lhcb8y1bi1] {
        color: #1a237e;
    }

.hora-numero[b-lhcb8y1bi1] {
    font-size: 1.4em;
    font-weight: 700;
    color: #0d47a1;
}

/* === Fecha centrada === */
.fecha-centro[b-lhcb8y1bi1] {
    position: absolute;
    top: 85px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
}

.fecha-texto[b-lhcb8y1bi1] {
    font-size: 1.35em;
    font-weight: 800;
    color: #2c3e50;
    text-transform: capitalize;
}

.hora-texto[b-lhcb8y1bi1] {
    font-size: 1.15em;
    font-weight: 700;
    color: #1565c0;
    letter-spacing: 1px;
}

/* ==========================================================
   🧩 BOTONES SECUNDARIOS
   ========================================================== */
.acciones-internas[b-lhcb8y1bi1] {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 15px;
}

.btn-secundario[b-lhcb8y1bi1] {
    background: linear-gradient(90deg, #e3f2fd, #bbdefb);
    color: #0d47a1;
    border: 1px solid #64b5f6;
    border-radius: 8px;
    padding: 8px 14px;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.95rem;
    transition: 0.2s;
}

    .btn-secundario:hover[b-lhcb8y1bi1] {
        background: linear-gradient(90deg, #bbdefb, #90caf9);
    }

.btn-guardar:active[b-lhcb8y1bi1],
.menu-btn:active[b-lhcb8y1bi1] {
    transform: scale(0.97);
}

/* ===============================
   🎯 CONTADOR DE TIEMPO RESTANTE
   =============================== */
.ventas-encabezado .contador[b-lhcb8y1bi1],
.contador[b-lhcb8y1bi1] {
    font-size: 1.5em;
    font-weight: 800;
    color: #d32f2f;
    background: none;
    border-radius: 0;
    padding: 0;
    min-width: 85px;
    text-align: center;
    transition: all 0.3s ease;
}

    .ventas-encabezado .contador.critico[b-lhcb8y1bi1],
    .contador.critico[b-lhcb8y1bi1] {
        animation: parpadeoRojo-b-lhcb8y1bi1 1s infinite alternate ease-in-out;
    }

@keyframes parpadeoRojo-b-lhcb8y1bi1 {
    0% {
        color: #d32f2f;
        transform: scale(1);
    }

    50% {
        color: #ff0000;
        transform: scale(1.05);
    }

    100% {
        color: #b71c1c;
        transform: scale(1);
    }
}
/* ===========================
   PANEL DE NOTICIAS (derecha)
   =========================== */
.panel-noticias[b-lhcb8y1bi1] {
    position: relative;
    width: 100%; /* ✅ que use la columna, no 520px fijo */
    max-width: 100%;
    background: #f7fbff;
    border-radius: 12px;
    padding: 14px 16px;
    height: auto;
    z-index: 10;
    margin-top: 0; /* ✅ nada raro */
    margin-left: 0; /* ✅ nada de empujar */
    box-sizing: border-box;
}

    .panel-noticias .header[b-lhcb8y1bi1] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        margin-bottom: 10px;
    }

        .panel-noticias .header h3[b-lhcb8y1bi1] {
            margin: 0;
            font-size: 1.25rem;
            font-weight: 900;
            color: #0d47a1;
            letter-spacing: .3px;
        }

    .panel-noticias .acciones[b-lhcb8y1bi1] {
        display: flex;
        gap: 8px;
    }

.btn-icono[b-lhcb8y1bi1] {
    border: 1px solid #c5d6f2;
    background: #e9f2ff;
    border-radius: 8px;
    padding: 6px 10px;
    font-weight: 700;
    cursor: pointer;
    transition: .2s;
}

    .btn-icono:hover[b-lhcb8y1bi1] {
        background: #d9eaff;
    }

.noticias-scroll[b-lhcb8y1bi1] {
    max-height: 520px;
    overflow-y: auto;
    padding-right: 6px;
    scrollbar-gutter: stable;
}

.noticia-card[b-lhcb8y1bi1] {
    background: #ffffff;
    border: 2px solid #e6edf8;
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 10px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.04);
    transition: transform .15s ease, box-shadow .2s ease;
}

    .noticia-card:hover[b-lhcb8y1bi1] {
        transform: translateY(-1px);
        box-shadow: 0 6px 16px rgba(0,0,0,0.08);
    }

.noticia-top[b-lhcb8y1bi1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 6px;
}

.noticia-titulo[b-lhcb8y1bi1] {
    font-weight: 900;
    font-size: 1.05rem;
    color: #153e75;
    margin: 0;
}

.badges[b-lhcb8y1bi1] {
    display: flex;
    gap: 6px;
    align-items: center;
}

.badge[b-lhcb8y1bi1] {
    padding: 3px 8px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 800;
}

.badge-todos[b-lhcb8y1bi1] {
    background: #e8f5e9;
    color: #1b5e20;
    border: 1px solid #c8e6c9;
}

.badge-priv[b-lhcb8y1bi1] {
    background: #fff3e0;
    color: #e65100;
    border: 1px solid #ffe0b2;
}

.badge-fecha[b-lhcb8y1bi1] {
    background: #e3f2fd;
    color: #0d47a1;
    border: 1px solid #bbdefb;
}

.noticia-body[b-lhcb8y1bi1] {
    color: #334155;
    line-height: 1.45;
    white-space: pre-wrap;
    margin-bottom: 8px;
}

.noticia-acciones[b-lhcb8y1bi1] {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.btn-cerrar[b-lhcb8y1bi1] {
    background: #ffe5e5;
    color: #b71c1c;
    border: 1px solid #ffcdd2;
    border-radius: 8px;
    padding: 6px 10px;
    font-weight: 800;
    cursor: pointer;
    transition: .2s;
}

    .btn-cerrar:hover[b-lhcb8y1bi1] {
        background: #ffcccc;
    }

.noticia-leida[b-lhcb8y1bi1] {
    opacity: .55;
}

.col-prohibidos[b-lhcb8y1bi1] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
}

:root[b-lhcb8y1bi1] {
    --ancho-prohibidos: 360px;
}

.col-prohibidos .numeros-prohibidos-panel[b-lhcb8y1bi1] {
    width: var(--ancho-prohibidos);
}

.col-prohibidos .acciones-bajo-prohibidos[b-lhcb8y1bi1] {
    width: var(--ancho-prohibidos);
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 20px;
}

/* === Estado bloqueado (sorteo cerrado) === */
.bloqueado[b-lhcb8y1bi1] {
    opacity: 0.6;
    pointer-events: none;
    transition: opacity 0.3s ease;
    position: relative;
}

    .bloqueado[b-lhcb8y1bi1]::after {
        content: "SORTEO CERRADO";
        position: absolute;
        top: 40%;
        left: 0;
        right: 0;
        text-align: center;
        font-weight: bold;
        font-size: 1.1rem;
        color: #b40000;
        background: rgba(255,255,255,0.85);
        border: 2px solid #b40000;
        border-radius: 8px;
        padding: 8px;
        width: 60%;
        margin: 0 auto;
        box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    }

/* ===== MODAL VER LISTA (escala dinámica) ===== */
.modal-overlay[b-lhcb8y1bi1] {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0,0,0,.45);
    z-index: 99998 !important;
}

.modal-lista[b-lhcb8y1bi1] {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 96vw !important;
    height: 90vh !important;
    background: #eaf3fb;
    border: 1px solid #b6d0e8;
    border-radius: 10px;
    padding: 10px 12px;
    padding-top: 0px;
    box-shadow: 0 10px 30px rgba(0,0,0,.25);
    z-index: 99999 !important;
    box-sizing: border-box;
    /* 🔹 ANTES: overflow: hidden !important; */
    overflow-y: auto !important; /* scroll vertical si hace falta */
    overflow-x: hidden !important; /* evitamos scroll horizontal feo */
}

body.modal-open[b-lhcb8y1bi1] {
    overflow: hidden !important;
}

.modal-close[b-lhcb8y1bi1] {
    border: none;
    background: #ffeded;
    color: #b40000;
    cursor: pointer;
    width: 30px;
    height: 30px;
    border-radius: 6px;
    font-size: 20px;
    position: absolute;
    top: 10px;
    right: 12px;
    z-index: 2;
}

    .modal-close:hover[b-lhcb8y1bi1] {
        background: #ffd6d6;
    }

/* CONTENEDOR ÚNICO DEL CONTENIDO DE LA LISTA */
#listaCanvas[b-lhcb8y1bi1] {
    width: 100%;
    height: 100%;
    padding: 10px 20px 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center; /* centrado horizontal */
    justify-content: flex-start; /* contenido pegado arriba, no al centro */
}

#contentLista[b-lhcb8y1bi1] {
    display: inline-block; /* que mida según su tabla, no que se estire raro */
}

/* ============================
   🧱 ESTRUCTURA MODO NORMAL
   ============================ */
.lista-unica-normal[b-lhcb8y1bi1] {
    width: 100%;
    max-width: 1150px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 0;
}

/* ============================
   🧱 ESTRUCTURA MODO REVENTADO
   ============================ */
.lista-unica-rev[b-lhcb8y1bi1] {
    width: 100%;
    max-width: 1350px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 0;
}

/* === TÍTULO Y FECHA === */
.fila-titulo[b-lhcb8y1bi1] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.titulo-sorteo-modal[b-lhcb8y1bi1] {
    font-weight: 900;
    font-size: 1.6rem;
    color: #c68200;
}

.fecha-modal[b-lhcb8y1bi1] {
    font-weight: 700;
    font-size: 1rem;
    color: #255;
}


/* ============================
   🧮 REJILLA PRINCIPAL
   ============================ */

/* Modo NORMAL: 5 bloques (N° + Monto) = 10 columnas */
.lista-unica-normal .fila-cabecera[b-lhcb8y1bi1],
.lista-unica-normal .fila-numeros[b-lhcb8y1bi1],
.lista-unica-normal .fila-totales-f[b-lhcb8y1bi1] {
    display: grid;
    grid-template-columns: repeat(5, 78px 85px);
    column-gap: 4px;
    row-gap: 4px;
    justify-content: center;
}

/* Modo REVENTADO: 5 bloques (N° + Monto + R) = 15 columnas */
.lista-unica-rev .fila-cabecera[b-lhcb8y1bi1],
.lista-unica-rev .fila-numeros[b-lhcb8y1bi1],
.lista-unica-rev .fila-totales-f-rev[b-lhcb8y1bi1] {
    display: grid;
    grid-template-columns: repeat(5, 64px 95px 95px);
    column-gap: 4px;
    row-gap: 4px;
    justify-content: center;
}

/* ============================
   🎨 CABECERAS (Actualizadas)
   ============================ */

/* 🔵 CABECERA N° */
.h-num[b-lhcb8y1bi1] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #0d6efd; /* azul fuerte */
    color: white;
    font-size: 11px;
    font-weight: 900;
    border-radius: 6px;
    border: 1px solid #0a58ca;
    height: 22px;
    box-sizing: border-box;
}

/* 🟢 CABECERA MONTO */
.h-monto[b-lhcb8y1bi1] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #3CB371; /* verde fuerte */
    color: white;
    font-size: 11px;
    font-weight: 900;
    border-radius: 6px;
    border: 1px solid #2e8b57;
    height: 22px;
    box-sizing: border-box;
}

/* 🔴 CABECERA REVENTADO (R) */
.h-monto-rev[b-lhcb8y1bi1] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #E74C3C; /* rojo fuerte */
    color: white;
    font-size: 11px;
    font-weight: 900;
    border-radius: 6px;
    border: 1px solid #c0392b;
    height: 22px;
    box-sizing: border-box;
}

/* ============================
   🎨 CELDAS (N°, Monto, R)
   ============================ */
.celda-num[b-lhcb8y1bi1],
.celda-monto[b-lhcb8y1bi1],
.celda-monto-rev[b-lhcb8y1bi1] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 800;
    padding: 0 6px;
    border-radius: 10px;
    height: 22px;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Número */
.celda-num[b-lhcb8y1bi1] {
    background: #e4f1fb;
    color: #0a406e;
    border: 1px solid #8db7d8;
}

/* Monto normal */
.celda-monto[b-lhcb8y1bi1] {
    background: #e9f7ef;
    color: #0a5c38;
    border: 1px solid #8cc7a9;
}

/* Monto reventado */
.celda-monto-rev[b-lhcb8y1bi1] {
    background: #faecec;
    color: #b02222;
    border: 1px solid #d3a3a3;
}

/* Números prohibidos en rojo */
.celda-num.prohibido[b-lhcb8y1bi1] {
    color: #d32f2f;
    font-size: 14px;
}

/* ============================================================
   🟦 TOTALES F1..F5 — MODO NORMAL (5 columnas x 2 = 10 celdas)
   Alineado EXACTO como las filas de números
   ============================================================ */
.fila-totales-f[b-lhcb8y1bi1] {
    display: grid;
    grid-template-columns: repeat(10, 1fr); /* 5 pares (label + monto) */
    gap: 4px;
    margin-top: 4px;
}

    .fila-totales-f .label[b-lhcb8y1bi1],
    .fila-totales-f .valor[b-lhcb8y1bi1] {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 26px;
        font-size: 14px;
        font-weight: 950;
        border-radius: 6px;
        box-sizing: border-box;
        padding: 0 6px;
    }

    /* 🔵 Label: "Total F1", "Total F2"... */
    .fila-totales-f .label[b-lhcb8y1bi1] {
        background: #eaf8ff; /* azul clarito */
        color: #0c6aa6; /* azul más fuerte */
        border: 1px dashed #0c6aa6; /* borde punteado */
        white-space: nowrap; /* 👉 evita que se parta en dos líneas */
    }

    /* 🟢 Monto normal */
    .fila-totales-f .valor[b-lhcb8y1bi1] {
        background: #f1fff5; /* verde muy suave */
        color: #0f7a3a; /* verde más fuerte */
        border: 1px dashed #0f7a3a; /* borde punteado */
    }

/* ============================================================
   🔴 TOTALES F1..F5 — MODO REVENTADO (5 columnas x 3 = 15 celdas)
   (Label + Monto Normal + Monto R)
   ============================================================ */
.fila-totales-f-rev[b-lhcb8y1bi1] {
    display: grid;
    grid-template-columns: repeat(15, 1fr); /* 5 grupos x 3 columnas */
    gap: 4px;
    margin-top: 4px;
}

    .fila-totales-f-rev .label[b-lhcb8y1bi1],
    .fila-totales-f-rev .valor-normal[b-lhcb8y1bi1],
    .fila-totales-f-rev .valor-rev[b-lhcb8y1bi1] {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 26px;
        font-size: 14px;
        font-weight: 950;
        border-radius: 6px;
        box-sizing: border-box;
        padding: 0 6px;
    }

    /* 🔵 Label */
    .fila-totales-f-rev .label[b-lhcb8y1bi1] {
        background: #eaf8ff;
        color: #0c6aa6;
        border: 1px dashed #0c6aa6;
        white-space: nowrap; /* 👉 igual: sin salto de línea */
    }

    /* 🟢 Monto normal */
    .fila-totales-f-rev .valor-normal[b-lhcb8y1bi1] {
        background: #f1fff5;
        color: #0f7a3a;
        border: 1px dashed #0f7a3a;
    }

    /* 🔴 Monto reventado */
    .fila-totales-f-rev .valor-rev[b-lhcb8y1bi1] {
        background: #fff5f5;
        color: #c62828;
        border: 1px dashed #c62828;
    }

/* Asegurar que nada se desborde raro */
#listaCanvas > div[b-lhcb8y1bi1] {
    min-width: 0;
    min-height: 0;
}

/* === Popup de error de venta (centrado en la pantalla) === */
.venta-modal-backdrop[b-lhcb8y1bi1] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999999;
}

.venta-modal[b-lhcb8y1bi1] {
    background: #ffffff;
    border-radius: 14px;
    padding: 18px 22px 20px;
    max-width: 420px;
    width: 90%;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.35);
    animation: ventaModalIn-b-lhcb8y1bi1 0.18s ease-out;
    text-align: left;
}

    .venta-modal h3[b-lhcb8y1bi1] {
        margin: 0 0 10px 0;
        font-size: 1.15rem;
        font-weight: 800;
        color: #c62828;
    }

    .venta-modal p[b-lhcb8y1bi1] {
        margin: 0 0 18px 0;
        line-height: 1.4;
        font-size: 0.95rem;
        white-space: pre-line;
        color: #333;
    }

    .venta-modal .btn.ok[b-lhcb8y1bi1] {
        width: 100%;
        font-weight: 600;
    }

@keyframes ventaModalIn-b-lhcb8y1bi1 {
    from {
        opacity: 0;
        transform: translateY(10px) scale(0.97);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* ✅ Número mini para Parley (2 dígitos) */
.numero-mini[b-lhcb8y1bi1] {
    width: 85px !important;
    max-width: 85px !important;
    padding: 10px !important;
    font-size: 20px !important;
    height: 48px;
}

.parley-tabla[b-lhcb8y1bi1] {
    margin-top: 12px;
    border: 1px solid #e6edf8;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
}

.parley-header[b-lhcb8y1bi1] {
    display: grid;
    grid-template-columns: 1fr 180px;
    font-weight: 900;
    background: #f3f7ff;
    border-bottom: 1px solid #e6edf8;
}

.parley-h-num[b-lhcb8y1bi1], .parley-h-monto[b-lhcb8y1bi1] {
    padding: 10px 12px;
}

.parley-row[b-lhcb8y1bi1] {
    display: grid;
    grid-template-columns: 1fr 180px;
    border-bottom: 1px solid #eef3ff;
}

    .parley-row:last-child[b-lhcb8y1bi1] {
        border-bottom: none;
    }

.parley-num[b-lhcb8y1bi1], .parley-monto[b-lhcb8y1bi1] {
    padding: 10px 12px;
    font-weight: 700;
}

.parley-monto[b-lhcb8y1bi1] {
    text-align: right;
}

.parley-vacio[b-lhcb8y1bi1] {
    padding: 14px 12px;
    font-weight: 700;
    opacity: .8;
}

/* =========================
   FECHA VENTA (Parley)
   - mismo estilo que usamos en Tiempos/Restricciones
   ========================= */

.fecha-venta-box[b-lhcb8y1bi1] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid #e6edf8;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
    width: fit-content;
}

.fv-titulo[b-lhcb8y1bi1] {
    font-weight: 900;
    color: #153e75;
    font-size: 1.05rem;
    margin-right: 6px;
}

/* ✅ FECHA GRANDE (igual a Restricciones) */
.fv-xl[b-lhcb8y1bi1] {
    height: 56px !important;
    padding: 10px 14px !important;
    font-size: 1.35rem !important;
    font-weight: 900 !important;
    color: #153e75 !important;
    border: 1px solid #cfe0f5 !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.06) !important;
    box-sizing: border-box !important;
    line-height: 1.2 !important;
}

    .fv-xl[b-lhcb8y1bi1]::-webkit-datetime-edit {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

    .fv-xl[b-lhcb8y1bi1]::-webkit-datetime-edit-day-field,
    .fv-xl[b-lhcb8y1bi1]::-webkit-datetime-edit-month-field,
    .fv-xl[b-lhcb8y1bi1]::-webkit-datetime-edit-year-field {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

    .fv-xl[b-lhcb8y1bi1]::-webkit-datetime-edit-text {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

    .fv-xl[b-lhcb8y1bi1]::-webkit-calendar-picker-indicator {
        cursor: pointer;
        opacity: .80;
    }

.fv-hoy[b-lhcb8y1bi1] {
    height: 56px;
    padding: 0 14px;
    border-radius: 10px;
    border: 1px solid #cfe0f5;
    background: #f6f7fb;
    font-weight: 900;
    color: #153e75;
    cursor: pointer;
}

    .fv-hoy:hover[b-lhcb8y1bi1] {
        background: #eef5ff;
        border-color: #98bdf0;
    }

/* ==========================================================
   ✅ FIX ENCABEZADO PARLEY (MISMO DISEÑO QUE TIEMPOS)
   - Centra día/hora como en Tiempos
   - Caja Fecha de venta igual
   - Borde del encabezado más oscuro para que se note más
   ========================================================== */


/* 2) Centro: YA NO absoluto (igual que Tiempos) */
.fecha-centro[b-lhcb8y1bi1] {
    position: static !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    margin: 0 auto !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 3px !important;
}

/* 3) Caja derecha (Fecha de venta) igual que Tiempos: en una sola fila */
.fecha-venta-box[b-lhcb8y1bi1] {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    width: fit-content !important;
    min-width: 0 !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
    /* mantiene el estilo que ya usas, solo lo hacemos consistente */
    background: #eef6ff !important;
    border: 1px solid rgba(13, 71, 161, 0.25) !important;
}

/* 4) Input date grande EXACTO (si ya existe en tu Parley, lo refuerza) */
.fv-xl[b-lhcb8y1bi1] {
    height: 56px !important;
    padding: 10px 14px !important;
    font-size: 1.35rem !important;
    font-weight: 900 !important;
    color: #153e75 !important;
    border: 1px solid #cfe0f5 !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.06) !important;
    box-sizing: border-box !important;
    line-height: 1.2 !important;
}

    .fv-xl[b-lhcb8y1bi1]::-webkit-datetime-edit,
    .fv-xl[b-lhcb8y1bi1]::-webkit-datetime-edit-day-field,
    .fv-xl[b-lhcb8y1bi1]::-webkit-datetime-edit-month-field,
    .fv-xl[b-lhcb8y1bi1]::-webkit-datetime-edit-year-field,
    .fv-xl[b-lhcb8y1bi1]::-webkit-datetime-edit-text {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

/* 5) Botón Hoy: misma altura que el date */
.fv-hoy[b-lhcb8y1bi1] {
    height: 56px !important;
    padding: 0 14px !important;
    border-radius: 10px !important;
}

/* ==========================================================
   ✅ PARLEY: COLUMNA CENTRAL tipo TIEMPOS (reservar espacio)
   y borde más oscuro para que se note más (como pediste)
   ========================================================== */

/* Caja “fantasma” central (equivale visualmente al panel de prohibidos en Tiempos) */
.parley-centro-placeholder[b-lhcb8y1bi1] {
    width: 100%;
    min-height: 92px; /* altura parecida al bloque de prohibidos */
    border: 2px solid #7f8fa8; /* ✅ borde más oscuro */
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 3px 10px rgba(0,0,0,0.06);
}





/* 5) Botones debajo del placeholder, dentro de la misma columna */
.col-prohibidos .acciones-bajo-prohibidos[b-lhcb8y1bi1] {
    width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important; /* si no caben, bajan dentro de la misma columna */
    gap: 10px !important;
    align-items: center !important;
    margin-top: 0 !important;
}


/* ==========================================================
   ✅ PATCH FINAL PARLEY (NO BORRA NADA)
   - Alinea botones con "Guardar / Imprimir"
   - Quita cuadro blanco (sin eliminar diseños)
   - Refuerza borde del panel noticias sin cambiar su estilo
   ========================================================== */

/* 1) La columna central mantiene su ancho como Tiempos */
.ventas-contenido > .col-prohibidos[b-lhcb8y1bi1] {
    flex: 0 0 var(--ancho-prohibidos);
    min-width: var(--ancho-prohibidos);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    margin-top: 0 !important; /* 🔒 NO empujar la columna completa */
}

/* 3) Botones: pegados justo debajo del placeholder invisible */
.col-prohibidos .acciones-bajo-prohibidos[b-lhcb8y1bi1] {
    width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    align-items: center !important;
    margin-top: 0 !important; /* ✅ QUITA el margin-top:20px que los baja raro */
}

/* ✅ MONAZOS: 3 dígitos (D1/D2/D3) — mini, uno por caja */
.digito-mini[b-lhcb8y1bi1] {
    width: 70px !important;
    max-width: 70px !important;
    padding: 10px !important;
    font-size: 22px !important;
    height: 48px;
    text-align: center;
    font-weight: 900;
}

@media (max-width: 520px) {
    .digito-mini[b-lhcb8y1bi1] {
        width: 60px !important;
        max-width: 60px !important;
        font-size: 20px !important;
    }
}

/* ✅ Flecha rota cuando el menú está abierto */
.flecha.rotado[b-lhcb8y1bi1] {
    transform: rotate(180deg);
}

/* Scroll solo cuando pase de 4 líneas */
#listaScroll[b-lhcb8y1bi1] {
    overflow-y: auto;
    max-height: 260px; /* AJUSTA: sube/baja hasta que 4 líneas queden visibles */
}

/* Monto centrado en su propia fila */
.input-monto-centro[b-lhcb8y1bi1] {
    justify-content: center;
}

/* Acciones abajo: Vender - Selector - Agregar */
.input-acciones-abajo[b-lhcb8y1bi1] {
    justify-content: center;
    gap: 10px;
}


/* FILA DE MODALIDAD: centrada y más grande */
.modalidad-radio-row[b-lhcb8y1bi1] {
    display: flex;
    justify-content: center; /* ✅ centrados */
    align-items: center;
    gap: 18px; /* más separación */
    margin: 10px 0 14px; /* más aire */
    width: 100%;
}

/* Cada opción más grande */
.modalidad-radio-item[b-lhcb8y1bi1] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 12px;
    cursor: pointer;
    user-select: none;
}

.modalidad-radio-item.focused[b-lhcb8y1bi1] {
    background: #e8f0fe;
    border-radius: 8px;
}

/* Modal modalidad: estilos en wwwroot/css/ventasMonazosModalidad.css (global, sin recorte) */

/* circulito más grande */
.radio-dot[b-lhcb8y1bi1] {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 2px solid #2b6cb0;
    display: inline-block;
    position: relative;
}

    .radio-dot.on[b-lhcb8y1bi1]::after {
        content: "";
        position: absolute;
        inset: 4px;
        border-radius: 50%;
        background: #2b6cb0;
    }

/* texto más grande */
.radio-text[b-lhcb8y1bi1] {
    font-weight: 900;
    color: #153e75;
    font-size: 15px; /* ✅ más grande */
}

/* ✅ tabla lista: más flexible y más ancha sin desorden */
.tabla-lista-monazos[b-lhcb8y1bi1] {
    display: grid;
    grid-template-columns: 140px 1fr 160px 56px; /* modalidad se estira */
    width: 100%;
}

/* ✅ si quieres dar más ancho al panel izquierdo completo */
/* ✅ ANCHO REAL DEL PANEL IZQUIERDO (MONAZOS/TIEMPOS/PARLEY) */
.ventas-contenido > .ventas-izquierda[b-lhcb8y1bi1] {
    flex: 0 0 700px !important; /* ⬅️ este es el ancho fijo */
    max-width: 700px !important;
    min-width: 700px !important;
    width: 700px !important;
}


/* ✅ MONAZOS - Cabecera "Modo" */
.h-modo[b-lhcb8y1bi1] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #6c7ae0; /* morado/azul suave */
    color: #fff;
    font-size: 11px;
    font-weight: 900;
    border-radius: 6px;
    border: 1px solid #4e5bd3;
    height: 22px;
    box-sizing: border-box;
}

/* ✅ MONAZOS - Celda Modo */
.celda-modo[b-lhcb8y1bi1] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 800;
    padding: 0 6px;
    border-radius: 10px;
    height: 22px;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background: #eef1ff;
    color: #2f3a8f;
    border: 1px solid #aab3ff;
}

/* ============================
   MODAL LISTA MONAZOS (ANCHO)
   ============================ */

.modal-lista.monazos[b-lhcb8y1bi1] {
    width: 96vw;
    max-width: 1600px;
}

/* Grilla: 5 bloques * (N°,Modo,Monto) = 15 columnas */
.fila-cabecera.monazos[b-lhcb8y1bi1],
.fila-numeros.monazos[b-lhcb8y1bi1] {
    display: grid;
    grid-template-columns: 70px 90px 115px 70px 90px 115px 70px 90px 115px 70px 90px 115px 70px 90px 115px;
    gap: 6px;
}

    /* Cabeceras */
    .fila-cabecera.monazos .h-num[b-lhcb8y1bi1],
    .fila-cabecera.monazos .h-modo[b-lhcb8y1bi1],
    .fila-cabecera.monazos .h-monto[b-lhcb8y1bi1] {
        font-size: 13px;
        padding: 6px 8px;
        border-radius: 7px;
    }

    /* Celdas */
    .fila-numeros.monazos .celda-num[b-lhcb8y1bi1],
    .fila-numeros.monazos .celda-modo[b-lhcb8y1bi1],
    .fila-numeros.monazos .celda-monto[b-lhcb8y1bi1] {
        font-size: 14px;
        padding: 7px 8px;
        border-radius: 7px;
        min-height: 26px;
    }
/* =========================================================
   ✅ TOTALES MONAZOS (con tu HTML actual)
   .fila-totales-f.monazos
   - 5 bloques x (N° / Modo / Monto) = 15 columnas
   - En cada bloque: 2 vacías + 1 celda "Total"
   ========================================================= */

.fila-totales-f.monazos[b-lhcb8y1bi1] {
    display: grid;
    /* 15 columnas: N°, Modo, Monto repetido 5 veces */
    grid-template-columns: repeat(5, 70px 90px 115px);
    column-gap: 6px;
    row-gap: 6px;
    justify-content: center;
    margin-top: 6px;
}

    /* tus dos <div></div> vacíos: que tengan altura para no colapsar */
    .fila-totales-f.monazos > div:empty[b-lhcb8y1bi1] {
        min-height: 26px;
    }

    /* la celda donde va "Total F1: 0" ocupa la columna Monto del bloque */
    .fila-totales-f.monazos .total-monto[b-lhcb8y1bi1] {
        display: flex;
        align-items: center;
        justify-content: space-between; /* label izquierda, valor derecha */
        gap: 8px;
        /* altura igual a totales/celdas */
        height: 26px;
        padding: 0 10px;
        /* mismo look de totales (punteado) */
        background: #f1fff5;
        border: 1px dashed #0f7a3a;
        border-radius: 6px;
        box-sizing: border-box;
    }

        /* label "Total F1:" */
        .fila-totales-f.monazos .total-monto .label[b-lhcb8y1bi1] {
            font-weight: 950;
            font-size: 13px;
            color: #0c6aa6;
            white-space: nowrap;
        }

        /* valor (0) */
        .fila-totales-f.monazos .total-monto .valor[b-lhcb8y1bi1] {
            font-weight: 950;
            font-size: 14px;
            color: #0f7a3a;
            white-space: nowrap;
        }

/* ✅ Monazos: Totales F alineados (Label bajo Modo, Valor bajo Monto) */
.fila-totales-f.monazos[b-lhcb8y1bi1] {
    /* asegura que use la MISMA grilla que tus filas monazos (N°,Modo,Monto x5) */
    display: grid;
    grid-template-columns: repeat(5, 70px 90px 115px);
    column-gap: 6px;
    row-gap: 6px;
    justify-content: center;
    margin-top: 6px;
}

    .fila-totales-f.monazos .total-f-label[b-lhcb8y1bi1],
    .fila-totales-f.monazos .total-f-valor[b-lhcb8y1bi1] {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 26px;
        font-size: 14px;
        font-weight: 950;
        border-radius: 6px;
        box-sizing: border-box;
        padding: 0 6px;
        white-space: nowrap;
    }

    /* Label (en la columna Modo) */
    .fila-totales-f.monazos .total-f-label[b-lhcb8y1bi1] {
        background: #eaf8ff;
        color: #0c6aa6;
        border: 1px dashed #0c6aa6;
    }

    /* Valor (en la columna Monto) */
    .fila-totales-f.monazos .total-f-valor[b-lhcb8y1bi1] {
        background: #f1fff5;
        color: #0f7a3a;
        border: 1px dashed #0f7a3a;
    }

/* ✅ Monazos: Total arriba más grande */
.fila-totales-normal .label[b-lhcb8y1bi1] {
    font-size: 15px; /* antes se ve pequeño */
    font-weight: 900;
}

.fila-totales-normal .valor[b-lhcb8y1bi1] {
    font-size: 18px; /* el monto más grande */
    font-weight: 950;
}

/* =========================================
   MONAZOS: Centro + PanelNoticias a la derecha
   (solo layout, no toca estilos del panel)
   ========================================= */
.monazos-centro-noticias[b-lhcb8y1bi1] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    width: 100%;
}

    .monazos-centro-noticias .col-prohibidos[b-lhcb8y1bi1] {
        flex: 1 1 auto;
        min-width: 0;
    }

.monazos-noticias-right[b-lhcb8y1bi1] {
    flex: 0 0 360px; /* ancho del panel */
    max-width: 360px;
}

    /* que el panel use el 100% de su columna */
    .monazos-noticias-right .panel-noticias[b-lhcb8y1bi1] {
        width: 100%;
    }

/* Responsive: si la pantalla se hace pequeña, baja debajo */
@media (max-width: 1100px) {
    .monazos-centro-noticias[b-lhcb8y1bi1] {
        flex-direction: column;
    }

    .monazos-noticias-right[b-lhcb8y1bi1] {
        flex: 1 1 auto;
        max-width: 100%;
    }
}

.ventas-contenido[b-lhcb8y1bi1] {
    margin-top: 0; /* alinea con el encabezado */
}

    /* =========================================================
   ✅ MONAZOS - MISMO ACOMODO QUE TIEMPOS
   Col 1: Panel pedidos (izquierda)
   Col 2: Botones secundarios (centro)
   Col 3: Noticias (derecha)
   ========================================================= */

    .ventas-contenido.ventas-contenido-monazos > .ventas-izquierda[b-lhcb8y1bi1] {
        grid-column: 1;
        justify-self: start; /* pegado al borde izquierdo */
        align-self: start;
    }


    /* Layout Monazos: ver wwwroot/css/ventasAccionesToolbar.css (sin márgenes negativos) */

/* =========================
   WHATSAPP (BOTÓN + MODAL + MODAL IMAGEN)
   (Copiado desde Tiempos)
========================= */

/* ===== Botón WhatsApp ===== */
.wa-btn2[b-lhcb8y1bi1] {
    width: fit-content;
    max-width: 420px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 11px 14px;
    border-radius: 12px;
    border: 2px solid rgba(37, 211, 102, .75);
    background: linear-gradient(180deg, rgba(37,211,102,.22), rgba(18,140,126,.12));
    color: #0b2b16;
    font-weight: 900;
    font-size: 15px;
    line-height: 1;
    box-shadow: 0 10px 22px rgba(0,0,0,.12);
}

    .wa-btn2:hover[b-lhcb8y1bi1] {
        filter: brightness(1.05);
    }

    .wa-btn2:disabled[b-lhcb8y1bi1] {
        opacity: .5;
        cursor: not-allowed;
        filter: none;
    }

.wa-btn2__icon[b-lhcb8y1bi1] {
    width: 28px;
    height: 28px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.70);
    border: 1px solid rgba(0,0,0,.08);
    flex: 0 0 auto;
}

    .wa-btn2__icon svg[b-lhcb8y1bi1] {
        width: 18px;
        height: 18px;
        display: block;
    }

.wa-btn2__text[b-lhcb8y1bi1] {
    white-space: nowrap;
}

/* ===== Modal principal WhatsApp ===== */
.wa2-backdrop[b-lhcb8y1bi1] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.64);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    z-index: 99999;
}

.wa2-modal[b-lhcb8y1bi1] {
    width: min(720px, 96vw);
    background: #0f1420;
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 30px 70px rgba(0,0,0,.65);
}

.wa2-header[b-lhcb8y1bi1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 16px;
    background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0));
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.wa2-title[b-lhcb8y1bi1] {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #fff;
}

.wa2-badge[b-lhcb8y1bi1] {
    width: 44px;
    height: 44px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: rgba(37,211,102,.14);
    border: 1px solid rgba(37,211,102,.25);
    color: #25D366;
}

    .wa2-badge svg[b-lhcb8y1bi1] {
        width: 22px;
        height: 22px;
        display: block;
    }

.wa2-title__main[b-lhcb8y1bi1] {
    font-weight: 900;
    font-size: 17px;
    line-height: 1.1;
}

.wa2-title__sub[b-lhcb8y1bi1] {
    font-size: 14px;
    opacity: .85;
    margin-top: 2px;
}

.wa2-x[b-lhcb8y1bi1] {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.06);
    color: #fff;
    cursor: pointer;
}

    .wa2-x:hover[b-lhcb8y1bi1] {
        filter: brightness(1.1);
    }

.wa2-body[b-lhcb8y1bi1] {
    padding: 16px;
}

.wa2-grid[b-lhcb8y1bi1] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

@media (max-width: 640px) {
    .wa2-grid[b-lhcb8y1bi1] {
        grid-template-columns: 1fr;
    }
}

.wa2-field[b-lhcb8y1bi1] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.wa2-label[b-lhcb8y1bi1] {
    font-size: 14px;
    opacity: .85;
    color: #dfe7ff;
}

.wa2-input[b-lhcb8y1bi1], .wa2-select[b-lhcb8y1bi1] {
    width: 100%;
    padding: 12px 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.06);
    color: #fff;
    outline: none;
}

    .wa2-input[b-lhcb8y1bi1]::placeholder {
        color: rgba(255,255,255,.55);
    }

.wa2-actions[b-lhcb8y1bi1] {
    margin-top: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.wa2-actions__right[b-lhcb8y1bi1] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.wa2-btn[b-lhcb8y1bi1] {
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.06);
    color: #fff;
    cursor: pointer;
    font-weight: 800;
}

    .wa2-btn:hover[b-lhcb8y1bi1] {
        filter: brightness(1.08);
    }

.wa2-btn--ghost[b-lhcb8y1bi1] {
    background: transparent;
}

.wa2-btn--soft[b-lhcb8y1bi1] {
    background: rgba(37,211,102,.10);
    border-color: rgba(37,211,102,.22);
}

.wa2-btn--primary[b-lhcb8y1bi1] {
    background: linear-gradient(180deg, rgba(37,211,102,.35), rgba(18,140,126,.25));
    border-color: rgba(37,211,102,.35);
}

.wa2-note[b-lhcb8y1bi1] {
    margin-top: 12px;
    padding: 12px 12px;
    border-radius: 14px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.10);
    color: #e8f0ff;
    font-size: 14px;
    line-height: 1.35;
}

/* ===== Modal Imagen ===== */
.wa-img-backdrop[b-lhcb8y1bi1] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.75);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px;
    z-index: 100000;
}

.wa-img-modal[b-lhcb8y1bi1] {
    width: min(820px, 96vw);
    max-height: 92vh;
    background: #0f1420;
    border-radius: 18px;
    padding: 14px;
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 30px 70px rgba(0,0,0,.65);
    overflow: auto;
}

    .wa-img-modal h3[b-lhcb8y1bi1] {
        margin: 0 0 10px 0;
        color: #fff;
        font-weight: 900;
        font-size: 18px;
    }

.wa-ticket-img[b-lhcb8y1bi1] {
    width: 100%;
    height: auto;
    max-height: calc(92vh - 170px);
    object-fit: contain;
    display: block;
}

.wa-actions[b-lhcb8y1bi1] {
    margin-top: 12px;
    display: flex;
    justify-content: center;
    gap: 10px;
}

.btn-guardar.ok[b-lhcb8y1bi1] {
    padding: 10px 16px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(37,211,102,.12);
    color: #fff;
    font-weight: 900;
    cursor: pointer;
}

    .btn-guardar.ok:hover[b-lhcb8y1bi1] {
        filter: brightness(1.08);
    }


/* _content/SistemaLoteriaDashboard/Components/Ventas/VentasParley.razor.rz.scp.css */
/* ==========================================================
   🧩 LAYOUT PRINCIPAL
   ========================================================== */
.ventas-contenido[b-ttm71onnr9] {
    display: flex;
    align-items: flex-start;
    gap: 24px;
    padding: 0 20px;
    width: 100%;
    box-sizing: border-box;
    margin-top: 12px;
    /* 🔒 Que TODO sea una sola fila */
    flex-wrap: nowrap;
    /* 📜 Si no cabe con mucho zoom, scroll horizontal */
    overflow-x: auto;
}

.ventas-izquierda[b-ttm71onnr9] {
    flex: 0 0 auto; /* ya tienes min/max-width, así no se deforma */
}

/* ✅ FIX: debe reservar el mismo ancho que en Tiempos */
.col-prohibidos[b-ttm71onnr9] {
    flex: 0 0 var(--ancho-prohibidos);
}




/* ==========================================================
   🧩 PANEL IZQUIERDO (VENTAS)
   ========================================================== */
.ventas-izquierda[b-ttm71onnr9] {
    flex: 1;
    min-width: 400px;
    max-width: 700px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    background: #fff;
    border: 2px solid #e0e0e0;
    border-radius: 10px;
    padding: 15px;
    box-sizing: border-box;
    min-height: 300px;
    margin: 0;
}

/* ====== LISTA (contenedor con scroll) ====== */
.ventas-lista[b-ttm71onnr9] {
    position: relative;
    border: 2px solid #e0e6f1;
    border-radius: 8px;
    background: #fff;
    max-height: 420px;
    overflow-y: auto;
    overflow-x: hidden;
    scroll-behavior: smooth;
    scrollbar-gutter: stable;
    padding: 0;
}

/* ====== GRID UNIFICADO (cabecera + filas) ====== */
.tabla-lista[b-ttm71onnr9] {
    display: grid;
    grid-template-columns: 120px 170px 56px;
    width: 100%;
    row-gap: 0;
    justify-content: center;
    margin: 0 auto;
}

    /* Modo BASE con reventado: columnas flexibles para que no se salgan con zoom */
    .tabla-lista.reventado[b-ttm71onnr9] {
        grid-template-columns: minmax(90px, 1.1fr) /* N°  */
        minmax(120px, 1.4fr) /* Monto normal */
        minmax(120px, 1.4fr) /* Monto reventado */
        minmax(40px, 0.6fr); /* Botón X */
    }

/* Cabecera y filas comparten el MISMO grid */
.fila-cabecera[b-ttm71onnr9],
.fila-item[b-ttm71onnr9] {
    display: contents;
}

/* ====== CELDAS ====== */
.celda[b-ttm71onnr9] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    text-align: right;
    padding: 10px 12px;
    min-height: 44px;
    font-weight: 800;
    font-size: 20px;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
    border-bottom: 1px solid #e6ecf6;
}

    /* CABECERA (títulos centrados y más grandes) */
    .celda.titulo[b-ttm71onnr9] {
        position: sticky;
        top: 0;
        z-index: 10;
        background: #f7f9fc;
        border-bottom: 2px solid #e0e6f1;
        box-shadow: 0 1px 0 #e0e6f1;
        text-align: center;
        justify-content: center;
        align-items: center;
        font-weight: 900;
        font-size: 22px;
        color: #1c2b4d;
        height: 48px;
    }

        /* La celda de cabecera de la columna de la X (vacía pero sticky) */
        .celda.titulo.th-x[b-ttm71onnr9] {
            background: #f7f9fc;
            pointer-events: none;
        }

/* Celdas normales (centradas igual) */
.celda[b-ttm71onnr9],
.fila-item .numero[b-ttm71onnr9],
.fila-item .monto[b-ttm71onnr9] {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 800;
    font-size: 20px;
    height: 48px;
}

/* Guion perfectamente centrado entre Número y Monto */
.fila-item .celda.numero[b-ttm71onnr9]::after {
    content: "–";
    color: #76acfe;
    font-weight: 600;
    font-size: 20px;
    position: relative;
    left: 65%;
    transform: translateX(-50%);
    top: 25%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

/* ========== BOTÓN ELIMINAR (moderno y elegante) ========== */
.btn-eliminar[b-ttm71onnr9] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 10px;
    background: linear-gradient(180deg,#ff5c5c,#d93636);
    box-shadow: 0 6px 14px rgba(217,54,54,.25), inset 0 1px 0 rgba(255,255,255,.28);
    cursor: pointer;
    padding: 0;
    font-size: 0;
    line-height: 1;
    margin: auto;
    z-index: 1;
    transition: transform .12s ease, box-shadow .18s ease, filter .18s ease, background .18s ease;
}

    .btn-eliminar[b-ttm71onnr9]::before,
    .btn-eliminar[b-ttm71onnr9]::after {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        width: 14px;
        height: 2px;
        background: #fff;
        border-radius: 2px;
        transform-origin: center;
        box-shadow: 0 0 1px rgba(0,0,0,.25);
    }

    .btn-eliminar[b-ttm71onnr9]::before {
        transform: translate(-50%,-50%) rotate(45deg);
    }

    .btn-eliminar[b-ttm71onnr9]::after {
        transform: translate(-50%,-50%) rotate(-45deg);
    }

    .btn-eliminar:hover[b-ttm71onnr9] {
        transform: translateY(-1px) scale(1.03);
        filter: saturate(1.06);
        box-shadow: 0 10px 20px rgba(217,54,54,.28), inset 0 1px 0 rgba(255,255,255,.32);
    }

    .btn-eliminar:active[b-ttm71onnr9] {
        transform: translateY(0) scale(.97);
        box-shadow: 0 4px 10px rgba(217,54,54,.22), inset 0 1px 0 rgba(255,255,255,.24);
    }

    .btn-eliminar:focus-visible[b-ttm71onnr9] {
        outline: 3px solid rgba(25,118,210,.35);
        outline-offset: 2px;
        box-shadow: 0 0 0 4px rgba(25,118,210,.15), 0 8px 18px rgba(217,54,54,.25), inset 0 1px 0 rgba(255,255,255,.28);
    }

@media (prefers-reduced-motion: reduce) {
    .btn-eliminar[b-ttm71onnr9] {
        transition: none;
    }
}

/* ====== SEPARADOR ====== */
.separador[b-ttm71onnr9] {
    border: none;
    border-top: 2px solid #d9e0ef;
    margin: 8px 0;
}

/* ====== CAMPOS DE ENTRADA ====== */
.input-linea[b-ttm71onnr9] {
    display: flex;
    gap: 10px;
    margin: 10px 0;
    justify-content: center;
    /* 👇 NUEVO: si con 3 cajas no cabe, que hagan otra fila
       en vez de salirse del panel al hacer zoom */
    flex-wrap: wrap;
    max-width: 100%;
}

.input-pequeno[b-ttm71onnr9] {
    padding: 12px;
    font-size: 24px;
    font-weight: 800;
    border: 2px solid #ccc;
    border-radius: 8px;
    text-align: center;
    transition: .2s;
    /* 👇 NUEVO: ancho base, pero puede encogerse si hace falta */
    flex: 1 1 120px;
    max-width: 210px;
}

    .input-pequeno:focus[b-ttm71onnr9] {
        border-color: #1e88e5;
        box-shadow: 0 0 5px rgba(30,136,229,.4);
        outline: none;
    }

.monto-corto[b-ttm71onnr9] {
    width: 120px;
}

.numero-corto[b-ttm71onnr9] {
    width: 120px;
}

/* ====== BOTÓN GUARDAR / IMPRIMIR ====== */
.btn-guardar[b-ttm71onnr9] {
    background: linear-gradient(90deg,#1976d2,#1e88e5);
    color: #fff;
    border: none;
    border-radius: 10px;
    padding: 12px 22px;
    cursor: pointer;
    font-weight: 800;
    font-size: 16px;
    transition: .2s;
}

    .btn-guardar:hover[b-ttm71onnr9] {
        background: linear-gradient(90deg,#1565c0,#1976d2);
    }

/* ====== TOTAL ====== */
.total[b-ttm71onnr9] {
    font-size: 22px;
    font-weight: 800;
    text-align: right;
    color: #003c8f;
    margin-top: 10px;
}

@media (max-width:520px) {
    .tabla-lista[b-ttm71onnr9] {
        grid-template-columns: 100px 140px 46px;
    }

        .tabla-lista.reventado[b-ttm71onnr9] {
            grid-template-columns: minmax(70px, 1.1fr) /* N° */
            minmax(90px, 1.3fr) /* Monto */
            minmax(90px, 1.3fr) /* Monto R */
            minmax(34px, 0.5fr); /* X */
        }

    .celda[b-ttm71onnr9] {
        font-size: 18px;
    }
}

/* ===== Panel de Números Prohibidos con título rojo, fecha y ajuste dinámico ===== */
.numeros-prohibidos-panel[b-ttm71onnr9] {
    align-self: flex-start;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.1);
    padding: 16px 24px;
    border: 2px solid #c62828;
    text-align: center;
    display: inline-block;
    transition: all 0.3s ease;
    width: auto;
    height: auto;
    min-width: 240px;
}

    .numeros-prohibidos-panel h4[b-ttm71onnr9] {
        color: #c62828;
        font-weight: 800;
        font-size: 1.45em;
        margin: 0 0 8px 0;
    }

.np-fecha[b-ttm71onnr9] {
    font-size: 1.1em;
    font-weight: 700;
    color: #333;
    margin-top: 2px;
    margin-bottom: 10px;
    text-transform: capitalize;
}

.numeros-prohibidos[b-ttm71onnr9] {
    list-style: none;
    padding: 0;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
}

    .numeros-prohibidos li[b-ttm71onnr9] {
        color: #e53935;
        font-weight: 700;
        background: #ffebee;
        padding: 6px 12px;
        border-radius: 8px;
        min-width: 40px;
        text-align: center;
        font-size: 1.15em;
        transition: transform 0.2s ease, background 0.2s ease;
    }

        .numeros-prohibidos li:hover[b-ttm71onnr9] {
            background: #ffcdd2;
            transform: scale(1.08);
        }

/* ==========================================================
   🧩 ENCABEZADO
   ========================================================== */
.ventas-encabezado[b-ttm71onnr9] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding: 15px 25px 25px;
    background: linear-gradient(90deg, #f7f9fb, #e3f2fd);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    margin: 10px 20px 0;
}

.titulo-sorteo[b-ttm71onnr9] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    position: relative;
}

.sorteo-selector-titulo[b-ttm71onnr9] {
    position: relative;
    cursor: pointer;
    user-select: none;
    display: inline-block;
}

.sorteo-nombre[b-ttm71onnr9] {
    font-size: 2.2em;
    font-weight: 800;
    color: #004aad;
    letter-spacing: 1px;
    margin: 0;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.15);
    animation: colorCambio-b-ttm71onnr9 4s linear infinite;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: transform 0.2s ease;
}

    .sorteo-nombre:hover[b-ttm71onnr9] {
        transform: scale(1.02);
    }

.flecha[b-ttm71onnr9] {
    font-size: 0.6em;
    margin-left: 6px;
    transition: transform 0.3s ease;
}

.sorteo-selector-titulo:hover .flecha[b-ttm71onnr9] {
    transform: rotate(180deg);
}

.menu-sorteos[b-ttm71onnr9] {
    position: absolute;
    top: 100%;
    left: 0;
    transform: none;
    width: 220px;
    background: #ffffff;
    border: 2px solid #cfd8dc;
    border-radius: 10px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
    margin-top: 8px;
    padding: 6px 0;
    list-style: none;
    z-index: 20;
    animation: aparecerMenu-b-ttm71onnr9 0.2s ease-out forwards;
}

    .menu-sorteos li[b-ttm71onnr9] {
        font-weight: 700;
        color: #0d47a1;
        font-size: 1.1em;
        padding: 10px 16px;
        text-align: center;
        transition: all 0.2s ease;
        border-radius: 6px;
    }

        .menu-sorteos li:hover[b-ttm71onnr9] {
            background: #e3f2fd;
            color: #003c8f;
            transform: scale(1.03);
        }

        .menu-sorteos li.activo[b-ttm71onnr9] {
            background: #bbdefb;
            color: #0d47a1;
        }

@keyframes aparecerMenu-b-ttm71onnr9 {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes colorCambio-b-ttm71onnr9 {
    0% {
        color: #e53935;
    }

    25% {
        color: #f9a825;
    }

    50% {
        color: #1e88e5;
    }

    75% {
        color: #43a047;
    }

    100% {
        color: #e53935;
    }
}

.hora-info[b-ttm71onnr9] {
    font-size: 1.05em;
    color: #0d47a1;
    font-weight: 600;
}

    .hora-info strong[b-ttm71onnr9] {
        color: #1a237e;
    }

.hora-numero[b-ttm71onnr9] {
    font-size: 1.4em;
    font-weight: 700;
    color: #0d47a1;
}

/* === Fecha centrada === */
.fecha-centro[b-ttm71onnr9] {
    position: absolute;
    top: 85px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
}

.fecha-texto[b-ttm71onnr9] {
    font-size: 1.35em;
    font-weight: 800;
    color: #2c3e50;
    text-transform: capitalize;
}

.hora-texto[b-ttm71onnr9] {
    font-size: 1.15em;
    font-weight: 700;
    color: #1565c0;
    letter-spacing: 1px;
}

/* ==========================================================
   🧩 BOTONES SECUNDARIOS
   ========================================================== */
.acciones-internas[b-ttm71onnr9] {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 15px;
}

.btn-secundario[b-ttm71onnr9] {
    background: linear-gradient(90deg, #e3f2fd, #bbdefb);
    color: #0d47a1;
    border: 1px solid #64b5f6;
    border-radius: 8px;
    padding: 8px 14px;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.95rem;
    transition: 0.2s;
}

    .btn-secundario:hover[b-ttm71onnr9] {
        background: linear-gradient(90deg, #bbdefb, #90caf9);
    }

.btn-guardar:active[b-ttm71onnr9],
.menu-btn:active[b-ttm71onnr9] {
    transform: scale(0.97);
}

/* ===============================
   🎯 CONTADOR DE TIEMPO RESTANTE
   =============================== */
.ventas-encabezado .contador[b-ttm71onnr9],
.contador[b-ttm71onnr9] {
    font-size: 1.5em;
    font-weight: 800;
    color: #d32f2f;
    background: none;
    border-radius: 0;
    padding: 0;
    min-width: 85px;
    text-align: center;
    transition: all 0.3s ease;
}

    .ventas-encabezado .contador.critico[b-ttm71onnr9],
    .contador.critico[b-ttm71onnr9] {
        animation: parpadeoRojo-b-ttm71onnr9 1s infinite alternate ease-in-out;
    }

@keyframes parpadeoRojo-b-ttm71onnr9 {
    0% {
        color: #d32f2f;
        transform: scale(1);
    }

    50% {
        color: #ff0000;
        transform: scale(1.05);
    }

    100% {
        color: #b71c1c;
        transform: scale(1);
    }
}

/* ===========================
   PANEL DE NOTICIAS (derecha)
   =========================== */
.panel-noticias[b-ttm71onnr9] {
    position: relative;
    width: 520px;
    background: #f7fbff;
    border-radius: 12px;
    padding: 14px 16px;
    height: auto;
    z-index: 10;
    margin-top: 0;
    margin-left: 0;
}

    .panel-noticias .header[b-ttm71onnr9] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        margin-bottom: 10px;
    }

        .panel-noticias .header h3[b-ttm71onnr9] {
            margin: 0;
            font-size: 1.25rem;
            font-weight: 900;
            color: #0d47a1;
            letter-spacing: .3px;
        }

    .panel-noticias .acciones[b-ttm71onnr9] {
        display: flex;
        gap: 8px;
    }

.btn-icono[b-ttm71onnr9] {
    border: 1px solid #c5d6f2;
    background: #e9f2ff;
    border-radius: 8px;
    padding: 6px 10px;
    font-weight: 700;
    cursor: pointer;
    transition: .2s;
}

    .btn-icono:hover[b-ttm71onnr9] {
        background: #d9eaff;
    }

.noticias-scroll[b-ttm71onnr9] {
    max-height: 520px;
    overflow-y: auto;
    padding-right: 6px;
    scrollbar-gutter: stable;
}

.noticia-card[b-ttm71onnr9] {
    background: #ffffff;
    border: 2px solid #e6edf8;
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 10px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.04);
    transition: transform .15s ease, box-shadow .2s ease;
}

    .noticia-card:hover[b-ttm71onnr9] {
        transform: translateY(-1px);
        box-shadow: 0 6px 16px rgba(0,0,0,0.08);
    }

.noticia-top[b-ttm71onnr9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 6px;
}

.noticia-titulo[b-ttm71onnr9] {
    font-weight: 900;
    font-size: 1.05rem;
    color: #153e75;
    margin: 0;
}

.badges[b-ttm71onnr9] {
    display: flex;
    gap: 6px;
    align-items: center;
}

.badge[b-ttm71onnr9] {
    padding: 3px 8px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 800;
}

.badge-todos[b-ttm71onnr9] {
    background: #e8f5e9;
    color: #1b5e20;
    border: 1px solid #c8e6c9;
}

.badge-priv[b-ttm71onnr9] {
    background: #fff3e0;
    color: #e65100;
    border: 1px solid #ffe0b2;
}

.badge-fecha[b-ttm71onnr9] {
    background: #e3f2fd;
    color: #0d47a1;
    border: 1px solid #bbdefb;
}

.noticia-body[b-ttm71onnr9] {
    color: #334155;
    line-height: 1.45;
    white-space: pre-wrap;
    margin-bottom: 8px;
}

.noticia-acciones[b-ttm71onnr9] {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.btn-cerrar[b-ttm71onnr9] {
    background: #ffe5e5;
    color: #b71c1c;
    border: 1px solid #ffcdd2;
    border-radius: 8px;
    padding: 6px 10px;
    font-weight: 800;
    cursor: pointer;
    transition: .2s;
}

    .btn-cerrar:hover[b-ttm71onnr9] {
        background: #ffcccc;
    }

.noticia-leida[b-ttm71onnr9] {
    opacity: .55;
}

.col-prohibidos[b-ttm71onnr9] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
}

:root[b-ttm71onnr9] {
    --ancho-prohibidos: 360px;
}

.col-prohibidos .numeros-prohibidos-panel[b-ttm71onnr9] {
    width: var(--ancho-prohibidos);
}

.col-prohibidos .acciones-bajo-prohibidos[b-ttm71onnr9] {
    width: var(--ancho-prohibidos);
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 20px;
}

/* === Estado bloqueado (sorteo cerrado) === */
.bloqueado[b-ttm71onnr9] {
    opacity: 0.6;
    pointer-events: none;
    transition: opacity 0.3s ease;
    position: relative;
}

    .bloqueado[b-ttm71onnr9]::after {
        content: "SORTEO CERRADO";
        position: absolute;
        top: 40%;
        left: 0;
        right: 0;
        text-align: center;
        font-weight: bold;
        font-size: 1.1rem;
        color: #b40000;
        background: rgba(255,255,255,0.85);
        border: 2px solid #b40000;
        border-radius: 8px;
        padding: 8px;
        width: 60%;
        margin: 0 auto;
        box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    }

/* ===== MODAL VER LISTA (escala dinámica) ===== */
.modal-overlay[b-ttm71onnr9] {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0,0,0,.45);
    z-index: 99998 !important;
}

.modal-lista[b-ttm71onnr9] {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 96vw !important;
    height: 90vh !important;
    background: #eaf3fb;
    border: 1px solid #b6d0e8;
    border-radius: 10px;
    padding: 10px 12px;
    padding-top: 0px;
    box-shadow: 0 10px 30px rgba(0,0,0,.25);
    z-index: 99999 !important;
    box-sizing: border-box;
    /* 🔹 ANTES: overflow: hidden !important; */
    overflow-y: auto !important; /* scroll vertical si hace falta */
    overflow-x: hidden !important; /* evitamos scroll horizontal feo */
}

body.modal-open[b-ttm71onnr9] {
    overflow: hidden !important;
}

.modal-close[b-ttm71onnr9] {
    border: none;
    background: #ffeded;
    color: #b40000;
    cursor: pointer;
    width: 30px;
    height: 30px;
    border-radius: 6px;
    font-size: 20px;
    position: absolute;
    top: 10px;
    right: 12px;
    z-index: 2;
}

    .modal-close:hover[b-ttm71onnr9] {
        background: #ffd6d6;
    }

/* CONTENEDOR ÚNICO DEL CONTENIDO DE LA LISTA */
#listaCanvas[b-ttm71onnr9] {
    width: 100%;
    height: 100%;
    padding: 10px 20px 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center; /* centrado horizontal */
    justify-content: flex-start; /* contenido pegado arriba, no al centro */
}

#contentLista[b-ttm71onnr9] {
    display: inline-block; /* que mida según su tabla, no que se estire raro */
}

/* ============================
   🧱 ESTRUCTURA MODO NORMAL
   ============================ */
.lista-unica-normal[b-ttm71onnr9] {
    width: 100%;
    max-width: 1150px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 0;
}

/* ============================
   🧱 ESTRUCTURA MODO REVENTADO
   ============================ */
.lista-unica-rev[b-ttm71onnr9] {
    width: 100%;
    max-width: 1350px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 0;
}

/* === TÍTULO Y FECHA === */
.fila-titulo[b-ttm71onnr9] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.titulo-sorteo-modal[b-ttm71onnr9] {
    font-weight: 900;
    font-size: 1.6rem;
    color: #c68200;
}

.fecha-modal[b-ttm71onnr9] {
    font-weight: 700;
    font-size: 1rem;
    color: #255;
}

/* === TOTALES GENERALES (arriba) === */
.fila-totales-normal[b-ttm71onnr9],
.fila-totales-rev[b-ttm71onnr9] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
    margin-bottom: 6px;
}

    .fila-totales-normal .label[b-ttm71onnr9],
    .fila-totales-rev .label[b-ttm71onnr9] {
        font-weight: 900;
        font-size: 0.95rem;
        color: #04192e;
    }

    .fila-totales-normal .valor[b-ttm71onnr9],
    .fila-totales-rev .valor[b-ttm71onnr9] {
        font-weight: 900;
        font-size: 0.95rem;
        color: #b31523;
    }

    .fila-totales-rev .sep[b-ttm71onnr9] {
        margin: 0 6px;
        opacity: .6;
    }

/* ============================
   🧮 REJILLA PRINCIPAL
   ============================ */

/* Modo NORMAL: 5 bloques (N° + Monto) = 10 columnas */
.lista-unica-normal .fila-cabecera[b-ttm71onnr9],
.lista-unica-normal .fila-numeros[b-ttm71onnr9],
.lista-unica-normal .fila-totales-f[b-ttm71onnr9] {
    display: grid;
    grid-template-columns: repeat(5, 78px 85px);
    column-gap: 4px;
    row-gap: 4px;
    justify-content: center;
}

/* Modo REVENTADO: 5 bloques (N° + Monto + R) = 15 columnas */
.lista-unica-rev .fila-cabecera[b-ttm71onnr9],
.lista-unica-rev .fila-numeros[b-ttm71onnr9],
.lista-unica-rev .fila-totales-f-rev[b-ttm71onnr9] {
    display: grid;
    grid-template-columns: repeat(5, 64px 95px 95px);
    column-gap: 4px;
    row-gap: 4px;
    justify-content: center;
}

/* ============================
   🎨 CABECERAS (Actualizadas)
   ============================ */

/* 🔵 CABECERA N° */
.h-num[b-ttm71onnr9] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #0d6efd; /* azul fuerte */
    color: white;
    font-size: 11px;
    font-weight: 900;
    border-radius: 6px;
    border: 1px solid #0a58ca;
    height: 22px;
    box-sizing: border-box;
}

/* 🟢 CABECERA MONTO */
.h-monto[b-ttm71onnr9] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #3CB371; /* verde fuerte */
    color: white;
    font-size: 11px;
    font-weight: 900;
    border-radius: 6px;
    border: 1px solid #2e8b57;
    height: 22px;
    box-sizing: border-box;
}

/* 🔴 CABECERA REVENTADO (R) */
.h-monto-rev[b-ttm71onnr9] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #E74C3C; /* rojo fuerte */
    color: white;
    font-size: 11px;
    font-weight: 900;
    border-radius: 6px;
    border: 1px solid #c0392b;
    height: 22px;
    box-sizing: border-box;
}

/* ============================
   🎨 CELDAS (N°, Monto, R)
   ============================ */
.celda-num[b-ttm71onnr9],
.celda-monto[b-ttm71onnr9],
.celda-monto-rev[b-ttm71onnr9] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 800;
    padding: 0 6px;
    border-radius: 10px;
    height: 22px;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Número */
.celda-num[b-ttm71onnr9] {
    background: #e4f1fb;
    color: #0a406e;
    border: 1px solid #8db7d8;
}

/* Monto normal */
.celda-monto[b-ttm71onnr9] {
    background: #e9f7ef;
    color: #0a5c38;
    border: 1px solid #8cc7a9;
}

/* Monto reventado */
.celda-monto-rev[b-ttm71onnr9] {
    background: #faecec;
    color: #b02222;
    border: 1px solid #d3a3a3;
}

/* Números prohibidos en rojo */
.celda-num.prohibido[b-ttm71onnr9] {
    color: #d32f2f;
    font-size: 14px;
}

/* ============================================================
   🟦 TOTALES F1..F5 — MODO NORMAL (5 columnas x 2 = 10 celdas)
   Alineado EXACTO como las filas de números
   ============================================================ */
.fila-totales-f[b-ttm71onnr9] {
    display: grid;
    grid-template-columns: repeat(10, 1fr); /* 5 pares (label + monto) */
    gap: 4px;
    margin-top: 4px;
}

    .fila-totales-f .label[b-ttm71onnr9],
    .fila-totales-f .valor[b-ttm71onnr9] {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 26px;
        font-size: 14px;
        font-weight: 950;
        border-radius: 6px;
        box-sizing: border-box;
        padding: 0 6px;
    }

    /* 🔵 Label: "Total F1", "Total F2"... */
    .fila-totales-f .label[b-ttm71onnr9] {
        background: #eaf8ff; /* azul clarito */
        color: #0c6aa6; /* azul más fuerte */
        border: 1px dashed #0c6aa6; /* borde punteado */
        white-space: nowrap; /* 👉 evita que se parta en dos líneas */
    }

    /* 🟢 Monto normal */
    .fila-totales-f .valor[b-ttm71onnr9] {
        background: #f1fff5; /* verde muy suave */
        color: #0f7a3a; /* verde más fuerte */
        border: 1px dashed #0f7a3a; /* borde punteado */
    }

/* ============================================================
   🔴 TOTALES F1..F5 — MODO REVENTADO (5 columnas x 3 = 15 celdas)
   (Label + Monto Normal + Monto R)
   ============================================================ */
.fila-totales-f-rev[b-ttm71onnr9] {
    display: grid;
    grid-template-columns: repeat(15, 1fr); /* 5 grupos x 3 columnas */
    gap: 4px;
    margin-top: 4px;
}

    .fila-totales-f-rev .label[b-ttm71onnr9],
    .fila-totales-f-rev .valor-normal[b-ttm71onnr9],
    .fila-totales-f-rev .valor-rev[b-ttm71onnr9] {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 26px;
        font-size: 14px;
        font-weight: 950;
        border-radius: 6px;
        box-sizing: border-box;
        padding: 0 6px;
    }

    /* 🔵 Label */
    .fila-totales-f-rev .label[b-ttm71onnr9] {
        background: #eaf8ff;
        color: #0c6aa6;
        border: 1px dashed #0c6aa6;
        white-space: nowrap; /* 👉 igual: sin salto de línea */
    }

    /* 🟢 Monto normal */
    .fila-totales-f-rev .valor-normal[b-ttm71onnr9] {
        background: #f1fff5;
        color: #0f7a3a;
        border: 1px dashed #0f7a3a;
    }

    /* 🔴 Monto reventado */
    .fila-totales-f-rev .valor-rev[b-ttm71onnr9] {
        background: #fff5f5;
        color: #c62828;
        border: 1px dashed #c62828;
    }

/* Asegurar que nada se desborde raro */
#listaCanvas > div[b-ttm71onnr9] {
    min-width: 0;
    min-height: 0;
}

/* === Popup de error de venta (centrado en la pantalla) === */
.venta-modal-backdrop[b-ttm71onnr9] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999999;
}

.venta-modal[b-ttm71onnr9] {
    background: #ffffff;
    border-radius: 14px;
    padding: 18px 22px 20px;
    max-width: 420px;
    width: 90%;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.35);
    animation: ventaModalIn-b-ttm71onnr9 0.18s ease-out;
    text-align: left;
}

    .venta-modal h3[b-ttm71onnr9] {
        margin: 0 0 10px 0;
        font-size: 1.15rem;
        font-weight: 800;
        color: #c62828;
    }

    .venta-modal p[b-ttm71onnr9] {
        margin: 0 0 18px 0;
        line-height: 1.4;
        font-size: 0.95rem;
        white-space: pre-line;
        color: #333;
    }

    .venta-modal .btn.ok[b-ttm71onnr9] {
        width: 100%;
        font-weight: 600;
    }

@keyframes ventaModalIn-b-ttm71onnr9 {
    from {
        opacity: 0;
        transform: translateY(10px) scale(0.97);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* ✅ Número mini para Parley (2 dígitos) */
.numero-mini[b-ttm71onnr9] {
    width: 85px !important;
    max-width: 85px !important;
    padding: 10px !important;
    font-size: 20px !important;
    height: 48px;
}

.parley-tabla[b-ttm71onnr9] {
    margin-top: 12px;
    border: 1px solid #e6edf8;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
}

.parley-header[b-ttm71onnr9] {
    display: grid;
    grid-template-columns: 1fr 180px;
    font-weight: 900;
    background: #f3f7ff;
    border-bottom: 1px solid #e6edf8;
}

.parley-h-num[b-ttm71onnr9], .parley-h-monto[b-ttm71onnr9] {
    padding: 10px 12px;
}

.parley-row[b-ttm71onnr9] {
    display: grid;
    grid-template-columns: 1fr 180px;
    border-bottom: 1px solid #eef3ff;
}

    .parley-row:last-child[b-ttm71onnr9] {
        border-bottom: none;
    }

.parley-num[b-ttm71onnr9], .parley-monto[b-ttm71onnr9] {
    padding: 10px 12px;
    font-weight: 700;
}

.parley-monto[b-ttm71onnr9] {
    text-align: right;
}

.parley-vacio[b-ttm71onnr9] {
    padding: 14px 12px;
    font-weight: 700;
    opacity: .8;
}

/* =========================
   FECHA VENTA (Parley)
   - mismo estilo que usamos en Tiempos/Restricciones
   ========================= */

.fecha-venta-box[b-ttm71onnr9] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid #e6edf8;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
    width: fit-content;
}

.fv-titulo[b-ttm71onnr9] {
    font-weight: 900;
    color: #153e75;
    font-size: 1.05rem;
    margin-right: 6px;
}

/* ✅ FECHA GRANDE (igual a Restricciones) */
.fv-xl[b-ttm71onnr9] {
    height: 56px !important;
    padding: 10px 14px !important;
    font-size: 1.35rem !important;
    font-weight: 900 !important;
    color: #153e75 !important;
    border: 1px solid #cfe0f5 !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.06) !important;
    box-sizing: border-box !important;
    line-height: 1.2 !important;
}

    .fv-xl[b-ttm71onnr9]::-webkit-datetime-edit {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

    .fv-xl[b-ttm71onnr9]::-webkit-datetime-edit-day-field,
    .fv-xl[b-ttm71onnr9]::-webkit-datetime-edit-month-field,
    .fv-xl[b-ttm71onnr9]::-webkit-datetime-edit-year-field {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

    .fv-xl[b-ttm71onnr9]::-webkit-datetime-edit-text {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

    .fv-xl[b-ttm71onnr9]::-webkit-calendar-picker-indicator {
        cursor: pointer;
        opacity: .80;
    }

.fv-hoy[b-ttm71onnr9] {
    height: 56px;
    padding: 0 14px;
    border-radius: 10px;
    border: 1px solid #cfe0f5;
    background: #f6f7fb;
    font-weight: 900;
    color: #153e75;
    cursor: pointer;
}

    .fv-hoy:hover[b-ttm71onnr9] {
        background: #eef5ff;
        border-color: #98bdf0;
    }

/* ==========================================================
   ✅ FIX ENCABEZADO PARLEY (MISMO DISEÑO QUE TIEMPOS)
   - Centra día/hora como en Tiempos
   - Caja Fecha de venta igual
   - Borde del encabezado más oscuro para que se note más
   ========================================================== */

/* 1) Encabezado: misma alineación + borde más marcado */
.ventas-encabezado[b-ttm71onnr9] {
    display: flex !important;
    align-items: center !important; /* clave: todo alineado bonito */
    justify-content: space-between !important;
    gap: 14px !important;
    padding: 12px 22px !important; /* banner compacto como tiempos */
    margin: 10px 20px 0 !important;
    background: linear-gradient(90deg, #f7f9fb, #e3f2fd) !important;
    /* ✅ BORDE MÁS OSCURO (esto es lo que pediste) */
    border: 2px solid rgba(13, 71, 161, 0.35) !important;
    border-radius: 12px !important;
    /* sombra un poco más visible */
    box-shadow: 0 3px 10px rgba(0,0,0,0.10) !important;
}

/* 2) Centro: YA NO absoluto (igual que Tiempos) */
.fecha-centro[b-ttm71onnr9] {
    position: static !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    margin: 0 auto !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 3px !important;
}

/* 3) Caja derecha (Fecha de venta) igual que Tiempos: en una sola fila */
.fecha-venta-box[b-ttm71onnr9] {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    width: fit-content !important;
    min-width: 0 !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
    /* mantiene el estilo que ya usas, solo lo hacemos consistente */
    background: #eef6ff !important;
    border: 1px solid rgba(13, 71, 161, 0.25) !important;
}

/* 4) Input date grande EXACTO (si ya existe en tu Parley, lo refuerza) */
.fv-xl[b-ttm71onnr9] {
    height: 56px !important;
    padding: 10px 14px !important;
    font-size: 1.35rem !important;
    font-weight: 900 !important;
    color: #153e75 !important;
    border: 1px solid #cfe0f5 !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.06) !important;
    box-sizing: border-box !important;
    line-height: 1.2 !important;
}

    .fv-xl[b-ttm71onnr9]::-webkit-datetime-edit,
    .fv-xl[b-ttm71onnr9]::-webkit-datetime-edit-day-field,
    .fv-xl[b-ttm71onnr9]::-webkit-datetime-edit-month-field,
    .fv-xl[b-ttm71onnr9]::-webkit-datetime-edit-year-field,
    .fv-xl[b-ttm71onnr9]::-webkit-datetime-edit-text {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

/* 5) Botón Hoy: misma altura que el date */
.fv-hoy[b-ttm71onnr9] {
    height: 56px !important;
    padding: 0 14px !important;
    border-radius: 10px !important;
}

/* ==========================================================
   ✅ PARLEY: COLUMNA CENTRAL tipo TIEMPOS (reservar espacio)
   y borde más oscuro para que se note más (como pediste)
   ========================================================== */

/* Caja “fantasma” central (equivale visualmente al panel de prohibidos en Tiempos) */
.parley-centro-placeholder[b-ttm71onnr9] {
    width: 100%;
    min-height: 92px; /* altura parecida al bloque de prohibidos */
    border: 2px solid #7f8fa8; /* ✅ borde más oscuro */
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 3px 10px rgba(0,0,0,0.06);
}

/* ==========================================================
   ✅ PARLEY FIX FINAL: mantener 3 columnas en una sola fila
   (IZQ ventas) (CENTRO placeholder+botones) (DER noticias)
   ========================================================== */

/* 1) Asegura que SIEMPRE sea fila (no columna) */
.ventas-contenido[b-ttm71onnr9] {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 24px !important;
    flex-wrap: nowrap !important; /* nunca baja a otra fila */
    width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: auto !important; /* si no cabe, scroll horizontal */
}

    /* 2) IZQUIERDA (panel ventas) — que no se rompa */
    .ventas-contenido > .ventas-izquierda[b-ttm71onnr9] {
        flex: 0 0 auto !important;
    }

/* 3) COLUMNA CENTRAL: MISMO ANCHO que tiempos */
:root[b-ttm71onnr9] {
    --ancho-prohibidos: 360px;
}

.ventas-contenido > .col-prohibidos[b-ttm71onnr9] {
    flex: 0 0 var(--ancho-prohibidos) !important;
    min-width: var(--ancho-prohibidos) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
}

/* 4) Caja fantasma (borde oscuro) */
.col-prohibidos .parley-centro-placeholder[b-ttm71onnr9] {
    width: 100% !important;
    min-height: 92px !important;
    border: 2px solid #7f8fa8 !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    box-shadow: 0 3px 10px rgba(0,0,0,0.06) !important;
}

/* 5) Botones debajo del placeholder, dentro de la misma columna */
.col-prohibidos .acciones-bajo-prohibidos[b-ttm71onnr9] {
    width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important; /* si no caben, bajan dentro de la misma columna */
    gap: 10px !important;
    align-items: center !important;
    margin-top: 0 !important;
}

/* 6) Panel Noticias: SIEMPRE a la derecha, arriba */
.ventas-contenido > .panel-noticias[b-ttm71onnr9] {
    flex: 0 0 520px !important;
    min-width: 520px !important;
    margin-top: 0 !important;
}

/* ==========================================================
   ✅ PATCH FINAL PARLEY (NO BORRA NADA)
   - Alinea botones con "Guardar / Imprimir"
   - Quita cuadro blanco (sin eliminar diseños)
   - Refuerza borde del panel noticias sin cambiar su estilo
   ========================================================== */

/* 1) La columna central mantiene su ancho como Tiempos */
.ventas-contenido > .col-prohibidos[b-ttm71onnr9] {
    flex: 0 0 var(--ancho-prohibidos);
    min-width: var(--ancho-prohibidos);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    margin-top: 0 !important; /* 🔒 NO empujar la columna completa */
}

/* 2) "Altura fantasma" para que los botones bajen EXACTO como en Tiempos,
      pero SIN verse (no es cuadro blanco visible) */
.col-prohibidos .parley-centro-placeholder[b-ttm71onnr9] {
    display: block !important;
    width: 100% !important;
    height: 300px !important; /* ✅ AJUSTE FINO AQUÍ */
    min-height: 300px !important;
    background: transparent !important; /* invisible */
    border: none !important; /* invisible */
    box-shadow: none !important; /* invisible */
    padding: 0 !important;
    margin: 0 !important;
}

/* 3) Botones: pegados justo debajo del placeholder invisible */
.col-prohibidos .acciones-bajo-prohibidos[b-ttm71onnr9] {
    width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    align-items: center !important;
    margin-top: 0 !important; /* ✅ QUITA el margin-top:20px que los baja raro */
}

/* =========================
   WHATSAPP (BOTÓN + MODAL + MODAL IMAGEN)
   (Copiado desde Tiempos)
========================= */

/* ===== Botón WhatsApp ===== */
.wa-btn2[b-ttm71onnr9] {
    width: fit-content;
    max-width: 420px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 11px 14px;
    border-radius: 12px;
    border: 2px solid rgba(37, 211, 102, .75);
    background: linear-gradient(180deg, rgba(37,211,102,.22), rgba(18,140,126,.12));
    color: #0b2b16;
    font-weight: 900;
    font-size: 15px;
    line-height: 1;
    box-shadow: 0 10px 22px rgba(0,0,0,.12);
}

    .wa-btn2:hover[b-ttm71onnr9] {
        filter: brightness(1.05);
    }

    .wa-btn2:disabled[b-ttm71onnr9] {
        opacity: .5;
        cursor: not-allowed;
        filter: none;
    }

.wa-btn2__icon[b-ttm71onnr9] {
    width: 28px;
    height: 28px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.70);
    border: 1px solid rgba(0,0,0,.08);
    flex: 0 0 auto;
}

    .wa-btn2__icon svg[b-ttm71onnr9] {
        width: 18px;
        height: 18px;
        display: block;
    }

.wa-btn2__text[b-ttm71onnr9] {
    white-space: nowrap;
}

/* ===== Modal principal WhatsApp ===== */
.wa2-backdrop[b-ttm71onnr9] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.64);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    z-index: 99999;
}

.wa2-modal[b-ttm71onnr9] {
    width: min(720px, 96vw);
    background: #0f1420;
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 30px 70px rgba(0,0,0,.65);
}

.wa2-header[b-ttm71onnr9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 16px;
    background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0));
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.wa2-title[b-ttm71onnr9] {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #fff;
}

.wa2-badge[b-ttm71onnr9] {
    width: 44px;
    height: 44px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: rgba(37,211,102,.14);
    border: 1px solid rgba(37,211,102,.25);
    color: #25D366;
}

    .wa2-badge svg[b-ttm71onnr9] {
        width: 22px;
        height: 22px;
        display: block;
    }

.wa2-title__main[b-ttm71onnr9] {
    font-weight: 900;
    font-size: 17px;
    line-height: 1.1;
}

.wa2-title__sub[b-ttm71onnr9] {
    font-size: 14px;
    opacity: .85;
    margin-top: 2px;
}

.wa2-x[b-ttm71onnr9] {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.06);
    color: #fff;
    cursor: pointer;
}

    .wa2-x:hover[b-ttm71onnr9] {
        filter: brightness(1.1);
    }

.wa2-body[b-ttm71onnr9] {
    padding: 16px;
}

.wa2-grid[b-ttm71onnr9] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

@media (max-width: 640px) {
    .wa2-grid[b-ttm71onnr9] {
        grid-template-columns: 1fr;
    }
}

.wa2-field[b-ttm71onnr9] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.wa2-label[b-ttm71onnr9] {
    font-size: 14px;
    opacity: .85;
    color: #dfe7ff;
}

.wa2-input[b-ttm71onnr9], .wa2-select[b-ttm71onnr9] {
    width: 100%;
    padding: 12px 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.06);
    color: #fff;
    outline: none;
}

    .wa2-input[b-ttm71onnr9]::placeholder {
        color: rgba(255,255,255,.55);
    }

.wa2-actions[b-ttm71onnr9] {
    margin-top: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.wa2-actions__right[b-ttm71onnr9] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.wa2-btn[b-ttm71onnr9] {
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.06);
    color: #fff;
    cursor: pointer;
    font-weight: 800;
}

    .wa2-btn:hover[b-ttm71onnr9] {
        filter: brightness(1.08);
    }

.wa2-btn--ghost[b-ttm71onnr9] {
    background: transparent;
}

.wa2-btn--soft[b-ttm71onnr9] {
    background: rgba(37,211,102,.10);
    border-color: rgba(37,211,102,.22);
}

.wa2-btn--primary[b-ttm71onnr9] {
    background: linear-gradient(180deg, rgba(37,211,102,.35), rgba(18,140,126,.25));
    border-color: rgba(37,211,102,.35);
}

.wa2-note[b-ttm71onnr9] {
    margin-top: 12px;
    padding: 12px 12px;
    border-radius: 14px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.10);
    color: #e8f0ff;
    font-size: 14px;
    line-height: 1.35;
}

/* ===== Modal Imagen ===== */
.wa-img-backdrop[b-ttm71onnr9] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.75);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px;
    z-index: 100000;
}

.wa-img-modal[b-ttm71onnr9] {
    width: min(820px, 96vw);
    max-height: 92vh;
    background: #0f1420;
    border-radius: 18px;
    padding: 14px;
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 30px 70px rgba(0,0,0,.65);
    overflow: auto;
}

    .wa-img-modal h3[b-ttm71onnr9] {
        margin: 0 0 10px 0;
        color: #fff;
        font-weight: 900;
        font-size: 18px;
    }

.wa-ticket-img[b-ttm71onnr9] {
    width: 100%;
    height: auto;
    max-height: calc(92vh - 170px);
    object-fit: contain;
    display: block;
}

.wa-actions[b-ttm71onnr9] {
    margin-top: 12px;
    display: flex;
    justify-content: center;
    gap: 10px;
}

.btn-guardar.ok[b-ttm71onnr9] {
    padding: 10px 16px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(37,211,102,.12);
    color: #fff;
    font-weight: 900;
    cursor: pointer;
}

    .btn-guardar.ok:hover[b-ttm71onnr9] {
        filter: brightness(1.08);
    }
/* _content/SistemaLoteriaDashboard/Components/Ventas/VentasRifas.razor.rz.scp.css */

/* ==========================================================
   🧩 LAYOUT PRINCIPAL
   ========================================================== */
.ventas-contenido[b-12qz6djty6] {
    display: flex;
    align-items: flex-start;
    gap: 24px;
    padding: 0 20px;
    width: 100%;
    box-sizing: border-box;
    margin-top: 12px;
    /* 🔒 Que TODO sea una sola fila */
    flex-wrap: nowrap;
    /* 📜 Si no cabe con mucho zoom, scroll horizontal */
    overflow-x: auto;
}

.ventas-izquierda[b-12qz6djty6] {
    flex: 0 0 auto; /* ya tienes min/max-width, así no se deforma */
}

.col-prohibidos[b-12qz6djty6] {
    flex: 0 0 auto;
}

.panel-noticias[b-12qz6djty6] {
    flex: 0 0 520px; /* mismo ancho que ya usas */
}


/* ==========================================================
   🧩 PANEL IZQUIERDO (VENTAS)
   ========================================================== */
.ventas-izquierda[b-12qz6djty6] {
    flex: 1;
    min-width: 400px;
    max-width: 700px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    background: #fff;
    border: 2px solid #e0e0e0;
    border-radius: 10px;
    padding: 15px;
    box-sizing: border-box;
    min-height: 300px;
    margin: 0;
}

/* ====== LISTA (contenedor con scroll) ====== */
.ventas-lista[b-12qz6djty6] {
    position: relative;
    border: 2px solid #e0e6f1;
    border-radius: 8px;
    background: #fff;
    max-height: 420px;
    overflow-y: auto;
    overflow-x: hidden;
    scroll-behavior: smooth;
    scrollbar-gutter: stable;
    padding: 0;
}

/* ====== LISTA: el grid lo usan las filas (no el contenedor) ====== */
.tabla-lista[b-12qz6djty6] {
    display: block;
    width: 100%;
    margin: 0 auto;
}

/* ====== FILA CABECERA y FILA ITEM: aquí vive el grid real ====== */
.fila-cabecera[b-12qz6djty6],
.fila-item[b-12qz6djty6] {
    display: grid;
    grid-template-columns: 120px 170px 56px;
    width: 100%;
    justify-content: center;
    align-items: center;
}

/* Modo BASE con reventado */
.tabla-lista.reventado .fila-cabecera[b-12qz6djty6],
.tabla-lista.reventado .fila-item[b-12qz6djty6] {
    grid-template-columns: minmax(90px, 1.1fr) /* Número */
    minmax(120px, 1.4fr) /* Monto */
    minmax(120px, 1.4fr) /* Monto R */
    minmax(40px, 0.6fr); /* X */
}


/* ====== CELDAS ====== */
.celda[b-12qz6djty6] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    text-align: right;
    padding: 10px 12px;
    min-height: 44px;
    font-weight: 800;
    font-size: 20px;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
    border-bottom: 1px solid #e6ecf6;
}

    /* CABECERA (títulos centrados y más grandes) */
    .celda.titulo[b-12qz6djty6] {
        position: sticky;
        top: 0;
        z-index: 10;
        background: #f7f9fc;
        border-bottom: 2px solid #e0e6f1;
        box-shadow: 0 1px 0 #e0e6f1;
        text-align: center;
        justify-content: center;
        align-items: center;
        font-weight: 900;
        font-size: 22px;
        color: #1c2b4d;
        height: 48px;
    }

        /* La celda de cabecera de la columna de la X (vacía pero sticky) */
        .celda.titulo.th-x[b-12qz6djty6] {
            background: #f7f9fc;
            pointer-events: none;
        }

/* Celdas normales (centradas igual) */
.celda[b-12qz6djty6],
.fila-item .numero[b-12qz6djty6],
.fila-item .monto[b-12qz6djty6] {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 800;
    font-size: 20px;
    height: 48px;
}

/* Guion perfectamente centrado entre Número y Monto */
.fila-item .celda.numero[b-12qz6djty6]::after {
    content: "–";
    color: #76acfe;
    font-weight: 600;
    font-size: 20px;
    position: relative;
    left: 65%;
    transform: translateX(-50%);
    top: 25%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

/* ========== BOTÓN ELIMINAR (moderno y elegante) ========== */
.btn-eliminar[b-12qz6djty6] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 10px;
    background: linear-gradient(180deg,#ff5c5c,#d93636);
    box-shadow: 0 6px 14px rgba(217,54,54,.25), inset 0 1px 0 rgba(255,255,255,.28);
    cursor: pointer;
    padding: 0;
    font-size: 0;
    line-height: 1;
    margin: auto;
    z-index: 1;
    transition: transform .12s ease, box-shadow .18s ease, filter .18s ease, background .18s ease;
}

    .btn-eliminar[b-12qz6djty6]::before,
    .btn-eliminar[b-12qz6djty6]::after {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        width: 14px;
        height: 2px;
        background: #fff;
        border-radius: 2px;
        transform-origin: center;
        box-shadow: 0 0 1px rgba(0,0,0,.25);
    }

    .btn-eliminar[b-12qz6djty6]::before {
        transform: translate(-50%,-50%) rotate(45deg);
    }

    .btn-eliminar[b-12qz6djty6]::after {
        transform: translate(-50%,-50%) rotate(-45deg);
    }

    .btn-eliminar:hover[b-12qz6djty6] {
        transform: translateY(-1px) scale(1.03);
        filter: saturate(1.06);
        box-shadow: 0 10px 20px rgba(217,54,54,.28), inset 0 1px 0 rgba(255,255,255,.32);
    }

    .btn-eliminar:active[b-12qz6djty6] {
        transform: translateY(0) scale(.97);
        box-shadow: 0 4px 10px rgba(217,54,54,.22), inset 0 1px 0 rgba(255,255,255,.24);
    }

    .btn-eliminar:focus-visible[b-12qz6djty6] {
        outline: 3px solid rgba(25,118,210,.35);
        outline-offset: 2px;
        box-shadow: 0 0 0 4px rgba(25,118,210,.15), 0 8px 18px rgba(217,54,54,.25), inset 0 1px 0 rgba(255,255,255,.28);
    }

@media (prefers-reduced-motion: reduce) {
    .btn-eliminar[b-12qz6djty6] {
        transition: none;
    }
}

/* ====== SEPARADOR ====== */
.separador[b-12qz6djty6] {
    border: none;
    border-top: 2px solid #d9e0ef;
    margin: 8px 0;
}

/* ====== CAMPOS DE ENTRADA ====== */
.input-linea[b-12qz6djty6] {
    display: flex;
    gap: 10px;
    margin: 10px 0;
    justify-content: center;
    /* 👇 NUEVO: si con 3 cajas no cabe, que hagan otra fila
       en vez de salirse del panel al hacer zoom */
    flex-wrap: wrap;
    max-width: 100%;
}

.input-pequeno[b-12qz6djty6] {
    padding: 12px;
    font-size: 24px;
    font-weight: 800;
    border: 2px solid #ccc;
    border-radius: 8px;
    text-align: center;
    transition: .2s;
    /* 👇 NUEVO: ancho base, pero puede encogerse si hace falta */
    flex: 1 1 120px;
    max-width: 210px;
}

    .input-pequeno:focus[b-12qz6djty6] {
        border-color: #1e88e5;
        box-shadow: 0 0 5px rgba(30,136,229,.4);
        outline: none;
    }

.monto-corto[b-12qz6djty6] {
    width: 120px;
}

.numero-corto[b-12qz6djty6] {
    width: 120px;
}

/* ====== MONTO/NÚMERO arriba; Vender abajo centrado entre ambos ====== */
.bloque-entrada-rifa[b-12qz6djty6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.bloque-entrada-rifa .input-linea[b-12qz6djty6] {
    flex-wrap: nowrap;
    justify-content: center;
}

.rifa-monto-fijo-hint[b-12qz6djty6] {
    margin: 0 0 8px;
    font-size: 0.95rem;
    color: #1e3a5f;
    text-align: center;
}

.input-linea-solo-numero[b-12qz6djty6] {
    justify-content: center;
}

.numero-corto-full[b-12qz6djty6] {
    min-width: 140px;
}

.fila-boton-vender-rifa[b-12qz6djty6] {
    display: flex;
    justify-content: center;
    width: calc(120px + 10px + 120px);
    margin: 10px 0 0;
}

/* ====== BOTÓN GUARDAR / IMPRIMIR ====== */
.btn-guardar[b-12qz6djty6] {
    background: linear-gradient(90deg,#1976d2,#1e88e5);
    color: #fff;
    border: none;
    border-radius: 10px;
    padding: 12px 22px;
    cursor: pointer;
    font-weight: 800;
    font-size: 16px;
    transition: .2s;
}

    .btn-guardar:hover[b-12qz6djty6] {
        background: linear-gradient(90deg,#1565c0,#1976d2);
    }

/* ====== TOTAL ====== */
.total[b-12qz6djty6] {
    font-size: 22px;
    font-weight: 800;
    text-align: right;
    color: #003c8f;
    margin-top: 10px;
}

@media (max-width:520px) {
    .tabla-lista[b-12qz6djty6] {
        grid-template-columns: 100px 140px 46px;
    }

        .tabla-lista.reventado[b-12qz6djty6] {
            grid-template-columns: minmax(70px, 1.1fr) /* N° */
            minmax(90px, 1.3fr) /* Monto */
            minmax(90px, 1.3fr) /* Monto R */
            minmax(34px, 0.5fr); /* X */
        }


    .celda[b-12qz6djty6] {
        font-size: 18px;
    }
}

/* ===== Panel de Números Prohibidos con título rojo, fecha y ajuste dinámico ===== */
.numeros-prohibidos-panel[b-12qz6djty6] {
    ax-width: 620px; /* ajusta si quieres más/menos ancho */
    align-self: flex-start;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.1);
    padding: 16px 24px;
    border: 2px solid #c62828;
    text-align: center;
    display: inline-block;
    transition: all 0.3s ease;
    width: auto;
    height: auto;
    min-width: 240px;
}

    .numeros-prohibidos-panel h4[b-12qz6djty6] {
        color: #c62828;
        font-weight: 800;
        font-size: 1.45em;
        margin: 0 0 8px 0;
    }

.np-fecha[b-12qz6djty6] {
    font-size: 1.1em;
    font-weight: 700;
    color: #333;
    margin-top: 2px;
    margin-bottom: 10px;
    text-transform: capitalize;
}

.numeros-prohibidos[b-12qz6djty6] {
    list-style: none;
    padding: 0;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(11, minmax(40px, 1fr)); /* ✅ 11 por fila */
    gap: 8px;
    justify-content: center; /* centra la cuadrícula */
}
    .numeros-prohibidos li[b-12qz6djty6] {
        color: #e53935;
        font-weight: 700;
        background: #ffebee;
        padding: 6px 12px;
        border-radius: 8px;
        min-width: 40px;
        text-align: center;
        font-size: 1.15em;
        transition: transform 0.2s ease, background 0.2s ease;
    }

        .numeros-prohibidos li:hover[b-12qz6djty6] {
            background: #ffcdd2;
            transform: scale(1.08);
        }

/* ==========================================================
   🧩 ENCABEZADO
   ========================================================== */
.ventas-encabezado[b-12qz6djty6] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding: 15px 25px 25px;
    background: linear-gradient(90deg, #f7f9fb, #e3f2fd);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    margin: 10px 20px 0;
}

.titulo-sorteo[b-12qz6djty6] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    position: relative;
}

.sorteo-selector-titulo[b-12qz6djty6] {
    position: relative;
    cursor: pointer;
    user-select: none;
    display: inline-block;
}

.sorteo-nombre[b-12qz6djty6] {
    font-size: 2.2em;
    font-weight: 800;
    color: #004aad;
    letter-spacing: 1px;
    margin: 0;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.15);
    animation: colorCambio-b-12qz6djty6 4s linear infinite;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: transform 0.2s ease;
}

    .sorteo-nombre:hover[b-12qz6djty6] {
        transform: scale(1.02);
    }

.flecha[b-12qz6djty6] {
    font-size: 0.6em;
    margin-left: 6px;
    transition: transform 0.3s ease;
}

.sorteo-selector-titulo:hover .flecha[b-12qz6djty6] {
    transform: rotate(180deg);
}

.menu-sorteos[b-12qz6djty6] {
    position: absolute;
    top: 100%;
    left: 0;
    transform: none;
    width: 220px;
    background: #ffffff;
    border: 2px solid #cfd8dc;
    border-radius: 10px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
    margin-top: 8px;
    padding: 6px 0;
    list-style: none;
    z-index: 20;
    animation: aparecerMenu-b-12qz6djty6 0.2s ease-out forwards;
    max-height: min(60vh, 360px);
    overflow-y: auto;
    overflow-x: hidden;
}

    .menu-sorteos li[b-12qz6djty6] {
        font-weight: 700;
        color: #0d47a1;
        font-size: 1.1em;
        padding: 10px 16px;
        text-align: center;
        transition: all 0.2s ease;
        border-radius: 6px;
    }

        .menu-sorteos li:hover[b-12qz6djty6] {
            background: #e3f2fd;
            color: #003c8f;
            transform: scale(1.03);
        }

        .menu-sorteos li.activo[b-12qz6djty6] {
            background: #bbdefb;
            color: #0d47a1;
        }

@keyframes aparecerMenu-b-12qz6djty6 {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes colorCambio-b-12qz6djty6 {
    0% {
        color: #e53935;
    }

    25% {
        color: #f9a825;
    }

    50% {
        color: #1e88e5;
    }

    75% {
        color: #43a047;
    }

    100% {
        color: #e53935;
    }
}

.hora-info[b-12qz6djty6] {
    font-size: 1.05em;
    color: #0d47a1;
    font-weight: 600;
}

    .hora-info strong[b-12qz6djty6] {
        color: #1a237e;
    }

.hora-numero[b-12qz6djty6] {
    font-size: 1.4em;
    font-weight: 700;
    color: #0d47a1;
}


.fecha-texto[b-12qz6djty6] {
    font-size: 1.35em;
    font-weight: 800;
    color: #2c3e50;
    text-transform: capitalize;
}

.hora-texto[b-12qz6djty6] {
    font-size: 1.15em;
    font-weight: 700;
    color: #1565c0;
    letter-spacing: 1px;
}

/* ==========================================================
   🧩 BOTONES SECUNDARIOS
   ========================================================== */
.acciones-internas[b-12qz6djty6] {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 15px;
}

.btn-secundario[b-12qz6djty6] {
    background: linear-gradient(90deg, #e3f2fd, #bbdefb);
    color: #0d47a1;
    border: 1px solid #64b5f6;
    border-radius: 8px;
    padding: 8px 14px;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.95rem;
    transition: 0.2s;
}

    .btn-secundario:hover[b-12qz6djty6] {
        background: linear-gradient(90deg, #bbdefb, #90caf9);
    }

.btn-guardar:active[b-12qz6djty6],
.menu-btn:active[b-12qz6djty6] {
    transform: scale(0.97);
}

/* ===============================
   🎯 CONTADOR DE TIEMPO RESTANTE
   =============================== */
.ventas-encabezado .contador[b-12qz6djty6],
.contador[b-12qz6djty6] {
    font-size: 1.5em;
    font-weight: 800;
    color: #d32f2f;
    background: none;
    border-radius: 0;
    padding: 0;
    min-width: 85px;
    text-align: center;
    transition: all 0.3s ease;
}

    .ventas-encabezado .contador.critico[b-12qz6djty6],
    .contador.critico[b-12qz6djty6] {
        animation: parpadeoRojo-b-12qz6djty6 1s infinite alternate ease-in-out;
    }

@keyframes parpadeoRojo-b-12qz6djty6 {
    0% {
        color: #d32f2f;
        transform: scale(1);
    }

    50% {
        color: #ff0000;
        transform: scale(1.05);
    }

    100% {
        color: #b71c1c;
        transform: scale(1);
    }
}

/* ===========================
   PANEL DE NOTICIAS (derecha)
   =========================== */
.panel-noticias[b-12qz6djty6] {
    position: relative;
    width: 520px;
    background: #f7fbff;
    border: 2px solid #e0e6f1;
    border-radius: 12px;
    padding: 14px 16px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
    height: auto;
    z-index: 10;
    margin-top: 0;
    margin-left: 0;
}

    .panel-noticias .header[b-12qz6djty6] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        margin-bottom: 10px;
    }

        .panel-noticias .header h3[b-12qz6djty6] {
            margin: 0;
            font-size: 1.25rem;
            font-weight: 900;
            color: #0d47a1;
            letter-spacing: .3px;
        }

    .panel-noticias .acciones[b-12qz6djty6] {
        display: flex;
        gap: 8px;
    }

.btn-icono[b-12qz6djty6] {
    border: 1px solid #c5d6f2;
    background: #e9f2ff;
    border-radius: 8px;
    padding: 6px 10px;
    font-weight: 700;
    cursor: pointer;
    transition: .2s;
}

    .btn-icono:hover[b-12qz6djty6] {
        background: #d9eaff;
    }

.noticias-scroll[b-12qz6djty6] {
    max-height: 520px;
    overflow-y: auto;
    padding-right: 6px;
    scrollbar-gutter: stable;
}

.noticia-card[b-12qz6djty6] {
    background: #ffffff;
    border: 2px solid #e6edf8;
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 10px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.04);
    transition: transform .15s ease, box-shadow .2s ease;
}

    .noticia-card:hover[b-12qz6djty6] {
        transform: translateY(-1px);
        box-shadow: 0 6px 16px rgba(0,0,0,0.08);
    }

.noticia-top[b-12qz6djty6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 6px;
}

.noticia-titulo[b-12qz6djty6] {
    font-weight: 900;
    font-size: 1.05rem;
    color: #153e75;
    margin: 0;
}

.badges[b-12qz6djty6] {
    display: flex;
    gap: 6px;
    align-items: center;
}

.badge[b-12qz6djty6] {
    padding: 3px 8px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 800;
}

.badge-todos[b-12qz6djty6] {
    background: #e8f5e9;
    color: #1b5e20;
    border: 1px solid #c8e6c9;
}

.badge-priv[b-12qz6djty6] {
    background: #fff3e0;
    color: #e65100;
    border: 1px solid #ffe0b2;
}

.badge-fecha[b-12qz6djty6] {
    background: #e3f2fd;
    color: #0d47a1;
    border: 1px solid #bbdefb;
}

.noticia-body[b-12qz6djty6] {
    color: #334155;
    line-height: 1.45;
    white-space: pre-wrap;
    margin-bottom: 8px;
}

.noticia-acciones[b-12qz6djty6] {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.btn-cerrar[b-12qz6djty6] {
    background: #ffe5e5;
    color: #b71c1c;
    border: 1px solid #ffcdd2;
    border-radius: 8px;
    padding: 6px 10px;
    font-weight: 800;
    cursor: pointer;
    transition: .2s;
}

    .btn-cerrar:hover[b-12qz6djty6] {
        background: #ffcccc;
    }

.noticia-leida[b-12qz6djty6] {
    opacity: .55;
}

.col-prohibidos[b-12qz6djty6] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
}

:root[b-12qz6djty6] {
    --ancho-prohibidos: 360px;
}

.col-prohibidos .numeros-prohibidos-panel[b-12qz6djty6] {
    width: var(--ancho-prohibidos);
}

.col-prohibidos .acciones-bajo-prohibidos[b-12qz6djty6] {
    width: var(--ancho-prohibidos);
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 20px;
}

/* === Estado bloqueado (sorteo cerrado) === */
.bloqueado[b-12qz6djty6] {
    opacity: 0.6;
    pointer-events: none;
    transition: opacity 0.3s ease;
    position: relative;
}

    .bloqueado[b-12qz6djty6]::after {
        content: "SORTEO CERRADO";
        position: absolute;
        top: 40%;
        left: 0;
        right: 0;
        text-align: center;
        font-weight: bold;
        font-size: 1.1rem;
        color: #b40000;
        background: rgba(255,255,255,0.85);
        border: 2px solid #b40000;
        border-radius: 8px;
        padding: 8px;
        width: 60%;
        margin: 0 auto;
        box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    }

/* ===== MODAL VER LISTA (escala dinámica) ===== */
.modal-overlay[b-12qz6djty6] {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0,0,0,.45);
    z-index: 99998 !important;
}

.modal-lista[b-12qz6djty6] {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 96vw !important;
    height: 90vh !important;
    background: #eaf3fb;
    border: 1px solid #b6d0e8;
    border-radius: 10px;
    padding: 10px 12px;
    padding-top: 0px;
    box-shadow: 0 10px 30px rgba(0,0,0,.25);
    z-index: 99999 !important;
    box-sizing: border-box;
    /* 🔹 ANTES: overflow: hidden !important; */
    overflow-y: auto !important; /* scroll vertical si hace falta */
    overflow-x: hidden !important; /* evitamos scroll horizontal feo */
}


body.modal-open[b-12qz6djty6] {
    overflow: hidden !important;
}

.modal-close[b-12qz6djty6] {
    border: none;
    background: #ffeded;
    color: #b40000;
    cursor: pointer;
    width: 30px;
    height: 30px;
    border-radius: 6px;
    font-size: 20px;
    position: absolute;
    top: 10px;
    right: 12px;
    z-index: 2;
}

    .modal-close:hover[b-12qz6djty6] {
        background: #ffd6d6;
    }

/* CONTENEDOR ÚNICO DEL CONTENIDO DE LA LISTA */
#listaCanvas[b-12qz6djty6] {
    width: 100%;
    height: 100%;
    padding: 10px 20px 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center; /* centrado horizontal */
    justify-content: flex-start; /* contenido pegado arriba, no al centro */
}

#contentLista[b-12qz6djty6] {
    display: inline-block; /* que mida según su tabla, no que se estire raro */
}


/* ============================
   🧱 ESTRUCTURA MODO NORMAL
   ============================ */
.lista-unica-normal[b-12qz6djty6] {
    width: 100%;
    max-width: 1150px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 0;
}

/* ============================
   🧱 ESTRUCTURA MODO REVENTADO
   ============================ */
.lista-unica-rev[b-12qz6djty6] {
    width: 100%;
    max-width: 1350px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 0;
}

/* === TÍTULO Y FECHA === */
.fila-titulo[b-12qz6djty6] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.titulo-sorteo-modal[b-12qz6djty6] {
    font-weight: 900;
    font-size: 1.6rem;
    color: #c68200;
}

.fecha-modal[b-12qz6djty6] {
    font-weight: 700;
    font-size: 1rem;
    color: #255;
}

/* === TOTALES GENERALES (arriba) === */
.fila-totales-normal[b-12qz6djty6],
.fila-totales-rev[b-12qz6djty6] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
    margin-bottom: 6px;
}

    .fila-totales-normal .label[b-12qz6djty6],
    .fila-totales-rev .label[b-12qz6djty6] {
        font-weight: 900;
        font-size: 0.95rem;
        color: #04192e;
    }

    .fila-totales-normal .valor[b-12qz6djty6],
    .fila-totales-rev .valor[b-12qz6djty6] {
        font-weight: 900;
        font-size: 0.95rem;
        color: #b31523;
    }

    .fila-totales-rev .sep[b-12qz6djty6] {
        margin: 0 6px;
        opacity: .6;
    }

/* ============================
   🧮 REJILLA PRINCIPAL
   ============================ */

/* Modo NORMAL: 5 bloques (N° + Monto) = 10 columnas */
.lista-unica-normal .fila-cabecera[b-12qz6djty6],
.lista-unica-normal .fila-numeros[b-12qz6djty6],
.lista-unica-normal .fila-totales-f[b-12qz6djty6] {
    display: grid;
    grid-template-columns: repeat(5, 64px 95px);
    column-gap: 4px;
    row-gap: 4px;
    justify-content: center;
}

/* Modo REVENTADO: 5 bloques (N° + Monto + R) = 15 columnas */
.lista-unica-rev .fila-cabecera[b-12qz6djty6],
.lista-unica-rev .fila-numeros[b-12qz6djty6],
.lista-unica-rev .fila-totales-f-rev[b-12qz6djty6] {
    display: grid;
    grid-template-columns: repeat(5, 64px 95px 95px);
    column-gap: 4px;
    row-gap: 4px;
    justify-content: center;
}

/* ============================
   🎨 CABECERAS (Actualizadas)
   ============================ */

/* 🔵 CABECERA N° */
.h-num[b-12qz6djty6] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #0d6efd; /* azul fuerte */
    color: white;
    font-size: 11px;
    font-weight: 900;
    border-radius: 6px;
    border: 1px solid #0a58ca;
    height: 22px;
    box-sizing: border-box;
}

/* 🟢 CABECERA MONTO */
.h-monto[b-12qz6djty6] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #3CB371; /* verde fuerte */
    color: white;
    font-size: 11px;
    font-weight: 900;
    border-radius: 6px;
    border: 1px solid #2e8b57;
    height: 22px;
    box-sizing: border-box;
}

/* 🔴 CABECERA REVENTADO (R) */
.h-monto-rev[b-12qz6djty6] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #E74C3C; /* rojo fuerte */
    color: white;
    font-size: 11px;
    font-weight: 900;
    border-radius: 6px;
    border: 1px solid #c0392b;
    height: 22px;
    box-sizing: border-box;
}


/* ============================
   🎨 CELDAS (N°, Monto, R)
   ============================ */
.celda-num[b-12qz6djty6],
.celda-monto[b-12qz6djty6],
.celda-monto-rev[b-12qz6djty6] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 800;
    padding: 0 6px;
    border-radius: 10px;
    height: 22px;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Número */
.celda-num[b-12qz6djty6] {
    background: #e4f1fb;
    color: #0a406e;
    border: 1px solid #8db7d8;
}

/* Monto normal */
.celda-monto[b-12qz6djty6] {
    background: #e9f7ef;
    color: #0a5c38;
    border: 1px solid #8cc7a9;
}

/* Monto reventado */
.celda-monto-rev[b-12qz6djty6] {
    background: #faecec;
    color: #b02222;
    border: 1px solid #d3a3a3;
}

/* Números prohibidos en rojo */
.celda-num.prohibido[b-12qz6djty6] {
    color: #d32f2f;
    font-size: 14px;
}

/* ============================================================
   🟦 TOTALES F1..F5 — MODO NORMAL (5 columnas x 2 = 10 celdas)
   Alineado EXACTO como las filas de números
   ============================================================ */
.fila-totales-f[b-12qz6djty6] {
    display: grid;
    grid-template-columns: repeat(10, 1fr); /* 5 pares (label + monto) */
    gap: 4px;
    margin-top: 4px;
}

    .fila-totales-f .label[b-12qz6djty6],
    .fila-totales-f .valor[b-12qz6djty6] {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 26px;
        font-size: 14px;
        font-weight: 950;
        border-radius: 6px;
        box-sizing: border-box;
        padding: 0 6px;
    }

    /* 🔵 Label: "Total F1", "Total F2"... */
    .fila-totales-f .label[b-12qz6djty6] {
        background: #eaf8ff; /* azul clarito */
        color: #0c6aa6; /* azul más fuerte */
        border: 1px dashed #0c6aa6; /* borde punteado */
        white-space: nowrap; /* 👉 evita que se parta en dos líneas */
    }

    /* 🟢 Monto normal */
    .fila-totales-f .valor[b-12qz6djty6] {
        background: #f1fff5; /* verde muy suave */
        color: #0f7a3a; /* verde más fuerte */
        border: 1px dashed #0f7a3a; /* borde punteado */
    }

/* ============================================================
   🔴 TOTALES F1..F5 — MODO REVENTADO (5 columnas x 3 = 15 celdas)
   (Label + Monto Normal + Monto R)
   ============================================================ */
.fila-totales-f-rev[b-12qz6djty6] {
    display: grid;
    grid-template-columns: repeat(15, 1fr); /* 5 grupos x 3 columnas */
    gap: 4px;
    margin-top: 4px;
}

    .fila-totales-f-rev .label[b-12qz6djty6],
    .fila-totales-f-rev .valor-normal[b-12qz6djty6],
    .fila-totales-f-rev .valor-rev[b-12qz6djty6] {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 26px;
        font-size: 14px;
        font-weight: 950;
        border-radius: 6px;
        box-sizing: border-box;
        padding: 0 6px;
    }

    /* 🔵 Label */
    .fila-totales-f-rev .label[b-12qz6djty6] {
        background: #eaf8ff;
        color: #0c6aa6;
        border: 1px dashed #0c6aa6;
        white-space: nowrap; /* 👉 igual: sin salto de línea */
    }

    /* 🟢 Monto normal */
    .fila-totales-f-rev .valor-normal[b-12qz6djty6] {
        background: #f1fff5;
        color: #0f7a3a;
        border: 1px dashed #0f7a3a;
    }

    /* 🔴 Monto reventado */
    .fila-totales-f-rev .valor-rev[b-12qz6djty6] {
        background: #fff5f5;
        color: #c62828;
        border: 1px dashed #c62828;
    }


/* Asegurar que nada se desborde raro */
#listaCanvas > div[b-12qz6djty6] {
    min-width: 0;
    min-height: 0;
}

/* === Popup de error de venta (centrado en la pantalla) === */
.venta-modal-backdrop[b-12qz6djty6] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999999;
}

.venta-modal[b-12qz6djty6] {
    background: #ffffff;
    border-radius: 14px;
    padding: 18px 22px 20px;
    max-width: 420px;
    width: 90%;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.35);
    animation: ventaModalIn-b-12qz6djty6 0.18s ease-out;
    text-align: left;
}

    .venta-modal h3[b-12qz6djty6] {
        margin: 0 0 10px 0;
        font-size: 1.15rem;
        font-weight: 800;
        color: #c62828;
    }

    .venta-modal p[b-12qz6djty6] {
        margin: 0 0 18px 0;
        line-height: 1.4;
        font-size: 0.95rem;
        white-space: pre-line;
        color: #333;
    }

    .venta-modal .btn.ok[b-12qz6djty6] {
        width: 100%;
        font-weight: 600;
    }

@keyframes ventaModalIn-b-12qz6djty6 {
    from {
        opacity: 0;
        transform: translateY(10px) scale(0.97);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.ventas-encabezado[b-12qz6djty6] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.fecha-venta-box[b-12qz6djty6] {
    min-width: 240px;
    background: #eef6ff;
    border: 1px solid #cfe0f5;
    border-radius: 12px;
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fv-titulo[b-12qz6djty6] {
    font-weight: 900;
    color: #153e75;
}

.fv-date[b-12qz6djty6] {
    height: 40px;
    border: 1px solid #cfe0f5;
    border-radius: 10px;
    padding: 6px 10px;
    font-weight: 800;
    color: #153e75;
    background: #fff;
}

.fv-hoy[b-12qz6djty6] {
    height: 36px;
    border-radius: 10px;
    border: 1px solid #cfe0f5;
    background: #fff;
    font-weight: 800;
    cursor: pointer;
}

/* ✅ FECHA GRANDE (igual a Restricciones) */
.fv-xl[b-12qz6djty6] {
    height: 56px !important;
    padding: 10px 14px !important;
    font-size: 1.35rem !important;
    font-weight: 900 !important;
    color: #153e75 !important;
    border: 1px solid #cfe0f5 !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.06) !important;
    box-sizing: border-box !important;
    line-height: 1.2 !important;
}

    /* ✅ Chrome/Edge: agranda el texto visible interno del date */
    .fv-xl[b-12qz6djty6]::-webkit-datetime-edit {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

    .fv-xl[b-12qz6djty6]::-webkit-datetime-edit-day-field,
    .fv-xl[b-12qz6djty6]::-webkit-datetime-edit-month-field,
    .fv-xl[b-12qz6djty6]::-webkit-datetime-edit-year-field {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

    .fv-xl[b-12qz6djty6]::-webkit-datetime-edit-text {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

    /* Icono calendario nativo */
    .fv-xl[b-12qz6djty6]::-webkit-calendar-picker-indicator {
        cursor: pointer;
        opacity: .80;
    }

/* ==========================================================
   FIX ENCABEZADO TIEMPOS (igual a Parley)
   ========================================================== */

.ventas-encabezado[b-12qz6djty6] {
    display: flex;
    align-items: center; /* en vez de flex-end / flex-start */
    justify-content: space-between;
    gap: 14px;
    padding: 12px 22px; /* banner más compacto */
}

/* El centro ya NO debe ser absoluto */
.fecha-centro[b-12qz6djty6] {
    position: static !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    margin: 0 auto; /* queda centrado dentro del banner */
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
}

/* Caja derecha en una sola fila como Parley */
.fecha-venta-box[b-12qz6djty6] {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    width: fit-content !important;
    min-width: 0 !important;
    padding: 10px 12px !important;
}

/* Botón Hoy alto igual al date */
.fv-hoy[b-12qz6djty6] {
    height: 56px !important;
    padding: 0 14px !important;
}


/* ==========================================================
   ✅ MEJORA PANEL NOTICIAS (NO CAMBIA TAMAÑO / NO MUEVE NADA)
   - Solo visual + animación suave + mejor lectura con muchas noticias
   - Pegar al FINAL del CSS
   ========================================================== */

/* Suaviza el scroll (ya lo tienes, pero aseguramos consistencia) */
.panel-noticias .noticias-scroll[b-12qz6djty6] {
    scroll-behavior: smooth;
}

/* Animación de entrada suave (sin afectar layout) */
@keyframes noticiaInSoft-b-12qz6djty6 {
    from {
        opacity: 0;
        transform: translateY(6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Tarjeta: mejora sombra/borde y entrada */
.panel-noticias .noticia-card[b-12qz6djty6] {
    position: relative;
    animation: noticiaInSoft-b-12qz6djty6 .22s ease-out both;
    border-color: rgba(13, 71, 161, 0.15); /* azul suave */
    box-shadow: 0 3px 10px rgba(0,0,0,0.04);
    transition: transform .15s ease, box-shadow .18s ease, border-color .18s ease;
    will-change: transform;
}

    /* Hover elegante */
    .panel-noticias .noticia-card:hover[b-12qz6djty6] {
        transform: translateY(-2px);
        box-shadow: 0 10px 22px rgba(0,0,0,0.10);
        border-color: rgba(30, 136, 229, 0.28);
    }

    /* NO leídas: línea lateral azul (sin mover el contenido) */
    .panel-noticias .noticia-card:not(.noticia-leida)[b-12qz6djty6]::before {
        content: "";
        position: absolute;
        left: 0;
        top: 10px;
        bottom: 10px;
        width: 4px;
        border-radius: 6px;
        background: linear-gradient(180deg, #1e88e5, #90caf9);
    }

/* Leídas: se ven suaves pero legibles */
.panel-noticias .noticia-leida[b-12qz6djty6] {
    opacity: 0.62; /* ya tenías .55; subo un poquito para mejor lectura */
    filter: saturate(0.92);
}

/* Título: un poco más pro y con recorte si es larguísimo */
.panel-noticias .noticia-titulo[b-12qz6djty6] {
    line-height: 1.15;
    letter-spacing: 0.2px;
    max-width: 320px; /* no toca el panel, solo evita que empuje badges */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Contenido: mejor lectura con muchas noticias (sin crecer infinito) */
.panel-noticias .noticia-body[b-12qz6djty6] {
    /* Mantiene tu pre-wrap, pero evita tarjetas gigantes si pegan textos largos */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5; /* muestra 5 líneas */
    overflow: hidden;
}

/* Si quieres que al pasar el mouse se vea completo, descomenta:
.panel-noticias .noticia-card:hover .noticia-body {
    -webkit-line-clamp: unset;
}
*/

/* Badges: más “pill” moderno sin cambiar tamaños */
.panel-noticias .badge[b-12qz6djty6] {
    border: 1px solid rgba(13, 71, 161, 0.12);
    box-shadow: 0 1px 0 rgba(255,255,255,0.6) inset;
}

/* Botones icono: hover más elegante */
.panel-noticias .btn-icono[b-12qz6djty6] {
    transition: transform .12s ease, background .15s ease, box-shadow .15s ease, border-color .15s ease;
}

    .panel-noticias .btn-icono:hover[b-12qz6djty6] {
        transform: translateY(-1px);
        box-shadow: 0 8px 18px rgba(13, 71, 161, 0.10);
        border-color: rgba(30, 136, 229, 0.25);
    }

/* Botón “Marcar leído”: más pro sin cambiar layout */
.panel-noticias .btn-cerrar[b-12qz6djty6] {
    transition: transform .12s ease, background .15s ease, box-shadow .15s ease, border-color .15s ease;
    box-shadow: 0 2px 10px rgba(183, 28, 28, 0.06);
}

    .panel-noticias .btn-cerrar:hover[b-12qz6djty6] {
        transform: translateY(-1px);
        box-shadow: 0 10px 20px rgba(183, 28, 28, 0.10);
    }

/* Respeto accesibilidad: si el sistema pide reducir animaciones */
@media (prefers-reduced-motion: reduce) {
    .panel-noticias .noticia-card[b-12qz6djty6],
    .panel-noticias .btn-icono[b-12qz6djty6],
    .panel-noticias .btn-cerrar[b-12qz6djty6] {
        animation: none !important;
        transition: none !important;
    }
}

/* ==========================================================
   ✅ BORDE MÁS OSCURO EN EL ENCABEZADO (TIEMPOS)
   - Solo refuerza el borde para que se note más
   - No cambia posiciones, tamaños ni lógica
   ========================================================== */

.ventas-encabezado[b-12qz6djty6] {
    border: 2px solid rgba(13, 71, 161, 0.35) !important;
    box-shadow: 0 3px 10px rgba(0,0,0,0.10) !important;
}

/* ==========================================================
   ✅ BADGE DEL JUEGO (TIEMPOS / PARLEY) - MISMO DISEÑO
   Ubicación: debajo del nombre del sorteo y encima de Hora/Falta
   ========================================================== */
.juego-badge[b-12qz6djty6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    padding: 6px 12px;
    border-radius: 999px;
    font-weight: 950;
    font-size: 0.95rem;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    line-height: 1;
    margin-top: 4px;
    margin-bottom: 6px;
    box-shadow: 0 6px 14px rgba(0,0,0,0.08);
}

    /* TIEMPOS: azul suave */
    .juego-badge.tiempos[b-12qz6djty6] {
        background: linear-gradient(180deg, #e8f2ff, #d7e9ff);
        border: 1px solid #9cc6ff;
        color: #0b3a7a;
    }

/* ===== Edición inline SIN deformar filas ===== */
.celda[b-12qz6djty6] {
    position: relative;
}

.edit-inline[b-12qz6djty6] {
    position: absolute;
    inset: 2px;
    width: calc(100% - 4px);
    height: calc(100% - 4px);
    box-sizing: border-box;
    border: 2px solid #111;
    border-radius: 10px;
    background: transparent;
    font: inherit;
    color: inherit;
    text-align: center;
    padding: 0;
    outline: none;
    z-index: 5;
    pointer-events: auto;
}

/* selección bonita cuando solo está enfocada la celda (sin editar) */
.fila-item:focus[b-12qz6djty6],
.celda:focus[b-12qz6djty6] {
    outline: none;
}

.celda:focus[b-12qz6djty6] {
    border-radius: 10px;
    box-shadow: 0 0 0 2px rgba(0,0,0,.25);
}

/* ==========================================================
   ✅ BOTÓN: AGRUPA MONTOS (toggle ON/OFF)
   - No toca estilos existentes de .btn-secundario
   ========================================================== */
.btn-agrupar-montos[b-12qz6djty6] {
    position: relative;
    font-weight: 900;
    border-width: 2px;
    transition: transform .12s ease, box-shadow .18s ease, filter .18s ease;
}

    .btn-agrupar-montos:hover[b-12qz6djty6] {
        transform: translateY(-1px);
    }

    .btn-agrupar-montos.on[b-12qz6djty6] {
        box-shadow: 0 10px 22px rgba(13, 71, 161, 0.18);
        filter: saturate(1.06);
        animation: agruparPulse-b-12qz6djty6 1.15s ease-in-out infinite;
    }

/* Pulso suave para que se note que está activo */
@keyframes agruparPulse-b-12qz6djty6 {
    0% {
        transform: translateY(0) scale(1);
    }

    50% {
        transform: translateY(-1px) scale(1.03);
    }

    100% {
        transform: translateY(0) scale(1);
    }
}

/* Respeto accesibilidad */
@media (prefers-reduced-motion: reduce) {
    .btn-agrupar-montos[b-12qz6djty6],
    .btn-agrupar-montos.on[b-12qz6djty6] {
        animation: none !important;
        transition: none !important;
    }
}

/* ===========================
   MODAL INFO NÚMERO PROHIBIDO (V2 - MÁS VIVO)
=========================== */

.np-item[b-12qz6djty6] {
    cursor: pointer;
    user-select: none;
    transition: transform .12s ease, box-shadow .18s ease, filter .18s ease;
}

    .np-item:hover[b-12qz6djty6] {
        transform: translateY(-2px);
        filter: brightness(1.03);
        box-shadow: 0 16px 34px rgba(0,0,0,.16);
    }

    .np-item:active[b-12qz6djty6] {
        transform: translateY(0);
        box-shadow: 0 10px 22px rgba(0,0,0,.14);
    }

/* Backdrop más elegante */
.np-modal-backdrop[b-12qz6djty6] {
    position: fixed;
    inset: 0;
    background: radial-gradient(900px 400px at 50% 15%, rgba(90,160,255,.18), transparent 65%), radial-gradient(600px 320px at 15% 80%, rgba(70,230,160,.12), transparent 62%), rgba(8, 10, 14, .66);
    backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
    z-index: 99999;
}

/* Modal “glass” con borde con brillo */
.np-modal[b-12qz6djty6] {
    width: min(610px, 96vw);
    border-radius: 22px;
    overflow: hidden;
    position: relative;
    background: linear-gradient(180deg, rgba(20,26,40,.92), rgba(12,16,26,.90));
    border: 1px solid rgba(255,255,255,.14);
    box-shadow: 0 28px 70px rgba(0,0,0,.52), 0 0 0 1px rgba(120,170,255,.10) inset;
    animation: npPop2-b-12qz6djty6 .18s ease-out;
}

    /* Borde neon suave */
    .np-modal[b-12qz6djty6]::before {
        content: "";
        position: absolute;
        inset: -2px;
        border-radius: 24px;
        background: linear-gradient(120deg, rgba(90,160,255,.55), rgba(70,230,160,.30), rgba(255,180,70,.22));
        opacity: .35;
        filter: blur(18px);
        z-index: 0;
    }

    /* Contenido encima del glow */
    .np-modal > *[b-12qz6djty6] {
        position: relative;
        z-index: 1;
    }

@keyframes npPop2-b-12qz6djty6 {
    from {
        transform: translateY(14px) scale(.985);
        opacity: 0;
    }

    to {
        transform: translateY(0) scale(1);
        opacity: 1;
    }
}

/* Header más “premium” */
.np-modal-header[b-12qz6djty6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 18px;
    background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.03));
    border-bottom: 1px solid rgba(255,255,255,.10);
}

.np-modal-title[b-12qz6djty6] {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 16px;
    font-weight: 900;
    color: #f1f7ff;
}

.np-badge[b-12qz6djty6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 24px;
    padding: 0 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 950;
    letter-spacing: .6px;
    color: #d8ecff;
    background: linear-gradient(180deg, rgba(90,160,255,.25), rgba(60,120,255,.14));
    border: 1px solid rgba(90,160,255,.42);
    box-shadow: 0 10px 22px rgba(40,110,255,.18);
}

/* Botón X más visible */
.np-modal-close[b-12qz6djty6] {
    width: 38px;
    height: 38px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(255,255,255,.07);
    color: #f1f7ff;
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: transform .12s ease, background .16s ease, border-color .16s ease;
}

    .np-modal-close:hover[b-12qz6djty6] {
        background: rgba(255,255,255,.12);
        border-color: rgba(255,255,255,.20);
        transform: rotate(6deg) scale(1.05);
    }

/* Body */
.np-modal-body[b-12qz6djty6] {
    padding: 16px 18px 18px;
}

/* Cards más grandes y claras */
.np-cards[b-12qz6djty6] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

/* Card con barra superior de color */
.np-card[b-12qz6djty6] {
    border-radius: 18px;
    border: 1px solid rgba(255,255,255,.12);
    background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
    padding: 14px 14px 13px;
    box-shadow: 0 14px 30px rgba(0,0,0,.18);
    position: relative;
    overflow: hidden;
}

    /* Barra arriba */
    .np-card[b-12qz6djty6]::before {
        content: "";
        position: absolute;
        left: 12px;
        right: 12px;
        top: 10px;
        height: 3px;
        border-radius: 999px;
        background: linear-gradient(90deg, rgba(90,160,255,.70), rgba(70,230,160,.55), rgba(255,180,70,.45));
        opacity: .75;
    }

/* Label */
.np-card-label[b-12qz6djty6] {
    font-size: 14px;
    color: rgba(241,247,255,.78);
    font-weight: 800;
    margin-top: 8px;
    margin-bottom: 8px;
    letter-spacing: .2px;
}

/* Value mucho más visible */
.np-card-value[b-12qz6djty6] {
    font-size: 26px;
    font-weight: 950;
    color: #ffffff;
    line-height: 1.05;
    text-shadow: 0 10px 26px rgba(0,0,0,.28);
}

.np-num[b-12qz6djty6] {
    letter-spacing: 2px;
}

/* Card “Le cabe” resaltada en verde bonito */
.np-card-ok[b-12qz6djty6] {
    background: radial-gradient(260px 120px at 30% 0%, rgba(70,230,160,.22), transparent 62%), linear-gradient(180deg, rgba(70,230,160,.12), rgba(255,255,255,.03));
    border: 1px solid rgba(70,230,160,.28);
}

    .np-card-ok[b-12qz6djty6]::before {
        background: linear-gradient(90deg, rgba(70,230,160,.95), rgba(90,160,255,.55));
        opacity: .9;
    }

/* Nota (regla) más clara y ordenada */
.np-modal-note[b-12qz6djty6] {
    margin-top: 14px;
    padding: 13px 14px;
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
    border: 1px solid rgba(255,255,255,.10);
    color: rgba(241,247,255,.90);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
}

/* Footer */
.np-modal-footer[b-12qz6djty6] {
    padding: 14px 18px 18px;
    border-top: 1px solid rgba(255,255,255,.10);
    display: flex;
    justify-content: flex-end;
}

/* Botón aceptar más “pro” */
.np-btn-primary[b-12qz6djty6] {
    border: none;
    border-radius: 16px;
    padding: 13px px;
    font-size: 16px;
    font-weight: 950;
    cursor: pointer;
    color: #071018;
    background: linear-gradient(180deg, #6fd0ff, #2f7dff);
    box-shadow: 0 16px 28px rgba(47,125,255,.34), 0 0 0 1px rgba(255,255,255,.20) inset;
    transition: transform .12s ease, filter .16s ease;
}

    .np-btn-primary:hover[b-12qz6djty6] {
        transform: translateY(-2px);
        filter: brightness(1.05);
    }

    .np-btn-primary:active[b-12qz6djty6] {
        transform: translateY(0);
        filter: brightness(.98);
    }

/* Responsive: en pantallas pequeñas las cards se apilan */
@media (max-width: 520px) {
    .np-cards[b-12qz6djty6] {
        grid-template-columns: 1fr;
    }

    .np-modal[b-12qz6djty6] {
        width: min(520px, 96vw);
    }
}

.wa-ticket-img[b-12qz6djty6] {
    width: 100%;
    height: auto;
    max-height: calc(92vh - 130px); /* deja espacio para título + botones */
    object-fit: contain; /* ✅ auto-fit completo */
    display: block;
}

.pos-wa-wrap[b-12qz6djty6] {
    margin-top: 6px;
    display: flex;
    justify-content: center;
}

.pos-wa-icon[b-12qz6djty6] {
    width: 16px; /* ✅ tamaño real pequeño */
    height: 16px;
    display: inline-block;
}

    .pos-wa-icon svg[b-12qz6djty6] {
        width: 16px;
        height: 16px;
        display: block;
    }
.wa-zoom-bar[b-12qz6djty6] {
    display: flex;
    gap: 8px;
    justify-content: center;
    margin: 6px 0 10px 0;
}

    .wa-zoom-bar button[b-12qz6djty6] {
        padding: 6px 10px;
        border-radius: 8px;
        border: 1px solid #cfd6df;
        background: #f7f9fc;
        cursor: pointer;
    }

/* contenedor: sin scroll, pero permite que el scale se vea completo */
.wa-ticket-img[b-12qz6djty6] {
    width: 100%;
    height: auto;
    max-height: calc(92vh - 170px);
    object-fit: contain;
    display: block;
}

/* =========================
   BOTÓN PRO WHATSAPP
========================= */
/* ===== BOTÓN WhatsApp: NO ancho completo, visible y bonito ===== */
.wa-btn2[b-12qz6djty6] {
    /* 🔥 ancho limitado: hasta donde llega "Agrupa Montos" */
    width: fit-content; /* no se estira */
    max-width: 420px; /* límite por si acaso */
    display: inline-flex; /* queda como botón normal */
    align-items: center;
    gap: 10px;
    padding: 11px 14px;
    border-radius: 12px;
    /* borde más visible */
    border: 2px solid rgba(37, 211, 102, .75);
    background: linear-gradient(180deg, rgba(37,211,102,.22), rgba(18,140,126,.12));
    color: #0b2b16; /* texto oscuro para que SI se lea en fondo claro */
    font-weight: 900;
    font-size: 15px;
    line-height: 1;
    box-shadow: 0 10px 22px rgba(0,0,0,.12);
}

    .wa-btn2:hover[b-12qz6djty6] {
        filter: brightness(1.05);
    }

    .wa-btn2:disabled[b-12qz6djty6] {
        opacity: .5;
        cursor: not-allowed;
        filter: none;
    }

/* Icono redondo bonito */
.wa-btn2__icon[b-12qz6djty6] {
    width: 28px;
    height: 28px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.70);
    border: 1px solid rgba(0,0,0,.08);
    flex: 0 0 auto;
}

    .wa-btn2__icon svg[b-12qz6djty6] {
        width: 18px;
        height: 18px;
        display: block;
    }

/* Texto SI visible */
.wa-btn2__text[b-12qz6djty6] {
    white-space: nowrap; /* evita que se parta raro */
}

/* =========================
   MODAL WHATSAPP (NUEVO)
========================= */
.wa2-backdrop[b-12qz6djty6] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.64);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    z-index: 99999;
}

.wa2-modal[b-12qz6djty6] {
    width: min(720px, 96vw);
    background: #0f1420;
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 30px 70px rgba(0,0,0,.65);
}

.wa2-header[b-12qz6djty6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 16px;
    background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0));
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.wa2-title[b-12qz6djty6] {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #fff;
}

.wa2-badge[b-12qz6djty6] {
    width: 44px;
    height: 44px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: rgba(37,211,102,.14);
    border: 1px solid rgba(37,211,102,.25);
    color: #25D366; /* SVG currentColor */
}

    .wa2-badge svg[b-12qz6djty6] {
        width: 22px;
        height: 22px;
        display: block;
    }

.wa2-title__main[b-12qz6djty6] {
    font-weight: 900;
    font-size: 17px;
    line-height: 1.1;
}

.wa2-title__sub[b-12qz6djty6] {
    font-size: 14px;
    opacity: .85;
    margin-top: 2px;
}

.wa2-x[b-12qz6djty6] {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.06);
    color: #fff;
    cursor: pointer;
}

    .wa2-x:hover[b-12qz6djty6] {
        filter: brightness(1.1);
    }

.wa2-body[b-12qz6djty6] {
    padding: 16px;
}

.wa2-grid[b-12qz6djty6] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

@media (max-width: 640px) {
    .wa2-grid[b-12qz6djty6] {
        grid-template-columns: 1fr;
    }
}

.wa2-field[b-12qz6djty6] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.wa2-label[b-12qz6djty6] {
    font-size: 14px;
    opacity: .85;
    color: #dfe7ff;
}

.wa2-input[b-12qz6djty6], .wa2-select[b-12qz6djty6] {
    width: 100%;
    padding: 12px 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.06);
    color: #fff;
    outline: none;
}

    .wa2-input[b-12qz6djty6]::placeholder {
        color: rgba(255,255,255,.55);
    }

.wa2-actions[b-12qz6djty6] {
    margin-top: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.wa2-actions__right[b-12qz6djty6] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.wa2-btn[b-12qz6djty6] {
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.06);
    color: #fff;
    cursor: pointer;
    font-weight: 800;
}

    .wa2-btn:hover[b-12qz6djty6] {
        filter: brightness(1.08);
    }

.wa2-btn--ghost[b-12qz6djty6] {
    background: transparent;
}

.wa2-btn--soft[b-12qz6djty6] {
    background: rgba(37,211,102,.10);
    border-color: rgba(37,211,102,.22);
}

.wa2-btn--primary[b-12qz6djty6] {
    background: linear-gradient(180deg, rgba(37,211,102,.35), rgba(18,140,126,.25));
    border-color: rgba(37,211,102,.35);
}

.wa2-note[b-12qz6djty6] {
    margin-top: 12px;
    padding: 12px 12px;
    border-radius: 14px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.10);
    color: #e8f0ff;
    font-size: 14px;
    line-height: 1.35;
}

.venta-alert-backdrop[b-12qz6djty6] {
    position: fixed;
    inset: 0;
    background: rgba(7, 18, 35, 0.62);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    padding: 18px;
    animation: ventaAlertFadeIn-b-12qz6djty6 .18s ease-out;
}

.venta-alert-modal[b-12qz6djty6] {
    width: min(650px, 96vw);
    max-height: 88vh;
    overflow: auto;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    border-radius: 24px;
    border: 1px solid rgba(24, 76, 150, 0.16);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.28);
    padding: 22px 22px 18px 22px;
    animation: ventaAlertPopIn-b-12qz6djty6 .20s ease-out;
}

.venta-alert-top[b-12qz6djty6] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
}

.venta-alert-icon-wrap[b-12qz6djty6] {
    flex: 0 0 auto;
}

.venta-alert-icon[b-12qz6djty6] {
    width: 58px;
    height: 58px;
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    font-weight: 900;
    color: #fff;
    background: linear-gradient(180deg, #ff7b54 0%, #e3442f 100%);
    box-shadow: 0 12px 26px rgba(227, 68, 47, 0.35);
}

.venta-alert-head[b-12qz6djty6] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.venta-alert-badge[b-12qz6djty6] {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 5px 10px;
    border-radius: 999px;
    background: #eef4ff;
    color: #24539b;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .2px;
}

.venta-alert-title[b-12qz6djty6] {
    margin: 0;
    font-size: 1.45rem;
    line-height: 1.15;
    color: #132a4c;
    font-weight: 900;
}

.venta-alert-body[b-12qz6djty6] {
    background: #ffffff;
    border: 1px solid rgba(26, 84, 162, 0.12);
    border-radius: 18px;
    padding: 16px 16px 14px 16px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
}

.venta-alert-message[b-12qz6djty6] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.venta-alert-line[b-12qz6djty6] {
    color: #20334d;
    font-size: 1.02rem;
    line-height: 1.5;
    font-weight: 600;
    white-space: pre-wrap;
    word-break: break-word;
}

.venta-alert-sep[b-12qz6djty6] {
    height: 8px;
}

.venta-alert-actions[b-12qz6djty6] {
    display: flex;
    justify-content: flex-end;
    margin-top: 18px;
}

.venta-alert-btn[b-12qz6djty6] {
    min-width: 160px;
    height: 48px;
    border: none;
    border-radius: 16px;
    padding: 0 22px;
    cursor: pointer;
    font-size: 1rem;
    font-weight: 900;
    color: #fff;
    background: linear-gradient(180deg, #1f69d8 0%, #154fa9 100%);
    box-shadow: 0 14px 28px rgba(21, 79, 169, 0.28);
    transition: transform .10s ease, box-shadow .10s ease, filter .10s ease;
}

    .venta-alert-btn:hover[b-12qz6djty6] {
        filter: brightness(1.03);
        box-shadow: 0 16px 30px rgba(21, 79, 169, 0.32);
    }

    .venta-alert-btn:active[b-12qz6djty6] {
        transform: translateY(1px);
    }

    .venta-alert-btn:focus[b-12qz6djty6] {
        outline: none;
        box-shadow: 0 0 0 4px rgba(38, 113, 219, 0.18), 0 16px 30px rgba(21, 79, 169, 0.32);
    }

@keyframes ventaAlertFadeIn-b-12qz6djty6 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes ventaAlertPopIn-b-12qz6djty6 {
    from {
        opacity: 0;
        transform: translateY(10px) scale(.98);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@media (max-width: 640px) {
    .venta-alert-modal[b-12qz6djty6] {
        width: min(96vw, 96vw);
        border-radius: 20px;
        padding: 18px 16px 16px 16px;
    }

    .venta-alert-top[b-12qz6djty6] {
        align-items: flex-start;
        gap: 12px;
    }

    .venta-alert-icon[b-12qz6djty6] {
        width: 50px;
        height: 50px;
        font-size: 26px;
        border-radius: 16px;
    }

    .venta-alert-title[b-12qz6djty6] {
        font-size: 1.20rem;
    }

    .venta-alert-line[b-12qz6djty6] {
        font-size: .96rem;
        line-height: 1.45;
    }

    .venta-alert-actions[b-12qz6djty6] {
        margin-top: 16px;
    }

    .venta-alert-btn[b-12qz6djty6] {
        width: 100%;
        min-width: 0;
    }
}

/* ===== Rifas: panel premio (donde iban prohibidos) ===== */
.col-prohibidos .rifa-premio-panel[b-12qz6djty6] {
    width: var(--ancho-prohibidos);
    align-self: flex-start;
    background: linear-gradient(160deg, #fff9f2 0%, #f0f7ff 55%, #ffffff 100%);
    border-radius: 12px;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.08);
    padding: 22px 26px 20px;
    border: 2px solid #2563eb;
    text-align: center;
    margin-bottom: 14px;
    min-height: 120px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.rifa-premio-icon[b-12qz6djty6] {
    font-size: 2rem;
    line-height: 1;
    margin-bottom: 2px;
}

.rifa-premio-titulo[b-12qz6djty6] {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 800;
    color: #1d4ed8;
    letter-spacing: 0.02em;
}

.rifa-premio-desc[b-12qz6djty6] {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 800;
    color: #0f2744;
    line-height: 1.35;
    word-break: break-word;
}

.rifa-titulo-bloque[b-12qz6djty6] {
    min-width: 280px;
}

.rifa-sorteo-sub[b-12qz6djty6] {
    margin-top: 4px;
}

.rifa-sorteo-nombre[b-12qz6djty6] {
    font-size: 1.12rem !important;
    font-weight: 800 !important;
}

.rifa-lista-modal-head[b-12qz6djty6] {
    display: grid;
    grid-template-columns: repeat(10, 1fr);
}
/* _content/SistemaLoteriaDashboard/Components/Ventas/VentasTiempos.razor.rz.scp.css */

/* ==========================================================
   🧩 LAYOUT PRINCIPAL
   ========================================================== */
.ventas-contenido[b-610qae6d9r] {
    display: flex;
    align-items: flex-start;
    gap: 24px;
    padding: 0 20px;
    width: 100%;
    box-sizing: border-box;
    margin-top: 12px;
    /* 🔒 Que TODO sea una sola fila */
    flex-wrap: nowrap;
    /* 📜 Si no cabe con mucho zoom, scroll horizontal */
    overflow-x: auto;
}

.ventas-izquierda[b-610qae6d9r] {
    flex: 0 0 auto; /* ya tienes min/max-width, así no se deforma */
}

.col-prohibidos[b-610qae6d9r] {
    flex: 0 0 auto;
}

.panel-noticias[b-610qae6d9r] {
    flex: 0 0 520px; /* mismo ancho que ya usas */
}


/* ==========================================================
   🧩 PANEL IZQUIERDO (VENTAS)
   ========================================================== */
.ventas-izquierda[b-610qae6d9r] {
    flex: 1;
    min-width: 400px;
    max-width: 700px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    background: #fff;
    border: 2px solid #e0e0e0;
    border-radius: 10px;
    padding: 15px;
    box-sizing: border-box;
    min-height: 300px;
    margin: 0;
}

/* ====== LISTA (contenedor con scroll) ====== */
.ventas-lista[b-610qae6d9r] {
    position: relative;
    border: 2px solid #e0e6f1;
    border-radius: 8px;
    background: #fff;
    max-height: 420px;
    overflow-y: auto;
    overflow-x: hidden;
    scroll-behavior: smooth;
    scrollbar-gutter: stable;
    padding: 0;
}

/* ====== LISTA: el grid lo usan las filas (no el contenedor) ====== */
.tabla-lista[b-610qae6d9r] {
    display: block;
    width: 100%;
    margin: 0 auto;
}

/* ====== FILA CABECERA y FILA ITEM: aquí vive el grid real ====== */
.fila-cabecera[b-610qae6d9r],
.fila-item[b-610qae6d9r] {
    display: grid;
    grid-template-columns: 120px 170px 56px;
    width: 100%;
    justify-content: center;
    align-items: center;
}

/* Modo BASE con reventado */
.tabla-lista.reventado .fila-cabecera[b-610qae6d9r],
.tabla-lista.reventado .fila-item[b-610qae6d9r] {
    grid-template-columns: minmax(90px, 1.1fr) /* Número */
    minmax(120px, 1.4fr) /* Monto */
    minmax(120px, 1.4fr) /* Monto R */
    minmax(40px, 0.6fr); /* X */
}


/* ====== CELDAS ====== */
.celda[b-610qae6d9r] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    text-align: right;
    padding: 10px 12px;
    min-height: 44px;
    font-weight: 800;
    font-size: 20px;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
    border-bottom: 1px solid #e6ecf6;
}

    /* CABECERA (títulos centrados y más grandes) */
    .celda.titulo[b-610qae6d9r] {
        position: sticky;
        top: 0;
        z-index: 10;
        background: #f7f9fc;
        border-bottom: 2px solid #e0e6f1;
        box-shadow: 0 1px 0 #e0e6f1;
        text-align: center;
        justify-content: center;
        align-items: center;
        font-weight: 900;
        font-size: 22px;
        color: #1c2b4d;
        height: 48px;
    }

        /* La celda de cabecera de la columna de la X (vacía pero sticky) */
        .celda.titulo.th-x[b-610qae6d9r] {
            background: #f7f9fc;
            pointer-events: none;
        }

/* Celdas normales (centradas igual) */
.celda[b-610qae6d9r],
.fila-item .numero[b-610qae6d9r],
.fila-item .monto[b-610qae6d9r] {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 800;
    font-size: 20px;
    height: 48px;
}

/* Guion perfectamente centrado entre Número y Monto */
.fila-item .celda.numero[b-610qae6d9r]::after {
    content: "–";
    color: #76acfe;
    font-weight: 600;
    font-size: 20px;
    position: relative;
    left: 65%;
    transform: translateX(-50%);
    top: 25%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

/* ========== BOTÓN ELIMINAR (moderno y elegante) ========== */
.btn-eliminar[b-610qae6d9r] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 10px;
    background: linear-gradient(180deg,#ff5c5c,#d93636);
    box-shadow: 0 6px 14px rgba(217,54,54,.25), inset 0 1px 0 rgba(255,255,255,.28);
    cursor: pointer;
    padding: 0;
    font-size: 0;
    line-height: 1;
    margin: auto;
    z-index: 1;
    transition: transform .12s ease, box-shadow .18s ease, filter .18s ease, background .18s ease;
}

    .btn-eliminar[b-610qae6d9r]::before,
    .btn-eliminar[b-610qae6d9r]::after {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        width: 14px;
        height: 2px;
        background: #fff;
        border-radius: 2px;
        transform-origin: center;
        box-shadow: 0 0 1px rgba(0,0,0,.25);
    }

    .btn-eliminar[b-610qae6d9r]::before {
        transform: translate(-50%,-50%) rotate(45deg);
    }

    .btn-eliminar[b-610qae6d9r]::after {
        transform: translate(-50%,-50%) rotate(-45deg);
    }

    .btn-eliminar:hover[b-610qae6d9r] {
        transform: translateY(-1px) scale(1.03);
        filter: saturate(1.06);
        box-shadow: 0 10px 20px rgba(217,54,54,.28), inset 0 1px 0 rgba(255,255,255,.32);
    }

    .btn-eliminar:active[b-610qae6d9r] {
        transform: translateY(0) scale(.97);
        box-shadow: 0 4px 10px rgba(217,54,54,.22), inset 0 1px 0 rgba(255,255,255,.24);
    }

    .btn-eliminar:focus-visible[b-610qae6d9r] {
        outline: 3px solid rgba(25,118,210,.35);
        outline-offset: 2px;
        box-shadow: 0 0 0 4px rgba(25,118,210,.15), 0 8px 18px rgba(217,54,54,.25), inset 0 1px 0 rgba(255,255,255,.28);
    }

@media (prefers-reduced-motion: reduce) {
    .btn-eliminar[b-610qae6d9r] {
        transition: none;
    }
}

/* ====== SEPARADOR ====== */
.separador[b-610qae6d9r] {
    border: none;
    border-top: 2px solid #d9e0ef;
    margin: 8px 0;
}

/* ====== CAMPOS DE ENTRADA ====== */
.input-linea[b-610qae6d9r] {
    display: flex;
    gap: 10px;
    margin: 10px 0;
    justify-content: center;
    /* 👇 NUEVO: si con 3 cajas no cabe, que hagan otra fila
       en vez de salirse del panel al hacer zoom */
    flex-wrap: wrap;
    max-width: 100%;
}

.input-pequeno[b-610qae6d9r] {
    padding: 12px;
    font-size: 24px;
    font-weight: 800;
    border: 2px solid #ccc;
    border-radius: 8px;
    text-align: center;
    transition: .2s;
    /* 👇 NUEVO: ancho base, pero puede encogerse si hace falta */
    flex: 1 1 120px;
    max-width: 210px;
}

    .input-pequeno:focus[b-610qae6d9r] {
        border-color: #1e88e5;
        box-shadow: 0 0 5px rgba(30,136,229,.4);
        outline: none;
    }

.monto-corto[b-610qae6d9r] {
    width: 120px;
}

.numero-corto[b-610qae6d9r] {
    width: 120px;
}

/* ====== BOTÓN GUARDAR / IMPRIMIR ====== */
.btn-guardar[b-610qae6d9r] {
    background: linear-gradient(90deg,#1976d2,#1e88e5);
    color: #fff;
    border: none;
    border-radius: 10px;
    padding: 12px 22px;
    cursor: pointer;
    font-weight: 800;
    font-size: 16px;
    transition: .2s;
}

    .btn-guardar:hover[b-610qae6d9r] {
        background: linear-gradient(90deg,#1565c0,#1976d2);
    }

/* ====== TOTAL ====== */
.total[b-610qae6d9r] {
    font-size: 22px;
    font-weight: 800;
    text-align: right;
    color: #003c8f;
    margin-top: 10px;
}

@media (max-width:520px) {
    .tabla-lista[b-610qae6d9r] {
        grid-template-columns: 100px 140px 46px;
    }

        .tabla-lista.reventado[b-610qae6d9r] {
            grid-template-columns: minmax(70px, 1.1fr) /* N° */
            minmax(90px, 1.3fr) /* Monto */
            minmax(90px, 1.3fr) /* Monto R */
            minmax(34px, 0.5fr); /* X */
        }


    .celda[b-610qae6d9r] {
        font-size: 18px;
    }
}

/* ===== Panel de Números Prohibidos con título rojo, fecha y ajuste dinámico ===== */
.numeros-prohibidos-panel[b-610qae6d9r] {
    max-width: 620px;
    align-self: flex-start;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.1);
    padding: 16px 24px;
    border: 2px solid #c62828;
    text-align: center;
    display: block;
    box-sizing: border-box;
    transition: all 0.3s ease;
    width: 100%;
    height: auto;
    min-width: 0;
    overflow: hidden;
}

    .numeros-prohibidos-panel h4[b-610qae6d9r] {
        color: #c62828;
        font-weight: 800;
        font-size: 1.45em;
        margin: 0 0 8px 0;
    }

.np-fecha[b-610qae6d9r] {
    font-size: 1.1em;
    font-weight: 700;
    color: #333;
    margin-top: 2px;
    margin-bottom: 10px;
    text-transform: capitalize;
}

.numeros-prohibidos[b-610qae6d9r] {
    list-style: none;
    padding: 0;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(11, minmax(0, 1fr));
    gap: 8px;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    justify-content: stretch;
}
    .numeros-prohibidos li[b-610qae6d9r] {
        color: #e53935;
        font-weight: 700;
        background: #ffebee;
        padding: 7px 4px;
        border-radius: 8px;
        min-width: 0;
        text-align: center;
        font-size: 1.12em;
        transition: transform 0.2s ease, background 0.2s ease;
    }

        .numeros-prohibidos li:hover[b-610qae6d9r] {
            background: #ffcdd2;
            transform: scale(1.08);
        }

/* ==========================================================
   🧩 ENCABEZADO
   ========================================================== */
.ventas-encabezado[b-610qae6d9r] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding: 15px 25px 25px;
    background: linear-gradient(90deg, #f7f9fb, #e3f2fd);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    margin: 10px 20px 0;
}

.titulo-sorteo[b-610qae6d9r] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    position: relative;
}

.sorteo-selector-titulo[b-610qae6d9r] {
    position: relative;
    cursor: pointer;
    user-select: none;
    display: inline-block;
}

.sorteo-nombre[b-610qae6d9r] {
    font-size: 2.2em;
    font-weight: 800;
    color: #004aad;
    letter-spacing: 1px;
    margin: 0;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.15);
    animation: colorCambio-b-610qae6d9r 4s linear infinite;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: transform 0.2s ease;
}

    .sorteo-nombre:hover[b-610qae6d9r] {
        transform: scale(1.02);
    }

.flecha[b-610qae6d9r] {
    font-size: 0.6em;
    margin-left: 6px;
    transition: transform 0.3s ease;
}

.sorteo-selector-titulo:hover .flecha[b-610qae6d9r] {
    transform: rotate(180deg);
}

.menu-sorteos[b-610qae6d9r] {
    position: absolute;
    top: 100%;
    left: 0;
    transform: none;
    width: 220px;
    background: #ffffff;
    border: 2px solid #cfd8dc;
    border-radius: 10px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
    margin-top: 8px;
    padding: 6px 0;
    list-style: none;
    z-index: 20;
    animation: aparecerMenu-b-610qae6d9r 0.2s ease-out forwards;
    max-height: min(60vh, 360px);
    overflow-y: auto;
    overflow-x: hidden;
}

    .menu-sorteos li[b-610qae6d9r] {
        font-weight: 700;
        color: #0d47a1;
        font-size: 1.1em;
        padding: 10px 16px;
        text-align: center;
        transition: all 0.2s ease;
        border-radius: 6px;
    }

        .menu-sorteos li:hover[b-610qae6d9r] {
            background: #e3f2fd;
            color: #003c8f;
            transform: scale(1.03);
        }

        .menu-sorteos li.activo[b-610qae6d9r] {
            background: #bbdefb;
            color: #0d47a1;
        }

@keyframes aparecerMenu-b-610qae6d9r {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes colorCambio-b-610qae6d9r {
    0% {
        color: #e53935;
    }

    25% {
        color: #f9a825;
    }

    50% {
        color: #1e88e5;
    }

    75% {
        color: #43a047;
    }

    100% {
        color: #e53935;
    }
}

.hora-info[b-610qae6d9r] {
    font-size: 1.05em;
    color: #0d47a1;
    font-weight: 600;
}

    .hora-info strong[b-610qae6d9r] {
        color: #1a237e;
    }

.hora-numero[b-610qae6d9r] {
    font-size: 1.4em;
    font-weight: 700;
    color: #0d47a1;
}


.fecha-texto[b-610qae6d9r] {
    font-size: 1.35em;
    font-weight: 800;
    color: #2c3e50;
    text-transform: capitalize;
}

.hora-texto[b-610qae6d9r] {
    font-size: 1.15em;
    font-weight: 700;
    color: #1565c0;
    letter-spacing: 1px;
}

/* ==========================================================
   🧩 BOTONES SECUNDARIOS
   ========================================================== */
.acciones-internas[b-610qae6d9r] {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 15px;
}

.btn-secundario[b-610qae6d9r] {
    background: linear-gradient(90deg, #e3f2fd, #bbdefb);
    color: #0d47a1;
    border: 1px solid #64b5f6;
    border-radius: 8px;
    padding: 8px 14px;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.95rem;
    transition: 0.2s;
}

    .btn-secundario:hover[b-610qae6d9r] {
        background: linear-gradient(90deg, #bbdefb, #90caf9);
    }

.btn-guardar:active[b-610qae6d9r],
.menu-btn:active[b-610qae6d9r] {
    transform: scale(0.97);
}

/* ===============================
   🎯 CONTADOR DE TIEMPO RESTANTE
   =============================== */
.ventas-encabezado .contador[b-610qae6d9r],
.contador[b-610qae6d9r] {
    font-size: 1.5em;
    font-weight: 800;
    color: #d32f2f;
    background: none;
    border-radius: 0;
    padding: 0;
    min-width: 85px;
    text-align: center;
    transition: all 0.3s ease;
}

    .ventas-encabezado .contador.critico[b-610qae6d9r],
    .contador.critico[b-610qae6d9r] {
        animation: parpadeoRojo-b-610qae6d9r 1s infinite alternate ease-in-out;
    }

@keyframes parpadeoRojo-b-610qae6d9r {
    0% {
        color: #d32f2f;
        transform: scale(1);
    }

    50% {
        color: #ff0000;
        transform: scale(1.05);
    }

    100% {
        color: #b71c1c;
        transform: scale(1);
    }
}

/* ===========================
   PANEL DE NOTICIAS (derecha)
   =========================== */
.panel-noticias[b-610qae6d9r] {
    position: relative;
    width: 520px;
    background: #f7fbff;
    border: 2px solid #e0e6f1;
    border-radius: 12px;
    padding: 14px 16px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08);
    height: auto;
    z-index: 10;
    margin-top: 0;
    margin-left: 0;
}

    .panel-noticias .header[b-610qae6d9r] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        margin-bottom: 10px;
    }

        .panel-noticias .header h3[b-610qae6d9r] {
            margin: 0;
            font-size: 1.25rem;
            font-weight: 900;
            color: #0d47a1;
            letter-spacing: .3px;
        }

    .panel-noticias .acciones[b-610qae6d9r] {
        display: flex;
        gap: 8px;
    }

.btn-icono[b-610qae6d9r] {
    border: 1px solid #c5d6f2;
    background: #e9f2ff;
    border-radius: 8px;
    padding: 6px 10px;
    font-weight: 700;
    cursor: pointer;
    transition: .2s;
}

    .btn-icono:hover[b-610qae6d9r] {
        background: #d9eaff;
    }

.noticias-scroll[b-610qae6d9r] {
    max-height: 520px;
    overflow-y: auto;
    padding-right: 6px;
    scrollbar-gutter: stable;
}

.noticia-card[b-610qae6d9r] {
    background: #ffffff;
    border: 2px solid #e6edf8;
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 10px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.04);
    transition: transform .15s ease, box-shadow .2s ease;
}

    .noticia-card:hover[b-610qae6d9r] {
        transform: translateY(-1px);
        box-shadow: 0 6px 16px rgba(0,0,0,0.08);
    }

.noticia-top[b-610qae6d9r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 6px;
}

.noticia-titulo[b-610qae6d9r] {
    font-weight: 900;
    font-size: 1.05rem;
    color: #153e75;
    margin: 0;
}

.badges[b-610qae6d9r] {
    display: flex;
    gap: 6px;
    align-items: center;
}

.badge[b-610qae6d9r] {
    padding: 3px 8px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 800;
}

.badge-todos[b-610qae6d9r] {
    background: #e8f5e9;
    color: #1b5e20;
    border: 1px solid #c8e6c9;
}

.badge-priv[b-610qae6d9r] {
    background: #fff3e0;
    color: #e65100;
    border: 1px solid #ffe0b2;
}

.badge-fecha[b-610qae6d9r] {
    background: #e3f2fd;
    color: #0d47a1;
    border: 1px solid #bbdefb;
}

.noticia-body[b-610qae6d9r] {
    color: #334155;
    line-height: 1.45;
    white-space: pre-wrap;
    margin-bottom: 8px;
}

.noticia-acciones[b-610qae6d9r] {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.btn-cerrar[b-610qae6d9r] {
    background: #ffe5e5;
    color: #b71c1c;
    border: 1px solid #ffcdd2;
    border-radius: 8px;
    padding: 6px 10px;
    font-weight: 800;
    cursor: pointer;
    transition: .2s;
}

    .btn-cerrar:hover[b-610qae6d9r] {
        background: #ffcccc;
    }

.noticia-leida[b-610qae6d9r] {
    opacity: .55;
}

.col-prohibidos[b-610qae6d9r] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
}

:root[b-610qae6d9r] {
    --ancho-prohibidos: 460px;
}

.col-prohibidos .numeros-prohibidos-panel[b-610qae6d9r] {
    width: var(--ancho-prohibidos);
}

.col-prohibidos .acciones-bajo-prohibidos[b-610qae6d9r] {
    width: var(--ancho-prohibidos);
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 20px;
}

/* === Estado bloqueado (sorteo cerrado) === */
.bloqueado[b-610qae6d9r] {
    opacity: 0.6;
    pointer-events: none;
    transition: opacity 0.3s ease;
    position: relative;
}

    .bloqueado[b-610qae6d9r]::after {
        content: "SORTEO CERRADO";
        position: absolute;
        top: 40%;
        left: 0;
        right: 0;
        text-align: center;
        font-weight: bold;
        font-size: 1.1rem;
        color: #b40000;
        background: rgba(255,255,255,0.85);
        border: 2px solid #b40000;
        border-radius: 8px;
        padding: 8px;
        width: 60%;
        margin: 0 auto;
        box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    }

/* ===== MODAL VER LISTA (escala dinámica) ===== */
.modal-overlay[b-610qae6d9r] {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0,0,0,.45);
    z-index: 99998 !important;
}

.modal-lista[b-610qae6d9r] {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 96vw !important;
    height: 90vh !important;
    background: #eaf3fb;
    border: 1px solid #b6d0e8;
    border-radius: 10px;
    padding: 10px 12px;
    padding-top: 0px;
    box-shadow: 0 10px 30px rgba(0,0,0,.25);
    z-index: 99999 !important;
    box-sizing: border-box;
    /* 🔹 ANTES: overflow: hidden !important; */
    overflow-y: auto !important; /* scroll vertical si hace falta */
    overflow-x: hidden !important; /* evitamos scroll horizontal feo */
}


body.modal-open[b-610qae6d9r] {
    overflow: hidden !important;
}

.modal-lista-actions[b-610qae6d9r] {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 8px;
}

.cs-modal-print[b-610qae6d9r] {
    min-width: 38px;
    height: 38px;
    padding: 0 10px;
    border-radius: 10px;
    border: 1px solid rgba(37, 99, 235, 0.35);
    background: #eff6ff;
    color: #1d4ed8;
    font-size: 14px;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.cs-modal-print:hover[b-610qae6d9r] {
    background: #dbeafe;
}

.modal-lista-actions .modal-close[b-610qae6d9r] {
    position: static;
}

.modal-fox-qr[b-610qae6d9r] {
    z-index: 100010 !important;
    max-width: 520px !important;
    width: min(520px, 96vw) !important;
    height: auto !important;
    max-height: 92vh !important;
}

.modal-fox-qr .fox-qr-stack[b-610qae6d9r] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    padding: 8px 12px 16px;
}

.modal-fox-qr .fox-qr-img[b-610qae6d9r] {
    width: 320px;
    max-width: 100%;
    border: 1px solid rgba(148, 163, 184, 0.35);
    border-radius: 12px;
    background: #fff;
    padding: 10px;
    box-sizing: border-box;
}

.modal-fox-qr .fox-qr-actions[b-610qae6d9r] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
}

.fox-qr-modo-toggle[b-610qae6d9r] {
    display: flex;
    gap: 8px;
    justify-content: center;
    flex-wrap: wrap;
}

.fox-qr-modo-btn[b-610qae6d9r] {
    min-width: 96px;
    height: 36px;
    padding: 0 14px;
    border-radius: 10px;
    border: 1px solid rgba(37, 99, 235, 0.35);
    background: #fff;
    color: #1d4ed8;
    font-weight: 900;
    font-size: 13px;
    cursor: pointer;
}

.fox-qr-modo-btn.active[b-610qae6d9r] {
    background: #1d4ed8;
    color: #fff;
    border-color: #1d4ed8;
}

.modal-close[b-610qae6d9r] {
    border: none;
    background: #ffeded;
    color: #b40000;
    cursor: pointer;
    width: 30px;
    height: 30px;
    border-radius: 6px;
    font-size: 20px;
    position: absolute;
    top: 10px;
    right: 12px;
    z-index: 2;
}

    .modal-close:hover[b-610qae6d9r] {
        background: #ffd6d6;
    }

/* CONTENEDOR ÚNICO DEL CONTENIDO DE LA LISTA */
#listaCanvas[b-610qae6d9r] {
    width: 100%;
    height: 100%;
    padding: 10px 20px 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center; /* centrado horizontal */
    justify-content: flex-start; /* contenido pegado arriba, no al centro */
}

#contentLista[b-610qae6d9r] {
    display: inline-block; /* que mida según su tabla, no que se estire raro */
}


/* ============================
   🧱 ESTRUCTURA MODO NORMAL
   ============================ */
.lista-unica-normal[b-610qae6d9r] {
    width: 100%;
    max-width: 1150px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 0;
}

/* ============================
   🧱 ESTRUCTURA MODO REVENTADO
   ============================ */
.lista-unica-rev[b-610qae6d9r] {
    width: 100%;
    max-width: 1350px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 0;
}

/* === TÍTULO Y FECHA === */
.fila-titulo[b-610qae6d9r] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.titulo-sorteo-modal[b-610qae6d9r] {
    font-weight: 900;
    font-size: 1.6rem;
    color: #c68200;
}

.fecha-modal[b-610qae6d9r] {
    font-weight: 700;
    font-size: 1rem;
    color: #255;
}

/* === TOTALES GENERALES (arriba) === */
.fila-totales-normal[b-610qae6d9r],
.fila-totales-rev[b-610qae6d9r] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
    margin-bottom: 6px;
}

    .fila-totales-normal .label[b-610qae6d9r],
    .fila-totales-rev .label[b-610qae6d9r] {
        font-weight: 900;
        font-size: 0.95rem;
        color: #04192e;
    }

    .fila-totales-normal .valor[b-610qae6d9r],
    .fila-totales-rev .valor[b-610qae6d9r] {
        font-weight: 900;
        font-size: 0.95rem;
        color: #b31523;
    }

    .fila-totales-rev .sep[b-610qae6d9r] {
        margin: 0 6px;
        opacity: .6;
    }

/* ============================
   🧮 REJILLA PRINCIPAL
   ============================ */

/* Modo NORMAL: 5 bloques (N° + Monto) = 10 columnas */
.lista-unica-normal .fila-cabecera[b-610qae6d9r],
.lista-unica-normal .fila-numeros[b-610qae6d9r],
.lista-unica-normal .fila-totales-f[b-610qae6d9r] {
    display: grid;
    grid-template-columns: repeat(5, 64px 95px);
    column-gap: 4px;
    row-gap: 4px;
    justify-content: center;
}

/* Modo REVENTADO: 5 bloques (N° + Monto + R) = 15 columnas */
.lista-unica-rev .fila-cabecera[b-610qae6d9r],
.lista-unica-rev .fila-numeros[b-610qae6d9r],
.lista-unica-rev .fila-totales-f-rev[b-610qae6d9r] {
    display: grid;
    grid-template-columns: repeat(5, 64px 95px 95px);
    column-gap: 4px;
    row-gap: 4px;
    justify-content: center;
}

/* ============================
   🎨 CABECERAS (Actualizadas)
   ============================ */

/* 🔵 CABECERA N° */
.h-num[b-610qae6d9r] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #0d6efd; /* azul fuerte */
    color: white;
    font-size: 11px;
    font-weight: 900;
    border-radius: 6px;
    border: 1px solid #0a58ca;
    height: 22px;
    box-sizing: border-box;
}

/* 🟢 CABECERA MONTO */
.h-monto[b-610qae6d9r] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #3CB371; /* verde fuerte */
    color: white;
    font-size: 11px;
    font-weight: 900;
    border-radius: 6px;
    border: 1px solid #2e8b57;
    height: 22px;
    box-sizing: border-box;
}

/* 🔴 CABECERA REVENTADO (R) */
.h-monto-rev[b-610qae6d9r] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #E74C3C; /* rojo fuerte */
    color: white;
    font-size: 11px;
    font-weight: 900;
    border-radius: 6px;
    border: 1px solid #c0392b;
    height: 22px;
    box-sizing: border-box;
}


/* ============================
   🎨 CELDAS (N°, Monto, R)
   ============================ */
.celda-num[b-610qae6d9r],
.celda-monto[b-610qae6d9r],
.celda-monto-rev[b-610qae6d9r] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 800;
    padding: 0 6px;
    border-radius: 10px;
    height: 22px;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Número */
.celda-num[b-610qae6d9r] {
    background: #e4f1fb;
    color: #0a406e;
    border: 1px solid #8db7d8;
}

/* Monto normal */
.celda-monto[b-610qae6d9r] {
    background: #e9f7ef;
    color: #0a5c38;
    border: 1px solid #8cc7a9;
}

/* Monto reventado */
.celda-monto-rev[b-610qae6d9r] {
    background: #faecec;
    color: #b02222;
    border: 1px solid #d3a3a3;
}

/* Números prohibidos en rojo */
.celda-num.prohibido[b-610qae6d9r] {
    color: #d32f2f;
    font-size: 14px;
}

/* ============================================================
   🟦 TOTALES F1..F5 — MODO NORMAL (5 columnas x 2 = 10 celdas)
   Alineado EXACTO como las filas de números
   ============================================================ */
.fila-totales-f[b-610qae6d9r] {
    display: grid;
    grid-template-columns: repeat(10, 1fr); /* 5 pares (label + monto) */
    gap: 4px;
    margin-top: 4px;
}

    .fila-totales-f .label[b-610qae6d9r],
    .fila-totales-f .valor[b-610qae6d9r] {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 26px;
        font-size: 14px;
        font-weight: 950;
        border-radius: 6px;
        box-sizing: border-box;
        padding: 0 6px;
    }

    /* 🔵 Label: "Total F1", "Total F2"... */
    .fila-totales-f .label[b-610qae6d9r] {
        background: #eaf8ff; /* azul clarito */
        color: #0c6aa6; /* azul más fuerte */
        border: 1px dashed #0c6aa6; /* borde punteado */
        white-space: nowrap; /* 👉 evita que se parta en dos líneas */
    }

    /* 🟢 Monto normal */
    .fila-totales-f .valor[b-610qae6d9r] {
        background: #f1fff5; /* verde muy suave */
        color: #0f7a3a; /* verde más fuerte */
        border: 1px dashed #0f7a3a; /* borde punteado */
    }

/* ============================================================
   🔴 TOTALES F1..F5 — MODO REVENTADO (5 columnas x 3 = 15 celdas)
   (Label + Monto Normal + Monto R)
   ============================================================ */
.fila-totales-f-rev[b-610qae6d9r] {
    display: grid;
    grid-template-columns: repeat(15, 1fr); /* 5 grupos x 3 columnas */
    gap: 4px;
    margin-top: 4px;
}

    .fila-totales-f-rev .label[b-610qae6d9r],
    .fila-totales-f-rev .valor-normal[b-610qae6d9r],
    .fila-totales-f-rev .valor-rev[b-610qae6d9r] {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 26px;
        font-size: 14px;
        font-weight: 950;
        border-radius: 6px;
        box-sizing: border-box;
        padding: 0 6px;
    }

    /* 🔵 Label */
    .fila-totales-f-rev .label[b-610qae6d9r] {
        background: #eaf8ff;
        color: #0c6aa6;
        border: 1px dashed #0c6aa6;
        white-space: nowrap; /* 👉 igual: sin salto de línea */
    }

    /* 🟢 Monto normal */
    .fila-totales-f-rev .valor-normal[b-610qae6d9r] {
        background: #f1fff5;
        color: #0f7a3a;
        border: 1px dashed #0f7a3a;
    }

    /* 🔴 Monto reventado */
    .fila-totales-f-rev .valor-rev[b-610qae6d9r] {
        background: #fff5f5;
        color: #c62828;
        border: 1px dashed #c62828;
    }


/* Asegurar que nada se desborde raro */
#listaCanvas > div[b-610qae6d9r] {
    min-width: 0;
    min-height: 0;
}

/* === Popup de error de venta (centrado en la pantalla) === */
.venta-modal-backdrop[b-610qae6d9r] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999999;
}

.venta-modal[b-610qae6d9r] {
    background: #ffffff;
    border-radius: 14px;
    padding: 18px 22px 20px;
    max-width: 420px;
    width: 90%;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.35);
    animation: ventaModalIn-b-610qae6d9r 0.18s ease-out;
    text-align: left;
}

    .venta-modal h3[b-610qae6d9r] {
        margin: 0 0 10px 0;
        font-size: 1.15rem;
        font-weight: 800;
        color: #c62828;
    }

    .venta-modal p[b-610qae6d9r] {
        margin: 0 0 18px 0;
        line-height: 1.4;
        font-size: 0.95rem;
        white-space: pre-line;
        color: #333;
    }

    .venta-modal .btn.ok[b-610qae6d9r] {
        width: 100%;
        font-weight: 600;
    }

@keyframes ventaModalIn-b-610qae6d9r {
    from {
        opacity: 0;
        transform: translateY(10px) scale(0.97);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.ventas-encabezado[b-610qae6d9r] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.fecha-venta-box[b-610qae6d9r] {
    min-width: 240px;
    background: #eef6ff;
    border: 1px solid #cfe0f5;
    border-radius: 12px;
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fv-titulo[b-610qae6d9r] {
    font-weight: 900;
    color: #153e75;
}

.fv-date[b-610qae6d9r] {
    height: 40px;
    border: 1px solid #cfe0f5;
    border-radius: 10px;
    padding: 6px 10px;
    font-weight: 800;
    color: #153e75;
    background: #fff;
}

.fv-hoy[b-610qae6d9r] {
    height: 36px;
    border-radius: 10px;
    border: 1px solid #cfe0f5;
    background: #fff;
    font-weight: 800;
    cursor: pointer;
}

/* ✅ FECHA GRANDE (igual a Restricciones) */
.fv-xl[b-610qae6d9r] {
    height: 56px !important;
    padding: 10px 14px !important;
    font-size: 1.35rem !important;
    font-weight: 900 !important;
    color: #153e75 !important;
    border: 1px solid #cfe0f5 !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.06) !important;
    box-sizing: border-box !important;
    line-height: 1.2 !important;
}

    /* ✅ Chrome/Edge: agranda el texto visible interno del date */
    .fv-xl[b-610qae6d9r]::-webkit-datetime-edit {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

    .fv-xl[b-610qae6d9r]::-webkit-datetime-edit-day-field,
    .fv-xl[b-610qae6d9r]::-webkit-datetime-edit-month-field,
    .fv-xl[b-610qae6d9r]::-webkit-datetime-edit-year-field {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

    .fv-xl[b-610qae6d9r]::-webkit-datetime-edit-text {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

    /* Icono calendario nativo */
    .fv-xl[b-610qae6d9r]::-webkit-calendar-picker-indicator {
        cursor: pointer;
        opacity: .80;
    }

/* ==========================================================
   FIX ENCABEZADO TIEMPOS (igual a Parley)
   ========================================================== */

.ventas-encabezado[b-610qae6d9r] {
    display: flex;
    align-items: center; /* en vez de flex-end / flex-start */
    justify-content: space-between;
    gap: 14px;
    padding: 12px 22px; /* banner más compacto */
}

/* El centro ya NO debe ser absoluto */
.fecha-centro[b-610qae6d9r] {
    position: static !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    margin: 0 auto; /* queda centrado dentro del banner */
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
}

/* Caja derecha en una sola fila como Parley */
.fecha-venta-box[b-610qae6d9r] {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    width: fit-content !important;
    min-width: 0 !important;
    padding: 10px 12px !important;
}

/* Botón Hoy alto igual al date */
.fv-hoy[b-610qae6d9r] {
    height: 56px !important;
    padding: 0 14px !important;
}


/* ==========================================================
   ✅ MEJORA PANEL NOTICIAS (NO CAMBIA TAMAÑO / NO MUEVE NADA)
   - Solo visual + animación suave + mejor lectura con muchas noticias
   - Pegar al FINAL del CSS
   ========================================================== */

/* Suaviza el scroll (ya lo tienes, pero aseguramos consistencia) */
.panel-noticias .noticias-scroll[b-610qae6d9r] {
    scroll-behavior: smooth;
}

/* Animación de entrada suave (sin afectar layout) */
@keyframes noticiaInSoft-b-610qae6d9r {
    from {
        opacity: 0;
        transform: translateY(6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Tarjeta: mejora sombra/borde y entrada */
.panel-noticias .noticia-card[b-610qae6d9r] {
    position: relative;
    animation: noticiaInSoft-b-610qae6d9r .22s ease-out both;
    border-color: rgba(13, 71, 161, 0.15); /* azul suave */
    box-shadow: 0 3px 10px rgba(0,0,0,0.04);
    transition: transform .15s ease, box-shadow .18s ease, border-color .18s ease;
    will-change: transform;
}

    /* Hover elegante */
    .panel-noticias .noticia-card:hover[b-610qae6d9r] {
        transform: translateY(-2px);
        box-shadow: 0 10px 22px rgba(0,0,0,0.10);
        border-color: rgba(30, 136, 229, 0.28);
    }

    /* NO leídas: línea lateral azul (sin mover el contenido) */
    .panel-noticias .noticia-card:not(.noticia-leida)[b-610qae6d9r]::before {
        content: "";
        position: absolute;
        left: 0;
        top: 10px;
        bottom: 10px;
        width: 4px;
        border-radius: 6px;
        background: linear-gradient(180deg, #1e88e5, #90caf9);
    }

/* Leídas: se ven suaves pero legibles */
.panel-noticias .noticia-leida[b-610qae6d9r] {
    opacity: 0.62; /* ya tenías .55; subo un poquito para mejor lectura */
    filter: saturate(0.92);
}

/* Título: un poco más pro y con recorte si es larguísimo */
.panel-noticias .noticia-titulo[b-610qae6d9r] {
    line-height: 1.15;
    letter-spacing: 0.2px;
    max-width: 320px; /* no toca el panel, solo evita que empuje badges */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Contenido: mejor lectura con muchas noticias (sin crecer infinito) */
.panel-noticias .noticia-body[b-610qae6d9r] {
    /* Mantiene tu pre-wrap, pero evita tarjetas gigantes si pegan textos largos */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5; /* muestra 5 líneas */
    overflow: hidden;
}

/* Si quieres que al pasar el mouse se vea completo, descomenta:
.panel-noticias .noticia-card:hover .noticia-body {
    -webkit-line-clamp: unset;
}
*/

/* Badges: más “pill” moderno sin cambiar tamaños */
.panel-noticias .badge[b-610qae6d9r] {
    border: 1px solid rgba(13, 71, 161, 0.12);
    box-shadow: 0 1px 0 rgba(255,255,255,0.6) inset;
}

/* Botones icono: hover más elegante */
.panel-noticias .btn-icono[b-610qae6d9r] {
    transition: transform .12s ease, background .15s ease, box-shadow .15s ease, border-color .15s ease;
}

    .panel-noticias .btn-icono:hover[b-610qae6d9r] {
        transform: translateY(-1px);
        box-shadow: 0 8px 18px rgba(13, 71, 161, 0.10);
        border-color: rgba(30, 136, 229, 0.25);
    }

/* Botón “Marcar leído”: más pro sin cambiar layout */
.panel-noticias .btn-cerrar[b-610qae6d9r] {
    transition: transform .12s ease, background .15s ease, box-shadow .15s ease, border-color .15s ease;
    box-shadow: 0 2px 10px rgba(183, 28, 28, 0.06);
}

    .panel-noticias .btn-cerrar:hover[b-610qae6d9r] {
        transform: translateY(-1px);
        box-shadow: 0 10px 20px rgba(183, 28, 28, 0.10);
    }

/* Respeto accesibilidad: si el sistema pide reducir animaciones */
@media (prefers-reduced-motion: reduce) {
    .panel-noticias .noticia-card[b-610qae6d9r],
    .panel-noticias .btn-icono[b-610qae6d9r],
    .panel-noticias .btn-cerrar[b-610qae6d9r] {
        animation: none !important;
        transition: none !important;
    }
}

/* ==========================================================
   ✅ BORDE MÁS OSCURO EN EL ENCABEZADO (TIEMPOS)
   - Solo refuerza el borde para que se note más
   - No cambia posiciones, tamaños ni lógica
   ========================================================== */

.ventas-encabezado[b-610qae6d9r] {
    border: 2px solid rgba(13, 71, 161, 0.35) !important;
    box-shadow: 0 3px 10px rgba(0,0,0,0.10) !important;
}

/* ==========================================================
   ✅ BADGE DEL JUEGO (TIEMPOS / PARLEY) - MISMO DISEÑO
   Ubicación: debajo del nombre del sorteo y encima de Hora/Falta
   ========================================================== */
.juego-badge[b-610qae6d9r] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    padding: 6px 12px;
    border-radius: 999px;
    font-weight: 950;
    font-size: 0.95rem;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    line-height: 1;
    margin-top: 4px;
    margin-bottom: 6px;
    box-shadow: 0 6px 14px rgba(0,0,0,0.08);
}

    /* TIEMPOS: azul suave */
    .juego-badge.tiempos[b-610qae6d9r] {
        background: linear-gradient(180deg, #e8f2ff, #d7e9ff);
        border: 1px solid #9cc6ff;
        color: #0b3a7a;
    }

/* ===== Edición inline SIN deformar filas ===== */
.celda[b-610qae6d9r] {
    position: relative;
}

.edit-inline[b-610qae6d9r] {
    position: absolute;
    inset: 2px;
    width: calc(100% - 4px);
    height: calc(100% - 4px);
    box-sizing: border-box;
    border: 2px solid #111;
    border-radius: 10px;
    background: transparent;
    font: inherit;
    color: inherit;
    text-align: center;
    padding: 0;
    outline: none;
    z-index: 5;
    pointer-events: auto;
}

/* selección bonita cuando solo está enfocada la celda (sin editar) */
.fila-item:focus[b-610qae6d9r],
.celda:focus[b-610qae6d9r] {
    outline: none;
}

.celda:focus[b-610qae6d9r] {
    border-radius: 10px;
    box-shadow: 0 0 0 2px rgba(0,0,0,.25);
}

/* ==========================================================
   ✅ BOTÓN: AGRUPA MONTOS (toggle ON/OFF)
   - No toca estilos existentes de .btn-secundario
   ========================================================== */
.btn-agrupar-montos[b-610qae6d9r] {
    position: relative;
    font-weight: 900;
    border-width: 2px;
    transition: transform .12s ease, box-shadow .18s ease, filter .18s ease;
}

    .btn-agrupar-montos:hover[b-610qae6d9r] {
        transform: translateY(-1px);
    }

    .btn-agrupar-montos.on[b-610qae6d9r] {
        box-shadow: 0 10px 22px rgba(13, 71, 161, 0.18);
        filter: saturate(1.06);
        animation: agruparPulse-b-610qae6d9r 1.15s ease-in-out infinite;
    }

/* Pulso suave para que se note que está activo */
@keyframes agruparPulse-b-610qae6d9r {
    0% {
        transform: translateY(0) scale(1);
    }

    50% {
        transform: translateY(-1px) scale(1.03);
    }

    100% {
        transform: translateY(0) scale(1);
    }
}

/* Respeto accesibilidad */
@media (prefers-reduced-motion: reduce) {
    .btn-agrupar-montos[b-610qae6d9r],
    .btn-agrupar-montos.on[b-610qae6d9r] {
        animation: none !important;
        transition: none !important;
    }
}

/* ===========================
   MODAL INFO NÚMERO PROHIBIDO (V2 - MÁS VIVO)
=========================== */

.np-item[b-610qae6d9r] {
    cursor: pointer;
    user-select: none;
    transition: transform .12s ease, box-shadow .18s ease, filter .18s ease;
}

    .np-item:hover[b-610qae6d9r] {
        transform: translateY(-2px);
        filter: brightness(1.03);
        box-shadow: 0 16px 34px rgba(0,0,0,.16);
    }

    .np-item:active[b-610qae6d9r] {
        transform: translateY(0);
        box-shadow: 0 10px 22px rgba(0,0,0,.14);
    }

/* Backdrop más elegante */
.np-modal-backdrop[b-610qae6d9r] {
    position: fixed;
    inset: 0;
    background: radial-gradient(900px 400px at 50% 15%, rgba(90,160,255,.18), transparent 65%), radial-gradient(600px 320px at 15% 80%, rgba(70,230,160,.12), transparent 62%), rgba(8, 10, 14, .66);
    backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
    z-index: 99999;
}

/* Modal “glass” con borde con brillo */
.np-modal[b-610qae6d9r] {
    width: min(610px, 96vw);
    border-radius: 22px;
    overflow: hidden;
    position: relative;
    background: linear-gradient(180deg, rgba(20,26,40,.92), rgba(12,16,26,.90));
    border: 1px solid rgba(255,255,255,.14);
    box-shadow: 0 28px 70px rgba(0,0,0,.52), 0 0 0 1px rgba(120,170,255,.10) inset;
    animation: npPop2-b-610qae6d9r .18s ease-out;
}

    /* Borde neon suave */
    .np-modal[b-610qae6d9r]::before {
        content: "";
        position: absolute;
        inset: -2px;
        border-radius: 24px;
        background: linear-gradient(120deg, rgba(90,160,255,.55), rgba(70,230,160,.30), rgba(255,180,70,.22));
        opacity: .35;
        filter: blur(18px);
        z-index: 0;
    }

    /* Contenido encima del glow */
    .np-modal > *[b-610qae6d9r] {
        position: relative;
        z-index: 1;
    }

@keyframes npPop2-b-610qae6d9r {
    from {
        transform: translateY(14px) scale(.985);
        opacity: 0;
    }

    to {
        transform: translateY(0) scale(1);
        opacity: 1;
    }
}

/* Header más “premium” */
.np-modal-header[b-610qae6d9r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 18px;
    background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.03));
    border-bottom: 1px solid rgba(255,255,255,.10);
}

.np-modal-title[b-610qae6d9r] {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 16px;
    font-weight: 900;
    color: #f1f7ff;
}

.np-badge[b-610qae6d9r] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 24px;
    padding: 0 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 950;
    letter-spacing: .6px;
    color: #d8ecff;
    background: linear-gradient(180deg, rgba(90,160,255,.25), rgba(60,120,255,.14));
    border: 1px solid rgba(90,160,255,.42);
    box-shadow: 0 10px 22px rgba(40,110,255,.18);
}

/* Botón X más visible */
.np-modal-close[b-610qae6d9r] {
    width: 38px;
    height: 38px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(255,255,255,.07);
    color: #f1f7ff;
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: transform .12s ease, background .16s ease, border-color .16s ease;
}

    .np-modal-close:hover[b-610qae6d9r] {
        background: rgba(255,255,255,.12);
        border-color: rgba(255,255,255,.20);
        transform: rotate(6deg) scale(1.05);
    }

/* Body */
.np-modal-body[b-610qae6d9r] {
    padding: 16px 18px 18px;
}

/* Cards más grandes y claras */
.np-cards[b-610qae6d9r] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

/* Card con barra superior de color */
.np-card[b-610qae6d9r] {
    border-radius: 18px;
    border: 1px solid rgba(255,255,255,.12);
    background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
    padding: 14px 14px 13px;
    box-shadow: 0 14px 30px rgba(0,0,0,.18);
    position: relative;
    overflow: hidden;
}

    /* Barra arriba */
    .np-card[b-610qae6d9r]::before {
        content: "";
        position: absolute;
        left: 12px;
        right: 12px;
        top: 10px;
        height: 3px;
        border-radius: 999px;
        background: linear-gradient(90deg, rgba(90,160,255,.70), rgba(70,230,160,.55), rgba(255,180,70,.45));
        opacity: .75;
    }

/* Label */
.np-card-label[b-610qae6d9r] {
    font-size: 14px;
    color: rgba(241,247,255,.78);
    font-weight: 800;
    margin-top: 8px;
    margin-bottom: 8px;
    letter-spacing: .2px;
}

/* Value mucho más visible */
.np-card-value[b-610qae6d9r] {
    font-size: 26px;
    font-weight: 950;
    color: #ffffff;
    line-height: 1.05;
    text-shadow: 0 10px 26px rgba(0,0,0,.28);
}

.np-num[b-610qae6d9r] {
    letter-spacing: 2px;
}

/* Card “Le cabe” resaltada en verde bonito */
.np-card-ok[b-610qae6d9r] {
    background: radial-gradient(260px 120px at 30% 0%, rgba(70,230,160,.22), transparent 62%), linear-gradient(180deg, rgba(70,230,160,.12), rgba(255,255,255,.03));
    border: 1px solid rgba(70,230,160,.28);
}

    .np-card-ok[b-610qae6d9r]::before {
        background: linear-gradient(90deg, rgba(70,230,160,.95), rgba(90,160,255,.55));
        opacity: .9;
    }

/* Nota (regla) más clara y ordenada */
.np-modal-note[b-610qae6d9r] {
    margin-top: 14px;
    padding: 13px 14px;
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
    border: 1px solid rgba(255,255,255,.10);
    color: rgba(241,247,255,.90);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
}

/* Footer */
.np-modal-footer[b-610qae6d9r] {
    padding: 14px 18px 18px;
    border-top: 1px solid rgba(255,255,255,.10);
    display: flex;
    justify-content: flex-end;
}

/* Botón aceptar más “pro” */
.np-btn-primary[b-610qae6d9r] {
    border: none;
    border-radius: 16px;
    padding: 13px px;
    font-size: 16px;
    font-weight: 950;
    cursor: pointer;
    color: #071018;
    background: linear-gradient(180deg, #6fd0ff, #2f7dff);
    box-shadow: 0 16px 28px rgba(47,125,255,.34), 0 0 0 1px rgba(255,255,255,.20) inset;
    transition: transform .12s ease, filter .16s ease;
}

    .np-btn-primary:hover[b-610qae6d9r] {
        transform: translateY(-2px);
        filter: brightness(1.05);
    }

    .np-btn-primary:active[b-610qae6d9r] {
        transform: translateY(0);
        filter: brightness(.98);
    }

/* Responsive: en pantallas pequeñas las cards se apilan */
@media (max-width: 520px) {
    .np-cards[b-610qae6d9r] {
        grid-template-columns: 1fr;
    }

    .np-modal[b-610qae6d9r] {
        width: min(520px, 96vw);
    }
}

.wa-ticket-img[b-610qae6d9r] {
    width: 100%;
    height: auto;
    max-height: calc(92vh - 130px); /* deja espacio para título + botones */
    object-fit: contain; /* ✅ auto-fit completo */
    display: block;
}

.pos-wa-wrap[b-610qae6d9r] {
    margin-top: 6px;
    display: flex;
    justify-content: center;
}

.pos-wa-icon[b-610qae6d9r] {
    width: 16px; /* ✅ tamaño real pequeño */
    height: 16px;
    display: inline-block;
}

    .pos-wa-icon svg[b-610qae6d9r] {
        width: 16px;
        height: 16px;
        display: block;
    }
.wa-zoom-bar[b-610qae6d9r] {
    display: flex;
    gap: 8px;
    justify-content: center;
    margin: 6px 0 10px 0;
}

    .wa-zoom-bar button[b-610qae6d9r] {
        padding: 6px 10px;
        border-radius: 8px;
        border: 1px solid #cfd6df;
        background: #f7f9fc;
        cursor: pointer;
    }

/* contenedor: sin scroll, pero permite que el scale se vea completo */
.wa-ticket-img[b-610qae6d9r] {
    width: 100%;
    height: auto;
    max-height: calc(92vh - 170px);
    object-fit: contain;
    display: block;
}

/* =========================
   BOTÓN PRO WHATSAPP
========================= */
/* ===== BOTÓN WhatsApp: NO ancho completo, visible y bonito ===== */
.wa-btn2[b-610qae6d9r] {
    /* 🔥 ancho limitado: hasta donde llega "Agrupa Montos" */
    width: fit-content; /* no se estira */
    max-width: 420px; /* límite por si acaso */
    display: inline-flex; /* queda como botón normal */
    align-items: center;
    gap: 10px;
    padding: 11px 14px;
    border-radius: 12px;
    /* borde más visible */
    border: 2px solid rgba(37, 211, 102, .75);
    background: linear-gradient(180deg, rgba(37,211,102,.22), rgba(18,140,126,.12));
    color: #0b2b16; /* texto oscuro para que SI se lea en fondo claro */
    font-weight: 900;
    font-size: 15px;
    line-height: 1;
    box-shadow: 0 10px 22px rgba(0,0,0,.12);
}

    .wa-btn2:hover[b-610qae6d9r] {
        filter: brightness(1.05);
    }

    .wa-btn2:disabled[b-610qae6d9r] {
        opacity: .5;
        cursor: not-allowed;
        filter: none;
    }

/* Icono redondo bonito */
.wa-btn2__icon[b-610qae6d9r] {
    width: 28px;
    height: 28px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.70);
    border: 1px solid rgba(0,0,0,.08);
    flex: 0 0 auto;
}

    .wa-btn2__icon svg[b-610qae6d9r] {
        width: 18px;
        height: 18px;
        display: block;
    }

/* Texto SI visible */
.wa-btn2__text[b-610qae6d9r] {
    white-space: nowrap; /* evita que se parta raro */
}

/* =========================
   MODAL WHATSAPP (NUEVO)
========================= */
.wa2-backdrop[b-610qae6d9r] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.64);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    z-index: 99999;
}

.wa2-modal[b-610qae6d9r] {
    width: min(720px, 96vw);
    background: #0f1420;
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 30px 70px rgba(0,0,0,.65);
}

.wa2-header[b-610qae6d9r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 16px;
    background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0));
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.wa2-title[b-610qae6d9r] {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #fff;
}

.wa2-badge[b-610qae6d9r] {
    width: 44px;
    height: 44px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: rgba(37,211,102,.14);
    border: 1px solid rgba(37,211,102,.25);
    color: #25D366; /* SVG currentColor */
}

    .wa2-badge svg[b-610qae6d9r] {
        width: 22px;
        height: 22px;
        display: block;
    }

.wa2-title__main[b-610qae6d9r] {
    font-weight: 900;
    font-size: 17px;
    line-height: 1.1;
}

.wa2-title__sub[b-610qae6d9r] {
    font-size: 14px;
    opacity: .85;
    margin-top: 2px;
}

.wa2-x[b-610qae6d9r] {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.06);
    color: #fff;
    cursor: pointer;
}

    .wa2-x:hover[b-610qae6d9r] {
        filter: brightness(1.1);
    }

.wa2-body[b-610qae6d9r] {
    padding: 16px;
}

.wa2-grid[b-610qae6d9r] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

@media (max-width: 640px) {
    .wa2-grid[b-610qae6d9r] {
        grid-template-columns: 1fr;
    }
}

.wa2-field[b-610qae6d9r] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.wa2-label[b-610qae6d9r] {
    font-size: 14px;
    opacity: .85;
    color: #dfe7ff;
}

.wa2-input[b-610qae6d9r], .wa2-select[b-610qae6d9r] {
    width: 100%;
    padding: 12px 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.06);
    color: #fff;
    outline: none;
}

    .wa2-input[b-610qae6d9r]::placeholder {
        color: rgba(255,255,255,.55);
    }

.wa2-actions[b-610qae6d9r] {
    margin-top: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.wa2-actions__right[b-610qae6d9r] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.wa2-btn[b-610qae6d9r] {
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.06);
    color: #fff;
    cursor: pointer;
    font-weight: 800;
}

    .wa2-btn:hover[b-610qae6d9r] {
        filter: brightness(1.08);
    }

.wa2-btn--ghost[b-610qae6d9r] {
    background: transparent;
}

.wa2-btn--soft[b-610qae6d9r] {
    background: rgba(37,211,102,.10);
    border-color: rgba(37,211,102,.22);
}

.wa2-btn--primary[b-610qae6d9r] {
    background: linear-gradient(180deg, rgba(37,211,102,.35), rgba(18,140,126,.25));
    border-color: rgba(37,211,102,.35);
}

.wa2-note[b-610qae6d9r] {
    margin-top: 12px;
    padding: 12px 12px;
    border-radius: 14px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.10);
    color: #e8f0ff;
    font-size: 14px;
    line-height: 1.35;
}

.venta-alert-backdrop[b-610qae6d9r] {
    position: fixed;
    inset: 0;
    background: rgba(7, 18, 35, 0.62);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    padding: 18px;
    animation: ventaAlertFadeIn-b-610qae6d9r .18s ease-out;
}

.venta-alert-modal[b-610qae6d9r] {
    width: min(650px, 96vw);
    max-height: 88vh;
    overflow: auto;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    border-radius: 24px;
    border: 1px solid rgba(24, 76, 150, 0.16);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.28);
    padding: 22px 22px 18px 22px;
    animation: ventaAlertPopIn-b-610qae6d9r .20s ease-out;
}

.venta-alert-top[b-610qae6d9r] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
}

.venta-alert-icon-wrap[b-610qae6d9r] {
    flex: 0 0 auto;
}

.venta-alert-icon[b-610qae6d9r] {
    width: 58px;
    height: 58px;
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    font-weight: 900;
    color: #fff;
    background: linear-gradient(180deg, #ff7b54 0%, #e3442f 100%);
    box-shadow: 0 12px 26px rgba(227, 68, 47, 0.35);
}

.venta-alert-head[b-610qae6d9r] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.venta-alert-badge[b-610qae6d9r] {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 5px 10px;
    border-radius: 999px;
    background: #eef4ff;
    color: #24539b;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .2px;
}

.venta-alert-title[b-610qae6d9r] {
    margin: 0;
    font-size: 1.45rem;
    line-height: 1.15;
    color: #132a4c;
    font-weight: 900;
}

.venta-alert-body[b-610qae6d9r] {
    background: #ffffff;
    border: 1px solid rgba(26, 84, 162, 0.12);
    border-radius: 18px;
    padding: 16px 16px 14px 16px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.7);
}

.venta-alert-message[b-610qae6d9r] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.venta-alert-line[b-610qae6d9r] {
    color: #20334d;
    font-size: 1.02rem;
    line-height: 1.5;
    font-weight: 600;
    white-space: pre-wrap;
    word-break: break-word;
}

.venta-alert-sep[b-610qae6d9r] {
    height: 8px;
}

.venta-alert-actions[b-610qae6d9r] {
    display: flex;
    justify-content: flex-end;
    margin-top: 18px;
}

.venta-alert-btn[b-610qae6d9r] {
    min-width: 160px;
    height: 48px;
    border: none;
    border-radius: 16px;
    padding: 0 22px;
    cursor: pointer;
    font-size: 1rem;
    font-weight: 900;
    color: #fff;
    background: linear-gradient(180deg, #1f69d8 0%, #154fa9 100%);
    box-shadow: 0 14px 28px rgba(21, 79, 169, 0.28);
    transition: transform .10s ease, box-shadow .10s ease, filter .10s ease;
}

    .venta-alert-btn:hover[b-610qae6d9r] {
        filter: brightness(1.03);
        box-shadow: 0 16px 30px rgba(21, 79, 169, 0.32);
    }

    .venta-alert-btn:active[b-610qae6d9r] {
        transform: translateY(1px);
    }

    .venta-alert-btn:focus[b-610qae6d9r] {
        outline: none;
        box-shadow: 0 0 0 4px rgba(38, 113, 219, 0.18), 0 16px 30px rgba(21, 79, 169, 0.32);
    }

@keyframes ventaAlertFadeIn-b-610qae6d9r {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes ventaAlertPopIn-b-610qae6d9r {
    from {
        opacity: 0;
        transform: translateY(10px) scale(.98);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@media (max-width: 640px) {
    .venta-alert-modal[b-610qae6d9r] {
        width: min(96vw, 96vw);
        border-radius: 20px;
        padding: 18px 16px 16px 16px;
    }

    .venta-alert-top[b-610qae6d9r] {
        align-items: flex-start;
        gap: 12px;
    }

    .venta-alert-icon[b-610qae6d9r] {
        width: 50px;
        height: 50px;
        font-size: 26px;
        border-radius: 16px;
    }

    .venta-alert-title[b-610qae6d9r] {
        font-size: 1.20rem;
    }

    .venta-alert-line[b-610qae6d9r] {
        font-size: .96rem;
        line-height: 1.45;
    }

    .venta-alert-actions[b-610qae6d9r] {
        margin-top: 16px;
    }

    .venta-alert-btn[b-610qae6d9r] {
        width: 100%;
        min-width: 0;
    }
}
/* _content/SistemaLoteriaDashboard/Components/Ventas/VentasTripletas.razor.rz.scp.css */
/* ==========================================================
   🧩 LAYOUT PRINCIPAL
   ========================================================== */
/* ==========================================================
   🧩 LAYOUT PRINCIPAL (3 COLUMNAS reales)
   ========================================================== */
:root[b-x2wlg4txoo] {
    --ancho-prohibidos: 360px;
    --ancho-noticias: 360px;
    --ancho-izquierda: 700px;
}

.ventas-contenido[b-x2wlg4txoo] {
    display: grid;
    grid-template-columns: minmax(640px, var(--ancho-izquierda)) minmax(280px, var(--ancho-prohibidos)) minmax(280px, var(--ancho-noticias));
    gap: 24px;
    align-items: start;
    max-width: 1400px;
    margin: 12px auto 0;
    padding: 0 20px; /* ✅ iguala con encabezado (que usa 20px) */
    width: 100%;
    box-sizing: border-box;
}


/* ==========================================================
   🧩 PANEL IZQUIERDO (VENTAS)
   ========================================================== */
.ventas-izquierda[b-x2wlg4txoo] {
    flex: 1;
    min-width: 400px;
    max-width: 700px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    background: #fff;
    border: 2px solid #e0e0e0;
    border-radius: 10px;
    padding: 15px;
    box-sizing: border-box;
    min-height: 300px;
    margin: 0;
}

/* ====== LISTA (contenedor con scroll) ====== */
.ventas-lista[b-x2wlg4txoo] {
    position: relative;
    border: 2px solid #e0e6f1;
    border-radius: 8px;
    background: #fff;
    max-height: 420px;
    overflow-y: auto;
    overflow-x: hidden;
    scroll-behavior: smooth;
    scrollbar-gutter: stable;
    padding: 0;
}

/* ====== GRID UNIFICADO (cabecera + filas) ====== */
.tabla-lista[b-x2wlg4txoo] {
    display: grid;
    grid-template-columns: 120px 170px 56px;
    width: 100%;
    row-gap: 0;
    justify-content: center;
    margin: 0 auto;
}

    /* Modo BASE con reventado: columnas flexibles para que no se salgan con zoom */
    .tabla-lista.reventado[b-x2wlg4txoo] {
        grid-template-columns: minmax(90px, 1.1fr) /* N°  */
        minmax(120px, 1.4fr) /* Monto normal */
        minmax(120px, 1.4fr) /* Monto reventado */
        minmax(40px, 0.6fr); /* Botón X */
    }

/* Cabecera y filas comparten el MISMO grid */
.fila-cabecera[b-x2wlg4txoo],
.fila-item[b-x2wlg4txoo] {
    display: contents;
}

/* ====== CELDAS ====== */
.celda[b-x2wlg4txoo] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    text-align: right;
    padding: 10px 12px;
    min-height: 44px;
    font-weight: 800;
    font-size: 20px;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
    border-bottom: 1px solid #e6ecf6;
}

    /* CABECERA (títulos centrados y más grandes) */
    .celda.titulo[b-x2wlg4txoo] {
        position: sticky;
        top: 0;
        z-index: 10;
        background: #f7f9fc;
        border-bottom: 2px solid #e0e6f1;
        box-shadow: 0 1px 0 #e0e6f1;
        text-align: center;
        justify-content: center;
        align-items: center;
        font-weight: 900;
        font-size: 22px;
        color: #1c2b4d;
        height: 48px;
    }

        /* La celda de cabecera de la columna de la X (vacía pero sticky) */
        .celda.titulo.th-x[b-x2wlg4txoo] {
            background: #f7f9fc;
            pointer-events: none;
        }

/* Celdas normales (centradas igual) */
.celda[b-x2wlg4txoo],
.fila-item .numero[b-x2wlg4txoo],
.fila-item .monto[b-x2wlg4txoo] {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 800;
    font-size: 20px;
    height: 48px;
}

/* Guion perfectamente centrado entre Número y Monto */
.fila-item .celda.numero[b-x2wlg4txoo]::after {
    content: "–";
    color: #76acfe;
    font-weight: 600;
    font-size: 20px;
    position: relative;
    left: 65%;
    transform: translateX(-50%);
    top: 25%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

/* ========== BOTÓN ELIMINAR (moderno y elegante) ========== */
.btn-eliminar[b-x2wlg4txoo] {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 10px;
    background: linear-gradient(180deg,#ff5c5c,#d93636);
    box-shadow: 0 6px 14px rgba(217,54,54,.25), inset 0 1px 0 rgba(255,255,255,.28);
    cursor: pointer;
    padding: 0;
    font-size: 0;
    line-height: 1;
    margin: auto;
    z-index: 1;
    transition: transform .12s ease, box-shadow .18s ease, filter .18s ease, background .18s ease;
}

    .btn-eliminar[b-x2wlg4txoo]::before,
    .btn-eliminar[b-x2wlg4txoo]::after {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        width: 14px;
        height: 2px;
        background: #fff;
        border-radius: 2px;
        transform-origin: center;
        box-shadow: 0 0 1px rgba(0,0,0,.25);
    }

    .btn-eliminar[b-x2wlg4txoo]::before {
        transform: translate(-50%,-50%) rotate(45deg);
    }

    .btn-eliminar[b-x2wlg4txoo]::after {
        transform: translate(-50%,-50%) rotate(-45deg);
    }

    .btn-eliminar:hover[b-x2wlg4txoo] {
        transform: translateY(-1px) scale(1.03);
        filter: saturate(1.06);
        box-shadow: 0 10px 20px rgba(217,54,54,.28), inset 0 1px 0 rgba(255,255,255,.32);
    }

    .btn-eliminar:active[b-x2wlg4txoo] {
        transform: translateY(0) scale(.97);
        box-shadow: 0 4px 10px rgba(217,54,54,.22), inset 0 1px 0 rgba(255,255,255,.24);
    }

    .btn-eliminar:focus-visible[b-x2wlg4txoo] {
        outline: 3px solid rgba(25,118,210,.35);
        outline-offset: 2px;
        box-shadow: 0 0 0 4px rgba(25,118,210,.15), 0 8px 18px rgba(217,54,54,.25), inset 0 1px 0 rgba(255,255,255,.28);
    }

@media (prefers-reduced-motion: reduce) {
    .btn-eliminar[b-x2wlg4txoo] {
        transition: none;
    }
}

/* ====== SEPARADOR ====== */
.separador[b-x2wlg4txoo] {
    border: none;
    border-top: 2px solid #d9e0ef;
    margin: 8px 0;
}

/* ====== CAMPOS DE ENTRADA ====== */
.input-linea[b-x2wlg4txoo] {
    display: flex;
    gap: 10px;
    margin: 10px 0;
    justify-content: center;
    /* 👇 NUEVO: si con 3 cajas no cabe, que hagan otra fila
       en vez de salirse del panel al hacer zoom */
    flex-wrap: wrap;
    max-width: 100%;
}

.input-pequeno[b-x2wlg4txoo] {
    padding: 12px;
    font-size: 24px;
    font-weight: 800;
    border: 2px solid #ccc;
    border-radius: 8px;
    text-align: center;
    transition: .2s;
    /* 👇 NUEVO: ancho base, pero puede encogerse si hace falta */
    flex: 1 1 120px;
    max-width: 210px;
}

    .input-pequeno:focus[b-x2wlg4txoo] {
        border-color: #1e88e5;
        box-shadow: 0 0 5px rgba(30,136,229,.4);
        outline: none;
    }

.monto-corto[b-x2wlg4txoo] {
    width: 120px;
}

.numero-corto[b-x2wlg4txoo] {
    width: 120px;
}

/* ====== BOTÓN GUARDAR / IMPRIMIR ====== */
.btn-guardar[b-x2wlg4txoo] {
    background: linear-gradient(90deg,#1976d2,#1e88e5);
    color: #fff;
    border: none;
    border-radius: 10px;
    padding: 12px 22px;
    cursor: pointer;
    font-weight: 800;
    font-size: 16px;
    transition: .2s;
}

    .btn-guardar:hover[b-x2wlg4txoo] {
        background: linear-gradient(90deg,#1565c0,#1976d2);
    }

/* ====== TOTAL ====== */
.total[b-x2wlg4txoo] {
    font-size: 22px;
    font-weight: 800;
    text-align: right;
    color: #003c8f;
    margin-top: 10px;
}

@media (max-width:520px) {
    .tabla-lista[b-x2wlg4txoo] {
        grid-template-columns: 100px 140px 46px;
    }

        .tabla-lista.reventado[b-x2wlg4txoo] {
            grid-template-columns: minmax(70px, 1.1fr) /* N° */
            minmax(90px, 1.3fr) /* Monto */
            minmax(90px, 1.3fr) /* Monto R */
            minmax(34px, 0.5fr); /* X */
        }

    .celda[b-x2wlg4txoo] {
        font-size: 18px;
    }
}

/* ===== Panel de Números Prohibidos con título rojo, fecha y ajuste dinámico ===== */
.numeros-prohibidos-panel[b-x2wlg4txoo] {
    align-self: flex-start;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.1);
    padding: 16px 24px;
    border: 2px solid #c62828;
    text-align: center;
    display: inline-block;
    transition: all 0.3s ease;
    width: auto;
    height: auto;
    min-width: 240px;
}

    .numeros-prohibidos-panel h4[b-x2wlg4txoo] {
        color: #c62828;
        font-weight: 800;
        font-size: 1.45em;
        margin: 0 0 8px 0;
    }

.np-fecha[b-x2wlg4txoo] {
    font-size: 1.1em;
    font-weight: 700;
    color: #333;
    margin-top: 2px;
    margin-bottom: 10px;
    text-transform: capitalize;
}

.numeros-prohibidos[b-x2wlg4txoo] {
    list-style: none;
    padding: 0;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
}

    .numeros-prohibidos li[b-x2wlg4txoo] {
        color: #e53935;
        font-weight: 700;
        background: #ffebee;
        padding: 6px 12px;
        border-radius: 8px;
        min-width: 40px;
        text-align: center;
        font-size: 1.15em;
        transition: transform 0.2s ease, background 0.2s ease;
    }

        .numeros-prohibidos li:hover[b-x2wlg4txoo] {
            background: #ffcdd2;
            transform: scale(1.08);
        }

/* ==========================================================
   🧩 ENCABEZADO
   ========================================================== */
.ventas-encabezado[b-x2wlg4txoo] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding: 15px 25px 25px;
    background: linear-gradient(90deg, #f7f9fb, #e3f2fd);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    margin: 10px 20px 0;
}

.titulo-sorteo[b-x2wlg4txoo] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    position: relative;
}

.sorteo-selector-titulo[b-x2wlg4txoo] {
    position: relative;
    cursor: pointer;
    user-select: none;
    display: inline-block;
}

.sorteo-nombre[b-x2wlg4txoo] {
    font-size: 2.2em;
    font-weight: 800;
    color: #004aad;
    letter-spacing: 1px;
    margin: 0;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.15);
    animation: colorCambio-b-x2wlg4txoo 4s linear infinite;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: transform 0.2s ease;
}

    .sorteo-nombre:hover[b-x2wlg4txoo] {
        transform: scale(1.02);
    }

.flecha[b-x2wlg4txoo] {
    font-size: 0.6em;
    margin-left: 6px;
    transition: transform 0.3s ease;
}

.sorteo-selector-titulo:hover .flecha[b-x2wlg4txoo] {
    transform: rotate(180deg);
}

.menu-sorteos[b-x2wlg4txoo] {
    position: absolute;
    top: 100%;
    left: 0;
    transform: none;
    width: 220px;
    background: #ffffff;
    border: 2px solid #cfd8dc;
    border-radius: 10px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
    margin-top: 8px;
    padding: 6px 0;
    list-style: none;
    z-index: 20;
    animation: aparecerMenu-b-x2wlg4txoo 0.2s ease-out forwards;
}

    .menu-sorteos li[b-x2wlg4txoo] {
        font-weight: 700;
        color: #0d47a1;
        font-size: 1.1em;
        padding: 10px 16px;
        text-align: center;
        transition: all 0.2s ease;
        border-radius: 6px;
    }

        .menu-sorteos li:hover[b-x2wlg4txoo] {
            background: #e3f2fd;
            color: #003c8f;
            transform: scale(1.03);
        }

        .menu-sorteos li.activo[b-x2wlg4txoo] {
            background: #bbdefb;
            color: #0d47a1;
        }

@keyframes aparecerMenu-b-x2wlg4txoo {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes colorCambio-b-x2wlg4txoo {
    0% {
        color: #e53935;
    }

    25% {
        color: #f9a825;
    }

    50% {
        color: #1e88e5;
    }

    75% {
        color: #43a047;
    }

    100% {
        color: #e53935;
    }
}

.hora-info[b-x2wlg4txoo] {
    font-size: 1.05em;
    color: #0d47a1;
    font-weight: 600;
}

    .hora-info strong[b-x2wlg4txoo] {
        color: #1a237e;
    }

.hora-numero[b-x2wlg4txoo] {
    font-size: 1.4em;
    font-weight: 700;
    color: #0d47a1;
}

/* === Fecha centrada === */
.fecha-centro[b-x2wlg4txoo] {
    position: absolute;
    top: 85px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
}

.fecha-texto[b-x2wlg4txoo] {
    font-size: 1.35em;
    font-weight: 800;
    color: #2c3e50;
    text-transform: capitalize;
}

.hora-texto[b-x2wlg4txoo] {
    font-size: 1.15em;
    font-weight: 700;
    color: #1565c0;
    letter-spacing: 1px;
}

/* ==========================================================
   🧩 BOTONES SECUNDARIOS
   ========================================================== */
.acciones-internas[b-x2wlg4txoo] {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 15px;
}

.btn-secundario[b-x2wlg4txoo] {
    background: linear-gradient(90deg, #e3f2fd, #bbdefb);
    color: #0d47a1;
    border: 1px solid #64b5f6;
    border-radius: 8px;
    padding: 8px 14px;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.95rem;
    transition: 0.2s;
}

    .btn-secundario:hover[b-x2wlg4txoo] {
        background: linear-gradient(90deg, #bbdefb, #90caf9);
    }

.btn-guardar:active[b-x2wlg4txoo],
.menu-btn:active[b-x2wlg4txoo] {
    transform: scale(0.97);
}

/* ===============================
   🎯 CONTADOR DE TIEMPO RESTANTE
   =============================== */
.ventas-encabezado .contador[b-x2wlg4txoo],
.contador[b-x2wlg4txoo] {
    font-size: 1.5em;
    font-weight: 800;
    color: #d32f2f;
    background: none;
    border-radius: 0;
    padding: 0;
    min-width: 85px;
    text-align: center;
    transition: all 0.3s ease;
}

    .ventas-encabezado .contador.critico[b-x2wlg4txoo],
    .contador.critico[b-x2wlg4txoo] {
        animation: parpadeoRojo-b-x2wlg4txoo 1s infinite alternate ease-in-out;
    }

@keyframes parpadeoRojo-b-x2wlg4txoo {
    0% {
        color: #d32f2f;
        transform: scale(1);
    }

    50% {
        color: #ff0000;
        transform: scale(1.05);
    }

    100% {
        color: #b71c1c;
        transform: scale(1);
    }
}
/* ===========================
   PANEL DE NOTICIAS (derecha)
   =========================== */
.panel-noticias[b-x2wlg4txoo] {
    position: relative;
    width: 100%; /* ✅ que use la columna, no 520px fijo */
    max-width: 100%;
    background: #f7fbff;
    border-radius: 12px;
    padding: 14px 16px;
    height: auto;
    z-index: 10;
    margin-top: 0; /* ✅ nada raro */
    margin-left: 0; /* ✅ nada de empujar */
    box-sizing: border-box;
}

    .panel-noticias .header[b-x2wlg4txoo] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        margin-bottom: 10px;
    }

        .panel-noticias .header h3[b-x2wlg4txoo] {
            margin: 0;
            font-size: 1.25rem;
            font-weight: 900;
            color: #0d47a1;
            letter-spacing: .3px;
        }

    .panel-noticias .acciones[b-x2wlg4txoo] {
        display: flex;
        gap: 8px;
    }

.btn-icono[b-x2wlg4txoo] {
    border: 1px solid #c5d6f2;
    background: #e9f2ff;
    border-radius: 8px;
    padding: 6px 10px;
    font-weight: 700;
    cursor: pointer;
    transition: .2s;
}

    .btn-icono:hover[b-x2wlg4txoo] {
        background: #d9eaff;
    }

.noticias-scroll[b-x2wlg4txoo] {
    max-height: 520px;
    overflow-y: auto;
    padding-right: 6px;
    scrollbar-gutter: stable;
}

.noticia-card[b-x2wlg4txoo] {
    background: #ffffff;
    border: 2px solid #e6edf8;
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 10px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.04);
    transition: transform .15s ease, box-shadow .2s ease;
}

    .noticia-card:hover[b-x2wlg4txoo] {
        transform: translateY(-1px);
        box-shadow: 0 6px 16px rgba(0,0,0,0.08);
    }

.noticia-top[b-x2wlg4txoo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 6px;
}

.noticia-titulo[b-x2wlg4txoo] {
    font-weight: 900;
    font-size: 1.05rem;
    color: #153e75;
    margin: 0;
}

.badges[b-x2wlg4txoo] {
    display: flex;
    gap: 6px;
    align-items: center;
}

.badge[b-x2wlg4txoo] {
    padding: 3px 8px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 800;
}

.badge-todos[b-x2wlg4txoo] {
    background: #e8f5e9;
    color: #1b5e20;
    border: 1px solid #c8e6c9;
}

.badge-priv[b-x2wlg4txoo] {
    background: #fff3e0;
    color: #e65100;
    border: 1px solid #ffe0b2;
}

.badge-fecha[b-x2wlg4txoo] {
    background: #e3f2fd;
    color: #0d47a1;
    border: 1px solid #bbdefb;
}

.noticia-body[b-x2wlg4txoo] {
    color: #334155;
    line-height: 1.45;
    white-space: pre-wrap;
    margin-bottom: 8px;
}

.noticia-acciones[b-x2wlg4txoo] {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.btn-cerrar[b-x2wlg4txoo] {
    background: #ffe5e5;
    color: #b71c1c;
    border: 1px solid #ffcdd2;
    border-radius: 8px;
    padding: 6px 10px;
    font-weight: 800;
    cursor: pointer;
    transition: .2s;
}

    .btn-cerrar:hover[b-x2wlg4txoo] {
        background: #ffcccc;
    }

.noticia-leida[b-x2wlg4txoo] {
    opacity: .55;
}

.col-prohibidos[b-x2wlg4txoo] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
}

:root[b-x2wlg4txoo] {
    --ancho-prohibidos: 360px;
}

.col-prohibidos .numeros-prohibidos-panel[b-x2wlg4txoo] {
    width: var(--ancho-prohibidos);
}

.col-prohibidos .acciones-bajo-prohibidos[b-x2wlg4txoo] {
    width: var(--ancho-prohibidos);
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 20px;
}

/* === Estado bloqueado (sorteo cerrado) === */
.bloqueado[b-x2wlg4txoo] {
    opacity: 0.6;
    pointer-events: none;
    transition: opacity 0.3s ease;
    position: relative;
}

    .bloqueado[b-x2wlg4txoo]::after {
        content: "SORTEO CERRADO";
        position: absolute;
        top: 40%;
        left: 0;
        right: 0;
        text-align: center;
        font-weight: bold;
        font-size: 1.1rem;
        color: #b40000;
        background: rgba(255,255,255,0.85);
        border: 2px solid #b40000;
        border-radius: 8px;
        padding: 8px;
        width: 60%;
        margin: 0 auto;
        box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    }

/* ===== MODAL VER LISTA (escala dinámica) ===== */
.modal-overlay[b-x2wlg4txoo] {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0,0,0,.45);
    z-index: 99998 !important;
}

.modal-lista[b-x2wlg4txoo] {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 96vw !important;
    height: 90vh !important;
    background: #eaf3fb;
    border: 1px solid #b6d0e8;
    border-radius: 10px;
    padding: 10px 12px;
    padding-top: 0px;
    box-shadow: 0 10px 30px rgba(0,0,0,.25);
    z-index: 99999 !important;
    box-sizing: border-box;
    /* 🔹 ANTES: overflow: hidden !important; */
    overflow-y: auto !important; /* scroll vertical si hace falta */
    overflow-x: hidden !important; /* evitamos scroll horizontal feo */
}

body.modal-open[b-x2wlg4txoo] {
    overflow: hidden !important;
}

.modal-close[b-x2wlg4txoo] {
    border: none;
    background: #ffeded;
    color: #b40000;
    cursor: pointer;
    width: 30px;
    height: 30px;
    border-radius: 6px;
    font-size: 20px;
    position: absolute;
    top: 10px;
    right: 12px;
    z-index: 2;
}

    .modal-close:hover[b-x2wlg4txoo] {
        background: #ffd6d6;
    }

/* CONTENEDOR ÚNICO DEL CONTENIDO DE LA LISTA */
#listaCanvas[b-x2wlg4txoo] {
    width: 100%;
    height: 100%;
    padding: 10px 20px 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center; /* centrado horizontal */
    justify-content: flex-start; /* contenido pegado arriba, no al centro */
}

#contentLista[b-x2wlg4txoo] {
    display: inline-block; /* que mida según su tabla, no que se estire raro */
}

/* ============================
   🧱 ESTRUCTURA MODO NORMAL
   ============================ */
.lista-unica-normal[b-x2wlg4txoo] {
    width: 100%;
    max-width: 1150px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 0;
}

/* ============================
   🧱 ESTRUCTURA MODO REVENTADO
   ============================ */
.lista-unica-rev[b-x2wlg4txoo] {
    width: 100%;
    max-width: 1350px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 0;
}

/* === TÍTULO Y FECHA === */
.fila-titulo[b-x2wlg4txoo] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.titulo-sorteo-modal[b-x2wlg4txoo] {
    font-weight: 900;
    font-size: 1.6rem;
    color: #c68200;
}

.fecha-modal[b-x2wlg4txoo] {
    font-weight: 700;
    font-size: 1rem;
    color: #255;
}


/* ============================
   🧮 REJILLA PRINCIPAL
   ============================ */

/* Modo NORMAL: 5 bloques (N° + Monto) = 10 columnas */
.lista-unica-normal .fila-cabecera[b-x2wlg4txoo],
.lista-unica-normal .fila-numeros[b-x2wlg4txoo],
.lista-unica-normal .fila-totales-f[b-x2wlg4txoo] {
    display: grid;
    grid-template-columns: repeat(5, 78px 85px);
    column-gap: 4px;
    row-gap: 4px;
    justify-content: center;
}

/* Modo REVENTADO: 5 bloques (N° + Monto + R) = 15 columnas */
.lista-unica-rev .fila-cabecera[b-x2wlg4txoo],
.lista-unica-rev .fila-numeros[b-x2wlg4txoo],
.lista-unica-rev .fila-totales-f-rev[b-x2wlg4txoo] {
    display: grid;
    grid-template-columns: repeat(5, 64px 95px 95px);
    column-gap: 4px;
    row-gap: 4px;
    justify-content: center;
}

/* ============================
   🎨 CABECERAS (Actualizadas)
   ============================ */

/* 🔵 CABECERA N° */
.h-num[b-x2wlg4txoo] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #0d6efd; /* azul fuerte */
    color: white;
    font-size: 11px;
    font-weight: 900;
    border-radius: 6px;
    border: 1px solid #0a58ca;
    height: 22px;
    box-sizing: border-box;
}

/* 🟢 CABECERA MONTO */
.h-monto[b-x2wlg4txoo] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #3CB371; /* verde fuerte */
    color: white;
    font-size: 11px;
    font-weight: 900;
    border-radius: 6px;
    border: 1px solid #2e8b57;
    height: 22px;
    box-sizing: border-box;
}

/* 🔴 CABECERA REVENTADO (R) */
.h-monto-rev[b-x2wlg4txoo] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #E74C3C; /* rojo fuerte */
    color: white;
    font-size: 11px;
    font-weight: 900;
    border-radius: 6px;
    border: 1px solid #c0392b;
    height: 22px;
    box-sizing: border-box;
}

/* ============================
   🎨 CELDAS (N°, Monto, R)
   ============================ */
.celda-num[b-x2wlg4txoo],
.celda-monto[b-x2wlg4txoo],
.celda-monto-rev[b-x2wlg4txoo] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 800;
    padding: 0 6px;
    border-radius: 10px;
    height: 22px;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Número */
.celda-num[b-x2wlg4txoo] {
    background: #e4f1fb;
    color: #0a406e;
    border: 1px solid #8db7d8;
}

/* Monto normal */
.celda-monto[b-x2wlg4txoo] {
    background: #e9f7ef;
    color: #0a5c38;
    border: 1px solid #8cc7a9;
}

/* Monto reventado */
.celda-monto-rev[b-x2wlg4txoo] {
    background: #faecec;
    color: #b02222;
    border: 1px solid #d3a3a3;
}

/* Números prohibidos en rojo */
.celda-num.prohibido[b-x2wlg4txoo] {
    color: #d32f2f;
    font-size: 14px;
}

/* ============================================================
   🟦 TOTALES F1..F5 — MODO NORMAL (5 columnas x 2 = 10 celdas)
   Alineado EXACTO como las filas de números
   ============================================================ */
.fila-totales-f[b-x2wlg4txoo] {
    display: grid;
    grid-template-columns: repeat(10, 1fr); /* 5 pares (label + monto) */
    gap: 4px;
    margin-top: 4px;
}

    .fila-totales-f .label[b-x2wlg4txoo],
    .fila-totales-f .valor[b-x2wlg4txoo] {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 26px;
        font-size: 14px;
        font-weight: 950;
        border-radius: 6px;
        box-sizing: border-box;
        padding: 0 6px;
    }

    /* 🔵 Label: "Total F1", "Total F2"... */
    .fila-totales-f .label[b-x2wlg4txoo] {
        background: #eaf8ff; /* azul clarito */
        color: #0c6aa6; /* azul más fuerte */
        border: 1px dashed #0c6aa6; /* borde punteado */
        white-space: nowrap; /* 👉 evita que se parta en dos líneas */
    }

    /* 🟢 Monto normal */
    .fila-totales-f .valor[b-x2wlg4txoo] {
        background: #f1fff5; /* verde muy suave */
        color: #0f7a3a; /* verde más fuerte */
        border: 1px dashed #0f7a3a; /* borde punteado */
    }

/* ============================================================
   🔴 TOTALES F1..F5 — MODO REVENTADO (5 columnas x 3 = 15 celdas)
   (Label + Monto Normal + Monto R)
   ============================================================ */
.fila-totales-f-rev[b-x2wlg4txoo] {
    display: grid;
    grid-template-columns: repeat(15, 1fr); /* 5 grupos x 3 columnas */
    gap: 4px;
    margin-top: 4px;
}

    .fila-totales-f-rev .label[b-x2wlg4txoo],
    .fila-totales-f-rev .valor-normal[b-x2wlg4txoo],
    .fila-totales-f-rev .valor-rev[b-x2wlg4txoo] {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 26px;
        font-size: 14px;
        font-weight: 950;
        border-radius: 6px;
        box-sizing: border-box;
        padding: 0 6px;
    }

    /* 🔵 Label */
    .fila-totales-f-rev .label[b-x2wlg4txoo] {
        background: #eaf8ff;
        color: #0c6aa6;
        border: 1px dashed #0c6aa6;
        white-space: nowrap; /* 👉 igual: sin salto de línea */
    }

    /* 🟢 Monto normal */
    .fila-totales-f-rev .valor-normal[b-x2wlg4txoo] {
        background: #f1fff5;
        color: #0f7a3a;
        border: 1px dashed #0f7a3a;
    }

    /* 🔴 Monto reventado */
    .fila-totales-f-rev .valor-rev[b-x2wlg4txoo] {
        background: #fff5f5;
        color: #c62828;
        border: 1px dashed #c62828;
    }

/* Asegurar que nada se desborde raro */
#listaCanvas > div[b-x2wlg4txoo] {
    min-width: 0;
    min-height: 0;
}

/* === Popup de error de venta (centrado en la pantalla) === */
.venta-modal-backdrop[b-x2wlg4txoo] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999999;
}

.venta-modal[b-x2wlg4txoo] {
    background: #ffffff;
    border-radius: 14px;
    padding: 18px 22px 20px;
    max-width: 420px;
    width: 90%;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.35);
    animation: ventaModalIn-b-x2wlg4txoo 0.18s ease-out;
    text-align: left;
}

    .venta-modal h3[b-x2wlg4txoo] {
        margin: 0 0 10px 0;
        font-size: 1.15rem;
        font-weight: 800;
        color: #c62828;
    }

    .venta-modal p[b-x2wlg4txoo] {
        margin: 0 0 18px 0;
        line-height: 1.4;
        font-size: 0.95rem;
        white-space: pre-line;
        color: #333;
    }

    .venta-modal .btn.ok[b-x2wlg4txoo] {
        width: 100%;
        font-weight: 600;
    }

@keyframes ventaModalIn-b-x2wlg4txoo {
    from {
        opacity: 0;
        transform: translateY(10px) scale(0.97);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* ✅ Número mini para Parley (2 dígitos) */
.numero-mini[b-x2wlg4txoo] {
    width: 85px !important;
    max-width: 85px !important;
    padding: 10px !important;
    font-size: 20px !important;
    height: 48px;
}

.parley-tabla[b-x2wlg4txoo] {
    margin-top: 12px;
    border: 1px solid #e6edf8;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
}

.parley-header[b-x2wlg4txoo] {
    display: grid;
    grid-template-columns: 1fr 180px;
    font-weight: 900;
    background: #f3f7ff;
    border-bottom: 1px solid #e6edf8;
}

.parley-h-num[b-x2wlg4txoo], .parley-h-monto[b-x2wlg4txoo] {
    padding: 10px 12px;
}

.parley-row[b-x2wlg4txoo] {
    display: grid;
    grid-template-columns: 1fr 180px;
    border-bottom: 1px solid #eef3ff;
}

    .parley-row:last-child[b-x2wlg4txoo] {
        border-bottom: none;
    }

.parley-num[b-x2wlg4txoo], .parley-monto[b-x2wlg4txoo] {
    padding: 10px 12px;
    font-weight: 700;
}

.parley-monto[b-x2wlg4txoo] {
    text-align: right;
}

.parley-vacio[b-x2wlg4txoo] {
    padding: 14px 12px;
    font-weight: 700;
    opacity: .8;
}

/* =========================
   FECHA VENTA (Parley)
   - mismo estilo que usamos en Tiempos/Restricciones
   ========================= */

.fecha-venta-box[b-x2wlg4txoo] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid #e6edf8;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,.04);
    width: fit-content;
}

.fv-titulo[b-x2wlg4txoo] {
    font-weight: 900;
    color: #153e75;
    font-size: 1.05rem;
    margin-right: 6px;
}

/* ✅ FECHA GRANDE (igual a Restricciones) */
.fv-xl[b-x2wlg4txoo] {
    height: 56px !important;
    padding: 10px 14px !important;
    font-size: 1.35rem !important;
    font-weight: 900 !important;
    color: #153e75 !important;
    border: 1px solid #cfe0f5 !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.06) !important;
    box-sizing: border-box !important;
    line-height: 1.2 !important;
}

    .fv-xl[b-x2wlg4txoo]::-webkit-datetime-edit {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

    .fv-xl[b-x2wlg4txoo]::-webkit-datetime-edit-day-field,
    .fv-xl[b-x2wlg4txoo]::-webkit-datetime-edit-month-field,
    .fv-xl[b-x2wlg4txoo]::-webkit-datetime-edit-year-field {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

    .fv-xl[b-x2wlg4txoo]::-webkit-datetime-edit-text {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

    .fv-xl[b-x2wlg4txoo]::-webkit-calendar-picker-indicator {
        cursor: pointer;
        opacity: .80;
    }

.fv-hoy[b-x2wlg4txoo] {
    height: 56px;
    padding: 0 14px;
    border-radius: 10px;
    border: 1px solid #cfe0f5;
    background: #f6f7fb;
    font-weight: 900;
    color: #153e75;
    cursor: pointer;
}

    .fv-hoy:hover[b-x2wlg4txoo] {
        background: #eef5ff;
        border-color: #98bdf0;
    }

/* ==========================================================
   ✅ FIX ENCABEZADO PARLEY (MISMO DISEÑO QUE TIEMPOS)
   - Centra día/hora como en Tiempos
   - Caja Fecha de venta igual
   - Borde del encabezado más oscuro para que se note más
   ========================================================== */


/* 2) Centro: YA NO absoluto (igual que Tiempos) */
.fecha-centro[b-x2wlg4txoo] {
    position: static !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    margin: 0 auto !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 3px !important;
}

/* 3) Caja derecha (Fecha de venta) igual que Tiempos: en una sola fila */
.fecha-venta-box[b-x2wlg4txoo] {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    width: fit-content !important;
    min-width: 0 !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
    /* mantiene el estilo que ya usas, solo lo hacemos consistente */
    background: #eef6ff !important;
    border: 1px solid rgba(13, 71, 161, 0.25) !important;
}

/* 4) Input date grande EXACTO (si ya existe en tu Parley, lo refuerza) */
.fv-xl[b-x2wlg4txoo] {
    height: 56px !important;
    padding: 10px 14px !important;
    font-size: 1.35rem !important;
    font-weight: 900 !important;
    color: #153e75 !important;
    border: 1px solid #cfe0f5 !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.06) !important;
    box-sizing: border-box !important;
    line-height: 1.2 !important;
}

    .fv-xl[b-x2wlg4txoo]::-webkit-datetime-edit,
    .fv-xl[b-x2wlg4txoo]::-webkit-datetime-edit-day-field,
    .fv-xl[b-x2wlg4txoo]::-webkit-datetime-edit-month-field,
    .fv-xl[b-x2wlg4txoo]::-webkit-datetime-edit-year-field,
    .fv-xl[b-x2wlg4txoo]::-webkit-datetime-edit-text {
        font-size: 1.35rem !important;
        font-weight: 900 !important;
    }

/* 5) Botón Hoy: misma altura que el date */
.fv-hoy[b-x2wlg4txoo] {
    height: 56px !important;
    padding: 0 14px !important;
    border-radius: 10px !important;
}

/* ==========================================================
   ✅ PARLEY: COLUMNA CENTRAL tipo TIEMPOS (reservar espacio)
   y borde más oscuro para que se note más (como pediste)
   ========================================================== */

/* Caja “fantasma” central (equivale visualmente al panel de prohibidos en Tiempos) */
.parley-centro-placeholder[b-x2wlg4txoo] {
    width: 100%;
    min-height: 92px; /* altura parecida al bloque de prohibidos */
    border: 2px solid #7f8fa8; /* ✅ borde más oscuro */
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 3px 10px rgba(0,0,0,0.06);
}





/* 5) Botones debajo del placeholder, dentro de la misma columna */
.col-prohibidos .acciones-bajo-prohibidos[b-x2wlg4txoo] {
    width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important; /* si no caben, bajan dentro de la misma columna */
    gap: 10px !important;
    align-items: center !important;
    margin-top: 0 !important;
}


/* ==========================================================
   ✅ PATCH FINAL PARLEY (NO BORRA NADA)
   - Alinea botones con "Guardar / Imprimir"
   - Quita cuadro blanco (sin eliminar diseños)
   - Refuerza borde del panel noticias sin cambiar su estilo
   ========================================================== */

/* 1) La columna central mantiene su ancho como Tiempos */
.ventas-contenido > .col-prohibidos[b-x2wlg4txoo] {
    flex: 0 0 var(--ancho-prohibidos);
    min-width: var(--ancho-prohibidos);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    margin-top: 0 !important; /* 🔒 NO empujar la columna completa */
}

/* 3) Botones: pegados justo debajo del placeholder invisible */
.col-prohibidos .acciones-bajo-prohibidos[b-x2wlg4txoo] {
    width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    align-items: center !important;
    margin-top: 0 !important; /* ✅ QUITA el margin-top:20px que los baja raro */
}

/* ✅ TripletaS: 3 dígitos (D1/D2/D3) — mini, uno por caja */
.digito-mini[b-x2wlg4txoo] {
    width: 70px !important;
    max-width: 70px !important;
    padding: 10px !important;
    font-size: 22px !important;
    height: 48px;
    text-align: center;
    font-weight: 900;
}

@media (max-width: 520px) {
    .digito-mini[b-x2wlg4txoo] {
        width: 60px !important;
        max-width: 60px !important;
        font-size: 20px !important;
    }
}

/* ✅ Flecha rota cuando el menú está abierto */
.flecha.rotado[b-x2wlg4txoo] {
    transform: rotate(180deg);
}

/* Scroll solo cuando pase de 4 líneas */
#listaScroll[b-x2wlg4txoo] {
    overflow-y: auto;
    max-height: 260px; /* AJUSTA: sube/baja hasta que 4 líneas queden visibles */
}

/* Monto centrado en su propia fila */
.input-monto-centro[b-x2wlg4txoo] {
    justify-content: center;
}

/* Acciones abajo: Vender - Selector - Agregar */
.input-acciones-abajo[b-x2wlg4txoo] {
    justify-content: center;
    gap: 10px;
}


/* FILA DE MODALIDAD: centrada y más grande */
.modalidad-radio-row[b-x2wlg4txoo] {
    display: flex;
    justify-content: center; /* ✅ centrados */
    align-items: center;
    gap: 18px; /* más separación */
    margin: 10px 0 14px; /* más aire */
    width: 100%;
}

/* Cada opción más grande */
.modalidad-radio-item[b-x2wlg4txoo] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 12px;
    cursor: pointer;
    user-select: none;
}

.modalidad-radio-item.focused[b-x2wlg4txoo] {
    background: #e8f0fe;
    border-radius: 8px;
}

/* Modal modalidad: estilos en wwwroot/css/ventasTripletasModalidad.css (global, sin recorte) */

/* circulito más grande */
.radio-dot[b-x2wlg4txoo] {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 2px solid #2b6cb0;
    display: inline-block;
    position: relative;
}

    .radio-dot.on[b-x2wlg4txoo]::after {
        content: "";
        position: absolute;
        inset: 4px;
        border-radius: 50%;
        background: #2b6cb0;
    }

/* texto más grande */
.radio-text[b-x2wlg4txoo] {
    font-weight: 900;
    color: #153e75;
    font-size: 15px; /* ✅ más grande */
}

/* ✅ tabla lista: más flexible y más ancha sin desorden */
.tabla-lista-tripletas[b-x2wlg4txoo] {
    display: grid;
    grid-template-columns: 140px 1fr 160px 56px; /* modalidad se estira */
    width: 100%;
}

/* ✅ si quieres dar más ancho al panel izquierdo completo */
/* ✅ ANCHO REAL DEL PANEL IZQUIERDO (TripletaS/TIEMPOS/PARLEY) */
.ventas-contenido > .ventas-izquierda[b-x2wlg4txoo] {
    flex: 0 0 700px !important; /* ⬅️ este es el ancho fijo */
    max-width: 700px !important;
    min-width: 700px !important;
    width: 700px !important;
}


/* ✅ TripletaS - Cabecera "Modo" */
.h-modo[b-x2wlg4txoo] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #6c7ae0; /* morado/azul suave */
    color: #fff;
    font-size: 11px;
    font-weight: 900;
    border-radius: 6px;
    border: 1px solid #4e5bd3;
    height: 22px;
    box-sizing: border-box;
}

/* ✅ TripletaS - Celda Modo */
.celda-modo[b-x2wlg4txoo] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 800;
    padding: 0 6px;
    border-radius: 10px;
    height: 22px;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background: #eef1ff;
    color: #2f3a8f;
    border: 1px solid #aab3ff;
}

/* ============================
   MODAL LISTA TripletaS (ANCHO)
   ============================ */

.modal-lista.Tripletas[b-x2wlg4txoo] {
    width: 96vw;
    max-width: 1600px;
}

/* Grilla: 5 bloques * (N°,Modo,Monto) = 15 columnas */
.fila-cabecera.Tripletas[b-x2wlg4txoo],
.fila-numeros.Tripletas[b-x2wlg4txoo] {
    display: grid;
    grid-template-columns: 70px 90px 115px 70px 90px 115px 70px 90px 115px 70px 90px 115px 70px 90px 115px;
    gap: 6px;
}

    /* Cabeceras */
    .fila-cabecera.Tripletas .h-num[b-x2wlg4txoo],
    .fila-cabecera.Tripletas .h-modo[b-x2wlg4txoo],
    .fila-cabecera.Tripletas .h-monto[b-x2wlg4txoo] {
        font-size: 13px;
        padding: 6px 8px;
        border-radius: 7px;
    }

    /* Celdas */
    .fila-numeros.Tripletas .celda-num[b-x2wlg4txoo],
    .fila-numeros.Tripletas .celda-modo[b-x2wlg4txoo],
    .fila-numeros.Tripletas .celda-monto[b-x2wlg4txoo] {
        font-size: 14px;
        padding: 7px 8px;
        border-radius: 7px;
        min-height: 26px;
    }
/* =========================================================
   ✅ TOTALES TripletaS (con tu HTML actual)
   .fila-totales-f.Tripletas
   - 5 bloques x (N° / Modo / Monto) = 15 columnas
   - En cada bloque: 2 vacías + 1 celda "Total"
   ========================================================= */

.fila-totales-f.Tripletas[b-x2wlg4txoo] {
    display: grid;
    /* 15 columnas: N°, Modo, Monto repetido 5 veces */
    grid-template-columns: repeat(5, 70px 90px 115px);
    column-gap: 6px;
    row-gap: 6px;
    justify-content: center;
    margin-top: 6px;
}

    /* tus dos <div></div> vacíos: que tengan altura para no colapsar */
    .fila-totales-f.Tripletas > div:empty[b-x2wlg4txoo] {
        min-height: 26px;
    }

    /* la celda donde va "Total F1: 0" ocupa la columna Monto del bloque */
    .fila-totales-f.Tripletas .total-monto[b-x2wlg4txoo] {
        display: flex;
        align-items: center;
        justify-content: space-between; /* label izquierda, valor derecha */
        gap: 8px;
        /* altura igual a totales/celdas */
        height: 26px;
        padding: 0 10px;
        /* mismo look de totales (punteado) */
        background: #f1fff5;
        border: 1px dashed #0f7a3a;
        border-radius: 6px;
        box-sizing: border-box;
    }

        /* label "Total F1:" */
        .fila-totales-f.Tripletas .total-monto .label[b-x2wlg4txoo] {
            font-weight: 950;
            font-size: 13px;
            color: #0c6aa6;
            white-space: nowrap;
        }

        /* valor (0) */
        .fila-totales-f.Tripletas .total-monto .valor[b-x2wlg4txoo] {
            font-weight: 950;
            font-size: 14px;
            color: #0f7a3a;
            white-space: nowrap;
        }

/* ✅ Tripletas: Totales F alineados (Label bajo Modo, Valor bajo Monto) */
.fila-totales-f.Tripletas[b-x2wlg4txoo] {
    /* asegura que use la MISMA grilla que tus filas Tripletas (N°,Modo,Monto x5) */
    display: grid;
    grid-template-columns: repeat(5, 70px 90px 115px);
    column-gap: 6px;
    row-gap: 6px;
    justify-content: center;
    margin-top: 6px;
}

    .fila-totales-f.Tripletas .total-f-label[b-x2wlg4txoo],
    .fila-totales-f.Tripletas .total-f-valor[b-x2wlg4txoo] {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 26px;
        font-size: 14px;
        font-weight: 950;
        border-radius: 6px;
        box-sizing: border-box;
        padding: 0 6px;
        white-space: nowrap;
    }

    /* Label (en la columna Modo) */
    .fila-totales-f.Tripletas .total-f-label[b-x2wlg4txoo] {
        background: #eaf8ff;
        color: #0c6aa6;
        border: 1px dashed #0c6aa6;
    }

    /* Valor (en la columna Monto) */
    .fila-totales-f.Tripletas .total-f-valor[b-x2wlg4txoo] {
        background: #f1fff5;
        color: #0f7a3a;
        border: 1px dashed #0f7a3a;
    }

/* ✅ Tripletas: Total arriba más grande */
.fila-totales-normal .label[b-x2wlg4txoo] {
    font-size: 15px; /* antes se ve pequeño */
    font-weight: 900;
}

.fila-totales-normal .valor[b-x2wlg4txoo] {
    font-size: 18px; /* el monto más grande */
    font-weight: 950;
}

/* =========================================
   TripletaS: Centro + PanelNoticias a la derecha
   (solo layout, no toca estilos del panel)
   ========================================= */
.Tripletas-centro-noticias[b-x2wlg4txoo] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    width: 100%;
}

    .Tripletas-centro-noticias .col-prohibidos[b-x2wlg4txoo] {
        flex: 1 1 auto;
        min-width: 0;
    }

.Tripletas-noticias-right[b-x2wlg4txoo] {
    flex: 0 0 360px; /* ancho del panel */
    max-width: 360px;
}

    /* que el panel use el 100% de su columna */
    .Tripletas-noticias-right .panel-noticias[b-x2wlg4txoo] {
        width: 100%;
    }

/* Responsive: si la pantalla se hace pequeña, baja debajo */
@media (max-width: 1100px) {
    .Tripletas-centro-noticias[b-x2wlg4txoo] {
        flex-direction: column;
    }

    .Tripletas-noticias-right[b-x2wlg4txoo] {
        flex: 1 1 auto;
        max-width: 100%;
    }
}

.ventas-contenido[b-x2wlg4txoo] {
    margin-top: 0; /* alinea con el encabezado */
}

    /* =========================================================
   ✅ TripletaS - MISMO ACOMODO QUE TIEMPOS
   Col 1: Panel pedidos (izquierda)
   Col 2: Botones secundarios (centro)
   Col 3: Noticias (derecha)
   ========================================================= */

    .ventas-contenido.ventas-contenido-tripletas > .ventas-izquierda[b-x2wlg4txoo] {
        grid-column: 1;
        justify-self: start; /* pegado al borde izquierdo */
        align-self: start;
    }


    /* Layout Tripletas: ver wwwroot/css/ventasAccionesToolbar.css (sin márgenes negativos) */

/* =========================
   WHATSAPP (BOTÓN + MODAL + MODAL IMAGEN)
   (Copiado desde Tiempos)
========================= */

/* ===== Botón WhatsApp ===== */
.wa-btn2[b-x2wlg4txoo] {
    width: fit-content;
    max-width: 420px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 11px 14px;
    border-radius: 12px;
    border: 2px solid rgba(37, 211, 102, .75);
    background: linear-gradient(180deg, rgba(37,211,102,.22), rgba(18,140,126,.12));
    color: #0b2b16;
    font-weight: 900;
    font-size: 15px;
    line-height: 1;
    box-shadow: 0 10px 22px rgba(0,0,0,.12);
}

    .wa-btn2:hover[b-x2wlg4txoo] {
        filter: brightness(1.05);
    }

    .wa-btn2:disabled[b-x2wlg4txoo] {
        opacity: .5;
        cursor: not-allowed;
        filter: none;
    }

.wa-btn2__icon[b-x2wlg4txoo] {
    width: 28px;
    height: 28px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.70);
    border: 1px solid rgba(0,0,0,.08);
    flex: 0 0 auto;
}

    .wa-btn2__icon svg[b-x2wlg4txoo] {
        width: 18px;
        height: 18px;
        display: block;
    }

.wa-btn2__text[b-x2wlg4txoo] {
    white-space: nowrap;
}

/* ===== Modal principal WhatsApp ===== */
.wa2-backdrop[b-x2wlg4txoo] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.64);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    z-index: 99999;
}

.wa2-modal[b-x2wlg4txoo] {
    width: min(720px, 96vw);
    background: #0f1420;
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 30px 70px rgba(0,0,0,.65);
}

.wa2-header[b-x2wlg4txoo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 16px;
    background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0));
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.wa2-title[b-x2wlg4txoo] {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #fff;
}

.wa2-badge[b-x2wlg4txoo] {
    width: 44px;
    height: 44px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: rgba(37,211,102,.14);
    border: 1px solid rgba(37,211,102,.25);
    color: #25D366;
}

    .wa2-badge svg[b-x2wlg4txoo] {
        width: 22px;
        height: 22px;
        display: block;
    }

.wa2-title__main[b-x2wlg4txoo] {
    font-weight: 900;
    font-size: 17px;
    line-height: 1.1;
}

.wa2-title__sub[b-x2wlg4txoo] {
    font-size: 14px;
    opacity: .85;
    margin-top: 2px;
}

.wa2-x[b-x2wlg4txoo] {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.06);
    color: #fff;
    cursor: pointer;
}

    .wa2-x:hover[b-x2wlg4txoo] {
        filter: brightness(1.1);
    }

.wa2-body[b-x2wlg4txoo] {
    padding: 16px;
}

.wa2-grid[b-x2wlg4txoo] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

@media (max-width: 640px) {
    .wa2-grid[b-x2wlg4txoo] {
        grid-template-columns: 1fr;
    }
}

.wa2-field[b-x2wlg4txoo] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.wa2-label[b-x2wlg4txoo] {
    font-size: 14px;
    opacity: .85;
    color: #dfe7ff;
}

.wa2-input[b-x2wlg4txoo], .wa2-select[b-x2wlg4txoo] {
    width: 100%;
    padding: 12px 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.06);
    color: #fff;
    outline: none;
}

    .wa2-input[b-x2wlg4txoo]::placeholder {
        color: rgba(255,255,255,.55);
    }

.wa2-actions[b-x2wlg4txoo] {
    margin-top: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.wa2-actions__right[b-x2wlg4txoo] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.wa2-btn[b-x2wlg4txoo] {
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.06);
    color: #fff;
    cursor: pointer;
    font-weight: 800;
}

    .wa2-btn:hover[b-x2wlg4txoo] {
        filter: brightness(1.08);
    }

.wa2-btn--ghost[b-x2wlg4txoo] {
    background: transparent;
}

.wa2-btn--soft[b-x2wlg4txoo] {
    background: rgba(37,211,102,.10);
    border-color: rgba(37,211,102,.22);
}

.wa2-btn--primary[b-x2wlg4txoo] {
    background: linear-gradient(180deg, rgba(37,211,102,.35), rgba(18,140,126,.25));
    border-color: rgba(37,211,102,.35);
}

.wa2-note[b-x2wlg4txoo] {
    margin-top: 12px;
    padding: 12px 12px;
    border-radius: 14px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.10);
    color: #e8f0ff;
    font-size: 14px;
    line-height: 1.35;
}

/* ===== Modal Imagen ===== */
.wa-img-backdrop[b-x2wlg4txoo] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.75);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px;
    z-index: 100000;
}

.wa-img-modal[b-x2wlg4txoo] {
    width: min(820px, 96vw);
    max-height: 92vh;
    background: #0f1420;
    border-radius: 18px;
    padding: 14px;
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 30px 70px rgba(0,0,0,.65);
    overflow: auto;
}

    .wa-img-modal h3[b-x2wlg4txoo] {
        margin: 0 0 10px 0;
        color: #fff;
        font-weight: 900;
        font-size: 18px;
    }

.wa-ticket-img[b-x2wlg4txoo] {
    width: 100%;
    height: auto;
    max-height: calc(92vh - 170px);
    object-fit: contain;
    display: block;
}

.wa-actions[b-x2wlg4txoo] {
    margin-top: 12px;
    display: flex;
    justify-content: center;
    gap: 10px;
}

.btn-guardar.ok[b-x2wlg4txoo] {
    padding: 10px 16px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(37,211,102,.12);
    color: #fff;
    font-weight: 900;
    cursor: pointer;
}

    .btn-guardar.ok:hover[b-x2wlg4txoo] {
        filter: brightness(1.08);
    }


/* _content/SistemaLoteriaDashboard/Pages/Banca.razor.rz.scp.css */
/* ===== Layout base ===== */
.banca-wrap[b-4bmxjj0619] {
    padding: 10px 20px 24px;
    font-family: 'Segoe UI', Tahoma, sans-serif;
    color: #1d2a3b;
}

/* ===== Tabs en la barra superior ===== */
.banca-tabs[b-4bmxjj0619] {
    display: flex;
    align-items: center;
    gap: 6px;
    background: #123a6c;
    padding: 8px 10px;
    border-radius: 8px;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.12);
    flex-wrap: wrap;
    overflow: visible;
    position: relative;
    z-index: 20;
}

/* Contenedor para el dropdown de "Configuración de sorteos" */
.tab-dropdown[b-4bmxjj0619] {
    position: relative;
    display: inline-block;
}

.tab-btn[b-4bmxjj0619] {
    background: transparent;
    color: #eaf2ff;
    border: 1px solid transparent;
    padding: 8px 12px;
    border-radius: 6px;
    font-weight: 700;
    cursor: pointer;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
    user-select: none;
    white-space: nowrap;
}

.tab-dropdown .tab-btn[b-4bmxjj0619] {
    display: flex;
    align-items: center;
    gap: 4px; /* pequeño espacio entre texto y flecha ▾ si la usas */
}

.tab-btn:hover[b-4bmxjj0619] {
    background: rgba(255,255,255,.15);
}

.tab-btn.active[b-4bmxjj0619] {
    background: #ffffff;
    color: #123a6c;
    border-color: #d8e4f5;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.12);
}

.cerrar-sesion[b-4bmxjj0619] {
    margin-left: auto;
    background: #c62828;
    color: #fff;
    border: none;
    padding: 8px 12px;
    border-radius: 6px;
    font-weight: 800;
    cursor: pointer;
    transition: background .15s ease, box-shadow .15s ease;
    white-space: nowrap;
}

    .cerrar-sesion:hover[b-4bmxjj0619] {
        filter: brightness(.95);
    }

/* ===== Menú desplegable de "Configuración de sorteos" ===== */

/* El contenedor del botón + menú */
.tab-dropdown[b-4bmxjj0619] {
    position: relative;
    display: inline-block;
}

/* Caja que baja debajo del botón (vertical) */
.submenu-config[b-4bmxjj0619] {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.22);
    min-width: 250px;
    padding: 6px 0;
    border: 1px solid #d9e2f5;
    z-index: 10000;
    animation: submenuFadeIn-b-4bmxjj0619 0.15s ease-out;
}

.submenu-overlay[b-4bmxjj0619] {
    position: fixed;
    inset: 0;
    background: transparent;
    z-index: 9998;
}

.submenu-config-mobile-safe[b-4bmxjj0619] {
    z-index: 9999;
}

/* Cada opción del submenú (UNA DEBAJO DE OTRA) */
.submenu-item[b-4bmxjj0619] {
    display: flex; /* importante para que ocupe toda la fila */
    align-items: center;
    width: 100%;
    text-align: left;
    border: none;
    background: transparent;
    padding: 9px 16px;
    font-size: 0.9rem;
    color: #123a6c;
    cursor: pointer;
    gap: 8px;
    transition: background 0.15s ease, color 0.15s ease, padding-left 0.15s ease;
}

    /* Icono “bolita” decorativa a la izquierda (opcional) */
    .submenu-item[b-4bmxjj0619]::before {
        content: "●";
        font-size: 0.55rem;
        color: #9bb4e8;
    }

    /* Hover: más moderno */
    .submenu-item:hover[b-4bmxjj0619] {
        background: #e3f2fd;
        color: #0d47a1;
        padding-left: 20px;
    }

    /* Activo: resalta la opción seleccionada */
    .submenu-item.active[b-4bmxjj0619] {
        background: #dbeafe;
        color: #0d47a1;
        font-weight: 700;
    }

/* Animación suave al aparecer el menú */
@keyframes submenuFadeIn-b-4bmxjj0619 {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ===== Encabezado (fecha y hora) ===== */
.banca-encabezado[b-4bmxjj0619] {
    margin-top: 10px;
    background: #e9f1fb;
    border: 1px solid #dbe6f7;
    border-radius: 12px;
    padding: 12px 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #153e75;
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(0,0,0,.05);
}

.enc-izq[b-4bmxjj0619] {
    flex: 0 0 auto;
    font-weight: 800;
    color: #123a6c;
}

.enc-der[b-4bmxjj0619] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    min-width: 0;
    flex-wrap: wrap;
}

.enc-hora[b-4bmxjj0619] {
    min-width: 92px;
    text-align: right;
    font-weight: 900;
    color: #123a6c;
}

.enc-metric[b-4bmxjj0619] {
    min-width: 122px;
    padding: 6px 9px;
    border-radius: 8px;
    border: 1px solid #d8e4f5;
    background: #ffffff;
}

.enc-metric-label[b-4bmxjj0619] {
    font-size: 10px;
    color: #5b6b82;
    font-weight: 800;
    line-height: 1.1;
}

.enc-metric-value[b-4bmxjj0619] {
    margin-top: 2px;
    font-size: 15px;
    font-weight: 950;
    color: #123a6c;
    line-height: 1.15;
}

.enc-metric-banca .enc-metric-value[b-4bmxjj0619] {
    color: #0c7a43;
}

.enc-metric-vendedores .enc-metric-value[b-4bmxjj0619] {
    color: #4b35a6;
}

.enc-metric-value.is-positive[b-4bmxjj0619] {
    color: #0c7a43;
}

.enc-metric-value.is-negative[b-4bmxjj0619] {
    color: #c62828;
}

.enc-refresh[b-4bmxjj0619] {
    min-height: 34px;
    padding: 7px 11px;
    border: none;
    border-radius: 6px;
    background: #1565c0;
    color: #ffffff;
    font-weight: 900;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.14);
}

    .enc-refresh:disabled[b-4bmxjj0619] {
        opacity: .65;
        cursor: not-allowed;
    }

/* ===== Contenido ===== */
.banca-contenido[b-4bmxjj0619] {
    margin-top: 14px;
    min-width: 0;
}

/* ===== KPI Cards ===== */
.kpi-grid[b-4bmxjj0619] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.kpi-card[b-4bmxjj0619] {
    background: #fff;
    border: 1px solid #e6edf8;
    border-radius: 14px;
    padding: 16px 18px;
    box-shadow: 0 2px 8px rgba(0,0,0,.05);
}

.kpi-titulo[b-4bmxjj0619] {
    font-size: .95rem;
    font-weight: 800;
    color: #153e75;
    margin-bottom: 8px;
}

.kpi-valor[b-4bmxjj0619] {
    font-size: 1.6rem;
    font-weight: 900;
    color: #0a3d91;
}

/* Panel libre por si se agregan gráficos */
.panel-vacio[b-4bmxjj0619] {
    margin-top: 12px;
    min-height: 140px;
    border: 1px dashed #c7d8f3;
    border-radius: 12px;
    background: linear-gradient(180deg,#fbfdff,#f7fbff);
}

/* ===== Cards genéricas ===== */
.card[b-4bmxjj0619] {
    background: #ffffff;
    border: 1px solid #dfe8f5;
    border-radius: 8px;
    padding: 16px;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
    min-width: 0;
    overflow: visible;
}

    .card + .card[b-4bmxjj0619] {
        margin-top: 12px;
    }

.card-titulo[b-4bmxjj0619] {
    font-weight: 900;
    font-size: 1.05rem;
    color: #123a6c;
    margin-bottom: 12px;
    line-height: 1.25;
}

/* Acciones de cabecera (generales) */
.acciones[b-4bmxjj0619] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 12px;
}


/* Botones e inputs (generales) */
.btn[b-4bmxjj0619] {
    background: #1565c0;
    color: #ffffff;
    border: 1px solid #155fae;
    padding: 8px 12px;
    border-radius: 6px;
    font-weight: 800;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}

    .btn:hover[b-4bmxjj0619] {
        filter: brightness(.95);
    }

.btn-secondary[b-4bmxjj0619] {
    background: #60758f;
    border-color: #566a82;
    color: #ffffff;
}

.btn-danger[b-4bmxjj0619] {
    background: #c62828;
    border-color: #b71c1c;
    color: #ffffff;
}

.btn-small[b-4bmxjj0619] {
    padding: 6px 10px;
    font-weight: 600;
    border-radius: 7px;
}

.btn:disabled[b-4bmxjj0619] {
    opacity: .62;
    cursor: not-allowed;
    box-shadow: none;
}

.input[b-4bmxjj0619],
select.input[b-4bmxjj0619],
textarea.input[b-4bmxjj0619] {
    padding: 10px 12px;
    border: 1px solid #d8e3f2;
    border-radius: 6px;
    outline: none;
    font: inherit;
    background: #ffffff;
    color: #172033;
    transition: box-shadow .15s, border-color .15s;
}

    .input:focus[b-4bmxjj0619],
    select.input:focus[b-4bmxjj0619],
    textarea.input:focus[b-4bmxjj0619] {
        box-shadow: 0 0 0 3px rgba(21,62,117,.12);
        border-color: #cfe0fb;
    }

    .input:hover[b-4bmxjj0619] {
        border-color: #cfd9ee;
    }

    .input:focus-visible[b-4bmxjj0619] {
        outline: none;
    }

select.input[b-4bmxjj0619] {
    cursor: pointer;
}

textarea.input[b-4bmxjj0619] {
    resize: vertical;
    min-height: 92px;
    line-height: 1.35;
}

    .input[b-4bmxjj0619]::placeholder,
    textarea.input[b-4bmxjj0619]::placeholder {
        color: #8b9ab0;
    }

/* Formulario genérico */
.form-row[b-4bmxjj0619] {
    display: grid;
    grid-template-columns: 170px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

    .form-row > label[b-4bmxjj0619] {
        font-weight: 800;
        color: #123a6c;
        font-size: 0.92rem;
        line-height: 1.25;
    }

/* Campos numéricos */
input[type="number"].input[b-4bmxjj0619] {
    -moz-appearance: textfield;
}

    input[type="number"].input[b-4bmxjj0619]::-webkit-outer-spin-button,
    input[type="number"].input[b-4bmxjj0619]::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

/* Toggle (genérico) */
.switch[b-4bmxjj0619] {
    position: relative;
    width: 44px;
    height: 24px;
}

    .switch input[b-4bmxjj0619] {
        appearance: none;
        width: 44px;
        height: 24px;
        background: #cdd9ee;
        border-radius: 999px;
        outline: none;
        cursor: pointer;
        transition: background .2s;
    }

        .switch input:checked[b-4bmxjj0619] {
            background: #3b73ff;
        }

        .switch input[b-4bmxjj0619]::after {
            content: "";
            position: absolute;
            width: 18px;
            height: 18px;
            top: 3px;
            left: 3px;
            background: #fff;
            border-radius: 50%;
            transition: transform .2s;
            box-shadow: 0 1px 3px rgba(0,0,0,.25);
        }

        .switch input:checked[b-4bmxjj0619]::after {
            transform: translateX(20px);
        }

/* Pills / tags */
.pill[b-4bmxjj0619] {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 700;
    background: #eef3ff;
    color: #264d99;
}

/* ===== Tabla base (genérica) ===== */
.tabla[b-4bmxjj0619] {
    width: 100%;
    border: 1px solid #dfe8f5;
    border-radius: 8px;
    overflow: hidden;
    background: #ffffff;
}

.tabla-header[b-4bmxjj0619],
.tabla-body .fila[b-4bmxjj0619] {
    display: grid; /* columnas definidas por tabla-xxx */
    gap: 0;
}

.tabla-header[b-4bmxjj0619] {
    background: #eef4fb;
    color: #123a6c;
    font-weight: 900;
    border-bottom: 1px solid #dfe8f5;
    font-size: 0.88rem;
}


    .tabla-header > div[b-4bmxjj0619],
    .tabla-body .fila > div[b-4bmxjj0619] {
        padding: 9px 11px;
        border-right: 1px solid #edf2f8;
        min-width: 0;
    }


        .tabla-header > div:last-child[b-4bmxjj0619],
        .tabla-body .fila > div:last-child[b-4bmxjj0619] {
            border-right: none;
        }

.tabla-body .fila[b-4bmxjj0619] {
    background: #ffffff;
    transition: background .12s ease;
}

    .tabla-body .fila:nth-child(even)[b-4bmxjj0619] {
        background: #f8fbff;
    }

    .tabla-body .fila:hover[b-4bmxjj0619] {
        background: #eef6ff;
    }



/* Placeholder de vacío */
.fila-placeholder[b-4bmxjj0619] {
    padding: 16px;
    color: #607089;
    font-style: normal;
    background: #f8fbff;
    border: 1px dashed #cfdced;
    border-radius: 8px;
}

/* ===========================
   ESPECÍFICO: TABLA SORTEOS
   =========================== */
.tabla-sorteos .tabla-header[b-4bmxjj0619],
.tabla-sorteos .tabla-body .fila[b-4bmxjj0619] {
    /* ID | Nombre | Hora cierre | Activo | Acciones */
    grid-template-columns: .6fr 2fr 1.2fr .8fr 1.2fr;
}

/* ===========================
   Responsivo
   =========================== */
@media (max-width: 1100px) {
    .kpi-grid[b-4bmxjj0619] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .banca-wrap[b-4bmxjj0619] {
        padding: 10px 12px 18px;
    }

    .banca-tabs[b-4bmxjj0619] {
        gap: 8px;
    }

    .tab-btn[b-4bmxjj0619] {
        padding: 9px 10px;
        font-size: 0.9rem;
    }

    .banca-encabezado[b-4bmxjj0619] {
        flex-wrap: wrap;
        gap: 10px;
    }

    .enc-der[b-4bmxjj0619] {
        width: 100%;
        justify-content: flex-start;
    }

    .kpi-grid[b-4bmxjj0619] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    /* ===== Contenedor general ===== */
    .banca-wrap[b-4bmxjj0619] {
        padding: 8px 10px 16px;
    }

    .banca-contenido[b-4bmxjj0619] {
        margin-top: 12px;
    }

    .card[b-4bmxjj0619] {
        padding: 12px;
        border-radius: 10px;
    }

    .card-titulo[b-4bmxjj0619] {
        font-size: 1rem;
        margin-bottom: 10px;
        line-height: 1.25;
    }

    /* ===== Barra superior ===== */
    .banca-tabs[b-4bmxjj0619] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        align-items: stretch;
        gap: 8px;
        padding: 10px;
        border-radius: 8px;
        overflow: visible;
    }

    .tab-dropdown[b-4bmxjj0619] {
        position: static;
        display: block;
        width: 100%;
        min-width: 0;
    }

    .tab-btn[b-4bmxjj0619],
    .cerrar-sesion[b-4bmxjj0619] {
        width: 100%;
        min-height: 42px;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: 9px 10px;
        font-size: 0.88rem;
        line-height: 1.15;
        white-space: normal;
    }

    .tab-dropdown .tab-btn[b-4bmxjj0619] {
        justify-content: center;
    }

    .cerrar-sesion[b-4bmxjj0619] {
        margin-left: 0;
    }

    /* ===== Overlay desactivado solo en móvil ===== */
    .submenu-overlay[b-4bmxjj0619] {
        display: none;
    }

    /* ===== Submenús ===== */
    .submenu-config-mobile-safe[b-4bmxjj0619] {
        position: static !important;
        top: auto !important;
        left: auto !important;
        width: 100%;
        min-width: 0;
        margin-top: 8px;
        box-sizing: border-box;
        border-radius: 10px;
        overflow: hidden;
        z-index: 1;
    }

    .submenu-item[b-4bmxjj0619] {
        position: relative;
        z-index: 2;
        min-height: 44px;
        padding: 11px 14px;
        font-size: 0.95rem;
        white-space: normal;
        line-height: 1.25;
        touch-action: manipulation;
    }

        .submenu-item:hover[b-4bmxjj0619] {
            padding-left: 14px;
        }

    /* ===== Encabezado ===== */
    .banca-encabezado[b-4bmxjj0619] {
        margin-top: 10px;
        padding: 10px 12px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .enc-izq[b-4bmxjj0619],
    .enc-der[b-4bmxjj0619] {
        width: 100%;
        word-break: break-word;
    }

    .enc-der[b-4bmxjj0619] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }

    .enc-hora[b-4bmxjj0619] {
        grid-column: 1 / -1;
        width: 100%;
        text-align: left;
    }

    .enc-metric[b-4bmxjj0619] {
        min-width: 0;
        width: 100%;
        box-sizing: border-box;
    }

    .enc-refresh[b-4bmxjj0619] {
        grid-column: 1 / -1;
        width: 100%;
    }

    /* ===== KPI ===== */
    .kpi-grid[b-4bmxjj0619] {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .kpi-card[b-4bmxjj0619] {
        padding: 14px;
    }

    .kpi-titulo[b-4bmxjj0619] {
        font-size: 0.92rem;
    }

    .kpi-valor[b-4bmxjj0619] {
        font-size: 1.35rem;
        line-height: 1.2;
    }

    /* ===== Acciones ===== */
    .acciones[b-4bmxjj0619] {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

        .acciones .btn[b-4bmxjj0619],
        .acciones .btn-secondary[b-4bmxjj0619],
        .acciones .btn-danger[b-4bmxjj0619],
        .acciones .btn-small[b-4bmxjj0619] {
            width: 100%;
            min-height: 44px;
        }

    .btn[b-4bmxjj0619],
    .btn-secondary[b-4bmxjj0619],
    .btn-danger[b-4bmxjj0619],
    .btn-small[b-4bmxjj0619] {
        min-height: 44px;
        padding: 10px 12px;
        font-size: 0.95rem;
    }

    /* ===== Formularios ===== */
    .form-row[b-4bmxjj0619] {
        grid-template-columns: 1fr;
        gap: 6px;
        margin-bottom: 12px;
        align-items: stretch;
    }

        .form-row > label[b-4bmxjj0619] {
            font-size: 0.95rem;
        }

    .input[b-4bmxjj0619],
    select.input[b-4bmxjj0619],
    textarea.input[b-4bmxjj0619] {
        width: 100%;
        box-sizing: border-box;
        min-height: 44px;
        font-size: 16px;
        padding: 10px 12px;
    }

    textarea.input[b-4bmxjj0619] {
        min-height: 96px;
    }

    /* ===== Tablas ===== */
    .tabla[b-4bmxjj0619] {
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
    }

    .tabla-sorteos .tabla-header[b-4bmxjj0619],
    .tabla-sorteos .tabla-body .fila[b-4bmxjj0619] {
        min-width: 720px;
    }

    /* ===== Placeholders ===== */
    .fila-placeholder[b-4bmxjj0619] {
        padding: 14px 10px;
        font-size: 0.95rem;
        line-height: 1.35;
    }

    /* ===== Ahorro / Préstamo ===== */
    .ap-wrap[b-4bmxjj0619] {
        padding: 0;
    }

    .ap-subtabs[b-4bmxjj0619] {
        display: flex;
        flex-direction: column;
        gap: 8px;
        padding: 8px;
        margin-bottom: 12px;
    }

    .ap-subtab[b-4bmxjj0619] {
        width: 100%;
        min-height: 44px;
        padding: 10px 12px;
        font-size: 0.96rem;
    }

    /* ===== Toasts ===== */
    .toast-ok[b-4bmxjj0619],
    .toast-error[b-4bmxjj0619] {
        min-width: auto;
        width: calc(100vw - 24px);
        max-width: 420px;
        padding: 14px 16px;
        font-size: 0.98rem;
        line-height: 1.35;
    }
}

/* ===== Toasts ===== */
.toast-ok[b-4bmxjj0619],
.toast-error[b-4bmxjj0619] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    min-width: 380px;
    text-align: center;
    padding: 18px 22px;
    border-radius: 10px;
    color: white;
    font-weight: 600;
    font-size: 1.1rem;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.25);
    animation: aparecer-b-4bmxjj0619 0.4s ease-out;
    z-index: 9999;
}

.toast-ok[b-4bmxjj0619] {
    background-color: #28a745; /* Verde éxito */
}

.toast-error[b-4bmxjj0619] {
    background-color: #dc3545; /* Rojo error */
}

@keyframes aparecer-b-4bmxjj0619 {
    from {
        opacity: 0;
        transform: translate(-50%, -60%);
    }

    to {
        opacity: 1;
        transform: translate(-50%, -50%);
    }
}

/* Contenedor del contenido de configuración (se sigue usando) */
.config-contenido[b-4bmxjj0619] {
    margin-top: 4px;
}

/* Submenú interno Ahorros/Préstamos en /banca */
.ap-wrap[b-4bmxjj0619] {
    padding: 10px;
}

.ap-subtabs[b-4bmxjj0619] {
    display: flex;
    gap: 10px;
    padding: 10px;
    border-radius: 12px;
    background: linear-gradient(180deg, #f7faff, #ffffff);
    border: 1px solid #d8e3f2;
    margin-bottom: 14px;
}

.ap-subtab[b-4bmxjj0619] {
    border: 1px solid #cfe0f7;
    background: #fff;
    padding: 10px 14px;
    border-radius: 12px;
    font-weight: 900;
    cursor: pointer;
    color: #1b3a6b;
    transition: .15s;
}

    .ap-subtab:hover[b-4bmxjj0619] {
        transform: translateY(-1px);
    }

    .ap-subtab.active[b-4bmxjj0619] {
        background: linear-gradient(180deg, #1a5fb4, #144a8f);
        color: #fff;
        border-color: #144a8f;
    }

.banca-wrap[b-4bmxjj0619],
.banca-wrap button[b-4bmxjj0619],
.banca-tabs[b-4bmxjj0619],
.banca-tabs button[b-4bmxjj0619],
.submenu-config[b-4bmxjj0619],
.submenu-config button[b-4bmxjj0619],
.banca-encabezado[b-4bmxjj0619],
.card[b-4bmxjj0619] {
    caret-color: transparent;
}

    .banca-wrap button[b-4bmxjj0619],
    .banca-tabs[b-4bmxjj0619],
    .submenu-config[b-4bmxjj0619],
    .banca-encabezado[b-4bmxjj0619] {
        user-select: none;
    }

        .banca-wrap button:focus:not(:focus-visible)[b-4bmxjj0619] {
            outline: none;
        }

    .banca-wrap input[b-4bmxjj0619],
    .banca-wrap textarea[b-4bmxjj0619],
    .banca-wrap select[b-4bmxjj0619] {
        caret-color: auto;
        user-select: auto;
    }
/* _content/SistemaLoteriaDashboard/Pages/Login.razor.rz.scp.css */
/* =========================================================
   LOGIN NEXLOTO - REMA PREMIUM RESPONSIVE
   Solo diseño visual. No cambia lógica del sistema.
========================================================= */

html[b-bz01mwdrg9],
body[b-bz01mwdrg9] {
    margin: 0;
    padding: 0;
    width: 100%;
    min-height: 100%;
    overflow-x: hidden;
    background: #f4f9ff;
    font-family: Inter, Segoe UI, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

.login-page[b-bz01mwdrg9] {
    min-height: 100vh;
    width: 100%;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px 16px 62px;
    box-sizing: border-box;
    background: radial-gradient(circle at 18% 18%, rgba(37, 99, 235, .13), transparent 26%), radial-gradient(circle at 78% 28%, rgba(14, 165, 233, .10), transparent 28%), linear-gradient(135deg, #ffffff 0%, #f4f9ff 42%, #eaf4ff 100%);
}

    /* curva azul superior izquierda */
    .login-page[b-bz01mwdrg9]::before {
        content: "";
        position: absolute;
        width: min(48vw, 680px);
        height: min(72vh, 820px);
        left: -180px;
        top: -260px;
        border-radius: 0 0 62% 0;
        background: radial-gradient(circle at 76% 46%, rgba(255,255,255,.46), transparent 12%), linear-gradient(135deg, #0646b8 0%, #0b74e8 48%, #20b6ff 100%);
        transform: rotate(-10deg);
        box-shadow: 0 34px 90px rgba(37, 99, 235, .30);
        opacity: .98;
    }

    /* curva azul inferior derecha, SIN bolas */
    .login-page[b-bz01mwdrg9]::after {
        content: "";
        position: absolute;
        width: min(50vw, 720px);
        height: min(58vh, 660px);
        right: -250px;
        bottom: -330px;
        border-radius: 64% 0 0 0;
        background: linear-gradient(135deg, rgba(37,99,235,.08), rgba(2,6,23,.96) 52%, #061b42 100%);
        box-shadow: -34px -30px 95px rgba(15,23,42,.18);
        opacity: .96;
    }

/* líneas finas decorativas */
.login-shell[b-bz01mwdrg9]::before,
.login-shell[b-bz01mwdrg9]::after {
    content: "";
    position: fixed;
    pointer-events: none;
    z-index: -1;
    border-radius: 999px;
    border: 1px solid rgba(37, 99, 235, .10);
    transform: rotate(-16deg);
}

.login-shell[b-bz01mwdrg9]::before {
    width: 110vw;
    height: 340px;
    left: -18vw;
    top: 14vh;
}

.login-shell[b-bz01mwdrg9]::after {
    width: 92vw;
    height: 290px;
    right: -22vw;
    bottom: 10vh;
}

/* contenedor principal */
.login-shell[b-bz01mwdrg9] {
    position: relative;
    z-index: 2;
    width: min(540px, 100%);
    min-height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    overflow: visible !important;
    border-radius: 0 !important;
    transform: translateY(-8px);
}

/* sección marca */
.login-brand[b-bz01mwdrg9] {
    width: 100%;
    padding: 0;
    margin: 0;
    background: transparent !important;
    color: #0f172a;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: auto !important;
    box-shadow: none !important;
    border: none !important;
}

    .login-brand[b-bz01mwdrg9]::before,
    .login-brand[b-bz01mwdrg9]::after {
        display: none !important;
    }

/* logo principal */
.brand-logo-clean[b-bz01mwdrg9] {
    width: min(560px, 92vw);
    margin: 0 auto 14px;
    position: relative;
    z-index: 2;
}

.brand-logo-img-clean[b-bz01mwdrg9] {
    width: 100%;
    display: block;
    filter: drop-shadow(0 22px 38px rgba(37, 99, 235, .20)) drop-shadow(0 4px 10px rgba(15, 23, 42, .08));
}

/* título */
.brand-info[b-bz01mwdrg9] {
    text-align: center;
    position: relative;
    z-index: 2;
    margin-bottom: 24px;
}

    .brand-info h1[b-bz01mwdrg9] {
        margin: 0;
        font-size: clamp(1.85rem, 3.2vw, 2.45rem);
        font-weight: 1000;
        letter-spacing: -.7px;
        color: #0b1736;
        text-shadow: 0 12px 28px rgba(15,23,42,.08);
    }

    .brand-info p[b-bz01mwdrg9] {
        margin: 8px 0 0;
        font-size: clamp(.96rem, 1.5vw, 1.08rem);
        font-weight: 800;
        color: #64748b;
    }

/* fecha desactivada visualmente */
.brand-date-box[b-bz01mwdrg9] {
    display: none !important;
}

/* login centrado */
.login-card[b-bz01mwdrg9] {
    width: 100%;
    padding: 0;
    margin: 0;
    background: transparent !important;
    backdrop-filter: none !important;
    box-shadow: none !important;
    min-height: auto !important;
    display: flex;
    justify-content: center;
    align-items: center;
}

.login-icon-wrap[b-bz01mwdrg9] {
    display: none;
}

.login-app-icon[b-bz01mwdrg9] {
    display: none;
}

.login-header[b-bz01mwdrg9] {
    display: none !important;
}

.login-subtitle[b-bz01mwdrg9] {
    display: none;
}

.login-body[b-bz01mwdrg9] {
    width: min(410px, 100%);
    margin: 0 auto;
    padding: 0;
}

/* campos */
.login-field[b-bz01mwdrg9] {
    margin-bottom: 14px;
    text-align: left;
}

    .login-field label[b-bz01mwdrg9] {
        display: none;
    }

.input-wrap[b-bz01mwdrg9],
.password-wrap[b-bz01mwdrg9] {
    position: relative;
}

.input-ico[b-bz01mwdrg9] {
    position: absolute;
    left: 18px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    font-size: 0 !important;
    width: 21px;
    height: 21px;
    opacity: 1 !important;
}

.login-input[b-bz01mwdrg9] {
    width: 100%;
    height: 58px;
    border-radius: 17px;
    border: 1px solid rgba(37, 99, 235, .20);
    background: rgba(255,255,255,.88);
    padding: 0 52px 0 58px;
    font-size: 16px;
    font-weight: 850;
    color: #0f172a;
    outline: none;
    box-sizing: border-box;
    box-shadow: 0 18px 36px rgba(15, 23, 42, .075), inset 0 1px 0 rgba(255,255,255,.96);
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease, transform .18s ease;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

    .login-input[b-bz01mwdrg9]::placeholder {
        color: #64748b;
        font-weight: 750;
    }

    .login-input:focus[b-bz01mwdrg9] {
        border-color: #0b74e8;
        background: rgba(255,255,255,.98);
        box-shadow: 0 0 0 5px rgba(37, 99, 235, .12), 0 22px 44px rgba(37, 99, 235, .15);
        transform: translateY(-1px);
    }

/* icono usuario */
.input-wrap .input-ico[b-bz01mwdrg9]::before {
    content: "";
    display: block;
    width: 21px;
    height: 21px;
    background: linear-gradient(180deg, #1397ff, #0758d8);
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 12c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5Zm0 2c-3.33 0-10 1.67-10 5v2h20v-2c0-3.33-6.67-5-10-5Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* icono contraseña */
.password-wrap .input-ico[b-bz01mwdrg9]::before {
    content: "";
    display: block;
    width: 21px;
    height: 21px;
    background: linear-gradient(180deg, #1397ff, #0758d8);
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M17 8h-1V6c0-2.76-2.24-5-5-5S6 3.24 6 6v2H5c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2ZM8 6c0-1.66 1.34-3 3-3s3 1.34 3 3v2H8V6Zm4 11.73V19h-2v-1.27c-.6-.35-1-1-1-1.73 0-1.1.9-2 2-2s2 .9 2 2c0 .73-.4 1.38-1 1.73Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* botón ojo */
.eye-btn[b-bz01mwdrg9] {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 39px;
    height: 39px;
    border-radius: 13px;
    border: 0;
    background: rgba(37,99,235,.075);
    cursor: pointer;
    font-size: 0 !important;
    display: grid;
    place-items: center;
    transition: .16s ease;
}

    .eye-btn:hover[b-bz01mwdrg9] {
        background: rgba(37,99,235,.13);
    }

    .eye-btn[b-bz01mwdrg9]::before {
        content: "";
        display: block;
        width: 20px;
        height: 20px;
        background: #71839f;
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5Zm0 12.5c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5Zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3Z'/%3E%3C/svg%3E") center / contain no-repeat;
    }

/* recordar */
.login-row[b-bz01mwdrg9] {
    margin: 7px 0 19px;
}

.remember[b-bz01mwdrg9] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: .93rem;
    font-weight: 800;
    color: #334155;
}

    .remember input[b-bz01mwdrg9] {
        width: 18px;
        height: 18px;
        accent-color: #0b74e8;
        cursor: pointer;
    }

/* botón */
.btn-login[b-bz01mwdrg9] {
    width: 100%;
    height: 59px;
    border-radius: 17px;
    border: none;
    cursor: pointer;
    font-size: 1.05rem;
    font-weight: 1000;
    letter-spacing: .3px;
    color: #fff;
    background: linear-gradient(90deg, #0aa7ff 0%, #086be8 52%, #0648c8 100%);
    box-shadow: 0 22px 46px rgba(37,99,235,.32), inset 0 1px 0 rgba(255,255,255,.28);
    transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}

    .btn-login:hover[b-bz01mwdrg9] {
        transform: translateY(-2px);
        box-shadow: 0 28px 58px rgba(37,99,235,.38), inset 0 1px 0 rgba(255,255,255,.30);
        filter: saturate(1.04);
    }

    .btn-login:active[b-bz01mwdrg9] {
        transform: translateY(0);
    }

    .btn-login:disabled[b-bz01mwdrg9] {
        opacity: .74;
        cursor: not-allowed;
        transform: none;
    }

.btn-login-content[b-bz01mwdrg9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.btn-login-arrow[b-bz01mwdrg9] {
    font-size: 1.25rem;
    font-weight: 1000;
    line-height: 1;
}

.login-spinner[b-bz01mwdrg9] {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 3px solid rgba(255,255,255,.45);
    border-top-color: #fff;
    animation: spinLogin-b-bz01mwdrg9 .8s linear infinite;
}

@keyframes spinLogin-b-bz01mwdrg9 {
    to {
        transform: rotate(360deg);
    }
}

/* ayuda */
.login-help[b-bz01mwdrg9] {
    margin-top: 23px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #475569;
    font-size: .92rem;
    font-weight: 750;
    text-align: center;
}

.help-dot[b-bz01mwdrg9] {
    width: 21px;
    height: 21px;
    border-radius: 8px;
    background: linear-gradient(180deg, #119cff, #075bdc);
    position: relative;
    flex: 0 0 auto;
    box-shadow: 0 8px 18px rgba(37,99,235,.22);
}

    .help-dot[b-bz01mwdrg9]::before {
        content: "✓";
        position: absolute;
        inset: 0;
        display: grid;
        place-items: center;
        color: #fff;
        font-size: .78rem;
        font-weight: 1000;
    }

/* firma inferior */
.login-signature[b-bz01mwdrg9] {
    position: fixed;
    left: 50%;
    bottom: 18px;
    transform: translateX(-50%);
    z-index: 30;
    padding: 9px 17px;
    border-radius: 999px;
    background: rgba(255,255,255,.76);
    border: 1px solid rgba(148,163,184,.28);
    color: #52627a;
    font-size: .86rem;
    font-weight: 850;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 12px 28px rgba(15,23,42,.09);
    white-space: nowrap;
}

/* mensajes */
.login-overlay[b-bz01mwdrg9] {
    position: fixed;
    inset: 0;
    z-index: 9998;
    background: rgba(15,23,42,.46);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.login-toast[b-bz01mwdrg9] {
    position: fixed;
    z-index: 9999;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(450px, calc(100vw - 24px));
    display: grid;
    grid-template-columns: 58px 1fr 34px;
    gap: 14px;
    align-items: center;
    padding: 18px;
    border-radius: 24px;
    background: rgba(255,255,255,.97);
    border: 1px solid rgba(148,163,184,.35);
    box-shadow: 0 35px 90px rgba(15,23,42,.35);
}

.toast-icon[b-bz01mwdrg9] {
    width: 58px;
    height: 58px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    font-size: 1.6rem;
    background: rgba(59,130,246,.12);
}

.toast-content[b-bz01mwdrg9] {
    min-width: 0;
}

.toast-title[b-bz01mwdrg9] {
    font-size: 1.05rem;
    font-weight: 1000;
    color: #0f172a;
    margin-bottom: 4px;
}

.toast-message[b-bz01mwdrg9] {
    color: #334155;
    font-weight: 850;
    line-height: 1.4;
    word-break: break-word;
}

.toast-close[b-bz01mwdrg9] {
    width: 34px;
    height: 34px;
    border-radius: 12px;
    border: none;
    cursor: pointer;
    background: rgba(15,23,42,.06);
    font-weight: 1000;
}

.toast-error[b-bz01mwdrg9],
.toast-danger[b-bz01mwdrg9] {
    border-color: rgba(239,68,68,.35);
}

.toast-warning[b-bz01mwdrg9] {
    border-color: rgba(245,158,11,.35);
}

.toast-success[b-bz01mwdrg9] {
    border-color: rgba(34,197,94,.35);
}

/* tablets y pantallas medianas */
@media (max-width: 900px) {
    .login-page[b-bz01mwdrg9] {
        align-items: center;
        justify-content: center;
        padding: 24px 16px 74px;
        overflow-y: auto;
    }

        .login-page[b-bz01mwdrg9]::before {
            width: 500px;
            height: 520px;
            left: -270px;
            top: -250px;
        }

        .login-page[b-bz01mwdrg9]::after {
            width: 460px;
            height: 420px;
            right: -290px;
            bottom: -260px;
        }

    .login-shell[b-bz01mwdrg9] {
        width: min(440px, 100%);
        transform: translateY(-2px);
    }

    .brand-logo-clean[b-bz01mwdrg9] {
        width: min(410px, 90vw);
        margin-bottom: 10px;
    }

    .brand-info[b-bz01mwdrg9] {
        margin-bottom: 20px;
    }

        .brand-info h1[b-bz01mwdrg9] {
            font-size: 1.82rem;
        }

        .brand-info p[b-bz01mwdrg9] {
            font-size: .96rem;
        }

    .login-body[b-bz01mwdrg9] {
        width: 100%;
    }

    .login-signature[b-bz01mwdrg9] {
        left: 10px;
        right: 10px;
        bottom: 9px;
        transform: none;
        text-align: center;
        font-size: .78rem;
        white-space: normal;
    }
}

/* teléfonos */
@media (max-width: 430px) {
    .login-page[b-bz01mwdrg9] {
        padding-left: 14px;
        padding-right: 14px;
    }

        .login-page[b-bz01mwdrg9]::before {
            width: 430px;
            height: 460px;
            left: -275px;
            top: -245px;
            opacity: .92;
        }

        .login-page[b-bz01mwdrg9]::after {
            width: 380px;
            height: 360px;
            right: -265px;
            bottom: -240px;
            opacity: .86;
        }

    ..brand-logo-clean[b-bz01mwdrg9] {
        width: min(350px, 90vw);
    }

    .brand-info h1[b-bz01mwdrg9] {
        font-size: 1.62rem;
    }

    .brand-info p[b-bz01mwdrg9] {
        font-size: .90rem;
    }

    .login-input[b-bz01mwdrg9],
    .btn-login[b-bz01mwdrg9] {
        height: 53px;
        border-radius: 16px;
    }

    .login-input[b-bz01mwdrg9] {
        padding-left: 54px;
        font-size: 15.5px;
    }

    .login-help[b-bz01mwdrg9] {
        font-size: .84rem;
        margin-top: 18px;
    }

    .login-toast[b-bz01mwdrg9] {
        grid-template-columns: 48px 1fr 32px;
        padding: 14px;
        border-radius: 20px;
    }

    .toast-icon[b-bz01mwdrg9] {
        width: 48px;
        height: 48px;
        font-size: 1.35rem;
    }

    .toast-title[b-bz01mwdrg9] {
        font-size: 1rem;
    }

    .toast-message[b-bz01mwdrg9] {
        font-size: .90rem;
    }
}
/* _content/SistemaLoteriaDashboard/Pages/Ventas.razor.rz.scp.css */
/* 🎨 ESTILOS BASE DE LA PÁGINA */
.ventas-page[b-6abbow5n4h] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    font-family: 'Segoe UI', sans-serif;
    background: linear-gradient(180deg, #eef3f9 0%, #ffffff 100%);
    color: #222;
    padding-top: 10px;
    gap: 10px;
}

/* 🔹 MENÚ SUPERIOR */
.menu-superior[b-6abbow5n4h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 12px 16px;
    margin: 0 10px;
    border-radius: 16px;
    /* ✅ COLOR SÓLIDO MODERNO (sin transparencia) */
    background: linear-gradient(135deg, #0a4baa, #00285f);
    border: 1px solid rgba(255,255,255,0.18);
    box-shadow: 0 18px 40px rgba(0, 18, 40, 0.35), inset 0 1px 0 rgba(255,255,255,0.12);
    /* ❌ QUITAR EFECTO VIDRIO */
    backdrop-filter: none;
}

.menu-left[b-6abbow5n4h], .menu-right[b-6abbow5n4h] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.menu-right[b-6abbow5n4h] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: nowrap;
}



.menu-btn[b-6abbow5n4h] {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 999px;
    background: rgba(255,255,255,0.10);
    border: 1px solid rgba(255,255,255,0.18);
    color: #ffffff;
    font-weight: 900;
    font-size: 1.05rem;
    letter-spacing: 0.2px;
    cursor: pointer;
    transition: transform .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease;
    box-shadow: 0 10px 22px rgba(0,0,0,0.10);
    user-select: none;
}

    .menu-btn:hover[b-6abbow5n4h] {
        transform: translateY(-1px);
        background: rgba(255,255,255,0.16);
        border-color: rgba(255,255,255,0.26);
        box-shadow: 0 14px 28px rgba(0,0,0,0.18);
    }

    .menu-btn:active[b-6abbow5n4h] {
        transform: translateY(0px);
        box-shadow: 0 8px 16px rgba(0,0,0,0.14);
    }


    .menu-btn.salir[b-6abbow5n4h] {
        background: linear-gradient(135deg, #ff4b4b, #c62828);
        border: 1px solid rgba(255,255,255,0.20);
        font-weight: 950;
        box-shadow: 0 14px 28px rgba(198,40,40,0.25);
    }

        .menu-btn.salir:hover[b-6abbow5n4h] {
            background: linear-gradient(135deg, #ff5b5b, #b71c1c);
        }


/* === CONTENEDOR PARA BOTÓN CON SUBMENÚ (Consultas) === */
.menu-dropdown-wrap[b-6abbow5n4h] {
    position: relative;
    display: inline-block;
}

.menu-btn-dropdown[b-6abbow5n4h] {
    padding-right: 16px;
}

.menu-arrow[b-6abbow5n4h] {
    font-size: 0.75rem;
    margin-left: 2px;
}


/* ==========================================================
   ✅ Dropdown tipo BANCA (Juegos / y sirve para futuros menús)
   ========================================================== */
.menu-dropdown-wrap[b-6abbow5n4h] {
    position: relative;
    display: inline-block;
}

/* Panel blanco flotante */
.menu-dropdown-panel[b-6abbow5n4h] {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    min-width: 260px;
    background: #f9fbff;
    border: 1px solid rgba(15, 23, 42, 0.10);
    border-radius: 14px;
    box-shadow: 0 18px 40px rgba(0,0,0,0.18);
    padding: 8px 0;
    margin: 0;
    list-style: none;
    z-index: 9999;
    max-height: 360px;
    overflow-y: auto;
}

/* Animación al abrir (igual sensación que Banca) */
.menu-dropdown-anim[b-6abbow5n4h] {
    animation: dropIn-b-6abbow5n4h .18s ease-out both;
}

@keyframes dropIn-b-6abbow5n4h {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Item como botón */
.menu-dropdown-item[b-6abbow5n4h] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border: none;
    background: transparent;
    cursor: pointer;
    font-weight: 900;
    font-size: 0.98rem;
    color: #0b3a7a;
    text-align: left;
    transition: background .14s ease;
}

    .menu-dropdown-item:hover[b-6abbow5n4h] {
        background: rgba(15, 118, 255, 0.10);
    }

    .menu-dropdown-item.activo[b-6abbow5n4h] {
        background: rgba(15, 118, 255, 0.18);
        color: #0b3a7a;
    }

/* Puntito azul */
.menu-dot[b-6abbow5n4h] {
    color: #1e88e5;
    font-size: 18px;
    line-height: 1;
}

/* Flecha animada */
.menu-arrow[b-6abbow5n4h] {
    font-size: 0.75rem;
    margin-left: 2px;
    opacity: 0.9;
    transition: transform .18s ease, opacity .18s ease;
}

    .menu-arrow.rotado[b-6abbow5n4h] {
        transform: rotate(180deg);
        opacity: 1;
    }

.saldo-actual[b-6abbow5n4h] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 14px;
    background: rgba(255,255,255,0.10);
    border: 1px solid rgba(255,255,255,0.18);
    color: #fff;
    box-shadow: 0 12px 24px rgba(0,0,0,0.14);
    min-width: 270px;
    justify-content: space-between;
}

.saldo-label[b-6abbow5n4h] {
    font-weight: 900;
    opacity: 0.92;
}

.saldo-valor[b-6abbow5n4h] {
    font-weight: 950;
    font-size: 1.15rem;
    letter-spacing: 0.4px;
}

/* ==========================================================
   ✅ CENTRO DEL MENÚ: indicador del juego activo
   ========================================================== */
.menu-superior[b-6abbow5n4h] {
    position: relative; /* permite centrar el centro sin romper izquierda/derecha */
}

.menu-center[b-6abbow5n4h] {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none; /* no estorba clicks a los menús */
}

/* Pastilla */
.juego-pill[b-6abbow5n4h] {
    pointer-events: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 180px; /* parecido al hueco que se ve en tu captura */
    height: 34px;
    padding: 0 18px;
    border-radius: 999px;
    font-weight: 950;
    font-size: 1.05rem;
    letter-spacing: 1px;
    text-transform: uppercase;
    border: 2px solid rgba(255,255,255,0.25);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.18), 0 10px 22px rgba(0,0,0,0.20);
}

    /* Colores por juego */
    .juego-pill.tiempos[b-6abbow5n4h] {
        background: linear-gradient(135deg, #1e88e5, #0d47a1);
        color: #fff;
    }

    .juego-pill.parley[b-6abbow5n4h] {
        background: linear-gradient(135deg, #7c3aed, #4c1d95);
        color: #fff;
    }

    .juego-pill.monazos[b-6abbow5n4h] {
        background: linear-gradient(135deg, #2e7d32, #1b5e20);
        color: #fff;
    }

    .juego-pill.tripletas[b-6abbow5n4h] {
        background: linear-gradient(135deg, #e65100, #bf360c);
        color: #fff;
    }

    .juego-pill.rifas[b-6abbow5n4h] {
        background: linear-gradient(135deg, #c62828, #8e0000);
        color: #fff;
        border-color: rgba(255, 255, 255, 0.45);
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
    }

.saldo-actual[b-6abbow5n4h] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 10px;
    border-radius: 14px;
    background: rgba(255,255,255,.55);
    border: 1px solid rgba(219,234,254,.8);
}

.saldo-label[b-6abbow5n4h] {
    font-weight: 900;
    color: #334155;
}

.saldo-valor[b-6abbow5n4h] {
    font-weight: 1000;
}

    .saldo-valor.positivo[b-6abbow5n4h] {
        color: #0b2a5b;
    }

    .saldo-valor.negativo[b-6abbow5n4h] {
        color: #b40000;
        background: #ffecec;
        padding: 4px 8px;
        border-radius: 999px;
        border: 1px solid rgba(180,0,0,.18);
    }

.saldo-refresh[b-6abbow5n4h] {
    border: none;
    cursor: pointer;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    background: linear-gradient(90deg,#0b67c2,#2b8ef5);
    color: #fff;
    font-weight: 1000;
    display: grid;
    place-items: center;
    box-shadow: 0 8px 16px rgba(43,142,245,.22);
    transition: transform .12s ease, box-shadow .16s ease;
}

    .saldo-refresh:hover[b-6abbow5n4h] {
        transform: translateY(-1px);
        box-shadow: 0 12px 22px rgba(43,142,245,.32);
    }

    .saldo-refresh:active[b-6abbow5n4h] {
        transform: translateY(0);
    }

.saldo-top-wrap[b-6abbow5n4h] {
    display: flex;
    flex-direction: row-reverse; /* 🔥 ESTA ES LA CLAVE */
    align-items: stretch;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: nowrap;
}

    .saldo-top-wrap > .saldo-actual[b-6abbow5n4h] {
        flex: 0 0 auto;
    }
.saldo-lcr-mini[b-6abbow5n4h] {
    min-width: 150px;
    padding: 4px 8px;
    gap: 6px;
    transform: scale(0.92); /* 🔥 reduce tamaño general */
    transform-origin: right center;
}

    .saldo-lcr-mini .saldo-label[b-6abbow5n4h] {
        font-size: 0.75rem;
        font-weight: 800;
    }

    .saldo-lcr-mini .saldo-valor[b-6abbow5n4h] {
        font-size: 0.90rem;
        font-weight: 900;
    }

.saldo-lc[b-6abbow5n4h] {
    background: linear-gradient(180deg, #eef6ff 0%, #dbeafe 100%);
    border: 1px solid rgba(59,130,246,.35);
}

.saldo-rp[b-6abbow5n4h] {
    background: linear-gradient(180deg, #eefdf5 0%, #dcfce7 100%);
    border: 1px solid rgba(34,197,94,.30);
}