/* Unterlage (Bild/PDF/DXF), Mengen und Austauschformate – Bedienfelder und Zeichenflächen-Stile (js/underlay.js, js/quantities.js) */

/* Unterlage auf der Zeichenfläche */
#underlay { pointer-events: none; mix-blend-mode: multiply; }   /* weißes Papier wird durchsichtig, Linien bleiben – der Plan darunter bleibt lesbar */
.ul-dxf { fill: none; stroke-width: 1; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-linejoin: round; }
.ul-dxf-text { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }
#canvas.ul-move { cursor: move; }
#canvas.ul-pick { cursor: crosshair; }
.ul-pick-mark circle { fill: #e11d48; stroke: #fff; stroke-width: 2px; vector-effect: non-scaling-stroke; }
.ul-pick-mark text { fill: #e11d48; font-weight: 700; paint-order: stroke; stroke: #fff; stroke-width: 3px; vector-effect: none; }
.ul-pick-line { stroke: #e11d48; stroke-width: 1.5px; stroke-dasharray: 6 4; vector-effect: non-scaling-stroke; fill: none; }

/* Bedienfeld „Unterlage“ (wie das Sonnen-Feld der 3D-Ansicht) */
.ul-panel { position: absolute; top: 62px; left: 10px; z-index: 5; width: min(380px, calc(100% - 20px)); max-height: calc(100% - 80px); overflow-y: auto; background: rgba(255,255,255,0.97);
  border: 1px solid #d8dce2; border-radius: 10px; padding: 10px 12px; box-shadow: 0 4px 16px rgba(0,0,0,.12); display: grid; gap: 8px; font-size: 13px; }
.ul-panel[hidden] { display: none; }
.ul-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ul-body { display: grid; gap: 8px; }
.ul-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ul-row label.inline, .ul-info label.inline, .ul-layer-list label.inline, .ul-room-list label.inline { display: inline-flex; align-items: center; gap: 4px; }
.ul-row input[name=rot] { width: 4.5em; }
.ul-op { flex: 1; min-width: 160px; }
.ul-op input[type=range] { flex: 1; }
.ul-modes { display: flex; gap: 4px; flex-wrap: wrap; }
.ul-modes button { flex: 1; padding: 6px 8px; }
.ul-status { background: var(--accent-soft); border-radius: 6px; padding: 6px 8px; color: var(--text); }
.ul-len { display: flex; align-items: flex-end; gap: 8px; }
.ul-len label { flex: 1; display: flex; flex-direction: column; gap: 2px; color: var(--muted); }
.ul-info { color: var(--muted); word-break: break-word; }
.ul-layers summary { cursor: pointer; color: var(--muted); }
.ul-layer-list { display: grid; gap: 2px; max-height: 160px; overflow-y: auto; padding: 4px 0; }
.ul-sw { display: inline-block; width: 12px; height: 12px; border-radius: 3px; border: 1px solid #ccc; }
.ul-foot { justify-content: space-between; }
.ul-room-list { display: grid; gap: 4px; max-height: 50vh; overflow-y: auto; }
.ul-room-list input[name^=n] { width: 9em; }
@media (max-width: 900px) {
  .ul-panel { top: 56px; left: 8px; width: calc(100% - 16px); max-height: calc(100% - 130px); }
}

/* Mengen und Fensterliste */
.qt-dlg { max-width: min(96vw, 1100px); }
.qt-dlg .dlg { max-height: 86vh; overflow: hidden; }
.qt-tabs { display: flex; gap: 4px; flex-wrap: wrap; }
.qt-tabs button[aria-selected=true] { background: var(--accent-soft); border-color: var(--accent); color: var(--accent); }
.qt-body { overflow: auto; max-height: 56vh; border: 1px solid #e3e6ea; border-radius: 8px; }
.qt-body table { border-collapse: collapse; width: 100%; font-size: 13px; font-variant-numeric: tabular-nums; }
.qt-body th, .qt-body td { padding: 4px 8px; border-bottom: 1px solid #eceff2; text-align: left; white-space: nowrap; }
.qt-body th { position: sticky; top: 0; background: #f6f7f9; font-weight: 600; }
.qt-body td.num, .qt-body th.num { text-align: right; }
.qt-body tr.sum td { font-weight: 600; border-top: 1px solid #c9ced6; }
.qt-body tr.group td { background: #f6f7f9; font-weight: 600; }