/* ============================================================================
 * customizer/ux-overlay.css — Overlay-специфика поверх lyss/ux.css
 * ========================================================================== */

/* контуры contextual editing — только в редакторе, в OBS-вывод не попадают */
.ux-ol { position: absolute; left: 0; top: 0; pointer-events: none; overflow: visible; z-index: 3; }
.ux-ol path, .ux-ol rect { fill: rgba(123, 134, 255, .12); stroke: #9aa5ff; stroke-width: 2; vector-effect: non-scaling-stroke; }
.ux-ol-hover path, .ux-ol-hover rect { stroke-dasharray: 6 4; fill: rgba(123, 134, 255, .16); }
.ux-ol-sel path, .ux-ol-sel rect { fill: rgba(123, 134, 255, .2); stroke: #ffd166; stroke-width: 2.5; }
.ux-ol-bg rect { fill: none; stroke-dasharray: 8 6; }

/* Test drawer: старый поповер превращается в обычное содержимое */
.ux-drawer-b .pop { display: block !important; position: static !important; width: auto !important; padding: 0; border: 0; background: transparent; box-shadow: none; }
.ux-drawer-b .pop .pop-h { display: none; }

/* панель: меньше шума в Basic */
body.ux .ux-side .f-hint { opacity: .85; }
body.ux .ux-side .chips { gap: 5px; }
body.ux .ux-side .chip { padding: 6px; border-radius: 10px; }
body.ux .ux-home .ux-steps { margin-bottom: 4px; }
body.ux .ux-home .quick .qk { grid-template-columns: 1fr; gap: 4px; }
body.ux .ux-home .quick { padding: 0; }

/* превью — главный холст */
body.ux .pv-bar { background: transparent; border-bottom: 0; padding: 4px 10px; gap: 8px; }
body.ux .pv-ctl { background: transparent; border-top: 0; padding: 4px 12px; font-size: 11px; opacity: .8; }
body.ux .pv-bar .badge { display: none; }
body.ux .pv-bar .badge.warn { display: inline-block; }
body.ux.is-basic #guideWrap { display: none; }
body.ux header.top { height: 52px; }
body.ux .app { height: calc(100vh - 52px); }
body.ux .brand small { display: none; }
body.ux .toast { box-shadow: 0 6px 18px rgba(0, 0, 0, .35); }

/* Inspector: ряд полей чуть компактнее */
.ux-insp .f-row { margin-bottom: 7px; }
.ux-insp .gal { margin-bottom: 4px; }
.ux-insp .gal-grid { max-height: 220px; }

/* Reset Control */
.f-reset { margin-left: auto; padding: 0 5px !important; border-radius: 6px; background: transparent !important; color: var(--mute); font-size: 12px; opacity: 0; transition: opacity .15s; }
.f-row:hover .f-reset, .f-reset:focus-visible { opacity: 1; }
.f-reset:hover { color: #fff; background: #2b3370 !important; }
.f-label { width: 100%; }