/* ============================================================
   AerialQuote DeckIQ — the patio designer (dqPt*), 1 Nov 2026. It wears the shed designer's card and board styles
   (deckiq-shed.css: dqSh*, the --sh* board tokens for Drafting / Blueprint / CAD); this file adds only the patio's own parts.
   ============================================================ */
/* ---- patio mode: the deck's own board tools step aside, as in shed mode ---- */
#iq.dqPatioOn .iqTileCol [data-act]:not([data-act="undo"]):not([data-act="redo"]):not([data-act="3d"]),
#iq.dqPatioOn .iqTileCol .tileDiv, #iq.dqPatioOn #iqBViewSeg, #iq.dqPatioOn #iqTapeBtn, #iq.dqPatioOn #iqEditBar, #iq.dqPatioOn #iqBoardTip,
#iq.dqPatioOn .iqBoardBox .iqZoom, #iq.dqPatioOn #iqBoardStamp, #iq.dqPatioOn #iqPill, #iq.dqPatioOn #iq3dDims, #iq.dqPatioOn #iq3dChips, #iq.dqPatioOn #iq3dConn, #iq.dqPatioOn #iqFixCard, #iq.dqPatioOn #iqSelCard, #iq.dqPatioOn #iqSideCard{display:none !important}

/* ---- the cards ---- */
.dqPtChips{display:flex; flex-wrap:wrap; gap:6px; margin:2px 0 8px}
.dqPtChips button{border:1.5px solid var(--line-2, #ccd); background:var(--panel, #fff); color:var(--ink-2, #334); border-radius:99px; padding:6px 11px; font:600 13px/1.1 Figtree, sans-serif; cursor:pointer}
.dqPtChips button[aria-pressed="true"]{border-color:#2F6BFF; color:#2F6BFF; box-shadow:0 0 0 2px rgba(47,107,255,.2)}
.dqPtSw{display:block; width:100%; height:42px; border-radius:7px; overflow:hidden; margin-bottom:4px; border:1px solid var(--line-2, #ccd)}
.dqPtSw svg{display:block; width:100%; height:100%}
.dqShTile{position:relative}
.dqPtW{position:absolute; top:5px; right:5px; font:700 10.5px/1 'JetBrains Mono', ui-monospace, monospace; padding:3px 5px; border-radius:6px; background:var(--panel, #fff); color:var(--ink-2, #334); border:1px solid var(--line-2, #ccd)}
.dqPtSec{border:1px solid var(--line-2, #ccd); border-radius:10px; padding:6px; margin:6px 0 8px; background:var(--panel, #fff)}
.dqPtSec svg{display:block; width:100%; height:auto; font:600 10.5px Figtree, sans-serif}
.dqPtSec text{fill:var(--ink, #111)} .dqPtSec text.am{fill:#B25E00} .dqPtSec text.c{fill:#0A6FA3} .dqPtSec text.hs{fill:var(--ink-3, #667); font-size:8.5px; letter-spacing:.1em}
.dqPtSec text.mono{font:700 10px 'JetBrains Mono', ui-monospace, monospace}
.dqPtL{stroke:rgba(100,110,130,.55); stroke-width:.6}
.dqPtL.sf{fill:#A89580} .dqPtL.bd{fill:#D9C493} .dqPtL.bs{fill:#9AA1AE} .dqPtL.sl{fill:#8A7058; opacity:.45}
.dqPtHs{fill:rgba(128,128,128,.14); stroke:var(--ink-3, #667); stroke-width:.8}
.dqPtFab{stroke:#B25E00; stroke-width:1.6; stroke-dasharray:5 3}
.dqPtFall{stroke:#0A6FA3; stroke-width:1; stroke-dasharray:4 3}
.dqPtDims{display:flex; gap:12px; flex-wrap:wrap; margin:6px 0 8px; font-size:13px}
.dqPtDims input{width:68px; font:600 15px/1.2 'JetBrains Mono', ui-monospace, monospace; padding:5px 6px; border-radius:8px; border:1.5px solid var(--line-2, #ccd); background:var(--panel, #fff); color:var(--ink, #111)}
.dqPtCols{display:flex; flex-wrap:wrap; gap:6px; margin-bottom:8px}
.dqPtCols button{display:flex; align-items:center; gap:6px; border:1.5px solid var(--line-2, #ccd); background:var(--panel, #fff); color:var(--ink-2, #334); border-radius:99px; padding:4px 10px 4px 4px; font:600 12.5px Figtree, sans-serif; cursor:pointer}
.dqPtCols button[aria-pressed="true"]{border-color:#2F6BFF; color:#2F6BFF}
.dqPtCols i{width:20px; height:20px; border-radius:50%; border:1px solid rgba(0,0,0,.2)}
.dqPtEdge{display:grid; grid-template-columns:auto 1fr auto; gap:8px; align-items:center; padding:6px 0; border-bottom:1px solid var(--line, #e3e6ec); font-size:13px}
.dqPtEdge i{font:700 11px/1 'JetBrains Mono', ui-monospace, monospace; font-style:normal; width:24px; height:24px; border-radius:50%; display:grid; place-items:center; border:1.5px solid #0A6FA3; color:#0A6FA3}
.dqPtEdge i.h{border-style:dashed; border-color:var(--ink-3, #667); color:var(--ink-3, #667)}
.dqPtEdge select{font:600 12.5px Figtree, sans-serif; padding:5px 6px; border-radius:8px; border:1.5px solid var(--line-2, #ccd); background:var(--panel, #fff); color:var(--ink, #111); max-width:180px}
.dqPtMoney{font:700 13px/1 'JetBrains Mono', ui-monospace, monospace}
.dqPtMoney.add{color:#C42746} .dqPtMoney.save{color:#0B8457}

/* ---- the board ---- */
.dqPtField{stroke:none}
.dqPtOther{opacity:.55; stroke:var(--shMute); stroke-width:1.2; cursor:pointer}
.dqPtJoint{stroke:rgba(0,0,0,.45); stroke-width:1.2; stroke-dasharray:6 4}
.dqPtEdgeLn{stroke-width:3; stroke-linecap:round}
.dqPtEdgeLn.plastic{stroke:var(--shAcc)} .dqPtEdgeLn.alu{stroke:var(--shAcc); stroke-width:4.5} .dqPtEdgeLn.toe{stroke:var(--shMute); stroke-width:5}
.dqPtEdgeLn.house{stroke:var(--shMute); stroke-width:2; stroke-dasharray:7 5}
.dqPtWall{fill:#8F8378; stroke:var(--shInk); stroke-width:1.2}
.dqPtStep{stroke:var(--shAcc); stroke-width:1.4; cursor:ew-resize}
.dqPtFire{fill:rgba(255,140,40,.25); stroke:var(--shAmber); stroke-width:3; cursor:grab}
.dqPtFire.warn{stroke:var(--shBad)}
.dqPtFireLn{stroke:var(--shAmber); stroke-width:1.4; stroke-dasharray:5 4}
.dqPtArrow{stroke:var(--shAcc); stroke-width:1.8}
.dqPtArH{fill:var(--shAcc)}
.dqPtLbl, .dqPtDim{font:700 11.5px/1 'JetBrains Mono', ui-monospace, monospace; fill:var(--shInk); paint-order:stroke; stroke:var(--shBg); stroke-width:3.5px; stroke-linejoin:round; pointer-events:none}
.dqPtLbl.c{fill:var(--shAcc)} .dqPtLbl.sm{font-size:9.5px; fill:#fff; stroke:#5E544A; stroke-width:2.5px} .dqPtLbl.am{fill:var(--shAmber)}
.dqPtNum{cursor:pointer} .dqPtNum circle{fill:var(--shBg); stroke:var(--shAcc); stroke-width:1.6} .dqPtNum text{font:700 11px 'JetBrains Mono', ui-monospace, monospace; fill:var(--shAcc); pointer-events:none}
.dqPtNum.h circle{stroke:var(--shMute); stroke-dasharray:3 2} .dqPtNum.h text{fill:var(--shMute)}
.dqPtCorner{fill:var(--shBg); stroke:var(--shAcc); stroke-width:2.2; cursor:move}
.dqPtCorner.sel{fill:var(--shAcc)}
.dqPtBoard svg{cursor:grab}

/* ---- the header total: this project's number, the whole yard on hover ---- */
.dqTotYard{margin:0 0 8px; border-bottom:1px solid var(--line, #e3e6ec); padding-bottom:6px}
.dqTotYard td:first-child{font-weight:600}
.dqTotYard tr.on td{color:#2F6BFF}

/* ---- the phone: switch between the designs on this yard ---- */
.dqPhTypes{display:none}
@media (max-width:1000px){
  .dqPhTypes{display:flex; gap:6px; margin:8px 12px 4px; padding:4px; border-radius:12px; background:var(--panel, #fff); border:1.5px solid var(--line-2, #ccd)}
  .dqPhTypes button{flex:1; display:flex; align-items:center; justify-content:center; gap:6px; min-height:40px; border:0; border-radius:9px; background:transparent; color:var(--ink-2, #334); font:700 14px Figtree, sans-serif; cursor:pointer}
  .dqPhTypes button svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
  .dqPhTypes button[aria-pressed="true"]{background:#2F6BFF; color:#fff}
}

/* ---- 2 Nov (20261102b): Add to the patio: the library's picture tiles, the items on the board ---- */
.dqPtLib{display:grid; grid-template-columns:repeat(3, 1fr); gap:6px; margin:2px 0 10px}
.dqPtLibT{display:flex; flex-direction:column; align-items:center; gap:2px; border:1.5px solid var(--line-2, #ccd); background:var(--panel, #fff); color:var(--ink, #111); border-radius:10px; padding:5px 4px 6px; cursor:pointer; min-width:0}
.dqPtLibT:hover{border-color:#2F6BFF}
.dqPtLibT img{width:100%; max-width:84px; aspect-ratio:1; object-fit:contain; pointer-events:none}
.dqPtLibT b{font:700 11.5px/1.15 Figtree, sans-serif; text-align:center}
.dqPtLibT small{font:600 10.5px/1 'JetBrains Mono', ui-monospace, monospace; color:var(--ink-3, #667)}
.dqPtPanel .dqShRow + .dqShRow{margin-top:5px}
.dqPtIt{cursor:move}
.dqPtIt.over image{opacity:.62}
.dqPtItBox{fill:transparent; stroke:none}
.dqPtIt.sel .dqPtItBox{stroke:var(--shAcc); stroke-width:1.6; stroke-dasharray:5 3}
.dqPtIt.warn .dqPtItBox{stroke:var(--shAmber); stroke-width:2.2}
.dqPtIt.bad .dqPtItBox{stroke:var(--shBad); stroke-width:2.6}
.dqPtItClr{fill:none; stroke:var(--shAcc); stroke-width:1.2; stroke-dasharray:4 4; opacity:.8}
.dqPtFire{fill:transparent; stroke:none; cursor:grab}
.dqPtFire.warn{stroke:var(--shBad); stroke-width:2.4; stroke-dasharray:6 3}
