/* Estimate Calculator — AI Plan Take-Off (STEP 1) styles.
   Scoped under #ec-ai-prefill so it can't bleed into the calculator table. */

#ec-ai-prefill {
    position: relative;
    margin: 20px 0 28px;
    padding: 20px;
    border: 1px solid #e2e2e2;
    border-radius: 10px;
    background: #fafafa;
    box-sizing: border-box;
}

/* ---- Full-screen (maximize) toggle ---- */
#ec-ai-prefill .ec-ai-fs-btn {
    position: absolute; top: 16px; right: 18px; z-index: 95;
    display: inline-flex; align-items: center; gap: 6px;
    width: auto !important; /* override the theme's global button{width:100%} */
    padding: 7px 12px; border: 1px solid #dcdcdc; border-radius: 7px;
    background: #fff; color: #444; cursor: pointer;
    font-size: 13px; font-weight: 500; line-height: 1;
    box-shadow: 0 1px 3px rgba(0,0,0,.08); transition: all .12s;
}
#ec-ai-prefill .ec-ai-fs-btn:hover { border-color: #c1272d; color: #c1272d; }

/* Maximized: cover the whole viewport — INCLUDING the sticky site nav, whose
   own sticky z-index is high — so we go very high here. SweetAlert dialogs are
   pushed above this (scoped to body.ec-ai-maximized) so they stay visible. */
#ec-ai-prefill.ec-ai-fs {
    position: fixed; inset: 0; z-index: 2147483000;
    margin: 0; border: 0; border-radius: 0;
    overflow: auto; padding: 14px 20px 20px;
    background: #f0f0f0;
}
/* keep dialogs (naming prompt, Generate progress, errors) above the maximized
   section. Only active while maximized, so other plugins' Swals are untouched. */
body.ec-ai-maximized .swal2-container { z-index: 2147483646 !important; }

/* The section can't out-stack the sticky site header from inside the page (an
   ancestor traps its stacking context), so while maximized we hide the site
   chrome that would paint over it. It's fully covered anyway. Restored on exit. */
body.ec-ai-maximized header[role="banner"],
body.ec-ai-maximized header.fl-builder-content,
body.ec-ai-maximized .fl-theme-builder-header,
body.ec-ai-maximized .fl-page-header,
body.ec-ai-maximized .fl-page-bar,
body.ec-ai-maximized #quick-estimate-widget { display: none !important; }
#ec-ai-prefill.ec-ai-fs .ec-ai-fs-btn { position: fixed; top: 12px; right: 18px; z-index: 1001; }
#ec-ai-prefill.ec-ai-fs .ec-ai-head { padding-right: 150px; } /* clear the fixed button */
#ec-ai-prefill.ec-ai-fs .ec-ai-canvas-scroll { max-height: calc(100vh - 230px); }
#ec-ai-prefill.ec-ai-fs .ec-ai-thumbs { max-height: calc(100vh - 230px); }

#ec-ai-prefill * { box-sizing: border-box; }

#ec-ai-prefill .ec-ai-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}
#ec-ai-prefill .ec-ai-step-num {
    flex: 0 0 auto;
    width: 32px; height: 32px;
    border-radius: 50%;
    background: #c1272d; /* SuperForm red */
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-weight: 700; font-size: 16px;
}
#ec-ai-prefill .ec-ai-head-text { display: flex; flex-direction: column; }
#ec-ai-prefill .ec-ai-head-text strong { font-size: 17px; line-height: 1.2; }
#ec-ai-prefill .ec-ai-sub { font-size: 13px; color: #666; margin-top: 2px; }

/* ---- Dropzone ---- */
#ec-ai-prefill .ec-ai-dropzone {
    position: relative;
    border: 2px dashed #c4c4c4;
    border-radius: 8px;
    background: #fff;
    padding: 32px 20px;
    text-align: center;
    cursor: pointer;
    transition: border-color .15s, background .15s;
}
#ec-ai-prefill .ec-ai-dropzone.is-dragover,
#ec-ai-prefill .ec-ai-dropzone:hover {
    border-color: #c1272d;
    background: #fff7f7;
}
#ec-ai-prefill .ec-ai-dropzone input[type="file"] {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    opacity: 0; cursor: pointer;
}
#ec-ai-prefill .ec-ai-dropzone-inner i { font-size: 34px; color: #c1272d; }
#ec-ai-prefill .ec-ai-dropzone-title { margin: 10px 0 2px; font-weight: 600; font-size: 15px; }
#ec-ai-prefill .ec-ai-dropzone-or { margin: 0; font-size: 13px; color: #888; }

/* ---- Toolbar ---- */
#ec-ai-prefill .ec-ai-toolbar {
    display: flex; flex-wrap: wrap; gap: 10px 16px;
    align-items: center; justify-content: space-between;
    padding: 8px 10px; margin-bottom: 8px;
    background: #fff; border: 1px solid #e6e6e6; border-radius: 10px;
    /* Stay reachable while scrolling a tall plan: stick just below the theme's
       fixed header (offset set from its measured height in JS). z-index sits
       below the site header (z 100) but above the canvas/page content. */
    position: sticky;
    top: var(--ec-ai-sticky-top, 136px);
    z-index: 90;
    box-shadow: 0 2px 8px rgba(0,0,0,.07);
}

