docs: add missing configuration pages and remove redundant H1 headers

app/page.tsx

@@ -1,21 +1,29 @@
 import { buttonVariants } from "@/components/ui/button";
 import { page_routes } from "@/lib/routes-config";
-import { ArrowRightIcon, FileJson, GitCommitHorizontal, SquarePlay } from "lucide-react";
+import {
+  ArrowRightIcon,
+  LayoutDashboard,
+  Bell,
+  Key,
+  Zap,
+  Layers,
+  ShoppingBag
+} from "lucide-react";
 import Link from "next/link";
 import { cn } from "@/lib/utils";
 import AnimatedShinyText from "@/components/ui/animated-shiny-text";
 import { getMetadata } from "@/app/layout";
-import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Card, CardContent, CardHeader, CardTitle, CardDescription } from "@/components/ui/card";
 
 export const metadata = getMetadata({
-  title: "Home",
+  title: "WooNooW - The Ultimate WooCommerce Enhancement Suite",
 });
 
 export default function Home() {
   return (
-    <div className="flex flex-col items-center justify-center px-2 py-8 text-center sm:py-36">
+    <div className="flex flex-col items-center justify-center px-4 py-8 text-center sm:py-20">
       <Link
-        href="/docs/changelog/version-1"
+        href="/docs/changelog"
         className="mb-5 sm:text-lg flex items-center gap-2 underline underline-offset-4 sm:-mt-12"
       >
         <div className="z-10 flex min-h-10 items-center justify-center max-[800px]:mt-10">
@@ -25,71 +33,137 @@ export default function Home() {
             )}
           >
             <AnimatedShinyText className="inline-flex items-center justify-center px-4 py-1 transition ease-out hover:text-neutral-100 hover:duration-300 hover:dark:text-neutral-200">
-              <span>🚀 Release v2.0.0-beta.1</span>
+              <span>🚀 v2.0 Released: Multi-Channel Notifications</span>
               <ArrowRightIcon className="ml-1 size-3 transition-transform duration-300 ease-in-out group-hover:translate-x-0.5" />
             </AnimatedShinyText>
           </div>
         </div>
       </Link>
-      <div className="w-full max-w-[800px] pb-8">
-        <h1 className="mb-4 text-2xl font-bold sm:text-5xl">DocuBook Starter Templates</h1>
-        <p className="mb-8 sm:text-xl text-muted-foreground">
-          Get started by editing app/page.tsx . Save and see your changes instantly.{' '}
-          <Link className="text-primary underline" href="https://www.docubook.pro/docs/getting-started/introduction" target="_blank">
-            Read Documentations
-          </Link>
+
+      <div className="w-full max-w-[900px] pb-8">
+        <h1 className="mb-4 text-3xl font-bold sm:text-6xl bg-clip-text text-transparent bg-gradient-to-r from-green-500 to-lime-500">
+          Fill the Gap. <br />Elevate Your Store.
+        </h1>
+        <p className="mb-8 sm:text-xl text-muted-foreground max-w-2xl mx-auto">
+          WooNooW bridges the divide between standard WooCommerce and a premium e-commerce experience.
+          Unified dashboard, SPA performance, and enterprise-grade tools in one suite.
         </p>
       </div>
-      <div className="flex flex-row items-center gap-6 mb-10">
+
+      <div className="flex flex-row items-center gap-6 mb-16">
         <Link
-          href={`/docs${page_routes[0].href}`}
+          href="/docs/getting-started/introduction"
           className={buttonVariants({
-            className: "px-6 bg-accent text-white hover:bg-primary dark:bg-accent dark:hover:bg-primary",
+            className: "px-8 bg-black text-white hover:bg-neutral-800 dark:bg-white dark:text-black dark:hover:bg-neutral-200",
             size: "lg",
           })}
         >
           Get Started
         </Link>
         <Link
-          href="https://www.youtube.com/channel/UCWRCKHQCS-LCjd2WfDJCvRg?sub_confirmation=1"
-          target="_blank"
+          href="/docs/features"
           className={buttonVariants({
-            variant: "secondary",
-            className: "px-6 bg-gray-200 text-gray-900 hover:bg-gray-300 dark:bg-gray-800 dark:text-gray-200 dark:hover:bg-gray-700",
+            variant: "outline",
+            className: "px-8",
             size: "lg",
           })}
         >
-          Subscribe Now
+          Explore Features
         </Link>
       </div>
-      <div className="grid grid-cols-1 md:grid-cols-3 gap-8 py-12">
-        <Card className="px-2 py-6">
-          <CardHeader className="flex flex-row justify-center items-center gap-3">
-            <FileJson className="size-6 text-primary" />
-            <CardTitle className="text-xl">docu.json</CardTitle>
-          </CardHeader>
-          <CardContent>
-            <p>Edit the docu.json file to change the content in the header, footer and sidebar.</p>
-          </CardContent>
-        </Card>
-        <Card className="px-2 py-6">
-          <CardHeader className="flex flex-row justify-center items-center gap-3">
-            <GitCommitHorizontal className="size-6 text-primary" />
-            <CardTitle className="text-xl">CHANGELOG.md</CardTitle>
-          </CardHeader>
-          <CardContent>
-            <p>Manage changes to each version of your application in the CHANGELOG.md file.</p>
-          </CardContent>
-        </Card>
-        <Card className="px-2 py-6">
-          <CardHeader className="flex flex-row justify-center items-center gap-3">
-            <SquarePlay className="size-6 text-primary" />
-            <CardTitle className="text-xl">Docu Play</CardTitle>
-          </CardHeader>
-          <CardContent>
-            <p>Easy to write interactive markdown content with a playground.</p>
-          </CardContent>
-        </Card>
+
+      {/* The Gap Analysis */}
+      <div className="w-full max-w-5xl mb-20 text-left">
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
+          {/* Production Reality (The Problem) */}
+          <div className="p-8 rounded-2xl bg-red-50 dark:bg-red-950/20 border border-red-100 dark:border-red-900/30">
+            <h3 className="text-xl font-bold mb-4 text-red-700 dark:text-red-400 flex items-center gap-2">
+              <ShoppingBag className="w-5 h-5" />
+              Standard WooCommerce
+            </h3>
+            <ul className="space-y-3 text-sm text-muted-foreground">
+              <li className="flex gap-2">
+                <span className="text-red-500">✕</span> Disjointed UX using multiple plugins
+              </li>
+              <li className="flex gap-2">
+                <span className="text-red-500">✕</span> Slow standard page loads (MPA)
+              </li>
+              <li className="flex gap-2">
+                <span className="text-red-500">✕</span> Basic, rigid email notifications
+              </li>
+              <li className="flex gap-2">
+                <span className="text-red-500">✕</span> Complex license management via 3rd parties
+              </li>
+            </ul>
+          </div>
+
+          {/* The WooNooW Solution */}
+          <div className="p-8 rounded-2xl bg-green-50 dark:bg-green-950/20 border border-green-100 dark:border-green-900/30">
+            <h3 className="text-xl font-bold mb-4 text-green-700 dark:text-green-400 flex items-center gap-2">
+              <Zap className="w-5 h-5" />
+              With WooNooW
+            </h3>
+            <ul className="space-y-3 text-sm text-muted-foreground">
+              <li className="flex gap-2">
+                <span className="text-green-600">✓</span> <strong>Unified SPA Dashboard</strong> for customers
+              </li>
+              <li className="flex gap-2">
+                <span className="text-green-600">✓</span> <strong>Multi-Channel</strong> (WhatsApp, SMS, Email)
+              </li>
+              <li className="flex gap-2">
+                <span className="text-green-600">✓</span> <strong>Built-in Licensing</strong> & OAuth Server
+              </li>
+              <li className="flex gap-2">
+                <span className="text-green-600">✓</span> <strong>Modular Architecture</strong> with Bridge Pattern
+              </li>
+            </ul>
+          </div>
+        </div>
+      </div>
+
+      <div className="w-full max-w-6xl">
+        <h2 className="text-2xl font-bold mb-8">Core Modules</h2>
+        <div className="grid grid-cols-1 md:grid-cols-3 gap-6">
+          <Card className="text-left hover:border-green-500/50 transition-colors">
+            <CardHeader>
+              <LayoutDashboard className="size-8 text-green-500 mb-2" />
+              <CardTitle>Customer SPA</CardTitle>
+              <CardDescription>
+                React-based frontend that replaces standard My Account pages with a lightning-fast interface.
+              </CardDescription>
+            </CardHeader>
+          </Card>
+
+          <Card className="text-left hover:border-green-500/50 transition-colors">
+            <CardHeader>
+              <Bell className="size-8 text-green-500 mb-2" />
+              <CardTitle>Notification Engine</CardTitle>
+              <CardDescription>
+                Advanced template engine supporting Email, SMS, WhatsApp, and Telegram out of the box.
+              </CardDescription>
+            </CardHeader>
+          </Card>
+
+          <Card className="text-left hover:border-green-500/50 transition-colors">
+            <CardHeader>
+              <Key className="size-8 text-green-500 mb-2" />
+              <CardTitle>License Manager</CardTitle>
+              <CardDescription>
+                Complete OAuth2 server implementation for managing software licenses and updates.
+              </CardDescription>
+            </CardHeader>
+          </Card>
+
+          <Card className="text-left hover:border-green-500/50 transition-colors">
+            <CardHeader>
+              <Layers className="size-8 text-green-500 mb-2" />
+              <CardTitle>Developer Friendly</CardTitle>
+              <CardDescription>
+                Extend functionality using our Bridge Pattern and Module Registry APIs.
+              </CardDescription>
+            </CardHeader>
+          </Card>
+        </div>
       </div>
     </div>
   );

