.elementor-widget-container .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-container .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-1320 .elementor-element.elementor-element-6380130{--display:flex;--min-height:600px;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--overlay-opacity:0.27;}.elementor-1320 .elementor-element.elementor-element-6380130:not(.elementor-motion-effects-element-type-background), .elementor-1320 .elementor-element.elementor-element-6380130 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://www.renostyles.com/wp-content/uploads/2024/11/volet-roulant.jpg");background-repeat:no-repeat;background-size:cover;}.elementor-1320 .elementor-element.elementor-element-6380130::before, .elementor-1320 .elementor-element.elementor-element-6380130 > .elementor-background-video-container::before, .elementor-1320 .elementor-element.elementor-element-6380130 > .e-con-inner > .elementor-background-video-container::before, .elementor-1320 .elementor-element.elementor-element-6380130 > .elementor-background-slideshow::before, .elementor-1320 .elementor-element.elementor-element-6380130 > .e-con-inner > .elementor-background-slideshow::before, .elementor-1320 .elementor-element.elementor-element-6380130 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:var( --e-global-color-primary );--background-overlay:'';}.elementor-widget-heading .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-heading .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-1320 .elementor-element.elementor-element-5e4aa6c{text-align:center;}.elementor-1320 .elementor-element.elementor-element-5e4aa6c .elementor-heading-title{font-family:"Roboto", Sans-serif;font-size:3.2rem;font-weight:600;text-transform:uppercase;-webkit-text-stroke-width:0px;stroke-width:0px;-webkit-text-stroke-color:var( --e-global-color-astglobalcolor5 );stroke:var( --e-global-color-astglobalcolor5 );text-shadow:0px 0px 10px rgba(0,0,0,0.3);color:#FFFFFF;}.elementor-1320 .elementor-element.elementor-element-c41c208{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-1320 .elementor-element.elementor-element-c34e4ac{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1320 .elementor-element.elementor-element-b60fb2b{text-align:center;}.elementor-1320 .elementor-element.elementor-element-b60fb2b .elementor-heading-title{font-family:"Roboto", Sans-serif;font-weight:300;text-transform:uppercase;}.elementor-widget-text-editor .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-text-editor .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-text-editor{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-1320 .elementor-element.elementor-element-c7ff8c7{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-widget-image .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-image .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-1320 .elementor-element.elementor-element-90d6588{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1320 .elementor-element.elementor-element-c089cd8{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:30px;--padding-bottom:20px;--padding-left:0px;--padding-right:0px;}.elementor-1320 .elementor-element.elementor-element-c089cd8:not(.elementor-motion-effects-element-type-background), .elementor-1320 .elementor-element.elementor-element-c089cd8 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-primary );}.elementor-1320 .elementor-element.elementor-element-db7f4b1{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1320 .elementor-element.elementor-element-5ee7b28{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1320 .elementor-element.elementor-element-7dc5182{text-align:center;}.elementor-1320 .elementor-element.elementor-element-7dc5182 .elementor-heading-title{font-family:"Roboto", Sans-serif;font-weight:300;color:#FFFFFF;}.elementor-1320 .elementor-element.elementor-element-abc5acd{color:var( --e-global-color-astglobalcolor5 );}.elementor-1320 .elementor-element.elementor-element-abd8725{text-align:center;}.elementor-1320 .elementor-element.elementor-element-abd8725 .elementor-heading-title{font-family:"Roboto", Sans-serif;font-weight:300;color:#FFFFFF;}.elementor-1320 .elementor-element.elementor-element-2fdbeb8{color:var( --e-global-color-astglobalcolor5 );}.elementor-1320 .elementor-element.elementor-element-0197a31{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-1320 .elementor-element.elementor-element-68c0ac8{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1320 .elementor-element.elementor-element-b79f6c2 .elementor-heading-title{font-family:"Roboto", Sans-serif;font-weight:300;}.elementor-1320 .elementor-element.elementor-element-755e87c{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-widget-video .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-video .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-1320 .elementor-element.elementor-element-8e5f1f0 .elementor-wrapper{--video-aspect-ratio:1.77777;}.elementor-1320 .elementor-element.elementor-element-eb453e3{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1320 .elementor-element.elementor-element-459899d .elementor-heading-title{font-family:"Roboto", Sans-serif;font-weight:300;}.elementor-1320 .elementor-element.elementor-element-99827ec{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-1320 .elementor-element.elementor-element-d81e2d0{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;}.elementor-1320 .elementor-element.elementor-element-d81e2d0.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-1320 .elementor-element.elementor-element-86d4ce4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-button .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-button .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-1320 .elementor-element.elementor-element-4decd77 .elementor-button{font-family:"Roboto", Sans-serif;font-weight:500;text-transform:uppercase;border-style:solid;border-width:1px 1px 1px 1px;}.elementor-1320 .elementor-element.elementor-element-f774da7{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1320 .elementor-element.elementor-element-d4b710d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1320 .elementor-element.elementor-element-2e03099{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1320 .elementor-element.elementor-element-30c24e2{text-align:center;}.elementor-1320 .elementor-element.elementor-element-30c24e2 .elementor-heading-title{font-family:"Roboto", Sans-serif;font-weight:300;text-transform:uppercase;}.elementor-1320 .elementor-element.elementor-element-e711b0b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1320 .elementor-element.elementor-element-b4b961b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-1320 .elementor-element.elementor-element-353facc{--display:flex;}.elementor-widget-html .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-html .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-1320 .elementor-element.elementor-element-c7dd207{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-widget-spacer .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-spacer .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-1320 .elementor-element.elementor-element-d9cc4e6{--spacer-size:50px;}@media(min-width:768px){.elementor-1320 .elementor-element.elementor-element-c34e4ac{--width:50%;}.elementor-1320 .elementor-element.elementor-element-c7ff8c7{--width:50%;}.elementor-1320 .elementor-element.elementor-element-db7f4b1{--width:20%;}.elementor-1320 .elementor-element.elementor-element-5ee7b28{--width:80%;}.elementor-1320 .elementor-element.elementor-element-68c0ac8{--width:50%;}.elementor-1320 .elementor-element.elementor-element-755e87c{--width:50%;}.elementor-1320 .elementor-element.elementor-element-d81e2d0{--width:80%;}.elementor-1320 .elementor-element.elementor-element-f774da7{--width:20%;}}/* Start custom CSS for html, class: .elementor-element-cdd9609 */.product-selection {
    display: grid;
    grid-template-columns: repeat(7, 1fr); /* 7 colonnes */
    gap: 20px; /* Espacement entre les produits */
}

