<?php
/**
 * Header Layout — Gmind Institute
 *
 * Included by all pages. Contains HTML head, top bar, and main navigation.
 * All URLs use the url()/asset() helpers for subdirectory support.
 *
 * Expected PHP variables:
 *   $title      (optional) — Page title; defaults to "Gmind Institute"
 *   $csrfToken  (optional) — CSRF token from session for JS access
 *   $currentPage (optional) — Current page identifier for active nav highlighting
 */

$pageTitle    = $title ?? 'Gmind Institute';
$csrf         = $csrfToken ?? '';
$current      = $currentPage ?? '';
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="Gmind Institute — Leading computer education institute offering professional IT courses, online exams, and career-oriented training across India.">
    <meta name="keywords" content="Gmind Institute, computer courses, IT training, online exam, computer education, franchise, admission, programming, web development, Tally, MS-CIT">

    <title><?= htmlspecialchars($pageTitle, ENT_QUOTES, 'UTF-8') ?></title>

    <!-- Favicon -->
    <link rel="icon" type="image/png" href="<?= asset('/images/favicon.png') ?>">
    <link rel="shortcut icon" type="image/png" href="<?= asset('/images/favicon.png') ?>">

    <!-- Google Fonts: Poppins (600,700) + Inter (400,500) -->
    <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=Inter:wght@400;500&family=Poppins:wght@600;700&display=swap" rel="stylesheet">

    <!-- Main Stylesheet -->
    <link rel="stylesheet" href="<?= asset('/css/style.css') ?>">

    <!-- Inner Pages Stylesheet -->
    <link rel="stylesheet" href="<?= asset('/css/inner-pages.css') ?>">

    <!-- Open Graph Meta Tags -->
    <meta property="og:title" content="<?= htmlspecialchars($pageTitle, ENT_QUOTES, 'UTF-8') ?>">
    <meta property="og:description" content="Gmind Institute — Leading computer education institute offering professional IT courses, online exams, and career-oriented training across India.">
    <meta property="og:type" content="website">
    <meta property="og:url" content="<?= htmlspecialchars((isset($_SERVER['HTTPS']) && $_SERVER['HTTPS'] === 'on' ? 'https' : 'http') . '://' . ($_SERVER['HTTP_HOST'] ?? 'advaysingh.co.in') . ($_SERVER['REQUEST_URI'] ?? '/'), ENT_QUOTES, 'UTF-8') ?>">
    <meta property="og:site_name" content="Gmind Institute">
    <meta property="og:image" content="<?= asset('/images/og-image.png') ?>">
    <meta property="og:locale" content="en_IN">

    <!-- CSRF Token for JavaScript Access -->
    <?php if ($csrf): ?>
    <meta name="csrf-token" content="<?= htmlspecialchars($csrf, ENT_QUOTES, 'UTF-8') ?>">
    <?php endif; ?>
