:root {
    --rpqt-saas-bg:#f6f4ef;
    --rpqt-saas-card:#fff;
    --rpqt-saas-soft:#fbfaf6;
    --rpqt-saas-line:#e9e3d8;
    --rpqt-saas-text:#202722;
    --rpqt-saas-muted:#65736b;
    --rpqt-saas-green:#00a878;
    --rpqt-saas-green-dark:#008f67;
    --rpqt-saas-shadow:0 18px 45px rgba(31,39,34,.10);
}
.rpqt-saas-app,
.rpqt-saas-auth {
    font-family: Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
    color:var(--rpqt-saas-text);
}
.rpqt-saas-auth {
    max-width:1200px;
    margin:40px auto;
    display:grid;
    grid-template-columns:1.1fr .9fr .9fr;
    gap:24px;
}
.rpqt-auth-card,
.rpqt-saas-card,
.rpqt-price-card {
    background:var(--rpqt-saas-card);
    border:1px solid var(--rpqt-saas-line);
    border-radius:28px;
    padding:28px;
    box-shadow:var(--rpqt-saas-shadow);
}
.rpqt-auth-hero {
    background:linear-gradient(135deg,#203128,#006b4d);
    color:#fff;
}
.rpqt-auth-hero p,
.rpqt-auth-hero li { color:#edf8f3; }
.rpqt-auth-card h1,
.rpqt-auth-card h2,
.rpqt-saas-card h1,
.rpqt-saas-card h2,
.rpqt-price-card h2 {
    margin-top:0;
    font-weight:900;
    letter-spacing:-.03em;
}
.rpqt-saas-nav {
    max-width:1220px;
    margin:22px auto;
    display:flex;
    gap:10px;
    align-items:center;
    background:rgba(255,255,255,.92);
    border:1px solid var(--rpqt-saas-line);
    border-radius:999px;
    padding:8px;
    box-shadow:0 8px 24px rgba(31,39,34,.08);
}
.rpqt-saas-nav a {
    text-decoration:none;
    color:var(--rpqt-saas-text);
    font-weight:850;
    padding:10px 16px;
    border-radius:999px;
}
.rpqt-saas-nav a:hover {
    background:#ecfff7;
    color:var(--rpqt-saas-green-dark);
}
.rpqt-saas-page {
    max-width:1220px;
    margin:0 auto 40px;
    display:grid;
    gap:22px;
}
.rpqt-status-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:14px;
    margin-top:18px;
}
.rpqt-stat {
    background:var(--rpqt-saas-soft);
    border:1px solid var(--rpqt-saas-line);
    border-radius:20px;
    padding:16px;
}
.rpqt-stat span,
.rpqt-stat small {
    display:block;
    color:var(--rpqt-saas-muted);
    font-size:12px;
}
.rpqt-stat strong {
    display:block;
    font-size:20px;
    margin-top:4px;
}
.rpqt-inline-form {
    display:grid;
    gap:14px;
}
.rpqt-inline-form label,
.rpqt-auth-card label {
    display:grid;
    gap:6px;
    color:#435048;
    font-weight:850;
    font-size:13px;
}
.rpqt-inline-form input,
.rpqt-inline-form textarea,
.rpqt-auth-card input,
.rpqt-auth-card textarea,
.rpqt-logo-line input {
    width:100%;
    border:1px solid #ded8cd;
    border-radius:14px;
    min-height:44px;
    padding:10px 12px;
    background:#fff;
}
.rpqt-inline-form input:focus,
.rpqt-inline-form textarea:focus,
.rpqt-auth-card input:focus,
.rpqt-auth-card textarea:focus {
    border-color:var(--rpqt-saas-green);
    box-shadow:0 0 0 4px rgba(0,168,120,.13);
    outline:none;
}
.rpqt-saas-primary,
.rpqt-saas-primary-link,
.rpqt-saas-secondary,
.rpqt-saas-secondary-link {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    padding:11px 18px;
    font-weight:900;
    text-decoration:none;
    border:1px solid transparent;
    cursor:pointer;
}
.rpqt-saas-primary,
.rpqt-saas-primary-link {
    background:var(--rpqt-saas-green);
    border-color:var(--rpqt-saas-green);
    color:#fff;
    box-shadow:0 8px 22px rgba(0,168,120,.24);
}
.rpqt-saas-primary:hover,
.rpqt-saas-primary-link:hover {
    background:var(--rpqt-saas-green-dark);
    color:#fff;
}
.rpqt-saas-secondary,
.rpqt-saas-secondary-link {
    background:#fff;
    border-color:#d8d2c8;
    color:var(--rpqt-saas-text);
}
.rpqt-pricing-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:22px;
}
.rpqt-price-card.featured {
    border-color:var(--rpqt-saas-green);
    box-shadow:0 0 0 4px rgba(0,168,120,.12), var(--rpqt-saas-shadow);
}
.rpqt-price {
    font-size:42px;
    font-weight:950;
    letter-spacing:-.04em;
}
.rpqt-price span {
    font-size:16px;
    color:var(--rpqt-saas-muted);
}
.rpqt-quote-list {
    display:grid;
    gap:10px;
}
.rpqt-quote-row {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    background:var(--rpqt-saas-soft);
    border:1px solid var(--rpqt-saas-line);
    border-radius:18px;
    padding:14px;
}
.rpqt-quote-row strong,
.rpqt-quote-row span {
    display:block;
}
.rpqt-quote-row span {
    color:var(--rpqt-saas-muted);
    font-size:13px;
}
.rpqt-logo-line {
    display:grid;
    grid-template-columns:1fr auto;
    gap:10px;
}
.rpqt-logo-preview {
    max-width:240px;
    border:1px solid var(--rpqt-saas-line);
    border-radius:16px;
    padding:10px;
    background:#fff;
}
.rpqt-saas-editor {
    max-width:1500px;
    margin:20px auto 50px;
    font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
.rpqt-editor-top {
    position:sticky;
    top:0;
    z-index:100;
    display:flex;
    gap:16px;
    align-items:center;
    justify-content:space-between;
    background:rgba(255,255,255,.95);
    border:1px solid var(--rpqt-saas-line);
    border-radius:22px;
    padding:14px 18px;
    margin-bottom:16px;
    box-shadow:0 10px 30px rgba(31,39,34,.08);
    backdrop-filter:blur(12px);
}
.rpqt-editor-top h1 {
    margin:0;
    font-size:22px;
}
.rpqt-saas-editor .postbox {
    border:0;
    border-radius:24px;
    box-shadow:var(--rpqt-saas-shadow);
    overflow:hidden;
    background:#fff;
    margin-bottom:20px;
}
.rpqt-saas-editor .postbox-header {
    display:none;
}
.rpqt-saas-editor .inside {
    padding:20px !important;
}
.rpqt-save-footer {
    text-align:right;
    margin:20px 0;
}
@media(max-width:1000px){
    .rpqt-saas-auth,
    .rpqt-pricing-grid,
    .rpqt-status-grid { grid-template-columns:1fr; }
    .rpqt-saas-nav { border-radius:22px; flex-wrap:wrap; }
}

.rpqt-error{background:#fff1f0;border:1px solid #ffc4bd;color:#9b2115;border-radius:14px;padding:10px 12px;margin-bottom:12px;font-weight:800;}


/* v2.0.2 frontend editor refinement - cleaner, compact, full-width app feel */
.rpqt-saas-editor {
    max-width: none !important;
    width: calc(100vw - 36px);
    margin: 10px 18px 30px !important;
}
.rpqt-saas-editor .rpqt-editor-top {
    border-radius: 14px;
    padding: 10px 14px;
    margin-bottom: 10px;
    min-height: 48px;
}
.rpqt-saas-editor .rpqt-editor-top h1 {
    font-size: 18px;
    font-weight: 750;
}
.rpqt-saas-editor .rpqt-editor-top a {
    font-size: 13px;
    text-decoration: none;
    color: #3c4043;
}
.rpqt-saas-editor .postbox {
    border-radius: 14px !important;
    box-shadow: 0 1px 2px rgba(60,64,67,.08), 0 2px 8px rgba(60,64,67,.06) !important;
    margin-bottom: 12px !important;
}
.rpqt-saas-editor .inside {
    padding: 10px !important;
}

/* Wider drawing area and slimmer sections column */
.rpqt-saas-editor .rpqt-main-layout {
    grid-template-columns: minmax(760px, 1fr) 390px !important;
    gap: 14px !important;
    align-items: start !important;
}
.rpqt-saas-editor .rpqt-drawing-panel,
.rpqt-saas-editor .rpqt-sections-panel {
    border-radius: 16px !important;
    padding: 12px !important;
    box-shadow: 0 1px 3px rgba(60,64,67,.10), 0 6px 18px rgba(60,64,67,.06) !important;
}
.rpqt-saas-editor .rpqt-sections-panel {
    max-height: calc(100vh - 90px) !important;
    top: 70px !important;
    width: 390px;
}
.rpqt-saas-editor .rpqt-sections-panel h3 {
    font-size: 16px;
    margin-bottom: 6px;
}
.rpqt-saas-editor .rpqt-sections-panel > .description {
    font-size: 12px;
    margin-bottom: 8px;
}

/* Compact toolbar - Google-style chips */
.rpqt-saas-editor .rpqt-toolbar {
    top: 62px !important;
    border-radius: 14px !important;
    padding: 8px !important;
    gap: 6px !important;
    box-shadow: 0 1px 2px rgba(60,64,67,.10), 0 4px 12px rgba(60,64,67,.08) !important;
}
.rpqt-saas-editor .rpqt-toolbar .button,
.rpqt-saas-editor .rpqt-page-controls .button,
.rpqt-saas-editor .rpqt-manual-scale .button,
.rpqt-saas-editor .rpqt-section .button,
.rpqt-saas-editor .rpqt-drawing-card .button,
.rpqt-saas-editor #rpqt_add_section {
    min-height: 30px !important;
    padding: 1px 10px !important;
    border-radius: 18px !important;
    font-size: 12px !important;
    font-weight: 650 !important;
}
.rpqt-saas-editor .rpqt-export-option {
    padding: 4px 8px !important;
    font-size: 12px !important;
    border-radius: 18px !important;
}

/* Drawing controls are now slimmer */
.rpqt-saas-editor .rpqt-drawings-box,
.rpqt-saas-editor .rpqt-page-controls,
.rpqt-saas-editor .rpqt-manual-scale {
    border-radius: 14px !important;
    padding: 8px 10px !important;
    margin-bottom: 8px !important;
    box-shadow: none !important;
}
.rpqt-saas-editor .rpqt-drawings-header strong {
    font-size: 14px;
}
.rpqt-saas-editor .rpqt-drawings-header .description,
.rpqt-saas-editor .rpqt-manual-scale .description {
    font-size: 12px;
}
.rpqt-saas-editor .rpqt-drawing-card {
    border-radius: 12px !important;
    padding: 7px 9px !important;
    margin: 5px 0 !important;
}
.rpqt-saas-editor .rpqt-page-controls,
.rpqt-saas-editor .rpqt-manual-scale {
    gap: 8px !important;
}
.rpqt-saas-editor .rpqt-scale-chip {
    padding: 5px 9px !important;
    font-size: 12px !important;
}

/* Larger, calmer canvas space */
.rpqt-saas-editor #rpqt_canvas_wrap {
    min-height: calc(100vh - 235px) !important;
    height: calc(100vh - 235px);
    border-radius: 14px !important;
    background: #f8f9fa !important;
}
.rpqt-saas-editor #rpqt_pdf_canvas,
.rpqt-saas-editor #rpqt_overlay_canvas {
    transform-origin: top left;
}

