/* ═══════════════════════════════════════════════════════════════════════════
   permits-board.css — HS3 live permit-to-work board (Reactor voice).
   NEW standalone asset. Tokens-only: every colour/size resolves to a var(--kh-*)
   from tokens.css (the constitution). The ONE fallback block below is the sole place
   raw hex is permitted (per the build contract) — it only bites if tokens.css failed
   to load, so the board never renders unstyled/black-on-black. Mount inside a
   data-surface="void" container (the operator voice). Money-free surface — no £ ever.
   ═══════════════════════════════════════════════════════════════════════════ */

/* fallback block — mirrors tokens.css values 1:1 so a missing constitution degrades
   gracefully, never to raw white. Remove at integration if tokens.css is guaranteed. */
.kh-permits{
  --_void-2:var(--kh-void-2);
  --_void-3:var(--kh-void-3);
  --_card:var(--kh-card);
  --_ink:var(--kh-ink);
  --_ink-dim:var(--kh-ink-dim);
  --_gold:var(--kh-gold-1);
  --_gold-deep:var(--kh-gold-0);
  --_gold-ink:var(--kh-gold-ink);
  --_line:var(--kh-line);
  --_ok:var(--kh-ok);
  --_warn:var(--kh-warn);
  --_crit:var(--kh-crit);
  --_r1:var(--kh-r-1);
  --_r2:var(--kh-r-2);
  --_mono:var(--kh-font-mono);
  --_ui:var(--kh-font-ui);
  --_swift:var(--kh-swift);
  --_t2:var(--kh-t-2);
  color:var(--_ink);
  font-family:var(--_ui);
  min-height:0;            /* khmod pane rule — lets the flex/grid child scroll */
}

.kh-permits__head{
  display:flex;align-items:baseline;justify-content:space-between;gap:var(--kh-s-3);
  margin:0 0 var(--kh-s-4);
}
.kh-permits__eyebrow{
  font-family:var(--_mono);font-weight:500;font-size:var(--kh-fs-11);
  letter-spacing:var(--kh-mono-track);text-transform:uppercase;color:var(--_gold);
}
.kh-permits__count{
  font-family:var(--_mono);font-weight:500;font-size:var(--kh-fs-12-5);
  color:var(--_ink-dim);font-variant-numeric:tabular-nums;
}

.kh-permits__grid{display:flex;flex-direction:column;gap:var(--kh-s-3);}

.kh-permit-card{
  background:var(--_card);border:1px solid var(--_line);border-radius:var(--_r2);
  padding:var(--kh-s-4);transition:border-color var(--_t2) var(--_swift);
}
.kh-permit-card:hover{border-color:var(--_gold-deep);}
.kh-permit-card__top{
  display:flex;align-items:center;justify-content:space-between;gap:var(--kh-s-2);
  margin:0 0 var(--kh-s-2);
}
.kh-permit-card__job{
  font-family:var(--_mono);font-weight:500;font-size:var(--kh-fs-14);
  color:var(--_ink);letter-spacing:.02em;
}
.kh-permit-card__provider{color:var(--_ink-dim);font-weight:400;}

.kh-permit-row{
  display:flex;align-items:center;justify-content:space-between;gap:var(--kh-s-2);
  padding:var(--kh-s-2) 0;border-top:1px solid var(--_line);
}
.kh-permit-row__label{font-size:var(--kh-fs-13);color:var(--_ink);min-width:0;}
.kh-permit-row__meta{
  font-family:var(--_mono);font-size:var(--kh-fs-11);color:var(--_ink-dim);
}

/* chips — grey never green; rust is DANGER ONLY (expired / fire-watch overdue) */
.kh-chip{
  display:inline-block;padding:1px 8px;border-radius:var(--kh-r-pill);
  font-family:var(--_ui);font-weight:600;font-size:var(--kh-fs-11);line-height:1.7;
  white-space:nowrap;border:1px solid transparent;
}
.kh-chip--risk  {background:rgba(176,67,46,.14); color:var(--_crit); border-color:rgba(176,67,46,.4);}
.kh-chip--warn  {background:rgba(194,135,44,.14);color:var(--_warn); border-color:rgba(194,135,44,.4);}
.kh-chip--active{background:rgba(198,161,76,.14);color:var(--_gold); border-color:var(--_line);}
.kh-chip--clear {background:rgba(138,147,165,.12);color:var(--_ink-dim);border-color:rgba(138,147,165,.3);}

/* fire-watch countdown — the hero mono numeral, tabular so it never jitters */
.kh-firewatch{
  display:flex;align-items:center;gap:var(--kh-s-2);
  font-family:var(--_mono);font-variant-numeric:tabular-nums;
}
.kh-firewatch__time{font-size:var(--kh-fs-17);font-weight:500;color:var(--_gold);}
.kh-firewatch--overdue .kh-firewatch__time{color:var(--_crit);}
.kh-firewatch--cleared .kh-firewatch__time{color:var(--_ok);}
.kh-firewatch__ring{
  width:8px;height:8px;border-radius:var(--kh-r-pill);background:var(--_gold);
}
.kh-firewatch--overdue .kh-firewatch__ring{background:var(--_crit);}
.kh-firewatch--running .kh-firewatch__ring{animation:kh-pulse var(--kh-t-ambient) var(--_swift) infinite;}
@keyframes kh-pulse{0%,100%{opacity:1;}50%{opacity:.35;}}
@media (prefers-reduced-motion:reduce){.kh-firewatch--running .kh-firewatch__ring{animation:none;}}

.kh-permits__empty{
  padding:var(--kh-s-8) var(--kh-s-4);text-align:center;color:var(--_ink-dim);
  font-size:var(--kh-fs-14);border:1px dashed var(--_line);border-radius:var(--_r2);
}
.kh-permit-card__hold{
  font-family:var(--_mono);font-size:var(--kh-fs-11);color:var(--_ink-dim);
  margin-top:var(--kh-s-1);
}
.kh-permit-card__hold--unsigned{color:var(--_warn);}

/* O1 · integrator action strip. Rendered only when the host asks for it
   (paint(el, board, {actions:true})); the module itself never writes. `--blocked` is an
   HONEST label, not a disabled button: the SERVER owns the refusal (unsigned mandatory
   hold points; a fire watch not yet cleared), so the click still goes and the engine's
   own refusal text is what the operator reads. */
.kh-permit-row__acts{
  display:flex;flex-wrap:wrap;gap:var(--kh-s-2);margin-top:var(--kh-s-2);
}
.kh-permit-act{
  font-family:var(--_ui);font-weight:600;font-size:var(--kh-fs-11);line-height:1;
  padding:7px 11px;border-radius:var(--_r1);cursor:pointer;
  background:transparent;color:var(--_ink-dim);border:1px solid var(--_line);
  transition:border-color var(--_t2) var(--_swift),color var(--_t2) var(--_swift);
}
.kh-permit-act:hover{border-color:var(--_gold-deep);color:var(--_ink);}
.kh-permit-act--go{color:var(--_gold);border-color:var(--_gold-deep);}
.kh-permit-act--blocked{
  color:var(--_warn);border-color:rgba(194,135,44,.4);border-style:dashed;
}
.kh-permit-act--risk{color:var(--_crit);border-color:rgba(176,67,46,.5);}
.kh-permit-act:focus-visible{outline:2px solid var(--_gold);outline-offset:2px;}

.kh-permits__note{
  margin-top:var(--kh-s-4);font-family:var(--_ui);font-size:var(--kh-fs-11);
  line-height:1.55;color:var(--_ink-dim);
}