components/docs-breadcrumb.tsx

@@ -21,7 +21,10 @@ export default function DocsBreadcrumb({ paths }: { paths: string[] }) {
               <BreadcrumbSeparator />
               <BreadcrumbItem>
                 {index < paths.length - 1 ? (
-                  <BreadcrumbLink className="a">
+                  <BreadcrumbLink
+                    className="a"
+                    href={`/docs/${paths.slice(0, index + 1).join("/")}`}
+                  >
                     {toTitleCase(path)}
                   </BreadcrumbLink>
                 ) : (

components/docs-menu.tsx

@@ -25,7 +25,7 @@ export default function DocsMenu({ isSheet = false, className = "" }: DocsMenuPr
           <li key={route.title + index}>
             <SubLink
               {...route}
-              href={`/docs${route.href}`}
+              href={`${route.href}`}
               level={0}
               isSheet={isSheet}
             />

components/pagination.tsx

@@ -16,7 +16,7 @@ export default function Pagination({ pathname }: { pathname: string }) {
               className:
                 "no-underline w-full flex flex-col pl-3 !py-8 !items-start",
             })}
-            href={`/docs${res.prev.href}`}
+            href={`${res.prev.href}`}
           >
             <span className="flex items-center text-xs">
               <ChevronLeftIcon className="w-[1rem] h-[1rem] mr-1" />
@@ -34,7 +34,7 @@ export default function Pagination({ pathname }: { pathname: string }) {
               className:
                 "no-underline w-full flex flex-col pr-3 !py-8 !items-end",
             })}
-            href={`/docs${res.next.href}`}
+            href={`${res.next.href}`}
           >
             <span className="flex items-center text-xs">
               Next

contents/docs/builder/header-footer/index.mdx

@@ -0,0 +1,44 @@
+---
+title: Header & Footer
+description: Customize your store's global navigation and footer area.
+---
+
+
+
+Your store's header and footer are crucial for navigation and branding. Use the built-in settings to configure them without any code.
+
+## Header Settings
+
+Go to **Appearance > Header** to control the top of your site.
+
+![Header Settings](/images/docs/builder/header-settings.png)
+
+### Layout & Style
+*   **Style**: Choose between `Classic` (Logo left, nav right) or `Centered` layouts.
+*   **Sticky Header**: Toggle this to keep the header visible as users scroll down the page.
+*   **Logo Sizing**: Adjust the width and height of your logo to fit perfectly.
+
+### Elements
+Enable or disable specific icons:
+*   **Search**: Allow customers to search your catalog.
+*   **Account**: Link to the user profile/login page.
+*   **Cart**: Show the shopping bag icon.
+
+## Footer Settings
+
+Go to **Appearance > Footer** to manage the bottom of your site.
+
+![Footer Settings](/images/docs/builder/footer-settings.png)
+
+### Layout
+*   **Columns**: Choose a 3 or 4-column layout to organize your links.
+*   **Style**: Select `Simple` or `Detailed`.
+
+### Newsletter Integration
+You can easily collect emails directly from your footer.
+1.  Scroll down to the **Newsletter** section (or "Content & Contact").
+2.  Enable **Show in footer**.
+3.  This automatically adds a subscription input field to your footer, which connects directly to the [Newsletter Marketing](/docs/marketing/newsletter) system.
+
+### Contact Info
+Add your store address, email, and social media links. These helps build trust with your customers.

contents/docs/builder/index.mdx

@@ -0,0 +1,14 @@
+---
+title: Page Builder
+description: Design your store visually.
+---
+
+
+
+The WooNooW Page Builder allows you to create stunning, responsive pages without writing code.
+
+## Key Concepts
+
+*   **[Visual Editor](/docs/builder/visual-editor)**: Drag-and-drop interface explanation.
+*   **[Sections](/docs/builder/sections)**: Guide to all available blocks (Hero, Features, Content).
+*   **[Special Pages](/docs/builder/special-pages)**: How to customize the Shop, Cart, and Checkout pages.

contents/docs/builder/sections/index.mdx

