<template>
  <div class="pr-4 font-medium md:pr-12">
    <div class="flex flex-row items-center justify-center">
      <nuxt-link
        :to="{ name: 'search' }"
        class="flex h-10 items-center gap-1 px-3 text-primary-500 md:h-20"
      >
        <span class="sr-only md:not-sr-only">
          {{ $texts('header.search', 'Suche') }}
        </span>
        <SpriteSymbol name="magnifyingglass" class="size-5" />
      </nuxt-link>
    </div>
  </div>
</template>

<script lang="ts" setup>
const { $texts } = useNuxtApp()
</script>
