<template>
  <base-route-card :route="route">
    <template v-slot:main>
      <div class="flex grow justify-between max-md:flex-col md:items-center">
        <div class="flex">
          <div class="mr-12">
            <price :pricing="route.pricing" />
          </div>
        </div>
        <div class="flex max-h-full">
          <div v-if="route.status === 'pending'">
            <icon icon="vos-conditions" class="text-fire h-4 w-4"></icon>
            En attente de validation
          </div>
          <div v-else-if="route.status === 'accepted'">
            <icon icon="check" class="h-4 w-4 text-green-500" />
            Réservation validée
          </div>
        </div>
      </div>
    </template>
    <template v-slot:footer> </template>
  </base-route-card>
</template>
<script setup>
defineProps({
  route: {
    type: Object,
    required: true,
  },
});
</script>
