/* NV02 — base compartida (admin + técnico).
   Dirección: papel de albarán y tinta de calco. Superficie fría clara, tinta azul-negra,
   azul de copia como acento; verde "firmado" y ámbar "sin firma" como sellos de estado. */
:root {
  --paper: #f5f7f6;
  --sheet: #ffffff;
  --ink: #1c2833;
  --ink-2: #51606b;
  --ink-3: #85919a;
  --rule: #d8dedb;
  --rule-2: #e9edeb;
  --carbon: #2344a8;
  --carbon-2: #e8edfa;
  --signed: #1f7a4d;
  --signed-2: #e3f2ea;
  --amber: #b87a00;
  --amber-2: #fbf1dc;
  --danger: #b3261e;
  --danger-2: #fbe7e5;
  --radius-s: 4px;
  --radius-m: 8px;
  --font: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --focus: 0 0 0 3px rgba(35, 68, 168, .35);
  color-scheme: light;
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  font: 15px/1.5 var(--font);
  color: var(--ink);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  font-variant-numeric: tabular-nums;
}
h1, h2, h3 { line-height: 1.2; margin: 0; font-weight: 650; letter-spacing: -.01em; }
h1 { font-size: 1.6rem; }
h2 { font-size: 1.2rem; }
h3 { font-size: 1rem; }
p { margin: 0; }
a { color: var(--carbon); }
[hidden] { display: none !important; }
:focus-visible { outline: none; box-shadow: var(--focus); }

/* --- Controles */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .4em;
  font: inherit; font-weight: 600; line-height: 1;
  padding: .7em 1.1em; min-height: 40px;
  border: 1px solid var(--rule); border-radius: var(--radius-s);
  background: var(--sheet); color: var(--ink); cursor: pointer; text-decoration: none;
}
.btn:hover { border-color: var(--ink-3); }
.btn:disabled { opacity: .5; cursor: default; }
.btn.primary { background: var(--carbon); border-color: var(--carbon); color: #fff; }
.btn.primary:hover { background: #1b3688; }
.btn.danger { color: var(--danger); border-color: #e7b9b5; }
.btn.ghost { border-color: transparent; background: transparent; color: var(--carbon); padding-inline: .5em; }
.btn.small { min-height: 32px; padding: .45em .75em; font-size: .87rem; }

label.field { display: grid; gap: .3rem; font-size: .87rem; color: var(--ink-2); font-weight: 550; }
input, select, textarea {
  font: inherit; color: var(--ink); width: 100%;
  padding: .6em .7em; min-height: 40px;
  border: 1px solid var(--rule); border-radius: var(--radius-s); background: var(--sheet);
}
textarea { min-height: 96px; resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: var(--carbon); box-shadow: var(--focus); outline: none; }
input[type=checkbox] { width: 18px; height: 18px; min-height: 0; accent-color: var(--carbon); }
.check { display: flex; gap: .55rem; align-items: center; font-size: .95rem; color: var(--ink); font-weight: 500; }

.grid2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .9rem 1rem; }
.stack { display: grid; gap: .9rem; }
.row { display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; }
.spacer { flex: 1; }
.muted { color: var(--ink-2); }
.faint { color: var(--ink-3); font-size: .87rem; }
.num { font-variant-numeric: tabular-nums; white-space: nowrap; }

/* --- Estados: sellos */
.stamp {
  display: inline-block; font-size: .78rem; font-weight: 650; letter-spacing: .02em;
  padding: .18em .55em; border-radius: var(--radius-s); border: 1.5px solid currentColor;
  white-space: nowrap;
}
.stamp.firmada, .stamp.terminada { color: var(--signed); background: var(--signed-2); }
.stamp.sin_firma { color: var(--amber); background: var(--amber-2); }
.stamp.abierta, .stamp.en_curso { color: var(--carbon); background: var(--carbon-2); }
.stamp.pendiente, .stamp.cerrado, .stamp.inactivo { color: var(--ink-2); background: var(--rule-2); }
.stamp.corregida { color: var(--danger); background: var(--danger-2); }

/* --- Tablas */
.table-wrap { overflow-x: auto; background: var(--sheet); border: 1px solid var(--rule); border-radius: var(--radius-m); }
table { width: 100%; border-collapse: collapse; }
th, td { text-align: left; padding: .65rem .85rem; border-bottom: 1px solid var(--rule-2); vertical-align: top; }
th { font-size: .82rem; font-weight: 600; color: var(--ink-2); background: #fafbfa; }
tr:last-child td { border-bottom: 0; }
tr.link { cursor: pointer; }
tr.link:hover td { background: #f7f9fd; }
td.r, th.r { text-align: right; }

/* --- Hoja (bloque de contenido) */
.sheet { background: var(--sheet); border: 1px solid var(--rule); border-radius: var(--radius-m); padding: 1.1rem 1.2rem; }
.sheet > h2 + *, .sheet > h3 + * { margin-top: .8rem; }

/* --- Avisos */
#toast {
  position: fixed; left: 50%; bottom: calc(1.2rem + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%);
  background: var(--ink); color: #fff; padding: .7rem 1.1rem; border-radius: var(--radius-s);
  font-weight: 550; z-index: 100; max-width: calc(100vw - 2rem);
}
#toast.error { background: var(--danger); }

/* --- Modal */
dialog { border: 0; border-radius: var(--radius-m); padding: 0; width: min(560px, calc(100vw - 2rem)); color: var(--ink); }
dialog::backdrop { background: rgba(28, 40, 51, .45); }
dialog form.dlg { padding: 1.2rem; display: grid; gap: 1rem; }
dialog .dlg-actions { display: flex; justify-content: flex-end; gap: .5rem; flex-wrap: wrap; }

.empty { padding: 2rem 1rem; text-align: center; color: var(--ink-2); }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }