/*
Theme Name: Maison Elementor
Theme URI: https://www.maisons-alienor.fr/
Description: Maison Elementor IRCF
Author: IRCF
Author URI: https://ircf.fr/
Template: hello-elementor
Version: 1.0
Text Domain: maison-elementor
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
*/

/************************
*** ÉTAPE 1 : MODÈLES *** 
************************/

#dce-form-step-field_6671ba4
    > .elementor-field-group-field_944defb
    > div
    > span {
    display: flex !important;
    flex-direction: column-reverse !important;
    align-items: center !important;
    width: 50% !important;
    gap: 2vh !important;
}

/**MODELS CONTAINER**/
.models-container {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    max-height: 85vh !important;
    height: 95% !important;
    padding: 1vh !important;
    overflow: auto !important;
    gap: 50px !important;
}

.models-container > label:hover {
    border: 2px solid #3c77bb !important;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.3) !important;
    transition: transform 500ms ease !important;
}

.models-container > label {
    flex: 1 0 45% !important;
    margin: 10px !important;
    border: 2px solid transparent !important;
    border-radius: 5px !important;
    background-color: white !important;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2) !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

.post-thumbnail > img {
    background-color: linen !important;
}

.cards-content {
    display: flex !important;
    flex-direction: row !important;
    align-items: end !important;
    padding: 10px 10px !important;
}

.left-col {
    width: 65% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: start !important;
    align-self: start !important;
    gap: 10px !important;
}

.left-col a {
    font-weight: 500 !important;
    font-size: 20px !important;
    width: 80% !important;
    color: black !important;
}

#selected-area {
    font-size: 12px !important;
    padding: 10px 10px !important;
    font-weight: 700 !important;
    margin: 0px !important;
    margin-block-end: 0px !important;
    text-align: center !important;
    letter-spacing: 1px !important;
    color: #3c77a0 !important;
}

.right-col {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    align-items: end !important;
    gap: 10px !important;
    width: 35% !important;
    align-self: first baseline !important;
}

.sub-title {
    font-weight: 600 !important;
    font-size: 10px !important;
    letter-spacing: 2px !important;
    color: #3c77a0 !important;
}

.sub-title-2 {
    font-size: 13px !important;
    font-style: oblique !important;
}

#price {
    padding: 4% 5% !important;
    border: solid 1px royalblue !important;
    border-radius: 50px !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    color: white !important;
    background-color: #3c77a0 !important;
}

#price a {
    font-weight: 700 !important;
    letter-spacing: 1px !important;
}

#price:hover {
    background-color: #3c77bb !important;
}

/***************************
*** ÉTAPE 2 : VARIATIONS ***
***************************/

#dce-form-step-field_2684621
    > .elementor-field-group-field_188a743
    > div
    > span {
    display: flex !important;
    flex-direction: column-reverse !important;
    align-items: center !important;
    width: 50% !important;
    gap: 2vh !important;
}

.elementor-field-group-field_188a743 > .elementor-field-label {
    width: 100% !important;
    text-align: center !important;
}

/**Style des variations de modèles**/
.variation-container {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    max-height: 85vh !important;
    height: 95% !important;
    padding: 1vh !important;
    overflow: auto !important;
    gap: 50px !important;
}

.variation-container > label {
    flex: 1 0 45% !important; /* Prend 45% de la largeur disponible */
    margin: 10px !important;
    border: 2px solid transparent !important;
    border-radius: 5px !important;
    background-color: white !important;
    cursor: pointer !important;
}

.variation-container > label:hover {
    border: 2px solid #3c77bb !important;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2) !important;
}

.variation-card {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px,
        rgba(0, 0, 0, 0.06) 0px 2px 4px -1px !important;
}

.variation-right-col {
    justify-content: flex-end !important;
}

/******************************************* 
*** ÉTAPE 3 : RÉCAPITULATIF DE LA CONFIG ***
*******************************************/
#dce-form-step-field_df0df43 > .elementor-field-type-dce_js_field {
    display: flex !important;
    flex-direction: column-reverse !important;
    align-items: start !important;
    padding: 2% !important;
    margin: 0% 5% !important;
    border-radius: 0px !important;
    background-color: beige !important;
}

.elementor-field-type-dce_js_field input {
    padding: 5% 2% !important;
    border-width: 1px 0px !important;
    border-radius: 0px !important;
    font-weight: 500 !important;
    background-color: beige !important;
    color: black;
}

/**Style du Récapitulatif (Étape 3 du configurateur)*/
#recapitulatif {
    display: flex !important;
    flex-direction: column-reverse !important;
}

#recapitulatif > div {
    display: flex !important;
    flex-direction: row !important;
    gap: 2rem !important;
    justify-content: space-between !important;
    align-items: center !important;
    border: solid 0px #cfcfcf !important;
    border-bottom-width: 1px !important;
    padding: 2% !important;
}

#recapitulatif > .recap-config:hover {
    background-color: #e6fafc !important;
}

#recapitulatif h3 {
    font-size: 1rem !important;
}

#recapitulatif h5 {
    font-size: 15px !important;
    font-weight: 500 !important;
    color: gray !important;
}

.price-sub-title {
    color: #757575 !important;
    font-weight: 500 !important;
    font-size: 1rem !important;
}

#informations-container {
    padding-bottom: 2% !important;
}

#option-title label {
    color: #3c77bb !important;
    letter-spacing: 1px !important;
    font-weight: 500 !important;
}

.selected-plot {
    font-weight: 600 !important;
    letter-spacing: 1px !important;
}

.selected-model {
    font-weight: 600 !important;
}

.option-price {
    /*align-items: self-end; */
    font-weight: 600 !important;
    color: red !important;
}

.plot-price {
    /*align-items: self-end; */
    font-weight: 600 !important;
    color: red !important;
}

.elementor-field-group-field_8d1dc6c {
    display: flex !important;
    justify-content: center !important;
    padding: 3% !important;
}

#informations-card {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
}
.elementor-field-group-field_66ed629
    > .e-form__buttons
    > .elementor-field-type-next {
    display: block !important;
}
#packs-finition-wrapper {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

#packs-finition {
    padding-bottom: 3% !important;
    border: solid grey !important;
    border-width: 0px 0px 1px 0px !important;
}

#informations-card {
    border-left: solid 3px transparent !important;
}
#site-header {
    display: none !important;
}

#site-footer {
    display: none !important;
}

/* Style the buttons that are used to open and close the accordion panel */
.accordion {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: first baseline !important;
    padding: 25px !important;
    width: 100% !important;
    border: solid #cfcfcf !important;
    border-width: 1px 0px 0px 0px !important;
    font-weight: bolder !important;
    cursor: pointer !important;
    text-align: left !important;
    outline: none !important;
}

.accordion i {
    font-size: 1.5rem !important;
}

.panel {
    padding: 15px !important;
    display: none;
    flex-direction: column !important;
    overflow: hidden;
    background-color: white !important;
    width: 100% !important;
    gap: 10px !important;
    border: solid #cfcfcf !important;
    border-width: 1px 0px 0px 0px !important;
}

.panel img {
    width: 15% !important;
    border-radius: 1vh !important;
}

#dce-form-step-field_66ed629 > .elementor-field-group-field_b968fa4 {
    display: flex !important;
    flex-direction: row !important;
    overflow: scroll !important;
    max-height: 620px !important;
    height: 95% !important;
}

.finition-single {
    display: flex !important;
    flex-direction: row !important;
    margin-top: 30px !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
}

.finition-single img {
    border: solid 1px #f2f2f2f2 !important;
    width: 20% !important;
    object-fit: cover !important;
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px,
        rgba(27, 31, 35, 0.15) 0px 0px 0px 1px !important;
    background-color: ivory !important;
}

.finition-desc {
    font-size: 1rem !important;
    font-weight: 400 !important;
}

.right-container {
    padding: 40px !important;
    width: 80% !important;
    border: solid 1px #f2f2f2f2 !important;
    border-radius: 1vh !important;
    margin: 0px 0px 0px 20px !important;
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px,
        rgba(27, 31, 35, 0.15) 0px 0px 0px 1px !important;
    background-color: ivory !important;
}

.finition-single > p {
    width: 90% !important;
    margin-left: 20px !important;
    margin-block-start: 0px !important;
    margin-block-end: 0px !important;
    margin-bottom: 0px !important;
}

.finition-single > input {
    width: 10% !important;
}

