.leave-counters-section {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid #eee;
}

.counters-grid {
    display: flex; /* Utilise flexbox pour aligner les compteurs */
    justify-content: space-around; /* Espace les éléments uniformément */
    align-items: flex-end; /* Aligne les éléments en bas (pour "Période en cours") */
    gap: 20px; /* Espace entre les compteurs */
}

.counter-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #f0f0f0; 
    padding: 15px 25px;
    border-radius: 10px;
    min-width: 100px;
}

    .counter-item.period-in-progress {
        background-color: #d1e7dd; 
        position: relative;
        padding-top: 35px; 
    }

.period-label {
    position: absolute;
    top: 5px; 
    font-size: 0.8em;
    font-weight: bold;
    color: #5a467e; 
}

.counter-value {
    font-size: 2.2em; 
    font-weight: bold;
    color: #7b5ca8;
    margin-bottom: 5px;
}

.counter-label {
    font-size: 1em;
    font-weight: 600;
    color: #555;
}
