/* ADHENNA · Pádel — capa propia sobre la base visual común (style.css de Buses/Agua)
   Acento nuevo: lima de pelota de pádel, usado solo en pelotas, jugadores "visita" y avisos de partido abierto. */
:root {
  --lima: #D7F205;
  --lima-bg: #F7FCD6;
  --lima-ink: #5B6800;
  --cancha: #1F5BE0;
  --noche: #0E2E7A;
}

/* ── Login con escena de pádel ── */
.login.padel { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr); gap: 0; padding: 0; place-items: stretch; }
.login.padel::before, .login.padel::after { z-index: 0; }
.login.padel .lado-escena { position: relative; z-index: 1; display: flex; flex-direction: column; justify-content: center; padding: 48px 40px 40px 56px; overflow: hidden; }
.login.padel .lado-escena h1 { font-size: clamp(30px, 3.6vw, 50px); line-height: 1.04; max-width: 560px; letter-spacing: -.01em; }
.login.padel .lado-escena h1 em { font-style: normal; color: var(--blue); }
.login.padel .lado-escena p.lead { max-width: 470px; color: var(--ink-2); font-size: 15.5px; margin: 14px 0 0; }
.login.padel .lado-form { position: relative; z-index: 1; display: grid; place-items: center; padding: 32px 24px; }
.chips-lead { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 18px; }
.chips-lead span { display: inline-flex; align-items: center; gap: 6px; background: var(--surface); border: 1px solid var(--line); border-radius: 20px; padding: 6px 12px; font-size: 12.5px; font-weight: 600; color: var(--ink-2); box-shadow: var(--shadow); }
.chips-lead span svg.i { width: 15px; height: 15px; color: var(--blue); }

.escena { position: relative; height: 380px; margin-top: 26px; max-width: 640px; }
.escena > div { position: absolute; }
.esc-cancha { left: 4%; right: 8%; top: 70px; transform: perspective(900px) rotateX(48deg) rotateZ(-8deg); transform-origin: 50% 60%; filter: drop-shadow(0 30px 30px rgba(14, 46, 122, .28)); }
.esc-cancha svg { width: 100%; height: auto; display: block; }
.esc-j1 { left: 6%; top: -10px; animation: flotar 5s ease-in-out infinite; }
.esc-j2 { right: 4%; top: 120px; animation: flotar 6s ease-in-out infinite reverse; }
.esc-p1 { right: 22%; top: -30px; transform: rotate(24deg); animation: girar 9s ease-in-out infinite; }
.esc-p2 { left: 36%; bottom: -16px; transform: rotate(-30deg); }
.esc-b1 { left: 47%; top: 22px; animation: rebote 2.4s cubic-bezier(.5, 0, .5, 1) infinite; }
.esc-b2 { right: 10%; bottom: 40px; animation: rebote 3s cubic-bezier(.5, 0, .5, 1) infinite .6s; }
.esc-b3 { left: 30%; top: 110px; animation: rebote 2.1s cubic-bezier(.5, 0, .5, 1) infinite .3s; }
.esc-trayecto { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.esc-trayecto path { animation: trazo 3s linear infinite; }
@keyframes flotar { 50% { transform: translateY(-10px); } }
@keyframes girar { 50% { transform: rotate(14deg) translateY(-8px); } }
@keyframes rebote { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-26px); } }
@keyframes trazo { to { stroke-dashoffset: -60; } }

.roles-hint button b { font-weight: 700; color: var(--blue-700); }

