/* Oficina de campo: Limpieza (jornadas, reportes, revisiones), Extintores, Pedidos de material, Gastos de campo y la ficha pública del extintor. */
.ck-page .kpis { grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr)); }
.ck-page .kpis.ck-kpis5 { grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr)); }
.ck-kpi.is-on { border-color: var(--oro); box-shadow: inset 0 0 0 2px var(--oro); }
.ck-tbl td { vertical-align: middle; }
.ck-tbl .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ck-place { max-width: 220px; }
.ck-tbl th, .ck-tbl td { padding-left: 12px; padding-right: 12px; }
.ck-crew { max-width: 200px; }
.ck-what { max-width: 300px; min-width: 0; }
.ck-what b, .ck-place b { display: block; font-weight: 600; }
.ck-chk { width: 40px; }
.ck-chk input, .ck-mchk { width: 18px; height: 18px; accent-color: var(--grafito); cursor: pointer; }
.ck-mchk { flex: none; align-self: center; }
.ck-time { font-variant-numeric: tabular-nums; font-weight: 600; white-space: nowrap; }
.ck-cell { display: flex; align-items: center; gap: 10px; }
.ck-gps { display: inline-flex; align-items: center; gap: 4px; font-size: 0.8438rem; white-space: nowrap; }
.ck-quick { flex-wrap: nowrap; }
.ck-quote { padding: 10px 14px; border-left: 3px solid var(--oro); background: var(--oro-50); border-radius: 0 12px 12px 0; font-style: italic; }
.ck-clamp { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ck-pre { white-space: pre-wrap; }
.ck-kv { grid-template-columns: minmax(110px, auto) minmax(0, 1fr); }
.ck-kv dd { overflow-wrap: anywhere; }
tr.ck-urgent td:first-child, .list-item.ck-urgent { box-shadow: inset 3px 0 0 var(--error); }

/* Miniaturas y visor */
.ck-thumb { position: relative; flex: none; display: inline-grid; place-items: center; padding: 0; border: 1px solid var(--acero-100); border-radius: 10px; overflow: hidden; background: var(--acero-50); cursor: zoom-in; }
.ck-thumb img, .ck-thumb video { width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; }
.ck-thumb-sm { width: 44px; height: 44px; }
.ck-thumb-md { width: 64px; height: 64px; }
.ck-thumb:hover { border-color: var(--oro); }
.ck-thumb:focus-visible { outline: 3px solid var(--oro); outline-offset: 2px; }
.ck-play { position: absolute; inset: auto; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: rgba(11, 12, 14, .72); color: #fff; }
.ck-pdf-chip { cursor: pointer; display: grid; align-content: center; justify-items: center; gap: 0; color: var(--error); font-size: 0.6563rem; background: var(--error-50); border-color: transparent; }
.ck-noticket { font-size: 0.7813rem; color: var(--aviso); font-weight: 600; white-space: nowrap; }
.ck-lightbox { display: grid; gap: 10px; justify-items: center; }
.ck-lightbox img, .ck-lightbox video { max-width: 100%; max-height: min(72vh, 820px); border-radius: 12px; background: #0B0C0E; object-fit: contain; }
.ck-pdf { display: grid; justify-items: center; gap: 10px; padding: 24px 12px; text-align: center; }
.ck-thumbs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.ck-stars { color: #C98E00; letter-spacing: 1px; white-space: nowrap; }
.ck-stars span { color: var(--acero-200); }
.inv-k-nums .ck-stars { font-size: 1.1875rem; }

/* Limpieza */
.ck-mshift { align-items: flex-start; }
.ck-mtimes { display: flex; gap: 18px; flex-wrap: wrap; margin: 8px 0 4px; }
.ck-prog { display: inline-flex; align-items: center; gap: 8px; min-width: 120px; }
.ck-prog .inv-bar { flex: 1; min-width: 60px; }
.ck-prog .inv-bar span.ok { background: var(--ok); }
.ck-areas { display: grid; gap: 8px; }
.ck-area { padding: 10px 12px; border-radius: 14px; border: 1px solid var(--acero-100); border-left: 3px solid var(--ok); background: var(--papel); display: grid; gap: 6px; min-width: 0; }
.ck-area.pending { border-left-color: var(--aviso); }
.ck-ba { display: flex; flex-wrap: wrap; gap: 14px; }
.ck-sign { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--acero-100); }
.ck-sign > div { display: grid; gap: 2px; flex: 1 1 200px; min-width: 0; }
.ck-sigimg { border: 1px dashed var(--acero-200); border-radius: 12px; padding: 6px 10px; background: #fff; cursor: zoom-in; }
.ck-sigimg img { display: block; max-height: 80px; max-width: 220px; }
.ck-checks { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr)); gap: 12px; }
.ck-check { padding: 14px 16px; display: grid; gap: 10px; align-content: start; min-width: 0; }
.ck-check.has-miss { box-shadow: inset 3px 0 0 var(--error); }
.ck-check-top { display: flex; gap: 12px; align-items: flex-start; min-width: 0; }
.ck-check-top .ck-thumb { width: 56px; height: 56px; border-radius: 50%; }
.ck-huella { flex: none; }
.ck-miss { margin: 0; padding: 10px 12px 10px 28px; border-radius: 12px; background: var(--error-50); color: var(--grafito); font-size: 0.8438rem; display: grid; gap: 4px; }
.ck-items summary { cursor: pointer; color: var(--acero-600); }
.ck-items ul { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 4px; font-size: 0.8438rem; }
.ck-items li { display: flex; align-items: center; gap: 6px; }
.ck-items li svg { color: var(--ok); }
.ck-items li.bad { color: var(--error); }
.ck-items li.bad svg { color: var(--error); }

/* Extintores */
.ck-ext-m { align-items: center; gap: 10px; }
.ck-ext-main { display: grid; gap: 3px; min-width: 0; border: 0; background: none; font: inherit; color: inherit; text-align: left; padding: 0; cursor: pointer; }
.ck-ext-state { display: flex; gap: 8px; flex-wrap: wrap; }
.ck-dates { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.ck-dates p { margin-top: 6px; }
.ck-qr { display: flex; align-items: center; gap: 12px; }
.ck-events .list-item { align-items: flex-start; padding: 10px 0; }
.ck-ev-dot { flex: none; width: 12px; height: 12px; margin: 5px 16px 0; border-radius: 50%; background: var(--acero-300); }
.ck-ev-dot.inspeccion, .ck-ev-dot.recarga, .ck-ev-dot.hidrostatica, .ck-ev-dot.mantenimiento, .ck-ev-dot.reemplazo { background: var(--ok); }
.ck-ev-dot.incidencia, .ck-ev-dot.baja { background: var(--error); }
.ck-ev-dot.alta { background: var(--oro); }
.ck-checklist { display: grid; gap: 6px; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--acero-100); background: var(--papel); }
.ck-chk-row { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; cursor: pointer; font-size: 0.9063rem; }
.ck-chk-row:hover { background: var(--acero-50); }
.ck-chk-row input { width: 20px; height: 20px; flex: none; accent-color: var(--ok); }
.ck-chk-row.bad { background: var(--error-50); color: var(--error); font-weight: 600; }
.ck-photo { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

/* Pedidos */
.ck-items-tbl .num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }

/* Gastos de campo */
.gc-people { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, 1fr); gap: 10px; overflow-x: auto; padding: 2px 2px 6px; scrollbar-width: thin; }
.gc-person { display: grid; gap: 8px; padding: 12px 14px; text-align: left; font: inherit; color: inherit; cursor: pointer; border: 1px solid var(--acero-100); min-width: 0; }
.gc-person.is-on { border-color: var(--oro); box-shadow: inset 0 0 0 2px var(--oro); }
.gc-person dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin: 0; }
.gc-person dt { font-size: 0.7188rem; color: var(--acero-500); font-weight: 600; }
.gc-person dd { margin: 0; font-weight: 800; font-variant-numeric: tabular-nums; font-size: 0.9375rem; }
.gc-owe { color: var(--azul, #2A55C5); }
.gc-bulk { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 18px; background: var(--oro-50); border-bottom: 1px solid var(--acero-100); }
.gc-acts { display: flex; gap: 4px; justify-content: flex-end; flex-wrap: nowrap; }
.gc-m { align-items: center; gap: 10px; }
.gc-amount { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.gc-amount b { font-family: var(--titulo); font-size: 1.875rem; font-weight: 800; letter-spacing: -.02em; }
.gc-ticket-big { display: block; width: 100%; padding: 0; border: 1px solid var(--acero-100); border-radius: 14px; overflow: hidden; background: var(--acero-50); cursor: zoom-in; }
.gc-ticket-big img { display: block; width: 100%; max-height: 420px; object-fit: contain; }

/* Ficha pública del extintor */
.verify-seal.pe-red { background: var(--error-50); color: var(--error); }
.pe-head { display: flex; align-items: center; gap: 14px; }
.pe-code { font-family: var(--titulo); font-size: 1.625rem; font-weight: 800; letter-spacing: .04em; }
.pe-help { display: grid; gap: 6px; padding: 12px 14px; border-radius: 14px; background: var(--acero-50); color: var(--acero-700); }
.pe-help a { font-weight: 700; color: var(--grafito); }
.pe-form .grow { flex: 1; }

@media (max-width: 899px) {
  .ck-page .kpis, .ck-page .kpis.ck-kpis5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ck-quick { flex: 1 1 100%; flex-wrap: wrap; }
  .ck-checks { grid-template-columns: minmax(0, 1fr); }
  .gc-people { grid-auto-columns: minmax(78%, 1fr); }
  .gc-bulk { padding: 10px 14px; }
  .ck-kv { grid-template-columns: minmax(96px, auto) minmax(0, 1fr); }
  .ck-mshift .inv-mtotal b { font-size: 1.0625rem; }
  .list-item.ck-ext-m, .list-item.gc-m { flex-wrap: nowrap; }
}