<script setup lang="ts">
const $q = useQuasar()

// บังคับให้หน้า Landing Page เคลียร์ Dark Mode ของระบบทิ้ง
useHead({
  htmlAttrs: {
    class: 'light',
    style: 'background-color: #ffffff'
  },
  bodyAttrs: {
    class: 'light',
    style: 'background-color: #ffffff'
  }
})

onMounted(() => {
  $q.dark.set(false)
})
</script>


<template>
  <q-layout view="lHh LpR lFf" class="bg-white text-slate-900 font-inter">

    
    <!-- Header (Transparent & Overlay) -->
    <q-header class="bg-transparent" style="height: auto;">
      <LandingHeader />
    </q-header>

    <!-- Main Content -->
    <!-- padding-top: 0 forces content to go under the header (Hero effect) -->
    <q-page-container style="padding-top: 0 !important;">
      <q-page>
        <slot />
      </q-page>
    </q-page-container>


  </q-layout>
</template>

<style>
.font-inter {
  font-family: 'Inter', sans-serif;
}
</style>
