import './bootstrap';
import Alpine from 'alpinejs';
import sort from '@alpinejs/sort';

Alpine.plugin(sort);
window.Alpine = Alpine;
Alpine.start();

// ── PWA Service Worker ────────────────────────────────────────
if ('serviceWorker' in navigator) {
    window.addEventListener('load', () => {
        navigator.serviceWorker.register('/sw.js').catch(() => {/* silently fail */});
    });
}

// ── KolManager helpers (toast notifications only — no meow) ──
window.KolManager = {
    notify(msg) {
        const el = document.createElement('div');
        el.className = 'fixed top-4 right-4 z-50 cat-card px-5 py-3 flex items-center gap-2 shadow-lg border border-pink-200';
        el.style.cssText = 'animation: slideIn .3s ease';
        el.innerHTML = `<span class="text-xl">🐱</span><span class="text-sm font-medium text-pink-700">${msg}</span>`;
        document.body.appendChild(el);
        setTimeout(() => {
            el.style.opacity = '0';
            el.style.transition = 'opacity .3s';
            setTimeout(() => el.remove(), 300);
        }, 3200);
    },
};

// Flash message auto-dismiss
document.addEventListener('DOMContentLoaded', () => {
    const flash = document.getElementById('flash-message');
    if (flash) {
        setTimeout(() => {
            flash.style.opacity = '0';
            flash.style.transform = 'translateY(-10px)';
            flash.style.transition = 'all 0.4s ease';
            setTimeout(() => flash.remove(), 400);
        }, 3000);
    }
});