.elementor-57 .elementor-element.elementor-element-af01d9a{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-57 .elementor-element.elementor-element-9aef3b6{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}body.elementor-page-57:not(.elementor-motion-effects-element-type-background), body.elementor-page-57 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F7FCFF;}/* Start custom CSS for container, class: .elementor-element-af01d9a */:root {
    --apv-bg:      #1a273b;
    --apv-bg2:     #1e2d45;
    --apv-bg3:     #152132;
    --apv-ac:      #00b3f0;
    --apv-acl:     #33c4f3;
    --apv-t:       #ffffff;
    --apv-tm:      #94a3b8;
    --apv-td:      #3d5270;
    --apv-er:      #ff4757;
    --apv-b:       rgba(255,255,255,.07);
    --apv-bg-ac:   rgba(0,179,240,.08);
    --apv-b-ac:    rgba(0,179,240,.3);
    --apv-ease:    cubic-bezier(.4,0,.2,1);
}

.wpcf7-response-output, .wpcf7-not-valid-tip { display: none !important; }

/* ====================================================
   WRAPPER PRINCIPAL & EN-TÊTE
   ==================================================== */
.premium-booking-form {
    font-family: 'Maven Pro', sans-serif !important;
    background-color: var(--apv-bg) !important;
    padding: 48px 52px !important;
    border-radius: 14px !important;
    width: 95% !important;          
    max-width: 1100px !important;   
    margin: 44px auto !important;
    color: var(--apv-t) !important;
    position: relative !important;
    box-sizing: border-box !important;
    border: 1px solid var(--apv-b) !important;
}
.premium-booking-form * { box-sizing: border-box !important; }

.form-main-header { text-align: center !important; margin-bottom: 40px !important; }
.form-main-header h2::before {
    content: 'Prise de rendez-vous après-vente' !important; 
    display: block !important;
    font-family: 'Maven Pro', sans-serif !important;
    font-size: 18px !important; 
    font-weight: 600 !important;
    letter-spacing: 2px !important; 
    text-transform: uppercase !important;
    color: var(--apv-ac) !important;
    margin-bottom: 12px !important; 
}
.form-main-header h2 {
    font-size: 28px !important; font-weight: 700 !important; color: var(--apv-t) !important; margin: 0 !important;
}

/* ====================================================
   BARRE DE PROGRESSION
   ==================================================== */
.progress-container { position: relative !important; margin-bottom: 44px !important; }
.progress-line {
    position: absolute !important; top: 17px !important; left: 12.5% !important; right: 12.5% !important;
    height: 1px !important; background: var(--apv-b) !important; z-index: 1 !important; overflow: hidden !important;
}
.progress-line-fill {
    position: absolute !important; top: 0; left: 0; bottom: 0 !important;
    width: 0% !important; background: var(--apv-ac) !important; transition: width .65s var(--apv-ease) !important;
}
.progress-steps { display: flex !important; justify-content: space-between !important; position: relative !important; z-index: 2 !important; }
.step-col { display: flex !important; flex-direction: column !important; align-items: center !important; width: 25% !important; gap: 8px !important; }
.step-circle {
    width: 36px !important; height: 36px !important; border-radius: 50% !important; background: var(--apv-bg) !important;
    border: 1.5px solid var(--apv-td) !important; display: flex !important; align-items: center !important; justify-content: center !important;
    font-size: 13px !important; font-weight: 600 !important; color: var(--apv-td) !important; transition: all .35s var(--apv-ease) !important;
    position: relative !important;
}
.step-text { font-size: 10px !important; font-weight: 600 !important; letter-spacing: .5px !important; text-transform: uppercase !important; color: var(--apv-td) !important; transition: color .25s !important; text-align: center !important; }

