/* ─────────────────────────────────────────────────────────────────────────────
   swal-theme.css — the one look for every dialog, on every portal.

   SweetAlert2 v11 draws the dialog; this sheet makes it the portal's: the UI
   face, the card radius and shadow, brand buttons, and a short eased entrance
   (fade + slight rise, 200 ms) instead of the library's bounce. The classes
   are applied by dashboard/js/swal-dialogs.js through Swal.mixin, so direct
   Swal.fire calls on a page get the same look as swalConfirm / swalAlert.
   Colour tokens come from the loaded portal theme; the fallbacks are the
   applicant blue. Logical properties so Arabic mirrors on its own.
   ───────────────────────────────────────────────────────────────────────────── */

/* ── Motion ─────────────────────────────────────────────────────────────── */
@keyframes pfSwalIn  { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes pfSwalOut { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateY(6px) scale(.985); } }
@keyframes pfSwalBackIn  { from { opacity: 0; } to { opacity: 1; } }
@keyframes pfSwalBackOut { from { opacity: 1; } to { opacity: 0; } }
.swal2-popup.pf-swal-in  { animation: pfSwalIn  .2s cubic-bezier(.2, .8, .2, 1) both; }
.swal2-popup.pf-swal-out { animation: pfSwalOut .15s cubic-bezier(.4, 0, 1, 1) both; }
.swal2-container.pf-swal-back-in  { animation: pfSwalBackIn  .2s ease both; }
.swal2-container.pf-swal-back-out { animation: pfSwalBackOut .15s ease both; }
@media (prefers-reduced-motion: reduce) {
    .swal2-popup.pf-swal-in, .swal2-popup.pf-swal-out,
    .swal2-container.pf-swal-back-in, .swal2-container.pf-swal-back-out { animation: none; }
}

