<script setup lang="ts">
const { t } = useI18n()
</script>

<template>
  <div class="container mx-auto px-4 py-6">
    <h1 class="mb-2 text-2xl font-bold text-foreground">Settings</h1>
    <p class="text-muted-foreground">Manage your app preferences</p>

    <!-- Settings content will go here -->
    <div class="mt-6 space-y-2">
      <div class="rounded-lg border border-border bg-card">
        <button class="flex w-full items-center justify-between p-4 text-left transition-colors hover:bg-accent">
          <span class="font-medium text-foreground">Language</span>
          <span class="text-sm text-muted-foreground">English</span>
        </button>
      </div>
      <div class="rounded-lg border border-border bg-card">
        <button class="flex w-full items-center justify-between p-4 text-left transition-colors hover:bg-accent">
          <span class="font-medium text-foreground">Currency</span>
          <span class="text-sm text-muted-foreground">USD</span>
        </button>
      </div>
    </div>
  </div>
</template>

