<template>
  <div class="flex min-h-screen bg-gray-100 text-gray-900">
    <!-- Sidebar and Navbar only for authenticated & non-public routes -->
    <Sidebar v-if="!isPublicPage" />
    
    <div v-if="!isPublicPage" class="flex flex-col flex-1 ml-64">
      <Navbar />
      <main class="p-6">
        <NuxtPage />
      </main>
    </div>

    <!-- Auth pages like SignIn or SignUp show full page -->
    <div v-else class="w-full">
      <NuxtPage />
    </div>
  </div>
</template>

<script setup>
import { useRoute } from 'vue-router'
import { computed } from 'vue'
import Sidebar from '~/app/components/Sidebar.vue'
import Navbar from '~/app/components/Navbar.vue'

const route = useRoute()
const publicRoutes = ['/', '/SignIn', '/SignUp'] // Add more if needed

const isPublicPage = computed(() => publicRoutes.includes(route.path))
</script>