/* Compact section cards */
.rpqt-saas-editor .rpqt-section {
    border-radius: 14px !important;
    padding: 8px !important;
    margin: 8px 0 !important;
    box-shadow: 0 1px 2px rgba(60,64,67,.08) !important;
}
.rpqt-saas-editor .rpqt-section:hover {
    transform: none !important;
}
.rpqt-saas-editor .rpqt-section-header {
    margin: -8px -8px 8px !important;
    padding: 8px 10px !important;
    border-radius: 14px 14px 0 0 !important;
}
.rpqt-saas-editor .rpqt-section-header strong {
    font-size: 13px;
    line-height: 1.2;
}
.rpqt-saas-editor .rpqt-section-header-total {
    padding: 4px 8px !important;
    font-size: 11px !important;
}
.rpqt-saas-editor .rpqt-toggle-section {
    width: 24px !important;
    height: 24px !important;
}
.rpqt-saas-editor .rpqt-row {
    gap: 7px !important;
}
.rpqt-saas-editor .rpqt-row label,
.rpqt-saas-editor .rpqt-extras-head strong,
.rpqt-saas-editor .rpqt-details-grid strong {
    font-size: 11px !important;
    font-weight: 700 !important;
}
.rpqt-saas-editor .rpqt-section input,
.rpqt-saas-editor .rpqt-section textarea,
.rpqt-saas-editor .rpqt-section select,
.rpqt-saas-editor .rpqt-details-grid input,
.rpqt-saas-editor .rpqt-details-grid textarea,
.rpqt-saas-editor .rpqt-details-grid select,
.rpqt-saas-editor .rpqt-page-controls input,
.rpqt-saas-editor .rpqt-manual-scale input {
    min-height: 34px !important;
    border-radius: 10px !important;
    padding: 6px 9px !important;
    font-size: 13px !important;
}
.rpqt-saas-editor .rpqt-section textarea {
    min-height: 54px !important;
}
.rpqt-saas-editor .rpqt-small-muted {
    border-radius: 10px !important;
    padding: 7px 8px !important;
    line-height: 1.45 !important;
    font-size: 11px !important;
}
.rpqt-saas-editor .rpqt-extras-box,
.rpqt-saas-editor .rpqt-measurements {
    border-radius: 10px !important;
    padding: 7px !important;
}
.rpqt-saas-editor .rpqt-measurement-pill {
    border-radius: 9px !important;
    padding: 6px 7px !important;
    font-size: 11px !important;
}
.rpqt-saas-editor .rpqt-total-box {
    border-radius: 14px !important;
    padding: 12px !important;
    font-size: 16px !important;
}

/* Customer details card should not be bulky */
.rpqt-saas-editor .rpqt-details-grid {
    border-radius: 14px !important;
    padding: 10px !important;
    gap: 8px 12px !important;
}

/* Save bar */
.rpqt-saas-editor .rpqt-save-footer {
    position: sticky;
    bottom: 12px;
    z-index: 60;
    text-align: right;
    pointer-events: none;
}
.rpqt-saas-editor .rpqt-save-footer .rpqt-saas-primary {
    pointer-events: auto;
}

/* Full width on smaller screens */
@media (max-width: 1180px) {
    .rpqt-saas-editor {
        width: calc(100vw - 20px);
        margin: 8px 10px 30px !important;
    }
    .rpqt-saas-editor .rpqt-main-layout {
        grid-template-columns: 1fr !important;
    }
    .rpqt-saas-editor .rpqt-sections-panel {
        width: auto;
        position: static !important;
        max-height: none !important;
    }
}


/* v2.0.3 overflow fix */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

.rpqt-saas-app,
.rpqt-saas-editor,
.rpqt-saas-editor *,
.rpqt-saas-page,
.rpqt-saas-card {
    box-sizing: border-box;
}

.rpqt-saas-editor {
    width: 100% !important;
    max-width: 100% !important;
    margin: 8px 0 30px !important;
    padding: 0 10px !important;
    overflow-x: hidden !important;
}

.rpqt-saas-editor .rpqt-editor-top {
    width: 100% !important;
    max-width: 100% !important;
}

.rpqt-saas-editor #rpqt_saas_quote_form,
.rpqt-saas-editor #rp_quote_details,
.rpqt-saas-editor #rp_quote_takeoff,
.rpqt-saas-editor .postbox,
.rpqt-saas-editor .inside {
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
}

.rpqt-saas-editor .rpqt-main-layout {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: minmax(0, 1fr) 360px !important;
    gap: 12px !important;
    overflow: hidden !important;
}

.rpqt-saas-editor .rpqt-drawing-panel {
    min-width: 0 !important;
    width: 100% !important;
    overflow: hidden !important;
}

.rpqt-saas-editor .rpqt-sections-panel {
    width: 360px !important;
    min-width: 0 !important;
    max-width: 360px !important;
}

.rpqt-saas-editor .rpqt-toolbar {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    white-space: nowrap !important;
    flex-wrap: nowrap !important;
    scrollbar-width: thin;
}

.rpqt-saas-editor .rpqt-toolbar .button,
.rpqt-saas-editor .rpqt-toolbar label {
    flex: 0 0 auto !important;
}

.rpqt-saas-editor .rpqt-drawings-box,
.rpqt-saas-editor .rpqt-page-controls,
.rpqt-saas-editor .rpqt-manual-scale,
.rpqt-saas-editor #rpqt_canvas_wrap {
    max-width: 100% !important;
}

.rpqt-saas-editor .rpqt-drawing-card {
    max-width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(160px, 1fr) auto auto auto !important;
    gap: 10px !important;
}

.rpqt-saas-editor .rpqt-drawing-card input {
    max-width: 100% !important;
}

.rpqt-saas-editor #rpqt_canvas_wrap {
    overflow: auto !important;
}

.rpqt-saas-editor #rpqt_pdf_canvas,
.rpqt-saas-editor #rpqt_overlay_canvas {
    max-width: none !important;
}

/* Hide the browser-level sideways push caused by very wide PDF canvases. Canvas scroll remains inside the drawing panel. */
.rpqt-saas-editor .rpqt-drawing-panel {
    contain: layout paint;
}

@media (max-width: 1280px) {
    .rpqt-saas-editor .rpqt-main-layout {
        grid-template-columns: 1fr !important;
    }
    .rpqt-saas-editor .rpqt-sections-panel {
        width: 100% !important;
        max-width: 100% !important;
        position: static !important;
    }
}


/* v2.0.4 wider canvas + stacked toolbar + cleaner section actions */
html,
body {
    overflow-x: hidden !important;
}

.rpqt-saas-editor {
    width: 100% !important;
    max-width: none !important;
    margin: 6px 0 24px !important;
    padding: 0 6px !important;
}

.rpqt-saas-editor .rpqt-editor-top {
    border-radius: 10px !important;
    margin: 0 0 8px !important;
}

/* remove big side gutters from the editor cards */
.rpqt-saas-editor #rpqt_saas_quote_form,
.rpqt-saas-editor .postbox,
.rpqt-saas-editor .inside {
    width: 100% !important;
    max-width: 100% !important;
}

.rpqt-saas-editor .inside {
    padding: 6px !important;
}

.rpqt-saas-editor #rp_quote_details {
    margin-bottom: 8px !important;
}

.rpqt-saas-editor #rp_quote_takeoff {
    margin-bottom: 8px !important;
}

/* Main workspace: drawing gets most of the page */
.rpqt-saas-editor .rpqt-main-layout {
    width: 100% !important;
    max-width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 340px !important;
    gap: 10px !important;
    align-items: start !important;
    overflow: hidden !important;
}

.rpqt-saas-editor .rpqt-drawing-panel {
    min-width: 0 !important;
    width: 100% !important;
    padding: 8px !important;
}

.rpqt-saas-editor .rpqt-sections-panel {
    width: 340px !important;
    max-width: 340px !important;
    padding: 10px !important;
    max-height: calc(100vh - 78px) !important;
    top: 58px !important;
}

/* Toolbar stacked/wrapped again, no horizontal scrolling */
.rpqt-saas-editor .rpqt-toolbar {
    position: sticky !important;
    top: 56px !important;
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important;
    overflow: visible !important;
    white-space: normal !important;
    gap: 5px !important;
    padding: 7px !important;
    border-radius: 10px !important;
}

.rpqt-saas-editor .rpqt-toolbar .button,
.rpqt-saas-editor .rpqt-toolbar label {
    flex: 0 0 auto !important;
}