/* Tool palette — grouped chips with thin dividers between groups. */
#ec-ai-prefill .ec-ai-tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
#ec-ai-prefill .ec-ai-tool-seg { display: inline-flex; gap: 4px; }
#ec-ai-prefill .ec-ai-tool-div {
    width: 1px; align-self: stretch; min-height: 22px;
    background: #e6e6e6; margin: 0 2px;
}
#ec-ai-prefill .ec-ai-tool {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 7px 11px;
    border: 1px solid #dcdcdc; border-radius: 7px;
    background: #fff; color: #444; cursor: pointer; user-select: none;
    font-size: 13px; font-weight: 500; line-height: 1;
    transition: all .12s;
}
#ec-ai-prefill .ec-ai-tool i { font-size: 13px; opacity: .8; }
#ec-ai-prefill .ec-ai-tool:hover { border-color: #bdbdbd; background: #fafafa; }
#ec-ai-prefill .ec-ai-tool.is-active {
    color: #fff; background: #c1272d; border-color: #c1272d;
    box-shadow: 0 1px 4px rgba(193,39,45,.30);
}
#ec-ai-prefill .ec-ai-tool.is-active i { opacity: 1; }
#ec-ai-prefill .ec-ai-tool[data-tool="window"].is-active    { background:#2f6fb0; border-color:#2f6fb0; box-shadow:0 1px 4px rgba(47,111,176,.3); }
#ec-ai-prefill .ec-ai-tool[data-tool="door"].is-active      { background:#2e8b57; border-color:#2e8b57; box-shadow:0 1px 4px rgba(46,139,87,.3); }
#ec-ai-prefill .ec-ai-tool[data-tool="scale"].is-active     { background:#b8860b; border-color:#b8860b; box-shadow:0 1px 4px rgba(184,134,11,.3); }
#ec-ai-prefill .ec-ai-tool[data-tool="highlight"].is-active { background:#e6007e; border-color:#e6007e; box-shadow:0 1px 4px rgba(230,0,126,.3); }
#ec-ai-prefill .ec-ai-tool[data-tool="merge"].is-active     { background:#7b2fb0; border-color:#7b2fb0; box-shadow:0 1px 4px rgba(123,47,176,.3); }
#ec-ai-prefill .ec-ai-tool[data-tool="erase"].is-active     { background:#555;    border-color:#555;    box-shadow:0 1px 4px rgba(0,0,0,.25); }

/* Primary action cluster (right side of the toolbar). */
#ec-ai-prefill .ec-ai-tool-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
#ec-ai-prefill .ec-ai-act-div { width: 1px; align-self: stretch; min-height: 24px; background: #e6e6e6; margin: 0 2px; }

/* Undo — neutral icon button */
#ec-ai-prefill .ec-ai-undo {
    display: inline-flex; align-items: center; justify-content: center;
    width: 34px; height: 34px; padding: 0;
    border: 1px solid #dcdcdc; border-radius: 7px;
    background: #fff; color: #666; cursor: pointer; user-select: none;
    transition: all .12s;
}
#ec-ai-prefill .ec-ai-undo:hover { background: #f1f1f1; color: #222; border-color: #bdbdbd; }

/* Finish wall — positive "complete" action (green) */
#ec-ai-prefill .ec-ai-finish-wall {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 13px; border: 1px solid #2e8b57; border-radius: 7px;
    background: #eaf6ef; color: #1f7a47; cursor: pointer; user-select: none;
    font-size: 13px; font-weight: 600; line-height: 1; transition: all .12s;
}
#ec-ai-prefill .ec-ai-finish-wall:hover { background: #2e8b57; color: #fff; }

/* Auto-detect — secondary "AI does it" action */
/* Auto take-off — the one-pass fast path (distinct violet accent). */
#ec-ai-prefill .ec-ai-autotakeoff-btn {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 14px; border: 1px solid #7b2fb0; border-radius: 7px;
    background: linear-gradient(180deg, #8a3fc0, #6f23a8); color: #fff;
    cursor: pointer; user-select: none; box-shadow: 0 2px 6px rgba(123,47,176,.3);
    font-size: 13px; font-weight: 700; line-height: 1; transition: all .12s;
}
#ec-ai-prefill .ec-ai-autotakeoff-btn:hover { box-shadow: 0 3px 11px rgba(123,47,176,.45); transform: translateY(-1px); }

#ec-ai-prefill .ec-ai-detect-btn {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 13px; border: 1px solid #cfe0f1; border-radius: 7px;
    background: #eef5fc; color: #2f6fb0; cursor: pointer; user-select: none;
    font-size: 13px; font-weight: 600; line-height: 1; transition: all .12s;
}
#ec-ai-prefill .ec-ai-detect-btn:hover { background: #2f6fb0; border-color: #2f6fb0; color: #fff; }

/* Explicit geometry review gate. AI detection is an accelerator, never proof. */
#ec-ai-prefill .ec-ai-confirm-walls {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 13px; border: 1px solid #b7791f; border-radius: 7px;
    background: #fff8e5; color: #8a5a00; cursor: pointer; user-select: none;
    font-size: 13px; font-weight: 700; line-height: 1; transition: all .12s;
}
#ec-ai-prefill .ec-ai-confirm-walls:hover { background: #b7791f; color: #fff; }
#ec-ai-prefill .ec-ai-confirm-walls.is-confirmed {
    border-color: #2e8b57; background: #eaf6ef; color: #1f7a47;
}

/* This site's bundled SweetAlert2 occasionally leaves a completed popup in its
 * `*-hide` animation state when animationend never fires. It remains transparent
 * but intercepts every click over the calculator, so a closing dialog is click-through
 * at once. NOT display:none — that stops the close animation, SweetAlert never finishes
 * closing and leaves its page scroll lock on (2026-10-20: page couldn't scroll after
 * Exit full screen). A stuck one is removed by releaseStuckDialogs() in ec-ai-prefill.js. */
.swal2-container.swal2-backdrop-hide,
.swal2-popup.swal2-hide {
    pointer-events: none !important;
}

/* Generate — the primary CTA.
   width:auto !important overrides the SuperForm theme's global button{width:100%}
   which otherwise stretches it into a full-width bar. */
#ec-ai-prefill .ec-ai-generate {
    display: inline-flex; align-items: center; gap: 8px;
    width: auto !important; flex: 0 0 auto;
    padding: 9px 22px; border: 0; border-radius: 7px;
    background: linear-gradient(180deg, #d12b31, #b51f25); color: #fff;
    font-weight: 700; font-size: 14px; line-height: 1; letter-spacing: .2px;
    cursor: pointer; box-shadow: 0 2px 6px rgba(193,39,45,.35);
    transition: transform .08s, box-shadow .12s, background .12s;
}
#ec-ai-prefill .ec-ai-generate:hover:not(:disabled) { box-shadow: 0 3px 11px rgba(193,39,45,.45); transform: translateY(-1px); }
#ec-ai-prefill .ec-ai-generate:active:not(:disabled) { transform: translateY(0); }
#ec-ai-prefill .ec-ai-generate:disabled { background: #cfcfcf; box-shadow: none; cursor: not-allowed; }

#ec-ai-prefill .ec-ai-disabled { opacity: .4; pointer-events: none; }

