/* v2 модалки */
body.v2 .v2-modal-backdrop {
  position: fixed; inset: 0; z-index: 100;
  background: var(--clr-backdrop);
  display: flex; align-items: center; justify-content: center;
  opacity: 0; pointer-events: none; transition: opacity .18s;
}
body.v2 .v2-modal-backdrop.open { opacity: 1; pointer-events: auto; }
body.v2 .v2-modal {
  background: var(--clr-card);
  border: 1px solid var(--clr-hairline);
  border-radius: var(--r-modal);
  box-shadow: var(--shadow-popup);
  display: flex; flex-direction: column;
  max-width: calc(100vw - 48px); max-height: calc(100vh - 48px);
}
body.v2 .v2-modal-header {
  display: flex; align-items: center; gap: 12px;
  padding: 0 var(--sp-6); height: 64px; flex: 0 0 auto;
}
body.v2 .v2-modal-title { font-size: var(--fs-h2); font-weight: 700; margin: 0; }
body.v2 .v2-modal-sub { color: var(--clr-text-3); font-size: var(--fs-sm); }
body.v2 .v2-modal-close {
  margin-left: auto; width: 32px; height: 32px; border: 0; border-radius: 8px;
  background: transparent; color: var(--clr-text-3); font-size: 18px; cursor: pointer;
}
body.v2 .v2-modal-close:hover { background: var(--clr-fill-hover); color: var(--clr-text); }
body.v2 .v2-modal-body { padding: var(--sp-5) var(--sp-6); overflow: auto; }
body.v2 .v2-modal-footer {
  display: flex; align-items: center; gap: 10px;
  padding: 0 var(--sp-6); height: 68px; flex: 0 0 auto;
  border-top: 1px solid var(--clr-hairline);
}
body.v2 .v2-modal-footer .spacer { flex: 1 1 auto; }

/* Модалка підтвердження v2 (Penpot: modal / delete-confirm, 560px) */
body.v2 .v2-confirm { width: 560px; max-width: calc(100vw - 32px); border-radius: 16px; background: #171b24; border: 1px solid rgba(255,255,255,.07); }
body.v2 .v2-confirm-head { display: flex; gap: 16px; padding: 28px 28px 0; }
body.v2 .v2-confirm-ico { width: 48px; height: 48px; flex: 0 0 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 18px; background: rgba(251,191,36,.14); border: 1px solid rgba(251,191,36,.3); color: #e8eaf0; }
body.v2 .v2-confirm.danger .v2-confirm-ico { background: rgba(220,53,69,.14); border-color: rgba(220,53,69,.3); }
body.v2 .v2-confirm-tt { min-width: 0; padding-top: 4px; }
body.v2 .v2-confirm-tt .t { font-size: 19px; font-weight: 600; color: #e8eaf0; }
body.v2 .v2-confirm-tt .s { font-size: 13px; color: #98a2b3; margin-top: 2px; }
body.v2 .v2-confirm-body { padding: 20px 28px 24px; font-size: 12px; color: #98a2b3; line-height: 1.45; }
body.v2 .v2-confirm-body .warn { margin-top: 10px; padding: 12px 16px; border-radius: 12px; background: rgba(251,191,36,.10); border: 1px solid rgba(251,191,36,.28); color: #f2d08a; font-size: 12px; }
body.v2 .v2-confirm.danger .v2-confirm-body .warn { background: rgba(220,53,69,.10); border-color: rgba(220,53,69,.28); color: #ff8a8a; }
body.v2 .v2-confirm-foot { border-top: 1px solid rgba(255,255,255,.05); padding: 20px 28px 24px; display: flex; justify-content: flex-end; gap: 12px; }
body.v2 .v2-confirm-foot .v2-btn { height: 40px; font-size: 13px; padding: 0 18px; min-width: 100px; }
body.v2 .v2-confirm.danger #v2ConfirmOk { background: rgba(220,53,69,.92); border-color: transparent; color: #fff; }
