/* ==========================================================================
   FORMULAIRE DE CONTACT BKB CHEMICALS (Contact Form 7)
   Page : /contact/
   Sélecteurs : .bkb-contact-form, [data-id="3b22e6e"], [data-id="aa485c5"]
   ========================================================================== */

/* 1. Conteneur principal du formulaire */
.elementor-element-3b22e6e .wpcf7,
.elementor-element-aa485c5 .wpcf7,
[data-id="3b22e6e"] .wpcf7,
[data-id="aa485c5"] .wpcf7,
.bkb-contact-form .wpcf7 {
    width: 100% !important;
    max-width: 520px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

.elementor-element-3b22e6e .wpcf7-form,
.elementor-element-aa485c5 .wpcf7-form,
[data-id="3b22e6e"] .wpcf7-form,
[data-id="aa485c5"] .wpcf7-form,
.bkb-contact-form .wpcf7-form {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 2. Groupes de champs (<p>) et Labels */
.elementor-element-3b22e6e .wpcf7-form p,
.elementor-element-aa485c5 .wpcf7-form p,
[data-id="3b22e6e"] .wpcf7-form p,
[data-id="aa485c5"] .wpcf7-form p,
.bkb-contact-form .wpcf7-form p {
    margin: 0 0 18px 0 !important;
    padding: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.elementor-element-3b22e6e .wpcf7-form label,
.elementor-element-aa485c5 .wpcf7-form label,
[data-id="3b22e6e"] .wpcf7-form label,
[data-id="aa485c5"] .wpcf7-form label,
.bkb-contact-form .wpcf7-form label {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    width: 100% !important;
    font-family: "Clash Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #142822 !important;
    line-height: 1.2 !important;
    letter-spacing: normal !important;
    box-sizing: border-box !important;
}

/* Suppression des <br> automatiques générés par Contact Form 7 */
.elementor-element-3b22e6e .wpcf7-form label br,
.elementor-element-aa485c5 .wpcf7-form label br,
[data-id="3b22e6e"] .wpcf7-form label br,
[data-id="aa485c5"] .wpcf7-form label br,
.bkb-contact-form .wpcf7-form label br {
    display: none !important;
}

/* Conteneur de contrôle interne */
.elementor-element-3b22e6e .wpcf7-form-control-wrap,
.elementor-element-aa485c5 .wpcf7-form-control-wrap,
[data-id="3b22e6e"] .wpcf7-form-control-wrap,
[data-id="aa485c5"] .wpcf7-form-control-wrap,
.bkb-contact-form .wpcf7-form-control-wrap {
    display: block !important;
    width: 100% !important;
    position: relative !important;
    box-sizing: border-box !important;
}

/* 3. Style des champs de saisie (Inputs, Textarea, Select) */
.elementor-element-3b22e6e .wpcf7-form input[type="text"],
.elementor-element-3b22e6e .wpcf7-form input[type="email"],
.elementor-element-3b22e6e .wpcf7-form input[type="tel"],
.elementor-element-3b22e6e .wpcf7-form input[type="url"],
.elementor-element-3b22e6e .wpcf7-form textarea,
.elementor-element-3b22e6e .wpcf7-form select,
.elementor-element-aa485c5 .wpcf7-form input[type="text"],
.elementor-element-aa485c5 .wpcf7-form input[type="email"],
.elementor-element-aa485c5 .wpcf7-form input[type="tel"],
.elementor-element-aa485c5 .wpcf7-form input[type="url"],
.elementor-element-aa485c5 .wpcf7-form textarea,
.elementor-element-aa485c5 .wpcf7-form select,
[data-id="3b22e6e"] .wpcf7-form input[type="text"],
[data-id="3b22e6e"] .wpcf7-form input[type="email"],
[data-id="3b22e6e"] .wpcf7-form input[type="tel"],
[data-id="3b22e6e"] .wpcf7-form input[type="url"],
[data-id="3b22e6e"] .wpcf7-form textarea,
[data-id="3b22e6e"] .wpcf7-form select,
[data-id="aa485c5"] .wpcf7-form input[type="text"],
[data-id="aa485c5"] .wpcf7-form input[type="email"],
[data-id="aa485c5"] .wpcf7-form input[type="tel"],
[data-id="aa485c5"] .wpcf7-form input[type="url"],
[data-id="aa485c5"] .wpcf7-form textarea,
[data-id="aa485c5"] .wpcf7-form select,
.bkb-contact-form .wpcf7-form input[type="text"],
.bkb-contact-form .wpcf7-form input[type="email"],
.bkb-contact-form .wpcf7-form input[type="tel"],
.bkb-contact-form .wpcf7-form input[type="url"],
.bkb-contact-form .wpcf7-form textarea,
.bkb-contact-form .wpcf7-form select {
    width: 100% !important;
    box-sizing: border-box !important;
    font-family: "Clash Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #142822 !important;
    background-color: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 6px !important;
    padding: 12px 16px !important;
    outline: none !important;
    box-shadow: none !important;
    transition: border-color 0.25s ease, box-shadow 0.25s ease !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

/* Placeholders subtils en gris clair */
.elementor-element-3b22e6e .wpcf7-form input::placeholder,
.elementor-element-3b22e6e .wpcf7-form textarea::placeholder,
.elementor-element-aa485c5 .wpcf7-form input::placeholder,
.elementor-element-aa485c5 .wpcf7-form textarea::placeholder,
[data-id="3b22e6e"] .wpcf7-form input::placeholder,
[data-id="3b22e6e"] .wpcf7-form textarea::placeholder,
[data-id="aa485c5"] .wpcf7-form input::placeholder,
[data-id="aa485c5"] .wpcf7-form textarea::placeholder,
.bkb-contact-form .wpcf7-form input::placeholder,
.bkb-contact-form .wpcf7-form textarea::placeholder {
    color: #94a3b8 !important;
    opacity: 1 !important;
}

/* État au focus : liséré vert BKB subtil */
.elementor-element-3b22e6e .wpcf7-form input:focus,
.elementor-element-3b22e6e .wpcf7-form textarea:focus,
.elementor-element-3b22e6e .wpcf7-form select:focus,
.elementor-element-aa485c5 .wpcf7-form input:focus,
.elementor-element-aa485c5 .wpcf7-form textarea:focus,
.elementor-element-aa485c5 .wpcf7-form select:focus,
[data-id="3b22e6e"] .wpcf7-form input:focus,
[data-id="3b22e6e"] .wpcf7-form textarea:focus,
[data-id="3b22e6e"] .wpcf7-form select:focus,
[data-id="aa485c5"] .wpcf7-form input:focus,
[data-id="aa485c5"] .wpcf7-form textarea:focus,
[data-id="aa485c5"] .wpcf7-form select:focus,
.bkb-contact-form .wpcf7-form input:focus,
.bkb-contact-form .wpcf7-form textarea:focus,
.bkb-contact-form .wpcf7-form select:focus {
    border-color: #00642e !important;
    box-shadow: 0 0 0 3px rgba(0, 100, 46, 0.12) !important;
}

/* Zone de Message compacte et élégante (comme sur la maquette) */
.elementor-element-3b22e6e .wpcf7-form textarea,
.elementor-element-aa485c5 .wpcf7-form textarea,
[data-id="3b22e6e"] .wpcf7-form textarea,
[data-id="aa485c5"] .wpcf7-form textarea,
.bkb-contact-form .wpcf7-form textarea {
    min-height: 85px !important;
    height: 85px !important;
    resize: vertical !important;
}

/* Indicateur chevron pour 'Objet du message' (comme sur la maquette) */
.elementor-element-3b22e6e .wpcf7-form-control-wrap[data-name="your-subject"]::after,
.elementor-element-aa485c5 .wpcf7-form-control-wrap[data-name="your-subject"]::after,
[data-id="3b22e6e"] .wpcf7-form-control-wrap[data-name="your-subject"]::after,
[data-id="aa485c5"] .wpcf7-form-control-wrap[data-name="your-subject"]::after,
.bkb-contact-form .wpcf7-form-control-wrap[data-name="your-subject"]::after {
    content: '' !important;
    position: absolute !important;
    right: 16px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 10px !important;
    height: 6px !important;
    background-image: url("https://bkb.goavana.com/wp-content/uploads/2026/09/Vector.png") !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    pointer-events: none !important;
}

/* 4. Bouton 'Envoyer' aligné à droite (Design signature BKB CTA) */
.elementor-element-3b22e6e .wpcf7-form p:has(.wpcf7-submit),
.elementor-element-3b22e6e .wpcf7-form p:last-of-type,
.elementor-element-aa485c5 .wpcf7-form p:has(.wpcf7-submit),
.elementor-element-aa485c5 .wpcf7-form p:last-of-type,
[data-id="3b22e6e"] .wpcf7-form p:has(.wpcf7-submit),
[data-id="3b22e6e"] .wpcf7-form p:last-of-type,
[data-id="aa485c5"] .wpcf7-form p:has(.wpcf7-submit),
[data-id="aa485c5"] .wpcf7-form p:last-of-type,
.bkb-contact-form .wpcf7-form p:has(.wpcf7-submit),
.bkb-contact-form .wpcf7-form p:last-of-type {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    margin-top: 60px !important;
    margin-bottom: 0 !important;
    width: 100% !important;
}

.elementor-element-3b22e6e .wpcf7-submit,
.elementor-element-aa485c5 .wpcf7-submit,
[data-id="3b22e6e"] .wpcf7-submit,
[data-id="aa485c5"] .wpcf7-submit,
.bkb-contact-form .wpcf7-submit {
    appearance: none !important;
    -webkit-appearance: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 60px 0 24px !important;
    background-color: #142822 !important; /* Fond vert très sombre BKB */
    background-image: 
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 512'%3E%3Cpath fill='%23142822' d='M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z'/%3E%3C/svg%3E"),
        linear-gradient(#ffffff, #ffffff) !important;
    background-repeat: no-repeat, no-repeat !important;
    background-size: 13px 13px, 40px 40px !important;
    background-position: right 17px center, right 4px center !important;
    color: #ffffff !important;
    font-family: "Clash Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    border: none !important;
    border-radius: 0 !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
    box-shadow: none !important;
    text-decoration: none !important;
    transition: background-size 0.3s cubic-bezier(0.25, 1, 0.5, 1),
                background-position 0.3s cubic-bezier(0.25, 1, 0.5, 1),
                padding 0.3s cubic-bezier(0.25, 1, 0.5, 1),
                background-color 0.25s ease !important;
}

/* Animation au survol du bouton 'Envoyer' */
.elementor-element-3b22e6e .wpcf7-submit:hover,
.elementor-element-aa485c5 .wpcf7-submit:hover,
[data-id="3b22e6e"] .wpcf7-submit:hover,
[data-id="aa485c5"] .wpcf7-submit:hover,
.bkb-contact-form .wpcf7-submit:hover {
    background-size: 13px 13px, 56px 40px !important;
    background-position: right 25px center, right 4px center !important;
    padding-right: 76px !important;
    background-color: #0b1a15 !important;
}

/* Spinner de chargement Contact Form 7 */
.elementor-element-3b22e6e .wpcf7-spinner,
.elementor-element-aa485c5 .wpcf7-spinner,
[data-id="3b22e6e"] .wpcf7-spinner,
[data-id="aa485c5"] .wpcf7-spinner,
.bkb-contact-form .wpcf7-spinner {
    margin: 0 12px 0 0 !important;
    order: -1 !important;
}

/* 5. Messages de validation et réponse Contact Form 7 */
.wpcf7-not-valid-tip {
    font-family: "Clash Grotesk", sans-serif !important;
    font-size: 12px !important;
    color: #dc2626 !important;
    margin-top: 5px !important;
    display: block !important;
}

.wpcf7-response-output {
    margin: 20px 0 0 0 !important;
    padding: 12px 18px !important;
    border-radius: 6px !important;
    font-family: "Clash Grotesk", sans-serif !important;
    font-size: 14px !important;
    box-sizing: border-box !important;
}

/* 6. Responsive Mobile */
@media (max-width: 767px) {
    .elementor-element-3b22e6e .wpcf7,
    .elementor-element-aa485c5 .wpcf7,
    [data-id="3b22e6e"] .wpcf7,
    [data-id="aa485c5"] .wpcf7,
    .bkb-contact-form .wpcf7 {
        max-width: 100% !important;
    }

    .elementor-element-3b22e6e .wpcf7-form p:has(.wpcf7-submit),
    .elementor-element-3b22e6e .wpcf7-form p:last-of-type,
    .elementor-element-aa485c5 .wpcf7-form p:has(.wpcf7-submit),
    .elementor-element-aa485c5 .wpcf7-form p:last-of-type,
    [data-id="3b22e6e"] .wpcf7-form p:has(.wpcf7-submit),
    [data-id="3b22e6e"] .wpcf7-form p:last-of-type,
    [data-id="aa485c5"] .wpcf7-form p:has(.wpcf7-submit),
    [data-id="aa485c5"] .wpcf7-form p:last-of-type,
    .bkb-contact-form .wpcf7-form p:has(.wpcf7-submit),
    .bkb-contact-form .wpcf7-form p:last-of-type {
        margin-top: 28px !important;
    }
}