/* ---- Secondary strip: contextual edit actions + status + zoom ---- */
#ec-ai-prefill .ec-ai-subbar {
    display: flex; align-items: center; justify-content: space-between;
    flex-wrap: wrap; gap: 8px 14px; margin-bottom: 10px; padding: 0 4px;
    min-height: 30px;
}
#ec-ai-prefill .ec-ai-subbar-left,
#ec-ai-prefill .ec-ai-subbar-right { display: flex; align-items: center; gap: 12px; }
#ec-ai-prefill .ec-ai-counts { font-size: 12px; color: #8a8a8a; }

/* Clear page — subtle, turns destructive-red on hover */
#ec-ai-prefill .ec-ai-clear-page {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 5px 9px; border: 1px solid transparent; border-radius: 6px;
    background: transparent; color: #9a9a9a; cursor: pointer; user-select: none;
    font-size: 12px; line-height: 1; transition: all .12s;
}
#ec-ai-prefill .ec-ai-clear-page:hover { color: #c1272d; background: #fdeeee; }

/* Snap-while-drawing toggle (subbar) */
#ec-ai-prefill .ec-ai-snap-toggle {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 5px 9px; border: 1px solid #d6d6d6; border-radius: 6px;
    background: transparent; color: #9a9a9a; cursor: pointer; user-select: none;
    font-size: 12px; line-height: 1; transition: all .12s;
}
#ec-ai-prefill .ec-ai-snap-toggle:hover { border-color: #999; color: #555; }
#ec-ai-prefill .ec-ai-snap-toggle.is-active { background: #1d3a8a; border-color: #1d3a8a; color: #fff; }

/* Merge sub-actions (only while the Merge tool is active) */
#ec-ai-prefill .ec-ai-merge-actions { display: inline-flex; gap: 6px; align-items: center; }
#ec-ai-prefill .ec-ai-group-btn,
#ec-ai-prefill .ec-ai-ungroup-btn {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 5px 10px; border: 1px solid #7b2fb0; border-radius: 6px;
    background: #fff; color: #7b2fb0; cursor: pointer; user-select: none;
    font-size: 12px; line-height: 1; transition: all .12s;
}
#ec-ai-prefill .ec-ai-group-btn:hover,
#ec-ai-prefill .ec-ai-ungroup-btn:hover { background: #7b2fb0; color: #fff; }

/* ---- Corner tool: Inside / Outside picker ---- */
#ec-ai-prefill .ec-ai-corner-actions { display: inline-flex; gap: 6px; align-items: center; }
#ec-ai-prefill .ec-ai-corner-label { font-size: 12px; color: #666; }
#ec-ai-prefill .ec-ai-corner-kind {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 5px 10px; border: 1px solid #cfcfcf; border-radius: 6px;
    background: #fff; color: #666; cursor: pointer; user-select: none;
    font-size: 12px; line-height: 1; transition: all .12s;
}
#ec-ai-prefill .ec-ai-corner-kind[data-kind="inside"].is-active  { background: #0a8f5b; border-color: #0a8f5b; color: #fff; }
#ec-ai-prefill .ec-ai-corner-kind[data-kind="outside"].is-active { background: #d4790f; border-color: #d4790f; color: #fff; }
#ec-ai-prefill .ec-ai-corner-kind:not(.is-active):hover { border-color: #999; color: #333; }
#ec-ai-prefill .ec-ai-corner-detect {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 5px 10px; border: 1px solid #2f6fb0; border-radius: 6px;
    background: #fff; color: #2f6fb0; cursor: pointer; user-select: none;
    font-size: 12px; line-height: 1; transition: all .12s; margin-left: 2px;
}
#ec-ai-prefill .ec-ai-corner-detect:hover { background: #2f6fb0; color: #fff; }

/* ---- Stage: thumbnails + canvas ---- */
#ec-ai-prefill .ec-ai-stage {
    display: flex; gap: 10px;
    border: 1px solid #e2e2e2; border-radius: 8px;
    background: #f0f0f0; padding: 8px;
    min-height: 460px;
    width: 100%;
}
#ec-ai-prefill .ec-ai-thumbs {
    flex: 0 0 96px;
    max-height: 78vh; overflow-y: auto;
    display: flex; flex-direction: column; gap: 8px;
    padding-right: 4px;
}
#ec-ai-prefill .ec-ai-thumb {
    position: relative;
    border: 2px solid transparent; border-radius: 4px;
    background: #fff; cursor: pointer; overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,.15);
}
#ec-ai-prefill .ec-ai-thumb.is-active { border-color: #c1272d; }
#ec-ai-prefill .ec-ai-thumb canvas { display: block; width: 100%; height: auto; }
#ec-ai-prefill .ec-ai-thumb .ec-ai-thumb-num {
    position: absolute; bottom: 2px; right: 3px;
    background: rgba(0,0,0,.6); color: #fff;
    font-size: 10px; padding: 0 4px; border-radius: 3px;
}
#ec-ai-prefill .ec-ai-thumb .ec-ai-thumb-mark {
    position: absolute; top: 2px; left: 3px;
    color: #c1272d; font-size: 11px;
}

#ec-ai-prefill .ec-ai-canvas-scroll {
    flex: 1 1 auto; min-width: 0; overflow: auto; max-height: 78vh;
    /* flex-start (not center): a centered child wider than the box clips its
       left edge and can't be scrolled to. Left-align so wide sheets scroll
       fully both directions. The wrap's auto margins re-center narrow pages. */
    display: flex; justify-content: flex-start;
}
#ec-ai-prefill .ec-ai-canvas-wrap {
    position: relative; line-height: 0;
    align-self: flex-start;
    margin: 0 auto; /* center when it fits; harmless when it overflows */
    box-shadow: 0 2px 10px rgba(0,0,0,.2);
}
#ec-ai-prefill #ec-ai-page-canvas { display: block; }
#ec-ai-prefill #ec-ai-overlay-canvas {
    position: absolute; top: 0; left: 0;
    cursor: crosshair;
}

/* Floating "Finish wall" — appears just below the last drawn segment (left/top
   set by JS in canvas-content coords; the wrap is position:relative). */