@@ -0,0 +1,22 @@
+---
+title: Section Components
+description: Building blocks of your pages.
+---
+
+
+
+WooNooW includes a library of pre-designed sections.
+
+## Available Sections
+
+### Hero Section
+The impact statement of your page. Includes a large headline, subheadline, call-to-action buttons, and a background image or color.
+
+### Feature Grid
+Showcase your services or product highlights in a clean grid layout. Supports 2, 3, or 4 columns.
+
+### Content Block
+A versatile text block with optional image. Great for "About Us" sections or storytelling. You can position the image on the left or right.
+
+### Call to Action (CTA) Banner
+A high-converting strip designed to get clicks. Perfect for newsletter signups or limited-time offers.

contents/docs/builder/special-pages/index.mdx

@@ -0,0 +1,17 @@
+---
+title: Special Pages
+description: Customizing Shop and Checkout pages.
+---
+
+
+
+Unlike standard pages, "Special Pages" like the Shop, Cart, and Checkout are dynamically generated by WooCommerce. WooNooW gives you control over their wrapper and styling.
+
+## The Shop Page
+You can set a specific page to be your "Shop" page in **WooCommerce > Settings > Products**.
+Once set, WooNooW wraps this product grid in your global theme settings (Header, Footer, Container Width).
+
+## Cart & Checkout
+By enabling **SPA Mode** (Full or Checkout Only), WooNooW replaces the standard slow page loads with an instant, app-like transition.
+*   **Checkout Only Mode**: Users browse your normal site, but when they hit "Checkout", they enter the fast SPA data tunnel.
+*   **Full SPA Mode**: The entire shopping experience is instant.

contents/docs/builder/visual-editor/index.mdx

@@ -0,0 +1,26 @@
+---
+title: Visual Editor
+description: Drag-and-drop your store into existence.
+---
+
+
+
+The Visual Editor is the heart of the WooNooW Page Builder. It looks exactly like your front-end store, but allows you to edit content in real-time.
+
+## The Interface
+
+### 1. The Canvas
+The central area is your webpage. You can click on any element (Text, Image, Button) to edit it directly.
+
+### 2. The Inspector Panel (Left Sidebar)
+When you select a section or element, this panel shows all customizable options:
+*   **Content Tab**: Change text, links, and images.
+*   **Design Tab**: Adjust colors, padding, and alignment.
+
+### 3. The Top Bar
+*   **Device Toggle**: Switch between Desktop and Mobile view to ensure your site looks great everywhere.
+*   **Save Button**: Publish your changes instantly.
+
+## Adding Content
+
+To add a new section, hover over the canvas and click the **(+) Add Section** button that appears between existing blocks.

contents/docs/configuration/appearance/index.mdx

@@ -1,135 +1,19 @@
 ---
 title: Appearance Settings
-description: Customize the look and feel of your WooNooW store
-date: 2024-01-31
+description: Colors and Typography.
 ---
 
-## Accessing Appearance Settings
 
-Go to **WooNooW → Appearance** in the WordPress admin.
 
----
-
-## General Settings
-
-### Logo
-
-Upload your store logo for display in the header.
-
-- **Recommended size**: 200x60 pixels (width x height)
-- **Formats**: PNG (transparent background recommended), SVG, JPG
-- **Mobile**: Automatically resized for smaller screens
-
-### SPA Page
-
-Select which page hosts the WooNooW SPA. Default is "Store".
-
-> **Note**: This page should contain the `[woonoow_spa]` shortcode.
-
-### SPA Mode
-
-Choose how WooNooW handles your store pages:
-
-| Mode | Description |
-|------|-------------|
-| **Full** | All WooCommerce pages redirect to SPA |
-| **Disabled** | Native WooCommerce templates are used |
-
----
+Customize your brand without coding.
 
 ## Colors
-
-### Primary Color
-
-The main brand color used for:
-- Buttons
-- Links
-- Active states
-- Primary actions
-
-**Default**: `#6366f1` (Indigo)
-
-### Secondary Color
-
-Secondary UI elements:
-- Less prominent buttons
-- Borders
-- Subtle backgrounds
-
-**Default**: `#64748b` (Slate)
-
-### Accent Color
-
-Highlight color for:
-- Sale badges
-- Notifications
-- Call-to-action elements
-
-**Default**: `#f59e0b` (Amber)
-
----
+We use a smart palette system.
+*   **Primary**: Headlines and main buttons.
+*   **Secondary**: Subheadings and UI elements.
+*   **Accent**: Highlights and links.
 
 ## Typography
-
-### Body Font
-
-Font used for general text content.
-
-**Options**: System fonts and Google Fonts
-- Inter
-- Open Sans
-- Roboto
-- Lato
-- Poppins
-- And more...
-
-### Heading Font
-
-Font used for titles and headings.
-
-**Options**: Same as body fonts, plus:
-- Cormorant Garamond (Serif option)
-- Playfair Display
-- Merriweather
-
-### Font Sizes
-
-Font sizes are responsive and adjust automatically based on screen size.
-
----
-
-## Layout
-
-### Container Width
-
-Maximum width of the content area.
-
-| Option | Width |
-|--------|-------|
-| Narrow | 1024px |
-| Default | 1280px |
-| Wide | 1536px |
-| Full | 100% |
-
-### Header Style
-
-Configure the header appearance:
-- **Fixed**: Stays at top when scrolling
-- **Static**: Scrolls with page
-
-### Product Grid
-
-Columns in the shop page grid:
-- Mobile: 1-2 columns
-- Tablet: 2-3 columns
-- Desktop: 3-4 columns
-
----
-
-## Saving Changes
-
-1. Make your changes
-2. Click **Save Changes** button
-3. Refresh your store page to see updates
-
-> **Tip**: Open your store in another tab to preview changes quickly.
+Choose from GDPR-compliant, locally hosted font pairings like:
+*   **Modern**: Inter
+*   **Editorial**: Playfair Display

contents/docs/configuration/email/index.mdx

@@ -0,0 +1,17 @@
+---
+title: Email Settings
+description: Transactional emails and SMTP.
+---
+
+
+
+WooNooW replaces default WooCommerce emails with beautiful, responsive templates.
+
+## Template Editor
+Go to **Settings > Email** to customize:
+*   **Order Confirmation**
+*   **Shipping Updates**
+*   **Account Notifications**
+
+## SMTP Configuration
+Ensure your emails hit the inbox, not spam. We recommend using a dedicated SMTP service like SendGrid or Postmark.

contents/docs/configuration/general/index.mdx

@@ -0,0 +1,18 @@
+---
+title: General Settings
+description: Core store settings.
+---
+
+
+
+Located in **Appearance > General**.
+
+## SPA Mode
+Decide how much of your site uses our ultra-fast Single Page Application technology.
+*   **Disabled**: Use standard WordPress templates.
+*   **Checkout Only**: Normal browsing, fast checkout.
+*   **Full SPA**: The entire site is an app.
+
+## Container Width
+*   **Boxed (Recommended)**: Limits content width (max 1152px) for better readability.
+*   **Full Width**: Content stretches to the screen edges.

contents/docs/configuration/index.mdx

