@php
    $back = trim($__env->yieldContent('back', ''));
    $activeProjectsCount = \App\Models\Project::count();
    \App\Services\SystemSettingService::ensureDefaults();
    $__companyName = \App\Services\SystemSettingService::get('company', 'company_name', 'Dach Construction Ltd');
    $__authUser = auth()->user();
@endphp
<header class="topbar px-4 sm:px-6 lg:px-7 py-3 sm:py-3.5 flex flex-wrap items-center gap-y-2 justify-between sticky top-0 z-30">
  <div class="flex items-center gap-2 sm:gap-3 min-w-0 flex-1 xl:flex-initial">
    <button type="button" id="sidebar-toggle-mobile" class="xl:hidden inline-flex items-center justify-center w-10 h-10 rounded-lg bg-slate-100 text-slate-700 hover:bg-slate-200 shrink-0 relative z-[1060] shadow-sm border border-slate-200/80" aria-label="Open menu" aria-expanded="false">
      <i class="fa-solid fa-bars text-sm"></i>
    </button>
    @if($back)
      <a href="{{ $back }}" id="bbtn" class="inline-flex items-center justify-center shrink-0" style="width:32px;height:32px;background:#f1f5f9;border:none;border-radius:8px;cursor:pointer;color:#64748b;font-size:12px;text-decoration:none"><i class="fa-solid fa-arrow-left"></i></a>
    @endif
    <h2 id="ptitle" class="text-[15px] sm:text-[17px] font-bold text-slate-900 truncate min-w-0">@yield('title', 'Dach CMS')</h2>
    <span class="hidden sm:inline-flex items-center gap-1.5 px-2.5 py-1 bg-emerald-50 text-emerald-700 text-[10px] font-bold rounded-full border border-emerald-100 shrink-0"><span class="w-1.5 h-1.5 bg-emerald-500 rounded-full animate-pulse"></span>Live</span>
  </div>
  <div class="flex items-center gap-2 sm:gap-3 w-full sm:w-auto justify-end sm:justify-start flex-wrap sm:flex-nowrap">
    @isset($branchContext, $branchesForSwitcher)
      @if($branchesForSwitcher->count() > 1 || \App\Models\User::roleIsElevated(auth()->user()?->role))
        <form method="post" action="{{ route('branch.context') }}" class="flex items-center gap-1.5 shrink-0" id="branch-switch-form">
          @csrf
          <label class="text-[10px] font-bold text-slate-400 uppercase tracking-wider sr-only sm:not-sr-only sm:inline">Branch</label>
          <select name="branch_id" class="fi py-2 text-[12px] min-w-[120px] max-w-[200px]" onchange="this.form.submit()">
            @if(\App\Models\User::roleIsElevated(auth()->user()?->role))
              <option value="all" @selected($branchContext->viewAll)>All branches</option>
            @endif
            @foreach($branchesForSwitcher as $br)
              <option value="{{ $br->id }}" @selected(! $branchContext->viewAll && (int) $branchContext->branchId === (int) $br->id)>{{ $br->name }}</option>
            @endforeach
          </select>
        </form>
      @elseif($branchesForSwitcher->isNotEmpty())
        <span class="text-[11px] text-slate-500 font-medium truncate max-w-[140px] hidden sm:inline" title="{{ $branchesForSwitcher->first()->name }}">{{ $branchesForSwitcher->first()->name }}</span>
      @endif
    @endisset
    <div class="relative flex-1 sm:flex-initial min-w-0 max-w-full sm:max-w-[200px] lg:max-w-none">
      <i class="fa-solid fa-magnifying-glass absolute left-3 top-1/2 -translate-y-1/2 text-slate-400 text-xs pointer-events-none"></i>
      <input placeholder="Search..." class="bg-white border border-slate-200 w-full sm:w-48 lg:w-48 pl-9 pr-3 py-2 rounded-xl text-[13px] text-slate-700 outline-none focus:border-blue-300 transition-colors">
    </div>
    <div class="text-right hidden md:block shrink-0">
      <p class="font-semibold text-slate-800 text-[13px] leading-tight">{{ $__companyName }}</p>
      <p class="text-[11px] text-slate-400">{{ $activeProjectsCount }} Active Projects</p>
      @if($__authUser)
        <a href="{{ route('profile.show') }}" class="text-[11px] text-blue-600 font-semibold hover:underline no-underline">{{ $__authUser->name }}</a>
      @endif
    </div>
  </div>
</header>