<script setup lang="ts">
// En-tête de la colonne gauche : logo « Portfolios » + déconnexion (petite icône
// à droite). Header à part entière (fond + filet bas), commun index/éditeur.
async function logout() {
  await $fetch('/api/auth/logout', { method: 'POST' })
  navigateTo('/login')
}
</script>

<template>
  <div class="flex h-14 items-center justify-between gap-2 border-b border-neutral-200 bg-white px-4 dark:border-neutral-800 dark:bg-neutral-900">
    <NuxtLink to="/" class="font-bold text-[var(--fl-ink)] hover:opacity-80 dark:text-white">
      Portfolios
    </NuxtLink>
    <UTooltip text="Déconnexion">
      <UButton
        icon="i-lucide-log-out"
        size="xs"
        variant="ghost"
        color="neutral"
        aria-label="Se déconnecter"
        @click="logout"
      />
    </UTooltip>
  </div>
</template>
