/* =============================================================================
   Florâme — Comptes Pro
   Formulaire d'inscription (Contact Form 7) + verrous boutique
   Charte (Figma « Design system ») :
     Vert olive foncé  #828D7D   (texte / focus / boutons)
     Vert olive clair  #B3BEAF   (placeholders)
     Olive très clair  #CED9CB   (contour des champs)
     Olive très clair+ #F0F2EF   (fonds doux)
     Blanc             #FFFFFF
     Typo : Montserrat 400/600, corps 16/1.5
   Champs + bouton calés sur le formulaire de connexion du header (flo-login).

   NB : le wrapper .flo-reg-cf7 est rendu À L'INTÉRIEUR du <form.wpcf7-form>
   (CF7 contrôle la balise <form>). Les champs sont donc DESCENDANTS de
   .flo-reg-cf7 — on ne référence jamais .wpcf7-form en parent.
   Préfixe #ajax-content-wrap : passe au-dessus des styles du thème Salient.
   ========================================================================== */

:root{
    --flo-olive:        #828D7D;
    --flo-olive-dark:   #6f7a6a;
    --flo-olive-light:  #B3BEAF;
    --flo-border:       #CED9CB;
    --flo-soft:         #F0F2EF;
    --flo-white:        #FFFFFF;
}

/* ---------------------------------------------------------------------------
   Conteneur = grille flex pleine largeur. Chaque champ est un <p> ;
   demi-largeur si le champ porte .flo-half.
   --------------------------------------------------------------------------- */
#ajax-content-wrap .flo-reg-cf7{
    display:flex !important;
    flex-wrap:wrap !important;
    align-items:flex-start;
    gap:0 20px;
    width:100%;
    max-width:none;
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:"Montserrat",sans-serif;
    color:var(--flo-olive);
    font-size:16px;
    line-height:1.5;
}
#ajax-content-wrap .flo-reg-cf7 > p{
    flex:1 1 100%;
    width:100%;
    margin:0 0 18px;
}
#ajax-content-wrap .flo-reg-cf7 > p:has(.flo-half){
    flex:1 1 calc(50% - 10px);
    width:calc(50% - 10px);
}
/* Sous 690px : tous les champs sur une seule colonne */
@media (max-width:690px){
    #ajax-content-wrap .flo-reg-cf7 > p:has(.flo-half){
        flex:1 1 100%;
        width:100%;
    }
}

/* ---------------------------------------------------------------------------
   Libellés (comme le login : olive, Montserrat 400, sans capitales)
   --------------------------------------------------------------------------- */
#ajax-content-wrap .flo-reg-cf7 label.flo-row{
    display:block;
    margin:0;
    color:var(--flo-olive) !important;
    text-transform:none !important;
    letter-spacing:0 !important;
}
/* le <br> auto-inséré est superflu (le champ est déjà en bloc) */
#ajax-content-wrap .flo-reg-cf7 label.flo-row br{ display:none; }

/* Le champ passe sous le libellé */
#ajax-content-wrap .flo-reg-cf7 .wpcf7-form-control-wrap{
    display:block;
    margin-top:8px;
}

/* ---------------------------------------------------------------------------
   Champs de saisie — identiques au login : fond blanc, contour vert, arrondi 6px
   --------------------------------------------------------------------------- */
#ajax-content-wrap .flo-reg-cf7 input[type=text],
#ajax-content-wrap .flo-reg-cf7 input[type=email],
#ajax-content-wrap .flo-reg-cf7 input[type=tel],
#ajax-content-wrap .flo-reg-cf7 input[type=password],
#ajax-content-wrap .flo-reg-cf7 input[type=number],
#ajax-content-wrap .flo-reg-cf7 select,
#ajax-content-wrap .flo-reg-cf7 textarea{
    -webkit-appearance:none !important; appearance:none !important;
    display:block !important;
    width:100% !important;
    box-sizing:border-box !important;
    margin:0 !important;
    padding:10px 12px !important;
    background-color:#FFF !important;
    border:1px solid var(--nectar-accent-color) !important;
    border-radius:4px !important;
    box-shadow:none !important;
    color:var(--flo-olive) !important;
    transition:border-color .15s ease;
}
#ajax-content-wrap .flo-reg-cf7 textarea{ min-height:110px !important; resize:vertical; }

#ajax-content-wrap .flo-reg-cf7 input::placeholder,
#ajax-content-wrap .flo-reg-cf7 textarea::placeholder{ color:var(--flo-olive-light); }

#ajax-content-wrap .flo-reg-cf7 input:focus,
#ajax-content-wrap .flo-reg-cf7 select:focus,
#ajax-content-wrap .flo-reg-cf7 textarea:focus{
    outline:none !important;
    border-color:var(--flo-olive) !important;
    box-shadow:none !important;
}

