/* ============================================================================================================================
 * pl-juegos-ws.css (18/10/2026): «la cesta de cada juego» en los boletos de Euromillones, La Primitiva, Bonoloto, El Gordo y La
 * Quiniela (directo, múltiple y reducido): la caja ELIGE SORTEOS (C_Selector_Sorteos con EstiloCesta, SOLO estilo: los enlaces,
 * postbacks y clases de seleccionado son los de siempre) y el resumen con JUGAR YA (C_ResumenJugada con EstiloCesta + el lnkJugar de
 * cada boleto), con el estilo de la cesta de lotería rediseñada. Lo enlazan solo las 9 páginas de boleto y, desde el mismo día,
 * Enviar combinación, Volver a jugar y juegos_JugarExternaN (no el master); todo va bajo section.pj-cesta-juego y .pj-barra-movil.
 * Subir el ?v= del <link> de esas 12 páginas al cambiar este fichero.
 *
 * De dónde sale cada cosa (copiado, no enlazado: no depende de esa rama):
 * - Tarjeta, título, línea con barra de color, filas «Total… N», caja IMPORTE, JUGAR YA, píldoras y barra del móvil:
 *   NuevoPlayLoterias/RecursosAranya/css/pl-decimos-ws.css de la rama feature/decimos-estilo-ws (.pl-cesta-tarjeta, .pl-cesta-linea,
 *   .pl-cesta-barra, .pl-cesta-total-decimos, .pl-cesta-apagar, .pl-cesta-cta, .pl-cesta-extras, .pl-cesta-barra-movil), que a su vez
 *   viene de websse-react (OrderSummary.tsx y HeroV6.tsx:2648-2717; letraPequenaBarra 15→13 px).
 * - Color de cada juego: el del botón SEMANAL seleccionado del CSS de siempre (screen.css), elegido por la clase de la tabla de días:
 *   Euromillones rgb(36,56,122) · Primitiva rgb(111,188,82) · Bonoloto rgb(131,195,38) · Gordo rgb(200,44,55) · Quiniela rgb(218,37,28).
 * - Radios y check redondeados: chips de importe de la WS (HeroV6.tsx:2581) y checkbox rounded de LoginModule.tsx:1273. Fuente Lato.
 * Colores de Tailwind v4 pasados a hex (sRGB aproximado de su oklch).
 * ========================================================================================================================== */

:root {
    --pj-rose-100: #ffe4e6; --pj-rose-400: #ff637e; --pj-rose-500: #ff2056; --pj-rose-600: #ec003f; --pj-rose-700: #c70036;
    --pj-slate-50: #f8fafc; --pj-slate-100: #f1f5f9; --pj-slate-200: #e2e8f0; --pj-slate-300: #cad5e2; --pj-slate-400: #90a1b9;
    --pj-slate-500: #62748e; --pj-slate-600: #45556c; --pj-slate-700: #314158; --pj-slate-800: #1d293d; --pj-slate-900: #0f172b;
    --pj-font: 'Lato', ui-sans-serif, system-ui, sans-serif;
}
/* Color del juego, por la clase que ya lleva la tabla de días de cada boleto (sin :has, el azul de Euromillones) */
section.pj-cesta-juego { --pj: rgb(36, 56, 122); }
section.pj-cesta-juego:has(.diasEuromillones) { --pj: rgb(36, 56, 122); }
section.pj-cesta-juego:has(.diasPrimitiva)    { --pj: rgb(111, 188, 82); }
section.pj-cesta-juego:has(.diasLoto)         { --pj: rgb(131, 195, 38); }
section.pj-cesta-juego:has(.diasGordo)        { --pj: rgb(200, 44, 55); }
section.pj-cesta-juego:has(.diasQuiniela)     { --pj: rgb(218, 37, 28); }
section.pj-cesta-juego { margin-bottom: 40px; font-family: var(--pj-font); }

