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

html {
    overflow-x: hidden;
}

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////// TYPOGRAPHIE & COULEURS ////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

body {
    --blanc : var(--e-global-color-accent);

	--bleu-01-100 : var(--e-global-color-primary);
    --bleu-01-50 : var(--e-global-color-secondary);
    --bleu-01-15 : var(--e-global-color-text);

    --bleu-02-100 : var(--e-global-color-2121e01);
    --bleu-02-50 : var(--e-global-color-198e6f9);
    --bleu-02-15 : var(--e-global-color-8cd829b);

    --vert-01-100 : var(--e-global-color-83d80a3);
    --vert-01-50 : var(--e-global-color-1384bd8);
    --vert-01-15 : var(--e-global-color-ad7b63e);

    --vert-02-100 : var(--e-global-color-c313762);
    --vert-02-50 : var(--e-global-color-e58fd68);
    --vert-02-15 : var(--e-global-color-3a64c04);

    --burgundy-100 : var(--e-global-color-30fe40f);
    --burgundy-50 : var(--e-global-color-8ab50b9);
    --burgundy-15 : var(--e-global-color-d3b5349);

    --jaune-100 : var(--e-global-color-e351b5d);
    --jaune-50 : var(--e-global-color-0b57ce5);
    --jaune-15 : var(--e-global-color-35b7129);

    --gris-100 : var(--e-global-color-e7f6551);
    --gris-50 : var(--e-global-color-dc2aa60);
    --gris-15 : var(--e-global-color-9b17d58);

    --font-family : var(--e-global-typography-primary-font-family), Segoe, Sans-serif;

    --libelle-H1-font-family : var(--font-family);
    --libelle-H1-font-size : var(--e-global-typography-02728f4-font-size);
    --libelle-H1-font-weight : var(--e-global-typography-02728f4-font-weight);
    --libelle-H1-line-height : var(--e-global-typography-02728f4-line-height);

    --libelle-H2-font-family : var(--font-family);
    --libelle-H2-font-size : var(--e-global-typography-860f297-font-size);
    --libelle-H2-font-weight : var(--e-global-typography-860f297-font-weight);
    --libelle-H2-line-height : var(--e-global-typography-860f297-line-height);

    --libelle-H3-font-family : var(--font-family);
    --libelle-H3-font-size : var(--e-global-typography-6759a4d-font-size);
    --libelle-H3-font-weight : var(--e-global-typography-6759a4d-font-weight);
    --libelle-H3-line-height : var(--e-global-typography-6759a4d-line-height);
}

/* /////////////////////////////////////////////////////////// BOUTONS /////////////////////////////////////////////////////////////// */

.elementor-element.elementor-button-info .elementor-button {
    background-color: var(--vert-01-100) !important;
    color: var(--bleu-01-100);
    fill: var(--bleu-01-100);
}

.elementor-element.elementor-button-info .elementor-button:hover {
    background-color: color-mix(in srgb, var(--vert-01-100) 90%, var(--bleu-01-100)) !important;
}

.elementor-element.elementor-button-success .elementor-button {
    background: unset !important;
    color: var(--bleu-01-100);
    fill: var(--bleu-01-100);

    border: 3px solid transparent;
    border-radius: 25px;
    padding: 8px;
}

.elementor-element.elementor-button-success .elementor-button:hover {
    color: var(--vert-01-100);
    fill: var(--vert-01-100);
    border-color: var(--vert-01-100);
}


.elementor-element.elementor-button-warning .elementor-button {
	background: var(--blanc) !important;
	border: 1px solid var(--bleu-01-100);
    color: var(--bleu-01-100);
    fill: var(--bleu-01-100);
}

.elementor-element.elementor-button-warning .elementor-button:hover {
	background-color: color-mix(in srgb, var(--blanc) 90%, var(--bleu-01-100)) !important;
}

.elementor-element.elementor-button-danger .elementor-button {
    background: unset !important;
	fill: var(--bleu-01-100);
    border: none;
	padding: unset;
}

.elementor-element.elementor-button-danger .elementor-button:hover {
	color: var(--vert-01-100);
	fill: var(--vert-01-100);
}

.elementor-element.elementor-button-danger .elementor-button span {
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* BOUTON SPECIFIQUE PAGE ARCHIVE ACTUALITES (TYPE : SUCCESS) */
#spock-load-more-button {
    background: unset !important;
    color: var(--bleu-01-100);
    fill: var(--bleu-01-100);

    border: 3px solid transparent;
    border-radius: 32px;
    padding: 16px;
}