/* STEPS FORM BUTTONS */
.elementor-field-type-submit button {
    font-family: "Montserrat", Sans-serif !important;
    font-size: 15px !important;
    padding: 5px 15px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 2px !important;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px,
        rgba(0, 0, 0, 0.06) 0px 2px 4px -1px !important;
}

form#model_config_form {
    display: flex !important;
    flex-direction: row !important;
}

label.e-form__indicators__indicator__label {
    font-weight: 500 !important;
    color: black !important;
    font-size: large !important;
    text-transform: uppercase !important;
}

#model_config_form > .e-form__indicators {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    border: solid 0px #cfcfcf !important;
    padding: 0px !important;
    gap: 10px !important;
    width: 30% !important;
    border-width: 0px 1px 0px 0px !important;
    height: 100vh;
    margin-bottom: 0px !important;
}

.elementor-form-fields-wrapper.elementor-labels-above {
    width: 100%;
}

.e-form__indicators__indicator,
.e-form__indicators__indicator--state-inactive {
    display: flex !important;
    flex-direction: row !important;
    width: 100% !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    padding: 30px !important;
    border: solid #ddd !important;
    border-width: 1px 0px 1px 0px !important;
    border-left-color: #0088ff !important;
    border-left-width: 5px !important;
}

.e-form__indicators__indicator__number,
.e-form__indicators__indicator--shape-circle {
    display: none !important;
}

#model_config_form
    > .e-form__indicators
    > .e-form__indicators__indicator__separator {
    display: none !important;
}

#dce-form-step-field_66ed629 > .e-form__buttons {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
}

#dce-form-step-field_66ed629
    > .e-form__buttons
    > .elementor-field-type-previous {
    width: 20% !important;
}

#dce-form-step-field_66ed629 .elementor-field-type-next {
    display: flex !important;
}

#packs-links {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    cursor: pointer !important;
    padding: 15px !important;
    background-color: #3c77a0 !important;
    color: white !important;
    text-transform: uppercase !important;
    font-size: 1rem !important;
    border-radius: 5px !important;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px,
        rgba(0, 0, 0, 0.06) 0px 2px 4px -1px !important;
    margin: 15px 180px !important;
    width: 100% !important;
    gap: 20% !important;
}

#packs-links:hover {
    background-color: #3c77bb !important;
}

.elementor-field-group-field_4ae6fd8 {
    padding: 0px !important;
}

.elementor-field-group-field_4ae6fd8 img {
    border-radius: 5px 5px 0px 0px !important;
}

.elementor-field-group {
    padding: 0px !important;
    margin: 0px !important;
}

/**Formulaire globale**/

#popup {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: rgba(0, 0, 0, 0.5) !important;
    display: none;
    justify-content: center !important;
    align-items: center !important;
    z-index: 50 !important;
}

#popup-content {
    background: white !important;
    padding: 20px !important;
    border-radius: 5px !important;
    text-align: center !important;
}

#popup-content a {
    font-weight: 600 !important;
    background-color: #3c77bb !important;
    padding: 5px !important;
    border-radius: 5px !important;
    color: white !important;
    letter-spacing: 1px !important;
    font-size: 15px !important;
    text-transform: uppercase !important;
    display: flex !important;
    flex-direction: row !important;
    margin: 0px 30px !important;
    justify-content: space-evenly !important;
    gap: 15px !important;
    justify-content: center !important;
    align-items: center !important;
}

#popup-content a:hover {
    background-color: #2da7e1 !important;
}

/** ÉTAPE 5 : CONTACT FORM **/

#dce-form-step-field_739f6be input[type="radio"] {
    display: inline !important;
    border-radius: 1vh !important;
}

#dce-form-step-field_739f6be > .e-form__buttons {
    flex-wrap: nowrap !important;
}

#dce-form-step-field_739f6be
    > .e-form__buttons
    > .elementor-field-type-previous {
    width: 50% !important;
}

#dce-form-step-field_739f6be
    > .e-form__buttons
    > .elementor-field-type-previous
    > .elementor-field-type-submit {
    width: 50% !important;
    display: flex;
    padding: 10px !important;
    justify-content: flex-start;
}

#dce-form-step-field_739f6be {
    padding: 1vh !important;
}

#form-field-field_c439a35 {
    margin-right: 10px !important;
}

#dce-form-step-field_739f6be
    > .elementor-field-type-radio
    > .elementor-subgroup-inline {
    gap: 15px !important;
}