.step-col.completed .step-circle { background: var(--apv-ac) !important; border-color: var(--apv-ac) !important; color: var(--apv-bg) !important; }
.step-col.completed .step-text { color: var(--apv-tm) !important; }
.step-col.active .step-circle { background: var(--apv-bg) !important; border-color: var(--apv-ac) !important; border-width: 2px !important; color: var(--apv-ac) !important; }
.step-col.active .step-circle::after {
    content: '' !important; position: absolute !important; inset: -6px !important; border-radius: 50% !important;
    border: 1px solid rgba(0,179,240,.2) !important; animation: apvRing 2.5s ease-in-out infinite !important;
}
@keyframes apvRing { 0%, 100% { transform: scale(.84); opacity: .5; } 50% { transform: scale(1.16); opacity: .07; } }
.step-col.active .step-text { color: var(--apv-ac) !important; font-weight: 700 !important; }

.form-step { display: none !important; }
.form-step.active { display: block !important; }

/* ====================================================
   CARTES DE SÉLECTION DES SITES
   ==================================================== */
.site-cards-container { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 13px !important; margin-bottom: 32px !important; }
.custom-site-card {
    background-color: var(--apv-bg2) !important; border: 1px solid var(--apv-b) !important; border-radius: 10px !important;
    cursor: pointer !important; display: flex !important; flex-direction: column !important; align-items: center !important;
    text-align: center !important; transition: all .22s var(--apv-ease) !important; padding: 0 !important;
}
.card-content { padding: 16px 12px 12px !important; }
.card-content h4 { font-size: 13px !important; font-weight: 700 !important; color: var(--apv-t) !important; margin: 0 0 6px !important; }
.card-content p { font-size: 11.5px !important; color: var(--apv-tm) !important; margin: 0 !important; }
.card-circle { width: 8px !important; height: 8px !important; border-radius: 50% !important; border: 1.5px solid var(--apv-td) !important; margin: 10px auto 14px !important; transition: all .25s !important; }
.custom-site-card:hover { border-color: rgba(255,255,255,.13) !important; transform: translateY(-2px) !important; }
.custom-site-card.active { border-color: var(--apv-b-ac) !important; background-color: var(--apv-bg-ac) !important; }
.custom-site-card.active .card-circle { background: var(--apv-ac) !important; border-color: var(--apv-ac) !important; }

/* ====================================================
   GRILLES, INPUTS ET AÉRATION
   ==================================================== */
.form-grid, .date-row { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 32px !important; row-gap: 48px !important; margin-bottom: 48px !important; align-items: flex-start !important; }
.margin-top { margin-top: 48px !important; }

.depth-input label { display: block !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: 1.5px !important; text-transform: uppercase !important; color: var(--apv-t) !important; margin-bottom: 8px !important; }
.depth-input p, .wpcf7-form-control-wrap { margin: 0 !important; padding: 0 !important; display: block !important; }
.depth-input br, .wpcf7-form-control-wrap br { display: none !important; }

.depth-input input.wpcf7-form-control:not([type="checkbox"]):not([type="radio"]),
.depth-input select.wpcf7-form-control, .depth-input textarea.wpcf7-form-control {
    width: 100% !important; padding: 11px 14px !important; border: 1px solid var(--apv-b) !important; border-radius: 7px !important; background-color: var(--apv-bg2) !important; font-family: 'Maven Pro', sans-serif !important; font-size: 14px !important; color: var(--apv-t) !important; transition: all .2s !important; outline: none !important;
}
.depth-input .wpcf7-form-control:focus { border-color: var(--apv-ac) !important; box-shadow: 0 0 0 2px rgba(0,179,240,.1) !important; }
.depth-input .wpcf7-form-control::placeholder { color: rgba(148, 163, 184, 0.4) !important; }

/* ====================================================
   BOUTONS HORAIRES EN DUR
   ==================================================== */
