/* El recorrido Edit del banco: la portada tipo Pressero y la página de producto
   simulada. Igual que estilo.css, ni un hex a mano: todo sale de livriz-tokens, y
   el oscuro por `prefers-color-scheme` se remapea contra las MISMAS primitivas que
   usa el bloque oscuro del sistema. */
:root{
  --franja-fondo:var(--status-warning); --franja-tinta:var(--status-on-warning);
  --nose:var(--status-warning);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --franja-fondo:var(--amber-400); --franja-tinta:var(--neutral-900);
    --nose:var(--amber-400);
  }
}

/* `.caja` es display:flex y le gana al atributo `hidden`: sin esto, las cajas
   escondidas se ven igual. */
[hidden]{display:none !important}

/* La franja va pegada arriba siempre y la barra del banco, abajo, se deja correr:
   dos cosas pegajosas apiladas se pisan. */
.barra{position:static}

.franja{position:sticky;top:0;z-index:30;
  display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px;justify-content:space-between;
  padding:10px 20px;background:var(--franja-fondo);color:var(--franja-tinta);
  font-family:var(--font-sans);border-bottom:2px solid var(--franja-tinta)}
.franja-aviso{font-weight:700;font-size:.92rem;letter-spacing:.04em}
.franja-version{font-family:var(--font-mono);font-size:.78rem;font-weight:500}

/* --------------------------------------------------- portada tipo Pressero */
.vitrina{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center}
.vitrina-logo{width:88px;height:88px;background:var(--accent);
  -webkit-mask:url(/logo-livriz.svg) center/contain no-repeat;
          mask:url(/logo-livriz.svg) center/contain no-repeat}
.vitrina h1{font-size:clamp(1.8rem,5vw,2.8rem)}
.vitrina .lede{margin-top:6px}
@media (max-width:520px){ .vitrina{grid-template-columns:1fr} .vitrina-logo{width:64px;height:64px} }

.btn-grande{font-size:1.05rem;padding:14px 28px}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed;filter:none}

.opciones-entrada{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
fieldset{border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin:0;min-width:0}
fieldset[disabled]{opacity:.65}
legend{font-family:var(--font-sans);font-weight:600;font-size:.82rem;color:var(--muted);padding:0 6px}
.opcion{display:flex;align-items:center;gap:8px;padding:4px 0;font-size:.92rem;cursor:pointer}
.opcion input{accent-color:var(--accent)}
.opcion .mono{font-size:.86rem}
.motivo{font-size:.82rem;color:var(--nose);font-weight:600;margin-top:6px}
.destino-edit{word-break:break-all}

/* ---------------------------------------------------------------- veredicto */
.marcadores{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:baseline}
.marcador.nose{color:var(--nose)} .marcador.info{color:var(--muted)}
.chequeo-edit{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;align-items:baseline;
  padding:9px 0;border-bottom:1px solid var(--line);font-size:.92rem}
.chequeo-edit:last-child{border-bottom:0}
.estado-chip{font-family:var(--font-sans);font-weight:700;font-size:.68rem;letter-spacing:.06em;
  border:1px solid currentColor;border-radius:999px;padding:1px 8px;white-space:nowrap;text-align:center}
.chequeo-edit.ok .estado-chip{color:var(--bien)}
.chequeo-edit.falla .estado-chip{color:var(--mal)}
.chequeo-edit.falla .nombre{color:var(--mal);font-weight:600}
.chequeo-edit.nose .estado-chip{color:var(--nose)}
.chequeo-edit.info .estado-chip{color:var(--muted)}
.chequeo-edit .porque{grid-column:2;font-size:.84rem;color:var(--muted);word-break:break-word}
@media (max-width:520px){ .chequeo-edit{grid-template-columns:1fr} .chequeo-edit .porque{grid-column:1} }

.no-prueba{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:.9rem}
.no-prueba b{color:var(--ink)}

/* ------------------------------------------------------------------ carrito */
.carrito .datos .k{font-family:var(--font-sans);width:11rem;white-space:normal}
.carrito-pie{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.carrito-pie label{display:flex;align-items:center;gap:8px;font-size:.9rem;color:var(--muted)}
.carrito-pie input{font:inherit;width:6rem;color:var(--ink);background:var(--surface-2);
  border:1px solid var(--line);border-radius:8px;padding:6px 8px}