@@ -0,0 +1,16 @@
+---
+title: Configuration
+description: Configure every aspect of your store.
+---
+
+
+
+Fine-tune your store's behavior and appearance.
+
+## Settings Areas
+
+*   **[General](/docs/configuration/general)**: SPA Mode, Container Width, Typography.
+*   **[Appearance](/docs/configuration/appearance)**: Theme colors and branding.
+*   **[Modules](/docs/configuration/modules)**: Enable or disable specific features to keep your store lightweight.
+*   **[Email](/docs/configuration/email)**: Customize transactional emails and set up SMTP.
+*   **[Security](/docs/configuration/security)**: Protect your store with built-in security features.

contents/docs/configuration/licensing/index.mdx

@@ -0,0 +1,16 @@
+---
+title: Licensing
+description: Activate your store.
+---
+
+
+
+To receive updates and support, you must activate your license key.
+
+## Activation
+1.  Go to **Settings > License**.
+2.  Enter your key.
+3.  Click "Activate".
+
+## OAuth Connection
+Some features require connecting your store to our cloud. Click "Connect with WooNooW" to authorize the connection securely.

contents/docs/configuration/modules/index.mdx

@@ -0,0 +1,30 @@
+---
+title: Modules
+description: Enable or disable specific WooNooW features to optimize performance.
+---
+
+
+
+WooNooW is built with a modular architecture. You can enable or disable specific features based on your needs to keep your admin interface clean and your site performant.
+
+Navigate to **Settings > Modules** to manage these components.
+
+## Available Modules
+
+### Marketing
+- **Newsletter**: Built-in email marketing suite. Manage subscribers and send campaigns.
+- **Wishlist**: Allow customers to save products for later. Adds wishlist icons to product grids.
+- **Social Proof**: (Coming Soon) Show recent sales notifications.
+
+### Store Management
+- **Subscriptions**: Enable recurring payments and subscription products.
+- **Pre-Orders**: Allow customers to order products before they are available.
+
+### Developer
+- **Custom CSS/JS**: Inject custom code without editing theme files.
+- **Beta Features**: Early access to experimental features (use with caution).
+
+## How to Enable/Disable
+1. Find the module card in the list.
+2. Toggle the switch to **On** or **Off**.
+3. Changes usually take effect immediately, but some modules may require a page refresh or menu rebuild.

contents/docs/configuration/payment-shipping/index.mdx

@@ -0,0 +1,42 @@
+---
+title: Payment & Shipping
+description: Configure payment gateways and shipping options for your store.
+---
+
+
+
+WooNooW integrates seamlessly with WooCommerce's native payment and shipping settings while providing a modern interface for managing them.
+
+## Payment Gateways
+
+Navigate to **Settings > Payments** to manage your payment methods.
+
+### Supported Gateways
+WooNooW supports all standard WooCommerce payment gateways, including:
+- **Direct Bank Transfer** (BACS)
+- **Check Payments**
+- **Cash on Delivery**
+- **Stripe** (via official plugin)
+- **PayPal** (via official plugin)
+
+### Configuration
+1. Toggle the **Enabled** switch to activate a gateway.
+2. Click **Manage** (or the gear icon) to configure specific settings like API keys, titles, and descriptions.
+3. Drag and drop gateways to reorder how they appear at checkout.
+
+## Shipping
+
+Navigate to **Settings > Shipping** to configure shipping zones and methods.
+
+### Shipping Zones
+Shipping zones are geographic regions where a certain set of shipping methods and rates apply.
+1. **Add Zone**: Click "Add shipping zone" to create a new region (e.g., "North America", "Europe").
+2. **Region**: Select specific countries or states.
+3. **Methods**: Add methods like "Flat Rate", "Free Shipping", or "Local Pickup".
+
+### Shipping Options
+- **Calculations**: Enable/disable shipping calculator on the cart page.
+- **Destination**: Default to customer billing address or shipping address.
+
+### Shipping Classes
+Use shipping classes to group products of similar type (e.g., "Bulky", "Fragile") to provide different rates.

contents/docs/configuration/security/index.mdx

@@ -0,0 +1,33 @@
+---
+title: Security Settings
+description: Protect your store with WooNooW security features.
+---
+
+
+
+Navigate to **Settings > Security** to configure access controls and protection features for your store.
+
+## Access Control
+
+### Limit Login Attempts
+Protect your admin area and customer accounts from brute-force attacks.
+- **Max Retries**: Set the maximum number of failed login attempts allowed.
+- **Lockout Time**: Duration to lock out an IP address after exceeding retries.
+
+### Password Strength
+Enforce strong passwords for new customer accounts.
+- **Minimum Strength**: Choose between Weak, Medium, or Strong requirements (based on zxcvbn strength estimation).
+
+## Checkout Security
+
+### Captcha Protection
+Enable ReCaptcha or Cloudflare Turnstile on checkout and registration forms to prevent bot spam.
+- **Provider**: Select your captcha provider using the dropdown.
+- **Site Key & Secret Key**: Enter your API credentials.
+
+## API Security
+
+### REST API
+WooNooW relies on the WordPress REST API.
+- **Require SSL**: Force HTTPS for all API requests (Recommended).
+- **CORS Settings**: Configure Cross-Origin Resource Sharing if you are hosting the frontend on a different domain.

contents/docs/developer/addons/bridge-pattern/index.mdx

@@ -4,7 +4,7 @@ description: Integrating third-party plugins with WooNooW
 date: 2024-01-31
 ---
 
-# Addon Bridge Pattern
+
 
 ## Philosophy
 

contents/docs/developer/addons/custom-channels/index.mdx

