refactor: Migrate documentation content, rebuild UI components, and update core architecture.

docs/resources/faq.mdx

@@ -0,0 +1,114 @@
+---
+title: Frequently Asked Questions
+description: Quick answers to common questions about WooNooW
+date: 2024-01-31
+---
+
+## General
+
+<AccordionGroup>
+    <Accordion title="What is WooNooW?">
+        WooNooW is a WooCommerce plugin that transforms your store into a modern Single Page Application (SPA). It provides instant page loads, a beautiful UI, and seamless shopping experience.
+    </Accordion>
+    <Accordion title="Do I need WooCommerce?">
+        Yes. WooNooW is an enhancement layer for WooCommerce. You need WooCommerce installed and activated.
+    </Accordion>
+    <Accordion title="Will WooNooW affect my existing products?">
+        No. WooNooW reads from WooCommerce. Your products, orders, and settings remain untouched.
+    </Accordion>
+</AccordionGroup>
+
+---
+
+## SPA Mode
+
+<AccordionGroup>
+<Accordion title="What's the difference between Full and Disabled mode?">
+    | Mode | Behavior |
+    |------|----------|
+    | **Full** | All WooCommerce pages redirect to SPA. Modern, fast experience. |
+    | **Disabled** | WooCommerce pages use native templates. WooNooW admin still works. |
+</Accordion>
+<Accordion title="Can I switch modes anytime?">
+    Yes. Go to **WooNooW → Appearance → General** and change the SPA Mode. Changes take effect immediately.
+</Accordion>
+<Accordion title="Which mode should I use?">
+    - **Full**: For the best customer experience with instant loads
+    - **Disabled**: If you have theme customizations you want to keep
+</Accordion>
+</AccordionGroup>
+
+---
+
+## Compatibility
+
+<AccordionGroup>
+<Accordion title="Does WooNooW work with my theme?">
+    WooNooW's SPA is independent of your WordPress theme. In Full mode, the SPA uses its own styling. Your theme affects the rest of your site normally.
+</Accordion>
+<Accordion title="Does WooNooW work with page builders?">
+    The SPA pages are self-contained. Page builders work on other pages of your site.
+</Accordion>
+<Accordion title="Which payment gateways are supported?">
+    WooNooW supports all WooCommerce-compatible payment gateways:
+    - PayPal
+    - Stripe
+    - Bank Transfer (BACS)
+    - Cash on Delivery
+    - And more...
+</Accordion>
+</AccordionGroup>
+
+---
+
+## SEO
+
+<AccordionGroup>
+<Accordion title="Is WooNooW SEO-friendly?">
+    Yes. WooNooW uses:
+    - Clean URLs (`/store/product/product-name`)
+    - Dynamic meta tags for social sharing
+    - Proper redirects (302) from WooCommerce URLs
+</Accordion>
+<Accordion title="What about my existing SEO?">
+    WooCommerce URLs remain the indexed source. WooNooW redirects users to the SPA but preserves SEO value.
+</Accordion>
+<Accordion title="Will my product pages be indexed?">
+    Yes. Search engines index the WooCommerce URLs. When users click from search results, they're redirected to the fast SPA experience.
+</Accordion>
+</AccordionGroup>
+
+---
+
+## Performance
+
+<AccordionGroup>
+<Accordion title="Is WooNooW faster than regular WooCommerce?">
+    Yes, for navigation. After the initial load, page transitions are instant because the SPA doesn't reload the entire page.
+</Accordion>
+<Accordion title="Will WooNooW slow down my site?">
+    The initial load is similar to regular WooCommerce. Subsequent navigation is much faster.
+</Accordion>
+<Accordion title="Does WooNooW work with caching?">
+    Yes. Use page caching and object caching for best results.
+</Accordion>
+</AccordionGroup>
+
+---
+
+## Customization
+
+<AccordionGroup>
+<Accordion title="Can I customize colors and fonts?">
+    Yes. Go to **WooNooW → Appearance** to customize:
+    - Primary, secondary, and accent colors
+    - Body and heading fonts
+    - Logo and layout options
+</Accordion>
+<Accordion title="Can I add custom CSS?">
+    Currently, use your theme's Additional CSS feature. A custom CSS field may be added in future versions.
+</Accordion>
+<Accordion title="Can I modify the SPA templates?">
+    The SPA is built with React. Advanced customizations require development knowledge.
+</Accordion>
+</AccordionGroup>