═══════════════════════════════════════════════════════════════════
IBrandBiz Comparison Order Form Template for WHMCS
═══════════════════════════════════════════════════════════════════

Version: 1.0.0
Compatible with: WHMCS 6.1 and later
Parent Template: standard_cart

═══════════════════════════════════════════════════════════════════
INSTALLATION INSTRUCTIONS
═══════════════════════════════════════════════════════════════════

1. UPLOAD THE TEMPLATE
   -----------------------
   - Extract the ibrandbiz_comparison folder from this archive
   - Upload to: /public_html/portal/templates/orderforms/
   - Final path: /public_html/portal/templates/orderforms/ibrandbiz_comparison/

2. UPLOAD LOGO FILES
   -----------------------
   Upload your IBrandBiz logo files to WHMCS:
   
   - Header logo: /public_html/portal/assets/images/logo.svg
     Recommended size: 75px height, transparent background
   
   - Footer logo: /public_html/portal/assets/images/logo-reverse.svg
     Recommended size: 53px height, white version for dark background

3. ACTIVATE THE TEMPLATE
   -----------------------
   In WHMCS Admin Area:
   
   a) Navigate to: Setup > General Settings > Ordering
   b) Find: "Default Order Form Template"
   c) Select: "IBrandBiz Comparison"
   d) Click: "Save Changes"

4. CLEAR TEMPLATE CACHE
   -----------------------
   After activation, clear the template cache:
   
   a) Navigate to: Utilities > System > System Cleanup
   b) Click: "Empty Template Cache"
   c) Confirm the action

5. CONFIGURE PRODUCTS
   -----------------------
   For best results with the comparison layout:
   
   a) Navigate to: Setup > Products/Services > Product Groups
   b) Edit your product group (e.g., "Web Hosting")
   c) Set features using the "Features" tab
   d) Mark one product as "Featured" for the ★ Recommended badge
   e) Ensure all products have descriptions

═══════════════════════════════════════════════════════════════════
TEMPLATE FILES
═══════════════════════════════════════════════════════════════════

/ibrandbiz_comparison/
├── theme.yaml              Template configuration (parent: standard_cart)
├── products.tpl            Product listing page with comparison layout
├── viewcart.tpl            Shopping cart view with order summary
├── configureproduct.tpl    Product configuration page
├── includes/
│   ├── head.tpl            Header section (logo, navigation)
│   └── footer.tpl          Footer section (links, contact)
├── css/
│   └── styles.css          Complete styles (no modifications needed)
├── js/
│   └── app.js              JavaScript functionality
└── README.txt              This file

═══════════════════════════════════════════════════════════════════
FEATURES
═══════════════════════════════════════════════════════════════════

✓ Modern comparison-style product layout (3-column grid)
✓ Featured product highlighting with "★ Recommended" badge
✓ Responsive design (mobile-friendly, stacks vertically)
✓ Domain search integration
✓ Dynamic WHMCS product/pricing display
✓ Order summary sidebar with real-time totals
✓ Product configuration with billing cycles
✓ Configurable options support
✓ Custom fields support
✓ Promo code functionality
✓ Professional IBrandBiz branding
✓ Bootstrap 3.4.1 framework
✓ Font Awesome 5 icons
✓ Inter font family
✓ Lucide SVG icons in footer

═══════════════════════════════════════════════════════════════════
DESIGN SPECIFICATIONS
═══════════════════════════════════════════════════════════════════

Brand Colors:
- Primary Green: #00C851
- Orange Accent: #d97706
- Dark Gray: #231f20

Typography:
- Font Family: Inter
- System Fallbacks: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto

Card Design:
- White headers with black text (#1f2937)
- Featured products: Green border (#00C851)
- Order Summary: Light gray header (#f3f4f6)

═══════════════════════════════════════════════════════════════════
WHMCS SMARTY VARIABLES USED
═══════════════════════════════════════════════════════════════════

Products Page:
- {$products}               Array of products
- {$product.name}           Product name
- {$product.description}    Product description
- {$product.pricing.*}      Pricing for all billing cycles
- {$product.features}       Product features array
- {$product.isFeatured}     Featured flag

Cart Page:
- {$cartitems}              Cart items array
- {$subtotal}               Cart subtotal
- {$total}                  Cart total
- {$discount}               Discount amount
- {$taxtotal}               Tax total

Configuration:
- {$configurableoptions}    Product options
- {$customfields}           Custom fields
- {$pricing.cycles}         Available billing cycles

═══════════════════════════════════════════════════════════════════
CUSTOMIZATION
═══════════════════════════════════════════════════════════════════

To customize the template:

1. Products Display:    Edit products.tpl
2. Cart Display:        Edit viewcart.tpl
3. Configuration:       Edit configureproduct.tpl
4. Styling:             Edit css/styles.css
5. JavaScript:          Edit js/app.js
6. Header/Footer:       Edit includes/head.tpl and includes/footer.tpl

Note: This template inherits checkout.tpl and complete.tpl from the
parent "standard_cart" template for a consistent checkout experience.

═══════════════════════════════════════════════════════════════════
TESTING CHECKLIST
═══════════════════════════════════════════════════════════════════

After installation, verify:

□ Products display in 3-column grid
□ Featured product shows "★ Recommended" badge
□ Pricing displays correctly for all billing cycles
□ "Add to Cart" buttons work
□ Domain search form submits correctly
□ Cart displays items with correct prices
□ Order summary shows subtotal, tax, and total
□ Promo code field functions
□ Product configuration page works
□ Billing cycle selection updates pricing
□ Footer displays correctly with all links
□ Mobile responsive design works (test on phone)
□ Logos display in header and footer

═══════════════════════════════════════════════════════════════════
TROUBLESHOOTING
═══════════════════════════════════════════════════════════════════

Issue: Template not appearing in dropdown
Fix: Ensure theme.yaml is present and properly formatted

Issue: Logos not displaying
Fix: Verify logo paths in /assets/images/ folder

Issue: Styles not loading
Fix: Clear WHMCS template cache and browser cache

Issue: Products not displaying
Fix: Verify products are assigned to the correct product group

Issue: Featured badge not showing
Fix: Edit product and check "Featured Product" checkbox

Issue: Pricing not showing
Fix: Verify product has pricing configured for at least one billing cycle

═══════════════════════════════════════════════════════════════════
SUPPORT
═══════════════════════════════════════════════════════════════════

For technical support with this template:

Email: info@ibrandbiz.com
Phone: +1 (346) 530-8908
Website: https://ibrandbiz.com

═══════════════════════════════════════════════════════════════════
LICENSE & COPYRIGHT
═══════════════════════════════════════════════════════════════════

© 2025 IBrandBiz. All rights reserved.

This template is licensed for use with IBrandBiz WHMCS installations.
Do not redistribute without permission.

═══════════════════════════════════════════════════════════════════