#ec-ai-prefill .ec-ai-finish-float {
    position: absolute; z-index: 20;
    transform: translate(-50%, 14px);   /* centered on the point, nudged below it */
    display: inline-flex; align-items: stretch;
    border-radius: 8px; background: #2e8b57; color: #fff;
    font-size: 13px; font-weight: 700; line-height: 1; white-space: nowrap;
    box-shadow: 0 2px 9px rgba(0,0,0,.32);
    transition: left .1s ease, top .1s ease;
}
#ec-ai-prefill .ec-ai-finish-float-go {
    width: auto !important;              /* theme button{width:100%} guard */
    display: inline-flex; align-items: center; gap: 6px;
    padding: 7px 12px; border: 0; border-radius: 8px 0 0 8px;
    background: transparent; color: #fff; cursor: pointer;
    font: inherit; line-height: 1;
}
#ec-ai-prefill .ec-ai-finish-float-go:hover { background: rgba(0,0,0,.14); border-radius: 8px 0 0 8px; }
#ec-ai-prefill .ec-ai-finish-float-x {
    width: auto !important;              /* theme button{width:100%} guard */
    padding: 7px 9px; border: 0; border-left: 1px solid rgba(255,255,255,.4);
    border-radius: 0 8px 8px 0; background: transparent; color: #fff;
    cursor: pointer; font-size: 15px; line-height: 1; opacity: .85;
}
#ec-ai-prefill .ec-ai-finish-float-x:hover { background: rgba(0,0,0,.2); opacity: 1; }

/* ---- Wall / highlight legend (right-hand sidebar of the canvas stage) ---- */
#ec-ai-prefill .ec-ai-legend {
    flex: 0 0 248px;
    align-self: stretch;          /* match the canvas height */
    display: flex; flex-direction: column;
    max-height: 78vh; min-height: 0;
    border: 1px solid #e2e2e2; border-radius: 8px;
    background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.08);
    overflow: hidden;
}
/* On narrow screens drop the legend to a full-width strip below the canvas. */
@media (max-width: 820px) {
    #ec-ai-prefill .ec-ai-stage { flex-wrap: wrap; }
    #ec-ai-prefill .ec-ai-legend { flex-basis: 100%; align-self: stretch; max-height: 200px; }
}
#ec-ai-prefill .ec-ai-legend-head {
    display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
    padding: 8px 12px; background: #f7f7f7; border-bottom: 1px solid #eee;
}
#ec-ai-prefill .ec-ai-legend-title { font-weight: 700; font-size: 13px; color: #333; }
#ec-ai-prefill .ec-ai-legend-hint  { font-size: 10px; color: #999; }
#ec-ai-prefill .ec-ai-legend-list {
    list-style: none; margin: 0; padding: 4px;
    flex: 1 1 auto; overflow-y: auto; min-height: 0;
}
#ec-ai-prefill .ec-ai-leg-item {
    display: block;
    padding: 6px 8px; border-radius: 6px; cursor: pointer;
    font-size: 13px; line-height: 1.25;
}
#ec-ai-prefill .ec-ai-leg-item + .ec-ai-leg-item { margin-top: 2px; border-top: 1px solid #f0f0f0; }
#ec-ai-prefill .ec-ai-leg-item:hover { background: #f2f2f2; }
#ec-ai-prefill .ec-ai-leg-item.is-active { background: #fdeeee; }
/* header row inside each card: swatch · name · sub · actions */
#ec-ai-prefill .ec-ai-leg-head { display: flex; align-items: center; gap: 8px; min-width: 0; }
/* per-wall at-a-glance details under the header */
#ec-ai-prefill .ec-ai-leg-details { display: block; padding: 3px 0 1px 22px; }
#ec-ai-prefill .ec-ai-leg-line { display: block; font-size: 11.5px; color: #666; padding: 1px 0; }
#ec-ai-prefill .ec-ai-leg-warn { color: #b8860b; font-weight: 600; }
#ec-ai-prefill .ec-ai-leg-chips { display: flex; flex-wrap: wrap; gap: 3px; }
#ec-ai-prefill .ec-ai-leg-chip {
    display: inline-block; font-size: 10.5px; font-weight: 600; line-height: 1;
    padding: 3px 6px; border-radius: 9px; white-space: nowrap;
}
#ec-ai-prefill .ec-ai-leg-chip-window { background: #e8f1fa; color: #2f6fb0; }
#ec-ai-prefill .ec-ai-leg-chip-door   { background: #e9f5ee; color: #2e8b57; }
#ec-ai-prefill .ec-ai-leg-swatch {
    flex: 0 0 auto; width: 14px; height: 14px; border-radius: 3px;
    box-shadow: inset 0 0 0 1px rgba(0,0,0,.15);
}
#ec-ai-prefill .ec-ai-leg-hl .ec-ai-leg-swatch { border-radius: 50%; }
#ec-ai-prefill .ec-ai-leg-name { flex: 1 1 auto; color: #222; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#ec-ai-prefill .ec-ai-leg-sub  { flex: 0 0 auto; font-size: 11px; color: #999; }
#ec-ai-prefill .ec-ai-leg-badge {
    flex: 0 0 auto; font-size: 10px; color: #c1272d;
    border: 1px solid #c1272d; border-radius: 10px; padding: 1px 6px;
}
#ec-ai-prefill .ec-ai-leg-edit { flex: 0 0 auto; color: #bbb; font-size: 11px; padding: 2px; }
#ec-ai-prefill .ec-ai-leg-item:hover .ec-ai-leg-edit { color: #c1272d; }
/* Delete-wall (trash) icon — neutral, turns solid red on its own hover. */
#ec-ai-prefill .ec-ai-leg-del { flex: 0 0 auto; color: #c9c9c9; font-size: 12px; padding: 2px; cursor: pointer; transition: color .12s; }
#ec-ai-prefill .ec-ai-leg-del:hover { color: #c1272d; }
/* "Draw into this wall" — makes the wall the active one so the next line joins it. */
#ec-ai-prefill .ec-ai-leg-draw {
    flex: 0 0 auto; width: 22px !important; height: 22px; padding: 0; margin: 0; /* width:auto override → fixed 22px vs theme button{width:100%} */
    border: 1px solid #d9d9d9; border-radius: 5px; background: #fff;
    color: #888; font-size: 11px; line-height: 1; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    transition: background .12s, color .12s, border-color .12s;
}
#ec-ai-prefill .ec-ai-leg-draw:hover { background: #1d7a3c; border-color: #1d7a3c; color: #fff; }
#ec-ai-prefill .ec-ai-leg-draw.is-active { background: #1d7a3c; border-color: #1d7a3c; color: #fff; }

