<template>
  <button
    class="btn bg-gradient-primary mb-0"
    type="button"
    @click="$emit('click')"
  >
    <i class="fas fa-plus me-2"></i>
    {{ text }}
  </button>
</template>

<script setup>
import { defineProps, defineEmits } from "vue";
defineProps({
  text: {
    type: String,
    default: "Nouvelle Intervention",
  },
});

defineEmits(["click"]);
</script>

<style scoped>
.btn {
  font-weight: 600;
  font-size: 0.875rem;
  padding: 0.625rem 1.25rem;
  border-radius: 0.5rem;
  transition: all 0.15s ease-in;
}

.btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 7px 14px rgba(50, 50, 93, 0.1), 0 3px 6px rgba(0, 0, 0, 0.08);
}
</style>
