:root {
  font: 15px/1.5 system-ui, sans-serif;
  color: #222329;
  background: #f4f4f6;
  --accent: #dc1836;
  --border: #e2e2e7;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; }
aside {
  background: #17171a;
  color: #fff;
  width: 235px;
  position: fixed;
  inset: 0 auto 0 0;
  display: flex;
  flex-direction: column;
  padding: 28px 18px;
  overflow: auto;
}
.marca { display: flex; align-items: center; gap: 12px; font-size: 23px; font-weight: 750; }
.marca b { display: grid; place-items: center; border-radius: 12px; background: var(--accent); width: 42px; height: 42px; }
.marca small { display: block; color: #b5b5be; font-size: 9px; letter-spacing: .15em; }
.navlabel, .pie { color: #b5b5be; font-size: 11px; letter-spacing: .1em; }
.navlabel { margin: 38px 12px 12px; }
.pie { margin-top: auto; padding: 20px 10px 0; border-top: 1px solid #38383e; }
.pie strong { display: block; color: white; font-size: 14px; letter-spacing: 0; }
nav { display: grid; gap: 6px; margin-bottom: 30px; }
nav button { text-align: left; background: transparent; color: #d3d3da; padding: 12px; }
nav button:hover { background: #2a2a30; }
nav button[aria-current=page] { background: #34343b; color: white; box-shadow: inset 3px 0 var(--accent); }
nav button:last-child { margin-top: 18px; border-top: 1px solid #38383e; }
main { margin-left: 235px; max-width: 1650px; padding: 28px clamp(20px,3vw,50px) 50px; }
.top { display: flex; justify-content: space-between; align-items: center; color: #666670; font-size: 13px; padding-bottom: 18px; border-bottom: 1px solid var(--border); margin-bottom: 22px; }
.top span:last-child { background: white; border: 1px solid var(--border); border-radius: 20px; padding: 5px 12px; }
h1 { font-size: clamp(30px,4vw,40px); letter-spacing: -.045em; margin: 0; }
h2 { font-size: 20px; }
h2,h3 { letter-spacing: -.025em; margin: 0 0 12px; }
small { color: #65656e; letter-spacing: .1em; }
#status { color: #5a5a63; font-size: 13px; margin: 8px 0 20px; overflow-wrap: anywhere; }
.resumen { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin-bottom: 24px; }
.indicador { padding: 17px 20px; border-radius: 12px; background: white; border: 1px solid var(--border); }
.indicador span { color: #62626c; font-size: 12px; }
.indicador strong { display: block; font-size: clamp(19px,2vw,27px); letter-spacing: -.035em; margin: 3px 0; overflow-wrap: anywhere; }
.indicador small { font-size: 10px; letter-spacing: .04em; }
.indicador:first-child { color: white; background: #34343c; border-color: #34343c; }
.indicador:first-child span,.indicador:first-child small { color: #e3e3e9; }
.indicador.atencion { border-color: #e9a8b2; background: #fff0f2; }
.indicador.atencion strong { color: #b00f29; }
section, .tarjeta, #login { background: white; border: 1px solid var(--border); border-radius: 14px; padding: 24px; box-shadow: 0 4px 18px #22222b05; }
#pos { background: none; border: 0; box-shadow: none; padding: 0; display: grid; grid-template-columns: minmax(0,1.2fr) minmax(300px,1fr); gap: 18px; }
.tarjeta:first-child { grid-column: 1/-1; }
.tarjeta > small { color: #a22137; font-size: 10px; font-weight: 700; }
.tarjeta h2 { margin-top: 4px; }
form { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-end; margin: 16px 0; }
label { display: grid; gap: 6px; font-size: 13px; font-weight: 600; flex: 1 1 155px; }
label.ancho { flex: 2 1 270px; }
input,select,textarea { min-width: 0; width: 100%; border: 1px solid #c9c9d1; background: #fff; border-radius: 7px; padding: 10px; font: inherit; color: #24242b; }
input::placeholder { color: #74747e; }
input:focus,select:focus,textarea:focus { outline: 2px solid #dc183644; border-color: var(--accent); }
button { cursor: pointer; background: var(--accent); color: white; border: 0; border-radius: 7px; font: inherit; font-weight: 600; padding: 10px 16px; }
button:hover { filter: brightness(.94); }
button:disabled { opacity: .5; cursor: default; }
.secondary { color: #44444e; background: #eeeef2; }
button:focus-visible,a:focus-visible,summary:focus-visible { outline: 3px solid #ba1330; outline-offset: 3px; }
.inline { display: flex; align-items: center; gap: 8px; margin: 14px 0; }
.inline input { width: auto; }
.pagos,.campos { display: flex; flex-wrap: wrap; gap: 12px; width: 100%; }
details { border-top: 1px solid var(--border); margin-top: 20px; padding-top: 16px; }
summary { cursor: pointer; font-weight: 650; }
.fila { padding: 13px 10px; border-bottom: 1px solid var(--border); overflow-wrap: anywhere; }
.fila:nth-child(even) { background: #fafafa; }
.tarjeta .fila { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.tarjeta .fila button { font-size: 12px; }
.alerta { color: #aa1730; background: #fff0f2; }
output { width: 100%; font-weight: 700; }
#identidad { width: 100%; padding: 14px 0; border-top: 1px solid var(--border); }
#identidad .campos { margin-top: 12px; }
#totalCarrito { display: block; text-align: right; font-size: 23px; margin-top: 22px; }
#saldo { background: #f3f3f6; padding: 13px; border-radius: 8px; }
#venta > button { width: 100%; }
#taller { padding: 0; overflow: hidden; }
iframe { border: 0; width: 100%; height: 82vh; min-height: 550px; }
.grilla-scroll { width: 100%; overflow: auto; max-height: 540px; margin: 14px 0 24px; border: 1px solid var(--border); border-radius: 8px; }
.grilla { border-collapse: separate; border-spacing: 0; min-width: 100%; font-size: 13px; }
.grilla th { position: sticky; top: 0; background: #ededf1; z-index: 1; text-align: left; }
.grilla th,.grilla td { border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 7px; min-width: 135px; }
.grilla th button { color: #292931; background: transparent; padding: 5px; font-size: 12px; text-align: left; white-space: nowrap; }
.grilla td input,.grilla td select { border: 1px solid transparent; border-radius: 2px; padding: 7px; min-width: 120px; background: transparent; }
.grilla td input:focus,.grilla td select:focus,.grilla td:focus { outline: 2px solid #b71e39; background: white; }
.grilla tbody tr:nth-child(even) { background: #f9f9fb; }
.grilla .nueva-fila { background: #f1f4fa; }
.grilla .stock-alerta,.grilla .stock-alerta:nth-child(even) { color: #a3142b; background: #ffedf0; }
.grilla .stock-alerta input,.grilla .stock-alerta select { color: #a3142b; }
.grilla [aria-invalid=true] { outline: 2px solid #c91836; background: #ffe5ea; }
.grilla .guardando { box-shadow: inset 0 -3px #df9b2b; }
.sobrante { color: #14723c; background: #e9f7ee; font-weight: 700; }
.faltante { color: #b0122d; background: #ffedf0; font-weight: 700; }
.cuadrado { color: #3d4952; }
.ayuda-grilla { font-size: 13px; color: #60606c; max-width: 900px; }
#previewDiferencia { padding: 10px; border-radius: 6px; }
@media(max-width:1050px) { .resumen { grid-template-columns: repeat(2,minmax(0,1fr)); } #pos { grid-template-columns: 1fr; } }
@media(max-width:760px) {
  aside { position: static; width: auto; padding: 14px 16px; }
  .navlabel,.pie { display: none; }
  nav { display: flex; flex-wrap: wrap; gap: 4px; margin: 14px 0 0; }
  nav button { padding: 8px 10px; font-size: 13px; }
  nav button:last-child { margin: 0; border: 0; }
  main { margin: 0; padding: 20px 12px; }
  .marca { font-size: 20px; }
  .marca b { width: 34px; height: 34px; }
  .tarjeta,section { padding: 18px; }
  .indicador { padding: 12px; }
}

.resumen-cuotas{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:20px}.resumen-cuotas .fila{flex:1;min-width:180px;background:#f4f4f6;padding:18px;border-radius:12px;font-weight:700}
.grilla tr.cuota-vencida td{background:#fff0f2;color:#a01029}.grilla tr.cuota-proxima td{background:#fff7d6;color:#704d00}
#recibosCuotas button{margin-left:16px}

.estado-vacio{padding:48px 24px;text-align:center;background:#f5f5f7;border:1px dashed #c7c7cf;border-radius:14px;margin-top:20px}.recibo-preview{max-width:600px;border:1px solid #ddd;border-radius:12px;margin:16px 0;padding:24px;background:#fff}.fila-seleccionable{cursor:pointer}.fila-seleccionable:hover td{background:#fce8ed}.fila-seleccionable:focus-within td{outline:1px solid #d31d44}

body.sin-sesion{background:radial-gradient(ellipse at top left,#421b25 0,#171719 55%,#0c0c0e 100%);min-height:100vh;color:#fff}body.sin-sesion>aside{display:none}body.sin-sesion main{margin:0 auto;width:100%;max-width:1040px;padding:36px 24px}body.sin-sesion .top{color:#d0c5c8}body.sin-sesion #titulo{display:none}body.sin-sesion #status{color:#e1d5d8}
.acceso-card{display:flex;flex-direction:column;gap:16px;max-width:460px;margin:40px auto;padding:38px;background:#fff;color:#202024;border-radius:22px;box-shadow:0 24px 80px #0005}.acceso-card h2{font-size:32px;line-height:1.15;margin:8px 0}.acceso-card p{margin:0;color:#696974}.acceso-sello{font-size:11px;font-weight:800;letter-spacing:1.3px;color:#c8183d}.acceso-card label{display:flex;flex-direction:column;gap:8px;font-weight:600}.acceso-card small{color:#74747c}.campo-clave{display:flex;gap:8px}.campo-clave input{min-width:0;flex:1}#errorLogin:not(:empty){padding:12px;border-radius:8px;color:#a91231;background:#fff0f3}#listaNegocios .fila{display:flex;gap:20px;align-items:center;justify-content:space-between;padding:20px;margin:12px 0;background:#f5f5f7;border-radius:12px}.marca img{object-fit:contain;border-radius:8px}.marca strong{overflow-wrap:anywhere}#altaNegocio{padding:20px;background:#f5f5f7;border-radius:12px}

.general-cabecera{margin-bottom:24px}.general-cabecera h2{font-size:30px;margin:8px 0}.general-cabecera p{color:#71717a}#indicadoresGeneral{grid-template-columns:repeat(3,1fr);margin-bottom:32px}#indicadoresGeneral .indicador:first-child{background:#242429;color:white}#altaNegocio{display:grid;grid-template-columns:1fr 1fr 1fr auto;align-items:end;gap:16px;background:#fff;border:1px solid #e6e6eb}#altaNegocio label{min-width:0}#altaNegocio input{width:100%;box-sizing:border-box}#listaNegocios .fila{background:#fff;border:1px solid #e6e6eb;border-left:4px solid #d91842;min-height:64px}#general h3{margin-top:28px}@media(max-width:1100px){#altaNegocio{grid-template-columns:1fr 1fr}}@media(max-width:600px){#altaNegocio,#indicadoresGeneral{grid-template-columns:1fr}}
dialog{border:0;border-radius:18px;padding:28px;width:min(440px,calc(100% - 48px));box-shadow:0 24px 80px #0005}dialog::backdrop{background:#18181c99}dialog form{display:grid;gap:16px}dialog label{display:grid;gap:7px}dialog [role=status]{color:#b71e39}#listaNegocios .fila{flex-wrap:wrap}

body.vista-taller > aside,
body.vista-taller > main > :is(.top,#titulo,#status),
body.vista-taller #workspace > :is(#resumen,#logout) { display:none; }
body.vista-taller > main { margin:0 auto; padding:0; width:100%; max-width:1200px; }
body.vista-taller #taller { padding:0; margin:0; border:0; box-shadow:none; background:transparent; }
#tallerFrame { display:block; height:700px; min-height:0; }

.vuelto { display:block; font-size:clamp(1.45rem, 4vw, 2rem); font-weight:800; }