diff --git a/docs/design_guidance.md b/docs/design_guidance.md
new file mode 100644
index 00000000..e8feed28
--- /dev/null
+++ b/docs/design_guidance.md
@@ -0,0 +1,229 @@
+# Design Guidance for HVAC Community Events
+
+This document provides design guidance for implementing the HVAC Community Events Management System based on the design references and WordPress theme integration requirements.
+
+## Design Reference Analysis
+
+The design references in the `design_references/` directory provide valuable insights into the desired user interface and experience. These references should be used as guides for implementing the various pages of the plugin.
+
+## Core UI Elements and Patterns
+
+### 1. Navigation and Header Elements
+
+- **Global Header**: The site uses the standard Upskill HVAC header with main navigation
+- **Sub-navigation**: Pages have contextual navigation with clear action buttons
+- **Breadcrumbs**: Event Summary page includes breadcrumb navigation (Trainer Home > Event Summary)
+- **Action Buttons**: Consistently styled blue buttons with icons for primary actions
+
+### 2. Layout Patterns
+
+- **Card-based Layout**: Information is organized in clean card sections with white backgrounds
+- **Section Headers**: Clear typographic hierarchy with section titles
+- **Grid Structure**: Responsive grid layout for statistics cards and information sections
+- **Table Layout**: Clean tables with clear headers and alternating row colors
+- **Form Layout**: Well-structured forms with logical grouping and clear labels
+
+### 3. Visual Elements
+
+- **Color Scheme**: Light blue page backgrounds with white cards and blue accents
+- **Typography**: Consistent heading hierarchy and paragraph styling
+- **Icons**: Used to enhance recognition of statistics and action buttons
+- **Spacing**: Consistent padding and margin patterns throughout
+
+## WordPress Theme Integration
+
+### 1. Leveraging Astra Theme
+
+The Upskill HVAC site uses a child theme of Astra (4.9.0). To ensure consistency:
+
+- Use Astra's hook system:
+ - `astra_header_before`/`astra_header_after` for header content
+ - `astra_primary_content_top`/`astra_primary_content_bottom` for main content area
+ - `astra_entry_content_before`/`astra_entry_content_after` for content containers
+
+- Use Astra's styling classes:
+ - `.ast-container` for main content containers
+ - `.ast-row` for grid layouts
+ - `.ast-col-*` for column structures
+ - `.ast-button` and variants for button styling
+
+### 2. Essential Blocks and Spectra Pro Integration
+
+- **Content Blocks**: Use Essential Blocks for advanced content structures when appropriate
+- **Layout Elements**: Leverage Spectra Pro's advanced layout options for complex page sections
+- **Component Styling**: Apply Spectra's pre-styled components rather than custom CSS when possible
+
+### 3. Custom Templates
+
+When creating custom templates, follow these guidelines:
+
+1. Start by extending default theme templates:
+ ```php
+ // Example template hierarchy
+ get_header();
+ ?>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ```
+
+## Page-Specific Implementation Guidelines
+
+### 1. Trainer Dashboard
+
+Based on `upskillhvac.com_hce-dashboard_ (4).png`:
+
+- **Page Structure**:
+ - Top navigation bar with action buttons
+ - "Your Stats" section with 5 stat cards in a responsive grid
+ - "Your Events" section with tabbed filtering and table display
+
+- **Theme Integration**:
+ ```php
+ // Stat cards implementation example
+ echo '
';
+ foreach ($stats as $stat) {
+ echo '
';
+ echo '
';
+ // Card content
+ echo '
';
+ echo '
';
+ }
+ echo '
';
+ ```
+
+- **Responsive Behavior**:
+ - Statistics cards stack on mobile (1 column)
+ - Table becomes scrollable on smaller screens
+ - Action buttons adapt to mobile layout
+
+### 2. Event Summary Page
+
+Based on `upskillhvac.com_hce-event-summary__event_id=1662 (1).png`:
+
+- **Page Structure**:
+ - Breadcrumb navigation
+ - Event title with action buttons
+ - Event details section with 4 info cards
+ - Event description with formatted sections
+ - Transactions table
+
+- **Theme Integration**:
+ ```php
+ // Event details cards implementation example
+ echo '