/* Overlay */

.confirm-overlay {
  position: fixed;
  inset: 0;

  background: rgba(0, 0, 0, 0.45);

  display: flex;
  align-items: center;
  justify-content: center;

  opacity: 0;
  visibility: hidden;

  transition: 0.25s;

  z-index: 99999;
}

.confirm-overlay.show {
  opacity: 1;
  visibility: visible;
}

/* Modal */

.confirm-modal {
  width: 420px;
  max-width: 90%;

  background: #fff;

  border-radius: 14px;

  padding: 25px;

  transform: scale(0.9);

  transition: 0.25s;

  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.18);

  font-family: Poppins, sans-serif;
}

.confirm-overlay.show .confirm-modal {
  transform: scale(1);
}

/* Title */

.confirm-title {
  font-size: 22px;

  font-weight: 600;

  margin-bottom: 15px;

  color: #222;

  font-family: inherit;
}

/* Message */

.confirm-message {
  font-size: 15px;

  color: #666;

  line-height: 26px;

  margin-bottom: 30px;
}

/* Footer */

.confirm-footer {
  display: flex;

  justify-content: flex-end;

  gap: 12px;
}

/* Buttons */

.confirm-btn {
  border: none;

  padding: 11px 22px;

  border-radius: 8px;

  cursor: pointer;

  font-size: 15px;

  transition: 0.25s;
}

.confirm-cancel {
  background: #e5e7eb;

  color: #222;
}

.confirm-cancel:hover {
  background: #d1d5db;
}

.confirm-delete {
  background: #dc2626;

  color: #fff;
}

.confirm-delete:hover {
  background: #b91c1c;
}

.confirm-btn:focus-visible {
  outline: 3px solid #932140;
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .confirm-overlay,
  .confirm-modal {
    transition-duration: 0.01ms;
  }
}