/* ══ Sistema de balanza — hoja de estilos ══ */
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:Arial, Helvetica, sans-serif; background:#eef2f7; color:#0f172a; padding-bottom:50px; }
a { color:#1d4ed8; }

/* ── Barra superior ── */
.topbar { background:#0f172a; color:#e5e7eb; padding:12px 22px; display:flex;
          justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; }
.b-name { font-size:17px; font-weight:bold; letter-spacing:.6px; color:#fff; }
.b-ruc  { font-size:12px; color:#94a3b8; margin-top:2px; }
.topright { display:flex; align-items:center; gap:14px; }
.quien { text-align:right; line-height:1.3; }
.quien b { display:block; font-size:13.5px; color:#fff; }
.quien span { font-size:11px; color:#7dd3fc; text-transform:uppercase; letter-spacing:.6px; }

/* ── Pestañas ── */
.tabs { display:flex; gap:2px; background:#1e293b; padding:0 14px; flex-wrap:wrap; }
.tab { color:#94a3b8; padding:12px 20px; font-size:14px; font-weight:bold; text-decoration:none;
       border-bottom:3px solid transparent; }
.tab:hover { color:#e2e8f0; }
.tab.on { color:#fff; border-bottom-color:#38bdf8; background:#0f172a; }

.wrap { max-width:1180px; margin:0 auto; padding:20px 16px 0; }
.titulo { font-size:20px; margin-bottom:16px; }
.pie { text-align:center; color:#94a3b8; font-size:11.5px; margin-top:30px; }

/* ── Tarjetas ── */
.card { background:#fff; border:1px solid #d7dee8; border-radius:10px; box-shadow:0 1px 3px rgba(15,23,42,.06); margin-bottom:16px; }
.card-h { padding:11px 18px; border-bottom:1px solid #e5e9f0; font-size:13px; font-weight:bold;
          color:#334155; text-transform:uppercase; letter-spacing:.7px; background:#f8fafc; border-radius:10px 10px 0 0;
          display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }
.card-b { padding:18px; }

/* ── Avisos ── */
.aviso { padding:11px 16px; border-radius:8px; font-size:13.5px; font-weight:bold; margin-bottom:14px; }
.aviso.ok   { background:#d1fae5; color:#065f46; border:1px solid #6ee7b7; }
.aviso.bad  { background:#fee2e2; color:#991b1b; border:1px solid #fca5a5; }
.aviso.warn { background:#fef3c7; color:#92400e; border:1px solid #fcd34d; }
.aviso.info { background:#dbeafe; color:#1e40af; border:1px solid #93c5fd; }

/* ── Formularios ── */
.grid { display:grid; grid-template-columns:repeat(4,1fr); gap:13px; }
.f { display:flex; flex-direction:column; }
.f.c2 { grid-column:span 2; } .f.c3 { grid-column:span 3; } .f.c4 { grid-column:span 4; }
.f label { font-size:11px; font-weight:bold; color:#64748b; text-transform:uppercase; letter-spacing:.5px; margin-bottom:4px; }
.f label .req { color:#dc2626; }
.f input, .f select, .f textarea {
  border:1px solid #cbd5e1; border-radius:7px; padding:9px 11px; font-size:14px;
  font-family:inherit; color:#0f172a; background:#fff; outline:none; width:100%;
}
.f input:focus, .f select:focus, .f textarea:focus { border-color:#2563eb; box-shadow:0 0 0 3px rgba(37,99,235,.12); }
.f input[readonly], .f input:disabled { background:#f1f5f9; color:#475569; }
.f .ayuda { font-size:11.5px; color:#64748b; margin-top:4px; }
.chk { display:flex; align-items:center; gap:8px; font-size:13.5px; padding-top:20px; }
.chk input { width:17px; height:17px; }

/* ── Pesaje ── */
.weigh { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.tipo-box { background:#f8fafc; border:1px solid #e2e8f0; border-radius:9px; padding:13px 15px; }
.tipo-box > span.t, .peso-box > span.t, .cbox > span.t {
  display:block; font-size:11px; font-weight:bold; text-transform:uppercase; letter-spacing:.5px; margin-bottom:9px; color:#64748b; }
.tipo-btns { display:flex; gap:10px; }
.tipo-btn { flex:1; border:2px solid #cbd5e1; background:#fff; border-radius:8px; padding:12px 8px;
            cursor:pointer; font-family:inherit; font-size:15px; font-weight:bold; color:#475569; line-height:1.25; }
.tipo-btn small { display:block; font-size:11px; font-weight:normal; color:#94a3b8; margin-top:2px; }
.tipo-btn.on { border-color:#0ea5e9; background:#e0f2fe; color:#075985; }
.tipo-btn.on small { color:#0369a1; }
.peso-box { background:#0f172a; border-radius:9px; padding:13px 15px; color:#e2e8f0; }
.peso-box > span.t { color:#7dd3fc; }
.peso-in { display:flex; align-items:center; gap:9px; }
.peso-in input { flex:1; min-width:0; background:#0b1220; border:1px solid #475569; border-radius:7px; color:#fff;
  font-family:'Courier New',monospace; font-size:30px; font-weight:bold; text-align:right; padding:6px 12px; outline:none; }
.peso-in input:focus { border-color:#22d3ee; box-shadow:0 0 0 3px rgba(34,211,238,.18); }
.peso-in .u { font-size:14px; font-weight:bold; color:#94a3b8; }

/* ── Fecha escrita a mano (transcripción) ── */
.fecha-manual { margin-top:16px; padding:12px 15px; background:#f8fafc; border:1px dashed #cbd5e1; border-radius:9px; }
.fecha-manual .chk { font-size:13.5px; }
.fecha-manual input[type="datetime-local"] { font-family:'Courier New',monospace; font-size:15px; }

/* ── Botones ── */
.acts { display:flex; gap:10px; flex-wrap:wrap; margin-top:17px; align-items:center; }
.btn { border:none; border-radius:8px; padding:12px 24px; font-size:14px; font-weight:bold;
       cursor:pointer; font-family:inherit; white-space:nowrap; text-decoration:none; display:inline-block; }
.btn-main { background:#2563eb; color:#fff; } .btn-main:hover { background:#1d4ed8; }
.btn-ok   { background:#059669; color:#fff; } .btn-ok:hover { background:#047857; }
.btn-gray { background:#e2e8f0; color:#334155; } .btn-gray:hover { background:#cbd5e1; }
.btn-red  { background:#fee2e2; color:#b91c1c; } .btn-red:hover { background:#fecaca; }
.btn-warn { background:#fef3c7; color:#92400e; } .btn-warn:hover { background:#fde68a; }
.btn-sm { padding:7px 13px; font-size:12.5px; border-radius:6px; }

/* ── Selección del 2do pesaje ── */
.sel-card { border:2px solid #0ea5e9; background:#fff; border-radius:10px; margin-bottom:18px; overflow:hidden; }
.sel-h { background:#0ea5e9; color:#fff; padding:10px 18px; font-size:13px; font-weight:bold;
         display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap;
         text-transform:uppercase; letter-spacing:.6px; }
.sel-h a { color:#fff; }
.sel-b { padding:16px 18px; }
.sel-datos { display:grid; grid-template-columns:repeat(4,1fr); gap:10px 18px; margin-bottom:16px; }
.d { font-size:13.5px; }
.d b { display:block; font-size:10.5px; color:#64748b; text-transform:uppercase; letter-spacing:.5px; margin-bottom:1px; }
.calc { display:grid; grid-template-columns:1fr 1fr 1.2fr; gap:14px; }
.cbox { border:1px solid #e2e8f0; border-radius:9px; padding:12px 15px; background:#f8fafc; }
.cbox .val { font-family:'Courier New',monospace; font-size:30px; font-weight:bold; color:#0f172a; text-align:right; }
.cbox .sub { font-size:11.5px; color:#64748b; text-align:right; margin-top:3px; }
.cbox.dark { background:#0f172a; border-color:#0f172a; } .cbox.dark > span.t { color:#7dd3fc; } .cbox.dark .val { color:#fff; }
.cbox.neto { background:#064e3b; border-color:#10b981; } .cbox.neto > span.t { color:#a7f3d0; }
.cbox.neto .val { color:#6ee7b7; font-size:34px; } .cbox.neto .sub { color:#a7f3d0; }
.cbox.neto.bad { background:#7f1d1d; border-color:#f87171; }
.cbox.neto.bad .val, .cbox.neto.bad .sub, .cbox.neto.bad > span.t { color:#fecaca; }

/* ── Lista de pendientes ── */
.search { display:flex; gap:10px; margin-bottom:14px; flex-wrap:wrap; align-items:center; }
.search input, .search select { border:1px solid #cbd5e1; border-radius:8px; padding:10px 13px;
  font-size:14px; font-family:inherit; outline:none; }
.search input[type="text"] { flex:1; min-width:200px; }
.search input:focus, .search select:focus { border-color:#2563eb; }
.plist { display:grid; grid-template-columns:repeat(auto-fill,minmax(285px,1fr)); gap:12px; }
.pend { border:1px solid #d7dee8; border-left:5px solid #f59e0b; border-radius:9px; background:#fff;
        padding:13px 15px; display:block; text-decoration:none; color:inherit; }
.pend:hover { border-color:#0ea5e9; border-left-color:#0ea5e9; box-shadow:0 2px 8px rgba(14,165,233,.18); }
.pend.sel { border-color:#0ea5e9; border-left-color:#0ea5e9; background:#f0f9ff; }
.pend .p1 { display:flex; justify-content:space-between; align-items:baseline; gap:10px; }
.pend .pl { font-size:18px; font-weight:bold; font-family:'Courier New',monospace; letter-spacing:1px; }
.pend .tk { font-size:12px; color:#64748b; font-weight:bold; }
.pend .p2 { font-size:12.5px; color:#475569; margin-top:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pend .p3 { margin-top:9px; display:flex; justify-content:space-between; align-items:center; gap:8px; }
.pend .pw { font-family:'Courier New',monospace; font-size:17px; font-weight:bold; }
.pend .pf { font-size:11.5px; color:#64748b; margin-top:5px; }
.chip { font-size:11px; font-weight:bold; padding:3px 9px; border-radius:20px; background:#fef3c7;
        color:#92400e; text-transform:uppercase; letter-spacing:.5px; display:inline-block; }
.chip.bruto    { background:#e0e7ff; color:#3730a3; }
.chip.cerrado  { background:#d1fae5; color:#065f46; }
.chip.pendiente{ background:#fef3c7; color:#92400e; }
.chip.anulado  { background:#fee2e2; color:#991b1b; }

.vacio { text-align:center; padding:38px 20px; color:#94a3b8; font-size:14px; }
.vacio .big { font-size:34px; display:block; margin-bottom:8px; }

/* ── Tablas ── */
.tbl-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; font-size:13px; }
th { text-align:left; background:#f1f5f9; color:#475569; font-size:11px; text-transform:uppercase;
     letter-spacing:.5px; padding:9px 11px; border-bottom:2px solid #e2e8f0; white-space:nowrap; }
td { padding:9px 11px; border-bottom:1px solid #eef2f7; white-space:nowrap; }
tr:hover td { background:#f8fafc; }
td.num { font-family:'Courier New',monospace; font-weight:bold; text-align:right; }
td.neto { color:#047857; }
td.anul { color:#b91c1c; text-decoration:line-through; }
.tacts { display:flex; gap:6px; }
.pg { display:flex; gap:6px; margin-top:14px; flex-wrap:wrap; align-items:center; font-size:13px; }
.pg a, .pg span { padding:6px 11px; border-radius:6px; background:#e2e8f0; color:#334155; text-decoration:none; }
.pg span.on { background:#2563eb; color:#fff; font-weight:bold; }

/* ── Panel (dashboard) ── */
.kpis { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:18px; }
.kpi { background:#fff; border:1px solid #d7dee8; border-radius:10px; padding:16px 18px; }
.kpi b { display:block; font-size:11px; color:#64748b; text-transform:uppercase; letter-spacing:.6px; margin-bottom:6px; }
.kpi .v { font-family:'Courier New',monospace; font-size:30px; font-weight:bold; }
.kpi .v small { font-size:13px; color:#64748b; }
.kpi.az .v { color:#1d4ed8; } .kpi.ve .v { color:#047857; } .kpi.am .v { color:#b45309; }

/* ── Adjuntos ── */
.adjs { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:12px; }
.adj { border:1px solid #d7dee8; border-radius:8px; overflow:hidden; background:#fff; }
.adj img { width:100%; height:110px; object-fit:cover; display:block; background:#f1f5f9; }
.adj .ph { height:110px; display:flex; align-items:center; justify-content:center; font-size:34px; background:#f1f5f9; }
.adj .n { padding:7px 9px; font-size:11.5px; color:#475569; word-break:break-all; }
.adj .a { padding:0 9px 9px; display:flex; gap:6px; }

/* ── Login ── */
.login-bg { min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px;
            background:linear-gradient(160deg,#0f172a 0%,#1e293b 60%,#334155 100%); }
.login { background:#fff; border-radius:14px; padding:30px 32px; width:100%; max-width:390px;
         box-shadow:0 12px 40px rgba(0,0,0,.35); }
.login h2 { font-size:17px; text-align:center; line-height:1.35; }
.login .ruc { text-align:center; font-size:12px; color:#64748b; margin:4px 0 20px; }
.login .f { margin-bottom:13px; }
.login .btn { width:100%; margin-top:6px; }

/* ── Responsive ── */
@media (max-width:860px) {
  .grid { grid-template-columns:repeat(2,1fr); }
  .f.c3, .f.c4 { grid-column:span 2; }
  .weigh, .calc { grid-template-columns:1fr; }
  .sel-datos, .kpis { grid-template-columns:repeat(2,1fr); }
}

/* ══ TICKET IMPRESO — MEDIA HOJA A4 (210 × 148.5 mm) ══ */
.tk-print { width:210mm; height:148.5mm; padding:9mm 13mm 7mm; background:#fff; color:#000;
            font-family:'Courier New', Courier, monospace; font-size:13px;
            position:relative; overflow:hidden; border-bottom:1px dashed #9ca3af; margin:0 auto; }
.tk-hdr { display:flex; justify-content:space-between; align-items:flex-start; }
.tk-co  { font-size:16px; font-weight:bold; letter-spacing:1.4px; }
.tk-sub { font-size:12px; margin-top:1px; }
.tk-num { font-size:13px; font-weight:bold; white-space:nowrap; text-align:right; }
.tk-num .n { font-size:17px; }
.tk-hr { border:none; border-top:1.5px solid #111; margin:5px 0; }
.tk-row { display:flex; align-items:baseline; line-height:1.6; }
.tk-lbl { display:inline-block; white-space:pre; flex-shrink:0; width:14ch; }
.tk-c { flex-shrink:0; margin-right:4px; }
.tk-grid { display:grid; grid-template-columns:40ch 25ch 1fr; line-height:1.62; margin-top:2px; }
.tk-cell { display:flex; align-items:baseline; white-space:nowrap; }
.tk-lb { display:inline-block; white-space:pre; flex-shrink:0; }
.w14 { width:14ch; } .w12 { width:12ch; } .w10 { width:10ch; }
.tk-v { font-weight:bold; }
.tk-kg { font-weight:bold; margin-left:1ch; }
.tk-firmas { display:flex; justify-content:space-around; gap:30px; margin-top:13mm; }
.tk-firma { flex:1; max-width:62mm; text-align:center; border-top:1px solid #111; padding-top:3px; font-size:11.5px; }
.tk-cut { position:absolute; left:0; right:0; bottom:1mm; text-align:center; font-size:9px; color:#9ca3af; font-family:Arial,sans-serif; }
.tk-anulado { position:absolute; top:46%; left:0; right:0; text-align:center; font-size:60px; font-weight:bold;
              color:rgba(185,28,28,.22); letter-spacing:10px; transform:rotate(-12deg); pointer-events:none; }

@media print {
  * { -webkit-print-color-adjust:exact !important; print-color-adjust:exact !important; }
  body > *:not(#printArea) { display:none !important; }
  body { background:#fff !important; padding:0 !important; }
  #printArea { display:block !important; }
  @page { size:A4 portrait; margin:0; }
}