/*
 * lightmode.css
 *
 * Feuille de style qui est utilisé pour le module
 * de l'affichage sombre / clair
 * Utilisé avec lightmode.js
 * 
 * @author Vabre Lucas
 */

/* ### Mode Clair ### */
.light-theme { /* Variables utilisés pour le mode Jour */
	--background-color:#ecf0f1;	/* Couleur de fond général */
	--overlay-color:#bdc3c7;	/* Deuxieme couleur de fond */
	--text-color:#2c3e50;		/* Couleur du texte */
	transition-duration: 0.5s;	/* Transition de 0.5 secondes */
}

/* ### Mode sombre ### */
.dark-theme { /* Variables utilisés pour le mode Nuit */
	--background-color:#2c3e50;	/* Couleur de fond général */
	--overlay-color:#34495e;	/* Deuxieme couleur de fond */
	--text-color:#ecf0f1;		/* Couleur du texte */
	transition-duration: 0.5s;	/* Transition de 0.5 secondes */
}

/*  */
#light-mode { /* Boutton jour-nuit */
	cursor: pointer; /* Au survol déchange le curseur pour montrer que c'est un boutton clicable */
}

.li-night-mode {/* Element contenant le boutton jour/nuit */ 
	padding: 0;		/* Enlève les marges internes */
	margin: 0;		/* Enlève les marges */
}

.li-night-mode img { /* Iconne de la lune / soleil */
	width: 40px;		/* Défini la taille de l'iconne */
	height: 40px;		/* Defini la hauteur de l'iconne */
}

.li-maincolor img { /* Element li qui contient l'Iconne de l'engrenage */
	width: 30px;		/* Défini la taille de l'iconne */
	height: 30px;		/* Defini la hauteur de l'iconne */
}