/*
 Theme Name:   Solution Digitale Child
 Theme URI:    http://example.com/twenty-fifteen-child/
 Description:  Solution Digitale Child
 Author:       Xavier Gerber
 Author URI:   http://example.com
 Template:     SolutionDigitale
 Version:      3.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light,
dark,
two-columns,
right-sidebar,
responsive-layout,
accessibility-ready
 Text Domain:  twentyfifteenchild
*/

.element_image_text_full_responsive .element_image_text_full_responsive_32_453_img > div > img{
    aspect-ratio: 4/3!important;
    object-fit: contain!important;
    clip-path: polygon(0% 0, 100% 0, 100% 100%, 0% 100%)!important;
}

/**********************************************************************************************************/
/*	EXEMPLE DE VARIABLES GLOBALES	*/
:root {
    --text-color-1: #545454 !important;
    --text-color-2: #353535 !important;
    --text-color-white: white !important;
    --text-color-black: black !important;
    --anchor-offset: 80px; 
}

/*SMOOTH SCROLL*/

 
/* tous les éléments qui peuvent être ciblés par un #id */
[id] {
 scroll-margin-top: var(--anchor-offset);
}
 
/* facultatif : ajoute un défilement fluide natif */
html { 
    scroll-behavior: smooth; 
}

.navbar-top-container .builder_menu{
	width:auto!important;
}

.php-error #adminmenuback,
.php-error #adminmenuwrap {
    margin-top: 0 !important;
}

/**********************************************************************************************************/
/*	MENU  */
#home_nav{
    background: linear-gradient(115deg, #000000 70%, #ffffff 70.1%) !important;
    margin: 0 !important;
    padding: 0 !important;
}

#home_nav > div.container.sd_admin_container {
    max-width: 90% !important;
}


/**********************************************************************************************************/
/*	CONFIGURATION DES TABLES	*/
.table table {
    width: 100%;
}

.table thead {
    border: solid 1px gray;
}

.table thead th {
    background: darkgray;
    color: white !important;
}

.table thead th,
.table td {
    border-left: solid 1px gray;
    border-right: solid 1px gray;
}

tr td,
tr th {
    padding: 10px; /* Ajustez la valeur du padding selon vos besoins */
}

/**********************************************************************************************************/

.menu-fixed-scroll {
    position: fixed !important;;
    width: 100% !important;
}

.dropdown-item {
    color: black !important;
}

/*/////////////////////////////////////////////////////////////////////////////////*/
/*MENU CHAGEMENT DE LANGUE MASQUE*/
#container_switch_langue {
    display: none !important;
}

/*/////////////////////////////////////////////////////////////////////////////////*/

.sd-button-header p,
.sd-button-header a,
input[type=submit],
input[type=submit]:focus {
    color: white!important;
    text-decoration: none;
}

.sd-button-header,
input[type=submit],
input[type=submit]:focus {
    cursor: default;
    transition: 0.3s;
    padding: 8px 20px;
    border: solid 1px transparent;
    background-color: var(--sdts);
	width: fit-content !important;
}

.sd-button-header:hover p,
.sd-button-header:hover a,
input[type=submit]:hover {
    color: var(--sdts) !important;
}

.sd-button-header:hover,
input[type=submit]:hover {
    padding: 8px 20px;
    border: solid 1px var(--sdts);
    background-color: transparent;
}

/*/////////////////////////////////////////////////////////////////////////////////*/
/*STYLE DES FORMULAIRE*/

/* Reposition du Message erreur*/
.wpcf7-not-valid-tip{
    margin-top:-20px;
    margin-bottom:10px;
}

form input[type=text],
form input[type=email],
form input[type=tel],
form label,
form input,
form textarea {
    width: 100% !important;
}

form input[type=text],
form input[type=email],
form input[type=tel],
form textarea {
    width: 100% !important;
    border: none;
    border-bottom: solid 1px var(--sdts);
    border-radius: 0px !important;
	background-color: transparent;
}

form input[type=submit] {
    display: inline-block !important
}

form label input,
form label textarea {
    margin-top: 15px !important;
    margin-bottom: 25px !important;
}

form * {
    font-size: 14px !important
}

