{{-- v4.32.0 §F — Une carte du tableau de bord : en-tête « titre + chiffre + Voir tout », puis le corps.
     La carte prend toute la hauteur de sa case : deux cartes d'une même ligne ont la même hauteur. --}}
@props([
    'titre',
    'chiffre' => null,
    'negatif' => false,
    'lien' => null,
    'lienLibelle' => 'Voir tout',
])

<x-tableau-de-bord.style />

<section {{ $attributes->class(['fi-section', 'tdb-carte']) }}>
    <header class="tdb-tete">
        <div style="min-width: 0;">
            <h3 class="tdb-titre">{{ $titre }}</h3>
            @if ($chiffre !== null)
                <p @class(['tdb-chiffre', 'tdb-negatif' => $negatif])>{{ $chiffre }}</p>
            @endif
        </div>

        @if ($lien)
            <a href="{{ $lien }}" class="tdb-lien">{{ $lienLibelle }} →</a>
        @endif
    </header>

    <div class="tdb-corps">
        {{ $slot }}
    </div>
</section>