@php
    $status = $urgency == 'Très élevé' ? 'danger' : 'warning';
@endphp
<a href="{{ route('fleet.service.create', ['vehicleId' => $vehicle->id]) }}">
<div class="alert border border-{{ $status }}">
    <div class="d-flex justify-content-between align-items-center">
        <div class="d-flex justify-content-between">
            <div class="mt-2">
                <svg width="13" height="13" viewBox="0 0 13 13" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <path d="M6.50004 11.9154C9.49158 11.9154 11.9167 9.49024 11.9167 6.4987C11.9167 3.50716 9.49158 1.08203 6.50004 1.08203C3.5085 1.08203 1.08337 3.50716 1.08337 6.4987C1.08337 9.49024 3.5085 11.9154 6.50004 11.9154Z" stroke="#F2415A" stroke-width="1.5"/>
                    <path d="M6.5 9.20703V5.95703" stroke="#F2415A" stroke-width="1.5" stroke-linecap="round"/>
                    <path d="M6.50004 3.79167C6.79919 3.79167 7.04171 4.03418 7.04171 4.33333C7.04171 4.63249 6.79919 4.875 6.50004 4.875C6.20089 4.875 5.95837 4.63249 5.95837 4.33333C5.95837 4.03418 6.20089 3.79167 6.50004 3.79167Z" fill="#F2415A"/>
                </svg>    
            </div>
            &nbsp; &nbsp;
            <div>
                <p class="h5 mb-0">{{ $title }}</p>
                <small>{{ $description }}</small>
            </div>
        </div>
        <span>
            @if ($status === 'danger')
                <svg width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <circle cx="5" cy="5" r="5" fill="#F2415A" />
                </svg>                
            @else
                <svg width="10" height="11" viewBox="0 0 10 11" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <circle cx="5" cy="5.5" r="5" fill="#FFBF0F"/>
                </svg>
            @endif
            Urgence &nbsp; &nbsp;
            <button type="button" class="btn btn-outline-{{ $status }} rounded-pill btn-sm">{{ $urgency }}</button>
        </span>
    </div>
</div>
</a>