input[type=text],
input[type=email],
input[type=tel],
input[type=password],
textarea,
select,
input[list] {
    width: 100%;
    padding: 12px 20px;
    margin-bottom: 20px !important;
    display: inline-block;
    border: none;
    border-bottom: 1px solid LightGray;
    border-radius: 0px !important;
    box-sizing: border-box;
}

/*******/

#formulairedevis h2{
	color: var(--sd1)!important;
}

#formulairedevis h3{
	color: white!important;
}

#formulairedevis div.no-padding-shortcode.sd_admin_container.col-lg-6.order-lg-2 {
    background-color: white!important;
    border-radius: 20px !important;
    padding: 30px 20px !important;
	margin: 0px!important;
}

#formulairedevis {
    background: url("https://cdn.solution-digitale.ch/wp-content/uploads/2026/06/Rodriguez-Allcars-SA-Background-formulaire-devis-02.jpg") center/cover fixed;
}

#wpcf7-f12-o1 > form {
    background-color: var(--sd5)!important;
    border-radius: 20px !important;
    padding: 30px 20px !important;
	margin: 0px!important;
}


/*/////////////////////////////////////////////////////////////////////////////////*/
/*SOCIAL*/

.sd_social{
	padding-bottom:1rem;
}

.sd_social i {
    color: black!important;
    transition: 0.3s;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--sd1);
    border-radius: 25px;
    width: 50px;
    height: 50px;
    text-align: center;
    margin-right: 5px;
    font-size: 25px;
}

.sd_social i:hover {
    transform: scale(1.3);
}

/*/////////////////////////////////////////////////////////////////////////////////*/
/*FOOTER*/
footer .sd_social_footer i {
    color: black!important;
    transition: 0.3s;
    padding-top: 6px;
    background-color: var(--sd1);
    border-radius: 20px;
    width: 30px;
    height: 30px;
    text-align: center;
    margin-right: 5px;
}

footer .sd_social_footer i:hover {
    transform: scale(1.3);
}

/*/////////////////////////////////////////////////////////////////////////////////*/

h2 .text-big{
    font-weight: 400;
    font-size: 40px;
}


.element_column_sans_fond_98_3 a:not(.nav-link):not(.dropdown-item) {
    text-decoration: none;
    color: var(--sdts)!important;
}

/******/

/* Ombre sur les titres */
.element_gal_multi_1_niveau h2 {
    text-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3) !important;
}

/* Alignement de la galerie (cas imbriqué ET combiné) */
.element_gal_multi_1_niveau .xg_container_gal,
.element_gal_multi_1_niveau.xg_container_gal {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0px !important;
}

.element_gal_multi_1_niveau{
	padding-top: 130px;	
	padding-bottom: 130px;	
}

.element_header_responsive_84_2 img{
	width: 50%!important;
}

#sortableelement_column_sans_fond_98_3 > div > div.d-flex.sd_content {
    flex-direction: row !important;
    align-items: center; /* Aligne verticalement l'image et le texte au centre */
    gap: 20px; /* Crée un espace de 20px entre l'image et le texte */
}

/******/

[id*="collapse-"][id*="-item-"] > div {
    background-color: var(--sd5) !important;
    padding-bottom: 40px !important;
}

[id*="heading-"][id*="-item-"] > span > button {
    background-color: white !important;
    color: var(--sdts) !important;
    font-weight: 500 !important;
    font-size: 19px !important;
}

.sd_element_faq .accordion-body {
    font-weight: 400 !important;
}

.sd_element_faq .accordion,
.sd_element_faq .accordion-item,
.sd_element_faq .accordion-button {
    border-color: var(--sd5) !important;
    border-bottom: 1px solid var(--sd5) !important;
}

.sd_element_faq .accordion-button { 
    box-shadow: none !important; 
}

.sd_element_faq .accordion-header,
.sd_element_faq .accordion-collapse { 
    border: none !important; 
}

.sd_element_faq .mb-5 {
    margin-bottom: 130px !important;
}

/******/

/* Cible toutes les div IMPAIRES (1, 3, 5, 7...) de vos blocs avec traits */
[id^="sortableelement_column_avec_trait_"] > div:nth-child(odd) {
    width: 10% !important;
}

/* Cible toutes les div PAIRES (2, 4, 6, 8...) de vos blocs avec traits */
[id^="sortableelement_column_avec_trait_"] > div:nth-child(even) {
    width: 90% !important;
}


/******/

