<template>
  <div class="min-h-dvh bg-default text-default">
    <header class="border-b border-default bg-default">
      <UContainer class="flex items-center justify-between gap-4 py-6">
        <UBadge
          label="Event Ticket System"
          color="neutral"
          variant="soft"
          class="rounded-full px-3 py-1 font-semibold"
        />

        <UButton
          id="loginBtn"
          :to="route.path.startsWith('/login') ? '/' : '/login'"
          :label="route.path.startsWith('/login') ? 'Back' : 'Login'"
          color="neutral"
          :variant="route.path.startsWith('/login') ? 'outline' : 'solid'"
          :icon="route.path.startsWith('/login') ? 'i-lucide-arrow-left' : 'i-lucide-lock-keyhole'"
        />
      </UContainer>
    </header>

    <UMain>
      <slot />
    </UMain>

    <footer class="border-t border-default bg-default">
      <UContainer class="py-5 text-center text-sm text-muted">
        © 2026 DAP 60th Anniversary Committee. All rights reserved.
      </UContainer>
    </footer>
  </div>
</template>

<script lang="ts" setup>
const route = useRoute()
</script>