@@ -0,0 +1,311 @@
+---
+title: Custom Notification Channels
+description: Learn how to add custom notification channels like WhatsApp, SMS, or Telegram to WooNooW
+---
+
+
+
+WooNooW supports custom notification channels through a pluggable architecture. You can extend the notification system to send messages via WhatsApp, SMS, Telegram, or any other service.
+
+## Architecture Overview
+
+The multi-channel notification system consists of three core components:
+
+1. **`ChannelInterface`** - Contract that all channels must implement
+2. **`ChannelRegistry`** - Central registry for managing channels
+3. **`NotificationManager`** - Sends notifications through registered channels
+
+```mermaid
+graph LR
+    A[NotificationManager] --> B[ChannelRegistry]
+    B --> C[Email Channel]
+    B --> D[WhatsApp Channel]
+    B --> E[SMS Channel]
+    B --> F[Custom Channel]
+```
+
+## Creating a Custom Channel
+
+### Step 1: Implement ChannelInterface
+
+Create a class that implements `WooNooW\Core\Notifications\Channels\ChannelInterface`:
+
+```php
+<?php
+namespace MyPlugin\Channels;
+
+use WooNooW\Core\Notifications\Channels\ChannelInterface;
+
+class WhatsAppChannel implements ChannelInterface {
+    
+    public function get_id() {
+        return 'whatsapp';
+    }
+    
+    public function get_label() {
+        return __('WhatsApp', 'my-plugin');
+    }
+    
+    public function is_configured() {
+        $api_key = get_option('my_whatsapp_api_key');
+        return !empty($api_key);
+    }
+    
+    public function send($event_id, $recipient, $data) {
+        // Your sending logic here
+        return [
+            'success' => true,
+            'message' => 'Sent successfully'
+        ];
+    }
+    
+    public function get_config_fields() {
+        return [
+            [
+                'id' => 'my_whatsapp_api_key',
+                'label' => 'API Key',
+                'type' => 'text',
+            ],
+        ];
+    }
+}
+```
+
+### Step 2: Register Your Channel
+
+Register your channel with the `ChannelRegistry` during plugin initialization:
+
+```php
+use WooNooW\Core\Notifications\ChannelRegistry;
+use MyPlugin\Channels\WhatsAppChannel;
+
+add_action('init', function() {
+    $channel = new WhatsAppChannel();
+    ChannelRegistry::register($channel);
+});
+```
+
+### Step 3: Enable in Settings
+
+Once registered, your channel will be available in the notification settings UI, where users can configure which events should use WhatsApp.
+
+## Interface Reference
+
+### get_id()
+
+Returns a unique identifier for your channel.
+
+```php
+public function get_id(): string
+```
+
+**Example:**
+```php
+public function get_id() {
+    return 'whatsapp'; // or 'sms', 'telegram', etc.
+}
+```
+
+### get_label()
+
+Returns a human-readable label for the admin UI.
+
+```php
+public function get_label(): string
+```
+
+**Example:**
+```php
+public function get_label() {
+    return __('WhatsApp Business', 'my-plugin');
+}
+```
+
+### is_configured()
+
+Checks if the channel has all required configuration (API keys, credentials, etc.).
+
+```php
+public function is_configured(): bool
+```
+
+**Example:**
+```php
+public function is_configured() {
+    $api_key = get_option('my_whatsapp_api_key');
+    $phone = get_option('my_whatsapp_phone');
+    return !empty($api_key) && !empty($phone);
+}
+```
+
+### send()
+
+Sends a notification through this channel.
+
+```php
+public function send(string $event_id, string $recipient, array $data): bool|array
+```
+
+**Parameters:**
+- `$event_id` - Event identifier (e.g., `'order_completed'`, `'newsletter_confirm'`)
+- `$recipient` - Recipient type (`'customer'` or `'staff'`)
+- `$data` - Context data including order, user, custom variables
+
+**Returns:**
+- `bool` - Simple success/failure
+- `array` - Detailed result with `success` and `message` keys
+
+**Example:**
+```php
+public function send($event_id, $recipient, $data) {
+    $phone = $this->get_recipient_phone($recipient, $data);
+    $message = $this->build_message($event_id, $data);
+    
+    $response = wp_remote_post('https://api.provider.com/send', [
+        'body' => [
+            'to' => $phone,
+            'message' => $message,
+            'api_key' => get_option('my_api_key'),
+        ],
+    ]);
+    
+    if (is_wp_error($response)) {
+        return [
+            'success' => false,
+            'message' => $response->get_error_message(),
+        ];
+    }
+    
+    return ['success' => true];
+}
+```
+
+### get_config_fields()
+
+Returns configuration fields for the admin settings UI (optional).
+
+```php
+public function get_config_fields(): array
+```
+
+**Field Structure:**
+```php
+[
+    'id' => 'option_name',
+    'label' => 'Field Label',
+    'type' => 'text|select|textarea',
+    'description' => 'Help text',
+    'options' => [], // For select fields
+    'default' => 'value',
+]
+```
+
+## Complete Example: WhatsApp Channel
+
+See the reference implementation:  
+[WhatsAppChannel.example.php](file:///Users/dwindown/Local%20Sites/woonoow/app/public/wp-content/plugins/woonoow/includes/Core/Notifications/Channels/WhatsAppChannel.example.php)
+
+This example includes:
+- ✅ Twilio API integration
+- ✅ Phone number extraction from orders/users
+- ✅ Message templates for common events
+- ✅ Configuration fields for admin settings
+
+## Message Customization
+
+Use filters to customize messages for specific events:
+
+```php
+add_filter('woonoow_whatsapp_message_order_completed', function($message, $data) {
+    if (isset($data['order'])) {
+        $order = $data['order'];
+        return sprintf(
+            "🎉 Order #%s confirmed! Track here: %s",
+            $order->get_order_number(),
+            $order->get_view_order_url()
+        );
+    }
+    return $message;
+}, 10, 2);
+```
+
+## Available Events
+
+Your channel can handle any registered notification event:
+
+| Event | Recipient | Data Available |
+|-------|-----------|----------------|
+| `order_completed` | customer | `order`, `user_id` |
+| `order_cancelled` | customer | `order`, `user_id` |
+| `newsletter_confirm` | customer | `email`, `confirmation_url` |
+| `newsletter_welcome` | customer | `email`, `user_id` |
+| `subscription_expiring` | customer | `subscription`, `user_id` |
+
+See [Event Registry](/hooks/notifications#event-registry) for the complete list.
+
+## Testing Your Channel
+
+```php
+// Manual test
+use WooNooW\Core\Notifications\NotificationManager;
+
+NotificationManager::send('order_completed', 'whatsapp', [
+    'order' => wc_get_order(123),
+    'user_id' => 1,
+]);
+```
+
+## Best Practices
+
+1. **Validate Configuration**: Always check `is_configured()` before attempting to send
+2. **Handle Errors Gracefully**: Return detailed error messages for debugging
+3. **Log Send Attempts**: Use `do_action()` for tracking/analytics
+4. **Support Filtering**: Allow message customization via filters
+5. **Rate Limiting**: Consider implementing rate limiting for API calls
+
+## Hooks
+
+### Registration Hook
+```php
+// Register channels during init
+add_action('init', function() {
+    ChannelRegistry::register(new MyChannel());
+});
+```
+
+### Custom Hooks in Your Channel
+```php
+// Allow logging/tracking
+do_action('my_channel_sent', $event_id, $recipient, $result);
+
+// Allow message customization
+$message = apply_filters(
+    "my_channel_message_{$event_id}", 
+    $default_message, 
+    $data
+);
+```
+
+## Troubleshooting
+
+**Channel not appearing in settings?**
+- Ensure `ChannelRegistry::register()` is called during `init`
+- Check that `get_id()` returns a unique string
+- Verify `is_configured()` returns `true`
+
+**Messages not sending?**
+- Check notification settings: Marketing > Notifications
+- Verify the event has your channel enabled
+- Enable debug mode and check logs
+- Test `is_configured()` returns true
+
+**API errors?**
+- Validate API credentials in settings
+- Check API provider status/quotas
+- Review error logs for API responses
+
+## Related Documentation
+
+- [Notification System](/core-concepts/notifications)
+- [Event Registry](/hooks/notifications#event-registry)
+- [Notification Hooks](/hooks/notifications)

contents/docs/developer/addons/module-integration/index.mdx

@@ -4,7 +4,7 @@ description: Integrating Addons usage with Module Registry
 date: 2024-01-31
 ---
 
-# Addon-Module Integration
+
 
 ## Vision
 

contents/docs/developer/addons/page-templates/index.mdx

@@ -0,0 +1,103 @@
+---
+title: Custom Page Templates
+description: Learn how to register custom starting templates for the Page Editor.
+---
+
+WooNooW allows developers to register custom page templates. These templates appear in the "Create New Page" modal, allowing users to start with a pre-configured layout instead of a blank page.
+
+## Registering a Template
+
+To add a new template, use the `woonoow_page_templates` filter. You should append your template definition to the existing array.
+
+```php
+add_filter('woonoow_page_templates', function($templates) {
+    $templates[] = [
+        'id'          => 'my-custom-landing',
+        'label'       => 'Product Launch',
+        'description' => 'A structured page for new product announcements.',
+        'icon'        => 'rocket', // Lucide icon name (lowercase)
+        'sections'    => [
+            // Section definitions...
+        ]
+    ];
+    return $templates;
+});
+```
+
+## Template Structure
+
+Each template requires the following properties:
+
+| Property | Type | Description |
+| :--- | :--- | :--- |
+| `id` | string | Unique identifier for the template. |
+| `label` | string | Display name shown in the modal. |
+| `description` | string | Short description of the template's purpose. |
+| `icon` | string | Name of a Lucide icon (e.g., `layout`, `users`, `rocket`). |
+| `sections` | array | Array of section objects defining the initial layout. |
+
+### Defining Sections
+
+Sections are the building blocks of a page. Each section object mimics the structure stored in the database.
+
+```php
+[
+    'id'   => uniqid('section_'), // Must be unique
+    'type' => 'hero',             // Component type (hero, feature-grid, image-text, etc.)
+    'props' => [
+        'title'    => ['type' => 'static', 'value' => 'Hello World'],
+        'subtitle' => ['type' => 'static', 'value' => 'This is a template.'],
+    ],
+    'styles' => [
+        'contentWidth' => 'contained', // 'full' or 'contained'
+        'padding'      => 'medium',
+    ]
+]
+```
+
+## Example: Full Configuration
+
+Here is a complete example that registers a "Support Page" template with a Hero and a FAQ section.
+
+```php
+add_filter('woonoow_page_templates', function($templates) {
+    $templates[] = [
+        'id'          => 'support-page',
+        'label'       => 'Support Center',
+        'description' => 'Help desk layout with search and FAQ grid.',
+        'icon'        => 'help-circle',
+        'sections'    => [
+            // Hero Section
+            [
+                'id' => uniqid('section_'),
+                'type' => 'hero',
+                'props' => [
+                    'title' => ['type' => 'static', 'value' => 'How can we help?'],
+                    'cta_text' => ['type' => 'static', 'value' => 'Contact Support'],
+                    'cta_url' => ['type' => 'static', 'value' => '/contact'],
+                ],
+                'styles' => ['contentWidth' => 'full']
+            ],
+            // Content Section
+            [
+                'id' => uniqid('section_'),
+                'type' => 'content',
+                'props' => [
+                    'content' => ['type' => 'static', 'value' => '<h2>Frequently Asked Questions</h2><p>Find answers below.</p>']
+                ],
+                'styles' => ['contentWidth' => 'contained']
+            ]
+        ]
+    ];
+    return $templates;
+});
+```
+
+## Available Section Types
+
+Common available section types include:
+- `hero`: Large banner with title, subtitle, and CTA.
+- `content`: Rich text editor content.
+- `image-text`: Split layout with image and text.
+- `feature-grid`: Grid of icons and text.
+- `cta-banner`: Call to action strip.

contents/docs/developer/addons/react-integration/index.mdx

@@ -4,7 +4,7 @@ description: Using React within WooNooW Addons
 date: 2024-01-31
 ---
 
-# Addon React Integration
+
 
 ## The Challenge
 

contents/docs/developer/overview/index.mdx

@@ -0,0 +1,17 @@
+---
+title: Developer Guide
+description: Extend and customize WooNooW.
+---
+
+## Core Concepts
+
+WooNooW is built with extensibility in mind.
+
+### [Addons System](/docs/developer/addons/module-integration)
+Learn how to create custom modules that plug into the WooNooW ecosystem.
+
+### [React Integration](/docs/developer/addons/react-integration)
+Understand how we bridge PHP and React to create seamless admin interfaces.
+
+### [API Reference](/docs/developer/api/licensing)
+Detailed documentation of our REST API endpoints.

contents/docs/getting-started/quick-setup/index.mdx

@@ -0,0 +1,17 @@
+---
+title: Quick Setup Wizard
+description: Get your store running in minutes.
+---
+
+
+
+The Quick Setup Wizard is the fastest way to configure your WooNooW store. It launches automatically when you first activate the plugin.
+
+## Steps
+
+1.  **Choose Your Mode**: Select between **Full SPA** (best for new stores) or **Checkout Only** (best for existing themes).
+2.  **Homepage Setup**: Automatically create a "Shop" page and set it as your home.
+3.  **Design**: Choose a "Boxed" or "Full Width" layout and pick a color theme.
+4.  **Launch**: Be redirected immediately to the Visual Builder.
+
+If you skipped the wizard, you can always configure these options manually in **Appearance > General**.

contents/docs/marketing/coupons/index.mdx

@@ -0,0 +1,60 @@
+---
+title: Coupons
+description: Create discount codes to boost sales and reward customers.
+---
+
+
+
+Coupons are a powerful way to run sales, recover abandoned carts, and reward loyalty. WooNooW provides a flexible coupon system compatible with standard WooCommerce logic.
+
+![Coupons List](/images/docs/marketing/coupons-list.png)
+
+## Managing Coupons
+
+Navigate to **Marketing > Coupons** to see all active and expired discount codes.
+The list view shows:
+*   **Code**: The text customers enter at checkout.
+*   **Type**: e.g., Percentage or Fixed Amount.
+*   **Amount**: The value of the discount.
+*   **Usage**: How many times the coupon has been used compared to its limit.
+
+## Applying Coupons
+
+### 1. Manual Entry
+Customers can enter the code in the "Coupon Code" field on the Cart or Checkout page.
+
+### 2. Via URL (Auto-Apply)
+You can send customers a direct link that automatically applies the coupon and adds it to their session.
+Format: `https://yourstore.com/shop?coupon=CODE` (or `?apply_coupon=CODE`)
+
+Example: `https://example.com/shop?coupon=SUMMER2026`
+
+> [!TIP]
+> This is perfect for [Newsletter Campaigns](/docs/marketing/newsletter). Use this link in your email buttons (e.g., "Shop Now & Save 20%") to boost conversion rates.
+
+## Creating a Coupon
+
+Click **New Coupon** to create a promotion.
+
+![Create Coupon](/images/docs/marketing/coupon-create.png)
+
+### General Settings
+1.  **Code**: (Required) Make it memorable (e.g., `SUMMER2026`).
+2.  **Description**: Internal note about the campaign.
+3.  **Discount Type**:
+    *   **Percentage**: Takes a % off the total cart (e.g., 20%).
+    *   **Fixed Cart Discount**: Removes a specific amount from the whole cart (e.g., $10 off).
+    *   **Fixed Product Discount**: Disounts specific items only.
+4.  **Expiry Date**: Automatically disable the coupon after this date.
+
+
+### Restrictions & Limits
+Use the tabs on the left to add rules:
+*   **Usage Limits**:
+    *   **Per Coupon**: Total number of times this code can be used.
+    *   **Per User**: Limit how many times a single customer can use it.
+*   **Minimum/Maximum Spend**: Define the order value range for the coupon to be valid.
+*   **Conditions**:
+    *   **Individual Use**: Prevent using this coupon with other offers.
+    *   **Exclude Sale Items**: Do not apply discount if items are already on sale.
+    *   **Product/Category Restrictions**: Whitelist or blacklist specific items or categories.

contents/docs/marketing/index.mdx

@@ -0,0 +1,14 @@
+---
+title: Marketing Suite
+description: Grow your business with built-in tools.
+---
+
+
+
+WooNooW comes with a powerful suite of marketing tools to help you retain customers and increase sales.
+
+## Features
+
+*   **[Newsletter](/docs/marketing/newsletter)**: Create campaigns and manage subscribers directly from your dashboard.
+*   **[Coupons](/docs/marketing/coupons)**: Create smart coupons and automatic discounts.
+*   **[Wishlist](/docs/marketing/wishlist)**: Let customers save their favorite items for later.

contents/docs/marketing/newsletter/index.mdx

@@ -0,0 +1,49 @@
+---
+title: Newsletter
+description: Manage subscribers and send email campaigns directly from your store.
+---
+
+
+
+WooNooW includes a built-in newsletter system, allowing you to build your audience and engage customers without third-party services.
+
+![Newsletter Dashboard](/images/docs/marketing/newsletter-list.png)
+
+## Managing Subscribers
+
+The **Subscribers** tab displays your entire audience list.
+
+*   **Status**: Quickly see if a user is `active` or `unsubscribed`.
+*   **Source**: Identify if the subscriber is a registered WordPress user or a guest.
+*   **Actions**: Use the menu to manually unsubscribe or delete users.
+
+### Collecting Emails
+Subscribers are automatically added via:
+1.  **Checkout Opt-in**: Customers can subscribe while placing an order.
+2.  **[Footer Form](/docs/builder/header-footer#newsletter-integration)**: Use the built-in newsletter block in your store footer.
+3.  **Popups**: (If enabled) Capture emails via exit-intent popups.
+
+## Creating Campaigns
+
+Navigate to the **Campaigns** tab or click **New Campaign** to start composing an email.
+
+![Create Campaign](/images/docs/marketing/campaign-create.png)
+
+### Campaign Settings
+1.  **Title**: Internal name for your reference (e.g., "Holiday Sale 2026").
+2.  **Subject**: The subject line appearing in customers' inboxes. Use emojis to boost open rates! 🎄
+
+### Email Builder
+The visual editor allows you to format your message with rich text, links, and images.
+
+> [!TIP]
+> **Use Variables**
+> Personalize your emails using shortcodes like `{customer_name}` to automatically insert the recipient's first name.
+
+## Sending Process
+Once your campaign is ready, you can:
+*   **Send Test**: Send a preview to your admin email address.
+*   **Schedule**: Pick a future date and time for delivery.
+*   **Send Now**: Immediately blast the campaign to all active subscribers.
+
+WooNooW handles the sending queue in the background to prevent server timeouts.

contents/docs/marketing/wishlist/index.mdx

@@ -0,0 +1,39 @@
+---
+title: Wishlist
+description: Allow customers to save products for later purchasing.
+---
+
+The **Wishlist** module allows customers to save their favorite products to a dedicated list, increasing retention and future purchases.
+
+## Overview
+
+A wishlist provides a way for shoppers to create personalized collections of products they want to buy and save them for future reference.
+
+### Key Features
+*   **Guest Wishlists**: Allow non-logged-in users to save items (stored in their browser).
+*   **User Integration**: Logged-in users' wishlists are saved to their account.
+*   **One-Click Add**: Customers can move items from wishlist to cart instantly.
+
+## Configuration
+
+To access Wishlist settings, go to **Settings > Modules > Wishlist**.
+
+![Wishlist Settings](/assets/screenshots/wishlist_settings_screenshot.png)
+
+### General Settings
+*   **Enable Guest Wishlists**: If enabled, guests can add items to a wishlist which is stored in their browser's local storage. If disabled, users must log in to use the wishlist.
+*   **Show Icon in Header**: displays a heart icon with a counter in the site header.
+*   **Max Items Per Wishlist**: Set a limit on how many items can be saved (Set to `0` for unlimited).
+*   **Show "Add to Cart"**: Display a direct add-to-cart button next to each item in the wishlist view.
+
+## Usage
+
+### For Customers
+1.  **Adding Items**: Click the Heart icon on any product card or product page.
+2.  **Viewing Wishlist**: Click the Heart icon in the header or visit `/wishlist`.
+3.  **Managing**: Removing items is done by clicking the Heart icon again or the "Remove" button in the list.
+
+### Future Features (Coming Soon)
+*   **Sharing**: Ability to share public wishlist links.
+*   **Back in Stock**: Auto-notifications for saved items.
+*   **Multiple Lists**: Create detailed lists (e.g., "Birthday", "Holiday").

contents/docs/store/customers/index.mdx

@@ -0,0 +1,33 @@
+---
+title: Customers
+description: VIP classification and metrics.
+---
+
+
+
+Know who buys from you.
+
+## Customer Overview
+Navigate to **Store > Customers** to view your customer database. The table provides a quick view of:
+- **Name & Email**: Contact details.
+- **Total Spend**: Lifetime value of the customer.
+- **Orders**: Number of orders placed.
+- **Last Seen**: Date of last activity.
+
+## VIP Classification
+WooNooW automatically tags customers based on their spending habits to help you identify high-value clients.
+
+### Tiers
+- **VIP**: Customers whose total spend exceeds the VIP threshold (configurable in Settings). These are your top 1% or 5% of customers.
+- **Recurring**: Customers who have placed more than one order but haven't reached VIP status yet.
+- **New**: Customers with only a single purchase.
+- **At Risk**: High-value customers who haven't purchased in a long time (e.g., > 90 days).
+
+## Actions
+Click on a customer to view their detailed profile, including:
+- **Order History**: Full list of past purchases.
+- **Notes**: Private admin notes about the customer.
+- **Edit Details**: Update shipping/billing addresses manually.
+
+### Segmentation
+You can use these classifications to segment your [Newsletter](/docs/marketing/newsletter) campaigns. For example, send a special "Thank You" coupon exclusively to your **VIP** segment.

contents/docs/store/index.mdx

@@ -0,0 +1,14 @@
+---
+title: Store Management
+description: Manage your daily operations.
+---
+
+
+
+The Store Management section allows you to handle day-to-day operations efficiently.
+
+## Sections
+
+*   **[Orders](/docs/store/orders)**: View and process customer orders with a modern interface.
+*   **[My Customers](/docs/store/customers)**: Manage your customer base and assign VIP statuses.
+*   **[Products](/docs/store/products)**: Quick overview and management of your catalog.

contents/docs/store/orders/index.mdx

@@ -0,0 +1,18 @@
+---
+title: Orders
+description: Processing transactions.
+---
+
+
+
+View and manage orders in **Store Management > Orders**.
+
+## The Order Table
+A modern, real-time view of your sales.
+*   **Status Filters**: Quickly see what needs processing.
+*   **Quick Actions**: Print invoices or mark as shipped directly from the list.
+
+## Order Details
+Clicking an order reveals the deep dive view:
+*   **Timeline**: See exactly when payment happened and emails were sent.
+*   **Edit Items**: Modify the order contents before fulfillment.

contents/docs/store/products/index.mdx

@@ -0,0 +1,17 @@
+---
+title: Products
+description: Managing your catalog.
+---
+
+
+
+WooNooW enhances the standard WooCommerce product management.
+
+## Quick Edit
+Update prices and stock levels directly from the list view without opening each product.
+
+## Types
+We support all standard types:
+*   **Simple Product**
+*   **Variable Product**
+*   **Digital/Downloadable**

docu.json

@@ -19,7 +19,7 @@
       },
       {
         "title": "Developer Docs",
-        "href": "/docs"
+        "href": "/docs/developer/overview"
       },
       {
         "title": "Plugin Site",
@@ -48,12 +48,12 @@
   "routes": [
     {
       "title": "Getting Started",
-      "href": "/getting-started",
+      "href": "/docs/getting-started",
       "noLink": true,
       "context": {
         "icon": "Book",
         "description": "Guides and References",
-        "title": "Docs"
+        "title": "Start"
       },
       "items": [
         {
@@ -63,13 +63,93 @@
         {
           "title": "Installation",
           "href": "/installation"
+        },
+        {
+          "title": "Quick Setup Wizard",
+          "href": "/getting-started/quick-setup"
+        }
+      ]
+    },
+    {
+      "title": "Store Management",
+      "href": "/docs/store",
+      "noLink": false,
+      "context": {
+        "icon": "ShoppingBag",
+        "description": "Orders, Customers, Products",
+        "title": "Store"
+      },
+      "items": [
+        {
+          "title": "Orders",
+          "href": "/orders"
+        },
+        {
+          "title": "My Customers (VIP)",
+          "href": "/customers"
+        },
+        {
+          "title": "Products",
+          "href": "/products"
+        }
+      ]
+    },
+    {
+      "title": "Marketing Suite",
+      "href": "/docs/marketing",
+      "noLink": false,
+      "context": {
+        "icon": "Megaphone",
+        "description": "Campaigns & Growth",
+        "title": "Marketing"
+      },
+      "items": [
+        {
+          "title": "Newsletter",
+          "href": "/newsletter"
+        },
+        {
+          "title": "Coupons",
+          "href": "/coupons"
+        },
+        {
+          "title": "Wishlist",
+          "href": "/wishlist"
+        }
+      ]
+    },
+    {
+      "title": "Page Builder",
+      "href": "/docs/builder",
+      "noLink": false,
+      "context": {
+        "icon": "Layout",
+        "description": "Visual Editor & Design",
+        "title": "Builder"
+      },
+      "items": [
+        {
+          "title": "Visual Editor",
+          "href": "/visual-editor"
+        },
+        {
+          "title": "Section Components",
+          "href": "/sections"
+        },
+        {
+          "title": "Special Pages (Shop/Cart)",
+          "href": "/special-pages"
+        },
+        {
+          "title": "Header & Footer",
+          "href": "/header-footer"
         }
       ]
     },
     {
       "title": "Configuration",
-      "href": "/configuration",
-      "noLink": true,
+      "href": "/docs/configuration",
+      "noLink": false,
       "context": {
         "icon": "Settings",
         "description": "Setup & Options",
@@ -77,74 +157,38 @@
       },
       "items": [
         {
-          "title": "SPA Mode",
-          "href": "/spa-mode"
+          "title": "General Settings",
+          "href": "/general"
         },
         {
-          "title": "Appearance",
+          "title": "Appearance (Colors/Type)",
           "href": "/appearance"
-        }
-      ]
-    },
-    {
-      "title": "Core Features",
-      "href": "/features",
-      "noLink": true,
-      "context": {
-        "icon": "Layout",
-        "description": "Store Functionality",
-        "title": "Features"
-      },
-      "items": [
-        {
-          "title": "Shop Page",
-          "href": "/shop"
         },
         {
-          "title": "Checkout",
-          "href": "/checkout"
+          "title": "Modules",
+          "href": "/modules"
         },
         {
-          "title": "Shortcodes",
-          "href": "/shortcodes"
-        }
-      ]
-    },
-    {
-      "title": "Licensing & OAuth",
-      "href": "/licensing",
-      "noLink": true,
-      "context": {
-        "icon": "Key",
-        "description": "License Management",
-        "title": "Licensing"
-      },
-      "items": [
+          "title": "Email Settings",
+          "href": "/email"
+        },
         {
-          "title": "OAuth Flow",
-          "href": "/oauth-flow"
-        }
-      ]
-    },
-    {
-      "title": "API Reference",
-      "href": "/api-reference",
-      "noLink": true,
-      "context": {
-        "icon": "Terminal",
-        "description": "API Endpoints",
-        "title": "API"
-      },
-      "items": [
+          "title": "Security",
+          "href": "/security"
+        },
         {
-          "title": "Licensing API",
+          "title": "Payment & Shipping",
+          "href": "/payment-shipping"
+        },
+        {
+          "title": "Licensing",
           "href": "/licensing"
         }
       ]
     },
     {
       "title": "Developer Guides",
-      "href": "/developer",
+      "href": "/docs/developer",
       "noLink": true,
       "context": {
         "icon": "Code",
@@ -152,6 +196,18 @@
         "title": "Dev"
       },
       "items": [
+        {
+          "title": "Overview",
+          "href": "/overview"
+        },
+        {
+          "title": "Custom Channels",
+          "href": "/addons/custom-channels"
+        },
+        {
+          "title": "Page Templates",
+          "href": "/addons/page-templates"
+        },
         {
           "title": "Addons: Bridge Pattern",
           "href": "/addons/bridge-pattern"
@@ -163,12 +219,16 @@
         {
           "title": "Addons: Module Registry",
           "href": "/addons/module-integration"
+        },
+        {
+          "title": "Licensing API",
+          "href": "/api/licensing"
         }
       ]
     },
     {
       "title": "Hooks & Filters",
-      "href": "/hooks",
+      "href": "/docs/hooks",
       "noLink": true,
       "context": {
         "icon": "Anchor",
@@ -200,7 +260,7 @@
     },
     {
       "title": "Resources",
-      "href": "/resources",
+      "href": "/docs/resources",
       "noLink": true,
       "context": {
         "icon": "Box",