/* ============================================================
   Formulaire de contact (Contact Form 7) — charte « Instants de ville »
   ============================================================ */

.wpcf7-form {
  margin: 0;
}

/* Lignes : une colonne par défaut, deux colonnes pour la variante --2 */
.pp-form-row {
  margin-bottom: 18px;
}
.pp-form-row--2 {
  margin-bottom: 18px;
}
/* CF7 / wpautop enveloppe les champs dans un <p>. C'est CE <p> qui doit
   porter la grille, car c'est lui l'enfant réel, pas les champs. */
.pp-form-row--2 > p {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  align-items: start;
  margin: 0;
}
/* Les <br> insérés par wpautop entre les deux champs ne doivent pas créer
   de cellule de grille parasite. */
.pp-form-row--2 br {
  display: none;
}
/* CF7 enveloppe chaque champ dans un span inline : il doit occuper toute
   la largeur de sa cellule de grille. */
.pp-form-row--2 .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
}
@media (max-width: 560px) {
  .pp-form-row--2 > p {
    grid-template-columns: 1fr;
    gap: 18px;
  }
}

/* Champs texte, email, tel, textarea, select */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form textarea,
.wpcf7-form select {
  width: 100%;
  font-family: var(--font-body);
  font-size: calc(1rem * var(--ui-scale));
  color: var(--ink);
  background: var(--paper);
  border: var(--line-weight) solid var(--line);
  border-radius: var(--radius-sm);
  padding: 13px 15px;
  line-height: 1.4;
  transition: border-color .15s ease, box-shadow .15s ease;
  -webkit-appearance: none;
  appearance: none;
}

.wpcf7-form textarea {
  min-height: 160px;
  resize: vertical;
}

/* Flèche personnalisée pour le select */
.wpcf7-form select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23165641' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 15px center;
  padding-right: 42px;
  cursor: pointer;
}

/* Placeholder */
.wpcf7-form ::placeholder {
  color: var(--ink-soft);
  opacity: .7;
}

/* Focus : liseré bordeaux */
.wpcf7-form input[type="text"]:focus,
.wpcf7-form input[type="email"]:focus,
.wpcf7-form input[type="tel"]:focus,
.wpcf7-form textarea:focus,
.wpcf7-form select:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--color-primary) 14%, transparent);
}

/* Case de consentement RGPD */
.pp-form-consent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: calc(0.92rem * var(--ui-scale));
  color: var(--ink-soft);
  line-height: 1.5;
}
.pp-form-consent .wpcf7-list-item {
  margin: 0;
}
.pp-form-consent input[type="checkbox"] {
  margin-top: 3px;
  width: 17px;
  height: 17px;
  accent-color: var(--color-primary);
  flex: 0 0 auto;
}

/* Bouton d'envoi : reprend le style .btn-primary du thème */
.pp-form-submit {
  margin-top: 6px;
}
.wpcf7-form .wpcf7-submit {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: calc(1rem * var(--ui-scale));
  letter-spacing: -0.01em;
  color: var(--white);
  background: var(--color-primary);
  border: none;
  border-radius: var(--radius-sm);
  padding: 14px 28px;
  cursor: pointer;
  transition: background .15s ease, transform .05s ease;
}
.wpcf7-form .wpcf7-submit:hover {
  background: color-mix(in oklab, var(--color-primary) 88%, black);
}
.wpcf7-form .wpcf7-submit:active {
  transform: translateY(1px);
}

/* États CF7 : messages de réponse et erreurs de validation */
.wpcf7 form .wpcf7-response-output {
  margin: 18px 0 0;
  padding: 13px 16px;
  border-radius: var(--radius-sm);
  border-width: var(--line-weight);
  font-size: calc(0.95rem * var(--ui-scale));
  line-height: 1.5;
}
.wpcf7 form.sent .wpcf7-response-output {
  border-color: #2e7d32;
  background: color-mix(in oklab, #2e7d32 8%, var(--paper));
  color: #1b4d1f;
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output {
  border-color: var(--color-primary);
  background: color-mix(in oklab, var(--color-primary) 7%, var(--paper));
  color: var(--color-primary);
}
.wpcf7-not-valid-tip {
  color: var(--color-primary);
  font-size: calc(0.85rem * var(--ui-scale));
  margin-top: 5px;
}
.wpcf7-form .wpcf7-not-valid {
  border-color: var(--color-primary) !important;
}

/* Indicateur de chargement */
.wpcf7-spinner {
  margin: 0 0 0 12px;
}