/* Field Hub — Tool Belt (operational / safety forms) shared styles.
   Pair with worksafe.js. Uses the app palette from theme.css where present. */
:root{
  --ws-bg:#f2f0eb; --ws-card:#f3f5ef; --ws-header:#34622b; --ws-header2:#2a4f22;
  --ws-accent:#34622b; --ws-fill:#7fae4f; --ws-ink:#1a1a14; --ws-muted:#566150;
  --ws-line:#cdd6c5; --ws-good:#4a8a3f; --ws-warn:#c97b22; --ws-bad:#b23b3b;
  --ws-radius:8px; --ws-sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0}
body{background:var(--ws-bg);color:var(--ws-ink);font-family:var(--ws-sans);font-size:14px;line-height:1.5;
  padding:env(safe-area-inset-top) env(safe-area-inset-right) 0 env(safe-area-inset-left)}

.ws-app{position:sticky;top:0;z-index:50;background:var(--ws-header);border-bottom:3px solid var(--ws-fill);
  box-shadow:0 3px 12px rgba(0,0,0,.28);padding:10px 14px calc(10px) }
.ws-app .row1{display:flex;align-items:center;gap:10px}
.ws-app .back{color:#cfe3bf;text-decoration:none;font-size:.86rem;font-weight:600;white-space:nowrap}
.ws-app h1{margin:0;font-size:1.12rem;font-weight:800;color:#eef3e6;flex:1;letter-spacing:-.01em}
.ws-app .sub{margin-top:8px;width:100%;border:1px solid #4f7d43;background:#2c5424;color:#eef3e6;
  border-radius:6px;padding:8px 10px;font-size:.9rem}
.ws-app .sub::placeholder{color:#a9c79b}
.ws-status{font-size:.72rem;color:#bcd6ac;margin-top:7px}
.ws-tools{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}
.ws-tools button{flex:1 1 auto;min-width:72px;border:1px solid #4f7d43;background:#3a6b30;color:#eef3e6;
  border-radius:6px;padding:8px 6px;font-size:.78rem;font-weight:600;cursor:pointer}
.ws-tools button.primary{background:var(--ws-fill);border-color:var(--ws-fill);color:#1d3416}
.ws-tools button:active{transform:scale(.98)}

main{max-width:780px;margin:0 auto;padding:16px 14px 36px}
.ws-sec{background:var(--ws-card);border:1px solid var(--ws-line);border-radius:var(--ws-radius);
  margin:0 0 14px;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,.10)}
.ws-sec>h2{margin:0;background:#eaf0e4;color:var(--ws-accent);font-size:.96rem;font-weight:800;
  padding:10px 14px;border-bottom:1px solid var(--ws-line)}
.ws-sec .body{padding:12px 14px}
.ws-note{font-size:.78rem;color:var(--ws-muted);margin:-2px 0 12px}

.ws-field{margin:0 0 13px}
.ws-field:last-child{margin-bottom:0}
.ws-field>label{display:block;font-size:.82rem;font-weight:700;color:var(--ws-ink);margin:0 0 5px}
.ws-field .hint{font-weight:400;color:var(--ws-muted);font-size:.76rem}
input[type=text],input[type=number],input[type=date],input[type=time],input[type=datetime-local],
select,textarea{width:100%;border:1px solid var(--ws-line);border-radius:6px;padding:9px 11px;font-size:.92rem;
  color:var(--ws-ink);background:#fff;font-family:inherit}
textarea{min-height:64px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--ws-accent);box-shadow:0 0 0 2px rgba(52,98,43,.15)}
.ws-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px 12px}

/* Segmented Yes/No/NA (radio pills) */
.ws-seg{display:inline-flex;flex-wrap:wrap;gap:6px}
.ws-seg label{position:relative;cursor:pointer}
.ws-seg input{position:absolute;opacity:0;pointer-events:none}
.ws-seg span{display:inline-block;border:1px solid var(--ws-line);background:#fff;border-radius:20px;
  padding:7px 15px;font-size:.84rem;font-weight:600;color:var(--ws-muted)}
.ws-seg input:checked+span{background:var(--ws-accent);border-color:var(--ws-accent);color:#fff}
.ws-seg.yn input[value="No"]:checked+span,.ws-seg.yn input[value="NONE"]:checked+span{background:var(--ws-bad);border-color:var(--ws-bad)}
.ws-seg.yn input[value="N/A"]:checked+span,.ws-seg.yn input[value="NA"]:checked+span{background:#7a7f73;border-color:#7a7f73}

/* Checkbox grid (PPE, tasks) */
.ws-checks{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.ws-checks label{display:flex;align-items:center;gap:8px;border:1px solid var(--ws-line);background:#fff;
  border-radius:6px;padding:9px 11px;font-size:.86rem;cursor:pointer}
.ws-checks input{width:18px;height:18px;accent-color:var(--ws-accent);flex:0 0 auto}
.ws-checks label:has(input:checked){background:#eef5e8;border-color:var(--ws-fill)}

/* Repeatable rows */
.ws-list{display:flex;flex-direction:column;gap:12px}
.ws-row{border:1px solid var(--ws-line);border-radius:7px;padding:11px 12px;background:#fbfcfa;position:relative}
.ws-row .ws-row-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.ws-row .ws-row-head b{font-size:.8rem;color:var(--ws-accent)}
.ws-row .ws-del{border:1px solid var(--ws-line);background:#fff;color:var(--ws-bad);border-radius:6px;
  padding:4px 10px;font-size:.74rem;font-weight:600;cursor:pointer}
.ws-add{margin-top:11px;border:1px dashed var(--ws-accent);background:#eef5e8;color:var(--ws-accent);
  border-radius:7px;padding:10px;width:100%;font-size:.86rem;font-weight:700;cursor:pointer}

/* Signature pad */
.ws-sign-wrap{border:1px solid var(--ws-line);border-radius:6px;background:#fff;position:relative}
.ws-sign{display:block;width:100%;height:120px;border-radius:6px;touch-action:none}
.ws-sign-clear{position:absolute;top:6px;right:8px;border:1px solid var(--ws-line);background:#fff;color:var(--ws-muted);
  border-radius:5px;padding:3px 9px;font-size:.72rem;cursor:pointer}
.ws-sign-meta{display:flex;gap:8px;align-items:center;margin-top:6px}
.ws-stamp{border:1px solid var(--ws-line);background:#fff;border-radius:6px;padding:6px 12px;font-size:.78rem;
  font-weight:600;color:var(--ws-accent);cursor:pointer}
.ws-stamp-t{font-size:.78rem;color:var(--ws-muted)}

/* Photo */
.ws-photo input{font-size:.8rem}
.ws-photo img{max-width:120px;max-height:120px;border-radius:6px;border:1px solid var(--ws-line);margin-top:7px;display:block}

.ws-toast{position:fixed;left:50%;bottom:78px;transform:translateX(-50%);background:#1d3416;color:#eef3e6;
  padding:10px 18px;border-radius:24px;font-size:.84rem;font-weight:600;opacity:0;pointer-events:none;
  transition:opacity .2s;z-index:4000;box-shadow:0 4px 16px rgba(0,0,0,.3)}
.ws-toast.show{opacity:1}

@media print{
  .ws-app .tools,.ws-tools,.back,.ws-status,.ws-add,.ws-del,.ws-sign-clear,.ws-stamp,#fh-tabbar{display:none !important}
  body{background:#fff;padding:0}
  .ws-app{position:static;box-shadow:none;background:#34622b;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .ws-sec{break-inside:avoid;box-shadow:none}
  main{max-width:none;padding:10px}
}

/* Other-reveal, conditional fields, examples, required marker */
.ws-other{margin-top:7px}
.req{color:#b23b3b;font-weight:800;margin-left:2px}
.ws-ex{margin:6px 0 0;border:1px solid var(--ws-line);border-radius:6px;background:#f7f9f4}
.ws-ex>summary{cursor:pointer;padding:7px 11px;font-size:.78rem;font-weight:700;color:var(--ws-muted)}
.ws-ex .ex-body{padding:0 12px 10px;font-size:.78rem;color:var(--ws-muted);white-space:pre-line}
.ws-sub-h{font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ws-muted);font-weight:700;margin:2px 0 9px}