/* Make controls smaller so wrapped toolbar doesn't use too much height */
.rpqt-saas-editor .rpqt-toolbar .button {
    min-height: 28px !important;
    padding: 0 9px !important;
    font-size: 11px !important;
    line-height: 26px !important;
}

.rpqt-saas-editor .rpqt-export-option {
    min-height: 28px !important;
    padding: 3px 8px !important;
    font-size: 11px !important;
}

/* Compact drawing setup cards */
.rpqt-saas-editor .rpqt-drawings-box,
.rpqt-saas-editor .rpqt-page-controls,
.rpqt-saas-editor .rpqt-manual-scale {
    padding: 7px 9px !important;
    border-radius: 10px !important;
    margin-bottom: 6px !important;
}

.rpqt-saas-editor .rpqt-drawing-card {
    display: grid !important;
    grid-template-columns: minmax(150px, 1fr) 52px 44px 70px !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 7px !important;
    border-radius: 10px !important;
}

.rpqt-saas-editor .rpqt-drawing-card label,
.rpqt-saas-editor .rpqt-drawing-card strong {
    min-width: 0 !important;
}

.rpqt-saas-editor .rpqt-drawing-card input {
    max-width: 100% !important;
    min-height: 32px !important;
}

/* Bigger canvas area */
.rpqt-saas-editor #rpqt_canvas_wrap {
    width: 100% !important;
    max-width: 100% !important;
    height: calc(100vh - 205px) !important;
    min-height: calc(100vh - 205px) !important;
    overflow: auto !important;
    border-radius: 10px !important;
}

.rpqt-saas-editor #rpqt_pdf_canvas,
.rpqt-saas-editor #rpqt_overlay_canvas {
    max-width: none !important;
}

/* Section card header: stop Use/Delete breaking out */
.rpqt-saas-editor .rpqt-section {
    overflow: hidden !important;
    border-radius: 12px !important;
}

.rpqt-saas-editor .rpqt-section-header {
    display: grid !important;
    grid-template-columns: 26px 34px minmax(0, 1fr) auto !important;
    gap: 6px !important;
    align-items: center !important;
    padding: 7px 8px !important;
}

.rpqt-saas-editor .rpqt-section-header > span:last-child {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 4px !important;
    min-width: 64px !important;
}

.rpqt-saas-editor .rpqt-section-header .button,
.rpqt-saas-editor .rpqt-section-header .button-link-delete {
    width: 64px !important;
    min-height: 28px !important;
    padding: 0 !important;
    text-align: center !important;
    justify-content: center !important;
    font-size: 11px !important;
    line-height: 26px !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
}

.rpqt-saas-editor .rpqt-section-header .button-link-delete {
    display: inline-flex !important;
    align-items: center !important;
    border: 1px solid #e34b6b !important;
    background: #fff !important;
    text-decoration: none !important;
}

.rpqt-saas-editor .rpqt-section-header strong {
    font-size: 12px !important;
    line-height: 1.15 !important;
    overflow-wrap: anywhere !important;
}

.rpqt-saas-editor .rpqt-section-header-total {
    font-size: 10px !important;
    padding: 4px 7px !important;
    white-space: nowrap !important;
}

/* Slimmer section content */
.rpqt-saas-editor .rpqt-section {
    padding: 7px !important;
    margin: 7px 0 !important;
}

.rpqt-saas-editor .rpqt-row {
    grid-template-columns: 1fr 1fr !important;
    gap: 6px !important;
}

.rpqt-saas-editor .rpqt-section input,
.rpqt-saas-editor .rpqt-section textarea,
.rpqt-saas-editor .rpqt-section select {
    min-height: 31px !important;
    font-size: 12px !important;
    padding: 5px 7px !important;
}

.rpqt-saas-editor .rpqt-section textarea {
    min-height: 46px !important;
}

/* Details at top take less vertical space */
.rpqt-saas-editor .rpqt-details-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    padding: 8px !important;
    gap: 7px 10px !important;
}

.rpqt-saas-editor .rpqt-details-grid input,
.rpqt-saas-editor .rpqt-details-grid textarea,
.rpqt-saas-editor .rpqt-details-grid select {
    min-height: 31px !important;
    font-size: 12px !important;
    padding: 5px 7px !important;
}

/* Keep layout usable on medium screens */
@media (max-width: 1180px) {
    .rpqt-saas-editor .rpqt-main-layout {
        grid-template-columns: 1fr !important;
    }

    .rpqt-saas-editor .rpqt-sections-panel {
        width: 100% !important;
        max-width: 100% !important;
        position: static !important;
        max-height: none !important;
    }
}


/* v2.0.5 full-width workspace + collapsed sections + cleaner section actions */

/* Break out of theme/page container and use the full browser width */
.rpqt-saas-app {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding: 0 10px !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
}

.rpqt-saas-editor {
    width: 100% !important;
    max-width: 100% !important;
    margin: 4px 0 20px !important;
    padding: 0 !important;
}

/* Keep editor top full width too */
.rpqt-saas-editor .rpqt-editor-top {
    width: 100% !important;
    max-width: 100% !important;
    border-radius: 10px !important;
    padding: 8px 12px !important;
}

/* Main work area takes nearly the full screen */
.rpqt-saas-editor .rpqt-main-layout {
    grid-template-columns: minmax(0, 1fr) 330px !important;
    gap: 8px !important;
    width: 100% !important;
}

.rpqt-saas-editor .rpqt-drawing-panel {
    width: 100% !important;
    min-width: 0 !important;
}

.rpqt-saas-editor .rpqt-sections-panel {
    width: 330px !important;
    max-width: 330px !important;
    min-width: 330px !important;
    padding: 9px !important;
}

/* Bigger canvas area */
.rpqt-saas-editor #rpqt_canvas_wrap {
    height: calc(100vh - 190px) !important;
    min-height: calc(100vh - 190px) !important;
}

/* Toolbar wraps normally and uses full width */
.rpqt-saas-editor .rpqt-toolbar {
    flex-wrap: wrap !important;
    white-space: normal !important;
    overflow: visible !important;
    width: 100% !important;
    border-radius: 10px !important;
    padding: 6px !important;
    margin-bottom: 8px !important;
}

/* Quote sections collapsed by default visually until opened */
.rpqt-saas-editor .rpqt-section:not(.active) .rpqt-section-body {
    display: none !important;
}

/* Section header cleaned up */
.rpqt-saas-editor .rpqt-section-header {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 8px !important;
    min-height: 42px !important;
}

.rpqt-saas-editor .rpqt-section-header > strong {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: none !important;
    font-size: 12px !important;
    line-height: 1.15 !important;
    overflow-wrap: anywhere !important;
}

.rpqt-saas-editor .rpqt-section-header-total {
    flex: 0 0 auto !important;
    margin-left: auto !important;
    font-size: 10px !important;
    padding: 4px 7px !important;
    max-width: 86px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Make Use/Delete a neat compact action group */
.rpqt-saas-editor .rpqt-section-header > span:last-child {
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    margin-left: 0 !important;
    min-width: auto !important;
}

.rpqt-saas-editor .rpqt-section-header .rpqt-select-section,
.rpqt-saas-editor .rpqt-section-header .rpqt-delete-section {
    width: auto !important;
    min-width: 44px !important;
    min-height: 26px !important;
    height: 26px !important;
    padding: 0 9px !important;
    font-size: 11px !important;
    line-height: 24px !important;
    border-radius: 999px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    justify-content: center !important;
}

.rpqt-saas-editor .rpqt-section-header .rpqt-select-section {
    background: #fff !important;
    border: 1px solid #d8d2c8 !important;
    color: #202722 !important;
}

.rpqt-saas-editor .rpqt-section-header .rpqt-delete-section {
    display: inline-flex !important;
    align-items: center !important;
    text-decoration: none !important;
    background: #fff5f3 !important;
    border: 1px solid #f0b6ad !important;
    color: #b42318 !important;
    font-weight: 800 !important;
}

/* Current/active card should still show body when selected */
.rpqt-saas-editor .rpqt-section.active .rpqt-section-body {
    display: block !important;
}

/* Less white space in top customer area */
.rpqt-saas-editor #rp_quote_details .inside,
.rpqt-saas-editor #rp_quote_takeoff .inside {
    padding: 5px !important;
}

.rpqt-saas-editor .rpqt-details-grid {
    margin: 0 !important;
}

/* At normal laptop widths still keep side panel, but reduce width */
@media (max-width: 1100px) {
    .rpqt-saas-editor .rpqt-main-layout {
        grid-template-columns: 1fr !important;
    }
    .rpqt-saas-editor .rpqt-sections-panel {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        position: static !important;
    }
}


/* v2.0.6 section headers + drawing action cleanup */

/* Drawing list: keep Use/Remove inside the card and aligned neatly */
.rpqt-saas-editor .rpqt-drawing-card {
    display: grid !important;
    grid-template-columns: minmax(220px, 1fr) 58px 54px 82px !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 8px 10px !important;
    overflow: hidden !important;
}

.rpqt-saas-editor .rpqt-drawing-card > * {
    min-width: 0 !important;
}

.rpqt-saas-editor .rpqt-drawing-card input {
    width: 100% !important;
    max-width: 280px !important;
}

.rpqt-saas-editor .rpqt-drawing-card .button,
.rpqt-saas-editor .rpqt-drawing-card .button-link-delete,
.rpqt-saas-editor .rpqt-drawing-card button {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 30px !important;
    height: 30px !important;
    padding: 0 8px !important;
    border-radius: 999px !important;
    line-height: 28px !important;
    font-size: 12px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    justify-content: center !important;
    display: inline-flex !important;
    align-items: center !important;
}

.rpqt-saas-editor .rpqt-drawing-card .button-link-delete,
.rpqt-saas-editor .rpqt-drawing-card button:contains("Remove") {
    border: 1px solid #f0b6ad !important;
    background: #fff5f3 !important;
    color: #b42318 !important;
    text-decoration: none !important;
}

/* Quote section cards: clean single-line collapsed summary */
.rpqt-saas-editor .rpqt-section {
    border-radius: 12px !important;
}

