/***************************************************************************************/
/* Travaux de mise à jour et d'optimisation par Deneir Conseil                         */
/***************************************************************************************/

/*=====================================================================================*/
/* Personnalisation du bouton natif Elementor "Voir plus" sur le Grid                  */
/*=====================================================================================*/

.wpr-grid-pagination a {
	color: black !important;
	letter-spacing: 0.25em;
	background-color: transparent !important;
	position: relative;
	font-weight: 800;
	font-size: 18px;
	line-height: 1;
}

.wpr-grid-pagination a:hover {
	color: white !important;
}

.wpr-load-more-btn::before {
	content: "";
	z-index: -1;
	display: block;
	position: absolute;
	top: -4px;
	left: 0;
	width: 42px;
	height: 42px;
	border-radius: 21px; 
	background-color: #e10b17;
	transition: width 0.5s;
}

.wpr-load-more-btn:hover::before {
	width: 100%;
}

.wpr-load-more-btn span {
	margin-right: calc(1em/3);
}

.wpr-load-more-btn span {
	display: inline-block !important;
}

/*=====================================================================================*/
/* Barre de filtre                                                                     */
/*=====================================================================================*/

/* séparateur gris argenté */
.wpr-grid-filters-sep {
	color: #b0b0b0;
}

/* Filtre courant en gras */
.wpr-grid-filters li > span.wpr-active-filter {
	font-weight: 800;
}

/* règle de calcul du placement des objets relatifs pour les éléments de filtre */
.wpr-grid-filters li > span {
	position: relative;
	font-size: 16px;
}

/* placement du cercle rouge */
.wpr-grid-filters li > span::before {
	content: "";
	display: block;
	position: absolute;
	left: calc(50% - 6px);
	bottom: 4px;
	width: 12px;
	height: 12px;
	border-radius: 6px;
	background-color: #e10b17;
	opacity: 0;
	transition: opacity 0.5s;
}

/* le cercle rouge est visible quand on passe au dessus d'un item OU quand l'item est actif */
.wpr-grid-filters li > span:hover::before, .wpr-grid-filters li > span.wpr-active-filter::before {
	opacity: 1;
}

@media (max-width: 1024px) {
	.wpr-grid-filters-sep {
		display: none;
	}

	.wpr-grid-filters {
		display: none !important;
		overflow: hidden;
		border-radius: 25px;
		border: 2px solid #e10b17;
	}
	
	.wpr-grid-filters.display-block-override {
		display: block !important;
	}
	
	.wpr-grid-filters li {
		display: block !important;
		padding-left: 12px !important;
		line-height: 2 !important;
	}
	
	.wpr-grid-filters li > span {
		padding-left: 18px !important;
	}
	
	/* placement du cercle rouge */
	.wpr-grid-filters li > span::before {
		content: "";
		display: block;
		position: absolute;
		left: 0;
		top: 14px;
		width: 8px;
		height: 8px;
		border-radius: 6px;
	}
	
	#filters-btn {
		padding: 7px 24px !important;
		height: auto !important;
		line-height: 1 !important;
	}
	
	#filters-btn:hover {
		color: white !important;
		text-decoration: none !important;
	}
	
	#filters-btn.active svg {
		transform: rotate(45deg);
	}
}

/*=====================================================================================*/
/* Grid Items (Hover Content)                                                          */
/*=====================================================================================*/

/* Pour rappel : le widget elementor utilise une imbrication display: table -> display: table-cell
 * permettant ainsi de garantir un alignement central horizontal ET vertical des éléments au sein de
 * chaque item dans le grid. */

.wpr-grid-media-hover .wpr-cv-inner {
	position: relative !important;
	z-index: 2;
}

.wpr-grid-media-hover .wpr-grid-media-hover-middle {
	position: static !important;
}

.wpr-grid-media-hover .wpr-grid-item-excerpt,
.wpr-grid-media-hover .wpr-grid-item-title,
.wpr-grid-media-hover .wpr-grid-item-read-more 
{
	opacity: 0;
	transition: opacity 0.1s;
}

.wpr-grid-media-hover:hover .wpr-grid-item-excerpt,
.wpr-grid-media-hover:hover .wpr-grid-item-title,
.wpr-grid-media-hover:hover .wpr-grid-item-read-more 
{
	opacity: 1;
}

.wpr-grid-media-hover .wpr-grid-item-title {
	z-index: 2;
}

.wpr-grid-media-hover .wpr-grid-item-title .inner-block > a {
	color: #ffffff !important;
	font-size: 16px !important;
	text-transform: none !important;
	font-family: "Raleway", sans-serif !important;
	font-weight: 500;
	line-height: initial !important;
}

.wpr-grid-media-hover .wpr-grid-item-excerpt .inner-block {
	font-family: "Staatliches", sans-serif;
	font-size: 36px;
	font-weight: 500;
}

.wpr-grid-media-hover .wpr-grid-item-read-more {
	z-index: -1 !important;
	position: absolute !important;
	width: 100% !important;
	top: calc(50% - 65px);
	text-align: right !important;
	padding-right: 50px;
}

.wpr-grid-media-hover .wpr-grid-item-read-more .inner-block a {
	padding: 120px 55px 10px 75px !important;
}

.wpr-grid-media-hover:hover .wpr-grid-item-read-more .wpr-button-none::before {
	opacity: 1;
}

.wpr-grid-media-hover:hover .wpr-grid-item-read-more .inner-block a {
	color: white !important;
	transition: transform 0.2s ease !important;
}

.wpr-grid-media-hover:hover .wpr-grid-item-read-more .inner-block a:hover {
	transform: scale(1.2);
}

/*=====================================================================================*/
/* Grid Items (Below Content)                                                          */
/*=====================================================================================*/

.wpr-grid-item-below-content .wpr-grid-item-title .inner-block > a {
	font-size: 14px !important;
	text-transform: none !important;
	font-family: "Raleway", sans-serif !important;
	line-height: initial !important;
}

.wpr-grid-item-below-content .wpr-grid-item-title .inner-block > a:hover {
	color: initial !important;
}