<template>
  <div
    class="bg-bg-light dark:bg-bg-dark text-text-light dark:text-text-dark font-inter flex min-h-screen flex-col overflow-hidden"
  >
    <HeaderBlock />
    <!-- <ImageBlock>
    <div
        class="hidden sm:block absolute bottom-0 right-0 pt-2 pl-2 bg-bg-light dark:bg-bg-dark rounded-tl-2xl"
      >
        <UiButtonArrow>Title</UiButtonArrow>
      </div>
    </ImageBlock> -->
    <div class="flex-1 py-[25px] sm:py-[55px] md:py-[75px]">
      <slot />
    </div>
    <FooterBlock />
  </div>
</template>

<script setup lang="ts">
useHead({
  link: [{ rel: "icon", type: "image/x-icon", href: "/favicon.png" }],
});
</script>
