:root{--fondo:#f6f5f1;--papel:#fff;--tinta:#1c2421;--suave:#68716d;--linea:#e3e1da;--marca:#14614e;--marca-2:#0e4a3b;--aviso:#a65a00;--mal:#a8321f;--bien-f:#e3f1ec;--aviso-f:#fbf0df;--mal-f:#f9e6e2;--gris-f:#edece7}
*{box-sizing:border-box}
body{margin:0;background:var(--fondo);color:var(--tinta);font:15px/1.5 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--marca)}
h1{font-size:24px;margin:0 0 4px;letter-spacing:-.01em}
h2{font-size:16px;margin:0 0 12px}
.marco{display:flex;min-height:100vh}
.lado{width:220px;flex:none;background:var(--marca-2);color:#fff;padding:22px 14px;display:flex;flex-direction:column}
.logo{font-weight:700;font-size:17px;padding:0 10px 18px;letter-spacing:-.01em}
.logo small{display:block;font-weight:400;font-size:12px;opacity:.7}
.lado a.nav{display:block;color:#dbe8e3;text-decoration:none;padding:8px 10px;border-radius:7px;margin-bottom:2px}
.lado a.nav:hover{background:rgba(255,255,255,.08)}
.lado a.nav.on{background:rgba(255,255,255,.15);color:#fff;font-weight:600}
.lado form{margin-top:auto;padding:10px}
.lado button{background:none;border:0;color:#dbe8e3;cursor:pointer;padding:0;font:inherit;text-decoration:underline}
.lado .quien{font-size:12px;opacity:.7;margin-bottom:6px;word-break:break-all}
main{flex:1;min-width:0;padding:30px 34px;max-width:1180px}
.sub{color:var(--suave);margin:0 0 22px}
.fichas{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:22px}
.ficha,.caja{background:var(--papel);border:1px solid var(--linea);border-radius:10px;padding:16px 18px}
.ficha b{display:block;font-size:24px;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.ficha span{color:var(--suave);font-size:13px}
.caja{margin-bottom:18px}
.doble{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:18px}
.codigo{background:var(--marca-2);color:#fff;border-radius:10px;padding:20px 22px;margin-bottom:18px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}
.codigo code{font:700 28px ui-monospace,Menlo,Consolas,monospace;letter-spacing:.04em}
.codigo p{margin:2px 0 0;opacity:.8;font-size:13px}
.tabla{overflow-x:auto}
table{width:100%;border-collapse:collapse}
th{font-size:12px;color:var(--suave);font-weight:600;text-align:left;padding:7px 10px;border-bottom:1px solid var(--linea);white-space:nowrap}
td{padding:9px 10px;border-bottom:1px solid var(--gris-f);vertical-align:top}
tr:last-child td{border-bottom:0}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.et{display:inline-block;font-size:12px;font-weight:600;padding:2px 8px;border-radius:99px;background:var(--gris-f);color:var(--suave);white-space:nowrap}
.et.pendiente,.et.solicitada{background:var(--aviso-f);color:var(--aviso)}
.et.a_pagar,.et.pagada,.et.activo{background:var(--bien-f);color:var(--marca)}
.et.cancelada,.et.suspendido,.et.rechazada{background:var(--mal-f);color:var(--mal)}
.mono{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px}
.apagado{color:var(--suave);font-size:13px}
label{display:block;font-size:13px;font-weight:600;margin:0 0 4px}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=url],input[type=date],input[type=search],select,textarea{width:100%;padding:9px 11px;border:1px solid #cfccc3;border-radius:7px;background:#fff;font:inherit;color:inherit}
input:focus,select:focus,textarea:focus{outline:2px solid var(--marca);outline-offset:-1px;border-color:var(--marca)}
.campos{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-bottom:16px}
.ayuda{font-size:12px;color:var(--suave);margin:4px 0 0}
.error{font-size:12px;color:var(--mal);margin:4px 0 0}
.btn{display:inline-block;background:var(--marca);color:#fff;border:0;border-radius:7px;padding:9px 16px;font:600 14px inherit;font-family:inherit;cursor:pointer;text-decoration:none}
.btn:hover{background:var(--marca-2)}
.btn.bajo{background:#fff;color:var(--tinta);border:1px solid #cfccc3}
.btn.bajo:hover{background:var(--gris-f)}
.btn.rojo{background:var(--mal)}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.cabeza{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.cabeza .sub{margin:0}
.filtros{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-bottom:16px}
.filtros>div{min-width:130px}
.aviso{padding:11px 14px;border-radius:8px;margin-bottom:16px;font-size:14px}
.aviso.ok{background:var(--bien-f);color:var(--marca-2)}
.aviso.mal{background:var(--mal-f);color:var(--mal)}
.aviso.cuidado{background:var(--aviso-f);color:#7a4300}
.secreto{font-family:ui-monospace,Menlo,Consolas,monospace;word-break:break-all;background:#fff;padding:8px 10px;border-radius:6px;margin-top:6px;display:block}
.acceso{min-height:100vh;display:grid;place-items:center;padding:16px}
.acceso .caja{width:100%;max-width:380px;padding:26px}
.linea-f{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.pag{margin-top:14px;font-size:14px}.pag svg{height:16px}
.pag nav>div:first-child{display:none}
details summary{cursor:pointer;color:var(--marca);font-size:13px}
.legal h2{margin-top:18px}.legal p,.legal li{max-width:72ch}
@media(max-width:780px){.marco{display:block}.lado{width:auto;padding:12px 16px;flex-direction:row;flex-wrap:wrap;align-items:center;gap:2px}.logo{width:100%;padding:0 0 6px}.lado a.nav{padding:6px 9px}.lado form{margin:0 0 0 auto;padding:0}.lado .quien{display:none}main{padding:20px 16px}}
