/* ============================================================================
   My Products edit v2 — neutral SaaS port (2026-05-09)
   Scope: .mp-edit-v2 page + .sbv2-modal overlays. Inherits Hanken Grotesk +
   JetBrains Mono and design tokens from .salgsbilag-v2 root. Drops the colored
   section-icon palette in favor of a single muted ink mark, sharpens cards to
   hairline borders, restyles all 4 modals to the same neutral chrome.
   ========================================================================== */

/* ── Page chrome ── */
.salgsbilag-v2.mp-edit-v2 { margin: 0; }
.salgsbilag-v2.mp-edit-v2 .sbv2-shell { padding: 24px 24px 96px; }
.salgsbilag-v2.mp-edit-v2 .sbv2-notice {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 8px 14px; margin: 0 0 18px;
    background: var(--sbv2-moss-soft); color: var(--sbv2-moss);
    border: 1px solid color-mix(in srgb, var(--sbv2-moss) 22%, var(--sbv2-line-strong));
    border-radius: 999px; font-size: 13px; font-weight: 500;
}

/* Head: eyebrow with inline back link */
.salgsbilag-v2.mp-edit-v2 .mp-edit-head { margin-bottom: 18px; }
.salgsbilag-v2.mp-edit-v2 .sbv2-eyebrow-back {
    display: inline-flex; align-items: center; justify-content: center;
    width: 22px; height: 22px; margin-right: 6px;
    border: 1px solid var(--sbv2-line-strong); border-radius: 6px;
    color: var(--sbv2-muted); background: var(--sbv2-paper);
    text-decoration: none; transition: all 0.12s ease;
}
.salgsbilag-v2.mp-edit-v2 .sbv2-eyebrow-back:hover {
    color: var(--sbv2-ink); background: var(--sbv2-tint); border-color: var(--sbv2-ink);
}
.salgsbilag-v2.mp-edit-v2 .sbv2-title { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.salgsbilag-v2.mp-edit-v2 .sbv2-title .num {
    font-size: 0.6em; letter-spacing: -0.01em; color: var(--sbv2-muted-2); font-weight: 500;
}
.salgsbilag-v2.mp-edit-v2 .sbv2-title-text { color: var(--sbv2-ink); }
.salgsbilag-v2.mp-edit-v2 .sbv2-subhead {
    display: flex; flex-wrap: wrap; align-items: center; gap: 0 8px;
    margin-top: 4px; font-size: 13px; color: var(--sbv2-muted);
}
.salgsbilag-v2.mp-edit-v2 .mp-edit-subhead-sep { color: var(--sbv2-muted-2); }
.salgsbilag-v2.mp-edit-v2 .mp-edit-subhead-status,
.salgsbilag-v2.mp-edit-v2 .mp-edit-subhead-stock {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 2px 8px; border-radius: 999px;
    font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600;
    background: var(--sbv2-tint); color: var(--sbv2-muted);
    border: 1px solid var(--sbv2-line);
}
.salgsbilag-v2.mp-edit-v2 .mp-edit-status-publish {
    color: var(--sbv2-moss); background: var(--sbv2-moss-soft);
    border-color: color-mix(in srgb, var(--sbv2-moss) 20%, var(--sbv2-line-strong));
}
.salgsbilag-v2.mp-edit-v2 .mp-edit-status-draft {
    color: var(--sbv2-amber); background: var(--sbv2-amber-soft);
    border-color: color-mix(in srgb, var(--sbv2-amber) 22%, var(--sbv2-line-strong));
}
.salgsbilag-v2.mp-edit-v2 .mp-edit-status-private {
    color: var(--sbv2-ink-2); background: var(--sbv2-paper); border-color: var(--sbv2-line-strong);
}
.salgsbilag-v2.mp-edit-v2 .mp-edit-stock-in { color: var(--sbv2-moss); background: var(--sbv2-moss-soft); border-color: color-mix(in srgb, var(--sbv2-moss) 18%, var(--sbv2-line-strong)); }

/* Save button on action shelf */
.salgsbilag-v2.mp-edit-v2 .mp-edit-save-btn { gap: 6px; padding: 9px 16px; }

/* Toolbar (data-source triggers) */
.salgsbilag-v2.mp-edit-v2 .mp-edit-toolbar {
    display: flex; align-items: center; gap: 14px;
    padding: 10px 14px; margin: 0 0 18px;
    background: var(--sbv2-paper);
    border: 1px solid var(--sbv2-line); border-radius: 10px;
}
.salgsbilag-v2.mp-edit-v2 .mp-edit-toolbar-label {
    font-size: 11px; text-transform: uppercase; letter-spacing: 0.07em;
    color: var(--sbv2-muted-2); font-weight: 600; flex-shrink: 0;
}
.salgsbilag-v2.mp-edit-v2 .mp-edit-toolbar-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.salgsbilag-v2.mp-edit-v2 .mp-edit-toolbar-actions--stacked { flex-direction: column; }
.salgsbilag-v2.mp-edit-v2 .mp-edit-toolbar-actions--stacked .sbv2-btn { width: 100%; justify-content: center; }
.salgsbilag-v2.mp-edit-v2 .mp-dba-trigger-btn { padding: 7px 12px; font-size: 13px; }

/* ── Grid: shared 2-col form+sidebar infrastructure ──────────────────── */
/* Used by my-products-new.php's sidebar (via .sbv2-aside). The edit page no
   longer uses a sidebar — its wrapper drops the `sbv2-grid` class (see
   my-products-edit.php) — but .mp-edit-main.sbv2-grid-main is kept regardless,
   since it also doubles as the hook for the >=1640px side-by-side
   Billede+Produktinfo layout below, which has nothing to do with the
   sidebar/rail question. The grid-column/grid-row placement below is scoped
   to the `.sbv2-grid` ancestor: without that scope it also matched the edit
   page's `.mp-edit-two-col` grid, pinning the sole grid item (.mp-edit-main
   has no sidebar sibling there) into column 2 and leaving column 1 — most of
   the width — blank. */
.salgsbilag-v2.mp-edit-v2 .mp-edit-layout.sbv2-grid {
    display: grid; grid-template-columns: 258px minmax(0, 1fr); gap: 20px;
}
.salgsbilag-v2.mp-edit-v2 .mp-edit-main.sbv2-grid-main {
    display: flex; flex-direction: column; gap: 14px; min-width: 0;
}
.salgsbilag-v2.mp-edit-v2 .mp-edit-layout.sbv2-grid .mp-edit-main.sbv2-grid-main {
    grid-column: 2; grid-row: 1;
}
.salgsbilag-v2.mp-edit-v2 .sbv2-aside {
    display: flex; flex-direction: column; gap: 14px;
    position: sticky; top: 18px; align-self: flex-start;
    grid-column: 1; grid-row: 1;
}
@media (max-width: 1024px) {
    .salgsbilag-v2.mp-edit-v2 .mp-edit-layout.sbv2-grid { grid-template-columns: 1fr; }
    .salgsbilag-v2.mp-edit-v2 .sbv2-aside { position: static; }
}

/* ── Section cards: neutralize colored chrome ── */
.salgsbilag-v2.mp-edit-v2 .mp-section-card {
    background: var(--sbv2-paper);
    border: 1px solid var(--sbv2-line-strong);
    border-radius: 12px;
    box-shadow: none;
    overflow: hidden;
    margin: 0;
}
.salgsbilag-v2.mp-edit-v2 .mp-section-card + .mp-section-card { margin-top: 0; }
.salgsbilag-v2.mp-edit-v2 .mp-section-header {
    padding: 14px 18px;
    background: var(--sbv2-paper);
    border-bottom: 1px solid var(--sbv2-line);
    gap: 12px;
    cursor: pointer;
    display: flex; align-items: center;
    transition: background 0.12s ease;
}
.salgsbilag-v2.mp-edit-v2 .mp-section-card.mp-collapsed .mp-section-header { border-bottom-color: transparent; }
.salgsbilag-v2.mp-edit-v2 .mp-section-header:hover { background: var(--sbv2-tint); }
.salgsbilag-v2.mp-edit-v2 .mp-section-icon,
.salgsbilag-v2.mp-edit-v2 .mp-icon-blue,
.salgsbilag-v2.mp-edit-v2 .mp-icon-green,
.salgsbilag-v2.mp-edit-v2 .mp-icon-purple,
.salgsbilag-v2.mp-edit-v2 .mp-icon-yellow,
.salgsbilag-v2.mp-edit-v2 .mp-icon-teal,
.salgsbilag-v2.mp-edit-v2 .mp-icon-orange,
.salgsbilag-v2.mp-edit-v2 .mp-icon-indigo,
.salgsbilag-v2.mp-edit-v2 .mp-icon-red,
.salgsbilag-v2.mp-edit-v2 .mp-icon-gray {
    background: transparent !important;
    color: var(--sbv2-muted-2) !important;
    width: 22px; height: 22px;
    border-radius: 0;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.salgsbilag-v2.mp-edit-v2 .mp-section-icon svg { width: 16px; height: 16px; stroke-width: 1.6; }
.salgsbilag-v2.mp-edit-v2 .mp-section-title h3 {
    font-family: 'Fraunces', serif;
    font-size: 16px; font-weight: 500; letter-spacing: -0.01em;
    color: var(--sbv2-ink);
}
.salgsbilag-v2.mp-edit-v2 .mp-section-title p {
    margin-top: 1px; font-size: 12px; color: var(--sbv2-muted-2);
}
.salgsbilag-v2.mp-edit-v2 .mp-section-toggle { color: var(--sbv2-muted-2); }
.salgsbilag-v2.mp-edit-v2 .mp-section-card.mp-collapsed .mp-section-toggle svg { transform: rotate(-90deg); }
.salgsbilag-v2.mp-edit-v2 .mp-section-body {
    padding: 18px 20px 20px;
    background: var(--sbv2-paper);
    display: flex; flex-direction: column; gap: 14px;
}

/* Bilag-flavored sections get a moss accent stripe so they stand apart from generic ones */
.salgsbilag-v2.mp-edit-v2 .mp-section-bilag { border-left: 3px solid color-mix(in srgb, var(--sbv2-moss) 25%, var(--sbv2-line-strong)); }
.salgsbilag-v2.mp-edit-v2 .mp-section-bilag .mp-section-header { padding-left: 16px; }
.salgsbilag-v2.mp-edit-v2 .mp-section-bilag .mp-section-title h3::before {
    content: ''; display: inline-block; width: 4px; height: 4px;
    background: var(--sbv2-moss); border-radius: 50%; margin-right: 8px; vertical-align: middle;
}

/* ── Fields ── */
.salgsbilag-v2.mp-edit-v2 .mp-field { display: flex; flex-direction: column; gap: 6px; flex: 1; min-width: 0; }
.salgsbilag-v2.mp-edit-v2 .mp-field-row {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px;
}
.salgsbilag-v2.mp-edit-v2 .mp-field-label {
    font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em;
    color: var(--sbv2-muted); font-weight: 600;
}
.salgsbilag-v2.mp-edit-v2 .mp-field-hint {
    text-transform: none; letter-spacing: 0; font-weight: 400;
    color: var(--sbv2-muted-2); margin-left: 6px;
}
.salgsbilag-v2.mp-edit-v2 .mp-field-input {
    width: 100%;
    padding: 9px 12px;
    background: var(--sbv2-paper);
    border: 1px solid var(--sbv2-line-strong);
    border-radius: 8px;
    color: var(--sbv2-ink);
    font-family: 'Hanken Grotesk', system-ui, sans-serif;
    font-size: 14px;
    line-height: 1.4;
    transition: border-color 0.12s ease, background 0.12s ease;
}
.salgsbilag-v2.mp-edit-v2 .mp-field-input:focus {
    outline: none;
    border-color: var(--sbv2-ink);
    background: var(--sbv2-paper);
    box-shadow: 0 0 0 3px var(--sbv2-tint);
}
.salgsbilag-v2.mp-edit-v2 .mp-field-input:disabled {
    background: var(--sbv2-tint); color: var(--sbv2-muted); cursor: not-allowed;
}
.salgsbilag-v2.mp-edit-v2 .mp-field-input.mono-input,
.salgsbilag-v2.mp-edit-v2 input[type="number"].mp-field-input,
.salgsbilag-v2.mp-edit-v2 .mp-field-input[name*="date"],
.salgsbilag-v2.mp-edit-v2 .mp-field-input[name*="price"],
.salgsbilag-v2.mp-edit-v2 .mp-field-input[name*="phone"],
.salgsbilag-v2.mp-edit-v2 .mp-field-input[name*="bilagsnr"],
.salgsbilag-v2.mp-edit-v2 .mp-field-input[name*="fakturanr"],
.salgsbilag-v2.mp-edit-v2 .mp-field-input[name*="vat"] {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 13.5px;
    font-feature-settings: "tnum";
    letter-spacing: -0.01em;
}
.salgsbilag-v2.mp-edit-v2 .mp-textarea {
    min-height: 110px; resize: vertical;
    font-family: 'Hanken Grotesk', system-ui, sans-serif;
}
.salgsbilag-v2.mp-edit-v2 .mp-textarea-sm { min-height: 60px; resize: vertical; }
.salgsbilag-v2.mp-edit-v2 select.mp-field-input {
    appearance: none; -webkit-appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F6E66' stroke-width='2' stroke-linecap='round'><polyline points='6 9 12 15 18 9'/></svg>");
    background-repeat: no-repeat; background-position: right 10px center; background-size: 14px;
    padding-right: 34px;
}

/* Dimensions group */
.salgsbilag-v2.mp-edit-v2 .mp-dims-group { display: flex; align-items: center; gap: 8px; }
.salgsbilag-v2.mp-edit-v2 .mp-dim-field {
    flex: 1; display: flex; align-items: center; gap: 6px;
    background: var(--sbv2-paper);
    border: 1px solid var(--sbv2-line-strong); border-radius: 8px;
    padding: 0 10px;
}
.salgsbilag-v2.mp-edit-v2 .mp-dim-label {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 11px; color: var(--sbv2-muted-2); font-weight: 600;
}
.salgsbilag-v2.mp-edit-v2 .mp-dim-field input {
    flex: 1; border: 0; background: transparent; padding: 9px 0;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 13px; color: var(--sbv2-ink); width: 100%;
}
.salgsbilag-v2.mp-edit-v2 .mp-dim-field:focus-within { border-color: var(--sbv2-ink); box-shadow: 0 0 0 3px var(--sbv2-tint); }
.salgsbilag-v2.mp-edit-v2 .mp-dim-field input:focus { outline: none; }
.salgsbilag-v2.mp-edit-v2 .mp-dim-sep { color: var(--sbv2-muted-2); font-weight: 400; }

/* Tag picker */
.salgsbilag-v2.mp-edit-v2 .mp-tag-picker { display: flex; flex-wrap: wrap; gap: 6px; }
.salgsbilag-v2.mp-edit-v2 .mp-tag-option {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 6px 12px; border-radius: 999px;
    background: var(--sbv2-paper); border: 1px solid var(--sbv2-line-strong);
    font-size: 13px; color: var(--sbv2-ink-2); cursor: pointer;
    transition: all 0.12s ease;
}
.salgsbilag-v2.mp-edit-v2 .mp-tag-option:hover { background: var(--sbv2-tint); border-color: var(--sbv2-ink); }
.salgsbilag-v2.mp-edit-v2 .mp-tag-option.selected,
.salgsbilag-v2.mp-edit-v2 .mp-tag-option:has(input:checked) {
    background: var(--sbv2-ink); color: #FBFAF5; border-color: var(--sbv2-ink);
}
.salgsbilag-v2.mp-edit-v2 .mp-tag-option input[type=checkbox] { display: none; }
.salgsbilag-v2.mp-edit-v2 .mp-tag-count {
    font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 11px;
    color: var(--sbv2-muted-2); margin-left: 2px;
}
.salgsbilag-v2.mp-edit-v2 .mp-tag-option.selected .mp-tag-count,
.salgsbilag-v2.mp-edit-v2 .mp-tag-option:has(input:checked) .mp-tag-count { color: rgba(255,255,255,0.55); }

/* Image preview grid (in section card) */
.salgsbilag-v2.mp-edit-v2 .mp-img-preview-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px;
    padding: 12px; background: var(--sbv2-bg);
    border: 1px dashed var(--sbv2-line-strong); border-radius: 10px;
}
.salgsbilag-v2.mp-edit-v2 .mp-img-preview-item {
    position: relative; aspect-ratio: 1; overflow: hidden;
    background: var(--sbv2-paper); border: 1px solid var(--sbv2-line); border-radius: 6px;
}
.salgsbilag-v2.mp-edit-v2 .mp-img-preview-item.mp-img-featured { border-color: var(--sbv2-ink); box-shadow: 0 0 0 1px var(--sbv2-ink); }
.salgsbilag-v2.mp-edit-v2 .mp-img-preview-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.salgsbilag-v2.mp-edit-v2 .mp-img-empty {
    grid-column: 1 / -1; padding: 28px 8px;
    display: flex; flex-direction: column; align-items: center; gap: 8px;
    color: var(--sbv2-muted-2); font-size: 13px;
}
.salgsbilag-v2.mp-edit-v2 .mp-img-manage-btn {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 8px 14px;
    background: var(--sbv2-paper); border: 1px solid var(--sbv2-line-strong);
    border-radius: 8px; color: var(--sbv2-ink); font-size: 13px; font-weight: 500;
    cursor: pointer; align-self: flex-start;
    transition: all 0.12s ease;
}
.salgsbilag-v2.mp-edit-v2 .mp-img-manage-btn:hover { background: var(--sbv2-tint); border-color: var(--sbv2-ink); }

/* Aside: Status & Detaljer detail-grid */
.salgsbilag-v2.mp-edit-v2 .mp-detail-grid {
    display: grid; grid-template-columns: 80px 1fr; gap: 6px 14px;
    font-size: 13px;
}
.salgsbilag-v2.mp-edit-v2 .mp-detail-label { color: var(--sbv2-muted); }
.salgsbilag-v2.mp-edit-v2 .mp-detail-value {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 12.5px; color: var(--sbv2-ink-2); font-feature-settings: "tnum";
}
.salgsbilag-v2.mp-edit-v2 .mp-detail-value code {
    background: transparent; padding: 0; font-family: inherit; color: inherit;
}
.salgsbilag-v2.mp-edit-v2 .mp-sidebar-actions { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.salgsbilag-v2.mp-edit-v2 .mp-sidebar-action-btn {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 8px 12px; font-size: 13px; color: var(--sbv2-ink-2);
    background: var(--sbv2-paper); border: 1px solid var(--sbv2-line-strong);
    border-radius: 8px; text-decoration: none; transition: all 0.12s ease;
}
.salgsbilag-v2.mp-edit-v2 .mp-sidebar-action-btn:hover { background: var(--sbv2-tint); border-color: var(--sbv2-ink); color: var(--sbv2-ink); }

/* ── Priser card: prominent price input (moved out of the sticky rail —
   see incident notes below the grid rules) ──────────────────────────── */
.salgsbilag-v2.mp-edit-v2 .mp-price-input {
    font-family: 'Fraunces', serif; font-weight: 500; font-size: 26px;
    letter-spacing: -0.02em;
}
.salgsbilag-v2.mp-edit-v2 .mp-price-input:focus {
    border-color: var(--sbv2-ledger);
    box-shadow: 0 0 0 3px var(--sbv2-ledger-soft);
}

/* ── Datakilder & Værktøjer: topbar icon button + dropdown ───────────── */
/* Previously a fixed bottom-right FAB — dropped it because a viewport-fixed
   bottom corner collides with the browser/PWA chrome's own bottom tab bar on
   mobile. Anchored in the topbar instead: normal document flow, no fixed
   positioning, so it can never collide with anything below it. */
.salgsbilag-v2.mp-edit-v2 .mp-et-tools { position: relative; }
.salgsbilag-v2.mp-edit-v2 .mp-et-tools-toggle {
    display: inline-flex; align-items: center; justify-content: center;
    width: 30px; height: 30px;
    border: 1px solid var(--sbv2-line-strong); border-radius: 7px;
    background: var(--sbv2-paper); color: var(--sbv2-ink-2);
    cursor: pointer; transition: all 0.15s;
}
.salgsbilag-v2.mp-edit-v2 .mp-et-tools-toggle:hover { background: var(--sbv2-tint); color: var(--sbv2-ink); border-color: var(--sbv2-ink); }
.salgsbilag-v2.mp-edit-v2 .mp-et-tools-toggle[aria-expanded="true"] { background: var(--sbv2-ledger); color: #FBFAF5; border-color: var(--sbv2-ledger); }
.salgsbilag-v2.mp-edit-v2 .mp-et-tools-menu {
    position: absolute; top: calc(100% + 8px); right: 0; z-index: 50;
    width: 220px;
    background: var(--sbv2-paper); border: 1px solid var(--sbv2-line-strong); border-radius: 12px;
    box-shadow: 0 16px 40px rgba(14,14,12,0.16);
    padding: 12px; display: flex; flex-direction: column; gap: 8px;
}
/* [hidden] must be re-asserted at higher specificity than the unqualified
   rule above, or toggling the attribute has no visual effect (see the
   .mp-rail-stage-detail incident this same page already hit once). */
.salgsbilag-v2.mp-edit-v2 .mp-et-tools-menu[hidden] { display: none; }
.salgsbilag-v2.mp-edit-v2 .mp-et-tools-menu-label {
    font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.08em;
    color: var(--sbv2-muted-2); font-weight: 600; padding: 0 2px 2px;
}
.salgsbilag-v2.mp-edit-v2 .mp-et-tools-menu .sbv2-btn { width: 100%; justify-content: center; }

/* ── Mobile head/tools ── */
@media (max-width: 768px) {
    .salgsbilag-v2.mp-edit-v2 .sbv2-shell { padding: 16px 14px 96px; }
    .salgsbilag-v2.mp-edit-v2 .sbv2-head { gap: 12px; }
    .salgsbilag-v2.mp-edit-v2 .mp-edit-toolbar { flex-direction: column; align-items: flex-start; gap: 8px; }
    .salgsbilag-v2.mp-edit-v2 .mp-edit-toolbar-actions { width: 100%; }
    .salgsbilag-v2.mp-edit-v2 .mp-edit-toolbar-actions .sbv2-btn { flex: 1; justify-content: center; }
    .salgsbilag-v2.mp-edit-v2 .sbv2-head-actions { width: 100%; }
    .salgsbilag-v2.mp-edit-v2 .sbv2-head-actions .sbv2-btn { flex: 1; justify-content: center; }
}

/* =============================================================
   Modal v2 — shared chrome for all 4 overlays
   Tokens redeclared so the modal works even when its overlay sits
   outside .salgsbilag-v2 scope (e.g. AI Fotostudie partial on the
   non-v2 list page).
   ============================================================= */
.sbv2-modal {
    --sbv2-bg:           #F6F5F0;
    --sbv2-paper:        #FFFFFF;
    --sbv2-ink:          #0E0E0C;
    --sbv2-ink-2:        #2A2A26;
    --sbv2-muted:        #696860;
    --sbv2-muted-2:      #696860;  /* was #9A9890 (2.9:1 on white). Now equal to --sbv2-muted; see GH #1033 E2. */
    --sbv2-line:         #E6E2D7;
    --sbv2-line-strong:  #D5D0C2;
    --sbv2-tint:         #EFECDF;
    --sbv2-moss:         #2F5D3E;
    --sbv2-moss-soft:    #E2EAE0;
    --sbv2-amber:        #7A4A00;
    --sbv2-amber-soft:   #F4E9D2;
    --sbv2-rust:         #8B2E1A;
    --sbv2-rust-soft:    #F3DDD5;
    position: fixed; inset: 0; z-index: 9500;
    display: none; align-items: center; justify-content: center;
    padding: 24px;
    background: rgba(14,14,12,0.45);
    backdrop-filter: blur(3px);
    font-family: 'Hanken Grotesk', system-ui, sans-serif;
    color: var(--sbv2-ink);
}
.sbv2-modal[style*="flex"] { display: flex !important; }
.sbv2-modal .sbv2-modal-shell {
    width: 100%; max-width: 720px; max-height: calc(100vh - 48px);
    background: var(--sbv2-paper);
    border: 1px solid var(--sbv2-line-strong);
    border-radius: 14px;
    box-shadow: 0 20px 50px -10px rgba(14,14,12,0.20);
    display: flex; flex-direction: column; overflow: hidden;
}
.sbv2-modal-imgmanager .sbv2-modal-shell { max-width: 920px; }
.sbv2-modal-imgedit .sbv2-modal-shell { max-width: 1100px; }
.sbv2-modal-vision .sbv2-modal-shell { max-width: 980px; }
.sbv2-modal-dba .sbv2-modal-shell { max-width: 760px; }

.sbv2-modal-head {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
    padding: 18px 22px 16px;
    border-bottom: 1px solid var(--sbv2-line);
    background: var(--sbv2-paper);
}
.sbv2-modal-head-text { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1; }
.sbv2-modal-head h3 {
    margin: 0;
    font-family: 'Hanken Grotesk', system-ui, sans-serif;
    font-size: 18px; font-weight: 700; letter-spacing: -0.015em;
    color: var(--sbv2-ink);
}
.sbv2-modal-head .sbv2-eyebrow { margin: 0; }
.sbv2-modal-close {
    flex-shrink: 0;
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 32px;
    background: transparent; border: 1px solid var(--sbv2-line-strong); border-radius: 8px;
    color: var(--sbv2-muted); font-size: 22px; line-height: 1; cursor: pointer;
    transition: all 0.12s ease;
}
.sbv2-modal-close:hover { background: var(--sbv2-tint); color: var(--sbv2-ink); border-color: var(--sbv2-ink); }
.sbv2-modal .mp-dba-modal-body,
.sbv2-modal .mp-imgmanager-body,
.sbv2-modal .mp-imgedit-body { overflow: auto; padding: 20px 22px; }
.sbv2-modal .mp-dba-step { display: flex; flex-direction: column; gap: 14px; }

/* Modal field labels match page labels */
.sbv2-modal .mp-field { display: flex; flex-direction: column; gap: 6px; }
.sbv2-modal .mp-field-label {
    font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em;
    color: var(--sbv2-muted); font-weight: 600;
}
.sbv2-modal .mp-field-input {
    padding: 9px 12px;
    background: var(--sbv2-paper);
    border: 1px solid var(--sbv2-line-strong);
    border-radius: 8px;
    color: var(--sbv2-ink);
    font-family: 'Hanken Grotesk', system-ui, sans-serif;
    font-size: 14px;
    width: 100%;
}
.sbv2-modal .mp-field-input:focus {
    outline: none; border-color: var(--sbv2-ink); box-shadow: 0 0 0 3px var(--sbv2-tint);
}
.sbv2-modal select.mp-field-input {
    appearance: none; -webkit-appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236F6E66' stroke-width='2' stroke-linecap='round'><polyline points='6 9 12 15 18 9'/></svg>");
    background-repeat: no-repeat; background-position: right 10px center; background-size: 14px;
    padding-right: 34px;
}

/* Buttons inside modals — recolor existing primary/secondary classes to v2 */
.sbv2-modal .mp-dba-btn-primary,
.sbv2-modal .mp-dba-btn-secondary,
.sbv2-modal .mp-dba-fetch-btn,
.sbv2-modal .mp-dba-toggle-all,
.sbv2-modal .mp-imgedit-btn,
.sbv2-modal .mp-imgedit-auto-btn,
.sbv2-modal .mp-img-upload-btn,
.sbv2-modal .mp-ai-studio-btn {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 14px;
    border-radius: 8px;
    font-family: 'Hanken Grotesk', system-ui, sans-serif;
    font-size: 13px; font-weight: 500;
    cursor: pointer;
    transition: all 0.12s ease;
    border: 1px solid var(--sbv2-line-strong);
    background: var(--sbv2-paper);
    color: var(--sbv2-ink);
    line-height: 1;
}
.sbv2-modal .mp-dba-btn-secondary,
.sbv2-modal .mp-dba-toggle-all,
.sbv2-modal .mp-imgedit-auto-btn,
.sbv2-modal .mp-imgedit-btn-reset { background: var(--sbv2-paper); }
.sbv2-modal .mp-dba-btn-primary,
.sbv2-modal .mp-dba-fetch-btn,
.sbv2-modal .mp-imgedit-btn-save,
.sbv2-modal .mp-img-upload-btn,
.sbv2-modal .mp-ai-studio-btn {
    background: var(--sbv2-ink); color: #FBFAF5; border-color: var(--sbv2-ink);
}
.sbv2-modal .mp-dba-btn-primary:hover,
.sbv2-modal .mp-dba-fetch-btn:hover,
.sbv2-modal .mp-imgedit-btn-save:hover,
.sbv2-modal .mp-img-upload-btn:hover,
.sbv2-modal .mp-ai-studio-btn:hover { background: #1F1F1B; color: #FBFAF5; }
.sbv2-modal .mp-dba-btn-secondary:hover,
.sbv2-modal .mp-dba-toggle-all:hover,
.sbv2-modal .mp-imgedit-auto-btn:hover,
.sbv2-modal .mp-imgedit-btn-reset:hover { background: var(--sbv2-tint); border-color: var(--sbv2-ink); }
.sbv2-modal .mp-dba-btn-primary[disabled],
.sbv2-modal .mp-dba-btn-secondary[disabled] { opacity: 0.45; cursor: not-allowed; }

/* DBA modal specifics */
.sbv2-modal .mp-dba-url-row { display: flex; gap: 8px; }
.sbv2-modal .mp-dba-url-row .mp-field-input { flex: 1; }
.sbv2-modal .mp-dba-error {
    padding: 10px 14px; border-radius: 8px;
    background: var(--sbv2-rust-soft); color: var(--sbv2-rust);
    border: 1px solid color-mix(in srgb, var(--sbv2-rust) 22%, var(--sbv2-line-strong));
    font-size: 13px;
}
.sbv2-modal .mp-dba-text-fields { display: flex; flex-direction: column; gap: 14px; }
.sbv2-modal .mp-dba-field-row { display: flex; gap: 12px; }
.sbv2-modal .mp-dba-current {
    font-size: 12px; color: var(--sbv2-muted-2);
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    padding: 4px 0;
}
.sbv2-modal .mp-dba-current small { color: var(--sbv2-muted-2); }
.sbv2-modal .mp-dba-field-cb { accent-color: var(--sbv2-ink); margin-right: 4px; }
.sbv2-modal .mp-dba-dims-row { display: flex; align-items: center; gap: 6px; }
.sbv2-modal .mp-dba-dim {
    flex: 1; display: flex; align-items: center; gap: 6px;
    background: var(--sbv2-paper); border: 1px solid var(--sbv2-line-strong); border-radius: 8px; padding: 0 10px;
}
.sbv2-modal .mp-dba-dim span {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 11px; color: var(--sbv2-muted-2); font-weight: 600;
}
.sbv2-modal .mp-dba-dim input {
    flex: 1; border: 0; background: transparent; padding: 9px 0;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 13px; color: var(--sbv2-ink);
}
.sbv2-modal .mp-dba-dim input:focus { outline: none; }
.sbv2-modal .mp-dim-sep { color: var(--sbv2-muted-2); }
.sbv2-modal .mp-dba-images-section { display: flex; flex-direction: column; gap: 10px; }
.sbv2-modal .mp-dba-img-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 8px; }
.sbv2-modal .mp-dba-img-item {
    position: relative; aspect-ratio: 1; overflow: hidden;
    background: var(--sbv2-paper); border: 1px solid var(--sbv2-line-strong); border-radius: 8px;
    cursor: pointer;
}
.sbv2-modal .mp-dba-img-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sbv2-modal .mp-dba-img-item input { position: absolute; opacity: 0; }
.sbv2-modal .mp-dba-img-item.selected { border-color: var(--sbv2-ink); box-shadow: 0 0 0 1px var(--sbv2-ink); }
.sbv2-modal .mp-dba-img-check {
    position: absolute; top: 4px; right: 4px;
    width: 22px; height: 22px; border-radius: 50%;
    background: var(--sbv2-ink); color: #FBFAF5;
    display: none; align-items: center; justify-content: center;
    font-size: 14px; line-height: 1;
}
.sbv2-modal .mp-dba-img-item.selected .mp-dba-img-check { display: flex; }
.sbv2-modal .mp-dba-img-broken { opacity: 0.4; }
.sbv2-modal .mp-dba-actions {
    display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap;
    padding-top: 8px; border-top: 1px solid var(--sbv2-line); margin-top: 4px;
}
.sbv2-modal .mp-dba-loading-spinner {
    width: 32px; height: 32px; margin: 12px auto; border-radius: 50%;
    border: 2px solid var(--sbv2-line); border-top-color: var(--sbv2-ink);
    animation: sbv2-spin 0.8s linear infinite;
}
@keyframes sbv2-spin { to { transform: rotate(360deg); } }
.sbv2-modal .mp-dba-progress-wrap { padding: 24px 0; display: flex; flex-direction: column; gap: 10px; align-items: center; }
.sbv2-modal .mp-dba-progress-bar {
    width: 100%; max-width: 360px; height: 6px;
    background: var(--sbv2-line); border-radius: 999px; overflow: hidden;
}
.sbv2-modal .mp-dba-progress-fill {
    height: 100%; background: var(--sbv2-ink); transition: width 0.2s ease;
}
.sbv2-modal .mp-dba-progress-text { font-size: 13px; color: var(--sbv2-muted); }

/* Vision modal specifics */
.sbv2-modal .mp-vision-step { display: flex; flex-direction: column; gap: 14px; }
.sbv2-modal .mp-vision-img-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 8px;
}
.sbv2-modal .mp-vision-img-item {
    position: relative; aspect-ratio: 1; overflow: hidden;
    background: var(--sbv2-paper); border: 1px solid var(--sbv2-line-strong); border-radius: 8px;
    cursor: pointer; transition: all 0.12s ease;
}
.sbv2-modal .mp-vision-img-item img { width: 100%; height: 100%; object-fit: cover; }
.sbv2-modal .mp-vision-img-item.mp-vision-img-selected { border-color: var(--sbv2-ink); box-shadow: 0 0 0 1px var(--sbv2-ink); }
.sbv2-modal .mp-dba-img-badge {
    position: absolute; bottom: 4px; left: 4px;
    background: var(--sbv2-ink); color: #FBFAF5;
    font-size: 10px; padding: 2px 6px; border-radius: 999px;
    font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em;
}
.sbv2-modal .mp-vision-error {
    padding: 10px 14px; border-radius: 8px;
    background: var(--sbv2-rust-soft); color: var(--sbv2-rust);
    border: 1px solid color-mix(in srgb, var(--sbv2-rust) 22%, var(--sbv2-line-strong));
    font-size: 13px;
}
.sbv2-modal .mp-vision-saved-note {
    padding: 8px 12px; border-radius: 8px;
    background: var(--sbv2-tint); color: var(--sbv2-ink-2);
    border: 1px solid var(--sbv2-line); font-size: 13px;
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.sbv2-modal .mp-vision-refetch-btn {
    padding: 4px 10px; font-size: 12px;
    background: var(--sbv2-paper); border: 1px solid var(--sbv2-line-strong); border-radius: 6px;
    color: var(--sbv2-ink); cursor: pointer; font-weight: 500;
}
.sbv2-modal .mp-vision-refetch-btn:hover { background: var(--sbv2-tint); border-color: var(--sbv2-ink); }
.sbv2-modal .mp-vision-crop-hint { font-size: 13px; color: var(--sbv2-muted); margin: 0; }
.sbv2-modal .mp-vision-crop-wrap {
    position: relative; max-height: 480px; overflow: hidden;
    border-radius: 10px; background: var(--sbv2-bg);
    border: 1px solid var(--sbv2-line-strong);
    user-select: none;
}
.sbv2-modal .mp-vision-crop-wrap img { display: block; max-width: 100%; height: auto; }
.sbv2-modal .mp-vision-crop-overlay { position: absolute; inset: 0; pointer-events: none; }
.sbv2-modal .mp-vision-crop-overlay.mp-vision-crop-active { background: rgba(14,14,12,0.45); }
.sbv2-modal .mp-vision-crop-box {
    position: absolute; border: 1.5px dashed #FBFAF5;
    box-shadow: 0 0 0 1px rgba(14,14,12,0.6);
    pointer-events: none;
}
.sbv2-modal .mp-vision-hints-wrap { display: flex; flex-direction: column; gap: 8px; }
.sbv2-modal .mp-vision-hints-table {
    width: 100%; border-collapse: collapse;
    background: var(--sbv2-paper); border: 1px solid var(--sbv2-line-strong); border-radius: 10px;
    overflow: hidden; font-size: 13px; table-layout: fixed;
}
.sbv2-modal .mp-vision-hints-table thead th {
    padding: 8px 12px; background: var(--sbv2-tint);
    font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em;
    color: var(--sbv2-muted); font-weight: 600; text-align: left;
    border-bottom: 1px solid var(--sbv2-line);
}
.sbv2-modal .mp-vision-hints-table tbody td {
    padding: 8px 12px; border-bottom: 1px solid var(--sbv2-line);
    color: var(--sbv2-ink-2); vertical-align: top; word-wrap: break-word;
}
.sbv2-modal .mp-vision-hints-table tbody tr:last-child td { border-bottom: 0; }
.sbv2-modal .mp-vision-hint-label { color: var(--sbv2-muted); font-weight: 500; width: 110px; }
.sbv2-modal .mp-vision-hint-value[contenteditable] {
    background: var(--sbv2-paper); cursor: text; outline-offset: -1px;
    border-radius: 4px;
}
.sbv2-modal .mp-vision-hint-value[contenteditable]:focus { outline: 2px solid var(--sbv2-ink); background: #fff; }
.sbv2-modal .mp-vision-ht-apival { color: var(--sbv2-muted); font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 12px; }
.sbv2-modal .mp-vision-tabs {
    display: flex; gap: 0; padding: 4px;
    background: var(--sbv2-tint); border: 1px solid var(--sbv2-line); border-radius: 10px;
}
.sbv2-modal .mp-vision-tab {
    flex: 1; padding: 8px 12px;
    background: transparent; border: 0; border-radius: 6px;
    font-family: 'Hanken Grotesk', system-ui, sans-serif;
    font-size: 13px; color: var(--sbv2-muted); font-weight: 500;
    cursor: pointer; transition: all 0.12s ease;
}
.sbv2-modal .mp-vision-tab:hover { color: var(--sbv2-ink); }
.sbv2-modal .mp-vision-tab.mp-vision-tab-active {
    background: var(--sbv2-paper); color: var(--sbv2-ink);
    box-shadow: 0 1px 2px rgba(14,14,12,0.06);
}
.sbv2-modal .mp-vision-tab.mp-vision-tab-done::after {
    content: '✓'; margin-left: 6px; color: var(--sbv2-moss);
}
.sbv2-modal .mp-vision-panel-empty { padding: 24px 0; display: flex; justify-content: center; }
.sbv2-modal .mp-vision-panel-result { display: flex; flex-direction: column; gap: 10px; }
.sbv2-modal .mp-vision-prompt-details {
    background: var(--sbv2-tint); border: 1px solid var(--sbv2-line);
    border-radius: 8px; padding: 8px 12px; font-size: 12px; color: var(--sbv2-muted);
}
.sbv2-modal .mp-vision-prompt-details summary { cursor: pointer; font-weight: 500; color: var(--sbv2-ink-2); }
.sbv2-modal .mp-vision-prompt-text {
    margin-top: 8px; max-height: 280px; overflow: auto;
    font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 11.5px;
    color: var(--sbv2-ink-2); white-space: pre-wrap;
}
.sbv2-modal .mp-vision-img-preview img {
    max-width: 200px; height: auto; border-radius: 8px;
    border: 1px solid var(--sbv2-line-strong);
}
.sbv2-modal .mp-vision-timestamp {
    font-size: 12px; color: var(--sbv2-muted-2);
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}

/* Image manager modal */
.sbv2-modal .mp-img-manager { display: flex; flex-direction: column; gap: 12px; }
.sbv2-modal .mp-img-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px;
}
.sbv2-modal .mp-img-item {
    position: relative; aspect-ratio: 1; overflow: hidden;
    background: var(--sbv2-paper); border: 1px solid var(--sbv2-line-strong); border-radius: 8px;
}
.sbv2-modal .mp-img-item img { width: 100%; height: 100%; object-fit: cover; }
.sbv2-modal .mp-img-item.mp-img-featured { border-color: var(--sbv2-ink); box-shadow: 0 0 0 1px var(--sbv2-ink); }
.sbv2-modal .mp-img-item.mp-img-dragging { opacity: 0.5; transform: scale(0.96); }
.sbv2-modal .mp-img-star,
.sbv2-modal .mp-img-del,
.sbv2-modal .mp-img-edit {
    position: absolute; width: 26px; height: 26px;
    background: rgba(255,255,255,0.92); border: 1px solid var(--sbv2-line-strong);
    border-radius: 6px; cursor: pointer;
    display: inline-flex; align-items: center; justify-content: center;
    color: var(--sbv2-muted); font-size: 14px; line-height: 1;
    transition: all 0.12s ease;
}
.sbv2-modal .mp-img-star { top: 4px; left: 4px; }
.sbv2-modal .mp-img-del { top: 4px; right: 4px; color: var(--sbv2-rust); }
.sbv2-modal .mp-img-edit { bottom: 4px; right: 4px; }
.sbv2-modal .mp-img-star:hover { background: var(--sbv2-paper); color: var(--sbv2-amber); border-color: var(--sbv2-amber); }
.sbv2-modal .mp-img-del:hover { background: var(--sbv2-rust-soft); border-color: var(--sbv2-rust); }
.sbv2-modal .mp-img-edit:hover { background: var(--sbv2-paper); color: var(--sbv2-ink); border-color: var(--sbv2-ink); }
.sbv2-modal .mp-img-star-active { background: var(--sbv2-amber-soft); color: var(--sbv2-amber); border-color: var(--sbv2-amber); }
.sbv2-modal .mp-img-empty {
    grid-column: 1 / -1; padding: 32px 8px;
    display: flex; flex-direction: column; align-items: center; gap: 8px;
    color: var(--sbv2-muted-2);
}
.sbv2-modal .mp-img-dropzone {
    display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
    padding: 14px;
    background: var(--sbv2-bg); border: 1px dashed var(--sbv2-line-strong); border-radius: 10px;
}
.sbv2-modal .mp-img-dropzone.mp-img-dragover { border-color: var(--sbv2-ink); background: var(--sbv2-tint); }
.sbv2-modal .mp-img-drop-text { color: var(--sbv2-muted-2); font-size: 13px; }
.sbv2-modal .mp-img-progress {
    width: 100%; height: 6px;
    background: var(--sbv2-line); border-radius: 999px; overflow: hidden;
}
.sbv2-modal .mp-img-progress-bar { height: 100%; background: var(--sbv2-ink); transition: width 0.2s ease; }
.sbv2-modal .mp-img-upload-status { font-size: 12px; color: var(--sbv2-muted); }

/* Image editor modal */
.sbv2-modal .mp-imgedit-canvas-wrap {
    position: relative; min-height: 300px; max-height: 60vh; overflow: hidden;
    background: var(--sbv2-bg); border: 1px solid var(--sbv2-line-strong); border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
}
.sbv2-modal .mp-imgedit-canvas-wrap canvas { max-width: 100%; max-height: 60vh; }
.sbv2-modal .mp-imgedit-loading {
    position: absolute; color: var(--sbv2-muted); font-size: 13px;
}
.sbv2-modal .mp-imgedit-controls { display: flex; flex-direction: column; gap: 12px; padding-top: 12px; }
.sbv2-modal .mp-imgedit-auto-row { display: flex; gap: 8px; flex-wrap: wrap; }
.sbv2-modal .mp-imgedit-slider-group {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px;
    padding: 12px; background: var(--sbv2-tint); border-radius: 10px;
}
.sbv2-modal .mp-imgedit-slider {
    display: grid; grid-template-columns: 80px 1fr 50px; gap: 10px; align-items: center;
}
.sbv2-modal .mp-imgedit-slider label {
    font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em;
    color: var(--sbv2-muted); font-weight: 600;
}
.sbv2-modal .mp-imgedit-slider input[type=range] {
    -webkit-appearance: none; appearance: none;
    height: 4px; background: var(--sbv2-line-strong); border-radius: 999px;
}
.sbv2-modal .mp-imgedit-slider input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none; appearance: none;
    width: 16px; height: 16px; border-radius: 50%;
    background: var(--sbv2-ink); cursor: pointer; border: 2px solid #FBFAF5;
    box-shadow: 0 0 0 1px var(--sbv2-line-strong);
}
.sbv2-modal .mp-imgedit-slider input[type=range]::-moz-range-thumb {
    width: 16px; height: 16px; border-radius: 50%;
    background: var(--sbv2-ink); cursor: pointer; border: 2px solid #FBFAF5;
}
.sbv2-modal .mp-imgedit-val {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 12px; color: var(--sbv2-ink-2); text-align: right;
}
.sbv2-modal .mp-imgedit-culling-note {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 6px 12px; margin: 12px 22px;
    background: var(--sbv2-amber-soft); color: var(--sbv2-amber);
    border: 1px solid color-mix(in srgb, var(--sbv2-amber) 22%, var(--sbv2-line-strong));
    border-radius: 999px; font-size: 11px; align-self: flex-start;
}
.sbv2-modal .mp-imgedit-footer {
    display: flex; justify-content: flex-end; gap: 8px;
    padding: 14px 22px; border-top: 1px solid var(--sbv2-line);
    background: var(--sbv2-paper);
}

/* AI Fotostudie modal — same scoping when partial wraps in .sbv2-modal too */
.sbv2-modal .mp-ai-studio-btn { background: var(--sbv2-ink); color: #FBFAF5; border-color: var(--sbv2-ink); }

/* Modal mobile */
@media (max-width: 640px) {
    .sbv2-modal { padding: 0; align-items: stretch; }
    .sbv2-modal .sbv2-modal-shell { max-width: 100%; max-height: 100%; height: 100%; border-radius: 0; border: 0; }
    .sbv2-modal .mp-dba-modal-body,
    .sbv2-modal .mp-imgmanager-body,
    .sbv2-modal .mp-imgedit-body { padding: 16px; }
    .sbv2-modal .sbv2-modal-head { padding: 14px 16px; }
    .sbv2-modal .mp-dba-actions { justify-content: stretch; }
    .sbv2-modal .mp-dba-actions .mp-dba-btn-primary,
    .sbv2-modal .mp-dba-actions .mp-dba-btn-secondary { flex: 1; justify-content: center; }
    .sbv2-modal .mp-vision-tabs { flex-wrap: wrap; }
}