<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="description" content="Dunamis Growth - Restaurant Management System">
  <meta name="mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
  <meta name="apple-mobile-web-app-title" content="Dunamis">
  <meta name="theme-color" content="#673AB7">
  <meta name="format-detection" content="telephone=no">
  
  <title>Dunamis Growth</title>
  
  <!-- Favicon -->
  <link rel="icon" href="icons/dunamis_growth_logo.png">
  <link rel="apple-touch-icon" href="icons/dunamis_growth_logo.png">
  <link rel="apple-touch-icon" sizes="152x152" href="icons/dunamis_growth_logo_152.png">
  <link rel="apple-touch-icon" sizes="180x180" href="icons/dunamis_growth_logo_180.png">
  <link rel="apple-touch-icon" sizes="167x167" href="icons/dunamis_growth_logo_167.png">
  
  <!-- iOS Splash Screens -->
  <link rel="apple-touch-startup-image" href="icons/splash-1125x2436.png" media="(device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3)">
  <link rel="apple-touch-startup-image" href="icons/splash-1242x2688.png" media="(device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3)">
  <link rel="apple-touch-startup-image" href="icons/splash-828x1792.png" media="(device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2)">
  <link rel="apple-touch-startup-image" href="icons/splash-1170x2532.png" media="(device-width: 390px) and (device-height: 844px) and (-webkit-device-pixel-ratio: 3)">
  <link rel="apple-touch-startup-image" href="icons/splash-1284x2778.png" media="(device-width: 428px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3)">
  
  <!-- Web App Manifest -->
  <link rel="manifest" href="manifest.json">
  
  <!-- Google Fonts -->
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
  
  <!-- Material Icons -->
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  
  <!-- Cache Buster (kept, but SW hard reset/update disabled to avoid unexpected reloads) -->
  <script src="js/cache-buster.js?v=20251028"></script>

  <!-- NOTE: Previous one-time service worker hard reset and force-update scripts
       have been removed from here to prevent automatic page reloads after login.
       If you ever need to run a hard reset again, load js/sw-hard-reset-once.js
       and js/force-sw-update.js from a dedicated maintenance page instead. -->
  
  <!-- CSS -->
  <link rel="stylesheet" href="css/main.css">
  <link rel="stylesheet" href="css/welcome-page.css">
  <link rel="stylesheet" href="css/mobile.css">
  
  <!-- iOS PWA Enhancements -->
  <script src="js/ios-pwa-enhancements.js"></script>
  
  <!-- Note: Firebase scripts removed from main page to prevent auto-authentication -->
  <!-- Firebase will be loaded only on login/dashboard pages where needed -->
