<template>
  <div class="w-full min-h-screen flex flex-col items-center bg-gray-50">
    <!-- Header avec logo -->
    <header class="w-full py-4 px-6 bg-white shadow-sm">
      <div class="max-w-7xl mx-auto w-full flex justify-center">
        <div @click="navigateToHome" class="cursor-pointer inline-block">
          <logo />
        </div>
      </div>
    </header>

    <!-- Contenu principal -->
    <main class="w-full max-w-7xl flex-1 p-6">
      <slot />
    </main>

    <!-- Player de musique fixe en bas -->
    <SearchModal />
    <Loader />
    <Player class="w-full border-t border-gray-200" />
  </div>
</template>

<script setup>
import { useRouter } from 'vue-router'

const router = useRouter()

const navigateToHome = () => {
  router.push('/')
}
</script>