.rpqt-saas-editor .rpqt-section-header {
    display: grid !important;
    grid-template-columns: 26px 36px minmax(95px, 1fr) 76px 100px !important;
    align-items: center !important;
    gap: 7px !important;
    min-height: 46px !important;
    padding: 8px !important;
}

.rpqt-saas-editor .rpqt-section-header > strong {
    display: block !important;
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    line-height: 1.15 !important;
    font-size: 12px !important;
}

/* For collapsed cards keep title to two neat lines, not one letter per line */
.rpqt-saas-editor .rpqt-section.collapsed .rpqt-section-header > strong,
.rpqt-saas-editor .rpqt-section:not(.rpqt-open) .rpqt-section-header > strong {
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden !important;
}

.rpqt-saas-editor .rpqt-section-header-total {
    justify-self: end !important;
    max-width: 76px !important;
    min-width: 58px !important;
    text-align: center !important;
    font-size: 10px !important;
    padding: 4px 6px !important;
    white-space: nowrap !important;
}

/* Action group sits in its own final column */
.rpqt-saas-editor .rpqt-section-header > span:last-child {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 4px !important;
    width: 100px !important;
    min-width: 100px !important;
}

.rpqt-saas-editor .rpqt-section-header .rpqt-select-section,
.rpqt-saas-editor .rpqt-section-header .rpqt-delete-section {
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    height: 28px !important;
    min-height: 28px !important;
    padding: 0 !important;
    border-radius: 999px !important;
    font-size: 10.5px !important;
    line-height: 26px !important;
    text-align: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
}

.rpqt-saas-editor .rpqt-section-header .rpqt-delete-section {
    border: 1px solid #f0b6ad !important;
    background: #fff5f3 !important;
    color: #b42318 !important;
    text-decoration: none !important;
}

/* Actually collapse the content. The class is added by the SaaS JS below. */
.rpqt-saas-editor .rpqt-section.rpqt-saas-collapsed .rpqt-section-body,
.rpqt-saas-editor .rpqt-section.collapsed .rpqt-section-body {
    display: none !important;
}

.rpqt-saas-editor .rpqt-section.rpqt-saas-open .rpqt-section-body {
    display: block !important;
}

/* Hide body for all cards on first load until opened */
.rpqt-saas-editor.rpqt-saas-ready .rpqt-section:not(.rpqt-saas-open) .rpqt-section-body {
    display: none !important;
}

/* Slightly widen right panel now header is tidy */
.rpqt-saas-editor .rpqt-main-layout {
    grid-template-columns: minmax(0, 1fr) 360px !important;
}
.rpqt-saas-editor .rpqt-sections-panel {
    width: 360px !important;
    max-width: 360px !important;
    min-width: 360px !important;
}

@media (max-width: 1100px) {
    .rpqt-saas-editor .rpqt-main-layout {
        grid-template-columns: 1fr !important;
    }
    .rpqt-saas-editor .rpqt-sections-panel {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
}


/* v2.0.7 final layout correction: wider sections, smaller drawing side, fixed section header */

/* Give quote sections enough room and take a little from the drawing side */
.rpqt-saas-editor .rpqt-main-layout {
    grid-template-columns: minmax(0, 1fr) 430px !important;
    gap: 10px !important;
}

.rpqt-saas-editor .rpqt-sections-panel {
    width: 430px !important;
    max-width: 430px !important;
    min-width: 430px !important;
    overflow-x: hidden !important;
}

/* Correct section summary layout */
.rpqt-saas-editor .rpqt-section-header {
    display: grid !important;
    grid-template-columns: 28px 42px minmax(120px, 1fr) 88px 96px !important;
    gap: 8px !important;
    align-items: center !important;
    min-height: 44px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* numbering badge */
.rpqt-saas-editor .rpqt-section-header > span:nth-of-type(1),
.rpqt-saas-editor .rpqt-section-header .rpqt-section-number {
    justify-self: center !important;
}

/* title should fit normally */
.rpqt-saas-editor .rpqt-section-header > strong {
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
    line-height: 1.15 !important;
    font-size: 12.5px !important;
    font-weight: 800 !important;
}

/* price pill */
.rpqt-saas-editor .rpqt-section-header-total {
    justify-self: end !important;
    max-width: 88px !important;
    min-width: 72px !important;
    text-align: center !important;
    font-size: 10.5px !important;
    padding: 4px 7px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* action buttons fit side by side */
.rpqt-saas-editor .rpqt-section-header > span:last-child {
    display: grid !important;
    grid-template-columns: 45px 45px !important;
    gap: 5px !important;
    width: 96px !important;
    min-width: 96px !important;
    justify-self: end !important;
    overflow: hidden !important;
}

.rpqt-saas-editor .rpqt-section-header .rpqt-select-section,
.rpqt-saas-editor .rpqt-section-header .rpqt-delete-section {
    width: 45px !important;
    min-width: 45px !important;
    max-width: 45px !important;
    height: 26px !important;
    min-height: 26px !important;
    padding: 0 !important;
    border-radius: 999px !important;
    font-size: 10px !important;
    line-height: 24px !important;
    text-align: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
}

/* Collapse means only header is visible */
.rpqt-saas-editor .rpqt-section.rpqt-saas-collapsed > .rpqt-section-body,
.rpqt-saas-editor .rpqt-section.collapsed > .rpqt-section-body,
.rpqt-saas-editor.rpqt-saas-ready .rpqt-section:not(.rpqt-saas-open) > .rpqt-section-body {
    display: none !important;
}

.rpqt-saas-editor .rpqt-section.rpqt-saas-open > .rpqt-section-body {
    display: block !important;
}

/* When closed, make it look compact */
.rpqt-saas-editor .rpqt-section.rpqt-saas-collapsed,
.rpqt-saas-editor .rpqt-section.collapsed {
    padding-bottom: 0 !important;
}

.rpqt-saas-editor .rpqt-section.rpqt-saas-collapsed .rpqt-section-header,
.rpqt-saas-editor .rpqt-section.collapsed .rpqt-section-header {
    margin-bottom: 0 !important;
    border-radius: 12px !important;
}

/* Drawing cards actions should not overflow */
.rpqt-saas-editor .rpqt-drawing-card {
    grid-template-columns: minmax(220px, 1fr) 60px 50px 78px !important;
}
.rpqt-saas-editor .rpqt-drawing-card .button,
.rpqt-saas-editor .rpqt-drawing-card .button-link-delete,
.rpqt-saas-editor .rpqt-drawing-card button {
    width: 100% !important;
    max-width: 78px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* If the screen is too small, stack rather than squeeze */
@media (max-width: 1250px) {
    .rpqt-saas-editor .rpqt-main-layout {
        grid-template-columns: 1fr !important;
    }
    .rpqt-saas-editor .rpqt-sections-panel {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        position: static !important;
    }
}


/* v2.0.8 fix accordion opening and section action overflow */
.rpqt-saas-editor .rpqt-main-layout {
    grid-template-columns: minmax(0, 1fr) 470px !important;
}

.rpqt-saas-editor .rpqt-sections-panel {
    width: 470px !important;
    min-width: 470px !important;
    max-width: 470px !important;
    overflow-x: hidden !important;
}

/* Safer header grid with enough room for all pills/buttons */
.rpqt-saas-editor .rpqt-section-header {
    display: grid !important;
    grid-template-columns: 28px 42px minmax(155px, 1fr) 92px 118px !important;
    gap: 8px !important;
    align-items: center !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.rpqt-saas-editor .rpqt-section-header > strong {
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
    font-size: 12.5px !important;
    line-height: 1.15 !important;
}

/* Price pill */
.rpqt-saas-editor .rpqt-section-header-total {
    width: 92px !important;
    max-width: 92px !important;
    min-width: 92px !important;
    box-sizing: border-box !important;
    text-align: center !important;
}

/* Use/Delete buttons are contained in a fixed action cell */
.rpqt-saas-editor .rpqt-section-header > span:last-child {
    width: 118px !important;
    min-width: 118px !important;
    max-width: 118px !important;
    display: flex !important;
    gap: 6px !important;
    align-items: center !important;
    justify-content: flex-end !important;
    overflow: visible !important;
}

.rpqt-saas-editor .rpqt-section-header .rpqt-select-section,
.rpqt-saas-editor .rpqt-section-header .rpqt-delete-section {
    width: 54px !important;
    min-width: 54px !important;
    max-width: 54px !important;
    height: 28px !important;
    min-height: 28px !important;
    padding: 0 !important;
    font-size: 10.5px !important;
    line-height: 26px !important;
    border-radius: 999px !important;
}

/* Hide/show only from our explicit classes */
.rpqt-saas-editor .rpqt-section.rpqt-saas-collapsed > .rpqt-section-body {
    display: none !important;
}
.rpqt-saas-editor .rpqt-section.rpqt-saas-open > .rpqt-section-body {
    display: block !important;
}

/* Stop earlier "not open" broad rule causing reopen failures */
.rpqt-saas-editor.rpqt-saas-ready .rpqt-section:not(.rpqt-saas-open) > .rpqt-section-body {
    display: inherit;
}
.rpqt-saas-editor.rpqt-saas-ready .rpqt-section.rpqt-saas-collapsed:not(.rpqt-saas-open) > .rpqt-section-body {
    display: none !important;
}

/* Give drawing side a little less, but still full-width overall */
@media (max-width: 1350px) {
    .rpqt-saas-editor .rpqt-main-layout {
        grid-template-columns: 1fr !important;
    }
    .rpqt-saas-editor .rpqt-sections-panel {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        position: static !important;
    }
}


/* v2.0.9 customer details accordion + section delete containment */

/* Collapse customer details by default on the frontend editor */
.rpqt-saas-editor #rp_quote_details {
    position: relative;
    overflow: hidden !important;
}

.rpqt-saas-editor #rp_quote_details::before {
    content: "Customer Details";
    display: block;
    padding: 11px 14px;
    font-size: 14px;
    font-weight: 850;
    color: #202722;
    background: #fbfaf6;
    border-bottom: 1px solid #e9e3d8;
    cursor: pointer;
}

.rpqt-saas-editor #rp_quote_details::after {
    content: "▸";
    position: absolute;
    right: 16px;
    top: 10px;
    font-weight: 900;
    color: #00a878;
    pointer-events: none;
}

.rpqt-saas-editor #rp_quote_details.rpqt-customer-open::after {
    content: "▾";
}

.rpqt-saas-editor #rp_quote_details:not(.rpqt-customer-open) .inside {
    display: none !important;
}

