<template lang="pug">
  .flex.flex-col.mb-1.mt-4
    span.font-medium.text-base.modal-text {{ bodyText }}
    .flex.gap-x-3.mt-6
      q-btn(
        label="Отменить",
        no-caps,
        outline,
        color="primary",
        padding="10px 24px",
        @click="closeModal"
      )
      q-btn(
        :label="confirmTitle",
        no-caps,
        outline,
        style="color: var(--border-red-color)",
        padding="10px 24px",
        @click="clickConfirm"
      )
</template>

<script>
export default {
  name: "ClientTableModal",
  props: {
    confirmTitle: String,
    bodyText: String,
    closeModal: Function,
    clickConfirm: Function,
  },
};
</script>

<style lang="sass" scoped>
.modal-text
  color: var(--font-grey-color)

.card-container
  width: 420px
  height: 194px
  border-radius: 4px
  border: 1px solid var(--border-light-grey-color-1)
</style>