#dce-form-step-field_739f6be input {
    border-radius: 1vh !important;
    margin-bottom: 15px !important;
}

#dce-form-step-field_739f6be > div input:hover,
textarea:hover {
    box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px,
        rgba(60, 64, 67, 0.15) 0px 1px 3px 1px !important;
    border-color: #3c77bb !important;
    color: #3c77bb !important;
}

#dce-form-step-field_739f6be > div input:focus,
textarea:focus {
    box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px,
        rgba(60, 64, 67, 0.15) 0px 1px 3px 1px !important;
    border-color: #3c77bb !important;
    color: #3c77bb !important;
}

#dce-form-step-field_739f6be h4 {
    text-align: center !important;
}

.elementor-form-fields-wrapper {
    justify-content: center !important;
    margin: 0px !important;
}

#dce-form-step-field_739f6be input[type="radio"] {
    opacity: 1 !important;
}

#dce-form-step-field_739f6be input[type="radio"]:checked + label {
    border-width: 0px !important;
}

/**INPUT TYPE=RADIO**/

input[type="radio"]:checked + label {
    border: 2px solid #3c77bb !important;
    border-radius: 5px !important;
}

input[type="radio"] {
    display: none !important;
}

label:checked {
    border-color: #3c77bb !important;
}

.elementor-field-type-previous button {
    padding: 5px 15px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 2px !important;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px,
        rgba(0, 0, 0, 0.06) 0px 2px 4px -1px !important;
}

.elementor-field-type-next button {
    padding: 5px 15px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 2px !important;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px,
        rgba(0, 0, 0, 0.06) 0px 2px 4px -1px !important;
}
.elementor-field-type-previous {
    width: 100% !important;
    padding: 10px !important;
}

.elementor-field-type-next {
    width: 100% !important;
    padding: 10px !important;
}

.e-form__buttons {
    margin: 0px 0px 15px 0px !important;
}

/**BOUTTON POSITION**/

#dce-form-step-field_2684621,
#dce-form-step-field_df0df43,
#dce-form-step-field_66ed629,
#dce-form-step-field_85e5dc4 {
    flex-direction: column-reverse !important;
}

#dce-form-step-field_df0df43 > .elementor-field-group-field_8d1dc6c {
    order: -1 !important;
}

/**FINITIONS***/
.ircf-form-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 15px !important;
}

.ircf-form-container > label > div {
    display: flex !important;
    flex: max-content !important;
    flex-direction: row !important;
    gap: 10px !important;
}

.options-container {
    display: flex !important;
    flex-direction: row !important;
    padding: 0vh 1vh !important;
    gap: 1vh !important;
    width: 100% !important;
    flex-wrap: wrap !important;
}

.options-container label {
    cursor: pointer !important;
    display: flex !important;
    flex-direction: row-reverse !important;
    padding: 10px !important;
    gap: 10px !important;
    background-color: #3c77bb !important;
    border-radius: 5px !important;
    margin: 10px 0px !important;
    color: white !important;
    font-weight: 500 !important;
}

.options-container label:hover {
    background-color: #2da7e1 !important;
    box-shadow: rgba(50, 50, 105, 0.15) 0px 2px 5px 0px,
        rgba(0, 0, 0, 0.05) 0px 1px 1px 0px !important;
}

.finition-name {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

.finition-content {
    padding: 1vh !important;
    margin: 1vh !important;
    border: 1px solid #3c77a0 !important;
    border-radius: 5px !important;
    display: flex !important;
    flex-direction: row !important;
    gap: 10px !important;
    align-items: baseline !important;
}

.finition-content i {
    color: blue !important;
}

.option-title {
    margin: 20px 0px !important;
    font-size: xx-large !important;
    font-weight: initial !important;
}

.finitions-type {
    margin: 10px !important;
}

.elementor-field-group-field_ba24909 p {
    padding: 2vh !important;
    background-color: blanchedalmond !important;
    margin: 1vh 2vh !important;
    border-radius: 5px !important;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2) !important;
}

.elementor-shortocode {
    z-index: 0 !important;
    position: relative !important;
}

.option-label-input {
    display: flex !important;
    flex-direction: row !important;
    align-content: stretch;
    align-items: flex-end !important;
    border-radius: 1vh !important;
    border: solid 1px #f2f2f2f2 !important;
    gap: 10px !important;
    cursor: pointer !important;
    font-weight: 500 !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px,
        rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
}