.element_column_avec_fond ul,
.element_column_sans_fond ul,
.element_shortcode ul,
.element_image_text_full_responsive ul {
    list-style: none !important;
    padding-left: 25px !important;
}

.element_column_avec_fond ul li,
.element_column_sans_fond ul li,
.element_shortcode ul li,
.element_image_text_full_responsive ul li {
    position: relative !important;
}

.element_column_avec_fond ul li::before,
.element_column_sans_fond ul li::before,
.element_shortcode ul li::before,
.element_image_text_full_responsive ul li::before {
    content: "\f00c" !important;
    font-family: "Font Awesome 5 Free", "Font Awesome 6 Free", "FontAwesome" !important;
    font-weight: 900 !important;
    position: absolute !important;
    left: -25px !important;
    top: 2px !important;
    color: var(--sdts)!important;
}

/********/

/* --- BLOC 122_10 : Liste en blanc --- */
.element_column_avec_fond_82_10_container ul > li,
.element_column_avec_fond_80_10_container ul > li,
.element_column_avec_fond_122_10_container ul > li {
    color: white !important;
}	

/* Force la couleur blanche sur l'icône, qu'elle soit en before ou en after */
.element_column_avec_fond_82_10_container ul > li::before,
.element_column_avec_fond_80_10_container ul > li::before,
.element_column_avec_fond_122_10_container ul > li::before {
    content: "\f00c" !important;
    font-family: "Font Awesome 5 Free", "Font Awesome 6 Free", "FontAwesome" !important;
    font-weight: 900 !important;
    color: white !important;
}

/********/

#sortableelement_column_avec_fond_86_4 > div,
#sortableelement_column_avec_fond_82_5 > div,
#sortableelement_column_avec_fond_80_5 > div,
#sortableelement_column_avec_fond_122_5 > div,
#sortableelement_column_avec_fond_77_5 > div,
#sortableelement_column_avec_fond_32_3 > div {
	filter: drop-shadow(-6px 6px 10px rgba(0, 0, 0, 0.10));
}


/* --- Style pour les titres & imgs --- */

#herotitrebiaisgauche h1 {
    background-color: var(--sd1);
    padding: 15px 30px 15px 40px !important; /* Augmenté à droite pour ne pas coller au biais */
    clip-path: polygon(10% 0, 100% 0, 100% 100%, 0% 100%);
    display: inline-block; /* Permet au padding d'isoler correctement le texte */
}
    
#herotitrebiaisgauche img {
    clip-path: polygon(0 0, 80% 0, 100% 100%, 0% 100%);
}
    
/********/
    
#titrebiaisdroite h2 {
    background-color: var(--sd1);
    padding: 15px 50px 15px 30px !important; /* Augmenté à droite et gauche pour respirer */
    clip-path: polygon(0 0, 90% 0, 100% 100%, 0% 100%);
    display: inline-block;
}
    
/********/
    
#titrebiaisdroite img {
    clip-path: polygon(20% 0, 100% 0, 100% 100%, 0% 100%);
}

.element_image_text_full_responsive_98_7 img,
.element_image_text_full_responsive_88_3 img,
.element_image_text_full_responsive_73_16 img,
.element_image_text_full_responsive_73_14 img,
.element_image_text_full_responsive_32_9 img {
    clip-path: unset !important;
}
    
/********/
    
#titrebiaisgauche h2 {
    background-color: var(--sd1);
    padding: 15px 30px 15px 40px !important; /* Augmenté à droite pour le biais */
    clip-path: polygon(10% 0, 100% 0, 100% 100%, 0% 100%);
    display: inline-block;
}

#titrebiaisgauche img {
    clip-path: polygon(0 0, 80% 0, 100% 100%, 0% 100%);
}
    
/********/
    
#contactbasdepage img {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 20% 100%);
}
    
/********/
    
#titregris h2 {
    background-color: var(--sd3);
    padding: 15px 100px 15px 30px !important; /* Assure un espace à gauche aussi */
    clip-path: polygon(0 0, 90% 0, 100% 100%, 0% 100%);
    width: fit-content !important;
    display: inline-block;
}

/********/

.element_logo_slider img{
	padding: 30px!important;
}

.element_column_sans_fond_82_20 h2,
.element_column_sans_fond_80_20 h2,
.element_column_sans_fond_122_20 h2,
.element_column_sans_fond_77_18 h2 {
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3) !important;
}

