/* The machine's Safety tab and the printed lockout sheet (0058, port 6 round 2, the Safety wave).
   A REVIEW DUE line, a SAFETY pill and every state are words as well as a colour; the sheet is plain black on
   white. The lock log and inspections blocks (mod/safety/) bring their own rules in mod/safety.css. */
.loto h4{margin:16px 0 6px; font-size:13px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted);}
.loto-h{margin-top:0;}
.loto-review{margin:4px 0; font-size:14px;}
.loto-review.due{font-weight:700; color:var(--bad); border-left:4px solid var(--bad); padding-left:8px;}
.loto-by{margin:2px 0 6px;}
.loto-sources{display:flex; flex-direction:column; gap:8px;}
.loto-src{border:1px solid var(--line); border-left:4px solid var(--text); border-radius:var(--r-md); padding:10px 12px;
  font-size:15px; line-height:1.45; word-break:break-word;}
.loto-src-h{margin-bottom:4px;}
.loto-n{display:inline-block; min-width:22px; height:22px; line-height:22px; text-align:center; border-radius:11px;
  border:1px solid var(--line); font-size:12px; font-weight:700; margin-right:6px;}
.loto-k{font-weight:700;}
.loto-locks{font-size:15px; margin:12px 0 0;}
.loto-steps{margin:0; padding-left:24px; font-size:15px; line-height:1.5;}
.loto-steps li{margin:3px 0;}
.loto-text{white-space:pre-wrap; margin:0; font-size:15px; line-height:1.45; word-break:break-word;}
.loto-ppe{display:flex; flex-wrap:wrap; gap:6px;}
.loto-jobs{margin-top:22px;}
.loto-jobs .item{margin-bottom:10px;}
.loto-slot:empty{display:none;}
.loto-slot > *{margin-top:22px;}

/* the form */
.loto-form label{display:block; margin:10px 0 4px;}
.loto-form textarea{width:100%;}
.loto-erows{display:flex; flex-direction:column; gap:10px;}
.loto-erow{border:1px solid var(--line); border-radius:var(--r-md); padding:8px 12px 12px;}
.loto-erow-h{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.loto-erow-h label{margin:0;}
.loto-erow-h select{flex:1; min-width:140px;}
.loto-erow-h button{width:auto;}
.loto-form > button.small{margin-top:8px; width:auto;}
.loto-ppe-boxes{display:grid; grid-template-columns:repeat(auto-fill, minmax(190px, 1fr)); gap:0 12px;}
.loto-ppe-row{margin:0 !important; padding:6px 0; border:0;}

/* a picture of an isolation point */
.loto-pic{display:flex; align-items:center; gap:10px; margin-top:8px; padding:4px; width:auto; background:none;
  border:1px solid var(--line); border-radius:var(--r-md); font-size:13px; text-align:left;}
.loto-pic img{width:96px; height:72px; object-fit:cover; border-radius:4px; display:block;}
.loto-photo-field label{margin:10px 0 4px;}
.loto-photo-have{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:6px;}
.loto-photo-have img{width:120px; height:90px; object-fit:cover; border-radius:4px; border:1px solid var(--line);}
.loto-photo-have button{width:auto;}
.loto-remind .loto-read h4{margin:12px 0 4px;}

/* The printed sheet: built into #lotoPrint by mod/lockout.js and shown alone while html.loto-printing is on. */
#lotoPrint{display:none;}
@media print {
  html.loto-printing, html.loto-printing body{height:auto !important; overflow:visible !important; background:#fff !important; margin:0;}
  html.loto-printing body > *:not(#lotoPrint){display:none !important;}
  #lotoPrint{display:block; color:#000; font:12pt/1.35 Arial, Helvetica, sans-serif;}
  #lotoPrint .lp-head{display:flex; justify-content:space-between; gap:16px; border:3px solid #000; padding:10px 12px;}
  #lotoPrint .lp-kicker{font-size:18pt; font-weight:800; letter-spacing:.04em;}
  #lotoPrint .lp-no{font-size:26pt; font-weight:800;}
  #lotoPrint .lp-name{font-size:14pt; font-weight:600;}
  #lotoPrint .lp-meta{font-size:10pt; margin-top:4px;}
  #lotoPrint .lp-qr{width:1.5in; text-align:center; flex:none;}
  #lotoPrint .lp-qr svg{width:1.4in; height:1.4in; -webkit-print-color-adjust:exact; print-color-adjust:exact;}
  #lotoPrint .lp-qrcap{font-size:8pt;}
  #lotoPrint h3{font-size:13pt; margin:12px 0 4px; border-bottom:2px solid #000; text-transform:uppercase; color:#000; letter-spacing:.02em;}
  #lotoPrint th{color:#000; background:#fff;}
  #lotoPrint .lp-table{width:100%; border-collapse:collapse; font-size:10.5pt;}
  #lotoPrint .lp-table th, #lotoPrint .lp-table td{border:1px solid #000; padding:4px 6px; vertical-align:top; text-align:left;}
  #lotoPrint .lp-table td.n{font-weight:800; width:.3in;}
  #lotoPrint .lp-table td.pic{width:1.3in;}
  #lotoPrint .lp-table td.pic img{width:1.2in; height:.9in; object-fit:cover; display:block;}
  #lotoPrint ol{margin:0; padding-left:.3in;}
  #lotoPrint p{margin:0;}
  #lotoPrint tr, #lotoPrint li{break-inside:avoid;}
  #lotoPrint .lp-foot{margin-top:14px; font-size:8.5pt; border-top:1px solid #000; padding-top:4px;}
}
