<template>
  <div class="page">
    <div class="pageSectionTop">
      <NavBar />
    </div>
    <div class="pageSectionLeft">
      <SideBar />
    </div>
    <div class="pageSectionMain">
      <div class="content-wrapper mt-70px">
        <!-- Content -->
        <div class="container-fluid flex-grow-1 container-p-y">
          <div class="card">
            <TabBar />
            <div class="cardBody">
              <div class="container-fluid container-p-y">
                <slot />
              </div>
            </div>
          </div>
        </div>
        <!-- / Content -->
        <!-- Footer -->
        <FooterSection />
        <!-- / Footer -->
        <div class="content-backdrop fade"></div>
      </div>
    </div>
  </div>
</template>

<style scoped>
@use page {
  layout: topLeft;
}
</style>