.option-label-input p {
    margin-bottom: 0px !important;
    margin-block-start: 0px !important;
    margin-block-end: 0px !important;
    padding: 10px !important;
    border: solid #f2f2f2 !important;
    border-width: 0px 0px 0px 1px !important;
}

.option-label-input span {
    padding: 10px !important;
}

.option-label-input:hover {
    box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px,
        rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
    color: #3c77bb !important;
}

.finition-div-container {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
}

/**MESSAGE INDICAIF**/
#help-message-container {
    position: fixed !important;
    left: 6vh !important;
    top: 1vh !important;
    z-index: 1 !important;
    padding: 10px !important;
    margin: 5px 10px !important;
    background: rgba(255, 255, 255, 1) !important;
    color: black !important;
    font-weight: 400 !important;
    border-radius: 1vh !important;
    border: solid 1px #f2f2f2f2 !important;
    width: fit-content !important;
    line-height: 2vh !important;
    max-width: 880px !important;
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px,
        rgba(27, 31, 35, 0.15) 0px 0px 0px 1px !important;
}

#help-message-container > p {
    margin-bottom: unset !important;
    margin-block-start: unset !important;
    margin-block-end: unset !important;
}
/**FORMULAIRE DE FIN**/
.elementor-field-group-field_944defb > .elementor-field-label {
    width: 100% !important;
    text-align: center !important;
}
/**Button container**/

#dce-form-step-field_739f6be
    > .e-form__buttons
    > .elementor-field-type-previous {
    display: flex !important;
    justify-content: flex-end !important;
}

#dce-form-step-field_739f6be > .e-form__buttons > .elementor-field-type-submit {
    display: flex !important;
    padding: 10px !important;
    justify-content: flex-end !important;
}

.select2-search input {
    display: flex !important;
    align-content: stretch !important;
    flex-wrap: wrap !important;
    width: 591.312px !important;
    height: 20px !important;
    margin: 0px !important;
    box-shadow: rgba(60, 64, 67, 0.3) 0px 0px 0px 0px,
        rgba(60, 64, 67, 0.15) 0px 0px 0px 0px !important;
    padding: 5px !important;
}

div#container {
    height: 100vh !important;
    overflow: auto !important;
    background-image: url(https://www.maisons-alienor.fr/wp-content/uploads/sites/25/2024/03/constructeur-de-maisons-individuelles-maisons-alienor-perigord-dordogne-correze-lot-gironde-maison-1-3-2.jpg);
    background-repeat: no-repeat !important;
    background-size: cover !important;
    color: white !important;
}

div#container img {
    border-radius: 10px !important;
}

div#container h2 {
    color: white !important;
}

div#background-overlay {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    padding: 30px;
}

div#outside-imgs-container,
div#inside-imgs-container {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    padding-bottom: 15px !important;
    gap: 10px !important;
    font-weight: 500 !important;
}

div#inside-imgs-container img {
    background-color: white !important;
    border: solid 1px #ddd !important;
}

p.copyright-informations {
    padding: 30px !important;
    font-weight: 400 !important;
}

.elementor-field-group-field_2f6b69c
    > .elementor-column
    > .elementor-field-group.e-form__buttons__wrapper.elementor-field-type-previous {
    display: none !important;
}

.elementor-field-group-field_6671ba4
    > .e-form__buttons.elementor-column.elementor-col-100 {
    display: none !important;
}

.elementor-field-group-field_2f6b69c
    > .e-form__buttons.elementor-column.elementor-col-100 {
    display: none;
}

div#navigation-buttons-container {
    display: flex !important;
    flex-direction: row-reverse !important;
    gap: 15px !important;
}

.elementor-field-type-step.elementor-column.elementor-field-group-field_df0df43.elementor-col-100.e-form__step {
    background-image: url(https://www.maisons-alienor.fr/wp-content/uploads/sites/25/2024/03/constructeur-de-maisons-individuelles-maisons-alienor-perigord-dordogne-correze-lot-gironde-maison-1-3-2.jpg);
    background-repeat: no-repeat !important;
    background-size: cover !important;
}

.elementor-field-group-field_3a72f7d
    > .e-form__buttons
    > .elementor-field-type-next {
    display: block !important;
}