</head>
<body>

    <!-- ============================================================
         Top Bar — Deep navy background with contact info & socials
         ============================================================ -->
    <div class="top-bar" role="complementary" aria-label="Contact and social links">
        <div class="container top-bar-inner">
            <div class="top-bar-left">
                <span>
                    <!-- Phone SVG Icon -->
                    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M22 16.92v3a2 2 0 01-2.18 2 19.79 19.79 0 01-8.63-3.07 19.5 19.5 0 01-6-6 19.79 19.79 0 01-3.07-8.67A2 2 0 014.11 2h3a2 2 0 012 1.72c.127.96.361 1.903.7 2.81a2 2 0 01-.45 2.11L8.09 9.91a16 16 0 006 6l1.27-1.27a2 2 0 012.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0122 16.92z"/></svg>
                    <span class="label">Call:</span>
                    <a href="tel:9305640290">9305640290</a>
                </span>
                <span>
                    <!-- Email SVG Icon -->
                    <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/><polyline points="22,6 12,13 2,6"/></svg>
                    <span class="label">Email:</span>
                    <a href="mailto:info@gmind.in">info@gmind.in</a>
                </span>
            </div>

            <div class="top-bar-right">
                <!-- Social Icons -->
                <div class="top-bar-social" aria-label="Social media links">
                    <!-- Facebook -->
                    <a href="https://facebook.com/gmindinstitute" target="_blank" rel="noopener noreferrer" class="social-icon" aria-label="Follow us on Facebook">
                        <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M18 2h-3a5 5 0 00-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 011-1h3z"/></svg>
                    </a>
                    <!-- Twitter / X -->
                    <a href="https://twitter.com/gmindinstitute" target="_blank" rel="noopener noreferrer" class="social-icon" aria-label="Follow us on Twitter">
                        <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg>
                    </a>
                    <!-- YouTube -->
                    <a href="https://youtube.com/@gmindinstitute" target="_blank" rel="noopener noreferrer" class="social-icon" aria-label="Subscribe on YouTube">
                        <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M23.498 6.186a3.016 3.016 0 00-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 00.502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 002.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 002.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z"/></svg>
                    </a>
                    <!-- Instagram -->
                    <a href="https://instagram.com/gmindinstitute" target="_blank" rel="noopener noreferrer" class="social-icon" aria-label="Follow us on Instagram">
                        <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zM12 0C8.741 0 8.333.014 7.053.072 2.695.272.273 2.69.073 7.052.014 8.333 0 8.741 0 12c0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98C8.333 23.986 8.741 24 12 24c3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98C15.668.014 15.259 0 12 0zm0 5.838a6.162 6.162 0 100 12.324 6.162 6.162 0 000-12.324zM12 16a4 4 0 110-8 4 4 0 010 8zm6.406-11.845a1.44 1.44 0 100 2.881 1.44 1.44 0 000-2.881z"/></svg>
                    </a>
                </div>

                <div class="top-bar-divider" aria-hidden="true"></div>

                <!-- Login Links -->
                <a href="<?= url('/login') ?>" class="login-link">Student Login</a>
                <a href="<?= url('/admin') ?>" class="login-link">Admin Login</a>
            </div>
        </div>
    </div>

    <!-- ============================================================
         Main Navigation — Sticky white header with logo & nav links
         ============================================================ -->
    <header class="main-nav main-header" role="banner">
        <div class="container header-inner">
            <!-- Logo -->
            <a href="<?= url('/') ?>" class="nav-logo logo" aria-label="Gmind Institute — Home">
                <img src="<?= asset('/images/logo.png') ?>" alt="Gmind Institute Logo" width="40" height="40" loading="eager">
                <span>
                    <span class="logo-text">GMIND</span>
                    <span class="logo-subtext">INSTITUTE</span>
                </span>
            </a>

            <!-- Mobile Hamburger Toggle (Checkbox Hack) -->
            <input type="checkbox" id="nav-toggle" class="nav-toggle" aria-label="Toggle navigation menu" role="switch" aria-expanded="false">
            <label for="nav-toggle" class="nav-toggle-label" aria-label="Open navigation menu">
                <span></span>
            </label>

            <!-- Navigation Links -->
            <nav class="nav-links mobile-nav" role="navigation" aria-label="Main navigation">
                <a href="<?= url('/') ?>" class="nav-link<?= $current === 'home' ? ' active' : '' ?>" aria-current="<?= $current === 'home' ? 'page' : 'false' ?>">Home</a>
                <a href="<?= url('/about') ?>" class="nav-link<?= $current === 'about' ? ' active' : '' ?>" aria-current="<?= $current === 'about' ? 'page' : 'false' ?>">About Us</a>
                <a href="<?= url('/courses') ?>" class="nav-link<?= $current === 'courses' ? ' active' : '' ?>" aria-current="<?= $current === 'courses' ? 'page' : 'false' ?>">Courses</a>
                <a href="<?= url('/exam') ?>" class="nav-link<?= $current === 'online-exam' ? ' active' : '' ?>" aria-current="<?= $current === 'online-exam' ? 'page' : 'false' ?>">Online Exam</a>
                <a href="<?= url('/admission') ?>" class="nav-link<?= $current === 'admission' ? ' active' : '' ?>" aria-current="<?= $current === 'admission' ? 'page' : 'false' ?>">Admission</a>
                <a href="<?= url('/franchisee') ?>" class="nav-link<?= $current === 'franchisee' ? ' active' : '' ?>" aria-current="<?= $current === 'franchisee' ? 'page' : 'false' ?>">Franchisee</a>
                <a href="<?= url('/blog') ?>" class="nav-link<?= $current === 'blog' ? ' active' : '' ?>" aria-current="<?= $current === 'blog' ? 'page' : 'false' ?>">Blog</a>
                <a href="<?= url('/news') ?>" class="nav-link<?= $current === 'news' ? ' active' : '' ?>" aria-current="<?= $current === 'news' ? 'page' : 'false' ?>">News</a>
                <a href="<?= url('/faq') ?>" class="nav-link<?= $current === 'faq' ? ' active' : '' ?>" aria-current="<?= $current === 'faq' ? 'page' : 'false' ?>">FAQ</a>
                <a href="<?= url('/contact') ?>" class="nav-link<?= $current === 'contact' ? ' active' : '' ?>" aria-current="<?= $current === 'contact' ? 'page' : 'false' ?>">Contact Us</a>
            </nav>

            <!-- Apply Now CTA -->
            <div class="nav-cta">
                <a href="<?= url('/admission') ?>" class="btn-apply">Apply Now</a>
            </div>
        </div>
    </header>
