/*
 Theme Name:   Inspiro Enfant
 Theme URI:    https://exemple.com/
 Description:  Thème enfant pour Inspiro
 Author:       Moi
 Template:     inspiro
 Version:      1.0.0
*/

/* Tu peux ajouter ici tes styles personnalisés */

/*****************************************************
  FORMULAIRES CF7 — Style Premium (2025 Edition)
  Pour tous les formulaires CF7 du site
******************************************************/

/* Conteneur général */
.wpcf7 form {
  background: #fff;
  padding: 2.5rem;
  border-radius: 16px;
  box-shadow: 0 8px 25px rgba(0,0,0,0.08);
  max-width: 720px;
  margin: 2rem auto;
  font-family: "Segoe UI", Roboto, sans-serif;
  animation: fadeInUp 0.6s ease;
}

/* Titres (si tu mets <h3> ou <h2> dans ton formulaire) */
.wpcf7 form h2, 
.wpcf7 form h3 {
  text-align: center;
  font-size: 1.6rem;
  margin-bottom: 1.5rem;
  color: #222;
  letter-spacing: 0.5px;
  position: relative;
}
.wpcf7 form h2::after, 
.wpcf7 form h3::after {
  content: "";
  display: block;
  width: 60px;
  height: 3px;
  background: linear-gradient(90deg,#d19a00,#b88300);
  margin: 0.5rem auto 0;
  border-radius: 2px;
}

/* Labels */
.wpcf7 form label {
  display: block;
  font-weight: 600;
  margin: 10px 0 6px;
  color: #333;
  font-size: 0.95rem;
}

/* Champs */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="url"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="number"],
.wpcf7 textarea,
.wpcf7 select {
  width: 100%;
  padding: 14px 16px;
  margin-bottom: 18px;
  border: 1.5px solid #ddd;
  border-radius: 10px;
  font-size: 1rem;
  background: #fafafa;
  transition: all 0.25s ease;
  box-sizing: border-box;
}

/* Effet focus élégant */
.wpcf7 input:focus,
.wpcf7 textarea:focus,
.wpcf7 select:focus {
  border-color: #d19a00;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(209,154,0,0.15);
  outline: none;
}

