/* docs — styles owned by mod/docs.js (manuals, schematics and drawings on a
   machine, D44), used by the Docs tab and Admin -> Manuals and drawings.
   Tokens only, so both themes work. */

/* ---- a document row ---- */
.doc{display:flex; gap:11px; padding:12px 0; border-bottom:1px solid var(--line);}
.doc .ic{flex:none; width:30px; font-size:22px; line-height:1.2; text-align:center; margin-top:1px;}
.doc .dc{flex:1; min-width:0;}
.doc .dt{display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:15px; line-height:1.35;}
.doc .dt a{color:var(--text); text-decoration:none; font-weight:600; word-break:break-word;}
.doc .dt a:hover{color:var(--accent); text-decoration:underline;}
.doc .dm{font-family:var(--mono); font-size:11.5px; color:var(--muted); margin-top:3px; line-height:1.5; word-break:break-word;}
.doc .dn{font-size:13px; color:var(--text); margin-top:4px; line-height:1.45; opacity:.9;}
.doc .dacts{display:flex; flex-wrap:wrap; gap:7px; align-items:center; margin-top:9px;}
.doc .dacts a.small, .doc .dacts button.small{width:auto; min-height:30px; padding:5px 11px; font-size:12.5px;
  border-radius:var(--r-pill);}
.doc .dacts a.small{display:inline-flex; align-items:center; text-decoration:none; color:var(--text);
  background:var(--panel); border:1px solid var(--line);}
.doc .dacts a.small:hover{border-color:var(--accent); color:var(--accent);}

/* ---- the upload cards ---- */
.upform .upl{padding:10px 0; border-bottom:1px solid var(--line);}
.upl .uf{font-family:var(--mono); font-size:12px; color:var(--muted); word-break:break-word;}
.upl .ur{display:grid; grid-template-columns:1fr auto; gap:8px; margin-top:6px;}
.upl .ur input, .upl .ur select{margin:0;}
.upl .ur select{width:auto; min-width:140px;}
.upl .bar{height:8px; border-radius:var(--r-pill); background:var(--chrome); border:1px solid var(--line);
  overflow:hidden; margin-top:8px;}
.upl .bar .fill{height:100%; width:0; background:var(--accent); transition:width .15s;}
.upl .st{font-family:var(--mono); font-size:11.5px; color:var(--muted); margin-top:4px;}
.upl.done .st{color:var(--good);} .upl.done .bar .fill{background:var(--good);}
.upl.failed .st{color:var(--bad);} .upl.failed .bar .fill{background:var(--bad);}
.upl.busy .st{color:var(--accent);}
.modal .card:has(.upform), .modal .card:has(.upl){max-width:560px;}

/* ---- attached-machine chips in the edit form ----
   .dchip, not .chip: app-ui.css owns .chip/.chips for the map's floating
   target bar (position:absolute), which would pull these out of the form. */
.dchips{display:flex; flex-wrap:wrap; gap:6px; margin:0 0 8px;}
.dchip{display:inline-flex; align-items:center; gap:4px; padding:3px 4px 3px 10px; font-family:var(--mono); font-size:12.5px;
  border:1px solid var(--line); border-radius:var(--r-pill); background:var(--panel);}
.dchip button.x{width:22px; min-height:22px; padding:0; line-height:1; font-size:14px; border-radius:50%;
  background:transparent; border:0; color:var(--muted);}
.dchip button.x:hover{color:var(--bad); background:var(--chrome);}
.sugg{display:flex; flex-direction:column; gap:2px; margin-top:4px;}
.sugg .sg{display:flex; align-items:center; gap:6px; width:100%; min-height:34px; padding:6px 10px; text-align:left;
  font-size:13.5px; border-radius:var(--r-sm); background:var(--panel);}
.sugg .sg b{font-family:var(--mono);}
.sugg .sg .pill{margin-left:auto;}
.sugg .none{font-size:12.5px; color:var(--muted); padding:4px 2px;}

/* ---- Admin: the import command ---- */
pre.cmd{margin:6px 0 0; padding:10px 12px; font-family:var(--mono); font-size:12.5px; line-height:1.5;
  background:var(--chrome); border:1px solid var(--line); border-radius:var(--r-sm); white-space:pre-wrap; word-break:break-word;}