/* Select : chevron olive */
#ajax-content-wrap .flo-reg-cf7 select{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23828D7D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
    background-repeat:no-repeat !important;
    background-position:right 14px center !important;
    padding-right:40px !important;
}

/* ---------------------------------------------------------------------------
   Consentement (acceptance)
   --------------------------------------------------------------------------- */
#ajax-content-wrap .flo-reg-cf7 .wpcf7-acceptance .wpcf7-list-item{
    margin:0;
    display:flex; gap:10px; align-items:flex-start;
}
#ajax-content-wrap .flo-reg-cf7 .wpcf7-acceptance .wpcf7-list-item-label{ font-weight:400; }
#ajax-content-wrap .flo-reg-cf7 input[type=checkbox]{
    width:18px !important; height:18px !important; margin-top:2px;
    accent-color:var(--flo-olive); flex:0 0 auto;
}

/* ---------------------------------------------------------------------------
   Bouton — strictement le style du bouton « Se connecter » (flo-login__submit)
   --------------------------------------------------------------------------- */
#ajax-content-wrap .flo-reg-cf7 input[type=submit],
#ajax-content-wrap .flo-reg-cf7 .wpcf7-submit{
    -webkit-appearance:none !important; appearance:none !important;
    display:block !important;
    height:auto !important;
    margin:6px 0 0 !important;
    padding:12px 24px !important;
    border:0 !important;
    border-radius:100px !important;
    background:#828d7d !important;
    color:#fff !important;
    box-shadow:none !important;
    text-transform:uppercase !important;
    letter-spacing:.3px !important;
    cursor:pointer !important;
    transition:background .2s ease;
    margin:auto !important;
}
#ajax-content-wrap .flo-reg-cf7 input[type=submit]:hover,
#ajax-content-wrap .flo-reg-cf7 .wpcf7-submit:hover{ background:#6f7a6a !important; }

#ajax-content-wrap .flo-reg-cf7 .wpcf7-spinner{ margin:14px auto 0; display:block; }

/* ---------------------------------------------------------------------------
   Messages CF7 (la réponse est un frère de .flo-reg-cf7, dans le même <form>)
   --------------------------------------------------------------------------- */
#ajax-content-wrap form:has(.flo-reg-cf7) .wpcf7-response-output{
    margin:8px 0 0 !important;
    padding:14px 18px !important;
    border:1px solid var(--flo-border) !important;
    border-radius:10px !important;
    background:var(--flo-soft);
    font-size:15px;
}
#ajax-content-wrap form.invalid:has(.flo-reg-cf7) .wpcf7-response-output,
#ajax-content-wrap form.unaccepted:has(.flo-reg-cf7) .wpcf7-response-output,
#ajax-content-wrap form.payment-required:has(.flo-reg-cf7) .wpcf7-response-output{
    border-color:#e6b8b3 !important; background:#fcf0ef; color:#8a231c;
}
#ajax-content-wrap form.sent:has(.flo-reg-cf7) .wpcf7-response-output{
    border-color:#bcd6bd !important; background:#f0f6f0; color:#2e4a2f;
}
#ajax-content-wrap .flo-reg-cf7 .wpcf7-not-valid-tip{
    color:#b3261e; font-size:13px; font-weight:500; margin-top:6px;
}
#ajax-content-wrap .flo-reg-cf7 input.wpcf7-not-valid,
#ajax-content-wrap .flo-reg-cf7 select.wpcf7-not-valid,
#ajax-content-wrap .flo-reg-cf7 textarea.wpcf7-not-valid{
    border-color:#e0a39c !important;
}

/* =============================================================================
   STYLE DES CHAMPS APPLIQUÉ À TOUS LES FORMULAIRES CONTACT FORM 7
   Reprend exactement l'apparence des champs du formulaire d'inscription
   (fond blanc, contour olive, arrondi, focus, chevron des select, bouton pilule).
   La MISE EN PAGE (grille 2 colonnes, .flo-row/.flo-half) reste propre à
   l'inscription : ici on ne touche qu'à l'apparence des champs.
   ========================================================================== */