.hours-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
    width: 100% !important;
}
.hour-btn {
    background-color: var(--apv-bg2) !important;
    border: 1px solid var(--apv-b) !important;
    border-radius: 7px !important;
    padding: 11px 5px !important;
    text-align: center !important;
    color: var(--apv-t) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all .2s var(--apv-ease) !important;
    user-select: none !important;
}
.hour-btn:hover {
    border-color: rgba(255,255,255,.13) !important;
    background-color: var(--apv-bg3) !important;
    color: var(--apv-ac) !important;
}
.hour-btn.selected {
    background-color: var(--apv-ac) !important;
    border-color: var(--apv-ac) !important;
    color: #000 !important;
}
.hour-btn.has-error {
    border-color: #ff4757 !important;
    border-width: 2px !important;
    background-color: rgba(255,71,87,.04) !important;
}

/* ====================================================
   MENU DÉROULANT CUSTOM (Véhicule de remplacement)
   ==================================================== */
.custom-dropdown { position: relative !important; width: 100% !important; }
.dropdown-trigger {
    width: 100% !important; padding: 11px 14px !important; border: 1px solid var(--apv-b) !important; border-radius: 7px !important; background-color: var(--apv-bg2) !important; color: var(--apv-tm) !important; font-family: 'Maven Pro', sans-serif !important; font-size: 14px !important; cursor: pointer !important; display: flex !important; justify-content: space-between !important; align-items: center !important; transition: border-color .2s, box-shadow .2s !important;
}
.dropdown-trigger::after { content: '\25BE' !important; font-size: 10px !important; color: var(--apv-tm) !important; transition: transform .2s !important; flex-shrink: 0 !important; }
.custom-dropdown.open .dropdown-trigger { border-color: var(--apv-ac) !important; box-shadow: 0 0 0 2px rgba(0,179,240,.1) !important; }
.custom-dropdown.open .dropdown-trigger::after { transform: rotate(180deg) !important; }
.dropdown-trigger.has-error { border-color: var(--apv-er) !important; }
.dropdown-menu {
    position: absolute !important; top: calc(100% + 4px) !important; left: 0 !important; right: 0 !important; background-color: var(--apv-bg3) !important; border: 1px solid rgba(0,179,240,.18) !important; border-radius: 8px !important; z-index: 999 !important; display: none !important; overflow: hidden !important;
}
.custom-dropdown.open .dropdown-menu { display: block !important; animation: apvMenuOpen .18s ease !important; }
@keyframes apvMenuOpen { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }
.dropdown-item { padding: 11px 14px !important; color: var(--apv-t) !important; cursor: pointer !important; border-bottom: 1px solid rgba(255,255,255,.04) !important; font-size: 14px !important; transition: background .12s, padding-left .15s !important; }
.dropdown-item:last-child { border-bottom: none !important; }
.dropdown-item:hover { background-color: var(--apv-bg2) !important; color: var(--apv-ac) !important; padding-left: 20px !important; }

/* ====================================================
   CASES À COCHER PERSONNALISÉES (Services)
   ==================================================== */
.custom-checkboxes .wpcf7-list-item { display: block !important; margin: 0 0 10px !important; }
.custom-checkboxes label { 
    display: flex !important; align-items: center !important; cursor: pointer !important; 
    color: var(--apv-tm) !important; font-size: 14px !important; font-weight: 400 !important; margin: 0 !important; transition: all .2s var(--apv-ease) !important; 
}
span.wpcf7-form-control.wpcf7-checkbox { border: none !important; background: transparent !important; padding: 0 !important; margin: 0 !important; box-shadow: none !important; }
.custom-checkboxes input[type="checkbox"] { position: absolute !important; opacity: 0 !important; width: 0 !important; height: 0 !important; margin: 0 !important; pointer-events: none !important; }
.custom-checkboxes input[type="hidden"], .custom-checkboxes .wpcf7-form-control-wrap::before, .custom-checkboxes .wpcf7-form-control-wrap::after, .custom-checkboxes .wpcf7-checkbox::before, .custom-checkboxes .wpcf7-checkbox::after { display: none !important; content: none !important; }
.custom-checkboxes .wpcf7-list-item:empty { display: none !important; }
.custom-checkboxes .wpcf7-list-item-label { position: relative !important; display: flex !important; align-items: center !important; }