/* ─── Izquierda: ELIGE SORTEOS (misma estructura y enlaces; solo estilo) ───────────────────────────────────────────────────── */
section.pj-cesta-juego .pj-selector {
    height: auto !important; min-height: 0 !important; margin: 0 !important; padding: 20px;
    background: #fff; border: 1px solid var(--pj-slate-200); border-radius: 12px; box-shadow: none;
}
section.pj-cesta-juego .pj-selector .panel-heading-boletos2 { height: auto !important; min-height: 0; padding: 0; margin: 0 0 16px; background: none; border: 0; }   /* screen.css le fija 40 px */
section.pj-cesta-juego .pj-selector .cabeceraSelector { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin: 0; }
section.pj-cesta-juego .pj-selector .cabeceraSelector::before,
section.pj-cesta-juego .pj-selector .cabeceraSelector::after { display: none; }
section.pj-cesta-juego .pj-selector .cabeceraSelector > div { float: none; width: auto; min-height: 0; padding: 0; }
section.pj-cesta-juego .pj-selector .cabeceraSelector > div:first-child { flex: 1 1 auto; }
section.pj-cesta-juego .pj-selector .enunciado-elige-sorteos,
section.pj-cesta-juego .pj-selector .text-center-semana {          /* como «Lotería en cesta» (.pl-cesta-titulo) */
    display: flex; align-items: center; gap: 10px; margin: 0; padding: 0;
    color: var(--pj-slate-900); font-family: var(--pj-font); font-size: 22px; font-weight: 900; line-height: 1.2; text-transform: none;
}
section.pj-cesta-juego .pj-selector .enunciado-elige-sorteos .fa { color: var(--pj); font-size: 20px; margin: 0 !important; }
section.pj-cesta-juego .pj-selector .cabeceraSelector .pull-right { float: none !important; color: var(--pj-slate-600); font-size: 15px; font-weight: 700; }
/* Desplegable de semana = chip de la WS */
section.pj-cesta-juego .pj-selector a.selectSemanaSorteo {
    display: inline-flex; align-items: center; gap: 6px; position: relative;
    width: auto; height: 40px; margin: 0; padding: 0 14px 0 16px;
    background: #fff !important; border: 1px solid var(--pj-slate-400); border-radius: 9999px; box-shadow: none;
    color: var(--pj-slate-700); font-family: var(--pj-font); font-size: 15px; font-weight: 700; line-height: 1; text-decoration: none; white-space: nowrap;
}
section.pj-cesta-juego .pj-selector a.selectSemanaSorteo span { font-size: 15px; }
section.pj-cesta-juego .pj-selector a.selectSemanaSorteo:hover,
section.pj-cesta-juego .pj-selector a.selectSemanaSorteo:focus { border-color: var(--pj); color: var(--pj-slate-900); }
section.pj-cesta-juego .pj-selector a.selectSemanaSorteo .infoDias { color: var(--pj-slate-500); font-weight: 500; }
section.pj-cesta-juego .pj-selector a.selectSemanaSorteo .flecha-select { position: static; margin-left: 4px; color: var(--pj); font-size: 13px; }
section.pj-cesta-juego .pj-selector .cabeceraSelector .dropdown-menu {
    padding: 6px; border-radius: 12px; border-color: var(--pj-slate-200); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);
}
section.pj-cesta-juego .pj-selector .cabeceraSelector .dropdown-menu a { padding: 8px 12px; border-radius: 8px; font-family: var(--pj-font); color: var(--pj-slate-700); }
section.pj-cesta-juego .pj-selector .cabeceraSelector .dropdown-menu a:hover,
section.pj-cesta-juego .pj-selector .cabeceraSelector .dropdown-menu a:focus { background: var(--pj-slate-100); color: var(--pj-slate-900); }