.product-item {
    position: relative;
    display: inline-block;
    cursor: pointer;
    text-align: center;
}

.product-item img {
    width: 100%;
    border: 2px solid #ddd;
    border-radius: 10px;
    transition: transform 0.2s ease;
}

.product-item input[type="checkbox"] {
    display: none; /* Masquer la case à cocher */
}

.product-item .overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5); /* Overlay noir transparent */
    opacity: 0;
    transition: opacity 0.2s ease;
    border-radius: 10px;
}

.product-item .checkmark {
    color: white;
    font-size: 24px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: none;
}

.product-item input[type="checkbox"]:checked + img {
    transform: scale(1.1); /* Zoom léger sur l'image sélectionnée */
    border-color: #4CAF50; /* Changer la couleur de la bordure pour indiquer la sélection */
}

.product-item input[type="checkbox"]:checked ~ .overlay {
    opacity: 1; /* Affiche l'overlay lorsque la case est cochée */
}

.product-item input[type="checkbox"]:checked ~ .overlay .checkmark {
    display: block; /* Affiche la coche */
}

/* Style pour les boutons */
button,
input[type="submit"] {
    background-color: #F19605; /* Couleur de fond */
    color: white; /* Texte en blanc */
    border: none; /* Pas de bordure */
    padding: 15px; /* Ajout d'un peu de padding pour le confort */
    font-size: 16px; /* Taille du texte */
    width: 100%; /* Prendre toute la largeur de la div parent */
    cursor: pointer; /* Curseur en forme de main pour indiquer un bouton cliquable */
    display: block; /* Forcer le bloc pour occuper la largeur */
    text-align: center; /* Centrer le texte */
    border-radius: 0; /* Angles droits */
}

button:hover,
input[type="submit"]:hover {
    background-color: #d97f03; /* Couleur plus sombre au survol */
}

button:disabled {
    background-color: #ddd; /* Couleur grise lorsque le bouton est désactivé */
    cursor: not-allowed; /* Curseur d'interdiction pour montrer que le bouton n'est pas cliquable */
}
/* Réactivité mobile */
@media (max-width: 768px) {
    .product-selection {
        grid-template-columns: repeat(2, 1fr); /* Passer à 2 colonnes sur les petits écrans */
        gap: 10px; /* Réduire l’espace entre les éléments pour un affichage compact */
    }

    button,
    input[type="submit"] {
        padding: 10px; /* Réduire le padding pour le confort sur mobile */
        font-size: 14px; /* Taille de police légèrement réduite */
    }
}
/* Animation pour la transition fade-in et fade-out */
.fade-out {
    animation: fadeOut 0.5s forwards;
}

.fade-in {
    animation: fadeIn 0.5s forwards;
}

@keyframes fadeOut {
    from { opacity: 1; }
    to { opacity: 0; }
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}/* End custom CSS */