.rpqt-saas-editor #rp_quote_details.rpqt-customer-open .inside {
    display: block !important;
}

/* Make the section panel slightly wider and fix final action cell clipping */
.rpqt-saas-editor .rpqt-main-layout {
    grid-template-columns: minmax(0, 1fr) 520px !important;
}

.rpqt-saas-editor .rpqt-sections-panel {
    width: 520px !important;
    min-width: 520px !important;
    max-width: 520px !important;
    overflow-x: hidden !important;
}

/* Use six columns: toggle, number, title, total, use, delete */
.rpqt-saas-editor .rpqt-section-header {
    display: grid !important;
    grid-template-columns: 28px 42px minmax(170px, 1fr) 92px 52px 62px !important;
    gap: 7px !important;
    align-items: center !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Split the existing action span into two visual grid cells */
.rpqt-saas-editor .rpqt-section-header > span:last-child {
    display: contents !important;
}

.rpqt-saas-editor .rpqt-section-header .rpqt-select-section {
    grid-column: 5 !important;
}

.rpqt-saas-editor .rpqt-section-header .rpqt-delete-section {
    grid-column: 6 !important;
}

.rpqt-saas-editor .rpqt-section-header .rpqt-select-section,
.rpqt-saas-editor .rpqt-section-header .rpqt-delete-section {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 28px !important;
    min-height: 28px !important;
    padding: 0 7px !important;
    border-radius: 999px !important;
    font-size: 10.5px !important;
    line-height: 26px !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Keep total pill smaller so delete fits */
.rpqt-saas-editor .rpqt-section-header-total {
    width: 92px !important;
    max-width: 92px !important;
    min-width: 92px !important;
    font-size: 10px !important;
}

/* Tighten title but do not squash words */
.rpqt-saas-editor .rpqt-section-header > strong {
    min-width: 0 !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
}

/* If screen is not wide enough, stack the side panel below rather than clipping */
@media (max-width: 1420px) {
    .rpqt-saas-editor .rpqt-main-layout {
        grid-template-columns: 1fr !important;
    }
    .rpqt-saas-editor .rpqt-sections-panel {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        position: static !important;
    }
}


/* v2.0.10 tidy accordions for customer details and drawings */
.rpqt-saas-toggle-box {
    width: 100%;
    border: 1px solid #e5ded3;
    background: #fbfaf6;
    color: #202722;
    border-radius: 14px;
    padding: 11px 14px;
    font-weight: 850;
    font-size: 14px;
    text-align: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(60,64,67,.06);
}

.rpqt-saas-toggle-box:hover {
    background: #f4fff9;
    border-color: #b8ebd7;
}

.rpqt-saas-toggle-box .rpqt-toggle-pill {
    background: #ecfff7;
    color: #008f67;
    border: 1px solid #b8ebd7;
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 850;
}

/* Replace pseudo customer heading with real button */
.rpqt-saas-editor #rp_quote_details::before,
.rpqt-saas-editor #rp_quote_details::after {
    display: none !important;
    content: none !important;
}

.rpqt-saas-editor #rp_quote_details .rpqt-saas-customer-toggle {
    margin-bottom: 0;
}

.rpqt-saas-editor #rp_quote_details.rpqt-customer-open .rpqt-saas-customer-toggle {
    margin-bottom: 8px;
}

/* Drawings box collapsed like customer details */
.rpqt-saas-editor .rpqt-drawings-box {
    position: relative;
}

.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-collapsed {
    padding: 8px !important;
}

.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-collapsed .rpqt-drawings-header,
.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-collapsed #rpqt_drawings {
    display: none !important;
}

.rpqt-saas-editor .rpqt-drawings-box .rpqt-saas-drawings-toggle {
    margin-bottom: 8px;
}

.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-collapsed .rpqt-saas-drawings-toggle {
    margin-bottom: 0;
}

/* Smaller drawing cards once opened */
.rpqt-saas-editor .rpqt-drawing-card {
    grid-template-columns: minmax(180px, 1fr) 54px 48px 78px !important;
    min-height: 54px !important;
}

.rpqt-saas-editor .rpqt-drawing-card label {
    font-size: 12px !important;
}


/* v2.0.11 clearer toggle boxes: title left, action right */
.rpqt-saas-toggle-box {
    border-color: #e5ded3 !important;
    background: #fffdf9 !important;
    color: #202722 !important;
    padding: 12px 14px !important;
    border-radius: 14px !important;
}

.rpqt-saas-toggle-box > span:first-child {
    color: #202722 !important;
    font-weight: 850 !important;
}

.rpqt-saas-toggle-box .rpqt-toggle-pill {
    background: #ecfff7 !important;
    color: #008f67 !important;
    border: 1px solid #b8ebd7 !important;
    border-radius: 999px !important;
    padding: 5px 12px !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    min-width: 140px;
    text-align: center;
}

/* Remove previous pink/magenta visual inherited from old button states */
.rpqt-saas-editor #rp_quote_details .rpqt-saas-customer-toggle,
.rpqt-saas-editor .rpqt-drawings-box .rpqt-saas-drawings-toggle {
    border: 1px solid #e5ded3 !important;
    background: #fffdf9 !important;
    box-shadow: 0 1px 2px rgba(60,64,67,.06) !important;
}

/* Open state */
.rpqt-saas-editor #rp_quote_details.rpqt-customer-open .rpqt-saas-customer-toggle,
.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-open .rpqt-saas-drawings-toggle {
    background: #f4fff9 !important;
    border-color: #b8ebd7 !important;
}


/* v2.0.12 tidy portal header/nav + consistent screen margins */
.rpqt-saas-app {
    width: auto !important;
    max-width: none !important;
    margin-left: 2rem !important;
    margin-right: 2rem !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}

/* Front portal pages */
.rpqt-saas-page,
.rpqt-saas-nav {
    max-width: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.rpqt-saas-nav {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    padding: 8px !important;
    border-radius: 16px !important;
    background: #fff !important;
    border: 1px solid #e5ded3 !important;
    box-shadow: 0 4px 18px rgba(31,39,34,.06) !important;
}

.rpqt-saas-nav a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    border-radius: 12px !important;
    padding: 9px 14px !important;
    color: #33423a !important;
    font-weight: 750 !important;
    font-size: 14px !important;
    line-height: 1 !important;
}

.rpqt-saas-nav a:hover {
    background: #ecfff7 !important;
    color: #008f67 !important;
}

