<template>
  <v-row v-if="participantHelpText || guardianHelpText" class="mb-2">
    <v-col
      v-if="participantHelpText"
      cols="12"
      :md="guardianHelpText ? '6' : '12'"
    >
      <v-card>
        <v-card-title>
          {{ $t("paweljong.event_registration.form.help_text.participant") }}
        </v-card-title>
        <v-card-text>{{ participantHelpText }}</v-card-text>
      </v-card>
    </v-col>
    <v-col
      v-if="guardianHelpText"
      cols="12"
      :md="participantHelpText ? '6' : '12'"
    >
      <v-card>
        <v-card-title>
          {{ $t("paweljong.event_registration.form.help_text.guardian") }}
        </v-card-title>
        <v-card-text>{{ guardianHelpText }}</v-card-text>
      </v-card>
    </v-col>
  </v-row>
</template>

<script>
export default {
  name: "EventRegistrationHelpTextCards",
  props: {
    participantHelpText: {
      type: String,
      required: false,
      default: "",
    },
    guardianHelpText: {
      type: String,
      required: false,
      default: "",
    },
  },
};
</script>