@php
    $navPages = $navPages ?? collect();
    $cur = '/' . ltrim(request()->path() === '/' ? '' : request()->path(), '/');
    $opts = (array) ($site->options ?? []);
    $ctaLabel = $opts['cta_label'] ?? 'Book appointment';
    $ctaUrl   = $opts['cta_url'] ?? '#contact';
    $showPortal = ($opts['show_portal_link'] ?? '1') !== '0';
@endphp
<header class="vs-header" :class="{ 'is-scrolled': scrolled }">
    <div class="vs-container vs-header-in">
        <a href="/" class="vs-logo">
            @if($site->logoUrl())
                <img src="{{ $site->logoUrl() }}" alt="{{ $site->name }}">
            @else
                <span class="vs-logo-mark"><i class="fas fa-stethoscope"></i></span>
            @endif
            <span class="vs-logo-text">{{ $site->name ?: 'Our Clinic' }}</span>
        </a>

        <nav class="vs-nav" aria-label="Primary">
            @foreach($navPages as $p)
                @php($href = $p->is_home ? '/' : '/' . $p->slug)
                <a href="{{ $href }}" class="{{ $cur === $href ? 'is-active' : '' }}">{{ $p->title }}</a>
            @endforeach
            @if($showPortal)
                <a href="/portal" class="vs-nav-portal">Client Portal</a>
            @endif
            <a href="{{ $ctaUrl }}" class="vs-btn vs-btn-primary vs-nav-cta">{{ $ctaLabel }}</a>
        </nav>

        <button class="vs-burger" @click="menu = true" aria-label="Open menu"><i class="fas fa-bars"></i></button>
    </div>

    {{-- Mobile drawer --}}
    <div class="vs-drawer" :class="{ 'is-open': menu }" x-cloak>
        <div class="vs-drawer-overlay" @click="menu = false"></div>
        <div class="vs-drawer-panel">
            <button class="vs-drawer-close" @click="menu = false" aria-label="Close menu"><i class="fas fa-times"></i></button>
            <nav>
                @foreach($navPages as $p)
                    @php($href = $p->is_home ? '/' : '/' . $p->slug)
                    <a href="{{ $href }}" @click="menu=false">{{ $p->title }}</a>
                @endforeach
                @if($showPortal)<a href="/portal" @click="menu=false">Client Portal</a>@endif
                <a href="{{ $ctaUrl }}" class="vs-btn vs-btn-primary" @click="menu=false" style="margin-top:12px">{{ $ctaLabel }}</a>
            </nav>
        </div>
    </div>
</header>