/* Tidy up common theme heading/logo spacing around portal */
.entry-content:has(.rpqt-saas-app),
.wp-block-post-content:has(.rpqt-saas-app) {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.entry-content:has(.rpqt-saas-app) > *:not(.rpqt-saas-app),
.wp-block-post-content:has(.rpqt-saas-app) > *:not(.rpqt-saas-app) {
    max-width: none;
}

/* Editor should also respect the 2rem screen gutter */
.rpqt-saas-editor {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Mobile margin */
@media (max-width: 782px) {
    .rpqt-saas-app {
        margin-left: 1rem !important;
        margin-right: 1rem !important;
    }
    .rpqt-saas-nav {
        flex-wrap: wrap !important;
        border-radius: 14px !important;
    }
}


/* v2.0.13 full-width stable toggle bars */
.rpqt-saas-editor #rp_quote_details,
.rpqt-saas-editor .rpqt-drawings-box {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Make the customer and drawings headers full width, title left / action right */
.rpqt-saas-editor #rp_quote_details > .rpqt-saas-customer-toggle,
.rpqt-saas-editor .rpqt-drawings-box > .rpqt-saas-drawings-toggle {
    width: 100% !important;
    max-width: 100% !important;
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    align-items: center !important;
    gap: 14px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 10px 14px !important;
    box-sizing: border-box !important;
    text-align: left !important;
    border-radius: 14px !important;
    transform: none !important;
    transition: background-color .12s ease, border-color .12s ease !important;
}

/* Stop the button from resizing/jumping when text changes */
.rpqt-saas-editor .rpqt-saas-toggle-box .rpqt-toggle-pill {
    width: 178px !important;
    min-width: 178px !important;
    max-width: 178px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
}

/* Stable collapsed/open spacing so it doesn't shake */
.rpqt-saas-editor #rp_quote_details .rpqt-saas-customer-toggle,
.rpqt-saas-editor #rp_quote_details.rpqt-customer-open .rpqt-saas-customer-toggle,
.rpqt-saas-editor .rpqt-drawings-box .rpqt-saas-drawings-toggle,
.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-open .rpqt-saas-drawings-toggle,
.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-collapsed .rpqt-saas-drawings-toggle {
    margin-bottom: 0 !important;
}

/* Add spacing only to the content when open, not to the header */
.rpqt-saas-editor #rp_quote_details.rpqt-customer-open .inside {
    margin-top: 8px !important;
}

.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-open .rpqt-drawings-header {
    margin-top: 8px !important;
}

/* Keep the parent cards from changing width during toggle */
.rpqt-saas-editor #rp_quote_details,
.rpqt-saas-editor .rpqt-drawings-box {
    contain: layout paint !important;
}

/* Make headings clearer */
.rpqt-saas-editor .rpqt-saas-toggle-box > span:first-child {
    font-size: 15px !important;
    letter-spacing: -0.01em !important;
}


/* v2.0.14 stop toggle shimmer/fuzz and set portal width to 90vw */
.rpqt-saas-app {
    width: 90vw !important;
    max-width: 90vw !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow-x: hidden !important;
}

/* Remove effects that cause visual shaking/fuzz on repeated JS updates */
.rpqt-saas-editor #rp_quote_details,
.rpqt-saas-editor .rpqt-drawings-box,
.rpqt-saas-editor #rp_quote_details > .rpqt-saas-customer-toggle,
.rpqt-saas-editor .rpqt-drawings-box > .rpqt-saas-drawings-toggle,
.rpqt-saas-toggle-box,
.rpqt-saas-toggle-box .rpqt-toggle-pill {
    transition: none !important;
    transform: none !important;
    animation: none !important;
    filter: none !important;
    backdrop-filter: none !important;
    will-change: auto !important;
    contain: none !important;
}

/* Full width bars, but stable dimensions */
.rpqt-saas-editor #rp_quote_details > .rpqt-saas-customer-toggle,
.rpqt-saas-editor .rpqt-drawings-box > .rpqt-saas-drawings-toggle {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 1fr 180px !important;
    align-items: center !important;
    min-height: 46px !important;
    height: 46px !important;
    padding: 10px 14px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
    line-height: 1.1 !important;
}

.rpqt-saas-toggle-box > span:first-child {
    font-size: 15px !important;
    line-height: 20px !important;
    height: 20px !important;
}

.rpqt-saas-toggle-box .rpqt-toggle-pill {
    width: 180px !important;
    min-width: 180px !important;
    max-width: 180px !important;
    height: 28px !important;
    min-height: 28px !important;
    line-height: 26px !important;
    padding: 0 10px !important;
    box-sizing: border-box !important;
    white-space: nowrap !important;
}

/* Stable card spacing when opening/closing */
.rpqt-saas-editor #rp_quote_details,
.rpqt-saas-editor .rpqt-drawings-box {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

.rpqt-saas-editor #rp_quote_details.rpqt-customer-open .inside {
    margin-top: 8px !important;
}

.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-open .rpqt-drawings-header {
    margin-top: 8px !important;
}

/* Editor content respects 90vw container */
.rpqt-saas-editor {
    width: 100% !important;
    max-width: 100% !important;
}

@media (max-width: 782px) {
    .rpqt-saas-app {
        width: calc(100vw - 1rem) !important;
        max-width: calc(100vw - 1rem) !important;
    }

    .rpqt-saas-editor #rp_quote_details > .rpqt-saas-customer-toggle,
    .rpqt-saas-editor .rpqt-drawings-box > .rpqt-saas-drawings-toggle {
        grid-template-columns: 1fr 150px !important;
    }

    .rpqt-saas-toggle-box .rpqt-toggle-pill {
        width: 150px !important;
        min-width: 150px !important;
        max-width: 150px !important;
    }
}


/* v2.0.15 hard fix: no page overflow + no JS animated toggle bars */

/* Stop the 90vw + theme container problem causing right overflow */
html, body {
    overflow-x: hidden !important;
}

.rpqt-saas-app {
    width: 100% !important;
    max-width: calc(100vw - 4rem) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
}

.rpqt-saas-editor,
.rpqt-saas-page,
.rpqt-saas-nav {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
}

/* Disable the old JS-created toggle buttons which were being rewritten constantly */
.rpqt-saas-editor .rpqt-saas-customer-toggle,
.rpqt-saas-editor .rpqt-saas-drawings-toggle {
    display: none !important;
}

/* Use stable CSS-only headers instead */
.rpqt-saas-editor #rp_quote_details {
    position: relative !important;
    border-radius: 14px !important;
}

.rpqt-saas-editor #rp_quote_details::before {
    content: "Customer Details";
    display: grid !important;
    grid-template-columns: 1fr 190px;
    align-items: center;
    width: 100%;
    min-height: 46px;
    padding: 10px 14px;
    box-sizing: border-box;
    background: #fffdf9;
    border: 1px solid #e5ded3;
    border-radius: 14px;
    color: #202722;
    font-size: 15px;
    font-weight: 850;
}

.rpqt-saas-editor #rp_quote_details::after {
    content: "Open Customer Details";
    position: absolute;
    right: 14px;
    top: 9px;
    width: 180px;
    height: 28px;
    line-height: 26px;
    box-sizing: border-box;
    text-align: center;
    background: #ecfff7;
    color: #008f67;
    border: 1px solid #b8ebd7;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 850;
    pointer-events: none;
}

.rpqt-saas-editor #rp_quote_details.rpqt-customer-open::after {
    content: "Close Customer Details";
}

.rpqt-saas-editor #rp_quote_details:not(.rpqt-customer-open) .inside {
    display: none !important;
}

.rpqt-saas-editor #rp_quote_details.rpqt-customer-open .inside {
    display: block !important;
    margin-top: 8px !important;
}

/* Drawings stable CSS-only header */
.rpqt-saas-editor .rpqt-drawings-box {
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    padding: 8px !important;
}

.rpqt-saas-editor .rpqt-drawings-box::before {
    content: "Drawings";
    display: grid !important;
    grid-template-columns: 1fr 190px;
    align-items: center;
    width: 100%;
    min-height: 46px;
    padding: 10px 14px;
    box-sizing: border-box;
    background: #fffdf9;
    border: 1px solid #e5ded3;
    border-radius: 14px;
    color: #202722;
    font-size: 15px;
    font-weight: 850;
}

.rpqt-saas-editor .rpqt-drawings-box::after {
    content: "Select Drawing";
    position: absolute;
    right: 22px;
    top: 17px;
    width: 180px;
    height: 28px;
    line-height: 26px;
    box-sizing: border-box;
    text-align: center;
    background: #ecfff7;
    color: #008f67;
    border: 1px solid #b8ebd7;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 850;
    pointer-events: none;
}

.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-open::after {
    content: "Close Drawings";
}

.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-collapsed .rpqt-drawings-header,
.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-collapsed #rpqt_drawings {
    display: none !important;
}

.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-open .rpqt-drawings-header {
    margin-top: 8px !important;
}

/* Make the entire stable header area clickable */
.rpqt-saas-editor #rp_quote_details,
.rpqt-saas-editor .rpqt-drawings-box {
    cursor: pointer;
}

.rpqt-saas-editor #rp_quote_details .inside,
.rpqt-saas-editor .rpqt-drawings-box #rpqt_drawings,
.rpqt-saas-editor .rpqt-drawings-box .rpqt-drawings-header {
    cursor: default;
}

/* Keep canvas/layout inside the page width */
.rpqt-saas-editor .rpqt-main-layout {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: minmax(0, 1fr) 460px !important;
    overflow: hidden !important;
}

.rpqt-saas-editor .rpqt-drawing-panel,
.rpqt-saas-editor .rpqt-sections-panel,
.rpqt-saas-editor #rpqt_canvas_wrap,
.rpqt-saas-editor .rpqt-toolbar,
.rpqt-saas-editor .postbox,
.rpqt-saas-editor .inside {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.rpqt-saas-editor .rpqt-sections-panel {
    width: 460px !important;
    min-width: 460px !important;
    max-width: 460px !important;
}

.rpqt-saas-editor .rpqt-toolbar {
    overflow: visible !important;
    flex-wrap: wrap !important;
}

/* Do not let wide PDF canvas push page; scroll inside canvas box only */
.rpqt-saas-editor #rpqt_canvas_wrap {
    overflow: auto !important;
}

@media (max-width: 1300px) {
    .rpqt-saas-editor .rpqt-main-layout {
        grid-template-columns: 1fr !important;
    }
    .rpqt-saas-editor .rpqt-sections-panel {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        position: static !important;
    }
}

@media (max-width: 782px) {
    .rpqt-saas-app {
        max-width: calc(100vw - 1rem) !important;
    }

    .rpqt-saas-editor #rp_quote_details::before,
    .rpqt-saas-editor .rpqt-drawings-box::before {
        grid-template-columns: 1fr 145px;
    }

    .rpqt-saas-editor #rp_quote_details::after,
    .rpqt-saas-editor .rpqt-drawings-box::after {
        width: 138px;
        font-size: 11px;
    }
}


/* v2.0.16 hard reset for layout margin + stable accordion headers */

/* Use almost full viewport with exactly 1em gutter each side, even inside theme containers */
.rpqt-saas-app {
    width: calc(100vw - 2em) !important;
    max-width: calc(100vw - 2em) !important;
    margin-left: calc(50% - 50vw + 1em) !important;
    margin-right: calc(50% - 50vw + 1em) !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
}

.rpqt-saas-editor,
.rpqt-saas-page,
.rpqt-saas-nav,
.rpqt-saas-editor form,
.rpqt-saas-editor .postbox,
.rpqt-saas-editor .inside {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Remove all earlier JS-generated toggle boxes so there is only one stable header */
.rpqt-saas-editor .rpqt-saas-toggle-box,
.rpqt-saas-editor .rpqt-saas-customer-toggle,
.rpqt-saas-editor .rpqt-saas-drawings-toggle {
    display: none !important;
}

/* Stable CSS-only customer header */
.rpqt-saas-editor #rp_quote_details {
    position: relative !important;
    overflow: hidden !important;
    cursor: pointer !important;
    margin-bottom: 8px !important;
}

.rpqt-saas-editor #rp_quote_details::before {
    content: "Customer Details";
    display: grid !important;
    grid-template-columns: 1fr 190px !important;
    align-items: center !important;
    width: 100% !important;
    height: 46px !important;
    padding: 10px 14px !important;
    box-sizing: border-box !important;
    background: #fffdf9 !important;
    border: 1px solid #e5ded3 !important;
    border-radius: 14px !important;
    color: #202722 !important;
    font-size: 15px !important;
    font-weight: 850 !important;
    line-height: 20px !important;
}

.rpqt-saas-editor #rp_quote_details::after {
    content: "Open Customer Details";
    position: absolute !important;
    right: 14px !important;
    top: 9px !important;
    width: 180px !important;
    height: 28px !important;
    line-height: 26px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    background: #ecfff7 !important;
    color: #008f67 !important;
    border: 1px solid #b8ebd7 !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    pointer-events: none !important;
}

.rpqt-saas-editor #rp_quote_details.rpqt-customer-open::after {
    content: "Close Customer Details";
}

.rpqt-saas-editor #rp_quote_details:not(.rpqt-customer-open) .inside {
    display: none !important;
}

