/* Modo conteo de la oficina — P10 Fase 2 · H21 (conteo-ui.js). Mismo archivo en el portal y en el admin. */
.cn { --cn-linea:#E7E9EE; --cn-t1:#0F172A; --cn-t2:#475467; --cn-t3:#667085; --cn-marca:#3B5BFD; --cn-bien:#15803D; --cn-bienf:#DCFCE7;
  --cn-mal:#B91C1C; --cn-malf:#FEE2E2; --cn-atn:#B45309; --cn-atnf:#FEF3C7; color:var(--cn-t1); font-variant-numeric:tabular-nums; max-width:1280px; margin:0 auto; }
.cn h1 { font-size:24px; font-weight:600; margin:0 0 4px; } .cn h3 { font-size:15px; margin:0 0 4px; }
.cn-titulo { display:flex; gap:16px; align-items:flex-start; justify-content:space-between; flex-wrap:wrap; margin-bottom:14px; }
.cn-sub, .cn-nota { color:var(--cn-t3); font-size:13px; margin:0 0 10px; }
.cn-vacio { color:var(--cn-t3); font-size:13px; padding:10px 0; margin:0; }
.cn-btn { font:inherit; font-size:14px; font-weight:600; border-radius:10px; padding:9px 16px; border:1px solid var(--cn-linea); background:#fff; color:var(--cn-t1); cursor:pointer; }
.cn-btn.prim { background:var(--cn-marca); border-color:var(--cn-marca); color:#fff; } .cn-btn:disabled { opacity:.5; cursor:default; }
.cn-pills { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:12px; }
.cn-pills button { font:inherit; font-size:13px; padding:6px 14px; border-radius:999px; border:1px solid var(--cn-linea); background:#fff; color:var(--cn-t2); cursor:pointer; }
.cn-pills button[aria-pressed="true"] { background:var(--cn-t1); border-color:var(--cn-t1); color:#fff; }
.cn-cab, .cn-cab-res { display:grid; grid-template-columns:minmax(0,1fr) repeat(4, 112px); gap:12px; margin-bottom:10px; }
.cn-cab-res { grid-template-columns:repeat(4, minmax(0,1fr)); }
.cn-input { display:flex; align-items:center; gap:10px; background:#fff; border:2px solid var(--cn-marca); border-radius:14px; padding:0 14px; }
.cn-input input { flex:1; min-width:0; border:0; outline:0; font:inherit; font-size:18px; padding:14px 0; background:transparent; }
.cn-bar { color:var(--cn-t3); font-weight:700; letter-spacing:-2px; }
.cn-cnt { background:#fff; border:1px solid var(--cn-linea); border-radius:14px; padding:10px 14px; font-size:12px; color:var(--cn-t3); }
.cn-cnt b { display:block; font-size:20px; font-weight:500; color:var(--cn-t1); } .cn-cnt.mal b { color:var(--cn-mal); }
.cn-cnt.cn-ancho { grid-column:span 3; display:flex; align-items:center; font-size:13px; }
.cn-sonido { display:flex; gap:10px; align-items:center; flex-wrap:wrap; font-size:12px; color:var(--cn-t3); margin-bottom:10px; }
.cn-sonido .p10-mudo { font:inherit; font-size:12px; padding:5px 10px; border-radius:999px; border:1px solid var(--cn-linea); background:#fff; cursor:pointer; }
.cn-feed { list-style:none; margin:0 0 14px; padding:0; display:grid; gap:6px; }
.cn-scan { display:grid; grid-template-columns:28px minmax(0,1fr) auto; gap:12px; align-items:center; padding:8px 12px; border-radius:10px; font-size:13px; border-left:4px solid transparent; }
.cn-ic { width:24px; height:24px; border-radius:50%; display:grid; place-items:center; font-weight:700; color:#fff; }
.cn-txt small { display:block; font-size:12px; } .cn-son { font-size:11px; font-weight:600; opacity:.85; } .cn-scan time { font-size:12px; color:var(--cn-t3); }
.cn-scan.bien { background:var(--cn-bienf); color:var(--cn-bien); border-left-color:var(--cn-bien); } .cn-scan.bien .cn-ic { background:var(--cn-bien); }
.cn-scan.mal { background:var(--cn-malf); color:var(--cn-mal); border-left-color:#EF4444; box-shadow:0 0 0 2px rgba(239,68,68,.35); } .cn-scan.mal .cn-ic { background:#EF4444; }
.cn-scan.repetido { background:var(--cn-atnf); color:var(--cn-atn); border-left-color:var(--cn-atn); } .cn-scan.repetido .cn-ic { background:var(--cn-atn); }
.cn-scan.noexiste { background:var(--cn-mal); color:#fff; border-left-color:#7F1D1D; } .cn-scan.noexiste .cn-ic { background:#fff; color:var(--cn-mal); } .cn-scan.noexiste time { color:rgba(255,255,255,.8); }
.cn-dos { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:16px; align-items:start; }
.cn-tarjeta { background:#fff; border:1px solid var(--cn-linea); border-radius:16px; padding:16px; min-width:0; }
.cn-scroll { max-height:480px; overflow-y:auto; }
.cn-t { width:100%; border-collapse:collapse; font-size:13px; }
.cn-t th { text-align:left; font-weight:500; color:var(--cn-t3); font-size:12px; padding:6px; border-bottom:1px solid var(--cn-linea); }
.cn-t td { padding:7px 6px; border-bottom:1px solid var(--cn-linea); vertical-align:middle; }
.cn-t .num { text-align:right; } .cn-t td.mal { color:var(--cn-mal); font-weight:600; }
.cn-t tfoot td { font-weight:700; border-top:2px solid var(--cn-t1); border-bottom:0; }
.cn-mio { font-weight:600; } .cn-cel { display:none; font-weight:400; color:var(--cn-t3); font-size:12px; }
.cn-hist tr.cn-fila { cursor:pointer; } .cn-hist tr.cn-fila:hover td { background:#F8FAFC; }
.cn-pie { display:flex; gap:10px; align-items:center; justify-content:flex-end; flex-wrap:wrap; margin-top:16px; font-size:12px; color:var(--cn-t3); }
.cn-pie > span { margin-right:auto; }
.cn-aviso { border:1px solid #fde68a; background:#fffbeb; color:var(--cn-atn); border-radius:10px; padding:10px 12px; font-size:13px; margin-bottom:12px; }
.cn-aviso.bien { border-color:#bbf7d0; background:var(--cn-bienf); color:var(--cn-bien); }
@media (max-width:760px) {
  .cn h1 { font-size:20px; }
  .cn-cab, .cn-cab-res { grid-template-columns:repeat(4, minmax(0,1fr)); gap:8px; }
  .cn-cab .cn-input { grid-column:1 / -1; } .cn-cnt { padding:8px; font-size:11px; } .cn-cnt b { font-size:17px; }
  .cn-cnt.cn-ancho { grid-column:span 3; }
  .cn-dos { grid-template-columns:minmax(0,1fr); }
  .cn-scan { grid-template-columns:24px minmax(0,1fr); gap:8px; } .cn-scan time { display:none; }
  .cn-sec { display:none; } .cn-cel { display:block; }
  .cn-pie .cn-btn { flex:1 1 auto; }
}
.cn-t td.cn-nw { white-space:nowrap; }