/* ============================================================
   RAFFLESIA GROUP OF INSTITUTIONS — Toast alerts (popsuccess / popwarning /
   popdanger). Self-contained branded toasts, no Bootstrap
   needed. Scoped to the ids the script creates.
   ============================================================ */

#success-alert,
#warning-alert,
#danger-alert {
    position: fixed;
    top: 18px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 99999;
    max-width: min(480px, calc(100vw - 28px));
    width: max-content;
    display: flex;
    align-items: flex-start;
    gap: 6px;
    padding: 13px 16px 13px 18px;
    border-radius: 16px;
    font-family: "Plus Jakarta Sans", "Segoe UI", system-ui, sans-serif;
    font-size: 13.5px;
    line-height: 1.55;
    box-shadow: 0 16px 40px rgba(10, 14, 40, 0.28);
    animation: aebToastIn .35s cubic-bezier(.21, .8, .35, 1);
    word-break: break-word;
}

@keyframes aebToastIn {
    from { opacity: 0; transform: translate(-50%, -18px); }
    to { opacity: 1; transform: translate(-50%, 0); }
}

#success-alert {
    background: #ffffff;
    color: #232B4D;
    border: 1px solid #BFE0D1;
    border-left: 5px solid #2E7D5B;
}

#warning-alert {
    background: #ffffff;
    color: #232B4D;
    border: 1px solid #F3E6BC;
    border-left: 5px solid #C9A227;
}

#danger-alert {
    background: #ffffff;
    color: #232B4D;
    border: 1px solid #F0CFCC;
    border-left: 5px solid #B33A3A;
}

#success-alert strong,
#warning-alert strong,
#danger-alert strong {
    font-weight: 800;
    white-space: nowrap;
}

#success-alert strong { color: #2E7D5B; }
#warning-alert strong { color: #7A6014; }
#danger-alert strong { color: #B33A3A; }

#success-alert .close,
#warning-alert .close,
#danger-alert .close {
    order: 2;
    margin-left: 8px;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    border: none;
    border-radius: 999px;
    background: #EDF2FC;
    color: #5A6B87;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background .15s ease, color .15s ease;
    font-family: inherit;
}

#success-alert .close:hover,
#warning-alert .close:hover,
#danger-alert .close:hover {
    background: #B33A3A;
    color: #ffffff;
}