.rpqt-saas-editor #rp_quote_details.rpqt-customer-open .inside {
    display: block !important;
    margin-top: 8px !important;
    cursor: default !important;
}

/* Stable CSS-only drawings header */
.rpqt-saas-editor .rpqt-drawings-box {
    position: relative !important;
    overflow: hidden !important;
    cursor: pointer !important;
    padding: 8px !important;
}

.rpqt-saas-editor .rpqt-drawings-box::before {
    content: "Drawings";
    display: grid !important;
    grid-template-columns: 1fr 190px !important;
    align-items: center !important;
    width: 100% !important;
    height: 46px !important;
    padding: 10px 14px !important;
    box-sizing: border-box !important;
    background: #fffdf9 !important;
    border: 1px solid #e5ded3 !important;
    border-radius: 14px !important;
    color: #202722 !important;
    font-size: 15px !important;
    font-weight: 850 !important;
    line-height: 20px !important;
}

.rpqt-saas-editor .rpqt-drawings-box::after {
    content: "Select Drawing";
    position: absolute !important;
    right: 22px !important;
    top: 17px !important;
    width: 180px !important;
    height: 28px !important;
    line-height: 26px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    background: #ecfff7 !important;
    color: #008f67 !important;
    border: 1px solid #b8ebd7 !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    pointer-events: none !important;
}

.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-open::after {
    content: "Close Drawings";
}

.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-collapsed .rpqt-drawings-header,
.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-collapsed #rpqt_drawings {
    display: none !important;
}

.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-open .rpqt-drawings-header {
    margin-top: 8px !important;
}

.rpqt-saas-editor .rpqt-drawings-box .rpqt-drawings-header,
.rpqt-saas-editor .rpqt-drawings-box #rpqt_drawings {
    cursor: default !important;
}

/* Ensure the main workspace cannot push the page off-screen */
.rpqt-saas-editor .rpqt-main-layout {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: minmax(0, 1fr) 460px !important;
    gap: 10px !important;
    overflow: hidden !important;
}

.rpqt-saas-editor .rpqt-drawing-panel,
.rpqt-saas-editor .rpqt-sections-panel,
.rpqt-saas-editor #rpqt_canvas_wrap {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.rpqt-saas-editor .rpqt-sections-panel {
    width: 460px !important;
    min-width: 460px !important;
    max-width: 460px !important;
}

.rpqt-saas-editor #rpqt_canvas_wrap {
    overflow: auto !important;
}

html, body {
    overflow-x: hidden !important;
}

@media (max-width: 1300px) {
    .rpqt-saas-editor .rpqt-main-layout {
        grid-template-columns: 1fr !important;
    }
    .rpqt-saas-editor .rpqt-sections-panel {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        position: static !important;
    }
}

@media (max-width: 782px) {
    .rpqt-saas-app {
        width: calc(100vw - 1em) !important;
        max-width: calc(100vw - 1em) !important;
        margin-left: calc(50% - 50vw + .5em) !important;
        margin-right: calc(50% - 50vw + .5em) !important;
    }

    .rpqt-saas-editor #rp_quote_details::before,
    .rpqt-saas-editor .rpqt-drawings-box::before {
        grid-template-columns: 1fr 145px !important;
    }

    .rpqt-saas-editor #rp_quote_details::after,
    .rpqt-saas-editor .rpqt-drawings-box::after {
        width: 138px !important;
        font-size: 11px !important;
    }
}


/* v2.0.17 restore visible Customer Details bar and fix section Delete button */

/* Use a real injected header instead of pseudo only */
.rpqt-saas-editor #rp_quote_details::before,
.rpqt-saas-editor #rp_quote_details::after {
    display: none !important;
    content: none !important;
}

.rpqt-saas-customer-bar,
.rpqt-saas-drawing-bar {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    align-items: center !important;
    gap: 12px !important;
    min-height: 46px !important;
    padding: 10px 14px !important;
    box-sizing: border-box !important;
    background: #fffdf9 !important;
    border: 1px solid #e5ded3 !important;
    border-radius: 14px !important;
    color: #202722 !important;
    cursor: pointer !important;
    margin: 0 !important;
}

.rpqt-saas-customer-bar strong,
.rpqt-saas-drawing-bar strong {
    font-size: 15px !important;
    font-weight: 850 !important;
}

.rpqt-saas-customer-bar span,
.rpqt-saas-drawing-bar span {
    min-width: 160px !important;
    height: 28px !important;
    line-height: 26px !important;
    text-align: center !important;
    background: #ecfff7 !important;
    color: #008f67 !important;
    border: 1px solid #b8ebd7 !important;
    border-radius: 999px !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    box-sizing: border-box !important;
}

.rpqt-saas-editor #rp_quote_details:not(.rpqt-customer-open) .inside {
    display: none !important;
}

.rpqt-saas-editor #rp_quote_details.rpqt-customer-open .inside {
    display: block !important;
    margin-top: 8px !important;
}

/* Keep drawings collapsed/open using the injected bar */
.rpqt-saas-editor .rpqt-drawings-box::before,
.rpqt-saas-editor .rpqt-drawings-box::after {
    display: none !important;
    content: none !important;
}

.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-collapsed .rpqt-drawings-header,
.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-collapsed #rpqt_drawings {
    display: none !important;
}

.rpqt-saas-editor .rpqt-drawings-box.rpqt-drawings-open .rpqt-drawings-header {
    margin-top: 8px !important;
}

/* Make the quote section panel wide enough to show all controls */
.rpqt-saas-editor .rpqt-main-layout {
    grid-template-columns: minmax(0, 1fr) 560px !important;
}

.rpqt-saas-editor .rpqt-sections-panel {
    width: 560px !important;
    min-width: 560px !important;
    max-width: 560px !important;
    overflow-x: hidden !important;
}