.custom-checkboxes .wpcf7-list-item-label::before { 
    content: '' !important; display: inline-block !important; width: 17px !important; height: 17px !important; min-width: 17px !important; margin-right: 10px !important; background-color: var(--apv-bg2) !important; border: 1.5px solid var(--apv-td) !important; border-radius: 4px !important; transition: all .18s !important; 
}
.custom-checkboxes input[type="checkbox"]:checked + .wpcf7-list-item-label::before { background-color: var(--apv-ac) !important; border-color: var(--apv-ac) !important; }
.custom-checkboxes input[type="checkbox"]:checked + .wpcf7-list-item-label::after { content: '\2713' !important; position: absolute !important; left: 3px !important; top: 1px !important; color: var(--apv-bg) !important; font-size: 11px !important; font-weight: 700 !important; }
.custom-checkboxes input[type="checkbox"]:checked + .wpcf7-list-item-label { color: var(--apv-t) !important; font-weight: 700 !important; }

.precision-box { margin-top: 16px !important; padding-left: 32px !important; animation: fadeInSlide .3s var(--apv-ease) forwards !important; }
@keyframes fadeInSlide { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } }

/* ====================================================
   FLATPICKR (CALENDRIER 100% FLUIDE ET INTÉGRÉ)
   ==================================================== */
