/**
 * Lobbens — Ninja Forms Style A v2 (fond brun #8B7367)
 * Charte Lobbens : brun principal #8B7367, gris foncé #3E3E3E, beige clair #EFEFEF
 * v2 — Spécificité maximale + !important — compatible Avada + nf-layout-front-end
 * CMULTIMEDIA 2026
 */

/* ==========================================
   CONTAINER GLOBAL
   ID #nf-form-1-cont cible le form 1 en dur (plus spécifique que .nf-form-cont)
   ========================================== */
html body .nf-form-cont,
html body #nf-form-1-cont.nf-form-cont {
    background: #8B7367 !important;
    padding: 30px !important;
    border-radius: 4px !important;
    color: #fff !important;
    box-sizing: border-box !important;
}

html body .nf-form-wrap,
html body .nf-form-layout {
    background: #8B7367 !important;
}

/* ==========================================
   TITRE DU FORMULAIRE
   ========================================== */
html body .nf-form-cont .nf-form-title h3,
html body .nf-form-cont .nf-form-title,
html body #nf-form-1-cont .nf-form-title h3 {
    color: #fff !important;
    text-align: center !important;
    font-weight: 600 !important;
    margin-bottom: 20px !important;
    font-size: 1.2em !important;
}

/* ==========================================
   LABELS
   ========================================== */
html body .nf-form-cont .nf-field-label label,
html body .nf-form-cont .nf-field-label .nf-label-span,
html body #nf-form-1-cont .nf-field-label label {
    color: #fff !important;
    margin-bottom: 6px !important;
    display: block !important;
    font-weight: 500 !important;
    font-size: 14px !important;
}

/* ==========================================
   INPUTS TEXT / EMAIL / TEL / NUMBER / URL
   ========================================== */
html body .nf-form-cont .nf-field-element input[type="text"],
html body .nf-form-cont .nf-field-element input[type="email"],
html body .nf-form-cont .nf-field-element input[type="tel"],
html body .nf-form-cont .nf-field-element input[type="number"],
html body .nf-form-cont .nf-field-element input[type="url"],
html body #nf-form-1-cont .nf-field-element input[type="text"],
html body #nf-form-1-cont .nf-field-element input[type="email"],
html body #nf-form-1-cont .nf-field-element input[type="tel"] {
    background: #fff !important;
    color: #3E3E3E !important;
    border: 1px solid #ccc !important;
    border-radius: 3px !important;
    padding: 12px 14px !important;
    width: 100% !important;
    font-size: 15px !important;
    box-sizing: border-box !important;
    line-height: 1.4 !important;
    height: auto !important;
    outline: none !important;
    box-shadow: none !important;
}

html body .nf-form-cont .nf-field-element input[type="text"]:focus,
html body .nf-form-cont .nf-field-element input[type="email"]:focus,
html body .nf-form-cont .nf-field-element input[type="tel"]:focus {
    border-color: #fff !important;
    box-shadow: 0 0 0 2px rgba(255,255,255,0.4) !important;
    outline: none !important;
}

/* ==========================================
   TEXTAREA
   ========================================== */
html body .nf-form-cont .nf-field-element textarea,
html body #nf-form-1-cont .nf-field-element textarea {
    background: #fff !important;
    color: #3E3E3E !important;
    border: 1px solid #ccc !important;
    border-radius: 3px !important;
    padding: 12px 14px !important;
    width: 100% !important;
    font-size: 15px !important;
    min-height: 120px !important;
    resize: vertical !important;
    box-sizing: border-box !important;
    line-height: 1.5 !important;
}

/* ==========================================
   SELECT
   ========================================== */
html body .nf-form-cont .nf-field-element select,
html body #nf-form-1-cont .nf-field-element select {
    background: #fff !important;
    color: #3E3E3E !important;
    border: 1px solid #ccc !important;
    border-radius: 3px !important;
    padding: 12px 14px !important;
    width: 100% !important;
    font-size: 15px !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
    appearance: auto !important;
    height: auto !important;
}

/* ==========================================
   CHECKBOX / RADIO LABELS
   ========================================== */
html body .nf-form-cont .nf-field-element label,
html body .nf-form-cont .nf-field-element .nf-field-label label {
    color: #fff !important;
}

/* ==========================================
   BOUTON SUBMIT
   NF utilise input[type="button"] dans .submit-container
   ========================================== */
html body .nf-form-cont .nf-field-element input[type="button"],
html body .nf-form-cont .submit-container input[type="button"],
html body .nf-form-cont input[type="submit"],
html body .nf-form-cont button[type="submit"],
html body .nf-form-cont .nf-form-layout .submit-wrap input,
html body #nf-form-1-cont .submit-container input,
html body #nf-form-1-cont input[type="button"],
html body #nf-form-1-cont input[type="submit"] {
    background: #fff !important;
    color: #8B7367 !important;
    border: 2px solid #fff !important;
    padding: 12px 32px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    border-radius: 3px !important;
    cursor: pointer !important;
    font-size: 15px !important;
    display: inline-block !important;
    width: auto !important;
    min-width: 180px !important;
    height: auto !important;
    line-height: 1.4 !important;
    box-shadow: none !important;
    transition: background 0.2s ease, color 0.2s ease !important;
}