#spock-load-more-button:hover {
    color: var(--vert-01-100);
    fill: var(--vert-01-100);
    border-color: var(--vert-01-100);
}

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

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


@media (max-width: 767px) {
	.spock-padding-left-container {
		padding-left: unset !important;
	}

	.spock-padding-right-container {
		padding-right: unset !important;
	}
}


.swiper {
    padding: 6px !important;
}

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////// IMAGES ////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* IMAGES - CARROUSEL PARTENAIRES */
.spock-partenaires figure {
    height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.spock-partenaires figure img {
    max-height: 70%;
    max-width: 70%;
}

/* IMAGES - CARROUSEL PARTENAIRES - PAGE NOS REFERENCES */
#spock-partenaires .elementor-widget-image {
    height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
}

#spock-partenaires img {
    max-height: 70%;
    max-width: 70%;
}

/* IMAGES - CARROUSEL OFFRES GROUPE */
#spock-offres-groupe .e-con-inner {
    display: flex;
    align-items: center;
    justify-content: center;
}

#spock-offres-groupe a {
    height: 130px;
	align-content: center;
}

#spock-offres-groupe img {
	object-fit: contain;
    max-height: 60%;
    max-width: 60%;
}

/* ICONES - CARROUSEL METIER */
.spock-icones-metier .elementor-icon {
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.spock-icones-metier svg {
    max-height: 80%;
    max-width: 80%;
}

/* CONTENEUR IMAGE - SECTION TITRE - PAGE ACCUEIL */
#spock-home-image-background {
    width: fit-content;
    height: fit-content;
    backdrop-filter: blur(1px);
}

.e-loop-item.category-temoignages .spock-article-background-image {
    background-size: contain !important;
}

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////// FORMULAIRE ////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* CLASSE FORMULAIRE PAGE CONTACT : .spock-contact-form */
/* CLASSE BOUTON DANS FORMULAIRE : .spock-submit-inside-form */


/* /////////////////////////////////////////////////////////// POSITION ////////////////////////////////////////////////////////////// */

.spock-contact-form .elementor-form-fields-wrapper {
    justify-content: center;
}

.spock-button-inside-form .elementor-field-type-submit {
    position: absolute;
    bottom: 12px;
    right: 0px;
    margin: 0 !important;
}

.spock-contact-form .elementor-field-textual::placeholder {
    opacity: .4 !important;
}

.elementor-field-group .elementor-select-wrapper select {
  font-size: 16px !important;
}

/* Conteneur */
.spock-contact-form .elementor-form-fields-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin: 0;
}

/* Neutralise les largeurs elementor-col-XX et le padding interne */
.spock-contact-form .elementor-field-group {
  width: 100%;
  max-width: 100%;
  padding: 0;
  margin: 0;
}

/* --- Colonne gauche --- */
.spock-contact-form .elementor-field-group-lastname       { grid-column: 1; grid-row: 1; }
.spock-contact-form .elementor-field-group-name    { grid-column: 1; grid-row: 2; }
.spock-contact-form .elementor-field-group-email     { grid-column: 1; grid-row: 3; }
.spock-contact-form .elementor-field-group-phone       { grid-column: 1; grid-row: 4; }
.spock-contact-form .elementor-field-group-function     { grid-column: 1; grid-row: 5; }


/* --- Colonne droite --- */
.spock-contact-form .elementor-field-group-enterprise   { grid-column: 2; grid-row: 1; }
.spock-contact-form .elementor-field-group-selectBox    { grid-column: 2; grid-row: 2; }

/* Le textarea : occupe les lignes 3 → 5 */
.spock-contact-form .elementor-field-group-message {
  grid-column: 2;
  grid-row: 3 / span 3;
	
  display: grid;
  grid-template-rows: auto 1fr;
  align-content: stretch;
}

.spock-contact-form .elementor-field-group-message > label {
  flex-basis: auto;
}

/* et le champ lui-même remplit son groupe */
.spock-contact-form .elementor-field-group-message textarea {
  height: 100%;
  min-height: 0;
  resize: none;
}

/* --- Bouton --- */
.spock-contact-form .elementor-field-type-submit {
  grid-column: 1 / -1;
  grid-row: 6;
}

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////// HEADER ////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* IDENTIFIANT MENU HEADER : #spock-header-menu */

