function TopNav({ view, goTo, user, openSignIn, onSignOut }) {
    const isApp = ["dashboard", "builder", "admin", "admin-builder"].includes(view);
    const isMarketing = ["home", "gallery"].includes(view);
    const [profileOpen, setProfileOpen] = React.useState(false);
    const [mobileOpen, setMobileOpen] = React.useState(false);
    const [focusWithin, setFocusWithin] = React.useState(false);
    const [scrollState, setScrollState] = React.useState({ scrolled: false, hidden: false });
    const menuButton = React.useRef(null);
    const navigate = (...args) => { setMobileOpen(false); setProfileOpen(false); goTo(...args); };
    const userName = user?.name || "Account";
    const userEmail = user?.email || "";
    const userInitial = (userName || userEmail || "U").charAt(0).toUpperCase();
    React.useEffect(() => {
        if (!profileOpen && !mobileOpen)
            return;
        const close = (event) => {
            if (!event.target.closest?.(".nav-profile"))
                setProfileOpen(false);
            if (!event.target.closest?.(".nav"))
                setMobileOpen(false);
        };
        const onKey = (event) => {
            if (event.key === "Escape") {
                setProfileOpen(false);
                setMobileOpen(false);
                if (mobileOpen)
                    menuButton.current?.focus();
            }
        };
        document.addEventListener("click", close);
        document.addEventListener("keydown", onKey);
        return () => {
            document.removeEventListener("click", close);
            document.removeEventListener("keydown", onKey);
        };
    }, [profileOpen, mobileOpen]);
    React.useEffect(() => { setMobileOpen(false); setProfileOpen(false); }, [view]);
    React.useEffect(() => {
        if (!isMarketing) {
            setScrollState(previous => previous.scrolled || previous.hidden ? { scrolled: false, hidden: false } : previous);
            setFocusWithin(false);
            return;
        }
        const scrollY = () => Math.max(0, window.scrollY || 0);
        const keepVisible = mobileOpen || profileOpen || focusWithin;
        let previousY = scrollY(), direction = 0, distance = 0, frame = null;
        const publish = (scrolled, hidden) => setScrollState(previous => previous.scrolled === scrolled && previous.hidden === hidden ? previous : { scrolled, hidden });
        publish(previousY > 40, false);
        const update = () => {
            frame = null;
            const y = scrollY(), delta = y - previousY;
            const nextDirection = Math.sign(delta);
            if (nextDirection && nextDirection !== direction) {
                direction = nextDirection;
                distance = 0;
            }
            distance += Math.abs(delta);
            previousY = y;
            setScrollState(previous => {
                const scrolled = y > 40;
                const hidden = keepVisible || y <= 160 ? false : distance >= 12 ? direction > 0 : previous.hidden;
                return previous.scrolled === scrolled && previous.hidden === hidden ? previous : { scrolled, hidden };
            });
        };
        const onScroll = () => { if (frame === null)
            frame = window.requestAnimationFrame(update); };
        window.addEventListener("scroll", onScroll, { passive: true });
        return () => {
            window.removeEventListener("scroll", onScroll);
            if (frame !== null)
                window.cancelAnimationFrame(frame);
        };
    }, [isMarketing, view, mobileOpen, profileOpen, focusWithin]);
    const menuToggle = React.createElement("button", { ref: menuButton, type: "button", className: "nav-menu-button", "aria-label": mobileOpen ? "Close menu" : "Open menu", "aria-expanded": mobileOpen, "aria-controls": "mobile-navigation", onClick: () => setMobileOpen(open => !open) },
        React.createElement("svg", { width: "22", height: "22", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.6", "aria-hidden": "true" },
            React.createElement("path", { d: mobileOpen ? "M6 6l12 12M18 6L6 18" : "M4 7h16M4 12h16M4 17h16" })));
    const mobileMenu = mobileOpen && React.createElement("div", { id: "mobile-navigation", className: "nav-mobile-links" },
        React.createElement("button", { type: "button", "aria-current": view === "home" ? "page" : undefined, onClick: () => navigate("home") }, "Home"),
        React.createElement("button", { type: "button", "aria-current": view === "gallery" ? "page" : undefined, onClick: () => navigate("gallery") }, "Templates"),
        user && React.createElement("button", { type: "button", onClick: () => navigate("dashboard") }, "My invitations"),
        user?.isAdmin === true && React.createElement("button", { type: "button", onClick: () => navigate("admin") }, "Administration"),
        React.createElement("button", { type: "button", onClick: () => navigate("builder", { projectId: null }) },
            "Start designing ",
            React.createElement("span", { "aria-hidden": "true" }, "\u2192")));
    const openDashboard = () => {
        setProfileOpen(false);
        goTo("dashboard");
    };
    const signOutFromMenu = () => {
        setProfileOpen(false);
        onSignOut && onSignOut();
    };
    const ProfileMenu = ({ small = false }) => (React.createElement("div", { className: "nav-profile" },
        React.createElement("button", { type: "button", className: "nav-profile-trigger" + (small ? " small" : ""), onClick: (event) => {
                event.stopPropagation();
                setProfileOpen((open) => !open);
            }, "aria-haspopup": "menu", "aria-expanded": profileOpen, title: "Account", "aria-label": "Account menu" }, userInitial),
        profileOpen && (React.createElement("div", { className: "nav-profile-menu", role: "menu" },
            React.createElement("div", { className: "nav-profile-summary" },
                React.createElement("strong", null, userName),
                userEmail && React.createElement("span", null, userEmail)),
            React.createElement("button", { type: "button", role: "menuitem", onClick: openDashboard }, "Dashboard"),
            user?.isAdmin === true && React.createElement("button", { type: "button", role: "menuitem", onClick: () => navigate("admin") }, "Administration"),
            React.createElement("button", { type: "button", role: "menuitem", onClick: signOutFromMenu }, "Sign out")))));
    if (isApp) {
        return (React.createElement("nav", { className: "nav nav--app", "aria-label": "Main navigation", style: { background: "var(--bg)" } },
            React.createElement("div", { className: "nav-inner", style: { padding: "14px 32px" } },
                React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 32 } },
                    React.createElement("button", { type: "button", className: "logo brand-button", onClick: () => navigate("home"), style: { fontSize: 18 }, "aria-label": "Everafter home" },
                        React.createElement("span", { className: "logo-mark", style: { width: 24, height: 24, fontSize: 14 } }, "e"),
                        React.createElement("span", null,
                            "Everafter",
                            React.createElement("small", { style: { display: "block", fontFamily: "var(--font-sans)", fontSize: 9, fontWeight: 400, letterSpacing: "0.01em", lineHeight: 1.4 } }, "by Makebiodata.shop"))),
                    React.createElement("div", { style: { height: 18, width: 1, background: "color-mix(in oklab, var(--ink) 14%, transparent)" } }),
                    React.createElement("div", { className: "nav-links", style: { gap: 24 } }, [
                        { id: "dashboard", label: "Dashboard" },
                    ].map((it) => (React.createElement("button", { type: "button", key: it.id, className: "nav-link " + (view === it.id ? "active" : ""), onClick: () => navigate(it.id) }, it.label))))),
                React.createElement("div", { className: "nav-actions", style: { display: "flex", alignItems: "center", gap: 12 } },
                    user ? (React.createElement(React.Fragment, null,
                        React.createElement("button", { className: "nav-cta", onClick: () => navigate("gallery"), style: { padding: "8px 14px", fontSize: 12 } }, "Browse designs"),
                        React.createElement(ProfileMenu, { small: true }))) : (React.createElement("button", { "data-auth-action": "signin", "data-auth-redirect": view || "", onClick: () => (openSignIn || window.everafterOpenSignIn)?.(view), style: { background: "transparent", border: "1px solid color-mix(in oklab, var(--ink) 18%, transparent)", padding: "8px 14px", borderRadius: "var(--radius)", fontSize: 12, fontFamily: "var(--font-sans)", color: "var(--ink)", cursor: "pointer", fontWeight: 500 } }, "Sign in")),
                    menuToggle)),
            mobileMenu));
    }
    const items = [
        { id: "home", label: "Home" },
        { id: "gallery", label: "Templates" },
    ];
    return (React.createElement("nav", { className: "nav nav--marketing" + (scrollState.scrolled ? " is-scrolled" : "") + (scrollState.hidden && !mobileOpen && !profileOpen && !focusWithin ? " is-hidden" : ""), "aria-label": "Main navigation", onFocusCapture: () => setFocusWithin(true), onBlurCapture: event => { if (!event.currentTarget.contains(event.relatedTarget))
            setFocusWithin(false); } },
        React.createElement("div", { className: "nav-inner" },
            React.createElement("button", { type: "button", className: "logo brand-button", onClick: () => navigate("home"), "aria-label": "Everafter home" },
                React.createElement("span", { className: "logo-mark" }, "e"),
                React.createElement("span", null,
                    "Everafter",
                    React.createElement("small", { style: { display: "block", fontFamily: "var(--font-sans)", fontSize: 9, fontWeight: 400, letterSpacing: "0.01em", lineHeight: 1.4 } }, "by Makebiodata.shop"))),
            React.createElement("div", { className: "nav-links" }, items.map((it) => (React.createElement("button", { type: "button", key: it.id, className: "nav-link " + (view === it.id ? "active" : ""), "aria-current": view === it.id ? "page" : undefined, onClick: () => navigate(it.id) }, it.label)))),
            React.createElement("div", { className: "nav-actions", style: { display: "flex", gap: 10, alignItems: "center" } },
                user ? (React.createElement(React.Fragment, null,
                    React.createElement("button", { className: "nav-secondary", onClick: () => goTo("dashboard") }, "Dashboard"),
                    React.createElement(ProfileMenu, null))) : (React.createElement(React.Fragment, null,
                    React.createElement("button", { className: "nav-secondary", "data-auth-action": "signin", onClick: () => (openSignIn || window.everafterOpenSignIn)?.() }, "Sign in"),
                    React.createElement("button", { className: "nav-cta", onClick: () => goTo("builder", { projectId: null }) },
                        "Start designing ",
                        React.createElement("span", { "aria-hidden": "true" }, "\u2192")))),
                menuToggle)),
        mobileMenu));
}
function Footer() {
    const appPath = path => window.EA_APP?.path ? window.EA_APP.path(path) : '/wedding-invitations' + path;
    return (React.createElement("footer", { className: "footer" },
        React.createElement("div", { className: "wrap footer-inner" },
            React.createElement("div", null,
                React.createElement("a", { className: "logo", href: window.EA_APP?.path ? window.EA_APP.path('/') : '/wedding-invitations/', style: { marginBottom: 12, color: "inherit", textDecoration: "none" } },
                    React.createElement("span", { className: "logo-mark" }, "e"),
                    React.createElement("span", null,
                        "Everafter",
                        React.createElement("small", { style: { display: "block", fontFamily: "var(--font-sans)", fontSize: 9, fontWeight: 400, letterSpacing: "0.01em", lineHeight: 1.4 } }, "by Makebiodata.shop"))),
                React.createElement("div", { style: { fontSize: 12, maxWidth: 280 } }, "Beautiful digital wedding invitations, RSVP tools, and guest experiences.")),
            React.createElement("div", { className: "footer-cols" },
                React.createElement("div", { className: "footer-col" },
                    React.createElement("h5", null, "Explore"),
                    React.createElement("a", { href: appPath('/templates') }, "All designs"),
                    React.createElement("a", { href: appPath('/builder') }, "Create an invitation"),
                    React.createElement("a", { href: appPath('/dashboard') }, "My invitations")),
                React.createElement("div", { className: "footer-col" },
                    React.createElement("h5", null, "Included"),
                    React.createElement("span", null, "Live preview"),
                    React.createElement("span", null, "Guest RSVP"),
                    React.createElement("span", null, "WhatsApp share"),
                    React.createElement("span", null, "Analytics")))),
        React.createElement("div", { className: "wrap", style: { marginTop: 40, fontSize: 12, opacity: 0.6 } }, "\u00A9 2026 Everafter by Makebiodata.shop \u00B7 Made with care for couples everywhere")));
}
Object.assign(window, { TopNav, Footer });