#ec-ai-prefill .ec-ai-hint {
    margin-top: 10px; font-size: 12px; color: #777; line-height: 1.5;
    display: block;
}
#ec-ai-prefill .ec-ai-hint i { color: #b8860b; margin-right: 6px; }

/* Busy state for the Generate flow */
#ec-ai-prefill.is-busy { opacity: .6; pointer-events: none; }

/* Prefill flagged a field that needs the user's attention (e.g. a wall height
   the AI couldn't read — blank heights are EXCLUDED from the calculation).
   Lives on calculator-table inputs, not inside #ec-ai-prefill. */
input.ec-ai-attn {
    background: #fff7e0 !important;
    border: 2px solid #b8860b !important;
}

/* Viewer zoom control (read small dimension/window callouts on large sheets) */
#ec-ai-prefill .ec-ai-canvas-scroll { overflow: auto; }
#ec-ai-prefill .ec-ai-zoom { display: inline-flex; align-items: center; gap: 4px; }
#ec-ai-prefill .ec-ai-zoom > span { cursor: pointer; user-select: none; }
#ec-ai-prefill .ec-ai-zoom-out, #ec-ai-prefill .ec-ai-zoom-in, #ec-ai-prefill .ec-ai-zoom-fit {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 28px; height: 28px; padding: 0 7px;
    border: 1px solid #dcdcdc; border-radius: 6px; background: #fff; font-size: 12px; color: #555;
}
#ec-ai-prefill .ec-ai-zoom-out:hover, #ec-ai-prefill .ec-ai-zoom-in:hover, #ec-ai-prefill .ec-ai-zoom-fit:hover { background: #f1f1f1; }
#ec-ai-prefill .ec-ai-zoom-pct { min-width: 42px; text-align: center; font-size: 12px; color: #777; }

/* ===== Voice dictation in the name/note modals (SweetAlert, appended to <body>,
   so these are intentionally UNSCOPED. Buttons use !important widths to beat the
   theme's global button{width:100%}). ===== */
