<template>
  <footer class="bg-white border-t border-gray-200 mt-auto">
    <div class="container mx-auto px-4 py-6 max-w-7xl">
      <div class="flex flex-col md:flex-row items-center justify-between gap-4">
        <!-- Copyright -->
        <p class="text-sm text-gray-600">
          © {{ currentYear }} Pantry. Self-hosted inventory management.
        </p>

        <!-- Links -->
        <div class="flex items-center space-x-6">
          <a 
            href="https://github.com/pantry-app/pantry" 
            target="_blank" 
            rel="noopener noreferrer"
            class="text-sm text-gray-600 hover:text-primary transition-colors"
          >
            GitHub
          </a>
          <NuxtLink 
            to="/about" 
            class="text-sm text-gray-600 hover:text-primary transition-colors"
          >
            About
          </NuxtLink>
          <NuxtLink 
            to="/privacy" 
            class="text-sm text-gray-600 hover:text-primary transition-colors"
          >
            Privacy
          </NuxtLink>
        </div>
      </div>
    </div>
  </footer>
</template>

<script setup lang="ts">
const currentYear = new Date().getFullYear()
</script>
