/* ============================================================
   ProjectTelemetry — Safety department
   assets/safety.css

   Layout comes from the shared .co-* / .cd-* families. Only the parts a
   safety department needs live here: the view tabs, the rate cards, the
   hazard bars, the 300A summary, the compliance calendar, 811 tickets,
   and the guide shelf.
   ============================================================ */

/* ── View tabs ──────────────────────────────────────────── */
.sf-tabs { display:flex; gap:4px; flex-wrap:wrap; margin:0 0 16px; border-bottom:1px solid var(--bd); padding-bottom:0; }
.sf-tab {
  display:inline-flex; align-items:center; gap:6px; padding:9px 13px; border:none; background:transparent;
  color:var(--ink-soft); font-size:13px; font-weight:600; cursor:pointer; border-radius:8px 8px 0 0;
  border-bottom:2px solid transparent; margin-bottom:-1px;
}
.sf-tab i { font-size:15px; }
.sf-tab:hover { color:var(--ink); background:var(--bg2); }
.sf-tab.on { color:var(--accent); border-bottom-color:var(--accent); background:transparent; }
.sf-badge { display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; padding:0 5px;
  border-radius:9px; background:var(--accent); color:#fff; font-size:10.5px; font-weight:700; font-variant-numeric:tabular-nums; }
.sf-badge.bad { background:#DC2626; }

/* ── Alert strip ────────────────────────────────────────── */
.sf-alert { display:flex; align-items:center; gap:12px; padding:13px 15px; border-radius:12px; margin-bottom:16px;
  border:1px solid var(--bd); background:var(--bg2); font-size:12.5px; color:var(--ink-soft); line-height:1.5; }
.sf-alert > i { font-size:22px; color:var(--accent); flex:0 0 auto; }
.sf-alert b { color:var(--ink); font-weight:650; }
.sf-alert > div { flex:1; }
.sf-alert button { flex:0 0 auto; }
.sf-alert.bad { border-color:color-mix(in srgb,#DC2626 40%,var(--bd)); background:rgba(220,38,38,.05); }
.sf-alert.bad > i { color:#DC2626; }

/* ── Rate cards ─────────────────────────────────────────── */
.sf-rates { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:10px; }
.sf-rate { border:1px solid var(--bd); border-radius:10px; padding:11px 13px; background:var(--bg2); }
.sf-rate-v { font-size:22px; font-weight:750; color:var(--ink); font-variant-numeric:tabular-nums; line-height:1.1; }
.sf-rate-l { font-size:11px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-faint); margin-top:3px; }
.sf-rate-h { font-size:10.5px; color:var(--ink-faint); margin-top:5px; line-height:1.4; }
.sf-year { height:28px; padding:0 6px; border:1px solid var(--bd); border-radius:7px; background:var(--white); color:var(--ink); font-size:12px; }

/* ── Hazard bars ────────────────────────────────────────── */
.sf-hazards { display:flex; flex-direction:column; gap:6px; }
.sf-haz { display:grid; grid-template-columns:1fr 90px 90px; align-items:center; gap:10px; width:100%;
  border:1px solid transparent; background:transparent; border-radius:8px; padding:5px 7px; cursor:pointer; text-align:left; }
.sf-haz:hover { border-color:var(--bd); background:var(--bg2); }
.sf-haz.on { border-color:var(--accent); background:var(--accent-bg); }
.sf-haz-n { font-size:12.5px; color:var(--ink); font-weight:550; }
.sf-haz-t { height:7px; border-radius:4px; background:var(--bg2); overflow:hidden; }
.sf-haz-f { display:block; height:100%; border-radius:4px; background:var(--accent); }
.sf-haz-c { text-align:right; font-size:11.5px; color:var(--ink-faint); font-variant-numeric:tabular-nums; }
.sf-haz-c b { color:#B45309; font-weight:650; }

/* ── Notice pills ───────────────────────────────────────── */
.co-pill.sf-open             { background:rgba(217,119,6,.12); color:#B45309; }
.co-pill.sf-in_progress      { background:rgba(14,165,233,.11); color:#0284C7; }
.co-pill.sf-ready_for_review { background:rgba(99,102,241,.12); color:#4F46E5; }
.co-pill.sf-closed           { background:rgba(22,163,74,.12); color:#15803D; }
.co-pill.sf-void             { background:var(--bg2); color:var(--ink-faint); border-color:var(--bd); text-decoration:line-through; }

.co-pill.sf-i-open         { background:rgba(217,119,6,.12); color:#B45309; }
.co-pill.sf-i-under_review { background:rgba(99,102,241,.12); color:#4F46E5; }
.co-pill.sf-i-closed       { background:rgba(22,163,74,.12); color:#15803D; }

.co-pill.sf-l-requested { background:rgba(217,119,6,.12); color:#B45309; }
.co-pill.sf-l-marked    { background:rgba(22,163,74,.12); color:#15803D; }
.co-pill.sf-l-expired   { background:rgba(220,38,38,.10); color:#B91C1C; }
.co-pill.sf-l-cancelled { background:var(--bg2); color:var(--ink-faint); border-color:var(--bd); }

.co-pill.sf-ct-open { background:rgba(217,119,6,.12); color:#B45309; }
.co-pill.sf-ct-done { background:#16A34A; color:#fff; }
.co-pill.sf-ct-na   { background:var(--bg2); color:var(--ink-faint); border-color:var(--bd); }

/* Priority + severity + classification. */
.sf-prio { font-size:10.5px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; padding:2px 7px; border-radius:999px; white-space:nowrap; }
.sf-prio.low      { background:var(--bg2); color:var(--ink-faint); }
.sf-prio.normal   { background:rgba(14,165,233,.10); color:#0284C7; }
.sf-prio.high     { background:rgba(245,158,11,.16); color:#B45309; }
.sf-prio.critical { background:#DC2626; color:#fff; }

.sf-sev { font-size:11.5px; font-weight:600; white-space:nowrap; }
.sf-sev.minor    { color:var(--ink-soft); }
.sf-sev.moderate { color:#0284C7; }
.sf-sev.serious  { color:#B45309; }
.sf-sev.critical { color:#DC2626; font-weight:750; }

.sf-class { font-size:11px; color:var(--ink-soft); white-space:nowrap; }
.sf-class.days_away, .sf-class.death { color:#B91C1C; font-weight:650; }
.sf-class.restricted { color:#B45309; font-weight:600; }
.sf-class.not_recordable { color:var(--ink-faint); }

.sf-who { font-size:12.5px; color:var(--ink); white-space:nowrap; }
.sf-bell { font-size:12px; color:var(--accent); vertical-align:middle; margin-left:3px; }
.sf-ok { font-size:11.5px; color:#15803D; display:inline-flex; align-items:center; gap:4px; white-space:nowrap; }
.sf-od { color:#DC2626; font-weight:650; display:inline-flex; align-items:center; gap:4px; white-space:nowrap; }

/* ── OSHA 300 ───────────────────────────────────────────── */
.sf-300a { display:grid; grid-template-columns:minmax(200px,1fr) 1.4fr; gap:18px; }
.sf-300a-est { display:grid; grid-template-columns:auto 1fr; gap:5px 12px; align-content:start; }
.sf-300a-k { font-size:10.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-faint); align-self:center; }
.sf-300a-v { font-size:13px; color:var(--ink); font-weight:600; }
.sf-300a-nums { display:flex; flex-direction:column; gap:1px; }
.sf-300a-row { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:6px 9px; border-radius:7px; font-size:12.5px; color:var(--ink-soft); }
.sf-300a-row:nth-child(odd) { background:var(--bg2); }
.sf-300a-row b { color:var(--ink); font-size:14px; font-variant-numeric:tabular-nums; }

.sf-300 th.sf-c, .sf-300 td.sf-c { text-align:center; width:64px; }
.sf-x { color:#16A34A; font-size:16px; }
.sf-note { display:flex; align-items:flex-start; gap:8px; margin-top:10px; font-size:11.5px; color:var(--ink-faint); line-height:1.5; }
.sf-note i { font-size:14px; flex:0 0 auto; margin-top:1px; }
.sf-note b { color:var(--ink-soft); }

/* ── Compliance ─────────────────────────────────────────── */
.sf-fws { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:10px; }
.sf-fw { border:1px solid var(--bd); border-radius:11px; padding:12px 13px; background:var(--bg2); opacity:.5; }
.sf-fw.on { opacity:1; background:var(--white); border-color:color-mix(in srgb,var(--accent) 45%,var(--bd)); }
.sf-fw-hd { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:13.5px; color:var(--ink); }
.sf-fw-hd i { color:#16A34A; font-size:16px; }
.sf-fw-a { font-size:10.5px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; color:var(--ink-faint); margin:3px 0 6px; }
.sf-fw-s { font-size:11.5px; color:var(--ink-soft); line-height:1.45; }
.sf-fw-n { font-size:11px; color:var(--ink-faint); margin-top:6px; line-height:1.45; }

.sf-fwchecks { display:flex; flex-direction:column; gap:8px; }
.sf-fwcheck { display:flex; align-items:flex-start; gap:10px; padding:10px 12px; border:1px solid var(--bd); border-radius:10px;
  cursor:pointer; background:var(--white); transition:border-color .12s, background .12s; }
.sf-fwcheck:hover { border-color:var(--accent); }
.sf-fwcheck.on { border-color:var(--accent); background:var(--accent-bg); }
.sf-fwcheck input { width:16px; height:16px; margin-top:2px; accent-color:var(--accent); cursor:pointer; }
.sf-fwcheck b { font-size:13px; color:var(--ink); }
.sf-fwcheck-s { font-size:11.5px; color:var(--ink-soft); margin-top:2px; line-height:1.45; }

.sf-ct.done .co-ttl, .sf-ct.na .co-ttl { color:var(--ink-soft); }
.sf-ct.na  { opacity:.62; }
.sf-ct.overdue .co-num, .sf-ct.overdue .co-ttl { color:#B91C1C; }
.sf-cnote { font-size:11px; color:var(--ink-faint); margin-top:4px; display:flex; align-items:center; gap:4px; }
.sf-ref { font-size:10.5px; font-weight:650; color:var(--ink-faint); letter-spacing:.02em; margin-top:5px; }
.sf-ref.inline { display:inline; margin:0; padding:1px 5px; border-radius:4px; background:var(--bg2); border:1px solid var(--bd); }

.sf-standing { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:12px; }
.sf-duty { border:1px solid var(--bd); border-radius:11px; padding:13px 15px; background:var(--white); }
.sf-duty-h { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.sf-duty-h b { font-size:13px; color:var(--ink); line-height:1.35; }
.sf-cad { flex:0 0 auto; font-size:9.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  color:var(--ink-faint); background:var(--bg2); border:1px solid var(--bd); border-radius:5px; padding:2px 6px; white-space:nowrap; }
.sf-duty-s { font-size:12px; color:var(--ink-soft); margin-top:6px; line-height:1.5; }
.sf-duty-l { margin:8px 0 0; padding-left:17px; }
.sf-duty-l li { font-size:11.5px; color:var(--ink-faint); line-height:1.55; margin-bottom:3px; }

/* ── 811 ────────────────────────────────────────────────── */
.sf-lrow.warn td { background:rgba(245,158,11,.05); }
.sf-lrow.bad  td { background:rgba(220,38,38,.05); }

/* ── Guides ─────────────────────────────────────────────── */
.sf-guides { display:grid; grid-template-columns:repeat(auto-fill,minmax(232px,1fr)); gap:12px; }
.sf-guide { text-align:left; border:1px solid var(--bd); border-radius:12px; padding:16px; background:var(--white);
  cursor:pointer; display:flex; flex-direction:column; gap:6px; transition:border-color .12s, transform .12s, box-shadow .12s; }
.sf-guide:hover { border-color:var(--accent); transform:translateY(-2px); box-shadow:var(--shadow, 0 6px 18px rgba(0,0,0,.07)); }
.sf-guide-i { width:34px; height:34px; border-radius:9px; background:var(--accent-bg); color:var(--accent);
  display:flex; align-items:center; justify-content:center; font-size:18px; margin-bottom:2px; }
.sf-guide-t { font-size:14px; font-weight:700; color:var(--ink); line-height:1.35; }
.sf-guide-b { font-size:12px; color:var(--ink-soft); line-height:1.5; flex:1; }
.sf-guide-r { font-size:10.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-faint); }

.sf-guidelink { display:inline-flex; align-items:center; gap:6px; margin-top:12px; padding:7px 11px; border-radius:8px;
  background:var(--bg2); border:1px solid var(--bd); color:var(--accent); font-size:12px; font-weight:600; cursor:pointer; }
.sf-guidelink:hover { border-color:var(--accent); }
.sf-guidelink.inline { margin:0 0 0 6px; padding:3px 8px; font-size:11px; font-weight:600; vertical-align:middle; }

.sf-guide-body { font-size:13.5px; color:var(--ink-soft); line-height:1.65; }
.sf-gblurb { margin:0 0 14px; font-size:14px; color:var(--ink); font-weight:550; }
.sf-gsec { margin-bottom:16px; }
.sf-gsec h4 { margin:0 0 7px; font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--accent); }
.sf-gsec ul { margin:0; padding-left:19px; }
.sf-gsec li { margin-bottom:6px; }

.sf-disclaimer { display:flex; align-items:flex-start; gap:8px; margin-top:18px; padding:11px 13px; border-radius:10px;
  background:var(--bg2); border:1px solid var(--bd); font-size:11.5px; color:var(--ink-faint); line-height:1.55; }
.sf-disclaimer i { font-size:15px; flex:0 0 auto; margin-top:1px; }

@media (max-width:900px) {
  .sf-300a { grid-template-columns:1fr; }
  .sf-haz { grid-template-columns:1fr 60px 76px; }
  .sf-tabs { overflow-x:auto; flex-wrap:nowrap; }
  .sf-tab { white-space:nowrap; }
}

/* The 300A gets printed and posted. Print the report, not the application. */
@media print {
  .sf-tabs, .cd-head-r, .co-acts, .sf-guidelink, .sf-disclaimer { display:none !important; }
  .cd-panel, .co-tablewrap { border-color:#999; box-shadow:none; break-inside:avoid; }
  .sf-300a-row:nth-child(odd) { background:#f2f2f2; }
}