/* watchtower-reports.css — EOC Console Reports cockpit (.rq-*) + multi-type
 * Incident Report form (.rf-*). Item 4. Command-dark tokens.
 * Designs: Watchtower Reports Queue.dc.html + Watchtower Incident Report.dc.html */

/* ===================== cockpit / report room ===================== */
.rq-body { flex: 1; min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: 14px; padding: 14px; background: var(--bg-0, #070b13); }
.rq-err { color: var(--crit, #e51e25); font: 12px/1.4 var(--mono); }
.rq-kpis { display: flex; gap: 0; background: var(--bg-1, #0e1626); border: 1px solid var(--l-2, #2a3148); border-radius: 8px; overflow: hidden; }
.rq-kpi { flex: 1; padding: 13px 20px; border-right: 1px solid var(--l-1, #1d2840); }
.rq-kpi:last-child { border-right: 0; }
.rq-kpi .n { font: 700 26px/1 var(--mono); color: var(--t-0, #f1f4fb); }
.rq-kpi.sign .n { color: var(--warn, #ffc72c); }
.rq-kpi.review .n { color: var(--acc, #41b6e6); }
.rq-kpi.filed .n { color: var(--ok, #3fb56b); }
.rq-kpi .l { font: 600 9px/1 var(--label); letter-spacing: 0.1em; text-transform: uppercase; color: var(--t-3, #6b768f); margin-top: 8px; }
.rq-toolbar { display: flex; align-items: center; gap: 12px; }
.rq-tabs { display: flex; gap: 6px; flex: 1; flex-wrap: wrap; }
.rq-tab { background: var(--bg-1, #0e1626); border: 1px solid var(--l-2, #2a3148); border-radius: 6px; padding: 7px 12px; cursor: pointer; font: 600 11px/1 var(--sans); color: var(--t-2, #9aa6bf); }
.rq-tab:hover { color: var(--t-0, #f1f4fb); }
.rq-tab.on { border-color: var(--acc, #41b6e6); background: rgba(65,182,230,0.1); color: var(--acc, #41b6e6); }
.rq-tab .ct { font: 600 9px/1 var(--mono); color: var(--t-3, #6b768f); background: var(--bg-3, #1b2a4a); border-radius: 7px; padding: 1px 5px; margin-left: 3px; }
.rq-search { width: 280px; background: var(--bg-1, #0e1626); border: 1px solid var(--l-2, #2a3148); border-radius: 6px; padding: 8px 11px; color: var(--t-0, #f1f4fb); font: 12px/1 var(--sans); }
.rq-search:focus { outline: none; border-color: var(--acc, #41b6e6); }
.rq-tbl { background: var(--bg-1, #0e1626); border: 1px solid var(--l-2, #2a3148); border-radius: 8px; overflow: hidden; }
.rq-row { display: grid; grid-template-columns: 1.7fr 90px 160px 110px 70px auto; align-items: center; gap: 10px; padding: 13px 20px; border-bottom: 1px solid var(--l-1, #1d2840); }
.rq-row.rq-hd { font: 600 9px/1 var(--label); letter-spacing: 0.1em; text-transform: uppercase; color: var(--t-3, #6b768f); background: var(--bg-2, #141f33); }
.rq-row:not(.rq-hd):hover { background: var(--bg-2, #141f33); }
.rq-type { display: flex; align-items: center; gap: 10px; min-width: 0; }
.rq-ic { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 6px; border: 1px solid var(--acc, #41b6e6); color: var(--acc, #41b6e6); flex: 0 0 auto; }
.rq-ic.crit { border-color: var(--crit, #e51e25); color: var(--crit, #e51e25); }
.rq-type .ttl { font: 600 13px/1.2 var(--sans); color: var(--t-0, #f1f4fb); }
.rq-type .num { font-size: 11px; color: var(--t-3, #6b768f); margin-top: 1px; }
.rq-case { font-size: 12px; color: var(--acc, #41b6e6); }
.rq-st { font: 700 9.5px/1 var(--label); letter-spacing: 0.06em; text-transform: uppercase; padding: 5px 8px; border-radius: 4px; border: 1px solid currentColor; display: inline-flex; align-items: center; justify-self: start; }
.rq-st.draft { color: var(--warn, #ffc72c); }
.rq-st.review { color: var(--acc, #41b6e6); }
.rq-st.filed { color: var(--ok, #3fb56b); }
.rq-who, .rq-upd { font-size: 12px; color: var(--t-2, #9aa6bf); }
.rq-act { display: flex; gap: 7px; justify-content: flex-end; }
.rq-b { font: 600 11px/1 var(--sans); padding: 6px 10px; border-radius: 5px; cursor: pointer; border: 1px solid var(--l-2, #2a3148); background: transparent; color: var(--t-2, #9aa6bf); white-space: nowrap; }
.rq-b:hover { color: var(--t-0, #f1f4fb); border-color: var(--l-3, #2a3148); }
.rq-b.gold { border-color: var(--warn, #ffc72c); color: var(--warn, #ffc72c); }
.rq-b.pri { background: var(--acc, #41b6e6); border-color: var(--acc, #41b6e6); color: var(--bg-0, #070b13); }
.rq-empty { color: var(--t-3, #6b768f); font: 12px/1.5 var(--sans); padding: 40px; text-align: center; }
.rq-sheet-bg { position: absolute; inset: 0; background: rgba(5,8,13,0.72); display: grid; place-items: center; z-index: 60; }
.rq-sheet { width: min(520px, 92%); max-height: 70%; overflow: auto; background: var(--bg-1, #0e1626); border: 1px solid var(--l-2, #2a3148); border-radius: 10px; padding: 16px; }
.rq-sheet-head { display: flex; justify-content: space-between; align-items: center; font: 600 13px/1 var(--mono); color: var(--t-0, #f1f4fb); margin-bottom: 12px; }
.rq-sheet-x { background: none; border: none; color: var(--t-2, #9aa6bf); font-size: 22px; cursor: pointer; }
.rq-pick-list { display: flex; flex-direction: column; gap: 7px; }
.rq-pick { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 10px 12px; cursor: pointer; text-align: left; background: var(--bg-2, #141f33); border: 1px solid var(--l-2, #2a3148); border-radius: 7px; }
.rq-pick:hover { border-color: var(--acc, #41b6e6); }
.rq-pick .tier { font: 700 10px/1 var(--mono); padding: 4px 6px; border-radius: 3px; }
.rq-pick .tier.t1 { background: rgba(65,182,230,0.18); color: var(--acc); }
.rq-pick .tier.t2 { background: rgba(255,199,44,0.2); color: var(--warn); }
.rq-pick .tier.t3 { background: var(--crit); color: #fff; }
.rq-pick .ttl { font: 600 13px/1.2 var(--sans); color: var(--t-0, #f1f4fb); }
.rq-pick .sub { font: 11px/1.2 var(--sans); color: var(--t-3, #6b768f); }
.rq-pick .chev { color: var(--t-3, #6b768f); font-size: 16px; }

/* ===================== report form ===================== */
.rf-root { position: relative; }
.rf-head { gap: 10px; flex-wrap: wrap; }
.rf-head .rf-title { font: 600 14px/1 var(--sans); color: var(--t-0, #f1f4fb); }
.rf-head .rf-num { font: 600 12px/1 var(--mono); color: var(--acc, #41b6e6); }
.rf-head .rf-status { font: 700 9px/1 var(--label); letter-spacing: 0.08em; text-transform: uppercase; padding: 4px 8px; border-radius: 4px; border: 1px solid var(--warn, #ffc72c); color: var(--warn, #ffc72c); }
.rf-head .rf-status.review { border-color: var(--acc); color: var(--acc); }
.rf-head .rf-status.filed { border-color: var(--ok); color: var(--ok); }
.rf-head .rf-actions { display: inline-flex; gap: 7px; align-items: center; }
.rf-body { flex: 1; min-height: 0; overflow: auto; padding: 16px; background: var(--bg-0, #070b13); max-width: 920px; margin: 0 auto; width: 100%; }
.rf-err { color: var(--crit, #e51e25); font: 12px/1.4 var(--mono); padding-bottom: 8px; }
.rf-rtbar { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px; }
.rf-rtchip { background: var(--bg-1, #0e1626); border: 1px solid var(--l-2, #2a3148); border-radius: 6px; padding: 7px 12px; cursor: pointer; font: 600 11px/1 var(--sans); color: var(--t-2, #9aa6bf); }
.rf-rtchip:hover { color: var(--t-0, #f1f4fb); }
.rf-rtchip.on { border-color: var(--acc, #41b6e6); background: rgba(65,182,230,0.1); color: var(--acc, #41b6e6); }
.rf-rtchip.crit.on { border-color: var(--crit, #e51e25); background: rgba(229,30,37,0.1); color: var(--crit, #e51e25); }
.rf-sec { margin-bottom: 18px; }
.rf-sec h3 { display: flex; align-items: center; gap: 9px; font: 600 12px/1 var(--label); letter-spacing: 0.08em; text-transform: uppercase; color: var(--t-1, #c3ccdf); margin: 0 0 11px; }
.rf-sec h3 .n { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--bg-2, #141f33); border: 1px solid var(--l-2, #2a3148); color: var(--acc, #41b6e6); font-size: 11px; }
.rf-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 11px; }
.rf-grid3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; margin-bottom: 11px; }
.rf-f { display: flex; flex-direction: column; gap: 6px; margin-bottom: 11px; min-width: 0; }
.rf-f > span:first-child { font: 600 10px/1.2 var(--label); letter-spacing: 0.06em; text-transform: uppercase; color: var(--t-3, #6b768f); }
.rf-in { background: var(--bg-2, #141f33); border: 1px solid var(--l-2, #2a3148); border-radius: 6px; padding: 9px 11px; color: var(--t-0, #f1f4fb); font: 13px/1.4 var(--sans); width: 100%; }
.rf-in:focus { outline: none; border-color: var(--acc, #41b6e6); }
.rf-ta { min-height: 88px; resize: vertical; }
.rf-ro { font: 600 13px/1.4 var(--sans); color: var(--t-0, #f1f4fb); padding: 9px 0; }
.rf-muted { font: 12px/1.4 var(--mono); color: var(--t-3, #6b768f); }
.rf-muted.gold { color: var(--warn, #ffc72c); }
.rf-seg { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.rf-segb { background: var(--bg-2, #141f33); border: 1px solid var(--l-2, #2a3148); border-radius: 6px; padding: 8px 13px; cursor: pointer; font: 600 12px/1 var(--sans); color: var(--t-2, #9aa6bf); }
.rf-segb.on { border-color: var(--acc, #41b6e6); color: var(--t-0, #f1f4fb); background: rgba(65,182,230,0.12); }
.rf-segb.on.warn { border-color: var(--warn, #ffc72c); background: rgba(255,199,44,0.14); color: var(--warn, #ffc72c); }
.rf-segb.on.crit { border-color: var(--crit, #e51e25); background: rgba(229,30,37,0.14); color: var(--crit, #e51e25); }
.rf-tgl { display: inline-flex; align-items: center; gap: 9px; background: var(--bg-2, #141f33); border: 1px solid var(--l-2, #2a3148); border-radius: 6px; padding: 9px 12px; cursor: pointer; font: 600 12px/1 var(--sans); color: var(--t-2, #9aa6bf); }
.rf-tgl .knob { width: 26px; height: 14px; border-radius: 8px; background: var(--l-3, #2a3148); position: relative; flex: 0 0 auto; }
.rf-tgl .knob::after { content: ""; position: absolute; top: 1px; left: 1px; width: 12px; height: 12px; border-radius: 50%; background: var(--t-1, #c3ccdf); transition: left 120ms; }
.rf-tgl.on { color: var(--t-0, #f1f4fb); }
.rf-tgl.on .knob { background: var(--ok, #3fb56b); }
.rf-tgl.on .knob::after { left: 13px; background: #fff; }
.rf-counter { font: 11px/1 var(--mono); color: var(--t-3, #6b768f); }
.rf-counter.ok { color: var(--ok, #3fb56b); }

/* signature pads */
.rf-refusal { background: rgba(255,199,44,0.1); border: 1px solid var(--warn, #ffc72c); border-radius: 7px; padding: 11px 13px; font: 13px/1.5 var(--sans); color: var(--t-1, #c3ccdf); margin-bottom: 12px; }
.rf-refusal b { color: var(--warn, #ffc72c); }
.rf-sigwrap { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 14px; }
.rf-sigbox { background: var(--bg-1, #0e1626); border: 1px solid var(--l-2, #2a3148); border-radius: 8px; padding: 11px; }
.rf-sighd { display: flex; justify-content: space-between; align-items: center; font: 600 10px/1 var(--label); letter-spacing: 0.06em; text-transform: uppercase; color: var(--t-2, #9aa6bf); margin-bottom: 8px; }
.rf-clear { background: none; border: none; color: var(--t-3, #6b768f); font: 600 10px/1 var(--label); letter-spacing: 0.06em; text-transform: uppercase; cursor: pointer; }
.rf-clear:hover { color: var(--acc, #41b6e6); }
.rf-sigpad { width: 100%; height: 150px; background: #f1f4fb; border-radius: 6px; touch-action: none; cursor: crosshair; display: block; }
.rf-sigft { display: flex; justify-content: space-between; align-items: center; margin-top: 7px; }
.rf-sigft .hint { font: 11px/1 var(--mono); color: var(--t-3, #6b768f); }
.rf-sigft .st { font: 600 11px/1 var(--mono); color: var(--t-3, #6b768f); }
.rf-sigft .st.ok { color: var(--ok, #3fb56b); }

/* attestation */
.rf-attest { display: flex; align-items: flex-start; gap: 12px; width: 100%; text-align: left; cursor: pointer; background: var(--bg-1, #0e1626); border: 1px solid var(--l-2, #2a3148); border-radius: 8px; padding: 13px; margin-top: 14px; }
.rf-attest .box { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 5px; border: 2px solid var(--acc, #41b6e6); color: var(--acc, #41b6e6); font-size: 14px; flex: 0 0 auto; }
.rf-attest.on .box { background: var(--acc, #41b6e6); color: var(--bg-0, #070b13); }
.rf-attest .txt { font: 13px/1.5 var(--sans); color: var(--t-0, #f1f4fb); }
.rf-attest .txt .sub { display: block; font: 11px/1.4 var(--mono); color: var(--t-3, #6b768f); margin-top: 4px; }

.rf-gatebar { margin-top: 14px; padding: 11px 14px; background: var(--bg-1, #0e1626); border: 1px solid var(--l-2, #2a3148); border-radius: 7px; font: 600 12px/1 var(--mono); letter-spacing: 0.04em; color: var(--t-2, #9aa6bf); }
.rf-gatebar .ok { color: var(--ok, #3fb56b); }

/* filed success screen */
.rf-filed { max-width: 560px; margin: 40px auto; text-align: center; padding: 24px; }
.rf-filed-ok { margin-bottom: 14px; }
.rf-filed h1 { font: 600 20px/1.2 var(--sans); color: var(--t-0, #f1f4fb); margin: 0 0 8px; }
.rf-filed p { font: 13px/1.6 var(--sans); color: var(--t-2, #9aa6bf); margin: 0 0 18px; }
.rf-filed-sum { text-align: left; background: var(--bg-1, #0e1626); border: 1px solid var(--l-2, #2a3148); border-radius: 8px; padding: 14px; margin-bottom: 18px; }
.rf-kv { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; border-bottom: 1px solid var(--l-1, #1d2840); font: 13px/1.4 var(--sans); }
.rf-kv > span:first-child { color: var(--t-3, #6b768f); font: 600 10px/1.4 var(--label); letter-spacing: 0.06em; text-transform: uppercase; }
.rf-kv > span:last-child { color: var(--t-0, #f1f4fb); text-align: right; }
.rf-filed-acts { display: flex; gap: 10px; justify-content: center; }

@media (max-width: 900px) {
  .rf-grid2, .rf-grid3, .rf-sigwrap { grid-template-columns: 1fr; }
  .rq-row { grid-template-columns: 1.5fr 70px 120px auto; }
  .rq-who, .rq-upd, .rq-row.rq-hd span:nth-child(4), .rq-row.rq-hd span:nth-child(5) { display: none; }
}