@import url('./editor-immersive.css');
/* Structured design canvas. These styles are application chrome, never email DTO fields. */
.api-editor-v2 [data-design-panel][hidden],.api-editor-v2 [data-builder-preview][hidden]{display:none!important}
.api-editor-v2 .canvas-view-switch{display:flex;align-items:center;gap:5px;min-height:54px;padding:10px 16px;border-bottom:1px solid var(--line,#e5e3e8);background:var(--surface,#fff)}
.api-editor-v2 .canvas-view-switch .btn{display:inline-flex;align-items:center;gap:7px;border:0;background:transparent;padding:8px 10px;border-radius:9px;font-size:12px;white-space:nowrap}
.api-editor-v2 .canvas-view-switch .btn[aria-pressed=true]{color:var(--brand,#bf2487);background:var(--brand-soft,#f9eaf3)}
.api-editor-v2 .canvas-view-switch>span{margin-left:auto;color:var(--muted,#77717d);font-size:11px;text-align:right}
.api-editor-v2 .canvas-workspace{padding:26px 22px 32px;background:var(--surface-soft,#f2f1f5);min-height:480px;max-height:calc(100vh - 275px);overflow:auto;scrollbar-gutter:stable}
.api-editor-v2 .canvas-paper{width:100%;max-width:600px;min-height:390px;margin:0 auto;padding:24px;box-sizing:border-box;background:#fff;color:#172033;font:16px/24px Arial,Helvetica,sans-serif;box-shadow:0 3px 20px #2920350d;border-radius:2px;transition:max-width .18s ease}
.api-editor-v2 [data-canvas-device=mobile] .canvas-paper{max-width:340px;padding:20px 16px}
.api-editor-v2 .canvas-block{position:relative;min-width:0;outline:1px solid transparent;outline-offset:3px;border-radius:2px;cursor:pointer;isolation:isolate}
.api-editor-v2 .canvas-block:hover{outline-color:#c9bed0}
.api-editor-v2 .canvas-block.is-selected,.api-editor-v2 .canvas-block:focus-visible{outline:2px solid var(--brand,#bf2487)}
.api-editor-v2 .canvas-block:focus-visible{outline-offset:4px}
.api-editor-v2 .canvas-block-content{min-height:8px;overflow-wrap:anywhere}
.api-editor-v2 .canvas-controls{position:absolute;right:-4px;top:-30px;z-index:6;display:flex;align-items:center;gap:1px;height:28px;padding:2px 3px;border:1px solid #d7c4d3;border-radius:7px;background:#fff;color:#574b60;box-shadow:0 3px 10px #2b1f3320;opacity:0;pointer-events:none;transition:opacity .12s ease;font:11px/1.2 system-ui,sans-serif;white-space:nowrap}
.api-editor-v2 .canvas-block:hover>.canvas-controls,.api-editor-v2 .canvas-block:focus-within>.canvas-controls,.api-editor-v2 .canvas-block.is-selected>.canvas-controls{opacity:1;pointer-events:auto}
.api-editor-v2 .canvas-block:has(.canvas-block:hover)>.canvas-controls{opacity:0;pointer-events:none}
.api-editor-v2 .canvas-kind{padding:0 6px;max-width:105px;overflow:hidden;text-overflow:ellipsis;font-weight:600}
.api-editor-v2 .canvas-controls button{display:grid;place-items:center;width:26px;height:24px;padding:4px;border:0;border-radius:4px;background:transparent;color:inherit;cursor:pointer}
.api-editor-v2 .canvas-controls button:hover,.api-editor-v2 .canvas-controls button:focus-visible{background:#f9eaf3;color:#af197b;outline:2px solid #bd2e92;outline-offset:1px}
.api-editor-v2 .canvas-controls button:disabled{opacity:.3;cursor:default}
.api-editor-v2 .canvas-controls .studio-icon{width:14px;height:14px}
.api-editor-v2 .canvas-dropzone{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:16px;min-height:16px;margin:0;padding:0;border:0;border-radius:4px;background:transparent;cursor:copy;color:#a31b75;font:11px/1.3 system-ui,sans-serif;z-index:2;box-sizing:border-box}
.api-editor-v2 .canvas-dropzone:before{content:'';height:2px;position:absolute;top:50%;left:-7px;right:-7px;background:transparent;border-radius:2px}
.api-editor-v2 .canvas-dropzone>span{display:flex;align-items:center;gap:4px;padding:3px 8px;background:#fbeaf6;border-radius:5px;position:relative;opacity:0;pointer-events:none;white-space:normal;text-align:center}
.api-editor-v2 .canvas-dropzone .studio-icon{width:12px;height:12px;flex-shrink:0}
.api-editor-v2 .canvas-dropzone:hover:before,.api-editor-v2 .canvas-dropzone:focus-visible:before,.api-editor-v2 .canvas-dropzone.is-drop-target:before,.api-editor-v2 .canvas-dropzone.is-insertion:before{background:#c1288c}
.api-editor-v2 .canvas-dropzone:hover>span,.api-editor-v2 .canvas-dropzone:focus-visible>span,.api-editor-v2 .canvas-dropzone.is-drop-target>span,.api-editor-v2 .canvas-dropzone.is-insertion>span{opacity:1}
.api-editor-v2 .canvas-dropzone.is-empty{min-height:88px;height:auto;border:1px dashed #ddd2df;background:#faf8fb;padding:16px;margin:4px 0}
.api-editor-v2 .canvas-dropzone.is-empty>span{opacity:1;background:transparent;color:#88778b}
.api-editor-v2 .canvas-dropzone.is-empty.is-drop-target,.api-editor-v2 .canvas-dropzone.is-empty.is-insertion{background:#fbeaf6;border-color:#c1288c}
.api-editor-v2.canvas-dragging .canvas-dropzone:before{background:#ddb8d2}
.api-editor-v2.canvas-dragging .canvas-dropzone.is-drop-target:before{height:3px;background:#c1288c}
.api-editor-v2 .canvas-dropzone:disabled{cursor:default}
.api-editor-v2 .canvas-dropzone:disabled:not(.is-empty){pointer-events:none}
.api-editor-v2 .canvas-email-text{margin:0 0 16px;color:#172033;font:16px/24px Arial,Helvetica,sans-serif}
.api-editor-v2 .canvas-email-heading{margin:0 0 16px;color:#172033;font:700 24px/32px Arial,Helvetica,sans-serif;letter-spacing:0}
.api-editor-v2 .canvas-button-line{margin:0 0 16px!important}
.api-editor-v2 .canvas-email-button{display:inline-block;padding:12px 24px;border:1px solid #1d4ed8;border-radius:6px;background:#1d4ed8;color:#fff;font:700 16px/24px Arial,Helvetica,sans-serif;overflow-wrap:anywhere}
.api-editor-v2 .canvas-email-unsubscribe{margin:16px 0!important;color:#475569;font:12px/20px Arial,Helvetica,sans-serif;text-decoration:underline}
.api-editor-v2 .canvas-email-divider{border-top:1px solid #cbd5e1;height:1px}
.api-editor-v2 .canvas-email-spacer{min-height:4px;display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient(135deg,#f8f9fc,#f8f9fc 5px,#f1f3f8 5px,#f1f3f8 6px);color:#94a3b8;font:10px system-ui,sans-serif}
.api-editor-v2 .canvas-image-placeholder{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:7px;min-height:145px;padding:18px;background:#f1f5f9;color:#64748b;text-align:center;border-radius:2px}
.api-editor-v2 .canvas-image-placeholder>.studio-icon{width:27px;height:27px;color:#94a3b8}
.api-editor-v2 .canvas-image-placeholder>span{font:14px/20px Arial,Helvetica,sans-serif;overflow-wrap:anywhere}
.api-editor-v2 .canvas-image-placeholder small{font:11px/16px system-ui,sans-serif;color:#8190a4}
.api-editor-v2 .canvas-columns{display:grid;min-width:0;gap:16px;padding-bottom:16px}
.api-editor-v2 .canvas-column{min-width:0;padding:0 2px;position:relative}
.api-editor-v2 .canvas-column-label{display:block;color:#9b8c9d;font:9px/15px system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase}
.api-editor-v2 [data-canvas-device=mobile] .canvas-columns[data-stack-mobile=true]{grid-template-columns:minmax(0,1fr)!important}
.api-editor-v2 .canvas-design-note{display:flex;gap:8px;justify-content:space-between;align-items:center;padding:10px 16px;background:var(--surface,#fff);border-top:1px solid var(--line,#e5e3e8);color:var(--muted,#77717d);font-size:10px}
.api-editor-v2 .canvas-design-note span:first-child{display:flex;align-items:center;gap:5px}
.api-editor-v2 .canvas-design-note .studio-icon{width:13px;height:13px}
.api-editor-v2 .canvas-design-panel>.editor-policy{margin:0;padding:10px 16px;border-radius:0;border-width:1px 0 0}
.api-editor-v2 .canvas-live{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.api-editor-v2 .canvas-layout-presets{padding:14px 0 5px}
.api-editor-v2 .canvas-layout-presets>span{display:block;margin-bottom:7px;font-size:10px;color:var(--muted,#77717d);letter-spacing:.08em;text-transform:uppercase}
.api-editor-v2 .canvas-layout-presets>div{display:flex;gap:5px}
.api-editor-v2 .canvas-layout-presets .btn{display:flex;align-items:center;justify-content:center;gap:5px;flex:1;padding:8px 3px;min-width:0;font-size:11px}
.api-editor-v2 .canvas-layout-presets .studio-icon{width:15px;height:15px}
.api-editor-v2 .canvas-move-field{margin-top:15px}
.api-editor-v2 .canvas-move-field select{max-width:100%;font-size:11px}
.api-editor-v2 .canvas-move-field>.btn{width:100%;margin-top:7px;font-size:11px}
@media(max-width:1100px){.api-editor-v2 .canvas-view-switch>span{display:none}.api-editor-v2 .canvas-workspace{padding:25px 16px}.api-editor-v2 .canvas-kind{display:none}}
@media(max-width:760px){.api-editor-v2 .canvas-workspace{max-height:none;min-height:390px;padding:24px 14px}.api-editor-v2 .canvas-paper{padding:20px 14px}.api-editor-v2 .canvas-view-switch{padding:9px 12px}.api-editor-v2 .canvas-design-note{flex-wrap:wrap}.api-editor-v2 .canvas-controls{opacity:1;pointer-events:auto}.api-editor-v2 .canvas-block:not(.is-selected):not(:focus-within)>.canvas-controls{opacity:0;pointer-events:none}.api-editor-v2 .canvas-columns{gap:10px}}
@media(prefers-reduced-motion:reduce){.api-editor-v2 .canvas-paper,.api-editor-v2 .canvas-controls{transition:none}}
/* Keep floating actions above sibling insertion lines, and let drop zones win while dragging. */
.api-editor-v2 .canvas-block:hover,.api-editor-v2 .canvas-block:focus-within,.api-editor-v2 .canvas-block.is-selected{z-index:3}
.api-editor-v2.canvas-dragging .canvas-controls{opacity:0!important;pointer-events:none!important}

.api-editor-v2 .canvas-library-image{display:inline-block;vertical-align:middle;max-width:100%;height:auto}.api-editor-v2 .canvas-email-list{font:16px/24px Arial,Helvetica,sans-serif;margin:0 0 16px;padding-left:24px}.api-editor-v2 .canvas-email-list li{margin:0 0 8px}.api-editor-v2 .canvas-email-social{font:13px/22px Arial,Helvetica,sans-serif;margin:0 0 16px}.api-editor-v2 .canvas-email-social>span{display:inline-block;margin:4px 12px 4px 0;text-decoration:underline}.api-editor-v2 .canvas-email-button{box-sizing:border-box}