.elementor-15135 .elementor-element.elementor-element-7be90b9f, .elementor-15135 .elementor-element.elementor-element-7be90b9f > .elementor-background-overlay{border-radius:10px 10px 10px 10px;}.elementor-15135 .elementor-element.elementor-element-71e080e8 > .elementor-element-populated, .elementor-15135 .elementor-element.elementor-element-71e080e8 > .elementor-element-populated > .elementor-background-overlay, .elementor-15135 .elementor-element.elementor-element-71e080e8 > .elementor-background-slideshow{border-radius:10px 10px 10px 10px;}.elementor-15135 .elementor-element.elementor-element-63e1cf38 > .elementor-widget-container{border-radius:10px 10px 10px 10px;}#elementor-popup-modal-15135 .dialog-widget-content{animation-duration:1.2s;box-shadow:2px 8px 23px 3px rgba(0,0,0,0.2);}#elementor-popup-modal-15135{background-color:rgba(0,0,0,.8);justify-content:center;align-items:center;pointer-events:all;}#elementor-popup-modal-15135 .dialog-message{width:640px;height:auto;}#elementor-popup-modal-15135 .dialog-close-button{display:flex;}/* Start custom CSS for shortcode, class: .elementor-element-63e1cf38 *//* --- 1. L'ENVELOPPE GLOBALE DU FORMULAIRE --- */
/* On donne de l'air et des rondeurs au conteneur principal */
.tnp-subscription {
    padding: 10px;
    background-color: #fff; /* Fond blanc pur */
    max-width: 600px; /* Limite la largeur pour que ça reste élégant */
    margin: 0 auto;
}

/* --- 2. LE CHAMP EMAIL (Style "Pilule") --- */
.tnp-field-email {
    margin-bottom: 20px;
}

.tnp-email {
    width: 100%;
    padding: 15px 20px;
    border-radius: 50px; /* Forme pilule */
    border: 2px solid #eee; /* Bordure grise légère */
    background-color: #f9f9f9;
    font-size: 16px;
    text-align: center; /* Texte centré pour le style */
    transition: all 0.3s ease;
}

/* Effet quand on clique dans le champ */
.tnp-email:focus {
    border-color: #E38A9A; /* Devient rose */
    outline: none;
    background-color: #fff;
    box-shadow: 0 0 0 4px rgba(227, 138, 154, 0.1);
}

/* --- 3. LES LISTES (Tes colonnes améliorées) --- */
.tnp-field.tnp-lists {
    display: flex;
    flex-wrap: wrap !important;
    justify-content: center;
    gap: 10px 0; /* Espacement vertical entre les lignes */
    margin-bottom: 20px;
}

.tnp-field.tnp-lists > div {
    width: 50%; 
    box-sizing: border-box;
    text-align: left;
    padding-left: 20px; /* Petit décalage pour l'alignement */
}

/* Style des labels (textes) */
.tnp-lists label {
    cursor: pointer;
    font-size: 14px;
    color: #555;
    transition: color 0.3s;
    display: flex;
    align-items: center;
}

.tnp-lists label:hover {
    color: #E38A9A; /* Le texte rosit au survol */
}

/* Personnalisation des cases à cocher (Checkbox) */
.tnp-lists input[type="checkbox"] {
    accent-color: #E38A9A; /* Met la case en rose (sur navigateurs modernes) */
    transform: scale(1.2); /* Grossit un peu la case */
    margin-right: 8px;
    cursor: pointer;
}

/* --- 4. LE BOUTON (Style "Bonbon" comme le footer) --- */
.tnp-field-button {
    text-align: center;
    margin-top: 15px;
}

.tnp-submit {
    /* Le fameux dégradé rose */
    background: linear-gradient(135deg, #F4B8C2 0%, #E38A9A 100%);
    color: white !important;
    font-size: 18px;
    font-weight: bold;
    text-transform: uppercase;
    border: none;
    border-radius: 50px; /* Bouton rond */
    padding: 12px 50px; /* Large et confortable */
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    
    /* L'ombre rose lumineuse */
    box-shadow: 0 8px 20px -5px rgba(227, 138, 154, 0.5);
}

.tnp-submit:hover {
    transform: translateY(-3px); /* Effet de levitation */
    box-shadow: 0 12px 25px -5px rgba(227, 138, 154, 0.7);
    background: linear-gradient(135deg, #E38A9A 0%, #d67587 100%);
}

/* --- 5. CONFIDENTIALITÉ (Petit texte discret) --- */
.tnp-privacy-field {
    font-size: 12px;
    color: #999;
    margin-bottom: 15px;
    text-align: center;
}

/* --- STYLE DE LA FENÊTRE POPUP (Version Elementor) --- */

/* 1. La boîte principale (Le fond blanc) */
.elementor-popup-modal .dialog-widget-content {
    border-radius: 25px !important; /* Les fameux bords arrondis */
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.4) !important; /* L'effet de profondeur */
    border: none !important;
    background-color: #fff; /* Sécurité pour avoir un fond blanc propre */
}

/* 2. La Croix de fermeture (Le "X") */
/* On remplace la croix simple par une bulle stylée */
.elementor-popup-modal .dialog-close-button {
    top: 15px !important;
    right: 15px !important;
    background-color: #f1f1f1; /* Fond gris clair */
    border-radius: 50%; /* Rond parfait */
    width: 35px;
    height: 35px;
    opacity: 1 !important; /* Force la visibilité */
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

/* L'icône à l'intérieur de la croix */
.elementor-popup-modal .dialog-close-button i {
    color: #555;
    font-size: 16px;
    font-weight: bold;
}

/* Effet au survol de la croix */
.elementor-popup-modal .dialog-close-button:hover {
    background-color: #E38A9A; /* Devient rose */
}

.elementor-popup-modal .dialog-close-button:hover i {
    color: white; /* Croix devient blanche */
}/* End custom CSS */