<?php
  $user = auth()->user();
?>

<div class="lg:hidden flex h-14 items-center justify-between border-b border-gray-100 bg-white px-4">
  <div class="flex items-center gap-2">
    <div class="flex h-8 w-8 items-center justify-center rounded-lg bg-[#4f6ef7]">
      <span class="text-xs font-bold text-white">IA</span>
    </div>
    <span class="text-sm font-semibold">InspectAI</span>
  </div>
  <button onclick="openMobileSidebar()" class="p-2 rounded-lg hover:bg-gray-100">
    <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="3" y1="12" x2="21" y2="12"/><line x1="3" y1="6" x2="21" y2="6"/><line x1="3" y1="18" x2="21" y2="18"/></svg>
  </button>
</div>

<header class="sticky top-0 z-30 flex h-16 items-center justify-between border-b border-gray-100 bg-white/80 backdrop-blur-md px-6">
  <div class="relative w-full max-w-md">
    <svg xmlns="http://www.w3.org/2000/svg" class="absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-gray-400" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>
    <input type="text" placeholder="<?php echo e(__('Search inspections, reports, properties...')); ?>" class="h-9 w-full rounded-xl border border-gray-200 bg-gray-50 pl-9 pr-4 text-sm placeholder:text-gray-400 focus:outline-none focus:ring-2 focus:ring-[#4f6ef7]/20 focus:border-[#4f6ef7] focus:bg-white transition-all">
  </div>
  <div class="flex items-center gap-2 ml-4">
    <div class="hidden sm:flex items-center rounded-xl border border-gray-200 bg-gray-50 p-1">
      <a href="<?php echo e(route('locale.switch', 'en')); ?>" class="rounded-lg px-2 py-1 text-xs font-semibold <?php echo e(app()->getLocale() === 'en' ? 'bg-white text-[#4f6ef7] shadow-sm' : 'text-gray-400 hover:text-gray-700'); ?>">EN</a>
      <a href="<?php echo e(route('locale.switch', 'id')); ?>" class="rounded-lg px-2 py-1 text-xs font-semibold <?php echo e(app()->getLocale() === 'id' ? 'bg-white text-[#4f6ef7] shadow-sm' : 'text-gray-400 hover:text-gray-700'); ?>">ID</a>
    </div>
    <button type="button" onclick="toggleTheme()" class="hidden sm:flex h-9 items-center gap-2 rounded-xl border border-gray-200 bg-gray-50 px-3 text-xs font-semibold text-gray-500 hover:bg-white hover:text-[#4f6ef7]">
      <span data-theme-label><?php echo e(__('Dark')); ?></span>
    </button>
    <button class="relative h-9 w-9 rounded-xl flex items-center justify-center text-gray-500 hover:bg-gray-100 hover:text-gray-900 transition-colors">
      <svg xmlns="http://www.w3.org/2000/svg" class="h-[18px] w-[18px]" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"/><path d="M13.73 21a2 2 0 0 1-3.46 0"/></svg>
      <span class="absolute right-1.5 top-1.5 h-2 w-2 rounded-full bg-[#4f6ef7]"></span>
    </button>
    <div class="ml-2 flex items-center gap-3 rounded-xl border border-gray-200 px-3 py-1.5 hover:bg-gray-50 cursor-pointer transition-colors">
      <div class="h-7 w-7 rounded-full bg-[#eff3fe] flex items-center justify-center text-xs font-semibold text-[#4f6ef7]">
        <?php echo e(Str::of($user->name)->substr(0, 1)->upper()); ?>

      </div>
      <div class="hidden sm:flex flex-col">
        <span class="text-sm font-medium leading-tight"><?php echo e($user->name); ?></span>
        <span class="text-[11px] text-gray-400"><?php echo e($user->role); ?></span>
      </div>
      <span class="hidden md:inline text-[10px] font-medium bg-gray-100 text-gray-600 px-1.5 py-0.5 rounded-md">Pro</span>
    </div>
  </div>
</header>
<?php /**PATH C:\Users\ariqa\Documents\matkul\smster 4\data sains\prj\homeinspector\resources\views/partials/header.blade.php ENDPATH**/ ?>