#spock-header-menu {
	z-index: 1000;
}
#spock-header-menu nav.elementor-nav-menu--dropdown {
	z-index: 1001;
}
#spock-header-menu .elementor-menu-toggle {
	z-index: 1002;
}
#spock-header-menu nav.elementor-nav-menu--dropdown {
	position: fixed;
	top: 0;
	width: 100%;
	height: 100vh;
	padding-top: 80px;
	transform: unset;
	transition: left 0.5s ease;
	max-height: 100vh;
}
#spock-header-menu nav.elementor-nav-menu--dropdown[aria-hidden="true"] {
	left: -100%;
}
#spock-header-menu nav.elementor-nav-menu--dropdown[aria-hidden="false"] {
	left: 0;
}
#spock-header-menu nav.elementor-nav-menu--dropdown ul {
	background-color: unset;
}
#spock-header-menu nav.elementor-nav-menu--dropdown ul li {
	border-radius: unset;
}
#spock-header-menu nav.elementor-nav-menu--dropdown .elementor-sub-item {
	padding: 8px;
}

/* /////////////////////////////////////////////////////////// TYPOGRAPHIE & COULEURS //////////////////////////////////////////////// */

#spock-header-menu li:last-child .elementor-item {
    color: var(--burgundy-100);
    font-weight: 800;
    font-size: 18px;
	text-align: center;
}

#spock-header-menu li:last-child .elementor-item:hover {
    color: var(--bleu-01-100);
}

#spock-header-menu li:last-child .elementor-item-active {
    color: var(--bleu-01-100);
}

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////// FOOTER ////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* IDENTIFIANT BOUTON TOP FOOTER : #spock-footer-button */

/* /////////////////////////////////////////////////////////// POSITION ////////////////////////////////////////////////////////////// */

#spock-footer-button .elementor-button {
    padding: 12px;
}

/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////// AUTRES ////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */

.logo-cliquable {
    cursor: pointer;
}

#spock-iframe-maps {
    border-radius: 16px;
}

.swiper h3 {
    word-break: normal;
}

.swiper {
	cursor: pointer;
}

nav a {
    white-space: nowrap;
}

.spock-compteur {
    text-align: center;
}

.spock-h2-entry-title {
    font-family: var(--libelle-H2-font-family);
    font-size: var(--libelle-H2-font-size);
    font-weight: var(--libelle-H2-font-weight);
    line-height: var(--libelle-H2-line-height);
}

/* ///////////////////////////////////////////////////////// HEADER NAV SOUS-MENU ///////////////////////////////////////////////////////// */

.sub-menu {
    border-radius: 8px;
	overflow: hidden;
}

.sub-menu li:first-child .elementor-sub-item:hover {
    border-radius: 8px 8px 0px 0px;
}

.sub-menu li:last-child .elementor-sub-item:hover {
    border-radius: 0px 0px 8px 8px;
}

/* ////////////////////////////////////////////////////// iFRAME BOOKING Mircosoft /////////////////////////////////////////////////////// */

#spock-iframe {
	width: 1024px !important;
}

@media (max-width: 1400px) {
    #spock-iframe iframe {
        height: 2200px !important;
    }
}

/* /////////////////////////////////////////////////////////// RESPONSIVE //////////////////////////////////////////////////////////// */

@media (max-width: 1440px) {
    .elementor-element.e-con {
        --container-max-width: 90%;
    }
}

@media (max-width: 1024px) {
	.spock-button-inside-form .elementor-field-type-submit {
		right: 0px;
	}
}

@media (max-width: 767px) {
	#spock-offres-groupe img {
    	max-height: 40%;
    	max-width: 60%;
	}
	
	.spock-contact-form .elementor-form-fields-wrapper {
		display: flex;
	}
	
	/* Sous menu page unique */
	.elementor-nav-menu--layout-horizontal .elementor-nav-menu {
		display: grid !important;
		gap: 8px;
	}
	
	.elementor-nav-menu--layout-horizontal .elementor-nav-menu > li:not(:first-child) > a {
		margin-inline-start: 0px !important;	
	}
	
	.elementor-nav-menu--layout-horizontal .elementor-nav-menu > li:not(:last-child) > a {
		margin-inline-end: 0px !important;
	}
	
	.elementor-nav-menu .elementor-item {
		justify-content: center;	
	}
	/* Fin sous menu page unique */
}

/* ///////////////////////////////////////////////////// ELLIPSIS LOOP CARD ////////////////////////////////////////////////////// */

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