#sortableelement_column_sans_fond_82_20 > div img,
#sortableelement_column_sans_fond_80_20 > div img,
#sortableelement_column_sans_fond_122_20 > div img,
#sortableelement_column_sans_fond_77_18 > div img {
    display: block;
    width: 100%;
    height: auto;
    transition: filter .4s ease, box-shadow .4s ease, transform .4s ease;
    filter: brightness(70%) !important;
}

#sortableelement_column_sans_fond_82_20 > div:hover img,
#sortableelement_column_sans_fond_80_20 > div:hover img,
#sortableelement_column_sans_fond_122_20 > div:hover img,
#sortableelement_column_sans_fond_77_18 > div:hover img {
    filter: brightness(40%) !important;
    box-shadow: inset 0 0 0 2000px rgba(128, 0, 21, 0.7);
    transform: scale(1.1);
}

/*/////////////////////////////////////////////////////////////////////////////////*/
@media screen and (min-width: 1024px) {
	
    #home_nav:first-of-type.shadow .navbar-brand:first-of-type {
        transform: scale(0.9);
    }

    #home_nav:first-of-type .navbar-brand:first-of-type {
        transition: 0.3s;
    }  
	
	#home_nav .container {
		max-width: 80% !important;
		width: 80% !important;
	}	
	
/********/
	
/* --- BLOC 77_6 : Liste inversée (Texte à droite, icône vue à droite) --- */
.element_image_text_full_responsive_77_6_text .sd_text > ul,
.element_image_text_full_responsive_77_6_text .sd_text > ul > li {
    list-style: none !important;
    list-style-type: none !important;
}

/* Supprime l'icône de gauche initiale */
.element_image_text_full_responsive_86_6_text .sd_text > ul > li::before,
.element_image_text_full_responsive_77_6_text .sd_text > ul > li::before {
    display: none !important;
    content: none !important;
}

.element_image_text_full_responsive_86_6_text .sd_text > ul,
.element_image_text_full_responsive_77_6_text .sd_text > ul {
    text-align: right !important;
    align-self: flex-end !important;
    width: fit-content !important;
    padding: 0 !important;
}

.element_image_text_full_responsive_86_6_text .sd_text > ul > li,
.element_image_text_full_responsive_77_6_text .sd_text > ul > li {
    position: relative;
    padding-left: 0 !important;
    padding-right: 25px !important;
}

/* Génère la nouvelle icône vue à droite */
.element_image_text_full_responsive_86_6_text .sd_text > ul > li::after,
.element_image_text_full_responsive_77_6_text .sd_text > ul > li::after {
    content: "\f00c" !important;
    font-family: "Font Awesome 5 Free", "Font Awesome 6 Free", "FontAwesome" !important;
    font-weight: 900 !important;
    position: absolute !important;
    right: 0 !important;
    left: auto !important;
    top: 2px !important;
    color: var(--sdts) !important;
}
	
/*/////////////////////////////////////////////////////////////////////////////////*/
@media screen and (min-width: 991px) {
    #menu-main {
        gap: 15px
    }
}


/*/////////////////////////////////////////////////////////////////////////////////*/
    #breadcrumbs {
        list-style: none;
        margin: 10px 0;
        overflow: hidden;
    }

    #breadcrumbs li {
        display: inline-block;
        vertical-align: middle;
        margin-right: 15px;
    }

    #breadcrumbs .separator {
        font-size: 18px;
        font-weight: 100;
        color: #ccc;
    }

    html.wp-toolbar {
        padding-top: 25px !important;
    }

    .adminmenuwrap {
        margin-top: 0 !important;
    }

    /* Header & Footer */
    @media screen and (max-width: 992px) {
        .nav-item {
            display: grid !important
        }

        footer > div > div > div > div > .navbar-nav > .nav-item {
            display: unset !important
        }

        .nav-item {
            display: flex !important
        }

        footer > div > div > div > div > .navbar-nav > .nav-item {
            display: unset !important
        }

        ul.dropdown-menu {
            top: 40px !important
        }

        /* Ajout d'une marge en dessus des options admin si menu sticky top */
        #main > div > div.builder_menu.d-flex {
            z-index: 99999 !important;
        }

        .sdg_popup_template {
            z-index: 999999 !important;
        }	
	}