/* ════════════════════════════════════════════════════════════════════
   Phase 6 — global SweetAlert2 polish.
   Applies to every Swal popup in the admin app without per-call opt-in.
   Modern, low-noise, matches the indigo→violet palette of the segments
   and campaigns dashboards.
   ════════════════════════════════════════════════════════════════════ */
.swal2-container {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  /* Sit above any in-app modal. The segments editor (.sg-modal-bg) and
     campaigns detail (.cp-detail-bg) use z-index: 1000010, so a Swal
     fired from inside one of those (e.g. "Show more in Members" or
     the run-campaign confirm) must have a higher stacking context to
     land on top instead of slipping behind the modal backdrop. */
  z-index: 1000020 !important;
}
.swal2-popup {
  border-radius: 20px !important;
  padding: 28px 30px !important;
  box-shadow: 0 24px 60px rgba(15, 23, 42, .22),
              0 6px 18px  rgba(15, 23, 42, .08) !important;
  border: 1px solid rgba(226, 232, 240, .85);
}
.swal2-popup .swal2-title {
  font-size: 19px !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  letter-spacing: -.01em;
}
.swal2-popup .swal2-html-container,
.swal2-popup .swal2-content {
  font-size: 13.5px !important;
  color: #475569 !important;
  line-height: 1.55 !important;
}

/* Buttons — pill-shaped gradients matching the admin sidebar accent. */
.swal2-actions { gap: 8px !important; }
.swal2-styled.swal2-confirm {
  background: linear-gradient(135deg, #6366f1, #7c3aed) !important;
  border: 0 !important; border-radius: 12px !important;
  padding: 10px 22px !important;
  font-weight: 700 !important; font-size: 13px !important; letter-spacing: .01em;
  box-shadow: 0 6px 14px rgba(99, 102, 241, .28) !important;
  transition: transform .12s ease, box-shadow .12s ease;
}
.swal2-styled.swal2-confirm:hover  { transform: translateY(-1px); box-shadow: 0 8px 18px rgba(99,102,241,.34) !important; }
.swal2-styled.swal2-confirm:active { transform: scale(.97); }
.swal2-styled.swal2-cancel {
  background: #fff !important; color: #0f172a !important;
  border: 1px solid #e2e8f0 !important; border-radius: 12px !important;
  padding: 10px 20px !important;
  font-weight: 700 !important; font-size: 13px !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04) !important;
}
.swal2-styled.swal2-cancel:hover { border-color: #cbd5e1 !important; background:#f8fafc !important; }
.swal2-styled.swal2-deny {
  background: #fff !important; color: #dc2626 !important;
  border: 1px solid #fecaca !important; border-radius: 12px !important;
  padding: 10px 20px !important;
  font-weight: 700 !important; font-size: 13px !important;
}

/* Confirm buttons that are explicitly destructive (Cancel campaign,
   Delete segment, etc.) get a red gradient. We detect them via the
   `confirmButtonColor:'#dc2626'` style attribute SweetAlert injects. */
.swal2-styled.swal2-confirm[style*="rgb(220, 38, 38)"],
.swal2-styled.swal2-confirm[style*="#dc2626"] {
  background: linear-gradient(135deg, #ef4444, #b91c1c) !important;
  box-shadow: 0 6px 14px rgba(220, 38, 38, .28) !important;
}

/* Icons — flatten the saturated defaults. */
.swal2-icon { margin: 6px auto 14px !important; }
.swal2-icon.swal2-success           { border-color: #10b981 !important; color: #10b981 !important; }
.swal2-icon.swal2-success [class^=swal2-success-line] { background-color: #10b981 !important; }
.swal2-icon.swal2-success .swal2-success-ring          { border-color: #d1fae5 !important; }
.swal2-icon.swal2-warning           { border-color: #f59e0b !important; color: #f59e0b !important; }
.swal2-icon.swal2-error             { border-color: #ef4444 !important; color: #ef4444 !important; }
.swal2-icon.swal2-info              { border-color: #6366f1 !important; color: #6366f1 !important; }
.swal2-icon.swal2-question          { border-color: #6366f1 !important; color: #6366f1 !important; }

/* Toast popups — used everywhere with position:'top-end'. */
.swal2-popup.swal2-toast {
  border-radius: 14px !important;
  padding: 12px 16px !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, .18),
              0 3px 9px   rgba(15, 23, 42, .06) !important;
  background: #fff !important;
  border: 1px solid rgba(226, 232, 240, .9) !important;
}
.swal2-popup.swal2-toast .swal2-title { font-size: 13.5px !important; font-weight: 700 !important; }
.swal2-popup.swal2-toast.swal2-icon-success { border-left: 4px solid #10b981 !important; }
.swal2-popup.swal2-toast.swal2-icon-error   { border-left: 4px solid #ef4444 !important; }
.swal2-popup.swal2-toast.swal2-icon-warning { border-left: 4px solid #f59e0b !important; }
.swal2-popup.swal2-toast.swal2-icon-info    { border-left: 4px solid #6366f1 !important; }

/* Form inputs inside Swal (e.g. "Recipient email?" prompt). */
.swal2-input, .swal2-textarea, .swal2-select {
  border: 1px solid #e2e8f0 !important;
  border-radius: 10px !important;
  font-size: 13px !important;
  box-shadow: none !important;
  padding: 10px 14px !important;
  font-family: inherit !important;
}
.swal2-input:focus, .swal2-textarea:focus, .swal2-select:focus {
  border-color: #6366f1 !important;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, .15) !important;
  outline: none !important;
}

/* Validation message at the bottom of the popup. */
.swal2-validation-message {
  background: #fee2e2 !important;
  color: #991b1b !important;
  border-radius: 10px !important;
  padding: 8px 12px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

/* Backdrop — slightly darker + blur for that "modal" feel. */
.swal2-container.swal2-backdrop-show {
  background: rgba(15, 23, 42, .55) !important;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}

/* Subtle entrance animation — replaces the bouncy default. */
@keyframes swalFadeUp {
  from { opacity: 0; transform: translateY(8px) scale(.985); }
  to   { opacity: 1; transform: none; }
}
.swal2-show { animation: swalFadeUp .25s cubic-bezier(.4,0,.2,1) !important; }