/* ── Marca lateral ── */
.side .brand .deporte { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
.side .brand .deporte .app { margin-top: 0; }
.side .brand .deporte .ilu-pelota { flex: none; }
.side-ilu { margin: 8px 14px 12px; border-radius: 14px; background: linear-gradient(160deg, var(--pastel-1), var(--pastel-2)); padding: 12px; display: flex; align-items: flex-end; gap: 6px; overflow: hidden; position: relative; min-height: 110px; }
.side-ilu .txt { font-size: 12px; color: var(--blue-700); font-weight: 600; position: relative; z-index: 1; max-width: 120px; }
.side-ilu .txt b { display: block; font-family: var(--font-title); font-size: 20px; color: var(--ink); }
.side-ilu .ilu-jugador { position: absolute; right: -4px; bottom: -14px; }
.side-ilu .ilu-pelota { position: absolute; right: 70px; top: 10px; animation: rebote 2.4s cubic-bezier(.5, 0, .5, 1) infinite; }

/* ── Barra superior ── */
.reloj-club { display: inline-flex; align-items: center; gap: 8px; background: var(--ink); color: #fff; padding: 6px 12px 6px 10px; border-radius: 20px; font-family: var(--font-title); font-weight: 600; font-size: 15px; font-variant-numeric: tabular-nums; }
.reloj-club svg.i { width: 16px; height: 16px; color: var(--lima); }
.pc-pill { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; color: var(--ink-2); background: var(--surface); border: 1px solid var(--line); padding: 5px 11px; border-radius: 20px; cursor: pointer; }
.pc-pill svg.i { width: 15px; height: 15px; }

/* ── Tablero: canchas en vivo ── */
.tablero-grid { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 18px; align-items: start; }
.tablero-grid > .stack { gap: 18px; }
.canchas { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 14px; }
.cz { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); overflow: hidden; display: flex; flex-direction: column; transition: border-color .2s, box-shadow .2s; }
.cz:hover { border-color: var(--pastel-3); box-shadow: 0 6px 22px rgba(16, 24, 40, .09); }
.cz .czh { display: flex; align-items: center; gap: 8px; padding: 12px 14px 8px; }
.cz .czh .n { font-family: var(--font-title); font-weight: 700; font-size: 16px; }
.cz .czh .ap { font-size: 12px; color: var(--muted); flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cz .czh .techo { color: var(--muted); display: inline-grid; }
.cz .czv { padding: 0 12px; position: relative; }
.cz .czv svg.ilu-cancha { width: 100%; height: auto; display: block; border-radius: 10px; }
.cz .czv .crono { position: absolute; right: 20px; top: 8px; background: rgba(11, 13, 18, .82); color: #fff; font-family: var(--font-title); font-weight: 700; font-size: 13px; padding: 3px 9px; border-radius: 8px; font-variant-numeric: tabular-nums; backdrop-filter: blur(4px); }
.cz.est-termina .czv .crono { background: var(--warn); }
.cz .czb { padding: 10px 14px 13px; display: grid; gap: 7px; flex: 1; align-content: start; }
.cz .czb .quien { display: flex; align-items: center; gap: 8px; font-size: 13.5px; }
.cz .czb .quien b { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cz .czb .det { font-size: 12.5px; color: var(--ink-2); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.cz .czb .acc { display: flex; gap: 8px; margin-top: 2px; }
.cz .czb .acc .btn { flex: 1; }
.cz.est-juego { border-color: #C9DAFF; }
.cz.est-termina { border-color: #f5dd9c; box-shadow: 0 0 0 3px rgba(194, 120, 3, .12); }
.cz.est-mantencion .czh .n { color: var(--muted); }
.cz.flash { animation: nuevo 1.6s ease-out; }
.prog { height: 6px; border-radius: 3px; background: var(--pastel-1); overflow: hidden; }
.prog > i { display: block; height: 100%; background: var(--blue); border-radius: 3px; transition: width .6s; }
.cz.est-termina .prog > i { background: var(--warn); }
.pagos-mini { display: flex; gap: 4px; }
.pagos-mini i { width: 18px; height: 6px; border-radius: 3px; background: var(--line); }
.pagos-mini i.ok { background: var(--ok); }
.tag.lima { background: var(--lima-bg); color: var(--lima-ink); border-color: #E3F08A; }
.ilu-cancha .ficha { animation: fichaMov 3.2s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
@keyframes fichaMov { 50% { transform: translate(3px, -2px); } }

.leyenda { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px; color: var(--ink-2); }
.leyenda span { display: inline-flex; align-items: center; gap: 6px; }
.leyenda i { width: 14px; height: 10px; border-radius: 3px; display: inline-block; }

.ocup-row { display: grid; grid-template-columns: 74px 1fr 38px; gap: 10px; align-items: center; font-size: 12.5px; padding: 4px 0; }
.ocup-row .num { text-align: right; font-weight: 700; }
.ocup-strip { display: flex; height: 12px; border-radius: 4px; overflow: hidden; background: var(--surface-2); border: 1px solid var(--line); position: relative; }
.ocup-strip i { position: absolute; top: 0; bottom: 0; background: var(--pastel-4); }
.ocup-strip i.clase { background: var(--ink); }
.ocup-strip i.bloqueo { background: #C9CDD5; }
.ocup-strip i.abierto { background: var(--lima); }
.ocup-strip .ahora { position: absolute; top: -3px; bottom: -3px; width: 2px; background: var(--bad); border-radius: 1px; }

.actv { display: grid; gap: 0; }
.actv .it { display: grid; grid-template-columns: 30px 1fr; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--line); font-size: 13px; }
.actv .it:last-child { border-bottom: 0; }
.actv .it .ico { width: 30px; height: 30px; border-radius: 9px; background: var(--pastel-1); color: var(--blue-700); display: grid; place-items: center; }
.actv .it .ico svg.i { width: 16px; height: 16px; }
.actv .it.online .ico { background: var(--lima-bg); color: var(--lima-ink); }
.actv .it.pago .ico { background: var(--ok-bg); color: var(--ok); }
.actv .it .h { font-size: 11.5px; color: var(--muted); }
.actv .it.nuevo { animation: nuevo 1.6s ease-out; border-radius: 8px; }

.prox { display: grid; gap: 8px; }
.prox .it { display: grid; grid-template-columns: 54px 1fr auto; gap: 10px; align-items: center; padding: 8px 10px; border: 1px solid var(--line); border-radius: 11px; font-size: 13px; cursor: pointer; }
.prox .it:hover { border-color: var(--pastel-4); background: var(--pastel-1); }
.prox .it .hr { font-family: var(--font-title); font-weight: 700; font-size: 16px; }
.prox .it .q { min-width: 0; }
.prox .it .q b { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ── Agenda (grilla canchas × horas) ── */
.agenda-tools { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.agenda-wrap { overflow: auto; max-height: calc(100vh - 230px); border-radius: var(--radius); border: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow); position: relative; }
.agenda { display: grid; grid-template-columns: 64px repeat(6, minmax(150px, 1fr)); position: relative; min-width: 980px; }
.agenda .hcol { position: sticky; left: 0; z-index: 6; background: var(--surface); border-right: 1px solid var(--line); }
.agenda .head { position: sticky; top: 0; z-index: 7; background: var(--surface); border-bottom: 1px solid var(--line); padding: 10px 12px; display: flex; align-items: center; gap: 10px; min-height: 58px; }
.agenda .head.corner { left: 0; z-index: 8; border-right: 1px solid var(--line); }
.agenda .head .mini { width: 46px; flex: none; }
.agenda .head .mini svg { width: 100%; height: auto; display: block; }
.agenda .head b { font-family: var(--font-title); display: block; font-size: 14.5px; }
.agenda .head span { font-size: 11.5px; color: var(--muted); white-space: nowrap; }
.agenda .head > div:last-child { min-width: 0; overflow: hidden; }
.agenda .hora { height: 34px; font-size: 11.5px; color: var(--muted); font-family: var(--font-title); font-weight: 600; text-align: right; padding: 0 8px; transform: translateY(-7px); }
.agenda .col-c { position: relative; border-right: 1px solid var(--line); }
.agenda .col-c:last-child { border-right: 0; }
.agenda .celda { height: 34px; border-bottom: 1px dashed #EDF0F5; cursor: pointer; transition: background .1s; }
.agenda .celda.media { border-bottom: 1px solid var(--line); }
.agenda .celda:hover { background: var(--pastel-1); }
.agenda .celda:hover::after { content: '+ Reservar'; display: block; font-size: 11.5px; color: var(--blue); font-weight: 600; padding: 9px 10px; }
.agenda .celda.pasada { background: repeating-linear-gradient(135deg, transparent 0 6px, rgba(16, 24, 40, .025) 6px 12px); cursor: default; }
.agenda .celda.pasada:hover::after { content: none; }
.bloque { position: absolute; left: 5px; right: 5px; border-radius: 10px; padding: 7px 9px; font-size: 12px; overflow: hidden; cursor: pointer; z-index: 2; border: 1px solid transparent; display: flex; flex-direction: column; gap: 2px; transition: transform .1s, box-shadow .15s; }
.bloque:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(16, 24, 40, .14); z-index: 3; }
.bloque b { font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bloque .t { font-family: var(--font-title); font-weight: 600; font-size: 11.5px; opacity: .85; display: flex; justify-content: space-between; gap: 6px; }
.bloque .chips-b { display: flex; gap: 4px; margin-top: auto; flex-wrap: nowrap; overflow: hidden; }
.bloque .chips-b span { font-size: 10.5px; font-weight: 700; padding: 1px 6px; border-radius: 5px; background: rgba(255, 255, 255, .22); white-space: nowrap; }
.bloque.normal { background: var(--blue); color: #fff; }
.bloque.fijo { background: var(--pastel-2); color: var(--blue-700); border-color: var(--pastel-3); }
.bloque.fijo .chips-b span, .bloque.abierto .chips-b span { background: rgba(255, 255, 255, .7); }
.bloque.abierto { background: var(--lima-bg); color: var(--lima-ink); border: 1.5px dashed #B9CC1A; }
.bloque.clase { background: var(--ink); color: #fff; }
.bloque.bloqueo { background: repeating-linear-gradient(135deg, #EEF0F3 0 8px, #E4E7EC 8px 16px); color: var(--muted); border-color: var(--line); }
.bloque.pasado { opacity: .5; }
.bloque.en-curso { box-shadow: 0 0 0 3px rgba(0, 91, 255, .25); }
.bloque.nuevo { animation: nuevo 1.8s ease-out; }
.linea-ahora { position: absolute; left: 64px; right: 0; height: 0; border-top: 2px solid var(--bad); z-index: 5; pointer-events: none; }
.linea-ahora::before { content: attr(data-h); position: absolute; left: -62px; top: -10px; background: var(--bad); color: #fff; font-family: var(--font-title); font-weight: 700; font-size: 11px; padding: 2px 6px; border-radius: 6px; }

/* ── Formularios de reserva ── */
.seg { display: flex; gap: 6px; flex-wrap: wrap; }
.seg button { border: 1.5px solid var(--line); background: #fff; border-radius: 10px; padding: 8px 13px; font-weight: 600; cursor: pointer; display: inline-flex; gap: 6px; align-items: center; }
.seg button.on { border-color: var(--blue); background: var(--pastel-1); color: var(--blue-700); }
.seg button svg.i { width: 16px; height: 16px; }
.precio-box { border-radius: 12px; background: var(--surface-2); border: 1px solid var(--line); padding: 12px 14px; display: grid; gap: 4px; font-size: 13px; }
.precio-box .l { display: flex; justify-content: space-between; }
.precio-box .tot { display: flex; justify-content: space-between; align-items: baseline; border-top: 1px solid var(--line); padding-top: 8px; margin-top: 4px; }
.precio-box .tot b { font-family: var(--font-title); font-size: 22px; }
.jug-pago { display: grid; grid-template-columns: 34px 1fr 90px 150px; gap: 10px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--line); }
.jug-pago:last-child { border-bottom: 0; }
.jug-pago .monto { font-family: var(--font-title); font-weight: 700; text-align: right; }

/* ── Reserva online (vista celular) ── */
.online-grid { display: grid; grid-template-columns: 400px minmax(0, 1fr); gap: 24px; align-items: start; }
.telefono { width: 380px; max-width: 100%; margin: 0 auto; border-radius: 44px; background: #0B0D12; padding: 12px; box-shadow: 0 30px 70px rgba(14, 46, 122, .28); position: relative; }
.telefono::before { content: ''; position: absolute; top: 20px; left: 50%; transform: translateX(-50%); width: 96px; height: 24px; background: #0B0D12; border-radius: 14px; z-index: 5; }
.telefono .pantalla { border-radius: 34px; overflow: hidden; background: var(--bg); height: 720px; overflow-y: auto; position: relative; }
.pub { min-height: 100%; display: flex; flex-direction: column; }
.pub-hero { background: linear-gradient(150deg, var(--blue) 0%, #0046C7 60%, var(--noche) 100%); color: #fff; padding: 52px 20px 22px; position: relative; overflow: hidden; }
.pub-hero h2 { font-size: 23px; position: relative; z-index: 1; }
.pub-hero p { margin: 4px 0 0; opacity: .85; font-size: 13px; position: relative; z-index: 1; }
.pub-hero .club-ilu { position: absolute; right: -18px; bottom: -26px; opacity: .95; }
.pub-hero .ilu-pelota { position: absolute; right: 96px; top: 40px; animation: rebote 2.4s cubic-bezier(.5, 0, .5, 1) infinite; }
.pub-hero .estado-pc { display: inline-flex; gap: 6px; align-items: center; margin-top: 12px; background: rgba(255, 255, 255, .16); border-radius: 20px; padding: 4px 10px; font-size: 11.5px; font-weight: 600; position: relative; z-index: 1; }
.pub-body { padding: 16px; display: grid; gap: 14px; align-content: start; flex: 1; }
.pub-body h4 { font-family: var(--font-title); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin: 0; }
.dias { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; }
.dias button { flex: none; border: 1.5px solid var(--line); background: #fff; border-radius: 14px; padding: 8px 0; width: 58px; display: grid; justify-items: center; cursor: pointer; }
.dias button small { font-size: 11px; color: var(--muted); text-transform: capitalize; }
.dias button b { font-family: var(--font-title); font-size: 19px; }
.dias button.on { background: var(--ink); border-color: var(--ink); color: #fff; }
.dias button.on small { color: rgba(255, 255, 255, .7); }
.horas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.horas button { border: 1.5px solid var(--line); background: #fff; border-radius: 12px; padding: 9px 4px; cursor: pointer; display: grid; justify-items: center; gap: 1px; }
.horas button b { font-family: var(--font-title); font-size: 16px; }
.horas button small { font-size: 10.5px; color: var(--ok); font-weight: 600; }
.horas button.peak small { color: var(--warn); }
.horas button:disabled { opacity: .4; cursor: not-allowed; text-decoration: line-through; }
.horas button.on { border-color: var(--blue); background: var(--pastel-1); }
.op-cancha { display: grid; grid-template-columns: 70px 1fr auto; gap: 12px; align-items: center; background: #fff; border: 1.5px solid var(--line); border-radius: 14px; padding: 10px; cursor: pointer; text-align: left; width: 100%; }
.op-cancha.on { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(0, 91, 255, .12); }
.op-cancha svg { width: 100%; height: auto; display: block; border-radius: 6px; }
.op-cancha b { font-family: var(--font-title); }
.op-cancha .pr { font-family: var(--font-title); font-weight: 700; }
.pub-pie { position: sticky; bottom: 0; background: rgba(255, 255, 255, .94); backdrop-filter: blur(8px); border-top: 1px solid var(--line); padding: 12px 16px 16px; }
.pub-exito { text-align: center; padding: 30px 18px; display: grid; gap: 10px; justify-items: center; }
.pub-exito .ok-ic { width: 70px; height: 70px; border-radius: 50%; background: var(--ok-bg); color: var(--ok); display: grid; place-items: center; }
.pub-exito .ok-ic.warn { background: var(--warn-bg); color: var(--warn); }
.pub-exito .ok-ic svg.i { width: 34px; height: 34px; }
.cola { display: grid; gap: 8px; }
.cola .it { display: flex; gap: 10px; align-items: center; border: 1px dashed var(--pastel-4); background: var(--pastel-1); border-radius: 11px; padding: 9px 12px; font-size: 13px; }
.flujo { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 10px; align-items: center; text-align: center; }
.flujo .nodo { border: 1px solid var(--line); border-radius: 14px; padding: 14px 8px; background: var(--surface-2); display: grid; justify-items: center; gap: 6px; font-size: 12.5px; }
.flujo .nodo svg.i { width: 26px; height: 26px; color: var(--blue); }
.flujo .nodo.off { opacity: .45; }
.flujo .nodo.off svg.i { color: var(--muted); }
.flujo .flecha { color: var(--pastel-4); }
.flujo .flecha svg.i { width: 26px; height: 26px; }
.flujo .flecha.anim svg.i { animation: empuja 1.2s ease-in-out infinite; color: var(--blue); }
@keyframes empuja { 50% { transform: translateX(4px); } }
body.solo-publica { background: var(--bg); }
body.solo-publica .pub { max-width: 480px; margin: 0 auto; min-height: 100vh; background: var(--bg); }

/* ── Pantalla TV ── */
.tv { position: fixed; inset: 0; z-index: 1500; background: radial-gradient(1200px 600px at 80% -10%, #12317F 0%, #071233 55%, #04091C 100%); color: #fff; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; grid-template-columns: minmax(0, 1fr); padding: 28px 36px; gap: 22px; overflow: hidden; }
.tv .tv-top { display: flex; align-items: center; gap: 20px; }
.tv .tv-top img { height: 34px; }
.tv .tv-top h1 { flex: 1; font-size: 30px; }
.tv .tv-top .hora { font-family: var(--font-title); font-size: 54px; font-weight: 700; font-variant-numeric: tabular-nums; }
.tv .tv-canchas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: minmax(0, 1fr); gap: 22px; min-height: 0; min-width: 0; }
.tv .tv-c { background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12); border-radius: 22px; padding: 16px 18px; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; gap: 10px; min-height: 0; min-width: 0; }
.tv .tv-c .n { display: flex; justify-content: space-between; align-items: center; font-family: var(--font-title); font-size: 22px; font-weight: 700; }
.tv .tv-c svg.ilu-cancha { width: 100%; height: 100%; min-height: 0; }
.tv .tv-c .pie { display: flex; justify-content: space-between; align-items: baseline; font-size: 16px; }
.tv .tv-c .pie b { font-family: var(--font-title); font-size: 28px; color: var(--lima); font-variant-numeric: tabular-nums; }
.tv .tv-c .pie .nm { opacity: .8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 60%; }
.tv .tv-pie { display: flex; gap: 14px; align-items: center; font-size: 15px; opacity: .9; }
.tv .tv-pie .marq { flex: 1; overflow: hidden; white-space: nowrap; }
.tv .tv-pie .marq span { display: inline-block; padding-left: 100%; animation: marq 40s linear infinite; }
@keyframes marq { to { transform: translateX(-100%); } }
.tv .cerrar-tv { position: absolute; bottom: 12px; right: 14px; background: rgba(255, 255, 255, .1); color: #fff; border: 0; border-radius: 10px; padding: 6px 10px; cursor: pointer; opacity: .5; }
.tv .cerrar-tv:hover { opacity: 1; }
.tv .tag { background: rgba(255, 255, 255, .12); color: #fff; border-color: transparent; font-size: 13px; }
.tv .tag.lima { background: var(--lima); color: var(--ink); }
.tv .tag.warn { background: var(--warn); color: #fff; }

/* ── Módulos en construcción ── */
.proximo { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 20px; align-items: center; }
.proximo ul { margin: 10px 0 0; padding-left: 18px; display: grid; gap: 7px; color: var(--ink-2); }
.proximo .ilu { display: grid; place-items: center; position: relative; min-height: 220px; background: linear-gradient(160deg, var(--pastel-1), var(--pastel-2)); border-radius: 18px; overflow: hidden; }
.proximo .ilu .ilu-pelota { position: absolute; left: 30px; top: 30px; animation: rebote 2.4s cubic-bezier(.5, 0, .5, 1) infinite; }

/* ── Responsive ── */
@media (max-width: 1200px) { .tablero-grid { grid-template-columns: 1fr; } .online-grid { grid-template-columns: 1fr; } }
@media (max-width: 980px) {
  .login.padel { grid-template-columns: 1fr; }
  .login.padel .lado-escena { padding: 32px 20px 0; }
  .escena { height: 260px; transform: scale(.8); transform-origin: top left; width: 125%; }
  .proximo { grid-template-columns: 1fr; }
  .tv .tv-canchas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .pc-pill span:last-child, #btnNueva span, .reloj-club svg { display: none; }
  .pc-pill { padding: 6px 8px; }
  #btnNueva { padding: 9px 11px; }
  .reloj-club { font-size: 13px; padding: 5px 9px; }
  .escena { display: none; }
  .login.padel .lado-escena h1 { font-size: 28px; }
  .jug-pago { grid-template-columns: 30px 1fr 90px; }
  .jug-pago select { grid-column: 2 / -1; }
  .telefono { border-radius: 0; padding: 0; box-shadow: none; background: transparent; }
  .telefono::before { display: none; }
  .telefono .pantalla { border-radius: 16px; height: auto; }
  .flujo { grid-template-columns: 1fr; }
  .flujo .flecha { transform: rotate(90deg); justify-self: center; }
}

/* ── Pagos: maquinita (POS) y cobro dividido ── */
.pos-grid { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 22px; align-items: center; }
.pos { width: 230px; margin: 0 auto; background: linear-gradient(180deg, #23262E, #0B0D12); border-radius: 26px 26px 34px 34px; padding: 14px 14px 18px; box-shadow: 0 18px 40px rgba(11, 13, 18, .35), inset 0 1px 0 rgba(255, 255, 255, .08); color: #fff; position: relative; }
.pos-top { display: flex; justify-content: space-between; font-family: var(--font-title); font-size: 11px; letter-spacing: .14em; opacity: .7; padding: 0 4px 8px; }
.pos-top svg.i { width: 14px; height: 14px; }
.pos-pantalla { background: linear-gradient(160deg, #DDE8FF, #F0F5FF); color: var(--ink); border-radius: 12px; padding: 14px 12px; display: grid; gap: 4px; text-align: center; min-height: 118px; align-content: center; transition: background .3s; }
.pos-pantalla small { font-size: 10.5px; color: var(--muted); }
.pos-pantalla b { font-family: var(--font-title); font-size: 30px; font-variant-numeric: tabular-nums; }
.pos-msg { font-size: 12px; font-weight: 600; color: var(--blue-700); }
.pos.esperando .pos-msg { animation: pulsoB 1.4s infinite; }
.pos.aprobado .pos-pantalla { background: linear-gradient(160deg, #C9F2DF, #E7F7F0); }
.pos.aprobado .pos-msg { color: var(--ok); }
.pos.rechazado .pos-pantalla { background: linear-gradient(160deg, #FAD3D5, #FDECEC); }
.pos.rechazado .pos-msg { color: var(--bad); }
.pos-lector { height: 26px; margin: 12px 18px 10px; border-radius: 8px; background: #1A1D24; display: grid; place-items: center; }
.pos-lector i { width: 70%; height: 4px; border-radius: 2px; background: #3A3F4B; }
.pos.esperando .pos-lector i { background: var(--lima); box-shadow: 0 0 12px var(--lima); animation: pulsoB 1s infinite; }
.pos-teclas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; }
.pos-teclas span { background: #2B2F38; border-radius: 9px; text-align: center; padding: 7px 0; font-family: var(--font-title); font-weight: 600; font-size: 14px; box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .4); }
.pos-teclas span.x { background: #B4232A; }
.pos-teclas span.ok { background: #0E8F62; }
.pos-solo { min-height: 100vh; display: grid; place-items: center; align-content: center; gap: 22px; padding: 24px 16px; background: radial-gradient(800px 500px at 50% -10%, #DDE8FF, var(--bg)); }
.pos-solo .pos { width: 270px; }
body.modo-pos { background: var(--bg); }

.fila-cobro { display: grid; grid-template-columns: 34px minmax(0, 1fr) 84px 420px; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line); }
.fila-cobro:last-child { border-bottom: 0; }
.fila-cobro .monto { font-family: var(--font-title); font-weight: 700; text-align: right; }
.fila-cobro .acc-cobro { display: flex; gap: 6px; align-items: center; justify-content: flex-end; flex-wrap: wrap; }
.fila-cobro.pagada input { background: var(--ok-bg); border-color: #bfe8d6; }
.link-pago { grid-column: 2 / -1; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; background: var(--warn-bg); border: 1px solid #f5dd9c; border-radius: 10px; padding: 7px 9px; }
.link-pago input { flex: 1; min-width: 160px; min-height: 32px; padding: 5px 9px; font-family: var(--mono); font-size: 12px; }
.girando { display: inline-grid; animation: girar360 1.6s linear infinite; }
@keyframes girar360 { to { transform: rotate(360deg); } }
@media (max-width: 640px) {
  .pos-grid { grid-template-columns: 1fr; }
  .fila-cobro { grid-template-columns: 30px minmax(0, 1fr) 80px; }
  .fila-cobro .acc-cobro { grid-column: 1 / -1; justify-content: stretch; }
  .fila-cobro .acc-cobro .btn { flex: 1; }
}

/* ── Tanda 1: caja, flujo y jugadores ── */
.chips-filtro { display: flex; gap: 6px; flex-wrap: wrap; }
.chips-filtro button { border: 1.5px solid var(--line); background: var(--surface); border-radius: 20px; padding: 6px 12px; font-weight: 600; font-size: 12.5px; cursor: pointer; color: var(--ink-2); display: inline-flex; gap: 6px; align-items: center; }
.chips-filtro button b { background: var(--surface-2); border-radius: 10px; padding: 0 7px; font-size: 11.5px; }
.chips-filtro button.on { border-color: var(--blue); background: var(--pastel-1); color: var(--blue-700); }
.chips-filtro button.on b { background: var(--pastel-2); }
.hbar { display: grid; grid-template-columns: 170px minmax(0, 1fr) 150px; gap: 12px; align-items: center; padding: 6px 0; font-size: 13px; }
.hbar .b { height: 14px; background: var(--surface-2); border-radius: 4px; overflow: hidden; }
.hbar .b i { display: block; height: 100%; border-radius: 0 4px 4px 0; }
.hbar .v { text-align: right; font-family: var(--font-title); font-weight: 600; font-variant-numeric: tabular-nums; }
.hbar .n { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tip { position: absolute; z-index: 10; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow-lg); padding: 9px 12px; font-size: 12.5px; pointer-events: none; min-width: 170px; display: grid; gap: 3px; }
.tip[hidden] { display: none; }
.tip div { display: flex; align-items: center; gap: 6px; }
.tip div span { margin-left: auto; font-family: var(--font-title); font-weight: 600; }
.tip i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.chart .hit:hover { fill: rgba(0, 91, 255, .05); }
.ficha-cab { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.ficha .kpi .val { font-size: 22px; }
.ficha .precio-box { gap: 8px; }
.sm-sel { width: auto !important; min-height: 32px !important; padding: 4px 8px !important; font-size: 12.5px; }
.fila-cobro .acc-cobro select { max-width: 150px; }
@media (max-width: 640px) { .hbar { grid-template-columns: 110px minmax(0, 1fr) 110px; } }
@media (max-width: 640px) { .kpi .stripes { display: none; } }

/* ── Tanda 2: partidos abiertos, kiosco, ajustes ── */
.ab-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.ab-card { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); padding: 14px; display: grid; gap: 10px; border-top: 4px solid var(--lima); }
.ab-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.ab-fecha { font-family: var(--font-title); font-size: 16px; }
.ab-fecha b { font-size: 20px; }
.ab-cancha svg { width: 100%; height: auto; display: block; border-radius: 10px; }
.ab-slots { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.slot { display: grid; justify-items: center; gap: 4px; font-size: 11.5px; padding: 8px 4px; border-radius: 10px; background: var(--surface-2); border: 1px solid var(--line); }
.slot.libre { border: 1.5px dashed #B9CC1A; background: var(--lima-bg); color: var(--lima-ink); font-weight: 600; }
.slot.libre .avatar { width: 34px; height: 34px; background: #fff; color: var(--lima-ink); border: 1.5px dashed #B9CC1A; }
.ab-acc { display: flex; gap: 6px; flex-wrap: wrap; }
.ab-acc .btn { flex: 1; }
.pub-tabs { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 4px; }
.pub-tabs button { border: 0; background: transparent; border-radius: 10px; padding: 9px 6px; font-weight: 600; font-size: 13px; cursor: pointer; display: inline-flex; gap: 6px; align-items: center; justify-content: center; color: var(--ink-2); }
.pub-tabs button svg.i { width: 16px; height: 16px; }
.pub-tabs button.on { background: var(--ink); color: #fff; }
.pub-tabs button b { background: var(--lima); color: var(--ink); border-radius: 10px; padding: 0 6px; font-size: 11px; }
.pub-ab { text-align: left; background: #fff; border: 1.5px solid var(--line); border-left: 4px solid var(--lima); border-radius: 14px; padding: 12px; display: grid; gap: 7px; cursor: pointer; width: 100%; }
.pub-ab:hover { border-color: var(--pastel-4); }
.pub-ab-h { display: flex; justify-content: space-between; align-items: center; font-family: var(--font-title); }
.pub-ab-slots { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; }
.pub-ab-slots .s { font-size: 11px; text-align: center; padding: 5px 2px; border-radius: 8px; border: 1.5px dashed #B9CC1A; background: var(--lima-bg); color: var(--lima-ink); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pub-ab-slots .s.ok { border: 1px solid var(--pastel-3); background: var(--pastel-1); color: var(--blue-700); }
.pub-ab-slots .s.tu { border: 1.5px solid var(--blue); background: var(--blue); color: #fff; }
.kq-grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 18px; align-items: start; }
.kq-prods { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.kq-prod { background: var(--surface); border: 1.5px solid var(--line); border-radius: 14px; padding: 12px 10px; display: grid; justify-items: center; gap: 4px; cursor: pointer; text-align: center; transition: border-color .15s, transform .08s; }
.kq-prod:hover { border-color: var(--blue); }
.kq-prod:active { transform: scale(.97); }
.kq-prod.agotado { opacity: .45; cursor: not-allowed; }
.kq-ico { height: 56px; display: grid; place-items: center; }
.kq-ico svg { max-height: 56px; }
.kq-prod b { font-size: 13px; line-height: 1.25; }
.kq-precio { font-family: var(--font-title); font-weight: 700; font-size: 17px; color: var(--blue-700); }
.kq-stock { font-size: 11px; color: var(--muted); }
.kq-stock.bajo { color: var(--warn); font-weight: 700; }
.kq-carro { position: sticky; top: 84px; }
.kq-linea { display: grid; grid-template-columns: minmax(0, 1fr) 104px 76px; gap: 8px; align-items: center; font-size: 13px; }
.kq-linea b { text-align: right; font-family: var(--font-title); }
.kq-linea .qty button { width: 30px; height: 32px; font-size: 17px; }
.kq-linea .qty input { min-height: 32px; font-size: 14px; }
.kq-pagos { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.cf-cancha { display: flex; gap: 12px; align-items: center; padding: 8px; border: 1px solid var(--line); border-radius: 12px; }
.cf-cancha .mini { width: 64px; flex: none; }
.cf-cancha .mini svg { width: 100%; height: auto; display: block; }
.cf-cancha.off { opacity: .6; }
@media (max-width: 1100px) { .kq-grid { grid-template-columns: 1fr; } .kq-carro { position: static; } }
.scan-bar { display: flex; align-items: center; gap: 10px; background: var(--surface); border: 1.5px dashed var(--pastel-4); border-radius: 12px; padding: 4px 12px; flex-wrap: wrap; }
.scan-bar svg.i { width: 22px; height: 22px; color: var(--blue); flex: none; }
.scan-bar input { border: 0 !important; box-shadow: none !important; flex: 1; min-width: 180px; font-family: var(--mono); font-size: 15px; background: transparent; }
.scan-bar:focus-within { border-style: solid; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(0, 91, 255, .12); }
.scan-bar .small { white-space: nowrap; }
.card > .hd .scan-bar { flex: 1 1 420px; }

/* ═══════════ Tanda 3 · Academia ═══════════ */
.chips-filtro button i { width: 9px; height: 9px; border-radius: 50%; display: inline-block; }
.ac-semana { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; }
.ac-dia { background: var(--surface-2); border: 1px solid var(--line); border-radius: 12px; padding: 8px; display: grid; gap: 6px; align-content: start; min-height: 160px; }
.ac-dia.hoy { background: var(--pastel-1); border-color: var(--pastel-3); }
.ac-dia-h { display: flex; justify-content: space-between; align-items: baseline; text-transform: capitalize; font-size: 12.5px; color: var(--muted); padding: 0 2px 2px; }
.ac-dia-h span { font-family: var(--font-title); font-weight: 700; font-size: 18px; color: var(--ink); }
.ac-dia.hoy .ac-dia-h span { color: var(--blue); }
.ac-vacio { color: var(--line); text-align: center; padding: 14px 0; }
.ac-clase { text-align: left; border: 1px solid var(--line); border-left: 4px solid var(--c); background: var(--surface); border-radius: 10px; padding: 8px 9px; cursor: pointer; display: grid; gap: 2px; font: inherit; color: inherit; transition: transform .1s, box-shadow .15s; }
.ac-clase:hover { transform: translateY(-1px); box-shadow: var(--shadow); }
.ac-clase.pasada { opacity: .72; }
.ac-clase b { font-family: var(--font-title); font-size: 15px; }
.ac-cupos { display: flex; gap: 3px; align-items: center; margin-top: 4px; }
.ac-cupos i { width: 10px; height: 10px; border-radius: 50%; background: var(--line); }
.ac-cupos i.on { background: var(--c); }
.ac-cupos i.aus { background: var(--bad); opacity: .5; }
.ac-cupos span { font-size: 11px; color: var(--muted); margin-left: 4px; font-weight: 600; }
.ac-alumnos { display: grid; gap: 6px; }
.ac-al { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 12px; flex-wrap: wrap; }
.ac-al .asis { display: flex; gap: 4px; }
.ac-al .asis button, .pf-asis { width: 34px; height: 34px; border-radius: 10px; border: 1.5px solid var(--line); background: var(--surface); display: grid; place-items: center; cursor: pointer; color: var(--muted); }
.ac-al .asis button.si, .pf-asis.si.on { background: var(--ok); border-color: var(--ok); color: #fff; }
.ac-al .asis button.no, .pf-asis.no.on { background: var(--bad); border-color: var(--bad); color: #fff; }
.ac-al .cob { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.ac-plan { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.ac-plan > div { flex: 1; }
.ac-plan .pr { font-family: var(--font-title); font-size: 17px; }
.ac-plan-op { border: 1.5px solid var(--line); background: var(--surface); border-radius: 12px; padding: 12px; display: grid; gap: 2px; text-align: left; cursor: pointer; font: inherit; }
.ac-plan-op span { font-family: var(--font-title); font-size: 18px; font-weight: 700; color: var(--blue); }
.ac-plan-op small { color: var(--muted); }
.ac-plan-op.on { border-color: var(--blue); background: var(--pastel-1); box-shadow: 0 0 0 3px rgba(0, 91, 255, .12); }
.ac-profes { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.ac-prof { overflow: hidden; }
.ac-prof.off { opacity: .6; }
.ac-prof.nuevo { border: 2px dashed var(--pastel-3); background: var(--pastel-1); cursor: pointer; font: inherit; color: var(--blue-700); }
.ac-prof.nuevo .bd { display: grid; place-items: center; gap: 8px; min-height: 170px; }
.ac-color { width: 30px; height: 30px; border-radius: 50%; border: 3px solid #fff; box-shadow: 0 0 0 1px var(--line); cursor: pointer; }
.ac-color.on { box-shadow: 0 0 0 3px var(--ink); }
.ac-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 8px; }
.chip button { border: 0; background: transparent; padding: 0 0 0 4px; cursor: pointer; color: inherit; vertical-align: middle; }
.chip button svg.i { width: 12px; height: 12px; }
.chips { display: flex; gap: 6px; flex-wrap: wrap; }
.bloque.clase .chips-b span { background: rgba(255, 255, 255, .18); }
.bloque.bloqueo.torneo { background: repeating-linear-gradient(135deg, #FFF8D6 0 8px, #F7FCD6 8px 16px); color: var(--lima-ink); border-color: #E3F08A; }
@media (max-width: 1100px) { .ac-semana { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ═══════════ Tanda 3 · Torneos y ranking ═══════════ */
.to-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; }
.to-card { text-align: left; font: inherit; color: inherit; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 16px; display: grid; gap: 10px; cursor: pointer; box-shadow: var(--shadow); position: relative; overflow: hidden; transition: transform .12s, box-shadow .15s; }
.to-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }
.to-card::after { content: ''; position: absolute; right: -40px; top: -40px; width: 120px; height: 120px; border-radius: 50%; background: var(--pastel-1); z-index: 0; }
.to-card > * { position: relative; z-index: 1; }
.to-card.inscripcion::after { background: var(--lima-bg); }
.to-card.finalizado { background: var(--surface-2); }
.to-card-top { display: flex; gap: 12px; align-items: flex-start; }
.to-card-top b { font-size: 15.5px; }
.to-ic { width: 40px; height: 40px; border-radius: 12px; background: var(--ink); color: var(--lima); display: grid; place-items: center; flex: none; }
.to-ic.grande { width: 58px; height: 58px; border-radius: 16px; }
.to-ic.grande svg.i { width: 30px; height: 30px; }
.to-prog { height: 8px; border-radius: 6px; background: var(--line); overflow: hidden; }
.to-prog i { display: block; height: 100%; background: var(--lima); border-radius: 6px; }
.to-prog.azul i { background: var(--blue); }
.to-camp { display: flex; align-items: center; gap: 8px; background: var(--ink); color: #fff; border-radius: 10px; padding: 8px 12px; font-size: 13px; }
.to-camp span { color: var(--lima); font-weight: 600; }
.to-head .band { background: linear-gradient(90deg, var(--blue), var(--lima)); }
.to-cifras { display: flex; gap: 10px; }
.to-cifras > div { background: var(--surface-2); border: 1px solid var(--line); border-radius: 12px; padding: 8px 14px; display: grid; min-width: 104px; }
.to-cifras span { font-size: 11.5px; color: var(--muted); }
.to-cifras b { font-family: var(--font-title); font-size: 19px; }
.to-insc { display: flex; gap: 8px; flex-wrap: wrap; }
.to-insc input { flex: 1 1 180px; }
.to-rondas { display: grid; gap: 16px; }
.to-ronda { display: grid; gap: 6px; }
.to-llave { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(250px, 1fr); gap: 16px; overflow-x: auto; align-items: center; }
.to-llave .to-ronda { align-content: space-around; height: 100%; }
.to-llave .to-match { grid-template-columns: minmax(0, 1fr); gap: 4px; }
.to-llave .to-match .eq.der { text-align: left; }
.to-llave .to-match .tag { justify-self: start; }
.to-match { display: grid; grid-template-columns: auto minmax(0, 1fr) 64px auto 64px minmax(0, 1fr); gap: 8px; align-items: center; padding: 8px 10px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.to-match:has(.sets) { grid-template-columns: auto minmax(0, 1fr) 110px minmax(0, 1fr); }
.to-match.ok { background: var(--surface-2); }
.to-match.bye { grid-template-columns: 1fr auto; opacity: .7; border-style: dashed; }
.to-match .eq { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.to-match .eq.der { text-align: right; }
.to-match .eq.gana { font-weight: 700; color: var(--blue-700); }
.to-match .vs { color: var(--muted); }
.to-res { width: 100%; text-align: center; font-family: var(--font-title); font-weight: 700; font-size: 15px; padding: 6px 4px; border: 1.5px solid var(--line); border-radius: 9px; background: var(--surface); }
.to-res:focus { border-color: var(--blue); outline: none; box-shadow: 0 0 0 3px rgba(0, 91, 255, .15); }
.to-res:disabled { background: transparent; border-color: transparent; color: var(--ink); }
.to-pos { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; background: var(--surface-2); font-family: var(--font-title); }
.to-pos.p1 { background: var(--lima); color: var(--ink); }
.to-pos.p2 { background: var(--pastel-3); color: var(--blue-700); }
.to-pos.p3 { background: #F6D8C2; color: #8A4B1C; }
.to-podio { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; align-items: end; text-align: center; }
.to-podio .pz { display: grid; justify-items: center; gap: 4px; }
.to-podio .pz .avatar { width: 46px; height: 46px; font-size: 15px; }
.to-podio .pz b { font-size: 13px; }
.to-podio .pz span { font-size: 11.5px; color: var(--muted); }
.to-podio .esc { width: 100%; border-radius: 10px 10px 4px 4px; font-family: var(--font-title); font-weight: 700; font-size: 22px; display: grid; place-items: center; margin-top: 6px; }
.to-podio .p1 .esc { height: 86px; background: var(--lima); }
.to-podio .p2 .esc { height: 62px; background: var(--pastel-3); color: var(--blue-700); }
.to-podio .p3 .esc { height: 44px; background: #F6D8C2; color: #8A4B1C; }
.to-podio .p1 .avatar { background: var(--ink); color: var(--lima); }
.to-formatos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.to-formatos button { border: 1.5px solid var(--line); background: var(--surface); border-radius: 12px; padding: 10px; text-align: left; display: grid; gap: 3px; cursor: pointer; font: inherit; }
.to-formatos button small { color: var(--muted); font-size: 11.5px; line-height: 1.3; }
.to-formatos button.on { border-color: var(--blue); background: var(--pastel-1); }
.to-formatos button:disabled { opacity: .5; cursor: not-allowed; }
.to-tv-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; min-height: 0; }
.to-tv h2 { font-size: 22px; color: var(--lima); margin: 0 0 12px; }
.to-tv-tabla .fila { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 10px 16px; border-radius: 12px; background: rgba(255, 255, 255, .06); margin-bottom: 6px; font-size: 21px; }
.to-tv-tabla .fila .ps { font-family: var(--font-title); font-weight: 700; font-size: 24px; opacity: .7; }
.to-tv-tabla .fila.p1 { background: var(--lima); color: var(--ink); }
.to-tv-tabla .fila.p1 .pos { opacity: 1; }
.to-tv-tabla .fila b { font-family: var(--font-title); font-size: 24px; }
.to-tv-tabla .nm { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.to-tv-prox .m { display: grid; grid-template-columns: 120px minmax(0, 1fr) 40px minmax(0, 1fr); gap: 12px; align-items: center; padding: 14px 16px; border-radius: 12px; background: rgba(255, 255, 255, .08); margin-bottom: 8px; font-size: 19px; }
.to-tv-prox .m .c { font-family: var(--font-title); color: var(--lima); }
.to-tv-prox .m i { text-align: center; opacity: .6; font-style: normal; }
.to-tv-prox .campeon { display: grid; justify-items: center; gap: 8px; padding-top: 20px; }
.to-tv-prox .campeon b { font-family: var(--font-title); font-size: 34px; text-align: center; }
.to-tv-prox .campeon span { color: var(--lima); font-size: 20px; }
@media (max-width: 980px) { #rkGrid { grid-template-columns: 1fr !important; } .to-formatos { grid-template-columns: 1fr; } .to-match { grid-template-columns: minmax(0, 1fr) 56px auto 56px minmax(0, 1fr); } .to-match > .tag { display: none; } }

/* ═══════════ Tanda 3 · Perfil profesor (celular) ═══════════ */
body.modo-celular { background: var(--bg); }
.prof .rep-top .reloj-club { background: var(--ink); }
.pf-clase .eh { cursor: pointer; align-items: center; }
.pf-clase .orden { width: 48px; height: 48px; border-radius: 12px; display: grid; place-items: center; line-height: 1; font-size: 18px; background: var(--pastel-2); }
.pf-clase .orden small { font-size: 11px; opacity: .7; }
.pf-clase.en-curso { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(0, 91, 255, .15); }
.pf-clase.en-curso .orden { background: var(--blue); color: #fff; }
.pf-clase.pasada .orden { background: var(--surface-2); color: var(--muted); }
.pf-flecha { color: var(--muted); }
.pf-det { border-top: 1px solid var(--line); padding: 12px 14px 14px; display: grid; gap: 10px; }
.pf-al { display: flex; align-items: center; gap: 10px; }
.pf-asis { width: 46px; height: 46px; border-radius: 14px; }
.pf-asis svg.i { width: 22px; height: 22px; }
.pub-tabs button { padding: 9px 4px; font-size: 12.5px; }
.pub-to { border-left-color: var(--ink); }
.pub-rank { background: #fff; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.pub-rank .f { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto 36px; gap: 8px; align-items: center; padding: 8px 12px; border-bottom: 1px solid var(--line); font-size: 13px; }
.pub-rank .f:last-child { border-bottom: 0; }
.pub-rank .f small { color: var(--muted); font-size: 11px; }
.pub-rank .f > b:last-child { text-align: right; font-family: var(--font-title); }
.pub-rank .to-pos { width: 24px; height: 24px; font-size: 12px; }
/* menú más largo desde la tanda 3: compacto en pantallas bajas */
@media (max-height: 1000px) { .side-ilu { display: none; } .nav a { padding: 7px 12px; } .nav .sec-t { padding: 10px 12px 3px; } }
.to-llave .to-match, .to-llave .to-match:has(.sets) { grid-template-columns: minmax(0, 1fr); gap: 4px; }
.to-llave .to-res.sets { text-align: left; font-size: 14px; padding: 4px 8px; }
.to-llave .to-res.sets:disabled { padding-left: 0; color: var(--blue-700); }

/* ═══════════ Tanda 4 · Mantención ═══════════ */
.mt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 16px; }
.mt-cancha { overflow: hidden; }
.mt-cancha .band.ok { background: var(--ok); } .mt-cancha .band.warn { background: #E8A13A; } .mt-cancha .band.bad { background: var(--bad); }
.mt-mini { width: 64px; flex: none; border-radius: 8px; overflow: hidden; }
.mt-t { display: grid; gap: 4px; padding: 8px 0; border-bottom: 1px dashed var(--line); }
.mt-t:last-of-type { border-bottom: 0; }
.mt-t > .row b { font-size: 13.5px; flex: 1; }
.mt-t > .row .tag { flex: none; }
.mt-bar { flex: 0 0 70px; height: 8px; border-radius: 6px; background: var(--surface-2); border: 1px solid var(--line); overflow: hidden; margin-right: 6px; }
.mt-bar i { display: block; height: 100%; border-radius: 6px; }
.mt-bar.ok i { background: var(--ok); } .mt-bar.warn i { background: #E8A13A; } .mt-bar.bad i { background: var(--bad); }
.mt-inc { display: flex; gap: 8px; align-items: center; text-align: left; width: 100%; font: inherit; font-size: 13px; padding: 8px 10px; border-radius: 10px; border: 1px solid #F6C9CB; background: var(--bad-bg); color: var(--ink); cursor: pointer; }
.mt-inc span:first-of-type { flex: 1; }
.mt-inc svg.i { color: var(--bad); flex: none; }
.mt-inc.baja, .mt-inc.media { border-color: #F5E1B5; background: var(--warn-bg); }
.mt-inc.baja svg.i, .mt-inc.media svg.i { color: var(--warn); }
.mt-incs { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 14px; }
.mt-inc-card { background: var(--surface); border: 1px solid var(--line); border-left: 4px solid var(--bad); border-radius: 14px; padding: 14px; display: grid; gap: 8px; box-shadow: var(--shadow); }
.mt-inc-card.en_proceso { border-left-color: #E8A13A; }
.mt-inc-card.resuelta { border-left-color: var(--ok); opacity: .85; }
.mt-fotos { display: flex; gap: 6px; flex-wrap: wrap; }
.mt-fotos img, .mt-thumb { width: 64px; height: 64px; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); display: block; }
.mt-thumb { width: 44px; height: 44px; }
.mt-hist { display: grid; gap: 6px; }
.mt-hist > div { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.mt-check { display: grid; gap: 6px; }
.mt-check .chk-big { display: flex; gap: 10px; align-items: center; padding: 10px 12px; border: 1.5px solid var(--line); border-radius: 12px; cursor: pointer; }
.mt-check .chk-big input { width: 22px; height: 22px; accent-color: var(--ok); }
.mt-check .chk-big:has(input:checked) { border-color: var(--ok); background: var(--ok-bg); }
.mt-foto { display: grid; gap: 8px; justify-items: start; border: 1.5px dashed var(--pastel-3); background: var(--pastel-1); border-radius: 12px; padding: 12px; cursor: pointer; color: var(--blue-700); font-weight: 600; }
.mt-foto span { display: inline-flex; gap: 8px; align-items: center; }
.mt-foto img { max-width: 100%; max-height: 180px; border-radius: 8px; }
.mt-canchas { display: grid; grid-template-columns: repeat(auto-fill, minmax(52px, 1fr)); gap: 6px; }
.mt-canchas button { height: 48px; border-radius: 12px; border: 1.5px solid var(--line); background: var(--surface); font-family: var(--font-title); font-size: 18px; font-weight: 700; cursor: pointer; }
.mt-canchas button.on { background: var(--blue); border-color: var(--blue); color: #fff; }
.mant .entrega .orden.bad { background: var(--bad); color: #fff; } .mant .entrega .orden.warn { background: #E8A13A; color: #fff; }
.mant .entrega .orden { width: 48px; height: 48px; border-radius: 12px; font-size: 16px; line-height: 1; }
.mant .entrega .orden small { font-size: 10px; }
.mc-inc .orden { background: var(--bad-bg) !important; color: var(--bad) !important; }
.mc-inc.baja .orden, .mc-inc.media .orden { background: var(--warn-bg) !important; color: var(--warn) !important; }
.mc-inc .acciones button, .mc-t .acciones button { font-size: 14px; padding: 13px 4px; }
@media (max-width: 640px) { .mt-modal { width: 100%; } .mt-incs, .mt-grid { grid-template-columns: 1fr; } }

/* ═══════════ Tanda 4 · Rentabilidad ═══════════ */
.rt-calor { display: grid; gap: 3px; overflow-x: auto; }
.rt-calor .hh { font-size: 11px; color: var(--muted); text-align: center; font-family: var(--font-title); }
.rt-calor .dd { font-size: 12.5px; font-weight: 600; display: flex; align-items: center; }
.rt-calor .cc { height: 34px; border-radius: 6px; display: grid; place-items: center; font-size: 11px; font-weight: 600; font-variant-numeric: tabular-nums; cursor: default; }
.rt-calor .cc:hover { outline: 2px solid var(--ink); outline-offset: 1px; }
.rt-escala { display: flex; align-items: center; gap: 2px; font-size: 11px; color: var(--muted); }
.rt-escala i { width: 18px; height: 10px; border-radius: 2px; }
.rt-escala span { margin: 0 4px; }
.rt-eq { display: grid; gap: 6px; }
.rt-eq-bar { position: relative; height: 16px; border-radius: 8px; background: var(--surface); border: 1px solid var(--line); }
.rt-eq-bar i { display: block; height: 100%; border-radius: 8px; background: var(--blue); }
.rt-eq-bar b { position: absolute; top: -5px; bottom: -5px; width: 2px; background: var(--ink); }
.rt-mini > div { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 10px; display: grid; gap: 2px; }
.rt-mini span { font-size: 11.5px; color: var(--muted); }
.rt-mini b { font-family: var(--font-title); font-size: 16px; }
.rt-mini small { font-size: 11px; color: var(--muted); }
.rt-muerta { display: flex; gap: 12px; align-items: center; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; }
.rt-muerta .d { display: grid; text-align: center; min-width: 92px; background: var(--pastel-1); border-radius: 10px; padding: 6px; }
.rt-muerta .d span { font-size: 12px; color: var(--blue-700); font-family: var(--font-title); }
.rt-oc { display: flex; gap: 8px; align-items: center; min-width: 120px; }
.rt-oc .b { flex: 1; height: 8px; background: var(--surface-2); border-radius: 4px; overflow: hidden; }
.rt-oc .b i { display: block; height: 100%; background: #005BFF; border-radius: 0 4px 4px 0; }
.rt-oc span { font-size: 12px; font-weight: 600; width: 34px; text-align: right; }
@media (max-width: 1100px) { #rtFila1, #rtFila2 { grid-template-columns: 1fr !important; } }
.rt-tabla td:first-child { white-space: nowrap; }
.mant .mc-t .orden { display: flex; align-items: baseline; justify-content: center; padding-top: 15px; font-size: 15px; }

/* ═══════════ Webpay, política de pago y control de acceso ═══════════ */
.wp-card .band { background: linear-gradient(90deg, #D5006C, #005BFF); }
.wp-pasos { display: grid; gap: 8px; }
.wp-pasos > div { display: flex; gap: 8px; align-items: flex-start; }
.wp-pasos svg.i { color: var(--ok); flex: none; margin-top: 2px; }
.wp-bit { display: grid; gap: 4px; max-height: 300px; overflow: auto; }
.wp-bit > div { display: grid; grid-template-columns: 110px 1fr; gap: 8px; padding: 4px 0; border-bottom: 1px dashed var(--line); }
.seg button:disabled { opacity: .35; cursor: not-allowed; }
.ac-paso { display: flex; gap: 10px; align-items: flex-start; }
.ac-paso > b { width: 24px; height: 24px; border-radius: 50%; background: var(--blue); color: #fff; display: grid; place-items: center; flex: none; font-family: var(--font-title); }
@media (max-width: 1100px) { #acGrid { grid-template-columns: 1fr !important; } }
.ak { position: fixed; inset: 0; z-index: 1600; background: radial-gradient(1100px 600px at 70% -10%, #12317F 0%, #071233 55%, #04091C 100%); color: #fff; display: grid; grid-template-rows: auto 1fr auto; padding: 26px 34px; overflow: hidden; }
.ak-top { display: flex; align-items: center; gap: 16px; font-family: var(--font-title); font-size: 20px; }
.ak-top img { height: 30px; }
.ak-top span { flex: 1; opacity: .85; }
.ak-top b { font-size: 40px; font-variant-numeric: tabular-nums; }
.ak-centro { display: grid; place-items: center; align-content: center; gap: 14px; text-align: center; }
.ak-centro h1 { font-size: clamp(28px, 4.5vw, 56px); margin: 0; }
.ak-centro p { margin: 0; opacity: .7; font-size: 18px; }
.ak-carnet { position: relative; width: min(340px, 70vw); animation: akFlota 3s ease-in-out infinite; }
.ak-svg { width: 100%; display: block; filter: drop-shadow(0 20px 40px rgba(0, 0, 0, .45)); }
.ak-laser { position: absolute; left: -6%; right: -6%; height: 3px; background: #D7F205; box-shadow: 0 0 16px #D7F205; top: 10%; animation: akLaser 1.8s ease-in-out infinite; border-radius: 3px; }
.ak-centro.leyendo .ak-laser { animation-duration: .4s; }
@keyframes akLaser { 0%, 100% { top: 8%; } 50% { top: 88%; } }
@keyframes akFlota { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
.ak-pie { display: flex; justify-content: space-between; align-items: flex-end; }
.ak-torni { width: 170px; opacity: .9; }
.ak-gate { width: 100%; }
.ak-gate .hoja-i, .ak-gate .hoja-d { transition: transform .6s cubic-bezier(.2, .8, .2, 1); transform-box: fill-box; }
.ak-gate .hoja-i { transform-origin: left center; } .ak-gate .hoja-d { transform-origin: right center; }
.ak-gate.abierto .hoja-i { transform: rotate(-80deg); } .ak-gate.abierto .hoja-d { transform: rotate(80deg); }
.ak-manual { background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .2); color: #fff; border-radius: 10px; padding: 10px 14px; cursor: pointer; font: inherit; }
.ak-res { grid-row: 1 / -1; display: grid; place-items: center; align-content: center; gap: 14px; text-align: center; margin: -26px -34px; padding: 30px; animation: akEntra .25s ease-out; }
.ak-res.ok { background: radial-gradient(900px 500px at 50% 30%, #12a074 0%, #0b6b4d 70%); }
.ak-res.no { background: radial-gradient(900px 500px at 50% 30%, #e0474c 0%, #8f1f24 70%); }
.ak-res h1 { font-size: clamp(32px, 5vw, 64px); margin: 0; max-width: 1000px; }
.ak-res p { font-size: clamp(18px, 2.2vw, 26px); margin: 0; max-width: 900px; opacity: .92; }
.ak-ic { width: 120px; height: 120px; border-radius: 50%; background: rgba(255, 255, 255, .18); display: grid; place-items: center; }
.ak-ic svg.i { width: 64px; height: 64px; stroke-width: 2.4; }
.ak-res .ak-torni { width: 260px; }
.ak-av { background: rgba(0, 0, 0, .2); border-radius: 30px; padding: 8px 18px; font-size: 16px; }
@keyframes akEntra { from { opacity: 0; transform: scale(.98); } to { opacity: 1; transform: none; } }
.ak .cerrar-tv { position: absolute; top: 10px; right: 14px; background: rgba(255, 255, 255, .08); color: #fff; border: 0; border-radius: 10px; padding: 6px 10px; cursor: pointer; opacity: .45; z-index: 2; font: inherit; font-size: 12.5px; } .ak .cerrar-tv:hover { opacity: 1; }
/* pestañas de pasarelas de pago */
.pg-tabs { width: 100%; }
.pg-tabs button { display: grid; grid-template-columns: auto auto; column-gap: 8px; align-items: center; justify-items: start; text-align: left; padding: 9px 16px; }
.pg-tabs button small { grid-column: 2; font-weight: 500; font-size: 11px; color: var(--muted); }
.pg-tabs button .dot { grid-row: span 2; width: 9px; height: 9px; border-radius: 50%; background: var(--line); display: inline-block; }
.pg-tabs button .dot.on { background: var(--ok); } .pg-tabs button .dot.warn { background: #E8A13A; }
.pg-toggles { display: grid; gap: 6px; padding: 10px 12px; border: 1px dashed var(--pastel-3); border-radius: 12px; background: var(--pastel-1); }
.pg-pasos ol { margin: 0; padding-left: 18px; display: grid; gap: 6px; }
.seg button:disabled { opacity: .4; cursor: not-allowed; }
/* franjas de precio */
.fr-barra { display: flex; height: 44px; border-radius: 10px; overflow: hidden; border: 1px solid var(--line); }
.fr-barra > div { display: grid; align-content: center; padding: 0 8px; min-width: 0; overflow: hidden; border-right: 2px solid var(--surface); }
.fr-barra > div:last-child { border-right: 0; }
.fr-barra b { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fr-barra span { font-size: 10.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; opacity: .85; }
.fr-lista { display: grid; gap: 6px; }
.fr-fila { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto auto 34px; gap: 8px; align-items: center; }
.fr-fila > i { width: 10px; height: 34px; border-radius: 4px; }
.fr-fila label { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--muted); }
.fr-fila input[type=time] { width: 135px; } .fr-fila input[type=number] { width: 110px; }
@media (max-width: 640px) { .fr-fila { grid-template-columns: 10px 1fr 34px; } .fr-fila label { grid-column: 2; } }

/* ── Kiosco: fotos de productos y celular vinculado ── */
.kq-ico.con-foto { width: 72px; height: 72px; border-radius: 12px; overflow: hidden; background: var(--bg, #F4F6FA); }
.kq-ico.con-foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kq-mini { display: inline-grid; place-items: center; flex: none; border-radius: 9px; overflow: hidden; background: var(--bg, #F4F6FA); border: 1px solid var(--line); color: var(--muted); vertical-align: middle; }
.kq-mini img { width: 100%; height: 100%; object-fit: cover; display: block; }
.kq-mini .i { width: 46%; height: 46%; opacity: .7; }
.kq-mini-btn { appearance: none; border: 0; background: none; padding: 0; cursor: pointer; border-radius: 10px; }
.kq-mini-btn:hover .kq-mini { border-color: var(--blue); color: var(--blue); }
.kq-ln { display: flex; align-items: center; gap: 10px; min-width: 0; }
.kq-linea .kq-ln { gap: 8px; }
.kq-foto-ed { display: flex; align-items: center; gap: 12px; padding: 10px; border: 1px dashed var(--line); border-radius: 12px; }
.kq-qr { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 20px; align-items: start; }
.kq-qr-cod { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 10px; position: relative; }
.kq-qr-cod::before { content: ''; position: absolute; left: 14px; right: 14px; top: 0; height: 3px; background: linear-gradient(90deg, var(--blue) 0 70%, #D7F205 70%); border-radius: 0 0 3px 3px; }
.kq-qr-cod svg { width: 100%; height: auto; display: block; }
.kq-pasos { margin: 0; padding-left: 20px; display: grid; gap: 6px; font-size: 14px; }
.kq-estado { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px; background: var(--bg, #F4F6FA); font-weight: 500; font-size: 14px; }
.kq-estado.ok { background: #E7F7EE; color: #0B6B35; }
.kq-estado.azul { background: #E8F0FF; color: var(--blue-700, #0046C7); }
.kq-estado .i { width: 18px; height: 18px; }
.kq-estado .pulso { width: 10px; height: 10px; border-radius: 50%; background: var(--blue); animation: kqPulso 1.2s ease-in-out infinite; flex: none; }
@keyframes kqPulso { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .35; transform: scale(.7); } }
.kq-cel-on { display: inline-flex; align-items: center; gap: 8px; padding: 4px 4px 4px 10px; border-radius: 999px; background: #E7F7EE; color: #0B6B35; font-size: 13px; font-weight: 500; }
.kq-cel-on .i { width: 16px; height: 16px; }
@media (max-width: 640px) { .kq-qr { grid-template-columns: 1fr; } .kq-qr-cod { max-width: 240px; margin: 0 auto; } }
.t td .kq-ln > div { min-width: 170px; }

/* ── Registro de jugador nuevo y carnet ── */
.rg-fila { display: flex; gap: 8px; align-items: stretch; }
.rg-fila input { flex: 1; min-width: 0; }
.rg-fila .btn { white-space: nowrap; flex: none; }
.rg-nuevo { border: 1.5px dashed var(--warn); background: var(--warn-bg); border-radius: 12px; padding: 12px; display: grid; gap: 10px; }
.rg-nuevo[hidden] { display: none; }
.rg-tit { display: flex; gap: 8px; align-items: flex-start; flex-wrap: wrap; }
.rg-tit .small { flex: 1; min-width: 200px; }
.rg-carnet { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 18px; align-items: start; }
.rg-ilu { display: grid; place-items: center; padding-top: 6px; }
.rg-cel { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
@media (max-width: 640px) { .rg-carnet { grid-template-columns: 1fr; } .rg-ilu { display: none; } }

/* ── Nueva reserva: grilla de disponibilidad ── */
.modal.nr-modal { max-width: 1180px; }
.nr-disp { display: grid; gap: 10px; margin-bottom: 18px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.nr-top { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; }
.nr-dias { display: flex; gap: 6px; flex-wrap: wrap; }
.nr-dias button { appearance: none; border: 1.5px solid var(--line); background: var(--surface); border-radius: 12px; min-width: 54px; padding: 6px 8px; display: grid; justify-items: center; cursor: pointer; font: inherit; color: var(--ink); }
.nr-dias button small { font-size: 11px; color: var(--muted); text-transform: capitalize; }
.nr-dias button b { font-family: var(--font-title); font-size: 17px; line-height: 1.1; }
.nr-dias button.on { background: var(--blue); border-color: var(--blue); color: #fff; }
.nr-dias button.on small { color: rgba(255,255,255,.8); }
.nr-otra { display: grid; gap: 4px; font-size: 12px; color: var(--muted); margin-left: auto; }
.nr-otra input { padding: 7px 10px; }
.nr-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.nr-g { display: grid; min-width: 760px; row-gap: 6px; padding: 10px 10px 12px 0; align-items: stretch; }
.nr-h { font-size: 11px; color: var(--muted); font-family: var(--mono); padding-left: 2px; border-left: 1px solid var(--line); height: 18px; }
.nr-c { position: sticky; left: 0; z-index: 2; background: var(--surface); padding: 4px 10px; display: grid; align-content: center; line-height: 1.15; }
.nr-c b { font-size: 13px; }
.nr-c small { font-size: 11px; color: var(--muted); }
.nr-esq { height: 18px; }
.nr-s { appearance: none; border: 0; margin: 0; height: 38px; background: #EAF7EF; border-left: 1px solid #fff; cursor: pointer; padding: 0; transition: background .1s; }
.nr-s.hr { border-left-color: var(--line); }
.nr-s:hover, .nr-s.prev { background: #BFE6CD; }
.nr-s.sel { background: var(--blue); }
.nr-s.sel.prev { background: var(--blue-700); }
.nr-s.pas { background: repeating-linear-gradient(135deg, var(--surface-2) 0 4px, var(--bg) 4px 8px); cursor: not-allowed; }
.nr-o { height: 38px; border-radius: 8px; margin: 0 1px; background: #D9DEE8; color: #4A5468; font-size: 11px; font-weight: 600; display: flex; align-items: center; padding: 0 8px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; cursor: not-allowed; }
.nr-o.fijo { background: var(--pastel-2); }
.nr-o.clase { background: #E7E0FF; color: #4B3A9A; }
.nr-o.bloqueo { background: repeating-linear-gradient(135deg, #E5E7EB 0 6px, #F3F4F6 6px 12px); }
.nr-o.abierto { background: #EEF8C2; color: #4F5A00; }
.nr-pie { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; font-size: 12px; }
.nr-ley { display: inline-flex; align-items: center; gap: 6px; }
.nr-ley i { width: 14px; height: 14px; border-radius: 4px; display: inline-block; }
.nr-ley i.l { background: #EAF7EF; border: 1px solid #BFE6CD; }
.nr-ley i.o { background: #D9DEE8; }
.nr-ley i.s { background: var(--blue); }
.nr-sel { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 14px; border-radius: 12px; background: var(--pastel-1); font-size: 14px; }
.nr-sel .i { width: 18px; height: 18px; color: var(--blue); }

/* ── Kiosco: ficha de producto por pasos ── */
.modal.pd-modal { max-width: 760px; }
.pd-paso { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding-top: 6px; border-top: 1px solid var(--line); margin-top: 4px; }
.pd-paso:first-child { border-top: 0; margin-top: 0; padding-top: 0; }
.pd-paso .small { flex: 1; min-width: 220px; }
.pd-num { width: 24px; height: 24px; border-radius: 50%; background: var(--blue); color: #fff; display: grid; place-items: center; font: 700 13px var(--font-title); flex: none; }
.pd-dist-n { border: 1.5px dashed var(--blue); background: var(--pastel-1); border-radius: 12px; padding: 12px; display: grid; gap: 10px; }
.pd-dist-n[hidden] { display: none; }
.kq-foto-ed .btn { flex: none; }
.kq-foto-ed { flex-wrap: wrap; }