/* doc-project | projet/assets/css/product-configurator-v2/steps/validation.css | Styles scopes de l etape validation du configurateur V2 avec bloc prix statique, croquis recapitulatif, formulaire client masque par defaut, card formulaire distincte et CTA flottant compatible mobile safe-area. | Expose: pcv2-step--validation, pcv2-price--validation-static, pcv2-validation-form-shell, pcv2-validation-floating-cta | Dépend de: product-configurator-v2/base.css, validation-measurements.css | Impacte: affichage etape validation V2 avec recapitulatif seul au chargement, revelation du formulaire final, separation visuelle nette et CTA de commande ou devis | Tables: aucune */
@import url("./validation-measurements.css");
.pcv2-step--validation {
    scroll-margin-top: 24px
}

.pcv2-step--validation .pcv2-summary {
    background: #fffdf8
}

.pcv2-step--validation .pcv2-info {
    color: #5f4634
}

.pcv2-step--validation .pcv2-choice-grid--palette {
    grid-template-columns: repeat(auto-fit,minmax(130px,1fr));
    max-height: 260px;
    overflow: auto
}

.pcv2-step--validation .pcv2-option-card {
    border: 1px solid rgba(82,54,34,.14);
    border-radius: 18px;
    background: #fff;
    padding: 14px;
    display: grid;
    gap: 10px
}

.pcv2-step--validation .pcv2-option-card__select {
    border: 0;
    background: transparent;
    text-align: left;
    font: inherit;
    font-weight: 800;
    color: #3f2a1c;
    cursor: pointer
}

.pcv2-step--validation .pcv2-info__image {
    display: block;
    max-width: 100%;
    border-radius: 14px;
    margin-bottom: 10px
}

.pcv2-step--validation .pcv2-validation-form-shell[hidden],
.pcv2-step--validation .pcv2-validation-floating-cta[hidden] {
    display: none!important
}

.pcv2-step--validation .pcv2-validation-form-shell {
    position: relative;
    display: grid;
    gap: 16px;
    scroll-margin-top: 110px;
    margin-top: clamp(18px,3vw,34px);
    padding: clamp(18px,3vw,28px);
    overflow: hidden;
    border: 1px solid rgba(63,42,28,.24);
    border-radius: 26px;
    background:
        radial-gradient(circle at top left,rgba(255,255,255,.96),rgba(255,255,255,0) 36%),
        linear-gradient(135deg,#fffaf4 0%,#f1dfc7 100%);
    box-shadow: 0 24px 56px rgba(63,42,28,.18),inset 0 1px 0 rgba(255,255,255,.82)
}

.pcv2-step--validation .pcv2-validation-form-shell::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 7px;
    background: linear-gradient(180deg,#8a5a2b,#3f2a1c)
}

.pcv2-step--validation .pcv2-validation-form-shell__header {
    display: grid;
    gap: 4px;
    padding-left: 4px
}

.pcv2-step--validation .pcv2-validation-form-shell__header .pcv2-summary__eyebrow {
    text-align: left;
    font-size: .82rem
}

.pcv2-step--validation .pcv2-validation-floating-cta {
    position: sticky;
    bottom: calc(78px + env(safe-area-inset-bottom,0px));
    z-index: 9;
    display: flex;
    justify-content: center;
    margin-top: 4px;
    padding: 18px 12px calc(12px + env(safe-area-inset-bottom,0px));
    pointer-events: none;
    background: linear-gradient(180deg,rgba(255,250,244,0),rgba(255,250,244,.96) 42%,#fffaf4)
}

.pcv2-step--validation .pcv2-validation-floating-cta__button {
    width: min(100%,360px);
    min-height: 54px;
    pointer-events: auto;
    box-shadow: 0 18px 44px rgba(63,42,28,.28)
}

.pcv2-step--validation.pcv2-validation-form-is-visible {
    padding-bottom: 0
}

.pcv2-step--validation.pcv2-validation-form-is-hidden {
    padding-bottom: 8px
}

@media (max-width:900px) {
    .pcv2-step--validation .pcv2-validation-floating-cta {
        bottom: calc(86px + env(safe-area-inset-bottom,0px));
        padding-inline: 0
    }

    .pcv2-step--validation .pcv2-validation-floating-cta__button {
        width: 100%
    }
}

.pcv2-step--validation .pcv2-choice-card__image {
    width: 100%;
    border-radius: 12px;
    aspect-ratio: 4/3;
    object-fit: cover;
    background: #efe2d2
}

.pcv2-step--validation .pcv2-fieldset+.pcv2-fieldset,.pcv2-step--validation .pcv2-fieldset+.pcv2-field {
    margin-top: 12px
}
.pcv2-step--validation .pcv2-address-panel {
    grid-column: 1/-1;
    border: 1px solid rgba(82,54,34,.16);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(82,54,34,.12);
    padding: 8px
}

.pcv2-step--validation .pcv2-address-option {
    display: block;
    width: 100%;
    border: 0;
    background: transparent;
    text-align: left;
    padding: 10px 12px;
    border-radius: 10px;
    font: inherit;
    color: #3f2a1c;
    cursor: pointer
}

.pcv2-step--validation .pcv2-address-option:hover,.pcv2-step--validation .pcv2-address-option.is-active {
    background: #f5ecdf
}
.pcv2-step--validation .pcv2-price--validation-static {
    position: static;
    background: #3f2a1c;
    color: #fff;
    border-top-left-radius: 0;
    box-shadow: 0 16px 36px rgba(63,42,28,.16)
}
.pcv2-step--validation .pcv2-price--validation-static .pcv2-price__main {
    align-items: flex-start
}
.pcv2-step--validation .pcv2-price--validation-static [data-pcv2-validation-price-hint] {
    display: block;
    margin-top: 4px;
    color: #f4e6d5;
    font-weight: 600
}
.pcv2-step--validation .pcv2-price--validation-static [data-pcv2-validation-price-hint][hidden] {
    display: none
}
.pcv2-step--validation .pcv2-price--validation-static .pcv2-price__details {
    display: block
}
.pcv2-step--validation .pcv2-price--validation-static .pcv2-price__lines {
    display: grid;
    gap: 10px;
    margin-top: 8px
}
.pcv2-step--validation .pcv2-price--validation-static .pcv2-price__validation-total {
    display: flex;
    justify-content: center;
    margin-top: 12px;
    padding-top: 14px;
    border-top: 1px solid rgba(255,255,255,22);
    text-align: center
}
.pcv2-step--validation .pcv2-price--validation-static [data-pcv2-validation-price-total] {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    gap: clamp(18px,4vw,42px);
    font-size: clamp(1.2rem,3vw,1.6rem);
    line-height: 1.2;
    white-space: normal
}
.pcv2-step--validation .pcv2-price--validation-static .pcv2-price__validation-total-label {
    font-weight: 800
}
.pcv2-step--validation .pcv2-price--validation-static .pcv2-price__validation-total-amount {
    font-weight: 900
}
@media (max-width:720px) {
    .pcv2-step--validation .pcv2-price--validation-static .pcv2-price__main {
        display: grid
    }

    .pcv2-step--validation .pcv2-price--validation-static .pcv2-price__validation-total {
        text-align: center
    }

    .pcv2-step--validation .pcv2-price--validation-static [data-pcv2-validation-price-total] {
        flex-wrap: wrap;
        row-gap: 6px
    }}