/* Bouton envoyer */
.wpcf7 input[type="submit"] {
  display: inline-block;
  background: linear-gradient(135deg, #d19a00, #b88300);
  color: #fff;
  font-size: 1.1rem;
  font-weight: 600;
  padding: 14px 30px;
  border: none;
  border-radius: 50px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.wpcf7 input[type="submit"]:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.2);
  background: linear-gradient(135deg, #b88300, #8f6400);
}

/* Messages de validation/erreur */
.wpcf7 .wpcf7-response-output {
  margin-top: 20px;
  padding: 14px 18px;
  border-radius: 8px;
  font-weight: 500;
}

.wpcf7 form.sent .wpcf7-response-output {
  background: #f0fff0;
  border: 1.5px solid #6c6;
  color: #2a7a2a;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 .wpcf7-not-valid-tip {
  background: #fff5f5;
  border: 1.5px solid #d33;
  color: #a00;
  border-radius: 6px;
  padding: 10px 14px;
  margin-top: 8px;
  font-size: 0.9rem;
}

/* Loader (quand on envoie le form) */
.wpcf7 form .ajax-loader {
  margin-left: 10px;
  border: 3px solid #eee;
  border-top: 3px solid #d19a00;
  border-radius: 50%;
  width: 18px;
  height: 18px;
  animation: spin 0.8s linear infinite;
}

/* Animations */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes spin {
  to { transform: rotate(360deg); }
}




/******************************************************
  PMPro Formulaire d’adhésion — Style Premium
******************************************************/

.pmpro_form {
  background: #fff;
  padding: 2.5rem;
  border-radius: 16px;
  box-shadow: 0 8px 25px rgba(0,0,0,0.08);
  max-width: 800px;
  margin: 2rem auto;
  font-family: "Segoe UI", Roboto, sans-serif;
  animation: fadeInUp 0.6s ease;
}

/* Titres */
.pmpro_form h2,
.pmpro_form h3 {
  text-align: center;
  font-size: 1.6rem;
  margin-bottom: 1.5rem;
  color: #222;
  letter-spacing: 0.5px;
  position: relative;
}
.pmpro_form h2::after,
.pmpro_form h3::after {
  content: "";
  display: block;
  width: 70px;
  height: 3px;
  background: linear-gradient(90deg,#d19a00,#b88300);
  margin: 0.5rem auto 0;
  border-radius: 2px;
}

/* Labels */
.pmpro_form label {
  display: block;
  font-weight: 600;
  margin: 10px 0 6px;
  color: #333;
  font-size: 0.95rem;
}

/* Champs */
.pmpro_form input[type="text"],
.pmpro_form input[type="email"],
.pmpro_form input[type="url"],
.pmpro_form input[type="tel"],
.pmpro_form input[type="number"],
.pmpro_form input[type="password"],
.pmpro_form select {
  width: 100%;
  padding: 14px 16px;
  margin-bottom: 18px;
  border: 1.5px solid #ddd;
  border-radius: 10px;
  font-size: 1rem;
  background: #fafafa;
  transition: all 0.25s ease;
  box-sizing: border-box;
}

/* Focus élégant */
.pmpro_form input:focus,
.pmpro_form select:focus {
  border-color: #d19a00;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(209,154,0,0.15);
  outline: none;
}

/* Champs radios/checkbox */
.pmpro_form input[type="radio"],
.pmpro_form input[type="checkbox"] {
  accent-color: #d19a00;
  transform: scale(1.2);
  margin-right: 8px;
}

/* Bouton principal */
.pmpro_form input[type="submit"],
.pmpro_btn,
.pmpro_btn-submit-checkout {
  display: inline-block;
  background: linear-gradient(135deg, #d19a00, #b88300);
  color: #fff;
  font-size: 1.1rem;
  font-weight: 600;
  padding: 14px 30px;
  border: none;
  border-radius: 50px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  text-decoration: none;
}

.pmpro_form input[type="submit"]:hover,
.pmpro_btn:hover,
.pmpro_btn-submit-checkout:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.2);
  background: linear-gradient(135deg, #b88300, #8f6400);
}

/* Encadrés */
.pmpro_checkout-fields,
.pmpro_checkout_box {
  padding: 1.5rem;
  margin-bottom: 1.5rem;
  border: 1px solid #eee;
  border-radius: 12px;
  background: #fafafa;
}

/* Messages / erreurs */
.pmpro_message {
  margin: 1rem 0;
  padding: 14px 18px;
  border-radius: 8px;
  font-weight: 500;
}

.pmpro_message.pmpro_error {
  background: #fff5f5;
  border: 1.5px solid #d33;
  color: #a00;
}

.pmpro_message.pmpro_success {
  background: #f0fff0;
  border: 1.5px solid #6c6;
  color: #2a7a2a;
}

/* Animations */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}


/******************************************************
  PMPro — Cases à cocher et radios alignées
******************************************************/
.pmpro_form li > span {
  display: flex;
  align-items: center;
  gap: 8px; /* espace entre case et texte */
}

.pmpro_form li > span input[type="checkbox"],
.pmpro_form li > span input[type="radio"] {
  flex-shrink: 0;   /* la case garde sa taille */
  margin: 0;
}

.pmpro_form li > span label {
  margin: 0;
  font-weight: 500;
  cursor: pointer;
}

/******************************************************
  Style premium pour le tableau [chats_bureau_tableau]
******************************************************/
.chats-bureau-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin: 2rem auto;
  font-family: "Segoe UI", Roboto, sans-serif;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(0,0,0,0.08);
}