.swal2-input.ec-voice-field { padding-right: 92px !important; box-sizing: border-box; }
.swal2-input.ec-voice-field.ec-voice-listening { box-shadow: 0 0 0 2px rgba(193,39,45,.25); border-color: #c1272d; }
.ec-voice { position: absolute; display: flex; align-items: center; gap: 6px; z-index: 1; }
.ec-voice button {
    border: 0 !important; background: transparent; cursor: pointer; padding: 0 !important;
    width: 30px !important; height: 30px !important; min-width: 0 !important; border-radius: 50% !important;
    display: inline-flex; align-items: center; justify-content: center; font-size: 14px; line-height: 1;
    transition: background .12s, color .12s; box-shadow: none !important;
}
.ec-voice-mic { color: #c1272d; }
.ec-voice-mic:hover { background: #c1272d !important; color: #fff; }
.ec-voice-rec { display: inline-flex; align-items: center; gap: 6px; }
.ec-voice-ok { color: #1d7a3c; background: #e8f6ee !important; }
.ec-voice-ok:hover { background: #1d7a3c !important; color: #fff; }
.ec-voice-cancel { color: #c1272d; background: #fdeeee !important; }
.ec-voice-cancel:hover { background: #c1272d !important; color: #fff; }
.ec-voice-anim { display: inline-flex; align-items: flex-end; gap: 2px; height: 18px; padding: 0 2px; }
.ec-voice-anim i { display: block; width: 3px; height: 6px; background: #c1272d; border-radius: 2px; animation: ecVoiceBar .9s ease-in-out infinite; }
.ec-voice-anim i:nth-child(2) { animation-delay: .15s; }
.ec-voice-anim i:nth-child(3) { animation-delay: .30s; }
.ec-voice-anim i:nth-child(4) { animation-delay: .45s; }
@keyframes ecVoiceBar { 0%, 100% { height: 5px; opacity: .55; } 50% { height: 16px; opacity: 1; } }
.ec-voice-status { font-size: 12px; color: #888; margin-top: 6px; min-height: 15px; text-align: center; }
.ec-voice-status.is-err { color: #c1272d; }
@media (prefers-reduced-motion: reduce) { .ec-voice-anim i { animation: none; height: 12px; } }

/* Legend height = click-to-edit (2026-07-06) */
.ec-ai-leg-height { cursor: pointer; border-bottom: 1px dotted currentColor; }
.ec-ai-leg-height:hover { color: #c1272d; }
.ec-ai-leg-chip[data-oid] { cursor: pointer; }
.ec-ai-leg-chip[data-oid]:hover { outline: 1.5px solid #c1272d; }

/* 3D model button (2026-10-18) */
#ec-ai-prefill .ec-ai-3d-btn {
    display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px; border-radius: 6px; cursor: pointer;
    background: #0d9488; color: #fff; font-weight: 600; font-size: 13px; box-shadow: 0 2px 7px rgba(13,148,136,.35);
    transition: box-shadow .15s, transform .15s; user-select: none;
}
#ec-ai-prefill .ec-ai-3d-btn:hover { box-shadow: 0 3px 11px rgba(13,148,136,.5); transform: translateY(-1px); }

/* AI could not read the core size: the select has no blank option, so make the
   (default-looking) value impossible to miss until a person chooses. */
select.ec-ai-attn { outline: 2px solid #c1272d; outline-offset: 1px; background: #fff4f2 !important; }

/* Loading dialogs (plan read, 3D model): no button under the spinner. The calculator's
   base CSS forces every confirm button to display:block !important. */
.swal2-popup.swal2-loading button.swal2-confirm.swal2-styled { display: none !important; }

/* Generate after Auto take-off: available, but not the next step. */
#ec-ai-prefill .ec-ai-generate.is-secondary:not(:disabled) {
    background: #fff; color: #b51f25; box-shadow: none; border: 1px solid #e3b4b6;
}

/* Auto take-off summary table: the theme's table headings are uppercase with wide
   padding, which split short headings mid-word. */
.ec-ai-sum-table th { white-space: nowrap; text-transform: none; padding: 6px 8px; font-size: 13px; vertical-align: bottom; }
.ec-ai-sum-table th small { font-weight: 400; font-size: 11px; opacity: .85; }
.ec-ai-sum-table td { white-space: nowrap; }
.ec-ai-sum-table td:first-child { white-space: normal; }
/* Scope tick boxes in the Auto take-off summary (2026-10-18) */
.ec-ai-sum-table tr.ec-ai-off td{color:#9a9a9a}
.ec-ai-sum-table tr.ec-ai-off td strong{font-weight:600}
.ec-ai-sum-table input.ec-ai-scope{width:16px;height:16px;cursor:pointer}
.ec-ai-con{display:inline-block;font-size:11px;line-height:1.5;padding:0 6px;border-radius:9px;background:#eee;color:#444;font-weight:600}
.ec-ai-con-icf{background:#efe6f6;color:#6f23a8}
.ec-ai-con-concrete{background:#e8eef6;color:#2b5797}
.ec-ai-con-masonry{background:#f6eee4;color:#8a5a14}
.ec-ai-con-framed{background:#f1efe9;color:#6b6252}
.ec-ai-con-unknown{background:#fdf3d8;color:#8a6d00}
.ec-ai-sum-table td:nth-child(2){white-space:normal;min-width:260px}
.ec-ai-sum-table td:nth-child(2) span{white-space:normal}
/* Summary dialog layout (2026-10-18): tick boxes first, questions, reasoning folded */
.ec-ai-sum{text-align:left;font-size:14px;line-height:1.45;color:#222}
.ec-ai-sum-lead{margin:0 0 10px;font-size:14px}
.ec-ai-sum table.ec-ai-sum-table{width:100%;border-collapse:collapse;font-size:13px;margin:4px 0 6px}
.ec-ai-sum-table thead th{background:#f3f0f7;color:#333;border-bottom:2px solid #d9cfe6;text-align:center}
.ec-ai-sum-table tbody td{border-bottom:1px solid #eee;padding:7px 8px;text-align:center;vertical-align:middle}
.ec-ai-sum-table .ec-ai-gname{text-align:left;white-space:normal}
.ec-ai-sum-table td.ec-ai-tick{width:44px}
.ec-ai-sum-table tr.ec-ai-sum-sub td{background:#faf8fc;text-align:left;border-bottom:1px solid #e6e0ee}
.ec-ai-sum-table tbody tr:not(.ec-ai-sum-sub):hover td{background:#fbfaf7}
.ec-ai-miss{display:inline-block;min-width:18px;padding:0 5px;border-radius:9px;background:#fde8e8;color:#c1272d;font-weight:700}
.ec-ai-sum-note{font-size:12px;color:#555;margin:2px 0 10px}
.ec-ai-sum-h{font-weight:700;margin:12px 0 4px;font-size:14px}
.ec-ai-sum-warn{color:#9a5b00}
.ec-ai-count{display:inline-block;background:#fdf3d8;color:#8a6d00;border-radius:9px;padding:0 7px;font-size:12px;margin-left:4px}
.ec-ai-sum-qs ul,.ec-ai-sum-more ul{font-size:13px;margin:0 0 6px 18px;padding:0}
.ec-ai-sum-qs li,.ec-ai-sum-more li{margin:0 0 5px}
.ec-ai-sum details summary{cursor:pointer;color:#6f23a8;font-weight:600;font-size:13px;margin:4px 0}
.ec-ai-sum-more{border-top:1px solid #eee;margin-top:10px;padding-top:6px}
.ec-ai-sum-more p{font-size:13px;color:#444;margin:6px 0}
.ec-ai-sum-meta{font-size:12px!important;color:#666!important}
.swal2-popup.ec-ai-sum-popup .swal2-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;width:100%}
.swal2-popup.ec-ai-sum-popup button.swal2-confirm.swal2-styled{width:auto!important;display:inline-block!important;flex:1 1 260px;max-width:340px;font-size:16px;padding:12px 18px;margin:0;background:#6f23a8}
.swal2-popup.ec-ai-sum-popup button.swal2-deny.swal2-styled{flex:1 1 260px;max-width:340px;font-size:16px;padding:12px 18px;margin:0;background:#fff!important;color:#444!important;border:1px solid #bbb!important;box-shadow:none}
/* "Tell the AI what to fix" (2026-10-18) */
#ec-ai-prefill .ec-ai-revise-btn{display:inline-flex;align-items:center;gap:6px;cursor:pointer;border:1px solid #cdb8e0;color:#6f23a8;background:#fff;border-radius:4px;padding:6px 12px;font-weight:600;font-size:13px;margin-left:6px;vertical-align:middle}
#ec-ai-prefill .ec-ai-revise-btn:hover{background:#f6f0fb}
.ec-ai-rv{text-align:left;font-size:14px}
.ec-ai-rv textarea{width:100%;box-sizing:border-box;font:inherit;font-size:14px;padding:8px 10px;border:1px solid #ccc;border-radius:4px;resize:vertical}
.ec-ai-rv-mode{display:block;margin:4px 0;font-size:14px;cursor:pointer}
.ec-ai-rv-pages{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:4px 12px;margin:6px 0 8px 22px;font-size:13px}
.ec-ai-rv-page{cursor:pointer}
.ec-ai-rv-page small{color:#777}
.ec-ai-rv details summary{cursor:pointer;color:#6f23a8;font-weight:600;font-size:13px}
.ec-ai-rv ul{font-size:13px;margin:4px 0 0 18px}
.swal2-popup.ec-ai-sum-popup button.swal2-cancel.swal2-styled{flex:1 1 220px;max-width:300px;font-size:15px;padding:12px 16px;margin:0;background:#fff!important;color:#6f23a8!important;border:1px solid #cdb8e0!important;box-shadow:none}
/* Voice input (Kendra method) + before-read notes (2026-10-18) */
.ec-ai-voice{display:flex;align-items:center;gap:10px;margin:6px 0 2px;flex-wrap:wrap}
.ec-ai-mic{display:inline-flex;align-items:center;gap:6px;border:1px solid #cdb8e0;background:#fff;color:#6f23a8;border-radius:18px;padding:6px 14px;font-weight:600;font-size:13px;cursor:pointer}
.ec-ai-mic:hover{background:#f6f0fb}
.ec-ai-mic.is-listening{background:#c1272d;border-color:#c1272d;color:#fff;animation:ecAiPulse 1.4s ease-in-out infinite}
@keyframes ecAiPulse{0%,100%{box-shadow:0 0 0 0 rgba(193,39,45,.45)}50%{box-shadow:0 0 0 7px rgba(193,39,45,0)}}
.ec-ai-voice-live{font-size:13px;color:#666;font-style:italic}
.ec-ai-rv-examples{font-size:13px;color:#555;margin:0 0 8px 18px}
body:has(#ec-ai-prefill) .swal2-container{z-index:2147483646!important} /* dialogs always above the full-screen plan (before-read question opens as it maximizes) */
.ec-ai-con-optional{background:#eef1f4;color:#555}

/* "Still to check" (2026-10-19): table rows and sections the AI does not fill stay marked until the
   dealer changes them or clicks "Looks right". The wall columns are red with white text, so the
   cells get a gold frame and a light gold wash; the white label column and sections get a gold bar. */
#estimate-calculator td.ec-ai-review {
    background-image: linear-gradient(rgba(255, 205, 60, .22), rgba(255, 205, 60, .22)) !important;
    box-shadow: inset 0 0 0 2px #ffcf4a;
}
#estimate-calculator td.ec-ai-review-label { background: #fff6dc !important; box-shadow: inset 5px 0 0 #e0a800; }
.ec-ai-review-sec { outline: 3px solid #ffcf4a; outline-offset: -2px; border-radius: 6px; background-image: linear-gradient(rgba(255, 205, 60, .22), rgba(255, 205, 60, .22)) !important; }
button.ec-ai-review-tag, .ec-ai-review-tag {
    all: unset; box-sizing: border-box;
    display: inline-block; margin: 6px 0 0 8px; padding: 3px 10px !important; border: 1px solid #b8860b !important; border-radius: 999px !important;
    background: #fff !important; color: #6b4b00 !important; font-family: inherit !important; font-size: 12px !important; font-weight: 600 !important; line-height: 1.4 !important; text-transform: none !important;
    letter-spacing: 0 !important; cursor: pointer; white-space: nowrap; vertical-align: middle; box-shadow: none !important; width: auto !important; height: auto !important;
}
#estimate-calculator td.ec-ai-review-label button.ec-ai-review-tag { display: table; margin: 6px 0 0 auto; }
button.ec-ai-review-tag:hover, button.ec-ai-review-tag:focus-visible { background: #b8860b !important; color: #fff !important; }
.ec-ai-review-tag::before { content: "\2713\00a0"; }
.ec-ai-review-note {
    margin: 0 0 12px; padding: 10px 14px; border: 1px solid #e8c35a; border-left: 5px solid #e0a800; border-radius: 4px;
    background: #fff6dc; color: #4a3b10; font-size: 14px; line-height: 1.5;
}
button.ec-ai-review-all {
    all: unset; margin-left: 4px; color: #6b4b00 !important; font-weight: 600; text-decoration: underline; cursor: pointer;
}
.ec-ai-sum-extra { margin: 10px 0 4px; text-align: left; }
.ec-ai-sum-extra ul { margin: 4px 0 4px 18px; padding: 0; font-size: 14px; line-height: 1.55; }
.ec-ai-sum-extra small { color: #777; }

/* Questions for the dealer (2026-10-19) */
.ec-ai-qs { margin: 12px 0 14px; text-align: left; }
.ec-ai-qs-sub { margin: 2px 0 8px; font-size: 13px; color: #666; }
.ec-ai-q { padding: 10px 12px; margin: 0 0 8px; border: 1px solid #e3e3e3; border-left: 4px solid #e0a800; border-radius: 6px; background: #fffaf0; }
.ec-ai-q.is-done { border-left-color: #2e8b57; background: #f6fbf8; }
.ec-ai-q-text { margin: 0 0 8px; font-size: 14px; line-height: 1.45; color: #222; }
.ec-ai-q-imp { display: inline-block; margin-left: 4px; padding: 1px 8px; border-radius: 999px; background: #fff1c2; color: #6b4b00; font-size: 12px; font-weight: 600; white-space: nowrap; }
.ec-ai-q.is-done .ec-ai-q-imp { background: #e4f3ea; color: #23633f; }
.ec-ai-q-rem { display: inline-block; margin-left: 4px; font-size: 12px; color: #23633f; }
.ec-ai-q-btns { display: flex; flex-wrap: wrap; gap: 6px; }
button.ec-ai-qbtn {
    all: unset; box-sizing: border-box; cursor: pointer; padding: 6px 12px !important; border: 1px solid #bbb !important; border-radius: 6px !important;
    background: #fff !important; color: #333 !important; font-family: inherit !important; font-size: 13px !important; font-weight: 600 !important; line-height: 1.3 !important;
}
button.ec-ai-qbtn:hover, button.ec-ai-qbtn:focus-visible { border-color: #6f23a8 !important; color: #6f23a8 !important; }
button.ec-ai-qbtn.is-on { background: #6f23a8 !important; border-color: #6f23a8 !important; color: #fff !important; }
button.ec-ai-qbtn small { font-weight: 400; opacity: .75; }
.ec-ai-count-ok { background: #e4f3ea !important; color: #23633f !important; }
details.ec-ai-sum-qs { margin: 10px 0; text-align: left; }
details.ec-ai-sum-qs summary { cursor: pointer; font-size: 14px; }
details.ec-ai-sum-qs ul { margin: 6px 0 0 18px; font-size: 13px; line-height: 1.5; }
.ec-ai-review-qline { margin: 0 0 6px; }
button.ec-ai-review-qs {
    all: unset; cursor: pointer; margin-left: 4px; padding: 3px 10px !important; border-radius: 999px !important; background: #6f23a8 !important; color: #fff !important;
    font-size: 13px !important; font-weight: 600 !important;
}
.ec-ai-q.is-minor { border-left-color: #c9c9c9; background: #fafafa; }
details.ec-ai-q-minor { margin: 4px 0 8px; }
details.ec-ai-q-minor summary { cursor: pointer; font-size: 13px; color: #555; margin-bottom: 6px; }

/* Plan-read status bar (2026-10-20): reading / finished → fill in / failed → try again. */
#ec-ai-prefill .ec-ai-readbar { display: flex; align-items: center; gap: 12px; padding: 10px 16px; margin: 0; font-size: 14px; line-height: 1.4; border-bottom: 1px solid transparent; }
#ec-ai-prefill .ec-ai-readbar > i { font-size: 20px; flex: 0 0 auto; }
#ec-ai-prefill .ec-ai-readbar-text { flex: 1 1 0; min-width: 12em; }
#ec-ai-prefill .ec-ai-readbar-text span { display: block; font-size: 12.5px; opacity: .85; margin-top: 2px; }
#ec-ai-prefill .ec-ai-readbar.is-running { background: #f3ecfa; color: #3d1466; border-color: #dccbef; }
#ec-ai-prefill .ec-ai-readbar.is-running > i { color: #6f23a8; }
#ec-ai-prefill .ec-ai-readbar.is-done { background: #e8f6ec; color: #145c2c; border-color: #bfe3c9; }
#ec-ai-prefill .ec-ai-readbar.is-done > i { color: #1f8a43; }
#ec-ai-prefill .ec-ai-readbar.is-failed { background: #fdecec; color: #7a1a1a; border-color: #f2c4c4; }
#ec-ai-prefill .ec-ai-readbar.is-failed > i { color: #c1272d; }
#ec-ai-prefill .ec-ai-readbar-btn { flex: 0 0 auto !important; width: auto !important; max-width: none; height: auto; margin: 0; display: inline-block;
  border: 0; border-radius: 6px; padding: 9px 18px; font-weight: 600; font-size: 14px; line-height: 1.2; text-transform: none; letter-spacing: normal;
  white-space: nowrap; cursor: pointer; color: #fff; background: #1f8a43; }
#ec-ai-prefill .ec-ai-readbar.is-failed .ec-ai-readbar-btn { background: #c1272d; }
#ec-ai-prefill .ec-ai-readbar-btn:hover { filter: brightness(1.08); }
@media (max-width: 640px) {
  #ec-ai-prefill .ec-ai-readbar { flex-wrap: wrap; padding: 10px 12px; }
  #ec-ai-prefill .ec-ai-readbar-btn { width: 100% !important; white-space: normal; }
}

/* Start over (2026-10-20) — sits beside Clear page, same quiet style. */
#ec-ai-prefill .ec-ai-start-over { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: #777; cursor: pointer; padding: 4px 8px; border-radius: 4px; }
#ec-ai-prefill .ec-ai-start-over:hover { color: #c1272d; background: #fbeaea; }
/* Manual mode bar + quiet bar buttons */
#ec-ai-prefill .ec-ai-readbar.is-off { background: #f2f3f5; color: #333; border-color: #dfe1e5; }
#ec-ai-prefill .ec-ai-readbar.is-off > i { color: #666; }
#ec-ai-prefill .ec-ai-readbar-btn.is-quiet { background: #fff; color: #5a2a8a; border: 1px solid #cdb8e0; }
#ec-ai-prefill .ec-ai-readbar.is-failed .ec-ai-readbar-btn.is-quiet { background: #fff; color: #7a1a1a; border-color: #f2c4c4; }

/* Minimize on the waiting windows + corner notice + 3D strip (2026-10-20). */
.ec-ai-min-row { margin-top: 14px; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.ec-ai-min-row span { font-size: 12px; color: #666; max-width: 420px; }
button.ec-ai-minimize { width: auto !important; display: inline-flex !important; align-items: center; gap: 8px; padding: 9px 18px !important; margin: 0 !important;
  border: 1px solid #cdb8e0 !important; border-radius: 6px; background: #fff !important; color: #5a2a8a !important; font-weight: 600; font-size: 14px; text-transform: none; cursor: pointer; }
button.ec-ai-minimize:hover { background: #f6f0fb !important; }
#ec-ai-notice { position: fixed; right: 20px; bottom: 20px; z-index: 2147483000; width: 340px; max-width: calc(100vw - 32px); box-sizing: border-box;
  background: #fff; border: 1px solid #bfe3c9; border-left: 5px solid #1f8a43; border-radius: 8px; box-shadow: 0 8px 28px rgba(0,0,0,.18); padding: 14px 16px 14px; font-size: 14px; color: #222; }
#ec-ai-notice.is-error { border-color: #f2c4c4; border-left-color: #c1272d; }
#ec-ai-notice strong { display: block; padding-right: 22px; }
#ec-ai-notice span { display: block; margin-top: 4px; font-size: 12.5px; color: #555; }
#ec-ai-notice .ec-ai-notice-go { margin-top: 10px; width: auto !important; display: inline-block; border: 0; border-radius: 6px; padding: 8px 16px; font-weight: 600; font-size: 14px;
  color: #fff; background: #1f8a43; cursor: pointer; text-transform: none; }
#ec-ai-notice.is-error .ec-ai-notice-go { background: #c1272d; }
#ec-ai-notice .ec-ai-notice-x { position: absolute; top: 6px; right: 8px; width: auto !important; border: 0; background: none; font-size: 20px; line-height: 1; color: #888; cursor: pointer; padding: 2px 6px; }
@media (max-width: 640px) { #ec-ai-notice { right: 16px; left: 16px; bottom: 16px; width: auto; } }
#ec-ai-prefill .ec-ai-readbar.is-model { background: #e9f6f3; color: #10473d; border-color: #c4e6de; padding-top: 7px; padding-bottom: 7px; }
#ec-ai-prefill .ec-ai-readbar.is-model > i { color: #1a7f6b; font-size: 17px; }

/* The status bars live inside the sticky toolbar (full-width last row) so they stay in view while scrolling. */
#ec-ai-prefill .ec-ai-toolbar > .ec-ai-readbar { flex: 1 1 100%; order: 99; border: 1px solid; border-radius: 8px; margin: 2px 0 0; padding: 8px 12px; box-sizing: border-box; }
#ec-ai-prefill .ec-ai-toolbar > .ec-ai-readbar .ec-ai-readbar-text span { font-size: 12px; }

/* Floating progress pill while the status bars are out of view (2026-10-20). */
#ec-ai-pill { position: fixed; left: 20px; bottom: 20px; z-index: 2147482999; width: auto !important; display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 16px; margin: 0; border: 0; border-radius: 999px; background: #3d1466; color: #fff; font-size: 13px; font-weight: 600; text-transform: none;
  box-shadow: 0 6px 20px rgba(0,0,0,.22); cursor: pointer; max-width: calc(100vw - 32px); }
@media (max-width: 640px) { #ec-ai-pill { left: 16px; bottom: 16px; } }