/* ── The card ───────────────────────────────────────────────────────────── */
.swal2-container.pf-swal-container { z-index: 20000; background: rgba(10, 37, 64, .45); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); }
.swal2-popup.pf-swal {
    width: min(92vw, 460px); padding: 26px 26px 22px;
    border-radius: var(--radius-lg, 16px); background: var(--surface, #fff);
    box-shadow: 0 24px 60px rgba(10, 37, 64, .28), 0 0 0 1px rgba(10, 37, 64, .06);
    font-family: var(--font-body, "Public Sans", -apple-system, "Segoe UI", Roboto, sans-serif); color: var(--ink, #1e2632);
}
[dir="rtl"] .swal2-popup.pf-swal { font-family: var(--font-arabic, "Noto Naskh Arabic", "Segoe UI", Tahoma, sans-serif), var(--font-body, sans-serif); direction: rtl; }
.pf-swal .swal2-title { margin: 6px 0 0; padding: 0; font-size: 18px; font-weight: 700; line-height: 1.3; color: var(--ink, #1e2632); }
.pf-swal .swal2-html-container { margin: 10px 0 0; padding: 0; font-size: 14px; line-height: 1.6; color: var(--ink-soft, #4b5563); }
.pf-swal .swal2-footer { margin: 16px 0 0; padding: 12px 0 0; border-top: 1px solid var(--line, #e4e8ee); font-size: 12.5px; color: var(--ink-mute, #79839a); }
.pf-swal .swal2-close { top: 8px; inset-inline-end: 8px; width: 34px; height: 34px; font-size: 26px; color: var(--ink-mute, #79839a); border-radius: 50%; }
.pf-swal .swal2-close:hover { background: var(--paper, #f5f7fa); color: var(--ink, #1e2632); }

/* ── Icons: smaller, calmer, in the portal's tones ──────────────────────── */
.pf-swal .swal2-icon { width: 60px; height: 60px; margin: 0 auto 4px; border-width: 3px; }
.pf-swal .swal2-icon .swal2-icon-content { font-size: 40px; }
.pf-swal .swal2-icon.swal2-warning  { border-color: #e8b64d; color: #b8860b; }
.pf-swal .swal2-icon.swal2-error    { border-color: #e8a29c; }
.pf-swal .swal2-icon.swal2-error [class^='swal2-x-mark-line'] { background: #b3261e; }
.pf-swal .swal2-icon.swal2-success  { border-color: #9ad4b6; }
.pf-swal .swal2-icon.swal2-success .swal2-success-line-tip,
.pf-swal .swal2-icon.swal2-success .swal2-success-line-long { background: var(--ok, #17694a); }
.pf-swal .swal2-icon.swal2-success .swal2-success-ring { border-color: rgba(23, 105, 74, .3); }
.pf-swal .swal2-icon.swal2-info     { border-color: #9cc2e5; color: var(--brand, #1a5c96); }
.pf-swal .swal2-icon.swal2-question { border-color: #9cc2e5; color: var(--brand, #1a5c96); }

/* ── Buttons: ours, not the library's (buttonsStyling: false) ──────────── */
.pf-swal .swal2-actions { margin: 20px 0 0; gap: 10px; flex-wrap: wrap; }
.pf-swal .swal2-actions > button { min-width: 112px; padding: 10px 18px; border-radius: 10px; font-size: 14px; font-weight: 700; line-height: 1.2;
                                   border: 1px solid transparent; cursor: pointer; transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .1s ease; }
.pf-swal .swal2-actions > button:active { transform: translateY(1px); }
.pf-swal .swal2-actions > button:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--brand-soft, #eaf2fa), 0 0 0 5px var(--brand, #1a5c96); }
.pf-swal-confirm { background: var(--brand, #1a5c96); color: #fff; box-shadow: 0 4px 12px rgba(26, 92, 150, .28); }
.pf-swal-confirm:hover { background: var(--brand-dark, #123d68); }
.pf-swal.is-danger .pf-swal-confirm { background: #b3261e; box-shadow: 0 4px 12px rgba(179, 38, 30, .28); }
.pf-swal.is-danger .pf-swal-confirm:hover { background: #8f1c16; }
.pf-swal.is-ok .pf-swal-confirm { background: var(--ok, #17694a); box-shadow: 0 4px 12px rgba(23, 105, 74, .28); }
.pf-swal.is-ok .pf-swal-confirm:hover { background: #125438; }
.pf-swal-cancel { background: #fff; color: var(--ink-soft, #4b5563); border-color: var(--line, #e4e8ee) !important; }
.pf-swal-cancel:hover { background: var(--paper, #f5f7fa); color: var(--ink, #1e2632); }
.pf-swal-deny { background: #fff; color: #b3261e; border-color: #f2c8c5 !important; }
.pf-swal-deny:hover { background: #fdecea; }

/* ── Inputs inside a dialog ─────────────────────────────────────────────── */
.pf-swal .swal2-input, .pf-swal .swal2-textarea, .pf-swal .swal2-select {
    margin: 14px 0 0; padding: 10px 12px; border: 1.5px solid var(--line, #e4e8ee); border-radius: 10px; box-shadow: none;
    font-size: 14px; font-family: inherit; color: var(--ink, #1e2632); transition: border-color .15s ease, box-shadow .15s ease; }
.pf-swal .swal2-input:focus, .pf-swal .swal2-textarea:focus, .pf-swal .swal2-select:focus { border-color: var(--brand, #1a5c96); box-shadow: 0 0 0 3px var(--brand-soft, #eaf2fa); outline: none; }
.pf-swal .swal2-validation-message { margin: 10px 0 0; padding: 8px 12px; border-radius: 8px; background: #fdecea; color: #7a2520; font-size: 12.5px; }

@media (max-width: 480px) {
    .swal2-popup.pf-swal { padding: 22px 18px 18px; }
    .pf-swal .swal2-actions > button { flex: 1 1 auto; }
}