'''Do not make any visual modifications. The phrases I write are commands to understand what I want, not to be written down. Understand their content well, then execute what is required.'''
Act as an expert UI/UX designer and frontend engineer.
I have attached 3 reference screenshots showing the desired desktop and mobile UI/UX for the customizable bouquet product page.
IMPORTANT:
The existing Admin Panel already contains the Customization Product Configuration system.
The Admin configuration must remain the SINGLE SOURCE OF TRUTH.
Do not hardcode flower names, prices, images, bouquet sizes, quantities or customization options in the frontend.
Create a premium Crochet Corner product page matching the attached references for customizable products only. Use the existing Admin configuration dynamically for gallery images, bouquet sizes, flower options, wrapping, ribbon/bow, gift card, pricing rules, required/optional status, and quantity limits. Support responsive desktop and mobile layouts with gallery thumbnails/lightbox, size-dependent images and pricing, flower quantity validation, live pricing, sticky desktop summary, mobile purchase CTA, Add to Cart and Buy Now. Preserve complete customization data through cart and order flows, leave normal products unchanged, avoid duplicate frontend pricing logic, and use the existing database, backend, and project architecture.
DATA FLOW: Admin Configuration → Customization Data → Frontend Product Page → Customer Selection → Live Pricing → Cart / Order
Implement the customizable products frontend page so customers can configure bouquet size, flowers, and options with no page reload.
Act as an expert UI/UX designer and frontend engineer.
I have attached 3 reference screenshots showing the desired desktop and mobile UI/UX for the customizable bouquet product page.
Study them carefully and create the FRONTEND PRODUCT PAGE for CUSTOMIZABLE PRODUCTS only.
IMPORTANT:
The existing Admin Panel already contains the Customization Product Configuration system.
The Admin configuration must remain the SINGLE SOURCE OF TRUTH.
Do not hardcode flower names, prices, images, bouquet sizes, quantities or customization options in the frontend.
Create the premium responsive product experience with a dynamic gallery, size-dependent images and pricing, Admin-configured bouquet sizes, flower customization with quantity limits, other customization groups, live pricing and summary, cart/order persistence, validation, Add to Cart and Buy Now. Activate it only for customizable products and leave normal products unchanged. Use the existing database, backend, and project architecture without creating a separate customization system.
DATA FLOW:
Admin Configuration → Customization Data → Frontend Product Page → Customer Selection → Live Pricing → Cart / Order.