html body .nf-form-cont .nf-field-element input[type="button"]:hover,
html body .nf-form-cont .submit-container input[type="button"]:hover,
html body #nf-form-1-cont input[type="button"]:hover,
html body #nf-form-1-cont input[type="submit"]:hover {
    background: #6d5a50 !important;
    color: #fff !important;
    border-color: #6d5a50 !important;
}

/* ==========================================
   SUBMIT CONTAINER — centrage
   ========================================== */
html body .nf-form-cont .submit-container,
html body #nf-form-1-cont .submit-container {
    text-align: center !important;
    margin-top: 20px !important;
}

/* ==========================================
   CHAMPS REQUIS — étoile
   ========================================== */
html body .nf-form-cont .nf-form-fields-required,
html body #nf-form-1-cont .nf-form-fields-required {
    color: rgba(255,255,255,0.8) !important;
    font-size: 13px !important;
    margin-bottom: 15px !important;
    text-align: right !important;
}

html body .nf-form-cont .nf-field-label label .ninja-forms-req-symbol,
html body #nf-form-1-cont .nf-field-label label .ninja-forms-req-symbol {
    color: #FFDD99 !important;
}

/* ==========================================
   MESSAGES ERREUR / SUCCES
   ========================================== */
html body .nf-form-cont .nf-error-msg,
html body #nf-form-1-cont .nf-error-msg {
    color: #FFDD99 !important;
    font-size: 13px !important;
    margin-top: 4px !important;
}

html body .nf-form-cont .nf-success-msg,
html body #nf-form-1-cont .nf-success-msg {
    background: rgba(255,255,255,0.15) !important;
    color: #fff !important;
    padding: 12px !important;
    border-radius: 3px !important;
    text-align: center !important;
}

/* ==========================================
   ESPACEMENT CHAMPS
   ========================================== */
html body .nf-form-cont .nf-field-container,
html body #nf-form-1-cont .nf-field-container {
    margin-bottom: 18px !important;
}

/* ==========================================
   RESET AVADA / FUSION BUILDER interférences
   Avada injecte des styles sur .fusion-main-menu input
   On ne touche que le scope NF
   ========================================== */
html body .nf-form-cont input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
html body #nf-form-1-cont input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]) {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}

/* Remettre l'apparence pour le submit */
html body .nf-form-cont input[type="button"],
html body .nf-form-cont input[type="submit"],
html body #nf-form-1-cont input[type="button"],
html body #nf-form-1-cont input[type="submit"] {
    -webkit-appearance: button !important;
    -moz-appearance: button !important;
    appearance: button !important;
}

/* ==========================================
   ESPACEMENT CHAMPS — v3 (2026-04-22)
   Plus despace entre les champs (vertical et horizontal)
   ========================================== */

/* Espacement vertical entre chaque champ */
html body .nf-form-cont .nf-field-container,
html body #nf-form-1-cont .nf-field-container {
    margin-bottom: 20px !important;
}

/* Espacement horizontal entre colonnes 2-col (Nom|Prenom, Email|Tel)
   NF utilise .one-half avec float:left et margin-left:2.5641%
   On ajoute du padding interne sur chaque cellule */
html body .nf-form-cont .one-half,
html body #nf-form-1-cont .one-half {
    padding-left: 8px !important;
    padding-right: 8px !important;
}

/* Compenser le padding sur la premiere cellule (class .first) */
html body .nf-form-cont .one-half.first,
html body #nf-form-1-cont .one-half.first {
    padding-left: 0 !important;
    padding-right: 8px !important;
}

/* Espace label -> champ (si pas deja present) */
html body .nf-form-cont .nf-field-label label,
html body #nf-form-1-cont .nf-field-label label {
    margin-bottom: 8px !important;
}






/* ============================================================
   GAP HORIZONTAL COLONNES NF — v6 (22/04/2026)
   NF utilise .nf-multi-cell wrapper — spécificité requise
   ============================================================ */

html body .nf-form-cont .nf-multi-cell .one-half,
html body .nf-form-cont .nf-multi-cell .one-third,
html body .nf-form-cont .nf-multi-cell .one-fourth,
html body .nf-form-cont .nf-cell.one-half,
html body .nf-form-cont .one-half {
    box-sizing: border-box !important;
    padding: 0 10px !important;
}

html body .nf-form-cont .nf-multi-cell .one-half:first-child,
html body .nf-form-cont .nf-multi-cell .one-half.first,
html body .nf-form-cont .one-half:first-child,
html body .nf-form-cont .one-half.first {
    padding-left: 0 !important;
    padding-right: 12px !important;
}

html body .nf-form-cont .nf-multi-cell .one-half:last-child,
html body .nf-form-cont .nf-multi-cell .one-half.last,
html body .nf-form-cont .one-half:last-child,
html body .nf-form-cont .one-half.last {
    padding-right: 0 !important;
    padding-left: 12px !important;
}


/* Cible directe .nf-cell (classe réelle wrapper colonne NF) */
html body .nf-form-cont .nf-cell {
    padding: 0 10px !important;
    box-sizing: border-box !important;
}

html body .nf-form-cont .nf-cell:first-child,
html body .nf-form-cont .nf-row .nf-cell:first-of-type {
    padding-left: 0 !important;
    padding-right: 12px !important;
}

html body .nf-form-cont .nf-cell:last-child,
html body .nf-form-cont .nf-row .nf-cell:last-of-type {
    padding-right: 0 !important;
    padding-left: 12px !important;
}