/* Layout: una herramienta de trabajo; cada sesión muestra sus cupos como asientos que se llenan. */
:root{
--bg:#F3F6FA;--surface:#FFFFFF;--ink:#14284A;--muted:#4F5F78;--line:#D6DEE9;
--accent:#234E8E;--accent-ink:#FFFFFF;--accent-soft:#DFE8F5;--accent-2:#14757D;
--ok:#17693F;--ok-soft:#DCF1E5;--warn:#875000;--warn-soft:#FBEBCF;--bad:#AD2C25;--bad-soft:#FADFDC;--neutral-soft:#E8EDF4;
--display:"Barlow Semi Condensed","Arial Narrow",system-ui,sans-serif;
--body:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
--bg:#0E1829;--surface:#16233A;--ink:#E8EEF7;--muted:#A3B2C8;--line:#2C3D5A;
--accent:#63C2CC;--accent-ink:#06222A;--accent-soft:#1B3350;--accent-2:#63C2CC;
--ok:#6BD39A;--ok-soft:#153A29;--warn:#EDB75C;--warn-soft:#3D2C0E;--bad:#F28B82;--bad-soft:#44201D;--neutral-soft:#22324B;color-scheme:dark}}
:root[data-theme="dark"]{
--bg:#0E1829;--surface:#16233A;--ink:#E8EEF7;--muted:#A3B2C8;--line:#2C3D5A;
--accent:#63C2CC;--accent-ink:#06222A;--accent-soft:#1B3350;--accent-2:#63C2CC;
--ok:#6BD39A;--ok-soft:#153A29;--warn:#EDB75C;--warn-soft:#3D2C0E;--bad:#F28B82;--bad-soft:#44201D;--neutral-soft:#22324B;color-scheme:dark}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font:16px/1.45 var(--body)}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{font-family:var(--display);line-height:1.15;margin:0;text-wrap:balance}
h1{font-size:1.35rem;font-weight:700}
h2{font-size:1.25rem;font-weight:700}
h3{font-size:1rem;font-weight:700}
p{margin:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.wrap{max-width:1040px;margin:0 auto;padding-block:16px 56px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));display:grid;gap:16px}
.top{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.seg{display:inline-flex;background:var(--neutral-soft);border-radius:10px;padding:3px;gap:2px}
.seg button{border:0;background:transparent;padding:6px 12px;border-radius:8px;cursor:pointer;color:var(--muted);font-weight:700;font-size:.9rem}
.seg button[aria-pressed="true"]{background:var(--surface);color:var(--ink)}
.notice{background:var(--warn-soft);color:var(--warn);padding:10px 12px;border-radius:8px;font-size:.92rem}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);overflow-x:auto}
.tabs button{border:0;background:none;padding:10px 12px;cursor:pointer;color:var(--muted);font-weight:700;border-bottom:3px solid transparent;white-space:nowrap;display:flex;gap:6px;align-items:center}
.tabs button[aria-selected="true"]{color:var(--accent);border-bottom-color:var(--accent)}
.count{background:var(--bad);color:var(--surface);border-radius:99px;min-width:20px;padding:0 6px;font-size:.78rem;text-align:center;line-height:20px}
.btn{border:1px solid var(--line);background:var(--surface);padding:8px 12px;border-radius:8px;cursor:pointer;font-weight:700;font-size:.92rem;text-decoration:none;display:inline-flex;align-items:center;gap:6px;color:var(--ink)}
.btn:hover{border-color:var(--accent)}
.btn.pri{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn.danger{color:var(--bad);border-color:var(--bad)}
.btn.sm{padding:4px 9px;font-size:.84rem}
.btn:disabled{opacity:.5;cursor:not-allowed}
.link{border:0;background:none;padding:0;color:var(--accent);font-weight:700;cursor:pointer;text-decoration:underline;font-size:inherit}
.row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.between{justify-content:space-between}
.muted{color:var(--muted)}
.small{font-size:.88rem}
.num{font-variant-numeric:tabular-nums}
.pill{display:inline-block;padding:2px 9px;border-radius:99px;font-size:.82rem;font-weight:700;white-space:nowrap}
.pill.ok{background:var(--ok-soft);color:var(--ok)}
.pill.soon{background:var(--warn-soft);color:var(--warn)}
.pill.late{background:var(--bad-soft);color:var(--bad)}
.pill.none,.pill.off{background:var(--neutral-soft);color:var(--muted)}
.alert{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;align-items:center;background:var(--bad-soft);color:var(--bad);padding:10px 12px;border-radius:8px;font-weight:700}
.alert .link{color:inherit}
.days{display:grid;grid-template-columns:auto repeat(7,minmax(0,1fr)) auto;gap:4px;align-items:stretch}
.days.long{grid-template-columns:repeat(7,minmax(0,1fr))}
.day{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:6px 2px;cursor:pointer;text-align:center;min-width:0;display:grid;gap:1px}
.day b{font:700 1.1rem var(--display)}
.day span{font-size:.76rem;color:var(--muted)}
.day[aria-current="date"]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.day[aria-current="date"] span{color:inherit}
.day.today:not([aria-current="date"]){border-color:var(--accent);border-width:2px}
.day:disabled{opacity:.42;cursor:not-allowed}
.arrow{border:0;background:none;cursor:pointer;font-size:1.3rem;color:var(--muted);padding:0 6px}
.period{display:grid;gap:8px}
.period>h3{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-family:var(--body)}
.slots{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:12px}
.slot{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px;display:grid;gap:10px;align-content:start;min-width:0}
.time{font:700 1.3rem var(--display)}
.seats{display:flex;flex-wrap:wrap;gap:4px}
.seat{width:14px;height:14px;border-radius:50%;border:2px solid var(--line)}
.seat.on{background:var(--accent);border-color:var(--accent)}
.seat.full{background:var(--bad);border-color:var(--bad)}
.people{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.people li{display:flex;gap:6px;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:4px;min-width:0}
.people .name{min-width:0;overflow-wrap:anywhere}
.x{border:0;background:none;cursor:pointer;color:var(--muted);font-size:1.1rem;padding:0 4px;line-height:1}
.x:hover{color:var(--bad)}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;background:var(--muted)}
.dot.ok{background:var(--ok)}.dot.soon{background:var(--warn)}.dot.late{background:var(--bad)}
select,input[type=text],input[type=password],input[type=tel],input[type=search],input[type=date],input[type=time],input[type=number],textarea{width:100%;min-width:0;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface)}
.add{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px}
.list{background:var(--surface);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;padding:12px 14px;border-top:1px solid var(--line);align-items:center}
.item:first-child{border-top:0}
.item .acts{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
.item-open{border:0;background:none;padding:0;text-align:left;cursor:pointer;min-width:0;display:grid;gap:2px}
.item-open b{overflow-wrap:anywhere}
@media (max-width:560px){.item{grid-template-columns:minmax(0,1fr)}.item .acts{justify-content:flex-start}}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips button{border:1px solid var(--line);background:var(--surface);padding:4px 10px;border-radius:99px;cursor:pointer;font-size:.86rem}
.chips button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.empty{padding:28px 16px;text-align:center;color:var(--muted);display:grid;gap:10px;justify-items:center}
.section{display:grid;gap:10px}
.field{display:grid;gap:4px;min-width:0}
.field>label,.field>.lbl{font-size:.86rem;font-weight:700}
.hint{font-size:.82rem;color:var(--muted)}
.err{color:var(--bad);font-size:.9rem;font-weight:700}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:12px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px;display:grid;gap:12px}
.ses-row{display:grid;grid-template-columns:minmax(0,1fr) 124px 76px;gap:8px;align-items:end}
@media (max-width:440px){.ses-row{grid-template-columns:minmax(0,1fr) 112px 62px}}
.check{display:flex;gap:6px;align-items:center;font-size:.92rem}
.modal{position:fixed;inset:0;background:rgba(5,20,17,.55);z-index:20;display:flex;align-items:flex-start;justify-content:center;overflow-y:auto;padding-block:max(24px,env(safe-area-inset-top,0px)) max(24px,env(safe-area-inset-bottom,0px));padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.sheet{background:var(--surface);border-radius:12px;padding:18px;width:100%;max-width:520px;display:grid;gap:14px}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(16px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:8px;z-index:30;max-width:calc(100% - 32px);font-size:.94rem}
.status-big{display:grid;gap:4px}
.bookable{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:12px 14px;border-top:1px solid var(--line)}
.bookable:first-child{border-top:0}
@media (max-width:560px){.bookable.serie{grid-template-columns:minmax(0,1fr)}}
.prev{display:grid;gap:4px;max-height:260px;overflow-y:auto}
.prev div{display:flex;justify-content:space-between;align-items:center;gap:8px;border-top:1px solid var(--line);padding-top:4px}
.prev div:first-child{border-top:0;padding-top:0}
/* ---------- acceso ---------- */
html{height:100%}
body{margin:0;min-height:100%}
img{max-width:100%}
[hidden]{display:none!important}
.login{min-height:100vh;display:grid;place-items:center;padding:24px 16px}
.login .card{width:100%;max-width:380px}
.login h1{font-size:1.7rem}
.who{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.cred{background:var(--neutral-soft);border-radius:8px;padding:10px 12px;display:grid;gap:4px;overflow-wrap:anywhere}
/* ---------- marca Power ZU ---------- */
body{font-weight:500}
h1,h2,h3,.time,.day b{font-weight:700;letter-spacing:.005em}
h1{font-size:1.5rem}h2{font-size:1.4rem}h3{font-size:1.1rem}
.marca{display:flex;align-items:center;gap:10px;min-width:0}
.marca img{width:52px;height:auto;background:#fff;border-radius:10px;padding:4px;flex:none}
.login{background:linear-gradient(160deg,var(--accent-soft),var(--bg) 60%)}
.login .card{max-width:400px;padding:24px;gap:14px;border-radius:18px;border:0;box-shadow:0 12px 32px rgba(20,40,74,.14)}
.logo-login{display:block;width:min(200px,62%);height:auto;margin:0 auto 4px;background:#fff;border-radius:16px;padding:8px}
.login h1{font-size:1.65rem;text-align:center}
.login .card>.muted,.login .hint{text-align:center}
.login .btn.pri{justify-content:center;padding:12px;font-size:1.05rem}
.card,.slot,.list{border-radius:14px;box-shadow:0 1px 3px rgba(20,40,74,.06)}
.sheet{border-radius:16px}
.btn{border-radius:10px;min-height:40px;font-weight:600;transition:background-color .15s,border-color .15s}
.btn.sm{min-height:34px;border-radius:8px}
.btn.pri:hover{filter:brightness(1.1)}
select,input[type=text],input[type=password],input[type=tel],input[type=search],input[type=date],input[type=time],input[type=number],textarea{border-radius:10px;min-height:44px}
.day{border-radius:12px;padding-block:8px}
.seat{width:16px;height:16px}
.seat.on{background:var(--accent-2);border-color:var(--accent-2)}
.period>h3{color:var(--accent-2);font-family:var(--display);font-size:.95rem}
.tabs button{font-family:var(--display);font-size:1.08rem;font-weight:600}
@media (max-width:560px){.btn{min-height:44px}.btn.sm{min-height:38px}.marca img{width:44px}}
/* ---------- medidas y rutina ---------- */
.datos{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:8px}
.dato{display:grid;gap:1px;background:var(--neutral-soft);border-radius:10px;padding:8px 10px;min-width:0}
.dato b{font:700 1.2rem var(--display)}
.dato small{font:500 .78rem var(--body);color:var(--muted)}
.grafica{display:block;width:100%;height:auto;color:var(--accent-2)}
.historial{display:grid;gap:8px;max-height:260px;overflow-y:auto}
.control{display:grid;gap:2px;border-top:1px solid var(--line);padding-top:8px}
.control:first-child{border-top:0;padding-top:0}
.campos{grid-template-columns:repeat(auto-fit,minmax(min(100%,130px),1fr))}
.dias-rutina{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.dias-rutina button{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:10px;padding:6px 0;cursor:pointer;display:grid;gap:1px;justify-items:center;min-width:0;min-height:44px}
.dias-rutina b{font:700 .95rem var(--display)}
.dias-rutina span{font-size:.76rem;color:var(--muted)}
.dias-rutina button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.dias-rutina button[aria-pressed="true"] span{color:inherit}
.ejercicio{display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap;padding:12px 14px;border-top:1px solid var(--line)}
.ejercicio:first-child{border-top:0}
.ej-info{display:grid;gap:3px;flex:1 1 180px;min-width:0;overflow-wrap:anywhere}
.ej-acts{display:flex;flex-wrap:wrap;gap:4px}
.ej-n{flex:none;width:28px;height:28px;border-radius:50%;background:var(--accent-soft);color:var(--ink);display:grid;place-items:center;font:700 .95rem var(--display)}
.ej-datos{display:flex;flex-wrap:wrap;gap:4px 14px}
.ej-datos b{font-family:var(--display);font-size:1.05rem}
/* ---------- sesiones editables ---------- */
.ses-row{grid-template-columns:minmax(0,1fr) 124px 76px 32px}
.ses-x{height:44px;font-size:1.4rem}
@media (max-width:440px){
.ses-row{grid-template-columns:minmax(0,1fr) 44px 36px;gap:6px 8px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.ses-row>.field:nth-child(1){grid-column:1/3;grid-row:1}
.ses-row>.field:nth-child(2){grid-column:1;grid-row:2}
.ses-row>.field:nth-child(3){grid-column:2/4;grid-row:2}
.ses-row>.ses-x{grid-column:3;grid-row:1;align-self:end;padding:0}
}