/* Semanal y días: tarjetas redondeadas con radio del color del juego */
section.pj-cesta-juego .pj-selector table.panel-body-jugadas { display: block; width: 100%; margin: 0 !important; padding: 0 !important; border: 0 !important; background: none; }
section.pj-cesta-juego .pj-selector table.panel-body-jugadas tbody { display: flex; flex-direction: column; gap: 8px; }
section.pj-cesta-juego .pj-selector table.panel-body-jugadas tr { display: flex; gap: 8px; margin: 0; padding: 0; background: none; }
section.pj-cesta-juego .pj-selector table.panel-body-jugadas tr:has(> td > a.hidden) { display: none; }   /* Gordo y Quiniela: sin SEMANAL */
section.pj-cesta-juego .pj-selector table.panel-body-jugadas td { display: block; flex: 1 1 0; min-width: 0; padding: 0; border: 0; background: none; }
section.pj-cesta-juego .pj-selector table.diasLoto tr.panel-diasSemana td:only-child { flex: 0 0 calc((100% - 16px) / 3); }
section.pj-cesta-juego .pj-selector table.diasPrimitiva tr.panel-diasSemana td:only-child,
section.pj-cesta-juego .pj-selector table.diasEuromillones tr.panel-diasSemana td:only-child { flex: 0 0 calc((100% - 8px) / 2); }
section.pj-cesta-juego .pj-selector table.panel-body-jugadas td > a { display: block; height: 100%; text-decoration: none; }
section.pj-cesta-juego .pj-selector .semanalSorteos,
section.pj-cesta-juego .pj-selector .numeritosDias {
    display: flex !important; align-items: center; justify-content: flex-start; gap: 10px;
    box-sizing: border-box; width: 100%; height: 100% !important; min-height: 52px; margin: 0; padding: 10px 14px; opacity: 1;   /* screen.css: opacity .65, alto fijo, centrado */
    background: #fff; border: 1px solid var(--pj-slate-300); border-radius: 12px; box-shadow: none;
    color: var(--pj-slate-700); font-family: var(--pj-font); font-size: 16px; font-weight: 700; line-height: 1.2; text-align: left !important;
    transition: border-color .15s, background-color .15s;
}
section.pj-cesta-juego .pj-selector a:hover .semanalSorteos,
section.pj-cesta-juego .pj-selector a:hover .numeritosDias,
section.pj-cesta-juego .pj-selector a:focus-visible .semanalSorteos,
section.pj-cesta-juego .pj-selector a:focus-visible .numeritosDias { border-color: var(--pj); }
section.pj-cesta-juego .pj-selector .semanalSorteos strong { font-weight: 900; }
/* elegido = relleno del color del juego, SEMANAL o día suelto (como hoy); sin elegir, blanco con borde slate-300 */
section.pj-cesta-juego .pj-selector .semanalSorteos.sorteoSeleccionado,
section.pj-cesta-juego .pj-selector .numeritosDias.sorteoSeleccionado { background: var(--pj) !important; border-color: var(--pj); color: #fff !important; }
/* día o semanal que ya no se puede jugar (aspNetDisabled, sin enlace): apagado */
section.pj-cesta-juego .pj-selector .semanalSorteos.aspNetDisabled,
section.pj-cesta-juego .pj-selector .numeritosDias.aspNetDisabled {
    background: var(--pj-slate-50) !important; border-color: var(--pj-slate-200); color: var(--pj-slate-400) !important; opacity: .7; cursor: not-allowed;
}
/* El radio: se dibuja en .checkBoxSorteo; el input y la etiqueta de siempre siguen en el DOM */
section.pj-cesta-juego .pj-selector .checkBoxSorteo {
    position: relative; flex: none; display: inline-block; width: 20px; height: 20px; margin: 0; padding: 0;
    background: #fff; border: 2px solid var(--pj-slate-400); border-radius: 9999px;
}
section.pj-cesta-juego .pj-selector .checkBoxSorteo input,
section.pj-cesta-juego .pj-selector .checkBoxSorteo label { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; overflow: hidden; pointer-events: none; }
section.pj-cesta-juego .pj-selector .checkBoxSorteo::before, section.pj-cesta-juego .pj-selector .checkBoxSorteo label::before { display: none; }
section.pj-cesta-juego .pj-selector .sorteoSeleccionado .checkBoxSorteo { border-color: #fff; background: var(--pj); }
section.pj-cesta-juego .pj-selector .sorteoSeleccionado .checkBoxSorteo::after {
    content: ''; position: absolute; inset: 3px; border-radius: 9999px; background: #fff;
}
section.pj-cesta-juego .pj-selector .aspNetDisabled .checkBoxSorteo { border-color: var(--pj-slate-300); background: var(--pj-slate-100); }

/* Renovación automática: check redondeado del color del juego */
section.pj-cesta-juego .pj-selector .panel-body-jugada-automatica { margin: 16px 0 0; padding: 16px 0 0; border-top: 1px solid var(--pj-slate-100); background: none; }
section.pj-cesta-juego .pj-selector .tit-jug-auto {
    display: flex; align-items: center; gap: 10px; margin: 0;
    color: var(--pj-slate-900); font-family: var(--pj-font); font-size: 16px; font-weight: 900; text-transform: none;
}
section.pj-cesta-juego .pj-selector input.check-jug-auto {
    -webkit-appearance: none; appearance: none; flex: none; position: relative;
    width: 20px; height: 20px; margin: 0 !important; background: #fff; border: 2px solid var(--pj-slate-400); border-radius: 6px; cursor: pointer;
}
section.pj-cesta-juego .pj-selector input.check-jug-auto:checked { background: var(--pj); border-color: var(--pj); }
section.pj-cesta-juego .pj-selector input.check-jug-auto:checked::after {
    content: ''; position: absolute; left: 5px; top: 1px; width: 6px; height: 11px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg);
}
section.pj-cesta-juego .pj-selector input.check-jug-auto:focus-visible { outline: 2px solid var(--pj); outline-offset: 2px; }
section.pj-cesta-juego .pj-selector .tit-jug-auto .fa-info-circle { color: var(--pj); }
section.pj-cesta-juego .pj-selector .body-jug-auto { margin: 4px 0 0 30px; padding: 0; color: var(--pj-slate-500); font-family: var(--pj-font); font-size: 15px; line-height: 1.45; }

/* ─── Derecha: el resumen es la cesta del juego (.pl-cesta-tarjeta + .pl-cesta-pie-ws de lotería) ─────────────────────────── */
/* .pj-tarjeta es una columna: el resumen (C_ResumenJugada) se «abre» (display: contents) para que JUGAR YA, que va detrás en el
 * DOM, quede entre el importe y la cuenta atrás. */
section.pj-cesta-juego .pj-tarjeta {
    display: flex; flex-direction: column;
    padding: 20px; background: #fff; border: 1px solid var(--pj-slate-200); border-radius: 12px; font-family: var(--pj-font);
}
section.pj-cesta-juego .pj-tarjeta .pj-resumen { display: contents; }
section.pj-cesta-juego .pj-tarjeta .pj-extras { order: 2; }
section.pj-cesta-juego .pj-tarjeta .pj-cta { order: 1; }
section.pj-cesta-juego .pj-titulo {
    display: flex; align-items: center; gap: 10px; margin: 0 0 14px; padding: 0;
    color: var(--pj-slate-900); font-family: var(--pj-font); font-size: 24px; font-weight: 900; line-height: 1.2; text-transform: none; letter-spacing: normal;
}
section.pj-cesta-juego .pj-titulo img { flex: none; width: 28px; height: 28px; margin: 0; transform: none; }
section.pj-cesta-juego .pj-titulo img:not([class*="imagen-"]) { display: none; }
/* Línea de la cesta con la barra de color del juego a la izquierda (.pl-cesta-linea / .pl-cesta-barra) */
section.pj-cesta-juego .pj-linea {
    position: relative; margin: 0 0 16px; padding: 10px 16px 10px 22px;
    background: #fff; border: 2px solid var(--pj-slate-200); border-radius: 12px; overflow: hidden;
}
section.pj-cesta-juego .pj-linea-barra { position: absolute; left: 0; top: 0; bottom: 0; width: 6px; background: var(--pj); }
/* como «Total décimos  3»: el número va delante en el DOM («2 Apuestas», lo que leen las e2e) y se pinta a la derecha */
/* screen.css da a .aputestasGordo / .sorteosGordo anchos, márgenes (margin-left: 50% !important), float e inline-block con !important */
section.pj-cesta-juego .pj-fila {
    display: flex !important; flex: none !important; flex-direction: row-reverse; align-items: center; justify-content: space-between; gap: 8px;
    float: none !important; width: auto !important; margin: 0 !important; padding: 3px 0;
    color: var(--pj-slate-500); font-family: var(--pj-font); font-size: 17px; font-weight: 500; line-height: 1.4; text-align: left; text-transform: none;
}
section.pj-cesta-juego .pj-fila b { color: var(--pj-slate-800); font-size: 18px; font-weight: 600; font-variant-numeric: tabular-nums; }
/* IMPORTE (.pl-cesta-apagar) */
section.pj-cesta-juego .pj-importe {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
    margin: 0; padding: 18px 24px; background: #fff; border: 2px solid var(--pj-slate-300); border-radius: 12px;
}
section.pj-cesta-juego .pj-importe .total-dec-20 { color: var(--pj-slate-700); font-family: var(--pj-font); font-size: 16px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
section.pj-cesta-juego .pj-importe .monto-dec-20 {
    color: var(--pj-slate-900); font-family: var(--pj-font); font-size: 36px; font-weight: 900; line-height: 1.1; white-space: nowrap; font-variant-numeric: tabular-nums;
}
section.pj-cesta-juego .pj-importe.pj-importe-cero .monto-dec-20 { color: var(--pj-slate-400); }
/* JUGAR YA (.pl-cesta-cta), el mismo enlace. Con 0 apuestas se queda igual: hoy se puede pulsar (avisa) y no se cambia.
 * .pj-cta y no a.pj-cta: en juegos_JugarExternaN, sin sesión, el JUGAR YA es un <button> (btnLogin), con el mismo aspecto. */
section.pj-cesta-juego .pj-cta {
    display: flex; align-items: center; justify-content: center;
    width: 100%; min-height: 64px; margin: 20px 0 0; padding: 0 24px;
    background: var(--pj-rose-600); border: 0; border-radius: 9999px; box-shadow: none;
    color: #fff; font-family: var(--pj-font); font-size: 16px; font-weight: 900; letter-spacing: .025em; text-transform: uppercase; text-decoration: none;
    cursor: pointer; transition: background-color .15s, opacity .15s;
}
section.pj-cesta-juego .pj-cta:hover, section.pj-cesta-juego .pj-cta:focus { background: var(--pj-rose-700); color: #fff; text-decoration: none; }
section.pj-cesta-juego .pj-cta:focus-visible, .pj-barra-movil .pj-barra-cta:focus-visible { outline: 2px solid var(--pj-rose-500); outline-offset: 2px; }
section.pj-cesta-juego .pj-cta.pj-enviando, .pj-barra-movil .pj-barra-cta.pj-enviando { opacity: .7; cursor: progress; }
/* Píldoras: cuenta atrás y «Cierra a las…» (.pl-cesta-extras), del mismo ancho y en la misma fila mientras quepan */
section.pj-cesta-juego .pj-extras { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 0; }
section.pj-cesta-juego .pj-extras:empty { display: none; }
section.pj-cesta-juego .pj-extras .pj-reloj,
section.pj-cesta-juego .pj-extras .pj-cierre {
    flex: 1 1 200px; min-width: 0;
    display: flex; align-items: center; justify-content: center; gap: 6px;
    box-sizing: border-box; min-height: 44px; margin: 0; padding: 6px 14px;
    background: #fff; border: 1px solid var(--pj-slate-400); border-radius: 22px;   /* píldora a una línea; si baja a dos, sigue redonda */
    color: var(--pj-slate-700); font-family: var(--pj-font); font-size: 15px; font-weight: 700; line-height: 1.2; text-align: center; text-transform: none;
}
section.pj-cesta-juego .pj-extras svg { flex: none; color: var(--pj-rose-500); }
section.pj-cesta-juego .pj-reloj-texto { font-variant-numeric: tabular-nums; white-space: nowrap; }
/* «Cierra a las 10:00h» | «del Sáb 17 oct.»: cada parte sin partir; si no cabe, baja justo antes de «del» y, si aún no cabe, la
 * letra baja un escalón (pl-juegos-ws.js pone pj-cierre-pequena, como letraPequenaBarra de las webs sociales). */
section.pj-cesta-juego .pj-cierre-texto { display: block; min-width: 0; overflow: hidden; }
section.pj-cesta-juego .pj-cierre-parte { white-space: nowrap; }
section.pj-cesta-juego .pj-extras .pj-cierre.pj-cierre-pequena { font-size: 13px; }

/* ─── Móvil: la barra fija de lotería (.pl-cesta-barra-movil): TOTAL + importe | «N apuestas / JUGAR YA» ──────────────────── */
/* Sale mientras el boleto va en una columna (hasta 767 px) y hay apuestas, y se esconde con el resumen a la vista (pl-juegos-ws.js).
 * Por debajo del banner de cookies (z-index 100). Sube el botón de volver arriba. */
.pj-barra-movil { display: none; }
@media (max-width: 767px) {
    section.pj-cesta-juego .pj-selector, section.pj-cesta-juego .pj-tarjeta { padding: 16px; }
    section.pj-cesta-juego .pj-tarjeta { margin-top: 16px; }
    section.pj-cesta-juego .pj-selector .semanalSorteos, section.pj-cesta-juego .pj-selector .numeritosDias { gap: 8px; padding: 10px 12px; font-size: 15px; }
    section.pj-cesta-juego .pj-selector .numeritosDias { white-space: nowrap; }
    section.pj-cesta-juego .pj-selector .enunciado-elige-sorteos, section.pj-cesta-juego .pj-selector .text-center-semana { font-size: 20px; }
    section.pj-cesta-juego .pj-titulo { font-size: 20px; }
    section.pj-cesta-juego .pj-importe { padding: 16px 20px; }
    section.pj-cesta-juego .pj-importe .monto-dec-20 { font-size: 32px; }
    section.pj-cesta-juego .pj-extras .pj-reloj, section.pj-cesta-juego .pj-extras .pj-cierre { padding: 6px 10px; }

    .pj-barra-movil {
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
        display: flex; align-items: center; gap: 12px;
        padding: 10px 16px max(10px, env(safe-area-inset-bottom, 0px));
        background: var(--pj-slate-50); border-top: 2px solid var(--pj-rose-500);
        box-shadow: 0 25px 50px -12px rgba(0, 0, 0, .25);
        font-family: var(--pj-font);
        transition: transform .2s ease, visibility 0s;
    }
    html.pj-tarjeta-vista .pj-barra-movil, .pj-barra-movil.pj-barra-oculta { transform: translateY(110%); visibility: hidden; transition: transform .2s ease, visibility 0s .2s; }
    html.pj-con-barra body { padding-bottom: calc(80px + env(safe-area-inset-bottom, 0px)); }
    html.pj-con-barra .top-scroll { bottom: calc(55px + 80px + env(safe-area-inset-bottom, 0px)); }
    .pj-barra-movil .pj-barra-cifras { flex: none; }
    .pj-barra-movil .pj-barra-total {
        display: block; color: var(--pj-slate-700); font-size: 14px; font-weight: 900; line-height: 18px; letter-spacing: .1em; text-transform: uppercase;
    }
    .pj-barra-movil .pj-barra-imp {
        display: block; color: var(--pj-slate-900); font-size: 24px; font-weight: 900; line-height: 28px; white-space: nowrap; font-variant-numeric: tabular-nums;
    }
    .pj-barra-movil .pj-barra-cta {
        flex: 1 1 auto; min-width: max-content;
        display: flex; flex-direction: column; align-items: center; justify-content: center;
        margin: 0; padding: 8px 24px;
        background: var(--pj-rose-600); border: 0; border-radius: 9999px;
        color: #fff; font-family: var(--pj-font); font-size: 20px; font-weight: 900; line-height: 24px; letter-spacing: .025em; text-transform: uppercase;
        white-space: nowrap; cursor: pointer; transition: background-color .15s, opacity .15s;
    }
    .pj-barra-movil .pj-barra-cta:hover, .pj-barra-movil .pj-barra-cta:focus { background: var(--pj-rose-700); color: #fff; }
    .pj-barra-movil .pj-barra-uds {
        display: block; color: var(--pj-rose-100); font-size: 14px; font-weight: 700; line-height: 17px; letter-spacing: normal; text-transform: none;
    }
    .pj-barra-movil .pj-barra-jugar { display: flex; align-items: center; justify-content: center; gap: 6px; }
    .pj-barra-movil .pj-barra-carrito { flex: none; transform: translateY(-1px); }
    .pj-barra-movil.pj-barra-sin-carrito .pj-barra-carrito { display: none; }
    .pj-barra-movil.pj-barra-pequena .pj-barra-total,
    .pj-barra-movil.pj-barra-pequena .pj-barra-uds { font-size: 13px; line-height: 16px; }
}
/* Bonoloto (7 días en filas de 3) en columnas estrechas: de dos en dos, seguidos (las filas de la tabla se «abren» en una rejilla) */
@media (max-width: 991px) {
    section.pj-cesta-juego .pj-selector table.diasLoto tbody { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    section.pj-cesta-juego .pj-selector table.diasLoto tr { display: contents; }
    section.pj-cesta-juego .pj-selector table.diasLoto tr.panel-semanal td { grid-column: 1 / -1; }
}
/* 320-374: un poco menos de letra y de relleno para que «Miércoles 21» o «Viernes 23» quepan en media columna */
@media (max-width: 374px) {
    section.pj-cesta-juego .pj-selector .semanalSorteos, section.pj-cesta-juego .pj-selector .numeritosDias { gap: 6px; padding: 10px 8px; font-size: 15px; white-space: normal; }
    section.pj-cesta-juego .pj-selector .checkBoxSorteo { width: 18px; height: 18px; }
    section.pj-cesta-juego .pj-importe { flex-wrap: wrap; padding: 14px 16px; }
    section.pj-cesta-juego .pj-importe .monto-dec-20 { font-size: 28px; }
}
@media (min-width: 390px) and (max-width: 767px) {
    .pj-barra-movil { gap: 20px; padding-left: 20px; padding-right: 20px; }
}
/* Tableta (768-991): las dos columnas son estrechas; los días de Bonoloto, de dos en dos */
@media (min-width: 768px) and (max-width: 991px) {
    section.pj-cesta-juego .pj-selector, section.pj-cesta-juego .pj-tarjeta { padding: 16px; }
    section.pj-cesta-juego .pj-importe { padding: 16px 18px; }
    section.pj-cesta-juego .pj-importe .monto-dec-20 { font-size: 30px; }
}