/*
Theme Name: TheGem Child
Description: Multi-Purpose Wordpress Theme
Author: Codex Themes.
Theme URI: http://codex-themes.com/thegem/
Author URI: http://codex-themes.com/thegem/
Template: thegem
Version: 1.0
Tags: one-column, two-columns, left-sidebar, right-sidebar, responsive-layout, custom-background, custom-colors, custom-header, custom-menu, featured-images, flexible-header, full-width-template, theme-options, translation-ready, dark, light
License: GNU General Public License
License URI: license.txt
*/


/* ==========================================================================
   Ninja Forms - Pixel-Perfect ISO 1:1 Match with Gouache Paris Contact Form
   ========================================================================== */

/* Masquer le texte par défaut "Les champs marqués d'un astérisque..." */
.nf-form-fields-required {
    display: none !important;
}

.nf-form-cont {
    margin: 0 auto;
    max-width: 100%;
}

/* Grille 2 colonnes fidèle à l'original */
.nf-form-content {
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    column-gap: 28px !important;
    row-gap: 20px !important;
}

/* Permet aux balises personnalisées Ninja Forms d'hériter directement de la grille */
.nf-form-content nf-fields-wrap,
.nf-form-content nf-field {
    display: contents !important;
}

/* Force l'empilement vertical du Label au-dessus de l'Input */
.nf-form-content .field-wrap {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
}

.nf-form-content .field-wrap .nf-field-element {
    width: 100% !important;
}

/* Ligne 1 : Nom (gauche) | Email (droite) */
.nf-field-container[data-testid="nf-field-votre_nom"],
#nf-field-5-container {
    grid-column: 1 / 2 !important;
    grid-row: 1 !important;
    margin-bottom: 0 !important;
}

.nf-field-container[data-testid="nf-field-email"],
#nf-field-7-container {
    grid-column: 2 / 3 !important;
    grid-row: 1 !important;
    margin-bottom: 0 !important;
}

/* Ligne 2 : Prénom (gauche) | Objet (droite) */
.nf-field-container[data-testid="nf-field-votre_prenom"],
#nf-field-6-container {
    grid-column: 1 / 2 !important;
    grid-row: 2 !important;
    margin-bottom: 0 !important;
}

.nf-field-container[data-testid="nf-field-objet"],
#nf-field-8-container {
    grid-column: 2 / 3 !important;
    grid-row: 2 !important;
    margin-bottom: 0 !important;
}

/* Ligne 3 : Votre message (pleine largeur) */
.nf-field-container[data-testid="nf-field-votre_message"],
#nf-field-9-container {
    grid-column: 1 / 3 !important;
    grid-row: 3 !important;
    margin-bottom: 0 !important;
}

/* Ligne 4 : Bouton Envoyer */
.nf-field-container[data-testid="nf-field-submit"],
#nf-field-10-container {
    grid-column: 1 / 3 !important;
    grid-row: 4 !important;
    margin-bottom: 0 !important;
}

/* Adaptation mobile (1 seule colonne sous 640px) */
@media (max-width: 640px) {
    .nf-form-content {
        grid-template-columns: 1fr !important;
        row-gap: 16px !important;
    }
    .nf-field-container[data-testid="nf-field-votre_nom"],
    #nf-field-5-container,
    .nf-field-container[data-testid="nf-field-email"],
    #nf-field-7-container,
    .nf-field-container[data-testid="nf-field-votre_prenom"],
    #nf-field-6-container,
    .nf-field-container[data-testid="nf-field-objet"],
    #nf-field-8-container,
    .nf-field-container[data-testid="nf-field-votre_message"],
    #nf-field-9-container,
    .nf-field-container[data-testid="nf-field-submit"],
    #nf-field-10-container {
        grid-column: 1 / 2 !important;
        grid-row: auto !important;
    }
}

/* Labels en gras, nets et noirs */
.nf-field-label label {
    font-family: inherit !important;
    font-weight: 700 !important;
    font-size: 18px !important;
    color: #1a1a1a !important;
    margin-bottom: 8px !important;
    display: inline-block !important;
    line-height: 1.2 !important;
}

/* Astérisque rouge vif */
.ninja-forms-req-symbol {
    color: #d60000 !important;
    font-weight: 700 !important;
    margin-left: 2px !important;
}

/* Champs de texte et Textarea : fond BLANC et bordure fine grise */
.nf-form-content input[type="text"],
.nf-form-content input[type="email"],
.nf-form-content textarea {
    width: 100% !important;
    background-color: #ffffff !important;
    border: 1px solid #cccccc !important;
    border-radius: 2px !important;
    padding: 8px 12px !important;
    font-size: 15px !important;
    color: #333333 !important;
    box-sizing: border-box !important;
    box-shadow: none !important;
    outline: none !important;
    height: 40px !important;
    transition: border-color 0.2s ease !important;
}

.nf-form-content textarea {
    height: 140px !important;
    min-height: 120px !important;
    resize: vertical !important;
    padding: 10px 12px !important;
}

.nf-form-content input[type="text"]:focus,
.nf-form-content input[type="email"]:focus,
.nf-form-content textarea:focus {
    background-color: #ffffff !important;
    border-color: #666666 !important;
    box-shadow: none !important;
}

/* Bouton ENVOYER : fond blanc, bordure fine grise, texte noir, majuscules */
.nf-form-content input[type="button"],
.nf-form-content input[type="submit"],
.nf-form-content button {
    background-color: #ffffff !important;
    color: #1a1a1a !important;
    border: 1px solid #cccccc !important;
    border-radius: 2px !important;
    padding: 9px 24px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    cursor: pointer !important;
    box-shadow: none !important;
    transition: all 0.2s ease !important;
    display: inline-block !important;
    height: auto !important;
}

.nf-form-content input[type="button"]:hover,
.nf-form-content input[type="submit"]:hover,
.nf-form-content button:hover {
    background-color: #f7f7f7 !important;
    border-color: #999999 !important;
    color: #000000 !important;
}

/* Messages de confirmation / validation */
.nf-response-msg {
    padding: 15px 20px !important;
    border-radius: 2px !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    margin-top: 20px !important;
    background-color: #f0fdf4 !important;
    color: #166534 !important;
    border: 1px solid #bbf7d0 !important;
}

.nf-error-msg {
    font-size: 12px !important;
    color: #dc2626 !important;
    margin-top: 4px !important;
}


/* ==========================================================================
   Checkout - ISO 1:1 Production Match
   ========================================================================== */
/* Masquer le titre Informations complémentaires (absent sur la production) */
.woocommerce-additional-fields > .light,
.woocommerce-additional-fields > h2,
.woocommerce-additional-fields > h3 {
    display: none !important;
}
