/* Shared confirm dialog. Self-contained styles using scoped class names so
   the component looks consistent across surfaces without depending on host
   modal CSS. Pair with /shared/confirm.js. */
.cz-confirm-backdrop {
  position: fixed; inset: 0; z-index: 1000;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
  animation: czConfirmFadeIn 0.15s ease-out;
  overscroll-behavior: contain;
}
.cz-confirm-backdrop.closing { animation: czConfirmFadeOut 0.14s ease-in forwards; }
body:has(> .cz-confirm-backdrop) { overflow: hidden; }
.cz-confirm {
  background: #fff; border-radius: 8px; padding: 1.5rem;
  max-width: 420px; width: calc(100% - 2rem);
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
  animation: czConfirmPopIn 0.15s ease-out;
  font-family: inherit; color: #222;
}
.cz-confirm-backdrop.closing .cz-confirm { animation: czConfirmPopOut 0.14s ease-in forwards; }
.cz-confirm h3 { font-size: 1.0625rem; font-weight: 600; margin: 0 0 0.5rem; color: #222; }
.cz-confirm p { font-size: 0.9375rem; color: #555; line-height: 1.5; margin: 0 0 1.25rem; }
.cz-confirm-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.5rem; }
.cz-confirm-btn {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0.5rem 0.875rem; border-radius: var(--cz-confirm-btn-radius, 4px);
  border: 1px solid #ddd; background: #fff; cursor: pointer;
  font: inherit; font-size: 0.875rem; color: #222;
}
.cz-confirm-btn:hover { background: #f3f4f6; }
.cz-confirm-btn.primary {
  background: var(--cz-confirm-primary, #2c4a6e);
  border-color: var(--cz-confirm-primary, #2c4a6e);
  color: #fff;
}
.cz-confirm-btn.primary:hover { background: var(--cz-confirm-primary-hover, #244062); }
.cz-confirm-btn.danger {
  background: var(--cz-confirm-danger, #c4322f);
  border-color: var(--cz-confirm-danger, #c4322f);
  color: #fff;
}
.cz-confirm-btn.danger:hover { background: var(--cz-confirm-danger-hover, #a82a27); }
@keyframes czConfirmFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes czConfirmFadeOut { from { opacity: 1; } to { opacity: 0; } }
@keyframes czConfirmPopIn { from { opacity: 0; transform: scale(0.96); } to { opacity: 1; transform: scale(1); } }
@keyframes czConfirmPopOut { from { opacity: 1; transform: scale(1); } to { opacity: 0; transform: scale(0.98); } }
@media (prefers-reduced-motion: reduce) {
  .cz-confirm-backdrop, .cz-confirm, .cz-confirm-backdrop.closing, .cz-confirm-backdrop.closing .cz-confirm { animation: none; }
}