</head>
<body>
  <!-- Loading Overlay -->
  <div id="loading-overlay" class="loading-overlay">
    <div class="spinner"></div>
    <p>Loading Dunamis Growth...</p>
  </div>
  
  <!-- Main Content -->
  <div class="container" id="main-content" style="display: none;">
    <!-- Hero Section with Background -->
    <section class="hero-section">
      <div class="hero-background">
        <div class="hero-overlay"></div>
        <div class="hero-content">
          <div class="logo-container">
            <img src="icons/dunamis_growth_logo.png" alt="Dunamis Growth Logo" class="hero-logo">
            <h1 class="hero-title">DUNAMIS</h1>
            <p class="hero-subtitle">GROWTH</p>
            <div class="hero-tagline">Delectable Mastery, Certified Possibility, Progressed Legacy</div>
          </div>
          
          <div class="hero-description">
            <h2>Complete Restaurant Management Solution</h2>
            <p>Transform your restaurant operations with our comprehensive platform featuring customer engagement, staff management, analytics, and reward systems.</p>
          </div>
          
          <div class="auth-buttons">
            <a href="login.html" class="btn btn-primary btn-large" id="login-btn">
              <i class="material-icons">login</i>
              Log In
            </a>
            <a href="register.html" class="btn btn-secondary btn-large" id="signup-btn">
              <i class="material-icons">person_add</i>
              Sign Up
            </a>
            <a href="#interfaces" class="btn btn-outline btn-large" id="explore-btn">
              <i class="material-icons">explore</i>
              Explore Interfaces
            </a>
          </div>
        </div>
      </div>
    </section>
    
    <!-- Vision, Mission & Ethics Section -->
    <section class="vision-mission-section" id="vision-mission">
      <h2 class="section-title">Our Purpose</h2>
      <div class="vision-mission-grid">
        <div class="vision-mission-card">
          <div class="card-icon">
            <i class="material-icons">visibility</i>
          </div>
          <h3>Vision</h3>
          <p>To restore the love, art, and meaning of food by bringing people together through honest dining experiences.</p>
        </div>
        
        <div class="vision-mission-card">
          <div class="card-icon">
            <i class="material-icons">flag</i>
          </div>
          <h3>Mission</h3>
          <p>To empower restaurants and diners with a unified platform that builds trust, consistency, and lasting connection.</p>
        </div>
        
        <div class="vision-mission-card">
          <div class="card-icon">
            <i class="material-icons">balance</i>
          </div>
          <h3>Ethics</h3>
          <p>We act with integrity, fairness, and benefaction—serving people before profit, insight before judgment, and growth over exploitation.</p>
        </div>
      </div>
    </section>
    
    <main class="main">
      <!-- Features Showcase -->
      <section class="features-showcase">
        <div class="container-inner">
          <h2 class="section-title">Powerful Features for Every Role</h2>
          <div class="features-grid">
            <div class="feature-card">
              <div class="feature-icon">
                <i class="material-icons">star_rate</i>
              </div>
              <h3>Smart Review System</h3>
              <p>Generate review codes, collect feedback, and reward loyal customers automatically</p>
            </div>
            <div class="feature-card">
              <div class="feature-icon">
                <i class="material-icons">analytics</i>
              </div>
              <h3>Real-time Analytics</h3>
              <p>Track performance, monitor trends, and make data-driven decisions</p>
            </div>
            <div class="feature-card">
              <div class="feature-icon">
                <i class="material-icons">people</i>
              </div>
              <h3>Staff Management</h3>
              <p>Manage schedules, track performance, and optimize operations</p>
            </div>
            <div class="feature-card">
              <div class="feature-icon">
                <i class="material-icons">loyalty</i>
              </div>
              <h3>Loyalty Rewards</h3>
              <p>5,000-point reward system with customizable thresholds</p>
            </div>
          </div>
        </div>
      </section>
      
      <!-- Interface Selection - Minimalistic Dropdowns -->
      <section class="interfaces" id="interfaces">
        <div class="container-inner">
          <h2 class="section-title">Choose Your Interface</h2>
          <p class="section-subtitle">Select your role to access the appropriate dashboard</p>
          
          <div class="interface-dropdowns">
            <!-- Admin Dropdown -->
            <div class="interface-dropdown admin-theme" id="admin-card">
              <div class="dropdown-header" onclick="toggleDropdown(this)">
                <div class="dropdown-left">
                  <i class="material-icons">admin_panel_settings</i>
                  <span class="dropdown-title">System Administrator</span>
                </div>
                <i class="material-icons dropdown-arrow">expand_more</i>
              </div>
              <div class="dropdown-content">
                <p>Complete system oversight, user management, communications, and configuration control</p>
                <ul>
                  <li><i class="material-icons">check</i> User Management</li>
                  <li><i class="material-icons">check</i> System Configuration</li>
                  <li><i class="material-icons">check</i> Bulk Communications</li>
                  <li><i class="material-icons">check</i> Analytics & Reports</li>
                </ul>
                <a href="admin-login.html" class="btn btn-admin">
                  <i class="material-icons">dashboard</i> Access Dashboard
                </a>
              </div>
            </div>
            
            <!-- Owner Dropdown -->
            <div class="interface-dropdown owner-theme" id="owner-card">
              <div class="dropdown-header" onclick="toggleDropdown(this)">
                <div class="dropdown-left">
                  <i class="material-icons">store</i>
                  <span class="dropdown-title">Restaurant Owner</span>
                </div>
                <i class="material-icons dropdown-arrow">expand_more</i>
              </div>
              <div class="dropdown-content">
                <p>Multi-restaurant management, staff oversight, and business analytics</p>
                <ul>
                  <li><i class="material-icons">check</i> Multi-Restaurant Control</li>
                  <li><i class="material-icons">check</i> Staff Management</li>
                  <li><i class="material-icons">check</i> Financial Overview</li>
                  <li><i class="material-icons">check</i> Performance Analytics</li>
                </ul>
                <a href="dashboards/owner_dashboard.html" class="btn btn-owner">
                  <i class="material-icons">dashboard</i> Access Dashboard
                </a>
              </div>
            </div>
            
            <!-- Manager Dropdown -->
            <div class="interface-dropdown manager-theme" id="manager-card">
              <div class="dropdown-header" onclick="toggleDropdown(this)">
                <div class="dropdown-left">
                  <i class="material-icons">supervisor_account</i>
                  <span class="dropdown-title">Restaurant Manager</span>
                </div>
                <i class="material-icons dropdown-arrow">expand_more</i>
              </div>
              <div class="dropdown-content">
                <p>Daily operations, staff scheduling, and performance monitoring</p>
                <ul>
                  <li><i class="material-icons">check</i> Staff Scheduling</li>
                  <li><i class="material-icons">check</i> Operations Management</li>
                  <li><i class="material-icons">check</i> Review Code Generation</li>
                  <li><i class="material-icons">check</i> Performance Reports</li>
                </ul>
                <a href="dashboards/manager_dashboard.html" class="btn btn-manager">
                  <i class="material-icons">dashboard</i> Access Dashboard
                </a>
              </div>
            </div>
            
            <!-- Waiter Dropdown -->
            <div class="interface-dropdown waiter-theme" id="waiter-card">
              <div class="dropdown-header" onclick="toggleDropdown(this)">
                <div class="dropdown-left">
                  <i class="material-icons">room_service</i>
                  <span class="dropdown-title">Service Staff</span>
                </div>
                <i class="material-icons dropdown-arrow">expand_more</i>
              </div>
              <div class="dropdown-content">
                <p>Table management, review code generation, and customer service</p>
                <ul>
                  <li><i class="material-icons">check</i> Table Management</li>
                  <li><i class="material-icons">check</i> Review Code Generation</li>
                  <li><i class="material-icons">check</i> Reward Validation</li>
                  <li><i class="material-icons">check</i> Shift Management</li>
                </ul>
                <a href="dashboards/waiter_dashboard.html" class="btn btn-waiter">
                  <i class="material-icons">dashboard</i> Access Dashboard
                </a>
              </div>
            </div>
            
            <!-- Customer Dropdown -->
            <div class="interface-dropdown customer-theme" id="customer-card">
              <div class="dropdown-header" onclick="toggleDropdown(this)">
                <div class="dropdown-left">
                  <i class="material-icons">person</i>
                  <span class="dropdown-title">Valued Customer</span>
                </div>
                <i class="material-icons dropdown-arrow">expand_more</i>
              </div>
              <div class="dropdown-content">
                <p>Leave reviews, earn rewards, and enjoy personalized experiences</p>
                <ul>
                  <li><i class="material-icons">check</i> Submit Reviews</li>
                  <li><i class="material-icons">check</i> Earn Reward Points</li>
                  <li><i class="material-icons">check</i> Find Restaurants</li>
                  <li><i class="material-icons">check</i> Track Rankings</li>
                </ul>
                <a href="dashboards/customer_dashboard.html" class="btn btn-customer">
                  <i class="material-icons">dashboard</i> Access Dashboard
                </a>
              </div>
            </div>
          </div>
        </div>
      </section>
      
      <section class="features">
        <h3>Key Features</h3>
        
        <div class="feature-list">
          <div class="feature-item">
            <i class="material-icons">star</i>
            <h4>Customer Reviews</h4>
            <p>Collect and manage customer feedback</p>
          </div>
          
          <div class="feature-item">
            <i class="material-icons">analytics</i>
            <h4>Performance Analytics</h4>
            <p>Track restaurant performance metrics</p>
          </div>
          
          <div class="feature-item">
            <i class="material-icons">people</i>
            <h4>Staff Management</h4>
            <p>Manage staff schedules and roles</p>
          </div>
          
          <div class="feature-item">
            <i class="material-icons">restaurant_menu</i>
            <h4>Menu Management</h4>
            <p>Create and update digital menus</p>
          </div>
          
          <div class="feature-item">
            <i class="material-icons">loyalty</i>
            <h4>Loyalty Program</h4>
            <p>Reward customers for their loyalty</p>
          </div>
          
          <div class="feature-item">
            <i class="material-icons">table_chart</i>
            <h4>Table Management</h4>
            <p>Efficiently manage restaurant seating</p>
          </div>
        </div>
      </section>
    </main>
    
    <footer class="footer">
      <div class="footer-content">
        <div class="footer-logo">
          <img src="icons/dunamis_growth_logo.png" alt="Dunamis Growth Logo" width="30" height="30">
          <span>Dunamis Growth</span>
        </div>
        
        <div class="footer-links">
          <a href="about.html">About</a>
          <a href="privacy.html">Privacy Policy</a>
          <a href="terms.html">Terms of Service</a>
          <a href="contact.html">Contact</a>
        </div>
        
        <div class="footer-copyright">
          &copy; 2025 Dunamis Growth. All rights reserved.
        </div>
      </div>
    </footer>
  </div>
  
  <!-- Interface Card Fix -->
  <script src="js/interface-card-fix.js"></script>
  
  <!-- Page-specific JavaScript -->
  <script>
    // Toggle dropdown function for interface selection
    function toggleDropdown(header) {
      const dropdown = header.closest('.interface-dropdown');
      const isOpen = dropdown.classList.contains('open');
      
      // Close all other dropdowns
      document.querySelectorAll('.interface-dropdown.open').forEach(d => {
        if (d !== dropdown) d.classList.remove('open');
      });
      
      // Toggle current dropdown
      dropdown.classList.toggle('open');
    }
    
    document.addEventListener('DOMContentLoaded', function() {
      // Show content when loaded
      setTimeout(function() {
        document.getElementById('loading-overlay').style.display = 'none';
        document.getElementById('main-content').style.display = 'block';
      }, 1000);
      
      // Simple static page - no authentication checks
      // Authentication will be handled on login page
      
      // Set up interface dropdown buttons to redirect to login, EXCEPT admin (has its own login)
      const interfaceButtons = document.querySelectorAll('.interface-dropdown .btn');
      interfaceButtons.forEach(btn => {
        // Skip admin card
        if (btn.closest('#admin-card')) return;

        const originalHref = btn.getAttribute('href');
        if (originalHref && !originalHref.includes('login.html')) {
          btn.setAttribute('href', 'login.html?redirect=' + encodeURIComponent(originalHref));
        }
      });
    });
  </script>
</body>
</html>