/* A robust section header layout: toggle, number, name, total, use, delete */
.rpqt-saas-editor .rpqt-section-header {
    display: grid !important;
    grid-template-columns: 28px 42px minmax(170px, 1fr) 96px 54px 68px !important;
    gap: 8px !important;
    align-items: center !important;
    width: 100% !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

/* existing action span becomes invisible wrapper so buttons occupy columns */
.rpqt-saas-editor .rpqt-section-header > span:last-child {
    display: contents !important;
}

.rpqt-saas-editor .rpqt-section-header .rpqt-select-section {
    grid-column: 5 !important;
}

.rpqt-saas-editor .rpqt-section-header .rpqt-delete-section {
    grid-column: 6 !important;
}

/* make sure both buttons are always visible */
.rpqt-saas-editor .rpqt-section-header .rpqt-select-section,
.rpqt-saas-editor .rpqt-section-header .rpqt-delete-section {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 28px !important;
    min-height: 28px !important;
    padding: 0 8px !important;
    box-sizing: border-box !important;
    border-radius: 999px !important;
    font-size: 10.5px !important;
    line-height: 26px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.rpqt-saas-editor .rpqt-section-header .rpqt-delete-section {
    background: #fff5f3 !important;
    border: 1px solid #f0b6ad !important;
    color: #b42318 !important;
    text-decoration: none !important;
    font-weight: 850 !important;
}

.rpqt-saas-editor .rpqt-section-header-total {
    width: 96px !important;
    min-width: 96px !important;
    max-width: 96px !important;
}

@media (max-width: 1500px) {
    .rpqt-saas-editor .rpqt-main-layout {
        grid-template-columns: 1fr !important;
    }
    .rpqt-saas-editor .rpqt-sections-panel {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        position: static !important;
    }
}


/* v2.0.18 reliable quote section open/close */
.rpqt-saas-editor .rpqt-section.rpqt-force-open > .rpqt-section-body {
    display: block !important;
}

.rpqt-saas-editor .rpqt-section.rpqt-force-closed > .rpqt-section-body {
    display: none !important;
}

.rpqt-saas-editor .rpqt-section.rpqt-force-open .rpqt-section-header {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.rpqt-saas-editor .rpqt-section-header .rpqt-toggle-section,
.rpqt-saas-editor .rpqt-section-header > strong {
    cursor: pointer !important;
}


/* v2.0.19 logo/terms/drawing disclaimer field */
.rpqt-inline-form small {
    color: #65736b;
    font-weight: 500;
    line-height: 1.35;
    margin-top: -2px;
}


/* v2.0.20 manual quote section layout fixes for main plugin v1.4.7+ */
.rpqt-saas-editor .rpqt-other-sections-wrap {
    margin-top: 14px !important;
}

.rpqt-saas-editor .rpqt-other-sections-top {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin: 8px 0 12px !important;
}

.rpqt-saas-editor .rpqt-other-sections-top h3 {
    margin: 0 !important;
    font-size: 18px !important;
    line-height: 1.2 !important;
}

.rpqt-saas-editor .rpqt-other-items-section {
    overflow: hidden !important;
    padding: 0 !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header {
    display: grid !important;
    grid-template-columns: 44px minmax(150px, 1fr) 96px 160px !important;
    gap: 8px !important;
    align-items: center !important;
    padding: 10px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header > span:last-child,
.rpqt-saas-editor .rpqt-other-section-actions {
    display: flex !important;
    gap: 6px !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: auto !important;
    min-width: 0 !important;
    overflow: visible !important;
}

.rpqt-saas-editor .rpqt-other-section-actions .button,
.rpqt-saas-editor .rpqt-other-section-actions .button-link-delete,
.rpqt-saas-editor .rpqt-other-items-section .rpqt-add-other-item,
.rpqt-saas-editor .rpqt-other-items-section .rpqt-delete-other-section {
    width: auto !important;
    min-width: 66px !important;
    max-width: none !important;
    height: 30px !important;
    min-height: 30px !important;
    padding: 0 10px !important;
    border-radius: 999px !important;
    font-size: 11px !important;
    line-height: 28px !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-delete-other-section {
    color: #b42318 !important;
    background: #fff5f3 !important;
    border: 1px solid #f0b6ad !important;
    text-decoration: none !important;
}

.rpqt-saas-editor .rpqt-other-section-name {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 34px !important;
    border-radius: 10px !important;
    padding: 6px 10px !important;
    font-size: 13px !important;
    box-sizing: border-box !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-section-body {
    padding: 10px !important;
}

.rpqt-saas-editor .rpqt-other-row-compact {
    padding: 10px !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

.rpqt-saas-editor .rpqt-other-actions {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 8px !important;
}

.rpqt-saas-editor .rpqt-other-actions .button,
.rpqt-saas-editor .rpqt-other-actions .button-link-delete {
    width: auto !important;
    min-width: 70px !important;
    height: 32px !important;
    border-radius: 999px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 10px !important;
    font-size: 12px !important;
    box-sizing: border-box !important;
}

.rpqt-saas-editor .rpqt-other-compact-meta {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
}

.rpqt-saas-editor .rpqt-other-compact-meta span {
    font-size: 11px !important;
    padding: 4px 8px !important;
    border-radius: 999px !important;
    white-space: nowrap !important;
}

/* Do not apply normal quote-section six-column button grid to manual sections */
.rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header > span:last-child {
    grid-column: auto !important;
}

/* Keep manual sections usable when the SaaS side panel is narrow */
@media (max-width: 1500px) {
    .rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header {
        grid-template-columns: 44px minmax(140px, 1fr) 96px 150px !important;
    }
}

@media (max-width: 700px) {
    .rpqt-saas-editor .rpqt-other-sections-top,
    .rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header {
        grid-template-columns: 1fr !important;
        display: grid !important;
    }

    .rpqt-saas-editor .rpqt-other-section-actions {
        justify-content: flex-start !important;
        flex-wrap: wrap !important;
    }
}


/* v2.0.21 manual quote sections: keep existing items visible and fix delete button */

/* Manual quote sections should not be collapsed by the normal quote-section accordion */
.rpqt-saas-editor .rpqt-other-items-section > .rpqt-section-body,
.rpqt-saas-editor .rpqt-other-items-section.rpqt-saas-collapsed > .rpqt-section-body,
.rpqt-saas-editor .rpqt-other-items-section.collapsed > .rpqt-section-body,
.rpqt-saas-editor.rpqt-saas-ready .rpqt-other-items-section:not(.rpqt-saas-open) > .rpqt-section-body {
    display: block !important;
}

/* Wider action area so Add Item and Delete Section do not overlap */
.rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header {
    grid-template-columns: 44px minmax(170px, 1fr) 96px 230px !important;
    gap: 10px !important;
}

.rpqt-saas-editor .rpqt-other-section-actions,
.rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header > span:last-child {
    display: flex !important;
    flex-direction: row !important;
    gap: 8px !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: 230px !important;
    min-width: 230px !important;
    max-width: 230px !important;
    overflow: visible !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-add-other-item,
.rpqt-saas-editor .rpqt-other-items-section .rpqt-delete-other-section {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 92px !important;
    max-width: none !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 12px !important;
    border-radius: 999px !important;
    font-size: 11px !important;
    line-height: 30px !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-delete-other-section {
    min-width: 112px !important;
    color: #b42318 !important;
    background: #fff5f3 !important;
    border: 1px solid #f0b6ad !important;
    text-decoration: none !important;
    font-weight: 800 !important;
}

/* Existing manual items inside a section */
.rpqt-saas-editor .rpqt-other-items-list {
    display: grid !important;
    gap: 10px !important;
    margin-top: 8px !important;
}

.rpqt-saas-editor .rpqt-other-row-compact {
    display: grid !important;
    gap: 8px !important;
    background: #fffdf7 !important;
    border: 1px solid #ddd6c8 !important;
    border-radius: 12px !important;
    padding: 10px !important;
    overflow: visible !important;
}

.rpqt-saas-editor .rpqt-other-actions {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    width: 100% !important;
}

.rpqt-saas-editor .rpqt-other-actions .rpqt-edit-other-item,
.rpqt-saas-editor .rpqt-other-actions .rpqt-delete-other-item {
    position: relative !important;
    z-index: 5 !important;
    pointer-events: auto !important;
}

/* On narrower SaaS panels, wrap actions cleanly rather than overlap */
@media (max-width: 1600px) {
    .rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header {
        grid-template-columns: 44px minmax(130px, 1fr) 96px 210px !important;
    }

    .rpqt-saas-editor .rpqt-other-section-actions,
    .rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header > span:last-child {
        width: 210px !important;
        min-width: 210px !important;
        max-width: 210px !important;
    }

    .rpqt-saas-editor .rpqt-other-items-section .rpqt-add-other-item {
        min-width: 78px !important;
    }

    .rpqt-saas-editor .rpqt-other-items-section .rpqt-delete-other-section {
        min-width: 104px !important;
    }
}

@media (max-width: 700px) {
    .rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header {
        grid-template-columns: 1fr !important;
    }

    .rpqt-saas-editor .rpqt-other-section-actions,
    .rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header > span:last-child {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        justify-content: flex-start !important;
        flex-wrap: wrap !important;
    }
}


/* v2.0.22 hard fix manual quote section in SaaS */

/* Make the SaaS right panel wide enough for manual section controls */
.rpqt-saas-editor .rpqt-main-layout {
    grid-template-columns: minmax(0, 1fr) 620px !important;
}

.rpqt-saas-editor .rpqt-sections-panel {
    width: 620px !important;
    min-width: 620px !important;
    max-width: 620px !important;
    overflow-x: hidden !important;
}

/* Manual quote sections: do not use the normal section header layout */
.rpqt-saas-editor .rpqt-other-items-section,
.rpqt-saas-editor .rpqt-other-items-section * {
    box-sizing: border-box !important;
}

.rpqt-saas-editor .rpqt-other-items-section {
    overflow: visible !important;
}

/* Force the body/items open. These are not takeoff sections. */
.rpqt-saas-editor .rpqt-other-items-section > .rpqt-section-body,
.rpqt-saas-editor .rpqt-other-items-section.collapsed > .rpqt-section-body,
.rpqt-saas-editor .rpqt-other-items-section.rpqt-saas-collapsed > .rpqt-section-body,
.rpqt-saas-editor .rpqt-other-items-section.rpqt-force-closed > .rpqt-section-body,
.rpqt-saas-editor.rpqt-saas-ready .rpqt-other-items-section:not(.rpqt-saas-open) > .rpqt-section-body {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Two-row header so Delete Section cannot run off screen */
.rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header {
    display: grid !important;
    grid-template-columns: 42px minmax(170px, 1fr) 100px !important;
    grid-template-areas:
        "badge name total"
        "actions actions actions" !important;
    gap: 8px !important;
    align-items: center !important;
    padding: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header .rpqt-item-number {
    grid-area: badge !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-other-section-name {
    grid-area: name !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header-total {
    grid-area: total !important;
    justify-self: end !important;
    width: 100px !important;
    min-width: 100px !important;
    max-width: 100px !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header > span:last-child,
.rpqt-saas-editor .rpqt-other-section-actions {
    grid-area: actions !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: visible !important;
}

/* override earlier display:contents / fixed-width rules */
.rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header > span:last-child {
    display: flex !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-add-other-item,
.rpqt-saas-editor .rpqt-other-items-section .rpqt-delete-other-section {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 105px !important;
    max-width: none !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 14px !important;
    border-radius: 999px !important;
    font-size: 11px !important;
    line-height: 30px !important;
    white-space: nowrap !important;
    position: relative !important;
    z-index: 10 !important;
    overflow: visible !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-delete-other-section {
    min-width: 126px !important;
    background: #fff5f3 !important;
    border: 1px solid #f0b6ad !important;
    color: #b42318 !important;
    text-decoration: none !important;
}

/* Manual item cards must show beneath the header */
.rpqt-saas-editor .rpqt-other-items-section .rpqt-section-body {
    padding: 10px !important;
}

.rpqt-saas-editor .rpqt-other-items-list,
.rpqt-saas-editor .rpqt-other-row-compact {
    display: grid !important;
    visibility: visible !important;
    opacity: 1 !important;
}

@media (max-width: 1500px) {
    .rpqt-saas-editor .rpqt-main-layout {
        grid-template-columns: 1fr !important;
    }

    .rpqt-saas-editor .rpqt-sections-panel {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        position: static !important;
    }
}


/* v2.0.23 final manual quote section layout */
.rpqt-saas-editor .rpqt-main-layout {
    grid-template-columns: minmax(0, 1fr) 640px !important;
}

.rpqt-saas-editor .rpqt-sections-panel {
    width: 640px !important;
    min-width: 640px !important;
    max-width: 640px !important;
}

.rpqt-saas-editor .rpqt-other-items-section > .rpqt-section-body {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header {
    display: grid !important;
    grid-template-columns: 42px minmax(190px,1fr) 110px !important;
    grid-template-areas:
        "badge name total"
        "actions actions actions" !important;
    gap: 8px !important;
    padding: 10px !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-item-number {
    grid-area: badge !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-other-section-name {
    grid-area: name !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header-total {
    grid-area: total !important;
    width: 110px !important;
    min-width: 110px !important;
    max-width: 110px !important;
    justify-self: end !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-other-section-actions,
.rpqt-saas-editor .rpqt-other-items-section .rpqt-section-header > span:last-child {
    grid-area: actions !important;
    display: flex !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: visible !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-add-other-item,
.rpqt-saas-editor .rpqt-other-items-section .rpqt-delete-other-section {
    width: auto !important;
    min-width: 118px !important;
    max-width: none !important;
    height: 32px !important;
    padding: 0 14px !important;
    border-radius: 999px !important;
    white-space: nowrap !important;
    overflow: visible !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    z-index: 20 !important;
}

.rpqt-saas-editor .rpqt-other-items-section .rpqt-delete-other-section {
    min-width: 132px !important;
}

.rpqt-saas-editor .rpqt-other-row-compact {
    display: grid !important;
}

@media (max-width: 1500px) {
    .rpqt-saas-editor .rpqt-main-layout {
        grid-template-columns: 1fr !important;
    }
    .rpqt-saas-editor .rpqt-sections-panel {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        position: static !important;
    }
}