/* Planogram v2.7 visual editor and secure promoter access */
main.wide{width:min(1580px,100%)}.access-grid{display:grid;grid-template-columns:minmax(270px,.8fr) minmax(370px,1.6fr);gap:14px}.user-list{max-height:620px;overflow:auto;display:grid;gap:7px;padding-top:10px}.user-entry{display:flex;align-items:center;justify-content:space-between;text-align:left;gap:12px;padding:12px;border:1px solid var(--border);background:#fff;border-radius:11px;color:var(--text);width:100%}.user-entry.chosen{border-color:var(--blue);background:#f0f6ff}.user-entry strong,.user-entry small{display:block}.user-entry small{overflow-wrap:anywhere}.form-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px}.toggle-line{display:flex;gap:9px;align-items:center;font-weight:700}.toggle-line input{width:18px;height:18px}.assignments{border:1px solid var(--border);border-radius:10px;max-height:370px;overflow:auto}.assign-group{border-bottom:1px solid var(--border)}.assign-group summary{padding:11px;cursor:pointer;background:#f7f9fd;font-weight:750}.assign-list{display:grid;grid-template-columns:1fr 1fr;padding:8px;gap:2px 12px}.assign-store{display:flex;align-items:start;gap:7px;font-size:12px;padding:6px;border-radius:7px}.assign-store:hover{background:#f2f7ff}.assign-store input{margin-top:3px;flex:none}.access-login{width:min(430px,100%);margin:24px auto}.access-login .panel{padding:25px}.access-login .btn{width:100%}.account-info{background:#eef5ff;border:1px solid #cce0ff;border-radius:11px;padding:12px;display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:12px}.editor-filters{display:grid;grid-template-columns:1fr 1.6fr .8fr .75fr 1.5fr;gap:10px}.canvas-workspace{display:grid;grid-template-columns:minmax(180px,.68fr) minmax(380px,2.7fr) minmax(215px,1fr);gap:12px;align-items:start}.editor-tools .btn{margin-top:7px}.shape-buttons{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:10px}.shape-btn{border:1px solid var(--border);border-radius:10px;background:#f8fafd;color:#344d6e;padding:10px 6px;font-weight:700;font-size:12px;display:grid;justify-items:center;gap:5px}.shape-btn:hover{border-color:var(--blue)}.shape-btn .glyph{font-size:21px;line-height:1}.editor-stage{min-width:0}.canvas-scroll{overflow:auto;max-height:72vh;border:1px solid #dce5ee;border-radius:12px;background:#dbe5f1}.physical-canvas{position:relative;width:900px;aspect-ratio:3/2;background-color:#f8fafc;background-image:linear-gradient(#d9e4f150 1px,transparent 1px),linear-gradient(90deg,#d9e4f150 1px,transparent 1px);background-size:28px 28px;isolation:isolate}.physical-canvas img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:.63;pointer-events:none}.physical-canvas #fixturesLayer,.physical-canvas #positionsLayer{position:absolute;inset:0;pointer-events:none}.layout-object{position:absolute;pointer-events:auto;border:2px solid;display:flex;justify-content:center;align-items:center;flex-direction:column;gap:3px;text-align:center;border-radius:7px;padding:4px;cursor:grab;user-select:none;touch-action:none;overflow:hidden;box-shadow:0 3px 8px #0d2c401c;transform-origin:center}.layout-object:active{cursor:grabbing}.layout-object.fixture{background:#b2c8e762;border-color:#476c9b;color:#143456;z-index:2}.layout-object.fixture[data-kind="Island"],.layout-object.fixture[data-kind="Smart Home"]{background:#aff0d36e;border-color:#309f79}.layout-object.fixture[data-kind="End Cap"]{background:#f7d3b276;border-color:#ce7c32}.layout-object.fixture[data-kind="Soundbar Wall"]{background:#eac7f685;border-color:#9561b1}.layout-object.position{background:#ffffffef;border-color:#355eaa;color:#213f65;z-index:3;border-radius:7px}.layout-object.position.audio{background:#fff9e5;border-color:#ac843e}.layout-object.is-selected{outline:4px solid #3d8bff70;border-color:#095ad2;z-index:8}.layout-object .item-icon{font-size:15px;line-height:1}.layout-object strong{font-size:12px;line-height:1.2;max-width:100%;overflow-wrap:anywhere}.layout-object small{font-size:10px;color:inherit;white-space:normal;line-height:1.15}.canvas-watermark{position:absolute;top:48%;left:10%;right:10%;text-align:center;font-size:14px;color:#7f91a9;pointer-events:none}.canvas-footer{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:space-between;padding-top:10px}.canvas-footer.actions{border-top:1px solid var(--border);margin-top:10px}.legend{display:inline-flex;gap:5px;align-items:center;font-size:11px;color:#60758c}.legend-dot{width:10px;height:10px;border-radius:3px}.wall-key{background:#476c9b}.model-key{background:#355eaa}.selected-key{background:#3d8bff}.size-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.zoom-text{font-size:11px;color:var(--muted)}.editor-stage select#zoom{min-height:35px;border-radius:7px;border:1px solid var(--border);padding:5px}.auth-hide{display:none!important}.draft-tag{font-size:11px;color:#376b9c;background:#eef5ff;padding:5px 8px;border-radius:8px}.spatial-view{height:350px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#e6edf6;border-radius:13px;border:1px solid #d4e0ee}.spatial-inner{position:absolute;inset:0;background-color:#f8fafc;background-image:linear-gradient(#d9e4f14d 1px,transparent 1px),linear-gradient(90deg,#d9e4f14d 1px,transparent 1px);background-size:24px 24px}.spatial-item{position:absolute;transform-origin:center;overflow:hidden;text-align:center;font-size:10px;border:1.5px solid #6487af;background:#c6d7ec8c;border-radius:5px;display:flex;align-items:center;justify-content:center;padding:3px;flex-direction:column;line-height:1.2}.spatial-item.model{border-color:#315fbe;background:#ffffffed;font-weight:750}.spatial-item.selected{outline:3px solid #5b99fb}.spatial-item small{font-size:9px}.spatial-inner img{position:absolute;width:100%;height:100%;object-fit:contain;pointer-events:none;opacity:.6}.public-form-note{font-size:11px;color:var(--muted)}
@media(max-width:1250px){.canvas-workspace{grid-template-columns:minmax(160px,.7fr) minmax(400px,2fr)}.editor-properties{grid-column:1/-1;display:block}.editor-properties .stack{grid-template-columns:repeat(2,minmax(0,1fr))}.editor-filters{grid-template-columns:repeat(3,1fr)}}
@media(max-width:750px){.access-grid,.canvas-workspace{grid-template-columns:1fr}.form-pair{grid-template-columns:1fr}.assign-list{grid-template-columns:1fr}.editor-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.editor-filters>.field:last-child{grid-column:1/-1}.shape-buttons{grid-template-columns:repeat(5,minmax(90px,1fr));overflow:auto}.editor-tools .shape-buttons{overflow:auto}.editor-properties{grid-column:auto}.editor-properties .stack{grid-template-columns:1fr}.canvas-scroll{max-height:60vh}.spatial-view{height:300px}.editor-stage .toolbar{align-items:start}}

#konvaHost{position:absolute;inset:0;z-index:7}#konvaHost:empty{display:none}.physical-canvas.with-konva #fixturesLayer,.physical-canvas.with-konva #positionsLayer{display:none}.physical-canvas.with-konva .canvas-watermark{display:none}.konvajs-content{touch-action:none}.editor-tools,.editor-properties{min-width:0}.canvas-scroll{overscroll-behavior:contain}
@media(max-width:750px){.canvas-workspace{display:flex;flex-direction:column}.editor-stage{order:1;width:100%}.editor-tools{order:2;width:100%}.editor-properties{order:3;width:100%}.editor-filters{grid-template-columns:repeat(2,minmax(0,1fr))}}

.promoter-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.mode-card{border:1px solid #cfdef0;background:#f7faff;border-radius:13px;min-height:88px;padding:13px;text-align:left;cursor:pointer;color:#214367;display:flex;flex-direction:column;gap:8px}.mode-card strong{font-size:14px}.mode-card small{font-size:12px;line-height:1.4}.mode-card.chosen{border-color:#2565b2;background:#e9f3ff}.source-actions{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.editor-source{margin-bottom:12px}.editor-source .row{gap:12px}
@media(max-width:750px){.promoter-actions{grid-template-columns:1fr}.mode-card{min-height:65px;padding:12px}.mode-card small{font-size:12px}.source-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.source-actions .btn{width:100%;padding:10px 4px;white-space:normal}}

[hidden]{display:none!important}

.hq-compare{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.hq-compare h3{margin:8px 0;font-size:15px}.hq-mini{padding:7px;border:1px solid #d6e2ef;border-radius:11px;min-height:150px}.mini-canvas{height:225px;position:relative;background:#f7faff;background-image:linear-gradient(#cbd9e452 1px,transparent 1px),linear-gradient(90deg,#cbd9e452 1px,transparent 1px);background-size:20px 20px;overflow:hidden;border-radius:8px;margin-bottom:8px}.mini-box{position:absolute;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#e0ecfa;border:1px solid #6f94c0;border-radius:4px;font-size:10px;overflow:hidden;text-align:center;line-height:1.2;padding:2px;z-index:2}.mini-model{background:#fff;border:2px solid #285aaa;z-index:3;font-weight:bold}.mini-box small{font-size:8px;font-weight:normal}@media(max-width:650px){.hq-compare{grid-template-columns:1fr}.mini-canvas{height:210px}}

/* v2.8.2: Current Planogram is model-only, based on approved geometry. */
body.model-only .editor-source,body.model-only .editor-tools,body.model-only #saveDraft,
body.model-only #loadApproved,body.model-only #publishLayout,body.model-only #publishActual,
body.model-only #layoutNotes,body.model-only .editor-properties>h3,
body.model-only #objectNameWrap,body.model-only #fixturePhotoWrap,
body.model-only #propertiesFields>.size-grid,body.model-only #objectRotation,
body.model-only #deleteObject,body.model-only #modelProperties>.field:nth-child(1),
body.model-only #modelProperties>.field:nth-child(2),
body.model-only #modelProperties>.field:nth-child(5),
body.model-only #modelProperties>.field:nth-child(6),
body.model-only #modelProperties>.field:nth-child(7){display:none!important}
body.model-only .canvas-workspace{grid-template-columns:minmax(0,2.4fr) minmax(240px,1fr)}
body.model-only .layout-object{cursor:pointer;touch-action:manipulation}
body.model-only .editor-properties{grid-column:auto}
body.model-only #modelProperties{gap:10px}
@media(max-width:1250px){body.model-only .canvas-workspace{grid-template-columns:minmax(0,1.8fr) minmax(260px,1fr)}}
@media(max-width:750px){body.model-only .canvas-workspace{display:flex;flex-direction:column}body.model-only .editor-properties{width:100%}}
#storeGate .btn{min-width:205px}#canvasWorkspace[hidden]{display:none!important}

body.model-only #propertiesFields>.field:has(#objectRotation),body.model-only .editor-properties>small{display:none!important}
body.model-only #storeGate .btn{background:#167759;color:#fff}
body.model-only .editor-stage .canvas-footer.actions{justify-content:flex-end}

/* v2.8.4: bulk promoter selection on the HQ account list */
.bulk-user-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:10px;padding:8px 10px;background:#f5f8fd;border:1px solid var(--border);border-radius:10px}
.bulk-select{display:inline-flex;gap:8px;align-items:center;font-size:12px;font-weight:750;color:var(--text);cursor:pointer}
.bulk-select input,.user-select input{width:17px;height:17px;accent-color:#275be8;cursor:pointer}
.selection-count{font-size:12px;font-weight:750;color:#4d6582;margin-left:auto}
.user-list-item{display:flex;align-items:stretch;gap:6px;padding:5px;border:1px solid var(--border);border-radius:11px;background:white;transition:background .15s,border-color .15s}
.user-list-item.chosen{border-color:#6999e4}
.user-list-item.is-marked{background:#eef5ff;border-color:#739cea}
.user-select{display:flex;align-items:center;justify-content:center;padding:0 7px;cursor:pointer}
.user-list-item .user-entry{border:0;background:transparent;flex:1;min-width:0;padding:8px 5px}
.user-list-item .user-entry.chosen{background:transparent}
.bulk-user-actions{margin-top:12px;display:flex;justify-content:flex-end}
.bulk-user-actions .btn{min-width:170px}
.bulk-user-actions .btn:disabled{opacity:.48;cursor:not-allowed}
@media(max-width:750px){.bulk-user-toolbar{gap:8px}.selection-count{margin-left:0}.bulk-user-actions .btn{width:100%}}

.request-history-toggle{display:flex;align-items:center;gap:8px;margin:4px 0 12px;font-size:12px;color:var(--muted)}
.request-history-toggle input{accent-color:#275be8;width:16px;height:16px}

/* v2.8.9: prioritize full model codes over decorative icons at small box sizes. */
.layout-object.position strong,.spatial-item.model strong{overflow:visible;white-space:pre-line;word-break:break-all;overflow-wrap:anywhere;text-overflow:clip;max-width:100%;font-weight:700;line-height:1.12}
.layout-object.position{gap:1px;padding:2px}
.layout-object.position .item-icon[hidden],.layout-object.position small[hidden]{display:none!important}

/* v2.9.3 Pending request status is a highlight, not an approved change. */
.spatial-item.model.pending-model{background:#fff2b8!important;border:2px solid #d4a23d!important;color:#443006!important}
.spatial-item.model.pending-model small{color:#a66909!important;font-weight:800!important}
.spatial-item.model.model-updated{background:#fff2b8!important;border:2px solid #d4a23d!important}
.spatial-item.model.model-updated.match strong{color:#098044!important}
.spatial-item.model.model-updated.mismatch strong{color:#c12734!important}
.request-visual{background:#f8fbff;border:1px solid #d4e2f3;border-radius:11px;padding:12px;margin-top:12px}
.request-visual img{display:block;width:100%;height:auto;border-radius:8px;border:1px solid #dae3ef}
.request-visual-footer{display:flex;gap:9px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:10px 0 0}
.request-visual-footer small{color:#61758e}
.request-visual .btn{min-height:35px}
/* Full-width in-context office review drawing */
.request-visual{flex:1 0 100%;width:100%;min-width:0}

.drawing-status-legend{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12px;color:#536981;margin:7px 0 12px;min-height:22px}
.status-swatch{display:inline-block;width:13px;height:13px;border:1.5px solid;flex:none;border-radius:3px;vertical-align:middle}
/* HQ canvas editing carries the same Current Planogram status colours. */
.layout-object.position.model-updated{background:#fff2b8!important;border-color:#d4a23d!important}
.layout-object.position.model-updated.match strong{color:#098044!important}
.layout-object.position.model-updated.mismatch strong{color:#c12734!important}

/* v2.9.4 model-change workflow: no green current highlights. */
.spatial-item.model.model-updated.match{background:#ffffffed!important;border-color:#315fbe!important}
.spatial-item.model.model-updated.match strong{color:#173751!important}
.spatial-item.model strong{white-space:nowrap!important;overflow:hidden;text-overflow:clip;word-break:normal;line-height:1}
.spatial-pending-callout{position:absolute;z-index:7;display:flex;align-items:center;justify-content:center;gap:5px;border:2px solid #e58b23;border-radius:7px;background:#ffe0b3;color:#8c3b03;padding:4px 6px;min-height:23px;box-shadow:0 3px 6px #593b1133;pointer-events:none}
.spatial-pending-callout strong{font-family:Calibri,Arial,sans-serif;display:block;font-size:clamp(5px,1vw,11px);font-weight:800;white-space:nowrap;min-width:0;overflow:hidden;text-overflow:clip}
.spatial-pending-callout svg{flex-shrink:0}
.office-pair-card{background:#fff;border:1px solid #dbe4f1;border-radius:15px;padding:15px;margin-bottom:12px;box-shadow:0 3px 14px rgba(33,56,84,.035)}
.office-pair-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.office-pair-head h3{font-size:17px;margin:2px 0 4px}.office-pair-head small{font-size:11px}
.office-comparison{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.9fr);gap:12px}
.office-preview{min-width:0;background:#f9fbff;border:1px solid #dae4f2;border-radius:12px;padding:10px}
.office-preview-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:7px}
.office-preview-head strong{font-size:12px}.office-preview-head small{font-size:11px}
.office-preview img{display:block;width:100%;aspect-ratio:1600/1070;object-fit:contain;border-radius:7px;background:#f5f8fc;border:1px solid #e2e8f2}
.office-preview .preview-empty{display:grid;place-items:center;min-height:100px;border-radius:7px;color:#677b94;font-size:12px;background:#f3f6fb;text-align:center;padding:10px}
.office-pair-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-end;margin-top:12px}
.office-pair-actions a,.office-pair-actions button{min-height:34px;padding:7px 11px;font-size:12px}
.office-legend{display:flex;gap:14px;align-items:center;flex-wrap:wrap;color:#4c627d;font-size:12px;margin:7px 0 14px}
.office-legend i{width:12px;height:12px;border-radius:3px;display:inline-block;vertical-align:middle;margin-right:5px;border:1px solid #c9b46b}
.office-export-mode{display:flex;align-items:center;gap:7px;color:#435a76;font-size:12px;font-weight:700}
.office-export-mode select{min-height:35px;padding:5px;border:1px solid #cbd9ec;border-radius:8px;background:#fff;color:#334f70}
@media(max-width:720px){.office-comparison{grid-template-columns:1fr}.office-pair-actions{justify-content:flex-start}.office-preview img{max-height:260px}.office-pair-head h3{font-size:15px}}

/* v2.9.5 HQ editor comparison: editable approved + small read-only current */
.hq-compare-workspace{display:block;min-width:0}
.hq-approved-work{min-width:0}
.hq-current-preview,.hq-status-legend,.hq-compare-heading{display:none}
body.hq-comparison .hq-compare-workspace{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(205px,.83fr);gap:12px;align-items:start}
body.hq-comparison .hq-current-preview{display:flex;flex-direction:column;gap:9px;background:#f8faff;border:1px solid #d8e4f2;border-radius:12px;padding:10px;min-width:0}
body.hq-comparison .hq-compare-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:7px;font-size:12px;color:#223f66}
.hq-compare-heading>span{font-size:10px;color:#72839b;text-align:right}
.hq-current-thumb{aspect-ratio:1600/1070;display:grid;place-items:center;background:#ecf3fa;border:1px solid #dce5f0;border-radius:9px;color:#6d7f97;text-align:center;font-size:12px;min-width:0;overflow:hidden}
.hq-current-thumb img{display:block;width:100%;height:auto;object-fit:contain}
.hq-current-thumb>span{padding:12px}
.hq-current-summary{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px;font-size:11px;color:#637792}
.hq-current-summary strong{color:#2e7656}
.hq-current-summary strong.unmatched{color:#bf2b38}
.hq-current-preview #hqEnlargeCurrent{align-self:stretch;min-height:36px}
.hq-current-help{font-size:11px;line-height:1.45;color:#6c7d94}
body.hq-comparison .hq-status-legend{display:flex;align-items:center;flex-wrap:wrap;gap:10px 16px;margin:10px 0 3px;font-size:11px;color:#4b6685}
.hq-status-legend>span{display:inline-flex;align-items:center;gap:6px}
.status-example{display:inline-flex;align-items:center;justify-content:center;border:2px solid;border-radius:5px;font:700 9px Calibri,Arial,sans-serif;padding:5px 7px;min-width:52px;white-space:nowrap;line-height:1}
.status-example.approved{background:#fff;border-color:#315fa8;color:#19406e}
.status-example.pending{background:#fff2b8;border-color:#c89520;color:#674501;border-style:dashed}
.status-example.proposed{background:#ffe0b3;border-color:#e6891d;color:#9c4500}
.status-example.mismatch{background:#fff3bf;border-color:#d35461;color:#bd2838}
.layout-object.position.pending-request{background:#fff2b8!important;border:2px dashed #c89520!important;color:#674501!important}
.layout-object.position.pending-request strong{color:#674501!important}
.hq-editor-pending{position:absolute;z-index:11;pointer-events:none;border:2px solid #e6891d;background:#ffe0b3;border-radius:5px;color:#934004;display:flex;align-items:center;gap:3px;padding:2px 4px;box-shadow:0 2px 5px #4c361233;min-width:55px;font-size:10px;white-space:nowrap;overflow:hidden}
.hq-editor-pending b{display:block;white-space:nowrap;text-overflow:clip;overflow:hidden;font-size:inherit}
@media(max-width:1250px){body.hq-comparison .hq-compare-workspace{grid-template-columns:minmax(0,1.5fr) minmax(200px,.85fr)}}
@media(max-width:820px){body.hq-comparison .hq-compare-workspace{grid-template-columns:1fr}body.hq-comparison .hq-current-preview{max-width:none}.hq-current-thumb{max-height:270px}.hq-current-thumb img{height:100%}}

/* HQ keeps a single planning screen: source-switching controls are promoter-only. */
body.hq-comparison .editor-source{display:none!important}
body.hq-comparison .hq-status-legend{gap:10px 15px;font-size:12px}
body.hq-comparison .status-example{font-size:10px;padding:6px 8px}