/**
 * MvxConfirm — minimal confirmation modal (delete / destructive actions).
 * Reuses the same --mvx-* tokens as mvx-select, already bridged per area.
 */
.mvx-confirm-overlay {
    position: fixed; inset: 0; z-index: 9500;
    background: rgba(8, 15, 30, .55); backdrop-filter: blur(4px);
    display: flex; align-items: center; justify-content: center; padding: 16px;
    opacity: 0; visibility: hidden; transition: opacity .18s ease, visibility .18s ease;
}
.mvx-confirm-overlay.open { opacity: 1; visibility: visible; }

.mvx-confirm-modal {
    width: 100%; max-width: 360px; text-align: center;
    background: var(--mvx-surface); border: 1px solid var(--mvx-border);
    border-radius: 16px; box-shadow: var(--mvx-shadow);
    padding: 28px 26px 22px; font-family: var(--mvx-font);
    transform: translateY(10px) scale(.97);
    transition: transform .2s cubic-bezier(.2, .8, .2, 1);
}
.mvx-confirm-overlay.open .mvx-confirm-modal { transform: translateY(0) scale(1); }

.mvx-confirm-icon {
    width: 52px; height: 52px; margin: 0 auto 16px; border-radius: 50%;
    background: var(--mvx-danger-bg); color: var(--mvx-danger);
    display: flex; align-items: center; justify-content: center; font-size: 20px;
}
.mvx-confirm-neutral .mvx-confirm-icon { background: var(--mvx-accent-bg); color: var(--mvx-accent); }

.mvx-confirm-title { font-size: 16px; font-weight: 700; color: var(--mvx-text-1); margin-bottom: 8px; }
.mvx-confirm-message { font-size: 13px; line-height: 1.55; color: var(--mvx-text-2); margin-bottom: 22px; white-space: pre-line; }

.mvx-confirm-actions { display: flex; gap: 10px; }
.mvx-confirm-btn {
    flex: 1; padding: 10px 16px; border-radius: 10px; border: 1.5px solid transparent;
    font-family: var(--mvx-font); font-size: 13.5px; font-weight: 600; cursor: pointer;
    transition: border-color .15s, color .15s, filter .15s, background .15s;
}
.mvx-confirm-cancel { background: var(--mvx-surface-2); border-color: var(--mvx-border); color: var(--mvx-text-2); }
.mvx-confirm-cancel:hover { border-color: var(--mvx-text-3); color: var(--mvx-text-1); }
.mvx-confirm-ok { background: var(--mvx-danger); color: #fff; }
.mvx-confirm-ok:hover { filter: brightness(1.08); }
.mvx-confirm-neutral .mvx-confirm-ok { background: var(--mvx-accent); color: var(--brand-on-accent, #fff); }