<template>
  <div class="flex items-center flex-col pb-[30vw] md:pb-[7vw]">
    <product-page-course-detailsHeader :props="props"/>
    <div
      class="flex flex-col flex-col-reverse md:flex-row justify-between w-[87.69%] md:w-[81.04%] mt-[10vw] md:mt-[4.7vw]"
    >
      <div
        class="w-full md:w-[56.354vw] text-[#383E43] text-[3.59vw] md:text-[1.055vw] leading-[5.897vw] md:leading-[1.582vw]"
      >
        <product-page-course-detailsDescription />
        <product-page-course-detailsHeadlines />
        <product-page-course-detailsComments />
      </div>
      <div class="w-full md:w-[23.438vw] text-[#383E43]">
        <product-page-course-detailsCourse-status />
        <product-page-course-detailsCourse-information />
      </div>
    </div>
  </div>
</template>


<script setup>
const props = defineProps(['slug'])

</script>