/* ==================================================
06.) GESTION DU FOOTER

Objectif:
- Gerer le footer
================================================== */

/* Font-size small sur lien */
:where(body, .editor-styles-wrapper) footer {
	& p {
		font-size: var(--wp--preset--font-size--medium) !important;
		font-weight: normal;
		background-color: transparent;
		color: var(--wp--preset--color--txt-2) !important;	
	}
	& a:link, & a:active, & a:visited {
		font-size: var(--wp--preset--font-size--medium) !important;
		font-weight: bold;
		background-color: transparent;
		color: var(--wp--preset--color--txt-2) !important;
		text-decoration: none !important;
		outline: none;
	}
	& a:hover {
		color: var(--wp--preset--color--free-1) !important;
	}	
	
	/* Mise ne forme sur les liens icones */
		/* Conteneur */
		& .mw-bouton-facebook-color-inv a, .mw-bouton-linkedin-color-inv a {
			position: relative;
    		display: inline-block;
    		overflow: hidden;		
		}
		/* L'image Gutenberg */
		.mw-bouton-facebook-color-inv img, .mw-bouton-linkedin-color-inv img  {
    		display: block;
    		transition: opacity .35s ease;
		}
		/* Hover */
		.mw-bouton-facebook-color-inv a:hover img, .mw-bouton-linkedin-color-inv a:hover img {
    		opacity: 0;
		}
		/* Image affichée au survol */
			.mw-bouton-facebook-color-inv a::after, .mw-bouton-linkedin-color-inv a::after {
    		content: "";
   			position: absolute;
    		inset: 0;
    		background-size: cover;
    		background-position: center;
    		background-repeat: no-repeat;
    		opacity: 0;
    		transition: opacity .35s ease;
    		pointer-events: none;
		}
		/* Image affichée au survol */
		.mw-bouton-facebook-color-inv a::after {
   			background-image: url("https://modeleweb.fr/wp-content/uploads/2026/07/facebook_color_b24040.png");
		}
		/* Image affichée au survol */
		.mw-bouton-linkedin-color-inv a::after {
   			background-image: url("https://modeleweb.fr/wp-content/uploads/2026/07/linkedin_color_b24040.png");
		}

		/* Hover */
		.mw-bouton-facebook-color-inv a:hover::after, .mw-bouton-linkedin-color-inv a:hover::after {	
    		opacity: 1;
		}
}
/* ========== FIN ========== */