:root{--bg:#07090f;--panel:#0f1420;--panel2:#151c2c;--line:#3d4e78;--line2:#6a82b6;--gold:#d9b44a;--gold2:#f3dc8f;--blue:#37b6ff;--green:#4fe08a;--copper:#d58a4f;
--text:#e9edf6;--mut:#8c97b1;--red:#ff6b6b;--ok:#4fe08a}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font:15px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
a{color:var(--blue)}button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{margin:0;font-weight:700}h1{font-size:1.5rem}h2{font-size:1.15rem;color:var(--gold2)}h3{font-size:1rem;color:var(--gold)}
.muted{color:var(--mut)}.right{text-align:right}.nowrap{white-space:nowrap}.pos{color:var(--ok)}.neg{color:var(--red)}.gold{color:var(--gold2)}
/* login */
.login{min-height:100vh;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 50% 0,#14203a 0,var(--bg) 60%)}
.login-card{width:100%;max-width:380px;text-align:center}
.login-card img{width:200px;height:200px;filter:drop-shadow(0 0 24px #d9b44a55)}
.login-card form{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px;margin-top:8px;text-align:left}
/* shell */
.shell{display:grid;grid-template-columns:230px minmax(0,1fr);min-height:100vh}
.side{background:var(--panel);border-right:1px solid var(--line);padding:16px 12px;display:flex;flex-direction:column;gap:4px;position:sticky;top:0;height:100vh;height:100dvh;overflow-y:auto}
.side .brand{display:flex;align-items:center;gap:10px;padding:4px 8px 14px}
.side .brand img{width:54px;height:54px}.side .brand b{color:var(--gold2);line-height:1.1;font-size:.95rem}
.side a.nav{display:block;padding:9px 12px;border-radius:9px;color:var(--text);text-decoration:none}
.side a.nav:hover{background:var(--panel2)}.side a.nav.on{background:#d9b44a22;color:var(--gold2);box-shadow:inset 3px 0 var(--gold)}
.side a.nav.rojo{color:#ff5a5a;font-weight:700;letter-spacing:.04em}
.side a.nav.rojo.on{background:#ff5a5a22;color:#ff7a7a;box-shadow:inset 3px 0 #ff5a5a}
.rojo-t{color:#ff5a5a}
.btn.wa{border-color:#25d366;color:#25d366}
.side .brand{text-decoration:none;border-radius:12px;transition:background .15s}.side .brand:hover,.side .brand:focus-visible{background:var(--panel2)}
.side .who{border-bottom:1px solid var(--line);padding:0 8px 14px;margin-bottom:8px;font-size:.85rem}
.side .who-cuenta{display:flex;flex-direction:column;gap:1px;line-height:1.3}.side .who-cuenta b{color:var(--text);font-size:.92rem}
.side .who .ver{font-size:.72rem;margin-top:8px;line-height:1.3}
.btn.salir{display:block;width:100%;margin-top:10px;border:0;border-radius:999px;padding:8px 14px;background:linear-gradient(#e5484d,#b3262b);color:#fff;font-weight:700;letter-spacing:.3px;text-align:center;cursor:pointer}
.btn.salir:hover{background:linear-gradient(#f05a5f,#c42f34);border:0}
main{padding:24px;max-width:1300px;width:100%;min-width:0}
.top{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:16px}
.btn.menu-btn{display:none}
.banner{background:#d9b44a1f;border:1px solid var(--gold);color:var(--gold2);padding:10px 14px;border-radius:10px;margin-bottom:16px}
/* controls */
.btn{background:var(--panel2);border:1px solid var(--line);padding:8px 14px;border-radius:9px;cursor:pointer;text-decoration:none;display:inline-block}
.btn:hover{border-color:var(--gold)}.btn.pri{background:linear-gradient(#e6c45a,#b8922c);color:#1a1405;border:0;font-weight:700}
.btn.danger{border-color:#7a3030;color:var(--red)}.btn.sm{padding:4px 9px;font-size:.85rem}.btn:disabled{opacity:.5;cursor:wait}
label{display:block;font-size:.85rem;color:var(--mut);margin:12px 0 4px}
input,select,textarea{width:100%;background:#0a0e18;border:1px solid var(--line);border-radius:8px;padding:9px 11px}
input:focus,select:focus,textarea:focus{outline:2px solid var(--gold);outline-offset:-1px}
/* Campos con la misma altura y sin desbordes. Safari de iPhone dibuja los campos de fecha y los selectores con tamaño propio
   (más anchos y altos que el resto, con el texto centrado): se les quita ese aspecto nativo para que encajen en la grilla. */
input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]),select{height:48px}
textarea{min-height:48px}
input[type=date],input[type=time],input[type=datetime-local],input[type=month]{-webkit-appearance:none;appearance:none;min-width:0;max-width:100%;text-align:left;line-height:normal}
input[type=date]::-webkit-date-and-time-value,input[type=time]::-webkit-date-and-time-value{text-align:left;margin:0;min-height:1.3em}
input[type=date]::-webkit-calendar-picker-indicator{margin:0;padding:0}
select{-webkit-appearance:none;appearance:none;padding-right:36px;background:#0a0e18 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%238c97b1' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 14px center/12px 8px}
.row>*,.vi-row>*,.modo-row>*{min-width:0}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
input[type=checkbox],input[type=radio]{width:auto}
.row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr));gap:0 14px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px}
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.err{color:var(--red);min-height:1.2em;margin-top:10px;font-size:.9rem}
/* tables */
.tw{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
table{border-collapse:collapse;width:100%}th,td{padding:8px 11px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
td{overflow-wrap:anywhere}   /* un email largo se corta dentro de su celda en vez de ensanchar toda la tabla */
th{background:#0b4a1e;color:#fff;font-size:.82rem;font-weight:600;white-space:nowrap}tr:last-child td{border-bottom:0}
tr.click{cursor:pointer}tr.click:hover td{background:var(--panel2)}tr.off td{opacity:.45;text-decoration:line-through}
td.num,th.num{text-align:right;white-space:nowrap}
/* calc panel (estilo excel) */
.calc{border:1px solid var(--line);border-radius:10px;overflow:hidden}
.calc div{display:flex;justify-content:space-between;gap:12px;padding:7px 12px;border-bottom:1px solid var(--line);background:#1c1a0f}
.calc div:last-child{border-bottom:0}.calc .h{background:#2a2510;color:var(--gold2);font-weight:700;justify-content:center}
.calc .k{color:#f3dc8f}.calc .hl{background:#2a2510;color:#ff9b7a;font-weight:700}.calc .fav{background:#3a2c12;color:#ffb36b;font-weight:800;font-size:1.05rem}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:18px 0 16px;flex-wrap:wrap}
.tab{padding:9px 16px;border:0;background:none;color:var(--mut);cursor:pointer;border-bottom:3px solid transparent}
.tab.on{color:var(--gold2);border-color:var(--gold)}
.badge{display:inline-block;padding:2px 9px;border-radius:99px;font-size:.78rem;border:1px solid var(--line);background:var(--panel2)}
.badge.g{border-color:var(--ok);color:var(--ok)}.badge.y{border-color:var(--gold);color:var(--gold2)}.badge.r{border-color:var(--red);color:var(--red)}
.tools{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px;align-items:center}.tools input,.tools select{width:auto;min-width:150px}
.perm-g{border:1px solid var(--line);border-radius:10px;padding:8px 12px;margin-top:8px}.perm-g b{color:var(--gold)}
.perm-g label{display:flex;gap:8px;align-items:center;color:var(--text);margin:6px 0}
/* modal */
.ov{position:fixed;inset:0;background:#000b;display:flex;overflow:auto;padding:30px 12px;z-index:50}
.modal{margin:auto;background:var(--panel);border:1px solid var(--gold);border-radius:14px;padding:20px;width:100%;max-width:620px}
.modal header{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.modal .x{background:none;border:0;color:var(--mut);font-size:1.5rem;cursor:pointer}
.actions{display:flex;gap:8px;justify-content:flex-end;margin-top:18px;flex-wrap:wrap}
.choice{display:block;border:1px solid var(--line);border-radius:10px;padding:12px;margin-top:10px;cursor:pointer;color:var(--text);font-size:1rem}
.choice:has(input:checked){border-color:var(--gold);background:#d9b44a14}.choice small{display:block;color:var(--mut)}
.sugg{border:1px solid var(--line);border-radius:8px;margin-top:4px;overflow:hidden}.sugg button{display:block;width:100%;text-align:left;padding:7px 10px;background:var(--panel2);border:0;border-bottom:1px solid var(--line);cursor:pointer}
.modo-row{display:grid;grid-template-columns:1fr 150px auto;gap:8px;align-items:center;margin-top:6px}
#toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);background:var(--panel2);border:1px solid var(--gold);padding:10px 18px;border-radius:10px;opacity:0;pointer-events:none;transition:.25s;z-index:99}
#toast.show{opacity:1}
@media(max-width:820px) and (pointer:coarse){   /* solo en celulares y tablets: en la computadora (aunque se amplíe la página) el menú queda fijo y sin botón */
 .shell{grid-template-columns:minmax(0,1fr)}
 .side{position:fixed;left:-260px;width:250px;z-index:40;transition:.25s}.side.open{left:0;box-shadow:0 0 40px #000}
 .side.open + .backdrop{display:block;position:fixed;inset:0;background:#0009;z-index:35}
 .btn.menu-btn{display:inline-block}main{padding:14px 12px 28px}
 .side a.nav{padding:13px 12px}
}
@media(max-width:700px){
 body{font-size:16px}
 h1{font-size:1.2rem}
 input,select,textarea{font-size:16px;padding:11px 12px} /* 16px evita el zoom automático en iPhone */
 .btn{padding:10px 14px;min-height:44px}.btn.sm{padding:8px 12px;min-height:40px}
 .ov{padding:0;display:block;background:var(--panel);overflow-x:hidden}
 .modal{border-radius:0;border-width:0;min-height:100%;max-width:none!important;padding:16px 14px 0;box-sizing:border-box}
 .modal .actions{position:sticky;bottom:0;background:var(--panel);padding:12px 0 14px;margin-top:14px;border-top:1px solid var(--line)}
 .modal .actions .btn{flex:1 1 auto}
 .tabs{flex-wrap:wrap;margin:14px 0}.tab{white-space:nowrap;padding:11px 12px}
 .tools{gap:8px}.tools input,.tools select{flex:1 1 100%;width:100%}
 .top{gap:10px}.top > div:last-child{width:100%;display:flex;gap:8px;flex-wrap:wrap}.top > div:last-child .btn{flex:1 1 auto;text-align:center}
 .modo-row{grid-template-columns:1fr 110px 44px}
 #toast{width:calc(100% - 24px);text-align:center;top:auto;bottom:calc(env(safe-area-inset-bottom) + 84px)} /* arriba de la barra de botones: no tapa ni los botones ni los títulos */
 .row{grid-template-columns:1fr}
 input[type=checkbox],input[type=radio]{padding:0;width:22px;height:22px;flex:none}
 .perm-g label,label.choice{align-items:center}
}
/* En pantallas de hasta 1270 px (celulares, tablets y laptops chicas, con el menú lateral) las tablas pasan a tarjetas: no entran en ese ancho */
@media(max-width:1270px){
 /* tablas -> tarjetas */
 .tw{border:0;background:none;overflow:visible}
 table.cards,table.cards tbody{display:block;width:100%}
 table.cards tr:has(> th){display:none}
 table.cards tr{display:block;background:var(--panel);border:1px solid var(--line);border-radius:12px;margin-bottom:10px;padding:6px 12px}
 table.cards td{display:flex;justify-content:space-between;align-items:baseline;gap:14px;border:0;padding:5px 0;text-align:right;white-space:normal}
 table.cards td::before{content:attr(data-label);color:var(--mut);font-size:.8rem;text-align:left;flex:0 0 36%}
 /* los textos largos sin espacios (emails, nombres) se cortan en vez de ensanchar la tarjeta y toda la página */
 table.cards,table.cards tbody,table.cards tr{min-width:0;max-width:100%}
 table.cards td,.modal p,.card p,.muted,h1,h2,h3,.calc div span{overflow-wrap:anywhere;word-break:break-word;min-width:0}
 table.cards td>*{min-width:0;max-width:100%}
 table.cards td>.val{display:block;flex:1 1 auto;text-align:right}
 table.cards td.notas{max-width:none;font-size:1rem}
 /* tarjetas del celular según el estado de pago: borde y fondo verdes (pagó todo) o rojos (debe) */
 table.cards tr.pagado{border:2px solid var(--ok);background:linear-gradient(rgba(79,224,138,.09),rgba(79,224,138,.03)),var(--panel)}
 table.cards tr.debe{border:2px solid var(--red);background:linear-gradient(rgba(255,107,107,.09),rgba(255,107,107,.03)),var(--panel)}
 table.cards tr.pagado td,table.cards tr.debe td{background:none;box-shadow:none}
 /* el nombre y apellido de la persona es el TÍTULO de la tarjeta: arriba, grande y resaltado, con el documento debajo */
 table.cards tr{display:flex;flex-direction:column}
 table.cards td.titulo{order:-1;display:block;text-align:left;padding:2px 0 10px;margin-bottom:6px;border-bottom:1px solid var(--line)}
 table.cards td.titulo::before{content:none;display:none}
 table.cards td.titulo>.val{display:block;text-align:left}
 table.cards td.titulo b{display:block;font-size:1.22rem;line-height:1.25;color:var(--gold2)}
 table.cards td.titulo .muted{display:block;margin-top:3px;font-size:.92rem}
 table.cards td.titulo .badge{margin-top:4px}
 table.cards td.titulo br{display:none}   /* el salto de línea sobraba: nombre y documento ya son bloques */
 table.cards td:empty,table.cards td[data-label="#"]{display:none}
 table.cards td:not([data-label]){justify-content:flex-start;flex-wrap:wrap;gap:8px;padding-top:8px}
 table.cards td:not([data-label])::before{content:none;display:none}   /* la fila de botones no lleva etiqueta: sin el hueco que reservaba */
 table.cards td:not([data-label]) .btn{flex:1 1 auto;text-align:center}
 table.cards td.span{display:block;text-align:left}table.cards td.span::before{content:none}
}
/* selector de archivo en español */
.filepick{position:relative;display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:8px;background:#0a0e18;padding:0 10px;height:48px}
.filepick input{position:absolute!important;inset:0;width:100%!important;height:100%!important;margin:0;padding:0!important;opacity:0;cursor:pointer}
.filepick:focus-within{outline:2px solid var(--gold)}
.fbtn{background:var(--panel2);border:1px solid var(--line);border-radius:7px;padding:5px 12px;white-space:nowrap;font-size:.9rem;line-height:1.3}
.fname{color:var(--mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9rem;min-width:0;flex:1 1 0}
/* botones de selección (cuentas) */
.pillrows{display:grid;gap:8px}
.pills{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:8px}
label.pill{position:relative;display:block;margin:0;color:var(--text);cursor:pointer}
.pill input{position:absolute!important;inset:0;width:100%!important;height:100%!important;margin:0;padding:0!important;opacity:0;cursor:pointer}
.pill span{display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:10px;padding:6px 10px;min-height:48px;text-align:center;background:var(--panel2);font-weight:600;line-height:1.25}
.pill small{display:block;color:var(--mut);font-weight:400;font-size:.78rem;margin-top:2px}
.pill:hover span{border-color:var(--gold)}
.pill input:checked + span{border-color:var(--gold);background:#d9b44a24;color:var(--gold2);box-shadow:inset 0 0 0 1px var(--gold)}
.pill input:focus-visible + span{outline:2px solid var(--blue)}
/* viabilidad */
.vi-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-items:start} /* el resultado (Gasto estimado) va abajo de todo */
.vi-entradas{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,400px),1fr));align-items:start}
.vi-result{max-width:760px}
.vi-total{font-size:2rem;font-weight:800;color:var(--gold2);margin:4px 0 12px}
.vi-row{display:grid;grid-template-columns:minmax(0,1fr) 150px 42px;gap:8px;margin-top:8px;align-items:center}
.vi-dolar{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;margin-bottom:6px}.vi-dolar b{font-size:1.4rem;color:var(--gold2)}
.calc div span:last-child{text-align:right}
@media(max-width:900px){.vi-row{grid-template-columns:minmax(0,1fr) 110px 42px}}
/* estado de pago: verde = pagó todo (va al final), rojo = le falta pagar */
tr.pagado td{background:rgba(79,224,138,.07)}
tr.pagado td:first-child{box-shadow:inset 4px 0 0 var(--ok)}
tr.debe td{background:rgba(255,107,107,.06)}
tr.debe td:first-child{box-shadow:inset 4px 0 0 var(--red)}
.resumen-pago{margin:0 0 12px;font-size:.92rem}.resumen-pago .deben{color:var(--red);font-weight:600}.resumen-pago .pagaron{color:var(--ok);font-weight:600}
/* notas visibles en las listas (curso y deudores) */
td.notas{max-width:220px;min-width:90px;font-size:.9rem;white-space:normal;overflow-wrap:anywhere}
td.acciones{white-space:normal;min-width:140px}   /* los botones pasan a otra línea si falta lugar, en vez de cortarse a la derecha */
td.acciones .btn{margin:2px 4px 2px 0}
.val{min-width:0}
.backdrop{display:none}
.aviso-debe{margin:12px 0 0;padding:10px 12px;border-radius:10px;border:1px solid var(--line);font-weight:600}
.aviso-debe.debe{border-color:#e5484d;color:#ff8a8d;background:#e5484d14}
.aviso-debe.pagado{border-color:#3fb26b;color:#7fdc9f;background:#3fb26b14}
small.debe-todo{color:#ff8a8d;font-weight:600;white-space:normal}
.pills + .pills,.pillrows .pill-directo{margin-top:0}
.pill-directo span{border-style:dashed}
ul.extras{list-style:none;margin:0 0 8px;padding:0}ul.extras li{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:4px 0;overflow-wrap:anywhere}
label.chk{display:flex;gap:8px;align-items:center;font-weight:400;margin-top:8px}label.chk input{width:auto!important;min-height:0!important}
tr[hidden]{display:none!important}
/* Cursos: activos en verde, finalizados en azul */
.badge.b{color:var(--blue);border-color:var(--blue);background:rgba(55,182,255,.1)}
tr.activo td{background:rgba(79,224,138,.07)}tr.activo td:first-child{box-shadow:inset 4px 0 0 var(--green)}
tr.fin td{background:rgba(55,182,255,.06)}tr.fin td:first-child{box-shadow:inset 4px 0 0 var(--blue)}
@media(max-width:1270px){
 table.cards tr.activo{border:2px solid var(--green);background:linear-gradient(rgba(79,224,138,.09),rgba(79,224,138,.03)),var(--panel)}
 table.cards tr.fin{border:2px solid var(--blue);background:linear-gradient(rgba(55,182,255,.09),rgba(55,182,255,.03)),var(--panel)}
 table.cards tr.activo td,table.cards tr.fin td{background:none;box-shadow:none}
}
/* Finanzas */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:12px 0}
.tile{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:4px}
.tile .k,.card.dest .k{color:var(--mut);font-size:.82rem;text-transform:uppercase;letter-spacing:.04em}
.tile b{font-size:1.6rem}.tile small{color:var(--mut)}
.card.dest b{font-size:1.1rem;line-height:1.4;display:block;margin-top:4px}
h3.sec{margin:26px 0 8px;color:var(--gold)}
.barra{height:8px;border-radius:99px;background:var(--panel2);overflow:hidden;min-width:90px;margin-bottom:5px}.barra i{display:block;height:100%}.barra i.g{background:var(--ok)}.barra i.p{background:var(--red)}
.grafico{overflow-x:auto;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 10px 6px}
.gr-int{position:relative;display:flex;gap:8px;min-width:100%;width:max-content;height:260px;padding-bottom:0}
.gr-cero{position:absolute;left:0;right:0;top:calc(50% - 20px);border-top:1px solid var(--line)}
.gr-col{position:relative;width:64px;flex:0 0 64px;display:flex;flex-direction:column;align-items:stretch}
.gr-arriba,.gr-abajo{height:calc(50% - 20px);display:flex;justify-content:center}
.gr-arriba{align-items:flex-end}.gr-abajo{align-items:flex-start}
.gr-col i{display:block;width:70%;min-height:3px;border-radius:4px}.gr-col i.g{background:var(--ok)}.gr-col i.p{background:var(--red)}
.gr-et{text-align:center;font-size:.8rem;color:var(--mut);margin-top:4px}.gr-v{text-align:center;font-size:.72rem}
.meta-linea{position:absolute;left:0;right:0;border-top:2px dashed var(--gold);z-index:1;pointer-events:none}.meta-linea span{position:absolute;right:0;top:-18px;font-size:.72rem;color:var(--gold2);background:var(--panel);padding:0 4px}
.gr-doble{height:240px}.gr-par{height:calc(100% - 58px);display:flex;align-items:flex-end;justify-content:center;gap:4px}
.gr-par i{display:block;width:40%;min-height:2px;border-radius:4px 4px 0 0}.gr-par i.g{background:var(--ok)}.gr-par i.p{background:var(--red)}
.alerta-perdida{margin:12px 0;padding:12px 14px;border-radius:10px;border:1px solid #e5484d;background:#e5484d14;color:#ff9a9c}

/* Barra de carga */
body::before{content:"";position:fixed;left:0;top:0;height:3px;width:100%;z-index:200;background:linear-gradient(90deg,transparent,var(--gold),transparent);background-size:40% 100%;background-repeat:no-repeat;opacity:0;pointer-events:none;transition:opacity .2s}
body.cargando::before{opacity:1;animation:barra 1.1s linear infinite}
@keyframes barra{from{background-position:-40% 0}to{background-position:140% 0}}
@media(prefers-reduced-motion:reduce){body.cargando::before{animation:none;background-size:100% 100%}}

/* Accesibilidad */
.saltar{position:fixed;left:8px;top:-60px;z-index:300;background:var(--gold);color:#111;border:0;border-radius:8px;padding:10px 14px;font-weight:700}
.saltar:focus{top:8px}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
th[data-ord]{cursor:pointer;user-select:none}
th[data-ord]:hover{color:var(--gold2)}
th[aria-sort=ascending]::after{content:" ▲";font-size:.7em}
th[aria-sort=descending]::after{content:" ▼";font-size:.7em}
main:focus{outline:none}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* Barra de acciones fija en el celular (+ Inscribir, + Cobro, etc.) */
@media(max-width:700px){
 .tools.barra-fija{position:fixed;left:0;right:0;bottom:0;z-index:45;margin:0;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:var(--panel);border-top:1px solid var(--line);box-shadow:0 -8px 24px #0009;display:flex;gap:8px}
 .tools.barra-fija .btn{flex:1;min-width:0;padding-left:6px;padding-right:6px}
 body:has(.barra-fija) main{padding-bottom:96px}
}

/* Versión para imprimir o guardar en PDF: fondo claro, sin menús ni botones */
@media print{
 :root{--bg:#fff;--panel:#fff;--panel2:#f3f3f3;--line:#bbb;--text:#111;--mut:#555;--gold:#6b4f00;--gold2:#6b4f00;--ok:#0a7a3a;--red:#b00020;--blue:#0b5cad;--green:#0a7a3a;--copper:#8a4b12}
 html,body{background:#fff!important;color:#111!important;font-size:12px}
 .side,.backdrop,.top .btn,.top a.btn,.tools,.barra-fija,#toast,.saltar,.menu-btn,.banner,button,.acciones,td:last-child .btn{display:none!important}
 .shell{display:block!important}main{padding:0!important}
 .calc,.card,.tile,.tw,.grafico{border:1px solid #bbb!important;background:#fff!important;box-shadow:none!important;break-inside:avoid}
 .calc .h,th{background:#eee!important;color:#111!important}
 tr.debe td,tr.pagado td,tr.activo td,tr.fin td{background:#fff!important}
 table{width:100%!important}a{color:#111;text-decoration:none}
 h1{font-size:18px}.gr-int{height:200px}
}
.alerta-aviso{margin:12px 0;padding:12px 14px;border-radius:10px;border:1px solid var(--gold);background:#d9b44a14;color:var(--gold2)}
.curso-card{display:block}.curso-card:hover{border-color:var(--gold)}

/* Calendario de cursos (solo lectura; público y con sesión) */
.cal-publico{max-width:1100px;margin:0 auto;padding:16px}
.cal-publico header{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.cal-publico header img{width:48px;height:48px;border-radius:50%}.cal-publico header h1{flex:1;margin:0;font-size:1.3rem}
.cal-barra{display:flex;align-items:center;gap:8px;margin-bottom:10px}.cal-barra h2{flex:1;margin:0;text-align:center;text-transform:capitalize;font-size:1.2rem}
.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.cal-dia-nombre{text-align:center;color:var(--mut);font-size:.78rem;text-transform:uppercase;padding:4px 0}
.cal-celda{min-height:92px;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:4px;display:flex;flex-direction:column;gap:3px;overflow:hidden}
.cal-celda.vacia{background:transparent;border-color:transparent}
.cal-celda.hoy{border-color:var(--gold);box-shadow:inset 0 0 0 1px var(--gold)}
.cal-num{font-size:.8rem;color:var(--mut)}.cal-celda.hoy .cal-num{color:var(--gold2);font-weight:700}
.cal-chip,.cal-item{--c:var(--gold);text-decoration:none;color:var(--text)}
.cal-chip{display:flex;align-items:center;gap:5px;background:color-mix(in srgb,var(--c) 18%,var(--panel));border-left:3px solid var(--c);border-radius:4px;padding:2px 5px;font-size:.76rem;line-height:1.25;min-width:0}
.cal-chip i,.cal-item i{display:block;flex:0 0 8px;width:8px;height:8px;border-radius:50%;background:var(--c)}
.cal-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
a.cal-chip:hover,a.cal-item:hover{filter:brightness(1.25)}
.cal-chip.fin,.cal-item.fin{opacity:.6}
.cal-mas{font-size:.72rem;color:var(--mut)}
.cal-lista{display:grid;gap:8px}
.cal-item{display:flex;align-items:center;gap:12px;background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--c);border-radius:10px;padding:10px 12px}
.cal-item>div:nth-child(2){flex:1;min-width:0}.cal-estado{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
@media(max-width:700px){
 .cal-celda{min-height:56px;padding:3px}
 .cal-chip{padding:0;border:0;background:none;display:inline-flex}.cal-chip span{display:none}.cal-chip i{width:10px;height:10px;flex-basis:10px}
 .cal-celda{flex-direction:row;flex-wrap:wrap;align-content:flex-start;gap:3px}.cal-num{flex:0 0 100%}
 .cal-mas{font-size:.65rem}
}
@media print{.cal-publico header .btn,.cal-barra .btn{display:none!important}}

/* El atributo hidden siempre oculta, aunque el elemento tenga display propio (.row, etc.) */
[hidden]{display:none!important}

/* Resumen del curso: colores según el significado (verde entra, rojo sale, dorado ganancia, ámbar pendiente) y barras animadas */
.rs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:14px;align-items:start}
.rs-tiles{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:12px}
.rs-tile{position:relative;background:linear-gradient(160deg,var(--t1,#151c2c),var(--panel));border:1px solid var(--tb,var(--line));border-radius:14px;padding:14px 14px 12px;display:flex;flex-direction:column;gap:3px;overflow:hidden}
.rs-tile::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--tc,var(--gold))}
.rs-tile .k{color:var(--mut);font-size:.78rem;text-transform:uppercase;letter-spacing:.05em}
.rs-tile b{font-size:1.65rem;line-height:1.15;font-variant-numeric:tabular-nums;white-space:nowrap}
.rs-tile small{color:var(--mut);font-size:.8rem}
.rs-tile.verde{--tc:var(--ok);--t1:#10231a;--tb:#1f4a33}.rs-tile.rojo{--tc:var(--red);--t1:#27141a;--tb:#552631}
.rs-tile.dorado{--tc:var(--gold);--t1:#251f0d;--tb:#53441a}.rs-tile.ambar{--tc:#ffb454;--t1:#271c0d;--tb:#59401a}
.amb{color:#ffb454}
.rs-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:14px 16px;border-top:3px solid var(--line)}
.rs-card h3{margin:0 0 10px;color:var(--gold2);display:flex;justify-content:space-between;gap:10px;align-items:baseline;flex-wrap:wrap}
.rs-card.amb-borde{border-top-color:#ffb454}.rs-card.verde-borde{border-top-color:var(--ok)}.rs-card.rojo-borde{border-top-color:var(--red)}
.rs-total{color:#ffb454;font-variant-numeric:tabular-nums;white-space:nowrap}
.rs-fila{margin-bottom:11px}.rs-fila-top{display:flex;align-items:center;gap:8px}
.rs-nombre{flex:1;min-width:0;overflow-wrap:anywhere}.rs-fila-top b{font-variant-numeric:tabular-nums;white-space:nowrap}.rs-pct{min-width:2.6em;text-align:right}
.rs-punto{width:10px;height:10px;border-radius:50%;flex:0 0 10px;background:var(--mut)}
.rs-punto.naranja,.rs-bar i.naranja{background:#ff9b5e}.rs-punto.azul,.rs-bar i.azul{background:var(--blue)}.rs-punto.violeta,.rs-bar i.violeta{background:#c58bff}.rs-punto.gris,.rs-bar i.gris{background:#8c97b1}
.rs-bar{height:9px;border-radius:99px;background:var(--panel2);overflow:hidden;margin-top:6px}
.rs-bar i{display:block;height:100%;width:0;border-radius:99px;transition:width .9s cubic-bezier(.2,.8,.2,1)}
.rs-bar i.g{background:linear-gradient(90deg,#2fb86a,var(--ok))}.rs-bar i.p{background:linear-gradient(90deg,#d94c54,var(--red))}.rs-bar i.dorado{background:linear-gradient(90deg,#b8923a,var(--gold2))}
.rs-socios{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:10px}
.rs-socio{background:var(--panel2);border:1px solid var(--line);border-top:3px solid var(--sc,var(--blue));border-radius:12px;padding:10px 12px}
.rs-socio.azul{--sc:var(--blue)}.rs-socio.violeta{--sc:#c58bff}
.rs-socio-h{font-weight:800;color:var(--sc);margin-bottom:6px;letter-spacing:.03em}
.rs-linea{display:flex;justify-content:space-between;gap:8px;padding:2px 0;font-size:.92rem}.rs-linea b{font-variant-numeric:tabular-nums;white-space:nowrap}.rs-linea.fuerte{font-weight:700;margin-top:4px}
.rs-deuda{margin-top:12px;border-radius:12px;padding:12px;background:linear-gradient(135deg,#3a2c12,#2a2410);border:1px solid #6b5420;display:grid;grid-template-columns:1fr auto 1fr;gap:6px 10px;align-items:center;text-align:center}
.rs-deuda .de{color:var(--red);font-weight:800}.rs-deuda .a{color:var(--ok);font-weight:800}.rs-deuda .flecha{color:var(--gold2);font-size:1.4rem}
.rs-deuda .monto{grid-column:1/-1;font-size:1.9rem;color:var(--gold2);font-variant-numeric:tabular-nums}.rs-deuda small{grid-column:1/-1;color:var(--mut)}
.rs-deuda.saldada{display:flex;flex-direction:column;align-items:center;background:linear-gradient(135deg,#10231a,#0f1a14);border-color:#1f4a33}.rs-deuda.saldada .ok{color:var(--ok);font-size:1.8rem}
.rs-grande{font-size:2rem;margin:4px 0 8px;font-weight:700}.rs-grande .muted{font-size:1rem;font-weight:400}
.rs-seg{display:flex;height:12px;border-radius:99px;overflow:hidden;background:var(--panel2);margin:6px 0}
.rs-seg i{display:block;height:100%;width:0;transition:width .9s cubic-bezier(.2,.8,.2,1)}.rs-seg i.g{background:var(--ok)}.rs-seg i.p{background:var(--red)}
.rs-leyenda{display:flex;gap:14px;flex-wrap:wrap;margin:4px 0 10px;font-size:.9rem}
.rs-cmp{margin-bottom:12px}.rs details{margin-top:6px}.rs summary{cursor:pointer;color:var(--blue)}
@media(max-width:700px){.rs-tile b{font-size:1.4rem}.rs-deuda{grid-template-columns:1fr auto 1fr}}
@media print{.rs-tile,.rs-card,.rs-socio,.rs-deuda{background:#fff!important;border:1px solid #bbb!important}.rs-bar i,.rs-seg i{width:var(--w,100%)!important;print-color-adjust:exact}.rs-deuda .monto,.rs-total{color:#111!important}}

/* Sponsors */
.rs-tile.azul{--tc:var(--blue);--t1:#0f1f2b;--tb:#1d4560}.azulc{color:var(--blue)}.rs-card.azul-borde{border-top-color:var(--blue)}
.rs-tile.azul .rs-bar{margin-top:8px}

/* Horarios de cada día */
.hrow{display:flex;align-items:center;gap:8px;margin-bottom:6px}.hdia{flex:0 0 74px;font-size:.9rem;text-transform:capitalize}
.hrow input[type=time]{flex:1;min-width:0}
.cal-hora{font-weight:700;color:var(--gold2);font-size:.7rem}.cal-hor{color:var(--text);font-size:.85rem;margin-top:3px}

.plista{margin:0;min-height:48px;display:flex;align-items:center;padding:0 12px;border:1px dashed var(--line);border-radius:10px;color:var(--mut);font-weight:600}

/* Pegar o arrastrar un comprobante */
.pegar-hint{display:none;margin:4px 0 0}
@media(hover:hover){.pegar-hint{display:block}}
.filepick.arrastrando{outline:2px dashed var(--gold);background:#d9b44a14}

/* Filtros de pago del curso */
.resumen-pago .senaron{color:#ffb454;font-weight:600}
.chips-pago{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px}
.chip{--c:var(--mut);background:var(--panel);color:var(--c);border:1px solid var(--c);border-radius:99px;padding:8px 14px;font-weight:700;font-size:.82rem;letter-spacing:.03em;cursor:pointer;min-height:40px}
.chip b{margin-left:4px;background:color-mix(in srgb,var(--c) 22%,transparent);border-radius:99px;padding:1px 8px}
.chip.nada{--c:var(--red)}.chip.sena{--c:#ffb454}.chip.pagado{--c:var(--ok)}
.chip.on{background:var(--c);color:#0a0e18}.chip.on b{background:#0a0e1833}
@media(max-width:700px){.chips-pago .chip{flex:1 1 30%;padding:8px 6px;font-size:.74rem}}

/* Los que señaron (pagaron una parte), en naranja */
tr.sena td{background:rgba(255,180,84,.07)}
tr.sena td:first-child{box-shadow:inset 4px 0 0 #ffb454}
.num.amb,td.amb{color:#ffb454}
@media(max-width:1270px){
 table.cards tr.sena{border:2px solid #ffb454;background:linear-gradient(rgba(255,180,84,.10),rgba(255,180,84,.03)),var(--panel)}
 table.cards tr.sena td{background:none;box-shadow:none}
}
@media print{tr.sena td{background:#fff!important}}

/* Buscador único de inscribir o cobrar */
.sugg .sug-fila{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.sugg .sug-fila>span:first-child{min-width:0;overflow-wrap:anywhere}
.badge.sena-b{border-color:#ffb454;color:#ffb454}

.chip.baja{--c:#9aa5c0}.resumen-pago .bajaron{color:#9aa5c0;font-weight:600}

/* Pagos de cada alumno, con su comprobante */
td.pagos{min-width:210px}
.pago{padding:4px 0;border-bottom:1px dashed var(--line);display:flex;flex-direction:column;gap:1px;font-size:.86rem}
.pago:last-child{border-bottom:0}
.pago-top{display:flex;gap:6px;align-items:baseline;flex-wrap:wrap}.pago-det{font-weight:600}
.pago-comp a{font-size:.84rem}
@media(max-width:1270px){
 table.cards td.pagos{display:block;min-width:0}
 table.cards td.pagos::before{display:block;margin-bottom:4px}
 table.cards td.pagos>.val{display:block;text-align:left}
}

.tw td .badge{white-space:nowrap}
@media(min-width:1271px){td.notas{min-width:120px;max-width:230px}}

/* Lista de alumnos del curso: entra completa en pantalla (sin barra horizontal) y los botones quedan siempre a la vista */
@media(min-width:1271px){
 .tabla-alumnos table{width:100%;table-layout:auto}
 .tabla-alumnos th,.tabla-alumnos td{padding-left:8px;padding-right:8px}
 .tabla-alumnos td.alu{min-width:155px}
 .tabla-alumnos td.pagos{min-width:140px;max-width:240px}
 .tabla-alumnos td.notas{min-width:90px;max-width:160px}
 .tabla-alumnos td.acciones{min-width:0;width:1%;white-space:normal}
 .tabla-alumnos td.acciones .btn{display:block;width:100%;margin:3px 0;white-space:nowrap}
 .tabla-alumnos .cobro-l{white-space:nowrap}
}

/* Botón "?" de ayuda en cada recuadro */
.ayuda{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;margin-left:8px;border:1.5px solid var(--gold2);border-radius:50%;color:var(--gold2);font:700 .78rem/1 inherit;font-family:inherit;cursor:pointer;vertical-align:middle;user-select:none;text-transform:none;letter-spacing:0;flex:none}
.ayuda:hover,.ayuda:focus-visible{background:var(--gold2);color:#111;outline:none}
.ayuda-modal{max-width:560px}
.ayuda-txt{line-height:1.5;font-size:.97rem}.ayuda-txt ul,.ayuda-txt ol{padding-left:20px;margin:8px 0}.ayuda-txt li{margin:5px 0}.ayuda-txt p{margin:8px 0}
@media print{.ayuda{display:none}}
.grupo-fila td{background:var(--panel2);color:var(--gold2);letter-spacing:.04em;font-size:.85rem;padding-top:10px;padding-bottom:6px}

/* Deudores: alumnos que deben de más de un curso, unificados y arriba de todo */
.deudor-multi{margin-bottom:14px;border-color:#e5484d}
.dm-top{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:flex-start;margin-bottom:8px}
.dm-top h3{margin:0 0 4px;font-size:1.15rem}.dm-total{text-align:right}.dm-total b{display:block;font-size:1.4rem}
.aviso-deuda-alumno ul{margin:6px 0 6px 18px;padding:0}.aviso-deuda-alumno li{margin:2px 0}

/* Aire entre el texto y los bordes de los recuadros */
.cal-num{padding:2px 0 0 5px}
.grupo-fila td{padding-left:14px!important}
.tw>p.muted{padding:14px 16px;margin:0}
.deudor-multi h3{overflow-wrap:anywhere}
.grupo-fila td{padding-right:14px!important}

/* Seguimiento de deudores: último contacto bien visible */
.contacto{display:inline-block;margin-top:6px;padding:4px 12px;border-radius:999px;font-size:.92rem;font-weight:500;line-height:1.4;border:1.5px solid}
.contacto b{font-weight:700}
.contacto.ok{color:#4fe08a;border-color:#4fe08a;background:rgba(79,224,138,.12)}
.contacto.nada{color:#ffb454;border-color:#ffb454;background:rgba(255,180,84,.12)}

/* Finanzas del instructor: un bloque por mes */
.mes-fin{background:var(--panel);border:1px solid var(--line);border-radius:12px;margin-bottom:8px;overflow:hidden}
.mes-fin summary{display:flex;align-items:center;gap:12px;padding:12px 16px;cursor:pointer;list-style:none}
.mes-fin summary::-webkit-details-marker{display:none}
.mf-mes{min-width:130px;font-weight:600;text-transform:capitalize}
.mf-barra{flex:1;height:10px;background:#ffffff10;border-radius:6px;overflow:hidden}.mf-barra i{display:block;height:100%;background:linear-gradient(90deg,var(--ok),#2a9d5c);border-radius:6px}
.mf-curso{padding:8px 16px 10px;border-top:1px dashed var(--line)}
.mf-top{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:4px}.mf-top b.pos{margin-left:auto}
.mf-pago{font-size:.92rem;padding:2px 0 2px 8px}
@media(max-width:700px){.mf-mes{min-width:0;flex:1 1 100%}.mes-fin summary{flex-wrap:wrap}.mf-barra{flex:1 1 60%}}

.pass-wrap{position:relative}.pass-wrap input{padding-right:46px}
.pass-wrap .ojo{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:none;border:0;cursor:pointer;font-size:1.15rem;padding:6px 8px;line-height:1;color:var(--text)}
.reglas-clave{list-style:none;margin:10px 0;padding:0;display:grid;gap:3px;font-size:.88rem;color:var(--muted)}
.reglas-clave li::before{content:"○ "}.reglas-clave li.ok{color:var(--ok, #6fd08c)}.reglas-clave li.ok::before{content:"✔ "}

/* Formulario público de inscripción */
.f-wrap{max-width:560px;margin:0 auto;padding:20px 16px 48px}
.f-head{text-align:center;margin-bottom:14px}.f-head img{width:72px;height:72px}
.f-head h1{margin-top:8px;font-size:1.35rem;color:var(--gold2)}.f-head p{margin:4px 0 0}
.f-card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px;margin-top:12px}
.f-card h2{margin-bottom:6px}
.f-bienvenida{font-size:1.25rem;font-weight:800;color:var(--ok);margin:0 0 4px}
.f-falta,.f-req{color:var(--red);font-weight:600;font-size:.85rem;margin:4px 0 0}
input.f-rojo,select.f-rojo{border-color:var(--red);box-shadow:0 0 0 1px var(--red)}
.f-lock{display:flex;gap:8px;align-items:center}.f-lock input{flex:1;opacity:.85}.f-lock button{white-space:nowrap}
.f-acciones{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.f-acciones .btn{flex:1;min-width:130px;text-align:center;padding:11px 14px}
.f-dato{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px solid var(--line)}.f-dato b{color:var(--text)}
.f-ok{text-align:center}.f-ok .grande{font-size:2.6rem}
.f-err{color:var(--red);margin:10px 0 0;font-weight:600}
.f-modo span small{font-weight:400;color:var(--mut)}
.f-wa{display:inline-block;background:#25d366;color:#04210f!important;font-weight:800;border-radius:10px;padding:13px 20px;text-decoration:none;margin-top:12px}

/* Categorías de cursos (etiquetas) */
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.tag{position:relative;margin:0;color:var(--text);cursor:pointer}
.tag input{position:absolute!important;inset:0;width:100%!important;height:100%!important;margin:0;padding:0!important;opacity:0;cursor:pointer}
.tag span{display:inline-block;border:1px solid var(--line);border-radius:999px;padding:5px 13px;background:var(--panel2);font-size:.88rem}
.tag input:checked+span{border-color:var(--gold);background:#d9b44a26;color:var(--gold2);font-weight:700}
.tag input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
.tags-fila{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}

/* Sorteos */
.sorteo-card{display:block;text-decoration:none;color:var(--text)}.sorteo-card:hover{border-color:var(--gold)}
.fila-titulo{display:flex;justify-content:space-between;align-items:center;gap:10px}
.centro{text-align:center}
.escenario{display:flex;flex-direction:column;align-items:center;gap:14px;margin:14px 0}
.pantalla-sorteo{min-height:96px;width:100%;display:grid;place-items:center;font-size:clamp(1.4rem,5vw,2.2rem);font-weight:800;text-align:center;padding:14px;border-radius:14px;border:2px dashed var(--line);color:var(--mut);background:#0a0e18}
.pantalla-sorteo.girando{border-style:solid;border-color:var(--gold);color:var(--text)}
.pantalla-sorteo.ganador{border-style:solid;border-color:var(--ok);color:var(--ok);background:#4fe08a14}
.btn.grande{padding:14px 34px;font-size:1.15rem}
.ronda{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:10px}
.ronda.nueva{border-color:var(--ok);box-shadow:0 0 0 1px var(--ok)}
.ronda-cab{display:flex;justify-content:space-between;align-items:center;color:var(--mut);font-size:.85rem}
.ronda .gan{font-size:1.2rem;font-weight:800;color:var(--gold2);margin:6px 0 2px}
.fila-ojo,.sup{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 0}
.sup{border-top:1px solid var(--line);margin-top:6px;padding-top:8px}
.descartado{color:var(--mut);font-size:.85rem;text-decoration:line-through;margin-top:4px}
.verif{display:flex;align-items:center;gap:10px;margin:6px 0}.verif input{max-width:240px}
.ojo{background:none;border:1px solid var(--line);border-radius:8px;padding:5px 8px;cursor:pointer;color:var(--text);line-height:0}.ojo[aria-pressed=true]{border-color:var(--gold);color:var(--gold2)}
.lista-sorteo{list-style:none;margin:0;padding:0}.lista-sorteo li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 4px;border-bottom:1px solid var(--line)}
.lista-sorteo li small{display:block;color:var(--mut)}.lista-sorteo li.usado{opacity:.55}.lista-sorteo .acciones{display:flex;gap:6px;align-items:center}

/* Página pública del curso */
.f-wrap.curso-pub{max-width:760px}
.curso-banner{display:block;width:100%;aspect-ratio:3/1;object-fit:cover;border-radius:14px;border:1px solid var(--line);background:#0a0e18}
.curso-ficha h1{font-size:1.5rem;color:var(--gold2)}.curso-fecha{margin:6px 0 0;font-weight:600}
.curso-horarios{margin:4px 0 0;padding-left:20px;color:var(--mut)}
.curso-acciones{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px;justify-content:center}.curso-acciones .btn{padding:13px 22px}
.descripcion-rica{line-height:1.55}.descripcion-rica h2{font-size:1.15rem;margin:12px 0 4px}.descripcion-rica h3{font-size:1.02rem;margin:10px 0 4px}
.descripcion-rica p{margin:6px 0}.descripcion-rica ul,.descripcion-rica ol{margin:6px 0;padding-left:22px}.descripcion-rica a{color:var(--blue)}
.descripcion-rica blockquote{margin:8px 0;padding:4px 12px;border-left:3px solid var(--gold);color:var(--mut)}
/* Editor de texto enriquecido (panel) */
.editor-barra{display:flex;flex-wrap:wrap;gap:4px;margin:6px 0 4px}.editor-barra button{min-width:34px}
.editor-rico{min-height:180px;max-height:340px;overflow:auto;background:#0a0e18;border:1px solid var(--line);border-radius:8px;padding:10px 12px;line-height:1.5}
.editor-rico:focus{outline:2px solid var(--gold);outline-offset:1px}
.banner-prev{display:block;width:100%;aspect-ratio:3/1;object-fit:cover;border-radius:10px;border:1px solid var(--line);margin:6px 0;background:#0a0e18}
.calendario-interes{margin-top:22px;text-align:center}

#aviso-pub{position:fixed;left:50%;bottom:22px;transform:translate(-50%,30px);max-width:min(92vw,460px);background:var(--panel2);border:1px solid var(--gold);color:var(--text);padding:12px 16px;border-radius:12px;opacity:0;pointer-events:none;transition:.25s;z-index:50;text-align:center}
#aviso-pub.on{opacity:1;transform:translate(-50%,0)}

/* Banners de los cursos abiertos, arriba del calendario: uno solo a la vez, que se va cambiando */
.cal-banners{margin:0 0 18px}.cal-banners h2{font-size:1.05rem;margin:0 0 8px}
.cal-carrusel{position:relative;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:#0a0e18;max-width:900px;margin:0 auto}
.cal-slides{position:relative}
.cal-banner{display:block;text-decoration:none;color:var(--text);position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .6s ease,visibility .6s}
.cal-banner.on{position:relative;opacity:1;visibility:visible}
.cal-banner img{display:block;width:100%;aspect-ratio:3/1;object-fit:cover}
.cal-banner span{display:block;padding:8px 12px 12px;font-weight:600;font-size:.92rem;background:var(--panel)}
.cal-flecha{position:absolute;top:calc(50% - 20px);transform:translateY(-50%);width:38px;height:38px;border-radius:50%;border:1px solid #ffffff40;background:#000000a0;color:#fff;font-size:1.4rem;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0}
.cal-flecha:hover{background:#000000d0;border-color:var(--gold)}.cal-flecha.ant{left:8px}.cal-flecha.sig{right:8px}
.cal-puntos{position:absolute;left:0;right:0;bottom:46px;display:flex;justify-content:center;gap:7px}
.cal-puntos button{width:9px;height:9px;border-radius:50%;border:1px solid #ffffffc0;background:#00000060;padding:0;cursor:pointer}.cal-puntos button.on{background:var(--gold);border-color:var(--gold)}
@media (prefers-reduced-motion:reduce){.cal-banner{transition:none}}

/* Lista de cursos: en curso y finalizados separados con su título */
.seccion-cursos{display:flex;align-items:center;gap:8px;margin:18px 0 8px;font-size:1.05rem}
.seccion-cursos::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--green)}
.seccion-cursos.finalizados::before{background:var(--blue)}
.seccion-cursos.finalizados{color:var(--mut)}
#lista > .seccion-cursos:first-child{margin-top:4px}

/* Contornos bien visibles: tarjetas, burbujas y botones se distinguen del fondo */
.btn{border-color:var(--line2)}
.btn:hover{border-color:var(--gold)}
.btn.danger{border-color:#c25b5b}
.btn.pri{border:0}
.card,.tile,.rs-card,.dest,.f-card,.cal-celda{border-color:var(--line)}
.pill span,.tag span{border-color:var(--line2)}
input,select,textarea{border-color:var(--line2)}
input:focus,select:focus,textarea:focus{border-color:var(--gold)}
