:root{--nav:#071a2d;--nav2:#041120;--purple:#5b3ff0;--blue:#2f7cdf;--green:#149e71;--line:#e7e9ef;--muted:#647084;--ink:#111827;--bg:#fbfbfd}*{box-sizing:border-box}@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,Segoe UI,system-ui,sans-serif;font-size:14px}.sidebar{position:fixed;inset:0 auto 0 0;width:240px;background:linear-gradient(180deg,var(--nav),var(--nav2));color:white;padding:26px 16px}.brand{display:flex;align-items:center;gap:14px;margin:0 10px 30px}.brand span{width:48px;height:48px;display:grid;place-items:center;border:4px solid #6d58ff;border-radius:10px;color:#7b62ff;font-size:24px}.brand strong{font-size:20px;line-height:1.05}nav{display:grid;gap:9px}nav a{padding:13px 15px;border-radius:9px;color:#f8fbff;text-decoration:none;font-weight:750;font-size:15px}.active{background:linear-gradient(90deg,#4f46e5,#633cf5)}.branch{position:absolute;left:18px;right:18px;bottom:92px;border:1px solid rgba(255,255,255,.14);border-radius:9px;padding:16px 18px 16px 44px}.branch i{position:absolute;left:18px;top:24px;width:11px;height:11px;border-radius:50%;background:#22c55e}.branch strong,.branch small{display:block}.branch small{color:#c6d2df}.branch b{position:absolute;right:16px;top:28px}.support{position:absolute;bottom:36px;left:30px;color:white}.app{margin-left:240px}.topbar{height:86px;display:flex;justify-content:space-between;align-items:center;padding:0 34px;border-bottom:1px solid var(--line);background:white}.topbar div:last-child{display:flex;align-items:center;gap:22px}.topbar span{font-size:22px;position:relative}.topbar span b{position:absolute;right:-8px;top:-10px;background:#6246ea;color:white;border-radius:50%;font-size:11px;padding:2px 5px}.topbar strong{width:40px;height:40px;border-radius:50%;background:#6045e9;color:white;display:grid;place-items:center}.topbar p{font-weight:700}.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding:20px 30px 18px}.kpis article,.panel{background:white;border:1px solid var(--line);border-radius:9px}.kpis article{height:122px;padding:24px;display:grid;grid-template-columns:64px 1fr auto;align-items:center}.kpis i{width:52px;height:52px;border-radius:12px;background:#eee9ff;color:#5b3ff0;display:grid;place-items:center;font-size:25px;font-style:normal}.kpis span{font-weight:700}.kpis strong{display:block;font-size:26px;margin:4px 0}.kpis small{color:#667085}.kpis em{align-self:end;color:#109166;font-style:normal;font-size:13px}.layout{display:grid;grid-template-columns:1.25fr .95fr 380px;gap:16px;padding:0 30px 24px}.left,.middle,.right{display:grid;gap:16px;align-content:start}.panel{padding:18px}.panel h2{font-size:18px;margin:0}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.panel-head a{color:#4f46e5;font-size:13px;font-weight:700}.panel button,select,input,textarea{border:1px solid var(--line);border-radius:7px;background:white;min-height:38px;padding:8px 12px;font:inherit}.agenda .panel-head div{display:flex;align-items:center;gap:10px}.agenda .row{display:grid;grid-template-columns:80px 18px 1fr 150px 70px 105px;align-items:center;border-bottom:1px solid #eef0f4;min-height:41px}.agenda .row i{width:11px;height:11px;background:#0ca66d;border-radius:50%}.agenda .free i{background:#aeb6c2}.agenda .selected{background:#f3f0ff}.agenda mark,.vip mark{background:#f1ecff;color:#6045e9;border:0;border-radius:8px;padding:3px 8px;width:max-content}.agenda em{font-style:normal;color:#0b7a55}.services{display:grid;grid-template-columns:1fr 1fr;gap:10px}.services .panel-head{grid-column:1/-1}.services div:not(.panel-head){border:1px solid var(--line);border-radius:9px;padding:16px 16px 16px 76px;min-height:96px;position:relative}.services i{position:absolute;left:18px;top:18px;width:52px;height:52px;border-radius:50%;background:#efeaff;color:#5b3ff0;display:grid;place-items:center;font-size:26px;font-style:normal}.services strong,.services b,.services small{display:block}.services b{margin-top:8px}.services small{color:#667085}.vip p,.next p{display:grid;grid-template-columns:42px 1fr 70px 90px 110px 36px;align-items:center;border-bottom:1px solid #eef0f4;margin:0;min-height:41px}.vip b{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#6254ef;color:white}.vip span,.next span{color:#667085}.vip em{font-style:normal;color:#667085}.next p{grid-template-columns:120px 1fr 160px 95px}.next mark{background:#edf7ff;color:#2774ae;border-radius:6px;padding:5px 8px}.booking{display:grid;gap:12px}.booking h2{margin-bottom:8px}.booking label{display:grid;gap:8px;font-weight:700}.booking textarea{height:42px}.booking button{background:linear-gradient(90deg,#5a46e8,#713fe7);color:white;font-weight:800;border:0}.income strong{font-size:24px;display:block}.income em{float:right;color:#119367;font-style:normal}.bars{clear:both;height:70px;display:flex;align-items:end;gap:18px;margin-top:18px}.bars i{width:16px;background:linear-gradient(#6d55f0,#8b74ff);border-radius:3px}.bars i:nth-child(1){height:28px}.bars i:nth-child(2){height:34px}.bars i:nth-child(3){height:50px}.bars i:nth-child(4){height:40px}.bars i:nth-child(5){height:42px}.bars i:nth-child(6){height:52px}.bars i:nth-child(7){height:48px}@media(max-width:1100px){.sidebar{position:static;width:auto}.app{margin:0}.kpis,.layout{grid-template-columns:1fr}.services{grid-template-columns:1fr}}
/* Ajustes responsivos para que nada se salga del viewport */
body{overflow-x:hidden}
button,input,select,textarea{max-width:100%}
.app{min-width:0}
.topbar{gap:18px}
.kpis{grid-template-columns:repeat(4,minmax(190px,1fr));gap:14px;padding:20px clamp(14px,2vw,30px) 18px}
.kpis article,.panel,.left,.middle,.right{min-width:0;overflow:hidden}
.kpis article{height:auto;min-height:118px;grid-template-columns:56px minmax(0,1fr) auto;padding:20px}
.kpis strong{font-size:clamp(22px,1.8vw,26px);line-height:1.15}
.kpis span,.kpis small,.panel h2,.services strong,.services b,.booking label{overflow-wrap:anywhere}
.layout{grid-template-columns:minmax(0,1.2fr) minmax(310px,.95fr) minmax(320px,380px);gap:14px;padding:0 clamp(14px,2vw,30px) 24px}
.panel-head{gap:10px}
.panel-head div{flex-wrap:wrap}
.agenda{overflow:auto}
.agenda .row{grid-template-columns:64px 18px minmax(120px,1fr) minmax(110px,140px) 62px minmax(86px,100px);min-width:660px}
.services{grid-template-columns:repeat(2,minmax(0,1fr))}
.services div:not(.panel-head){padding-left:70px}
.vip,.next{overflow:auto}
.vip p{grid-template-columns:42px minmax(130px,1fr) 58px 72px 95px 32px;min-width:560px}
.next p{grid-template-columns:100px minmax(130px,1fr) minmax(120px,150px) 90px;min-width:500px}
.booking{min-width:0}
.bars{gap:clamp(10px,1.4vw,18px)}
@media(max-width:1420px){.kpis{grid-template-columns:repeat(2,minmax(220px,1fr))}.layout{grid-template-columns:minmax(0,1fr) minmax(320px,380px)}.middle{grid-column:1}.right{grid-column:2;grid-row:1/span 2}}
@media(max-width:1100px){.branch,.support{position:static;margin:18px 8px 0}.topbar{height:auto;align-items:flex-start;flex-direction:column;padding:20px}.layout,.kpis{grid-template-columns:1fr}.middle,.right{grid-column:auto;grid-row:auto}.services{grid-template-columns:1fr}}
@media(max-width:640px){.kpis{padding:16px 12px}.layout{padding:0 12px 18px}.panel{padding:14px}.kpis article{grid-template-columns:48px minmax(0,1fr)}.kpis em{grid-column:2}.topbar div:last-child{flex-wrap:wrap;gap:12px}}

/* Pulido visual: mas aire entre tarjetas, tablas y formulario */
.topbar{padding-left:clamp(24px,2.8vw,42px);padding-right:clamp(24px,2.8vw,42px)}
.kpis{gap:22px;padding:26px clamp(24px,2.8vw,42px) 24px}
.kpis article{padding:24px;min-height:132px;border-radius:11px}
.layout{gap:22px;padding:0 clamp(24px,2.8vw,42px) 34px}
.left,.middle,.right{gap:22px}
.panel{padding:22px;border-radius:11px}
.panel-head{margin-bottom:18px}
.panel button,select,input,textarea{min-height:42px;padding-left:14px;padding-right:14px}
.agenda .row{min-height:48px}
.services{gap:14px}
.services div:not(.panel-head){min-height:112px;padding-top:20px;padding-bottom:20px}
.vip p,.next p{min-height:48px}
.booking{gap:16px}
.booking label{gap:9px}
.booking button{min-height:44px}
.income strong{margin-top:4px}
.bars{height:82px;margin-top:22px}
@media(max-width:1420px){.kpis{gap:18px}.layout{gap:18px}.left,.middle,.right{gap:18px}}
@media(max-width:640px){.topbar{padding:18px 14px}.kpis{padding:18px 14px;gap:14px}.layout{padding:0 14px 20px;gap:16px}.left,.middle,.right{gap:16px}.panel{padding:18px}.services div:not(.panel-head){min-height:auto}}

.topbar h1{margin:0;font-size:24px}.topbar p{margin:4px 0 0;color:#667085}.module-kpis{grid-template-columns:repeat(4,minmax(190px,1fr))}.module-layout{grid-template-columns:minmax(0,1fr) minmax(320px,380px)}.module-table-panel{overflow:hidden}.module-table{overflow:auto}.module-table table{width:100%;min-width:680px;border-collapse:collapse}.module-table th,.module-table td{text-align:left;border-bottom:1px solid var(--line);padding:15px 16px}.module-table th{background:#fafafa;color:#344054}.module-table mark{background:#edf7ff;color:#2774ae;border-radius:8px;padding:5px 9px}.module-table-panel .panel-head div{display:flex;gap:10px;flex-wrap:wrap}.module-table-panel input{min-width:220px}@media(max-width:1100px){.module-kpis,.module-layout{grid-template-columns:1fr}}
.panel.selected{outline:2px solid rgba(91,63,240,.22);box-shadow:0 12px 30px rgba(91,63,240,.08)}
.toast{position:fixed;right:22px;bottom:22px;background:#071a2d;color:#fff;border-radius:9px;padding:13px 16px;box-shadow:0 18px 40px rgba(0,0,0,.18);opacity:0;transform:translateY(12px);pointer-events:none;transition:.2s;z-index:20}.toast.show{opacity:1;transform:translateY(0)}.selected-row{background:#f3f0ff!important;outline:2px solid rgba(91,63,240,.2)}
@media(max-width:760px){.sidebar{position:static;width:auto;padding:18px 12px}.sidebar nav{display:flex;overflow:auto;gap:8px;padding-bottom:4px}.sidebar nav a{white-space:nowrap;flex:0 0 auto;padding:11px 13px}.branch,.support{display:none}.app{margin:0}.topbar{position:sticky;top:0;z-index:5;background:rgba(255,255,255,.96);backdrop-filter:blur(10px)}.topbar div:last-child{width:100%;justify-content:space-between}.kpis,.module-kpis{grid-template-columns:1fr!important;padding:16px 12px}.layout,.module-layout{grid-template-columns:1fr!important;padding:0 12px 18px}.right{grid-column:auto!important;grid-row:auto!important}.module-table table{min-width:0}.module-table thead{display:none}.module-table tr{display:grid;gap:8px;border:1px solid var(--line);border-radius:10px;padding:12px;margin-bottom:10px}.module-table td{display:flex;justify-content:space-between;gap:14px;border:0!important;padding:4px 0!important;white-space:normal}.module-table td:before{content:attr(data-label);font-weight:800;color:#667085}.agenda .row,.vip p,.next p{min-width:560px}.toast{left:12px;right:12px;bottom:14px}}