/*
Theme Name:     Perinfo-theme
Theme URI:      
Description:    Hello-elementor child theme.
Author:         Me
Author URI:     
Template:       hello-elementor
Version:        0.1.0
*/


body {
	--box-shadow-500: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
	--color-light-primary : var(--e-global-color-ec18739);
	--color-neutral-20 : var(--e-global-color-e8df18e);
	--color-neutral-50 : var(--e-global-color-3229226);
	--color-neutral-70 : var(--e-global-color-c6a1033);
	background: url("/wp-content/uploads/2025/12/watermark-253.svg");
    background-size: 15%;
	/*scroll-behavior: smooth;*/
}


/* ----------------- HEADER > menu ------------------------------- */

header .elementor-nav-menu--main > ul > li:last-child > a {
	font-size: 42px;
}

/* ----------------- CLASSE PERINFO ------------------------------- */

.perinfo-margin-left-container {
	margin-left: calc( (100vw - var(--container-max-width) ) / 2) !important;
}

.perinfo-margin-right-container {
	margin-right: calc( (100vw - var(--container-max-width) ) / 2) !important;
}

.perinfo-padding-left-container {
	padding-left: calc( (100vw - var(--container-max-width) ) / 2) !important;
}

.perinfo-padding-right-container {
	padding-right: calc( (100vw - var(--container-max-width) ) / 2) !important;
}

/* ------------------------- BOUTONS ----------------------- */

.elementor-widget-button .e-font-icon-svg {
	fill: currentcolor;
}

/* -------------- BOUTON INFO (pour les boutons d'icone seul) ----------------- */

.elementor-element.elementor-button-info .elementor-button {
    color: var(--e-global-color-primary) !important;
    border: 3px solid transparent !important;
	background-color: unset !important;
	font-size: 36px !important;
	border-radius: 50%;
	padding: 8px;
}
 
.elementor-element.elementor-button-info .elementor-button:hover {
    color: var(--e-global-color-secondary) !important;
    border: 3px solid var(--e-global-color-secondary) !important;
}

/* --------- BOUTON SUCCESS (texte seul sans fond ni contour) --------- */

.elementor-element.elementor-button-success .elementor-button {
	padding: unset;
	font-weight:700;
	border: none;
	background-color: unset !important;
	color: var( --e-global-color-text);
}
 
.elementor-element.elementor-button-success .elementor-button:hover {
    opacity:0.8;
	color: var(--e-global-color-e8df18e);
	border: none !important;
}

/* ----------------- BOUTON WARNING (type rempli avec icon seul) --------------------- */

.elementor-element.elementor-button-warning .elementor-button {
	border: none !important;
	background-color: var(--e-global-color-secondary) !important;
	color: var( --e-global-color-text);
	padding: 12px;
}
 
.elementor-element.elementor-button-warning .elementor-button:hover {
	background-color: var(--e-global-color-primary) !important;
}

/* --------------- BOUTONS DANGER (couleur inversé) ----------------------- */

.elementor-element.elementor-button-danger .elementor-button {
	background-color: var( --e-global-color-accent ) !important;
	color: var( --e-global-color-primary );
	border-color: var( --e-global-color-primary );
}

.elementor-element.elementor-button-danger .elementor-button:hover {
	color: var( --e-global-color-secondary ) !important;
  	border-color: var( --e-global-color-secondary ) !important;
}

/* -------------------- FORMULAIRE --------------------------------- */

form[name="question-form"] {
    position: relative;
    padding-bottom: 0px; /* Espace pour ne pas que le bouton soit coupé */
}

form[name="question-form"] .elementor-field-type-submit {
    position: absolute;
    bottom: 32px;
    right: 16px;
    margin: 0 !important;
}

/* -------------------- FOOTER --------------------------------- */

footer #secondary-menu .elementor-nav-menu {
	flex-direction: column;
  	justify-content: center;
  	width: 100%;
}


footer #secondary-menu .elementor-nav-menu--main .elementor-nav-menu {
  	height: 100px;
}

footer #secondary-menu .elementor-nav-menu a {
	padding-top: 0 !important;
	padding-left: 0 !important;
}

/* ------------------- CAROUSSEL ELEMENTOR ----------------------------*/

.perinfo-caroussel-overflow-visible .swiper {
	overflow: visible;
}

.swiper:not(.swiper-backface-hidden) .swiper-wrapper {
	cursor: grab;
}

.swiper h3 {
	min-height: 75px;
}

.elementor-loop-container .elementor-widget-theme-post-excerpt {
	 display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    line-clamp: 5;
    overflow: hidden;
}

.elementor-swiper-button {
	right: -80px;
}

/* --------------------------------- SCROLL SPY PAGE D'ACCUEIL --------------------------------------*/

#content {
    position: relative;
}
#content aside {
    top:0;
    bottom: 0;
    display: block;
}
#content aside .elementor-widget-nav-menu {
    position: sticky;
    top: 50%;
    transform: translateY(-50%);
}

#content aside ul {
  width: 3px;
  background: linear-gradient(to bottom, var(--e-global-color-primary), var(--color-light-primary));
  margin: 24px auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}

#content aside a {
    border: 3px solid;
	border-color: var(--e-global-color-primary);
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
	justify-content: center;
	align-items: center;
	transform: scale(1);
    transition: all .3s ease;
    background-color: white;
}

#content aside a:hover {
    transform: scale(1.2);
}

#content aside a {
    padding: 0;
}

#content aside a.elementor-item-active {
    transform: scale(1.2);
    border-color: var(--e-global-color-secondary);
}

/* ----------------- PAGE QUI SOMMES NOUS > CARROUSEL FILIALE ------------------------------- */

#affiliate {
	padding: 2% 0;
    margin-top: -4%;
    overflow: hidden;
}

#affiliate .swiper {
	transform: rotate(-2deg);
	margin: 0 -2%;
	background-color: var( --e-global-color-primary );
	height: 290px;
}

#affiliate .swiper-wrapper {
    display: flex;
    align-items: stretch;
}
#affiliate .swiper-slide {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: grab;
}

#affiliate figure {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 130px;
    user-select: none;
}

#affiliate figure img {
	max-width: 97%;
  	max-height: 62%;
}

/* ----------------- ANIMATIONS -------------------- */

.gradient-animated {
  position: relative !important;
	background: var(--color-neutral-50);
}

.gradient-animated::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(
    90deg,
    transparent 0%,
    transparent 45%,
    var(--color-neutral-20) 50%,
    transparent 55%,
	transparent 100%
	);
	animation: wave 5s ease infinite;
	filter: drop-shadow(0 0 3px white);
	background-size: 300% 100%;
}

@keyframes wave {
	0% {
		background-position: 0% 0;
	}
	100% {
		background-position: -200% 0;
	}
}

/* --------------------- GRILLE DE BOUCLE > PAGINATION -------------------- */

.page-numbers {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background-color: var(--neutral-20);
}

.page-numbers.current {
	background-color: var(--e-global-color-secondary);
}