input.custom-date { display: none !important; }
.flatpickr-calendar.inline { background: var(--apv-bg2) !important; border: 1px solid var(--apv-b) !important; box-shadow: none !important; font-family: 'Maven Pro', sans-serif !important; border-radius: 8px !important; margin-top: 0 !important; width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; padding: 10px !important; }
.flatpickr-innerContainer, .flatpickr-rContainer, .dayContainer, .flatpickr-days { width: 100% !important; min-width: 100% !important; max-width: 100% !important; display: block !important; }
.dayContainer { display: flex !important; flex-wrap: wrap !important; justify-content: space-around !important; }
.flatpickr-day { width: 14% !important; max-width: 14% !important; flex-basis: 14% !important; }
.flatpickr-weekdays { display: flex !important; width: 100% !important; border-bottom: 1px solid var(--apv-b) !important; margin-bottom: 10px !important; }
span.flatpickr-weekday { flex: 1 !important; color: var(--apv-ac) !important; font-weight: 700 !important; background: transparent !important; }
.flatpickr-months, .flatpickr-month { background: transparent !important; color: var(--apv-t) !important; }
.flatpickr-current-month .flatpickr-monthDropdown-months { background: var(--apv-bg2) !important; color: var(--apv-t) !important; border-radius: 4px !important; }
.flatpickr-current-month input.cur-year { color: var(--apv-t) !important; }
.flatpickr-prev-month, .flatpickr-next-month { background: transparent !important; border: none !important; }
.flatpickr-prev-month svg, .flatpickr-next-month svg { fill: var(--apv-ac) !important; }
.flatpickr-prev-month:hover svg, .flatpickr-next-month:hover svg { fill: var(--apv-acl) !important; }
.flatpickr-day { color: var(--apv-t) !important; background: transparent !important; border-color: transparent !important; }
.flatpickr-day:hover { background: var(--apv-bg3) !important; border-color: var(--apv-bg3) !important; }
.flatpickr-day.selected, .flatpickr-day.selected:hover { background: var(--apv-ac) !important; border-color: var(--apv-ac) !important; color: #000 !important; font-weight: 700 !important; }
.flatpickr-day.flatpickr-disabled { color: rgba(255,255,255,0.1) !important; }
.flatpickr-calendar.arrowTop:before, .flatpickr-calendar.arrowTop:after { display: none !important; }

/* ====================================================
   MESSAGES D'ALERTE ET D'ERREUR (Contraste Fort)
   ==================================================== */
.alert-message { background: rgba(0,179,240,.07) !important; border: 1px solid rgba(0,179,240,.15) !important; color: rgba(100,210,245,.9) !important; padding: 11px 15px !important; border-radius: 8px !important; font-size: 13px !important; text-align: center !important; margin-bottom: 32px !important; }
.step-error-msg { 
    background: rgba(255,71,87,.15) !important; 
    border: 2px solid rgba(255,71,87,.4) !important; 
    color: #ff6b7a !important; 
    padding: 12px 15px !important; 
    border-radius: 8px !important; 
    font-size: 13.5px !important; 
    font-weight: 600 !important; 
    text-align: center !important; 
    margin-bottom: 18px !important; 
}
.has-error { 
    border-color: #ff4757 !important; 
    border-width: 2px !important; 
    box-shadow: 0 0 0 4px rgba(255,71,87,.15) !important; 
    background-color: rgba(255,71,87,.04) !important; 
}

/* ====================================================
   BOUTONS D'ACTION (Séparation Extrême & Correction CF7)
   ==================================================== */
.step-actions { 
    margin-top: 32px !important; 
    width: 100% !important;
}
.step-actions p {
    display: flex !important;
    width: 100% !important;
    justify-content: flex-end !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
}
.step-actions p br { display: none !important; }

.btn-prev { margin-right: auto !important; }

.btn-action { 
    background-color: var(--apv-ac) !important; color: #0a111a !important; border: none !important; padding: 12px 28px !important; font-family: 'Maven Pro', sans-serif !important; font-size: 13px !important; font-weight: 700 !important; border-radius: 7px !important; cursor: pointer !important; transition: background-color .2s, transform .2s !important; margin-left: 0 !important;
}
.btn-action:hover { background-color: var(--apv-acl) !important; transform: translateY(-1px) !important; }

.btn-action.ghost { 
    background-color: transparent !important; color: var(--apv-tm) !important; border: 1px solid var(--apv-b) !important; transform: none !important; padding: 8px 16px !important; font-size: 18px !important; display: flex !important; align-items: center !important; justify-content: center !important;
}
.btn-action.ghost:hover { background-color: var(--apv-bg2) !important; color: var(--apv-t) !important; border-color: var(--apv-td) !important; }

/* ====================================================
   ÉCRAN DE SUCCÈS
   ==================================================== */
.success-message {
    text-align: center !important;
    padding: 40px 20px !important;
    animation: fadeInSlide .5s var(--apv-ease) forwards !important;
}
.success-icon {
    width: 50px !important;      /* Bulle réduite à 50px */
    height: 50px !important;     
    background: var(--apv-bg-ac) !important;
    color: var(--apv-ac) !important;
    border: 2px solid var(--apv-ac) !important;
    border-radius: 50% !important;
    font-size: 28px !important;  /* Le logo rétréci pour rentrer dans la bulle */
    font-weight: bold !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 24px !important;
}
.success-message h3 {
    font-size: 24px !important; color: var(--apv-t) !important; margin-bottom: 12px !important; font-family: 'Maven Pro', sans-serif !important;
}
.success-message p {
    font-size: 15px !important; color: var(--apv-tm) !important; line-height: 1.6 !important; margin-bottom: 10px !important;
}

/* ====================================================
   MEDIA QUERIES (RESPONSIVE)
   ==================================================== */
@media (max-width: 900px) { .site-cards-container { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 768px) {
    .premium-booking-form { padding: 32px 20px !important; width: 95% !important; }
    .progress-line { display: none !important; }
    .progress-steps { flex-direction: column !important; gap: 12px !important; align-items: flex-start !important; }
    .step-col { width: 100% !important; flex-direction: row !important; gap: 12px !important; }
    .form-grid, .date-row { grid-template-columns: 1fr !important; }
}/* End custom CSS */