/* ==========================================================================
   POPUP CONTACT FORM 7 — Overlay + fenêtre
   ========================================================================== */


/* Fond noir derrière la popup */
.popup-overlay {
    position: fixed !important;
    inset: 0 !important;

    display: flex !important;
    justify-content: center !important;
    align-items: center !important;

    background: rgba(0, 0, 0, .65) !important;

    opacity: 0 !important;
    visibility: hidden !important;

    transition: opacity .3s ease, visibility .3s ease !important;

    z-index: 99999 !important;

    padding: 1.5rem !important;
}


/* Popup ouverte */
.popup-overlay.active {
    opacity: 1 !important;
    visibility: visible !important;
}


/* Contenu de la popup */
.popup-box {
    position: relative !important;

    width: 100% !important;
    max-width: 650px !important;

    max-height: 90vh !important;
    overflow-y: auto !important;

    background: #fff !important;

    padding: 2.5rem !important;

    border-radius: 20px !important;

    box-shadow: 0 25px 70px rgba(0,0,0,.25) !important;

    transform: translateY(30px) scale(.96) !important;

    transition: transform .35s ease !important;
}


/* Animation ouverture */
.popup-overlay.active .popup-box {
    transform: translateY(0) scale(1) !important;
}


/* Bouton fermeture */
.popup-close {
    position: absolute !important;

    top: 15px !important;
    right: 20px !important;

    width: 38px !important;
    height: 38px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border: none !important;

    background: transparent !important;

    color: var(--blue-deep, #0A2F5C) !important;

    font-size: 2rem !important;

    line-height: 1 !important;

    cursor: pointer !important;

    transition: transform .25s ease, opacity .25s ease !important;
}


.popup-close:hover {
    transform: rotate(90deg) !important;
    opacity: .7 !important;
}


/* Titre popup */
.popup-box .form-title,
.popup-box h2 {
    font-size: 1.4rem !important;

    color: var(--blue-deep) !important;

    margin-bottom: 1.5rem !important;

    font-weight: 700 !important;
}



/* Formulaire CF7 dans la popup */
.popup-box .wpcf7 {
    width: 100% !important;
}


/* Bouton submit adapté popup */
.popup-box .wpcf7-form input[type="submit"].btn-block {
    width: 100% !important;
}



/* ==========================================================================
   RESPONSIVE
   ========================================================================== */


@media (max-width: 700px) {

    .popup-overlay {
        padding: 1rem !important;
    }


    .popup-box {

        padding: 1.5rem !important;

        border-radius: 15px !important;

        max-height: 95vh !important;
    }


    .popup-close {

        top: 10px !important;
        right: 12px !important;

        font-size: 1.8rem !important;
    }


    .popup-box h2 {
        font-size: 1.2rem !important;
        padding-right: 30px !important;
    }

}





/* ==========================================================================
   FORMULAIRE CONTACT (Contact Form 7) — Layout + responsive
   ========================================================================== */

.form-title {
  font-size: 1.4rem !important;
  color: var(--blue-deep) !important;
  margin-bottom: 1.5rem !important;
}

.field-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 1.2rem !important;
}

.field {
  display: flex !important;
  flex-direction: column !important;
  gap: .4rem !important;
  margin-bottom: 1.2rem !important;
}

.field label {
  font-size: .88rem !important;
  font-weight: 600 !important;
  color: var(--blue-deep) !important;
}

/* Champs générés par CF7 (input, select, textarea) */
.field .wpcf7-form-control {
  width: 100% !important;
  padding: .75rem 1rem !important;
  border: 1px solid var(--border, rgba(10,47,92,.15)) !important;
  border-radius: 10px !important;
  font-size: .95rem !important;
  font-family: inherit !important;
  color: var(--blue-deep) !important;
  background: var(--surface-2, #fff) !important;
  transition: border-color .25s ease, box-shadow .25s ease !important;
}

.field .wpcf7-form-control:focus {
  outline: none !important;
  border-color: var(--blue-primary, #0F5AA6) !important;
  box-shadow: 0 0 0 3px rgba(15,90,166,.12) !important;
}

.field textarea.wpcf7-form-control {
  min-height: 140px !important;
  resize: vertical !important;
}

.field select.wpcf7-form-control {
  appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230A2F5C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 1rem center !important;
  background-size: 18px !important;
  padding-right: 2.6rem !important;
}

/* CF7 enveloppe chaque champ dans un span — on le laisse transparent pour ne pas casser le layout */
.field .wpcf7-form-control-wrap {
  display: block !important;
  width: 100% !important;
}

/* Messages d'erreur par champ */
.field .wpcf7-not-valid-tip {
  font-size: .8rem !important;
  color: var(--red-600, #c0392b) !important;
  margin-top: .3rem !important;
}

.field .wpcf7-form-control.wpcf7-not-valid {
  border-color: var(--red-600, #c0392b) !important;
}

/* Bouton submit */
.wpcf7-form input[type="submit"].btn-block {
  width: 40% !important;
  margin-top: .5rem !important;
  color: white;
  border: none;
  border-radius: 25px;
  padding: 10px 20px !important;
}

/* Message global de statut (succès/erreur d'envoi) */
.wpcf7-form .wpcf7-response-output {
  margin-top: 1rem !important;
  padding: .8rem 1rem !important;
  border-radius: 10px !important;
  font-size: .9rem !important;
  text-align: center !important;
}

.wpcf7-form.sent .wpcf7-response-output {
  background: var(--green-50, #eaf3de) !important;
  color: var(--green-800, #27500a) !important;
  border: 1px solid var(--green-200, #97c459) !important;
}

.wpcf7-form.invalid .wpcf7-response-output,
.wpcf7-form.failed .wpcf7-response-output,
.wpcf7-form.aborted .wpcf7-response-output,
.wpcf7-form.spam .wpcf7-response-output {
  background: var(--red-50, #fcebeb) !important;
  color: var(--red-800, #791f1f) !important;
  border: 1px solid var(--red-200, #f09595) !important;
}

/* Petit spinner pendant l'envoi (généré par CF7) */
.wpcf7-form .wpcf7-spinner {
  margin-left: .6rem !important;
}