<template>
  <div class="tw-p-[40px] tw-bg-neutrals-100 tw-rounded-[20px]">
    <div class="tw-flex tw-justify-between tw-items-center tw-mb-[20px]">
      <h4 class="t24 tw-text-primary-1">${{ totalPrice }} {{ currency }}</h4>
      <like></like>
    </div>
    <div class="tw-body-4 tw-text-neutral-500 tw-mb-[10px]">
      {{ confirmationTime }}<!-- {{ confirmationTime }}{{ $t('-hours confirmation') }} -->
    </div>
    <!-- <div class="tw-body-4 tw-text-neutral-500">
      {{ $t("Use code APP5OFF for 10% off") }}
    </div> -->
    <a class="tw-transition tw-flex tw-justify-center tw-items-center tw-btn-md tw-text-white tw-bg-primary-1 tw-px-[16px] tw-py-[10px] tw-mr-[20px] tw-mt-[22px] tw-rounded-xl tw-w-full"
      href="#" v-scroll-to="{
        el: '#packageOptions',
        offset: -150,
      }">
      {{ $t("Select Options") }}
    </a>
  </div>
</template>
<script>
import like from "@/components/newComponent/like/like.vue";
export default {
  props: {
    totalPrice: {
      type: String,
    },
    currency: {
      type: String
    },
    confirmationTime: {
      type: String
    },
  },
  components: {
    like,
  },
};
</script>
<style lang="scss" scoped>

</style>