/* Entête */
.chats-bureau-table thead th {
  background: linear-gradient(135deg, #d19a00, #b88300);
  color: #fff;
  font-weight: 600;
  text-align: left;
  padding: 14px 18px;
  font-size: 1rem;
}

/* Lignes */
.chats-bureau-table tbody td {
  padding: 12px 18px;
  border-bottom: 1px solid #eee;
  font-size: 0.95rem;
  color: #333;
}

/* Dernière ligne sans bord */
.chats-bureau-table tbody tr:last-child td {
  border-bottom: none;
}

/* Alternance */
.chats-bureau-table tbody tr:nth-child(even) {
  background: #fafafa;
}

/* Hover */
.chats-bureau-table tbody tr:hover {
  background: #fff8e6;
  transition: background 0.3s ease;
}

/* Légende optionnelle */
.chats-bureau-table caption {
  caption-side: top;
  font-weight: 600;
  font-size: 1.2rem;
  margin-bottom: 1rem;
  text-align: left;
  color: #222;
}


/******************************************************
  Formulaire [chats_bureau_formulaire] — Design premium
******************************************************/
.chats-bureau-form {
  background: #fff;
  padding: 2rem;
  border-radius: 16px;
  box-shadow: 0 6px 18px rgba(0,0,0,0.08);
  max-width: 700px;
  margin: 2rem auto;
  font-family: "Segoe UI", Roboto, sans-serif;
}

/* Titres */
.chats-bureau-form h2,
.chats-bureau-form h3 {
  text-align: center;
  font-size: 1.5rem;
  margin-bottom: 1.5rem;
  color: #222;
  position: relative;
}
.chats-bureau-form h2::after,
.chats-bureau-form h3::after {
  content: "";
  display: block;
  width: 60px;
  height: 3px;
  background: linear-gradient(90deg,#d19a00,#b88300);
  margin: 0.5rem auto 0;
  border-radius: 2px;
}

/* Champs */
.chats-bureau-form input[type="text"],
.chats-bureau-form input[type="email"],
.chats-bureau-form input[type="url"],
.chats-bureau-form input[type="tel"],
.chats-bureau-form input[type="number"],
.chats-bureau-form input[type="password"],
.chats-bureau-form textarea,
.chats-bureau-form select {
  width: 100%;
  padding: 14px 16px;
  margin-bottom: 18px;
  border: 1.5px solid #ddd;
  border-radius: 10px;
  font-size: 1rem;
  background: #fafafa;
  transition: all 0.25s ease;
  box-sizing: border-box;
}

/* Focus */
.chats-bureau-form input:focus,
.chats-bureau-form textarea:focus,
.chats-bureau-form select:focus {
  border-color: #d19a00;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(209,154,0,0.15);
  outline: none;
}

/* Labels */
.chats-bureau-form label {
  display: block;
  font-weight: 600;
  margin: 8px 0 6px;
  color: #333;
  font-size: 0.95rem;
}

/* Bouton */
.chats-bureau-form input[type="submit"],
.chats-bureau-form button {
  display: inline-block;
  background: linear-gradient(135deg, #d19a00, #b88300);
  color: #fff;
  font-size: 1.1rem;
  font-weight: 600;
  padding: 14px 30px;
  border: none;
  border-radius: 50px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.chats-bureau-form input[type="submit"]:hover,
.chats-bureau-form button:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.2);
  background: linear-gradient(135deg, #b88300, #8f6400);
}

/*************************************
BOUTON APPLICATION D'UN CODE PROMO
**************************************/

/* Met en valeur le bloc d’actions PMPro */
.pmpro_card_actions {
    background-color: #f0f0f0;   /* fond gris clair */
    border: 2px solid #cc9933;   /* bordure dorée pour attirer l’œil */
    border-radius: 10px;         /* coins arrondis */
    padding: 20px;               /* espace intérieur */
    text-align: center;          /* centrer le bouton */
    margin-top: 15px;            /* espace au-dessus */
    margin-bottom: 20px;         /* marge extérieure basse */
    box-shadow: 0 4px 10px rgba(0,0,0,0.1); /* petite ombre */
    transition: all 0.3s ease;
}

.pmpro_card_actions:hover {
    background-color: #e6e6e6;   /* fond plus foncé au survol */
    transform: scale(1.02);      /* petit zoom */
    box-shadow: 0 6px 14px rgba(0,0,0,0.15);
}

/* Met en valeur le bouton à l'intérieur */
.pmpro_card_actions .pmpro_btn,
.pmpro_card_actions .pmpro_btn-submit {
    background-color: #cc9933 !important; /* bouton doré */
    color: #fff !important;
    font-size: 18px;
    font-weight: bold;
    padding: 12px 24px;
    border-radius: 8px;
    border: none;
    transition: all 0.3s ease;
}

.pmpro_card_actions .pmpro_btn:hover,
.pmpro_card_actions .pmpro_btn-submit:hover {
    background-color: #a67c00 !important;
    transform: scale(1.05);
}

/* Espacement entre les champs utilisateur et la section prix */
#pmpro_pricing_fields {
    margin-top: 30px;   /* espace de respiration */
    padding-top: 20px;  /* petit padding interne en plus */
    border-top: 2px solid #ddd; /* ligne de séparation discrète */
    background-color: #fafafa; /* fond léger pour bien distinguer */
    border-radius: 8px;
}


/*
 * DESIGN FORMULAIRE DEMANDE CONFORMITE*
 * */

.chats-bureau-form label,
.conformite-form-content label {
    display: block;
    margin-bottom: 0px; /* espace réduit entre label et champ */
    font-weight: 600;
}

.chats-bureau-form p,
.conformite-form-content p {
    margin-bottom: 5px; /* réduit l’espace entre chaque champ */
}


/*****************************************************
  FORMULAIRE ÉLEVEUR — Style Premium façon CF7
******************************************************/
.fiche-eleveur-form {
  background: #fff;
  padding: 2.5rem;
  border-radius: 16px;
  box-shadow: 0 8px 25px rgba(0,0,0,0.08);
  max-width: 720px;
  margin: 2rem auto;
  font-family: "Segoe UI", Roboto, sans-serif;
  animation: fadeInUp 0.6s ease;
}

/* Titres */
.fiche-eleveur-form h2 {
  text-align: center;
  font-size: 1.6rem;
  margin-bottom: 1.5rem;
  color: #222;
  letter-spacing: 0.5px;
  position: relative;
}
.fiche-eleveur-form h2::after {
  content: "";
  display: block;
  width: 60px;
  height: 3px;
  background: linear-gradient(90deg,#d19a00,#b88300);
  margin: 0.5rem auto 0;
  border-radius: 2px;
}

/* Labels */
.fiche-eleveur-form label {
  display: block;
  font-weight: 600;
  margin: 10px 0 6px;
  color: #333;
  font-size: 0.95rem;
}

/* Champs */
.fiche-eleveur-form input[type="text"],
.fiche-eleveur-form input[type="email"],
.fiche-eleveur-form input[type="url"],
.fiche-eleveur-form input[type="tel"],
.fiche-eleveur-form input[type="number"],
.fiche-eleveur-form textarea,
.fiche-eleveur-form select {
  width: 100%;
  padding: 14px 16px;
  border: 1.5px solid #ddd;
  border-radius: 10px;
  font-size: 1rem;
  background: #fafafa;
  transition: all 0.25s ease;
  box-sizing: border-box;
}

.fiche-eleveur-form input:focus,
.fiche-eleveur-form textarea:focus,
.fiche-eleveur-form select:focus {
  border-color: #d19a00;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(209,154,0,0.15);
  outline: none;
}

/* Textarea */
.fiche-eleveur-form textarea {
  min-height: 100px;
  resize: vertical;
}

/* Grille responsive */
.form-row {
  display: flex;
  gap: 20px;
}
.form-row .form-col {
  flex: 1;
}
@media(max-width: 600px) {
  .form-row {
    flex-direction: column;
  }
}

/* Bouton */
.fiche-eleveur-form button {
  display: inline-block;
  background: linear-gradient(135deg, #d19a00, #b88300);
  color: #fff;
  font-size: 1.1rem;
  font-weight: 600;
  padding: 14px 30px;
  border: none;
  border-radius: 50px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.fiche-eleveur-form button:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.2);
  background: linear-gradient(135deg, #b88300, #8f6400);
}

/* Messages */
.fiche-eleveur-form .notice-success {
  margin-top: 20px;
  padding: 14px 18px;
  border-radius: 8px;
  font-weight: 500;
  background: #f0fff0;
  border: 1.5px solid #6c6;
  color: #2a7a2a;
}

/* Animations */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}