document.addEventListener("DOMContentLoaded", () => {
    const BASE_URL = `${window.location.origin}${window.location.pathname.split('/pedidos2/')[0]}`;
    const API_EMPRESA = `${BASE_URL}/pedidos2/RESTAURANTE/Database/DataEmpresa.php`;
    const API_PRODUCTOS = `${BASE_URL}/pedidos2/RESTAURANTE/Database/DataBase.php`;
    const API_ENVIAR_PEDIDO = `${BASE_URL}/pedidos2/RESTAURANTE/Database/enviar-pedido.php`;
    const LOGO_URL_BASE = `${BASE_URL}/facturacion/public/images/`;
    const IMG_URL = `${BASE_URL}/facturacion/public/images/productos/`;
    const DEFAULT_LOGO_URL = `${LOGO_URL_BASE}logoprint.png`;
    const DEFAULT_PRODUCTO_IMG = `${BASE_URL}/pedidos2/RESTAURANTE/img/imagen2.jpg`;

    let productosPolleria = [];
    let productosEnCarrito = JSON.parse(localStorage.getItem("productos-en-carrito")) || [];
    productosEnCarrito = productosEnCarrito
        .map((p) => ({ ...p, id_pres: p.id_pres ?? p.id }))
        .filter((p) => Number(p.id_pres) > 0 && Number(p.cantidad) > 0);
    let enModoCheckout = false;

    const iconosCategorias = {
        "POLLO": "bi-fire",
        "ALITAS": "bi-fan",
        "BEBIDAS": "bi-cup-straw",
        "GASEOSA": "bi-cup-straw",
        "JUGOS": "bi-cup-hot-fill",
        "CAFE": "bi-cup-hot-fill",
        "ADICIONALES": "bi-plus-square-dotted",
        "ENSALADA": "bi-egg-fried",
        "DEFAULT": "bi-tag-fill"
    };

    const logoNavMenu = document.getElementById("logo-nav-menu");
    const nombreNavMenu = document.getElementById("nombre-nav-menu");
    const listaProductos = document.querySelector("#lista-productos");
    const menuCategorias = document.querySelector("#menu-categorias");
    const inputBusqueda = document.querySelector("#input-busqueda");
    const contCarritoProductos = document.querySelector("#carrito-productos");
    const contCarritoVacio = document.querySelector("#carrito-vacio");
    const totalElement = document.querySelector("#total");
    const numeritoElement = document.querySelector("#numerito");
    const btnComprar = document.querySelector("#carrito-acciones-comprar");
    const btnVaciar = document.querySelector("#carrito-acciones-vaciar");
    const cartPanel = document.querySelector(".cart-panel");
    const cartFab = document.querySelector("#cart-fab");
    const closeCartMobile = document.querySelector("#close-cart-mobile");
    const mensajeCarga = document.querySelector("#mensaje-carga");
    const formCheckout = document.querySelector("#cart-checkout-form");
    const cartTitle = document.querySelector("#cart-title");
    const btnBackToCart = document.getElementById("btn-back-to-cart");

    function aplicarLogoEmpresa(imgElement, textElement, logoUrl, nombreComercial) {
        if (!imgElement) return;
        imgElement.onerror = () => {
            if (imgElement.src !== DEFAULT_LOGO_URL) {
                imgElement.src = DEFAULT_LOGO_URL;
                return;
            }
            imgElement.style.display = "none";
            if (textElement) {
                textElement.innerText = nombreComercial;
                textElement.style.display = "";
            }
        };
        imgElement.onload = () => {
            imgElement.style.display = "inline-block";
            if (textElement) textElement.style.display = "none";
        };
        imgElement.src = logoUrl;
    }

    function controlaStock(producto) {
        return Number(producto?.crt_stock) === 1;
    }

    function stockDisponible(producto) {
        if (!controlaStock(producto)) return null;
        return Number(producto?.stock_disponible || 0);
    }

    function estaDisponible(producto) {
        if (!controlaStock(producto)) return true;
        return Number(producto?.disponible_web) === 1;
    }

    async function init() {
        await Promise.all([
            cargarDatosEmpresa(),
            cargarDatosProductos(),
        ]);
        renderizarCarrito();
        asignarEventosGenerales();
    }

    async function cargarDatosEmpresa() {
        try {
            const response = await fetch(API_EMPRESA);
            if (!response.ok) throw new Error(`HTTP error: ${response.status}`);
            const data = await response.json();
            if (data && data.length > 0) {
                const empresa = data[0];
                const nombreComercial = empresa.nombre_comercial || "Mi Tienda";
                document.title = `Nuestra Carta - ${nombreComercial}`;
                const logoUrl = empresa.logo ? `${LOGO_URL_BASE}${empresa.logo}` : DEFAULT_LOGO_URL;
                aplicarLogoEmpresa(logoNavMenu, nombreNavMenu, logoUrl, nombreComercial);
            }
        } catch (error) {
            console.error("Error al cargar datos de empresa:", error);
            if (nombreNavMenu) nombreNavMenu.innerText = "Mi Tienda";
        }
    }

    async function cargarDatosProductos() {
        try {
            const response = await fetch(API_PRODUCTOS);
            if (!response.ok) throw new Error(`HTTP error: ${response.status}`);
            productosPolleria = await response.json();
            if (mensajeCarga) mensajeCarga.classList.add("disabled");
            renderizarCategorias();
            renderizarProductosAgrupados(productosPolleria);
        } catch (error) {
            console.error("Error al cargar productos:", error);
            if (mensajeCarga) mensajeCarga.innerHTML = `<div class="alert alert-danger">Error al cargar la carta.</div>`;
        }
    }

    function renderizarCategorias() {
        if (!menuCategorias) return;
        const categoriasUnicas = ["Todos", ...new Set(productosPolleria.map((p) => p.nombre_producto || "Otros"))];
        menuCategorias.innerHTML = categoriasUnicas
            .map((categoria) => {
                const iconKey = Object.keys(iconosCategorias).find((key) => categoria.toUpperCase().includes(key)) || "DEFAULT";
                const iconClass = iconosCategorias[iconKey];
                return `<div class="swiper-slide"><button class="categoria-btn ${categoria === "Todos" ? "active" : ""}" data-categoria="${categoria}"><i class="bi ${iconClass}"></i><span>${categoria}</span></button></div>`;
            })
            .join("");

        new Swiper(".categorias-swiper", {
            slidesPerView: "auto",
            spaceBetween: 10,
            freeMode: true,
            navigation: {
                nextEl: ".categorias-button-next",
                prevEl: ".categorias-button-prev",
            },
        });

        asignarEventosCategorias();
    }

    function renderizarProductosAgrupados(productos) {
        if (!listaProductos) return;

        listaProductos.innerHTML = "";
        const productosAgrupados = productos.reduce((acc, p) => {
            const categoria = p.nombre_producto || "Otros";
            (acc[categoria] = acc[categoria] || []).push(p);
            return acc;
        }, {});

        for (const categoria in productosAgrupados) {
            const seccion = document.createElement("section");
            seccion.className = "categoria-seccion mb-5";
            seccion.dataset.categoria = categoria;

            const cards = productosAgrupados[categoria]
                .map((producto) => {
                    const agotado = !estaDisponible(producto);
                    const stockInfo = controlaStock(producto)
                        ? `<p class="producto-descripcion mb-2 ${agotado ? "text-danger" : ""}">${agotado ? "Agotado" : `Stock disponible: ${stockDisponible(producto)}`}</p>`
                        : "";

                    return `
                        <div class="col producto-item" data-nombre="${(producto.presentacion || "").toLowerCase()}">
                            <div class="producto-card-vertical">
                                <div class="producto-imagen-wrapper">
                                    <img class="producto-imagen-menu" src="${IMG_URL + producto.archivo_imagen}" alt="${producto.presentacion}" onerror="this.onerror=null;this.src='${DEFAULT_PRODUCTO_IMG}'">
                                </div>
                                <div class="producto-info-vertical">
                                    <h5 class="producto-titulo-menu">${producto.presentacion}</h5>
                                    ${producto.descripcion ? `<p class="producto-descripcion">${producto.descripcion}</p>` : ""}
                                    ${stockInfo}
                                    <div class="producto-footer">
                                        <p class="producto-precio-menu mb-0">S/ ${parseFloat(producto.precio).toFixed(2)}</p>
                                        <button class="btn-agregar-menu" data-id="${producto.id_pres}" ${agotado ? "disabled" : ""}><i class="bi bi-plus-lg"></i></button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    `;
                })
                .join("");

            seccion.innerHTML = `<h2 class="categoria-titulo-seccion">${categoria}</h2><div class="row row-cols-1 row-cols-md-2 row-cols-xl-3 g-4">${cards}</div>`;
            listaProductos.append(seccion);
        }
    }

    function cambiarModoCheckout(activar) {
        enModoCheckout = activar;
        contCarritoProductos.classList.toggle("disabled", activar);
        formCheckout.classList.toggle("disabled", !activar);
        btnBackToCart.classList.toggle("disabled", !activar);
        if (contCarritoVacio) contCarritoVacio.classList.add("disabled");

        if (activar) {
            cartTitle.innerText = "Completa tus datos";
            btnComprar.innerHTML = 'Confirmar y Enviar <i class="bi bi-check-lg"></i>';
            btnVaciar.innerText = "Volver a mi pedido";
            btnVaciar.classList.remove("disabled");
        } else {
            cartTitle.innerText = "Mi Pedido";
            btnComprar.innerHTML = 'Finalizar Pedido <i class="bi bi-arrow-right"></i>';
            btnVaciar.innerText = "Vaciar Pedido";
            renderizarCarrito();
        }
    }

    function renderizarCarrito() {
        const hayProductos = productosEnCarrito.length > 0;
        if (contCarritoVacio) contCarritoVacio.classList.toggle("disabled", hayProductos);
        if (btnComprar) btnComprar.classList.toggle("disabled", !hayProductos);
        if (btnVaciar) btnVaciar.classList.toggle("disabled", !hayProductos);
        if (cartFab) cartFab.classList.toggle("disabled", !hayProductos);

        if (contCarritoProductos) {
            contCarritoProductos.innerHTML = hayProductos
                ? productosEnCarrito
                    .map((producto) => {
                        const subtotal = Number(producto.precio) * Number(producto.cantidad);
                        return `<div class="cart-item"><img class="cart-item-img" src="${IMG_URL + producto.archivo_imagen}" alt="${producto.presentacion}" onerror="this.onerror=null;this.src='${DEFAULT_PRODUCTO_IMG}'"><div class="cart-item-info"><h6 class="cart-item-title">${producto.presentacion}</h6><p class="cart-item-price">S/ ${parseFloat(producto.precio).toFixed(2)}</p></div><div class="cart-item-actions"><button class="btn-qty decrease-qty" data-id="${producto.id_pres}"><i class="bi bi-dash-circle"></i></button><span>${producto.cantidad}</span><button class="btn-qty increase-qty" data-id="${producto.id_pres}"><i class="bi bi-plus-circle"></i></button></div><strong class="cart-item-subtotal">S/ ${subtotal.toFixed(2)}</strong></div>`;
                    })
                    .join("")
                : "";
        }

        actualizarTotalYNumerito();
    }

    function agregarAlCarrito(producto) {
        if (!producto) return;

        if (!estaDisponible(producto)) {
            Toastify({
                text: `"${producto.presentacion}" agotado`,
                duration: 2500,
                gravity: "bottom",
                position: "left",
                style: { background: "#dc3545", borderRadius: "var(--border-radius-md)" },
            }).showToast();
            return;
        }

        const index = productosEnCarrito.findIndex((p) => p.id_pres == producto.id_pres);
        const cantidadActual = index > -1 ? Number(productosEnCarrito[index].cantidad) : 0;
        const stockMaximo = stockDisponible(producto);

        if (controlaStock(producto) && stockMaximo !== null && cantidadActual >= stockMaximo) {
            Toastify({
                text: `Stock maximo disponible: ${stockMaximo}`,
                duration: 2500,
                gravity: "bottom",
                position: "left",
                style: { background: "#fd7e14", borderRadius: "var(--border-radius-md)" },
            }).showToast();
            return;
        }

        if (index > -1) {
            productosEnCarrito[index].cantidad++;
        } else {
            productosEnCarrito.push({ ...producto, cantidad: 1 });
        }

        Toastify({
            text: `"${producto.presentacion}" agregado`,
            duration: 2000,
            gravity: "bottom",
            position: "left",
            style: { background: "var(--clr-dark)", borderRadius: "var(--border-radius-md)" },
        }).showToast();

        actualizarStorageYRenderizarCarrito();
    }

    function manejarDecrementarCantidad(id) {
        const index = productosEnCarrito.findIndex((p) => p.id_pres == id);
        if (index === -1) return;

        if (productosEnCarrito[index].cantidad > 1) {
            productosEnCarrito[index].cantidad--;
        } else {
            productosEnCarrito.splice(index, 1);
        }

        actualizarStorageYRenderizarCarrito();
    }

    function manejarIncrementarCantidad(id) {
        const index = productosEnCarrito.findIndex((p) => p.id_pres == id);
        if (index === -1) return;

        const productoActual = productosPolleria.find((p) => p.id_pres == id);
        if (productoActual && controlaStock(productoActual)) {
            const stockMaximo = stockDisponible(productoActual);
            if (productosEnCarrito[index].cantidad >= stockMaximo) {
                Toastify({
                    text: `Stock maximo disponible: ${stockMaximo}`,
                    duration: 2500,
                    gravity: "bottom",
                    position: "left",
                    style: { background: "#fd7e14", borderRadius: "var(--border-radius-md)" },
                }).showToast();
                return;
            }
        }

        productosEnCarrito[index].cantidad++;
        actualizarStorageYRenderizarCarrito();
    }

    function actualizarStorageYRenderizarCarrito() {
        localStorage.setItem("productos-en-carrito", JSON.stringify(productosEnCarrito));
        renderizarCarrito();
    }

    function actualizarTotalYNumerito() {
        const total = productosEnCarrito.reduce((acc, p) => acc + Number(p.precio) * Number(p.cantidad), 0);
        const cantidadTotal = productosEnCarrito.reduce((acc, p) => acc + Number(p.cantidad), 0);
        if (totalElement) totalElement.innerText = `S/ ${total.toFixed(2)}`;
        if (numeritoElement) numeritoElement.innerText = cantidadTotal;
    }

    function manejarBusqueda(e) {
        const texto = e.target.value.toLowerCase().trim();
        document.querySelectorAll(".producto-item").forEach((item) => {
            item.style.display = item.dataset.nombre.includes(texto) ? "block" : "none";
        });

        document.querySelectorAll(".categoria-seccion").forEach((seccion) => {
            const productosVisibles = seccion.querySelectorAll(".producto-item");
            const algunVisible = Array.from(productosVisibles).some((item) => item.style.display !== "none");
            seccion.style.display = algunVisible ? "block" : "none";
        });
    }

    async function manejarFinalizarPedido() {
        if (!enModoCheckout) {
            cambiarModoCheckout(true);
            return;
        }

        const form = document.getElementById("checkout-form");
        if (!form.checkValidity()) {
            form.reportValidity();
            return;
        }

        btnComprar.disabled = true;
        btnComprar.innerHTML = 'Enviando... <span class="spinner-border spinner-border-sm"></span>';

        const datosCliente = {
            nombre: document.getElementById("cliente-nombre").value,
            telefono: document.getElementById("cliente-telefono").value,
            direccion: document.getElementById("cliente-direccion").value,
            referencia: document.getElementById("cliente-referencia").value,
            comentario: document.getElementById("cliente-comentario").value,
        };

        const pedidoCompleto = {
            cliente: datosCliente,
            productos: productosEnCarrito.map((p) => ({
                id_pres: Number(p.id_pres ?? p.id),
                cantidad: Number(p.cantidad),
            })),
        };

        try {
            const response = await fetch(API_ENVIAR_PEDIDO, {
                method: "POST",
                headers: { "Content-Type": "application/json" },
                body: JSON.stringify(pedidoCompleto),
            });

            const result = await response.json();

            if (!response.ok || !result.success) {
                const detalleErrores = Array.isArray(result.errors)
                    ? `\n${result.errors.join("\n")}`
                    : "";
                throw new Error((result.message || "Error desconocido en el servidor.") + detalleErrores);
            }

            Swal.fire("Pedido enviado", "Gracias por tu compra. Te contactaremos por WhatsApp.", "success");
            productosEnCarrito = [];
            form.reset();
            actualizarStorageYRenderizarCarrito();
            cambiarModoCheckout(false);
        } catch (error) {
            console.error("Error al enviar el pedido:", error);
            Swal.fire("Oops", error.message || "Hubo un problema al enviar tu pedido.", "error");
        } finally {
            btnComprar.disabled = false;
        }
    }

    function asignarEventosGenerales() {
        inputBusqueda?.addEventListener("input", manejarBusqueda);
        cartFab?.addEventListener("click", () => cartPanel.classList.add("open"));
        closeCartMobile?.addEventListener("click", () => cartPanel.classList.remove("open"));
        btnComprar?.addEventListener("click", manejarFinalizarPedido);

        btnVaciar?.addEventListener("click", () => {
            if (enModoCheckout) {
                cambiarModoCheckout(false);
                return;
            }

            Swal.fire({
                title: "Vaciar pedido",
                text: "Se quitaran todos los productos.",
                icon: "warning",
                showCancelButton: true,
                confirmButtonColor: "#d33",
                confirmButtonText: "Si, vaciar",
                cancelButtonText: "Cancelar",
            }).then((result) => {
                if (result.isConfirmed) {
                    productosEnCarrito = [];
                    actualizarStorageYRenderizarCarrito();
                }
            });
        });

        btnBackToCart?.addEventListener("click", () => {
            if (enModoCheckout) cambiarModoCheckout(false);
        });

        document.body.addEventListener("click", (e) => {
            const btnAgregar = e.target.closest(".btn-agregar-menu");
            if (btnAgregar) {
                agregarAlCarrito(productosPolleria.find((p) => p.id_pres == btnAgregar.dataset.id));
                return;
            }

            const btnIncrementar = e.target.closest(".increase-qty");
            if (btnIncrementar) {
                manejarIncrementarCantidad(btnIncrementar.dataset.id);
                return;
            }

            const btnDecrementar = e.target.closest(".decrease-qty");
            if (btnDecrementar) {
                manejarDecrementarCantidad(btnDecrementar.dataset.id);
            }
        });
    }

    function asignarEventosCategorias() {
        menuCategorias?.querySelectorAll(".categoria-btn").forEach((btn) => {
            btn.addEventListener("click", (e) => {
                const currentBtn = e.currentTarget;
                if (currentBtn.classList.contains("active")) return;

                menuCategorias.querySelector(".active")?.classList.remove("active");
                currentBtn.classList.add("active");

                const categoria = currentBtn.dataset.categoria;
                document.querySelectorAll(".categoria-seccion").forEach((seccion) => {
                    seccion.style.display = categoria === "Todos" || seccion.dataset.categoria === categoria ? "block" : "none";
                });
            });
        });
    }

    init();
});
