{{-- In-app toast matching portal theme (replaces window.alert) --}}
<div id="portalToast" class="portal-toast" hidden role="status" aria-live="polite" aria-atomic="true">
    <div class="portal-toast__inner">
        <i class="portal-toast__icon" id="portalToastIcon" aria-hidden="true"></i>
        <p class="portal-toast__msg" id="portalToastMsg"></p>
        <button type="button" class="portal-toast__close" id="portalToastClose" aria-label="Dismiss">&times;</button>
    </div>
</div>
<style>
    .portal-toast {
        position: fixed;
        top: 1.25rem;
        left: 50%;
        transform: translateX(-50%) translateY(-0.5rem);
        z-index: 10050;
        max-width: min(420px, calc(100vw - 1.5rem));
        width: 100%;
        font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
        background: #181a20;
        color: #eaecef;
        border: 1px solid #2b3139;
        border-left-width: 3px;
        border-radius: 12px;
        box-shadow: 0 12px 40px rgba(0,0,0,.5);
        opacity: 0;
        pointer-events: none;
        transition: opacity .2s ease, transform .2s ease;
    }
    .portal-toast.portal-toast--visible {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
        pointer-events: auto;
    }
    .portal-toast--success { border-left-color: #0ecb81; }
    .portal-toast--error   { border-left-color: #f6465d; }
    .portal-toast--info    { border-left-color: #3b82f6; }
    .portal-toast__inner {
        display: flex;
        align-items: flex-start;
        gap: .65rem;
        padding: .85rem 1rem;
    }
    .portal-toast__icon {
        font-size: 1.1rem;
        line-height: 1.3;
        margin-top: .1rem;
        flex-shrink: 0;
    }
    .portal-toast--success .portal-toast__icon { color: #0ecb81; }
    .portal-toast--error   .portal-toast__icon { color: #f6465d; }
    .portal-toast--info    .portal-toast__icon { color: #3b82f6; }
    .portal-toast__msg {
        margin: 0;
        flex: 1;
        font-size: .9rem;
        line-height: 1.45;
        font-weight: 500;
        color: #eaecef;
    }
    .portal-toast__close {
        background: none;
        border: none;
        color: #848e9c;
        font-size: 1.25rem;
        line-height: 1;
        padding: 0 0 0 .35rem;
        cursor: pointer;
        flex-shrink: 0;
        transition: color .15s;
    }
    .portal-toast__close:hover { color: #eaecef; }
</style>
<script>
(function () {
    var el = document.getElementById('portalToast');
    if (!el) return;
    var msgEl = document.getElementById('portalToastMsg');
    var iconEl = document.getElementById('portalToastIcon');
    var closeBtn = document.getElementById('portalToastClose');
    var t = null;
    var icons = {
        success: 'fas fa-check-circle',
        error:   'fas fa-exclamation-circle',
        info:    'fas fa-info-circle',
    };
    function hide() {
        el.classList.remove('portal-toast--visible');
        el.setAttribute('hidden', '');
        el.setAttribute('aria-hidden', 'true');
        clearTimeout(t);
        t = null;
    }
    window.showPortalToast = function (message, type, options) {
        options = options || {};
        var duration = typeof options.duration === 'number' ? options.duration : 4500;
        var typ = (type && icons[type]) ? type : 'info';
        clearTimeout(t);
        el.className = 'portal-toast portal-toast--' + typ;
        msgEl.textContent = message;
        iconEl.className = 'portal-toast__icon ' + (icons[typ] || icons.info);
        el.removeAttribute('hidden');
        el.setAttribute('aria-hidden', 'false');
        requestAnimationFrame(function () {
            el.classList.add('portal-toast--visible');
        });
        t = setTimeout(hide, duration);
    };
    if (closeBtn) {
        closeBtn.addEventListener('click', function () { hide(); });
    }
})();
</script>