#ajax-content-wrap .wpcf7-form input[type=text],
#ajax-content-wrap .wpcf7-form input[type=email],
#ajax-content-wrap .wpcf7-form input[type=tel],
#ajax-content-wrap .wpcf7-form input[type=url],
#ajax-content-wrap .wpcf7-form input[type=password],
#ajax-content-wrap .wpcf7-form input[type=number],
#ajax-content-wrap .wpcf7-form input[type=date],
#ajax-content-wrap .wpcf7-form input[type=search],
#ajax-content-wrap .wpcf7-form select,
#ajax-content-wrap .wpcf7-form textarea{
    -webkit-appearance:none !important; appearance:none !important;
    display:block !important;
    width:100% !important;
    box-sizing:border-box !important;
    margin:0 !important;
    padding:10px 12px !important;
    background-color:#FFF !important;
    border:1px solid var(--nectar-accent-color, var(--flo-border)) !important;
    border-radius:4px !important;
    box-shadow:none !important;
    color:var(--flo-olive) !important;
    font-family:"Montserrat",sans-serif !important;
    font-size:16px !important;
    line-height:1.5 !important;
    transition:border-color .15s ease;
}
#ajax-content-wrap .wpcf7-form textarea{ min-height:110px !important; resize:vertical; }

#ajax-content-wrap .wpcf7-form input::placeholder,
#ajax-content-wrap .wpcf7-form textarea::placeholder{ color:var(--flo-olive-light); }

#ajax-content-wrap .wpcf7-form input:focus,
#ajax-content-wrap .wpcf7-form select:focus,
#ajax-content-wrap .wpcf7-form textarea:focus{
    outline:none !important;
    border-color:var(--flo-olive) !important;
    box-shadow:none !important;
}

/* Select : chevron olive */
#ajax-content-wrap .wpcf7-form select{
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23828D7D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
    background-repeat:no-repeat !important;
    background-position:right 14px center !important;
    padding-right:40px !important;
}

/* Cases à cocher / boutons radio : teinte olive */
#ajax-content-wrap .wpcf7-form input[type=checkbox],
#ajax-content-wrap .wpcf7-form input[type=radio]{
    accent-color:var(--flo-olive);
}

/* Champs en erreur */
#ajax-content-wrap .wpcf7-form input.wpcf7-not-valid,
#ajax-content-wrap .wpcf7-form select.wpcf7-not-valid,
#ajax-content-wrap .wpcf7-form textarea.wpcf7-not-valid{
    border-color:#e0a39c !important;
}
#ajax-content-wrap .wpcf7-form .wpcf7-not-valid-tip{
    color:#b3261e; font-size:13px; font-weight:500; margin-top:6px;
}

/* Bouton d'envoi — pilule olive (aligné à gauche pour un formulaire générique) */
#ajax-content-wrap .wpcf7-form input[type=submit],
#ajax-content-wrap .wpcf7-form button[type=submit],
#ajax-content-wrap .wpcf7-form .wpcf7-submit{
    -webkit-appearance:none !important; appearance:none !important;
    display:inline-block !important;
    width:auto !important;
    height:auto !important;
    margin:6px 0 0 !important;
    padding:12px 24px !important;
    border:0 !important;
    border-radius:100px !important;
    background:#828d7d !important;
    color:#fff !important;
    box-shadow:none !important;
    font-family:"Montserrat",sans-serif !important;
    font-weight:600 !important;
    text-transform:uppercase !important;
    letter-spacing:.3px !important;
    cursor:pointer !important;
    transition:background .2s ease;
}
#ajax-content-wrap .wpcf7-form input[type=submit]:hover,
#ajax-content-wrap .wpcf7-form button[type=submit]:hover,
#ajax-content-wrap .wpcf7-form .wpcf7-submit:hover{ background:#6f7a6a !important; }

/* Messages de réponse CF7 (génériques) */
#ajax-content-wrap .wpcf7-form .wpcf7-response-output{
    margin:8px 0 0 !important;
    padding:14px 18px !important;
    border:1px solid var(--flo-border) !important;
    border-radius:10px !important;
    background:var(--flo-soft);
    font-size:15px;
}
#ajax-content-wrap .wpcf7-form.invalid .wpcf7-response-output,
#ajax-content-wrap .wpcf7-form.unaccepted .wpcf7-response-output,
#ajax-content-wrap .wpcf7-form.payment-required .wpcf7-response-output{
    border-color:#e6b8b3 !important; background:#fcf0ef; color:#8a231c;
}
#ajax-content-wrap .wpcf7-form.sent .wpcf7-response-output{
    border-color:#bcd6bd !important; background:#f0f6f0; color:#2e4a2f;
}

/* ---------------------------------------------------------------------------
   Verrous boutique (prix masqués + bandeau)
   --------------------------------------------------------------------------- */
.flo-price-locked{
    display:inline-block; font-size:14px; color:#828D7D; font-style:italic;
}
.flo-price-locked a{ color:#828D7D; text-decoration:underline; }

.flo-gate-banner{ margin:0 0 24px; }
