/* Color associations */

.cons-p-green {
    color: white;
    background-color: #005E42;
}

.cons-p-green-dark {
    color: white;
    background-color: #003626;
}

.cons-p-green-light {
    color: #003626;
    background-color: #C5FE92;
}

.cons-p-green-very-light {
    color: #003626;
    background-color: rgba(197, 254, 146, 0.2);
    /* Couleur de fond avec une opacité de 20% */
}

.cons-p-white {
    color: #003626;
    background-color: #FFFFFF;
}

/* Fonts */

@import url('https://fonts.googleapis.com/css2?family=Marcellus&family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');

body {
    font-family: 'Rubik', sans-serif !important;
}

h1, h2, h3 {
    font-family: 'Marcellus', serif;
}

.t-green-light {
    color: #C5FE92;
}

/* Buttons */

.cons-b-green-dark {
    color: #C5FE92;
    border-color: #C5FE92;
    /* Couleur de fond avec une opacité de 20% */
}

.cons-b-green-dark:hover {
    color: #003626;
    /* Couleur de contour au survol */
    background-color: #C5FE92;
}

.cons-b-green-very-light {
    color: #003626;
    border-color: #003626;
    /* Couleur de fond avec une opacité de 20% */
}

.cons-b-green-very-light:hover {
    color: #FFFFFF;
    /* Couleur de contour au survol */
    background-color: #003626;
}

.cons-b-green-light {
    color: #003626 !important;
    background-color: #C5FE92 !important;
}

.cons-b-green-light:hover {
    color: #C5FE92;
    background-color: #003626;
    border-color: #C5FE92;
}

.cons-b-green-light.active, 
.cons-b-green-light:active {
    color: #C5FE92 !important;
    background-color: #003626 !important;
    border-color: #C5FE92 !important;
}

.cons-b-green-add-project {
    color: white;
    background-color: #003626;
}

.cons-b-green-add-project:hover {
    color: #003626;
    background-color: #C5FE92;
    border-color: #003626;
}

.cons-b-red {
    color: white;
    background-color: #D6452C;
    border: 1px solid #D6452C;
    transition: all 0.3s ease;
}

.cons-b-red:hover {
    color: #D6452C;
    background-color: #FFD8C2; 
    border-color: #A62B17;      
}

/* Around the button */

    .icon-circle {
            
        width: 24px; /* Ajustez la taille selon vos besoins */
        height: 24px; /* Ajustez la taille selon vos besoins */
        border-radius: 50%;
        color: #003626;
        background-color: #C5FE92 !important;
        position: relative;
    }

    .icon-circle .bi {
        position: absolute;
        top: 50%; /* Positionne l'icône au centre verticalement */
        left: 50%; /* Positionne l'icône au centre horizontalement */
        transform: translate(-50%, -50%) translate(0, -3px); /* Centre l'icône et la déplace de -2px verticalement */
    }

    .icon-square {
            
        width: 24px; /* Ajustez la taille selon vos besoins */
        height: 24px; /* Ajustez la taille selon vos besoins */
        border-radius: 10%;
        color: #003626;
        border: 1px solid #003626;
        position: relative;
    }

    .icon-square:hover {
            
        background-color: #E55451 !important;
        
    }

    .icon-square .bi {
        position: absolute;
        top: 50%; /* Positionne l'icône au centre verticalement */
        left: 50%; /* Positionne l'icône au centre horizontalement */
        transform: translate(-50%, -50%) translate(0, 0px); /* Centre l'icône et la déplace de -2px verticalement */
    }