/* Quantum Calibraciones — Manual de Marca: naranja #EE7D00, gris #868888, negro #231F20, Montserrat. */
:root{
  --bg:#f6f6f7;--card:#fff;--ink:#231f20;--mut:#6b6d6d;--line:#e4e4e5;
  --pri:#ee7d00;--pri-hover:#d87000;--on-pri:#231f20;--link:#b85f00;
  --ok:#17794a;--warn:#b85f00;--err:#c62828;
  --grad:linear-gradient(110deg,#fd5800,#ef7d03);
  --nav:#231f20;--nav-ink:#d9d9d9;
  --radius:10px;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#171415;--card:#231f20;--ink:#f2f2f2;--mut:#a3a5a5;--line:#3a3536;
  --link:#ff9a2e;--ok:#4cc38a;--warn:#ff9a2e;--err:#ff7b72;--nav:#1a1718;
}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.55 'Montserrat','Avenir Next',Avenir,'Segoe UI',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--link);font-weight:600}
a:hover{text-decoration:none}

/* Cabecera */
.top{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:10px 20px;background:var(--nav);border-bottom:3px solid var(--pri)}
.top .marca{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.top .logo{height:34px;width:auto;display:block}
.top nav a{color:var(--nav-ink);text-decoration:none;font-weight:600;font-size:14px;margin-right:18px;padding:6px 0;border-bottom:2px solid transparent}
.top nav a:hover,.top nav a.on{color:#fff;border-bottom-color:var(--pri)}
.top .usuario{display:flex;align-items:center;gap:12px;color:var(--nav-ink);font-size:13px}
.top .usuario form{margin:0}
.top .btn.sec{color:#fff;border-color:#8a8a8a;padding:5px 12px;font-size:13px}
.top .btn.sec:hover{border-color:var(--pri);color:var(--pri)}

main{max-width:1040px;margin:0 auto;padding:24px 16px 40px}
footer.pie{max-width:1040px;margin:0 auto;padding:0 16px 28px;color:var(--mut);font-size:12px;text-align:center}

h1{font-size:22px;font-weight:800;margin:0 0 18px;letter-spacing:-.01em}
h1::after{content:"";display:block;width:44px;height:4px;border-radius:2px;background:var(--pri);margin-top:8px}
h2{font-size:15px;font-weight:700;margin:0 0 12px}
.mut{color:var(--mut)}.err{color:var(--err);font-size:13px}

/* Tarjetas y tablas */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px;margin-bottom:16px}
.tabla{overflow-x:auto}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:9px 8px;border-bottom:1px solid var(--line);vertical-align:top}
th{color:var(--mut);font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.05em}
tbody tr:hover td,table tr:hover td{background:color-mix(in srgb,var(--pri) 6%,transparent)}
th:hover{background:none}

/* Formularios */
label{display:block;font-size:12px;font-weight:600;color:var(--mut);margin:12px 0 4px}
input,select,textarea{width:100%;padding:9px 10px;border:1px solid var(--line);border-radius:7px;background:var(--bg);color:var(--ink);font:inherit}
input:focus,select:focus,textarea:focus{outline:2px solid var(--pri);outline-offset:0;border-color:var(--pri)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:0 16px}
.eq{border:1px dashed var(--line);border-radius:var(--radius);padding:14px;margin-bottom:12px;background:color-mix(in srgb,var(--pri) 3%,transparent)}

/* Botones */
.btn{display:inline-block;padding:9px 18px;border:2px solid var(--pri);border-radius:7px;background:var(--pri);color:var(--on-pri);font:inherit;font-weight:700;cursor:pointer;text-decoration:none}
.btn:hover{background:var(--pri-hover);border-color:var(--pri-hover)}
.btn.sec{background:transparent;color:var(--link);border-color:var(--link)}
.btn.sec:hover{background:color-mix(in srgb,var(--pri) 12%,transparent)}

/* Estados */
.badge{display:inline-block;padding:2px 10px;border-radius:99px;background:var(--line);color:var(--ink);font-size:11px;font-weight:700;letter-spacing:.02em;white-space:nowrap}
.badge[data-estado=registrada]{background:#8688881f;color:var(--mut);box-shadow:inset 0 0 0 1px var(--line)}
.badge[data-estado=aprobada]{background:#ee7d001f;color:var(--warn)}
.badge[data-estado=en_calibracion]{background:var(--pri);color:var(--on-pri)}
.badge[data-estado=certificada]{background:#17794a22;color:var(--ok)}
.badge[data-estado=facturada]{background:#17794a;color:#fff}
.badge[data-estado=entregada]{background:var(--ink);color:var(--card)}

.chips a{display:inline-block;margin:0 6px 8px 0;padding:5px 13px;border:1px solid var(--line);border-radius:99px;background:var(--card);color:var(--ink);text-decoration:none;font-size:12px;font-weight:600}
.chips a:hover{border-color:var(--pri)}
.chips a.on{background:var(--pri);color:var(--on-pri);border-color:var(--pri)}

.ok{background:#17794a1f;border:1px solid var(--ok);color:var(--ok);padding:10px 14px;border-radius:8px;margin-bottom:16px;font-weight:600}

/* Ingreso */
body.login{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;padding:24px 16px;background:var(--grad)}
body.login main{padding:0;width:100%;max-width:400px}
body.login .logo-grande{width:min(340px,80vw);height:auto;display:block}
body.login .card{border:0;box-shadow:0 14px 40px #0003;padding:26px}
body.login h1::after{margin-top:6px}
body.login footer.pie{color:#fff;opacity:.9}
body.login .btn{width:100%;padding:11px}

@media (max-width:640px){.top{padding:10px 14px}.top .logo{height:28px}main{padding:16px 12px 32px}}
.tabla td:first-child a{white-space:nowrap}
/* Fichas: etiqueta pequeña sobre el dato */
.grid>div>.mut:first-child{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.grid>div>.mut:first-child+br{display:none}
.grid{row-gap:8px}
.aviso-error{background:color-mix(in srgb,var(--err) 12%,transparent);border:1px solid var(--err);color:var(--err);padding:9px 12px;border-radius:7px;font-size:13px;font-weight:600}

/* Paginación */
.paginacion{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:4px 0 8px;font-size:13px}
.paginacion .info{color:var(--mut)}
.paginacion ul{display:flex;gap:4px;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.paginacion a,.paginacion span{display:inline-block;min-width:34px;text-align:center;padding:6px 10px;border:1px solid var(--line);border-radius:7px;background:var(--card);color:var(--ink);text-decoration:none;font-weight:600}
.paginacion a:hover{border-color:var(--pri)}
.paginacion span.on{background:var(--pri);border-color:var(--pri);color:var(--on-pri)}
.paginacion span.off{color:var(--mut);background:transparent;border-color:transparent;font-weight:500}
.paginacion span.info{border:0;background:none;padding:0;min-width:0;font-weight:500;text-align:left}

/* Verificación pública del certificado */
body.publico{background:var(--bg)}
body.publico main{max-width:620px}
.logo-publico{display:block;width:min(300px,80%);height:auto;margin:8px auto 20px}
@media (prefers-color-scheme:dark){.logo-publico{content:url('/img/logo-fondo-oscuro.svg')}}
input[type=file]{padding:6px;font-size:12px;margin:6px 0}

/* Firmas */
.informe{list-style:none;margin:0;padding:0}
.informe li{padding:6px 0;border-bottom:1px solid var(--line);font-size:13px}
.informe .si{color:var(--ok)}.informe .no{color:var(--err)}
.pasos{margin:0 0 12px;padding-left:20px;color:var(--mut);font-size:13px}
