<script setup lang="ts">
/**
 * @file dashboard-index.vue
 * @description Layout for the Dashboard Index page, without the sidebar.
 * Uses Quasar QLayout for responsive structure.
 */

// Initialize global theme management
useThemeMode()

// No sidebar logic needed here as we are removing it
</script>

<template>
  <q-layout view="hHh lpR fFf" class="bg-slate-50 dark:!bg-[#020617] text-slate-900 dark:!text-slate-50">
    <!-- Header -->
    <q-header
      class="bg-white/80 dark:!bg-[#0f172a]/80 backdrop-blur-md text-slate-900 dark:!text-white"
    >
      <AppHeader :showSidebarToggle="false" navType="learner" />
    </q-header>

    <!-- Sidebar Removed for this layout -->

    <!-- Main Content -->
    <q-page-container>
      <q-page class="relative">
        <slot />
      </q-page>
    </q-page-container>

    <!-- Mobile Bottom Nav - Optional, keeping it consistent with default but maybe not needed if full width?
         If we remove sidebar, we might still want mobile nav if it's main navigation.
         Let's keep it for now as it doesn't hurt. -->
    <q-footer
      v-if="$q.screen.lt.md"
      class="!bg-white dark:!bg-[#1e293b] text-primary"
    >
       <MobileNav />
    </q-footer>
  </q-layout>
</template>

<style>
/* Ensure fonts are applied */
.font-inter {
  font-family: var(--font-main);
}
</style>
