:root {
	--card-size: 300px; /* Taille par défaut que doit avoir les div.card */
    /* Ajouter 3 variables : bg-color, text-color, card-bg-color pour le mode clair */	
}

* {
    margin: 0;
    padding: 0;
}

body {
    font-family: Arial, sans-serif;
    height: 100vh;

    &.dark {
        /* Modifier les variables pour le mode sombre */
    }
}

header {
    margin-bottom:10px;
    padding-bottom:10px;
    text-align: center;

    div {
        display:flex;
        gap: 10px;
        justify-content: center;
    }
}

main {
    display:flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 1200px;
    margin: 0 auto;
}

.card {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;


    .img-container {
        text-align: center;

        img {
            max-width: 100%;
        }
    }

    .btn-container {
        display: flex;
        justify-content: space-between;
    }
}