/* Formulaire de contact — habillage Bootstrap aux couleurs du site.
   ------------------------------------------------------------------
   Chargé UNIQUEMENT là où un formulaire Contact Form 7 existe, sous la même
   condition que les actifs CF7 (tlb3_cf7_actifs_requis, inc/cf7.php) : une
   seule page sur ~120 000.

   Les classes .form-control / .form-select / .btn sont posées sur le balisage
   de CF7 par tlb3_cf7_habiller_formulaire(). Ce fichier ne fait que les
   raccorder à la palette : sans lui, .btn-primary sortirait au bleu #0d6efd de
   Bootstrap et le focus des champs aussi — exactement le « rendu thème
   Bootstrap standard » que la direction artistique proscrit (CLAUDE.md du
   thème, §10). On surcharge par les variables --bs-*, prévues pour cela en
   Bootstrap 5.3 : aucune règle n'est réécrite, la mécanique du composant reste
   celle de Bootstrap. */

/* Bouton d'envoi ---------------------------------------------------------- */
.wpcf7-form .btn-primary {
  --bs-btn-bg: var(--tlb-violet-500);
  --bs-btn-border-color: var(--tlb-violet-500);
  --bs-btn-hover-bg: var(--tlb-violet-600);
  --bs-btn-hover-border-color: var(--tlb-violet-600);
  --bs-btn-active-bg: var(--tlb-violet-600);
  --bs-btn-active-border-color: var(--tlb-violet-600);
  --bs-btn-disabled-bg: var(--tlb-violet-500);
  --bs-btn-disabled-border-color: var(--tlb-violet-500);
  --bs-btn-focus-shadow-rgb: 124, 58, 237;   /* --tlb-violet-500 en RGB */
  --bs-btn-border-radius: var(--tlb-rayon-bouton);
  padding: .75rem 1.5rem;
  font-weight: 700;
  /* 44px minimum : cible tactile, 70 % du trafic est mobile. */
  min-height: 44px;
}

/* Champs ------------------------------------------------------------------ */
.wpcf7-form .form-control,
.wpcf7-form .form-select {
  /* Même rayon que les boutons : il n'existe pas de token dédié aux champs,
     et en inventer un pour une seule page serait de la dette. */
  --bs-border-radius: var(--tlb-rayon-bouton);
  min-height: 44px;
}

.wpcf7-form .form-control:focus,
.wpcf7-form .form-select:focus {
  border-color: var(--tlb-focus);
  /* Halo de la palette, pas le bleu de Bootstrap. */
  box-shadow: 0 0 0 .25rem rgba(124, 58, 237, .25);
}

/* Les champs de CF7 sont enveloppés dans un <span> inline : sans cette règle,
   .form-control (largeur 100 %) se calerait sur la largeur du span, pas sur
   celle du formulaire. */
.wpcf7-form .wpcf7-form-control-wrap {
  display: block;
}

.wpcf7-form label {
  display: block;
  font-weight: 600;
  margin-bottom: .5rem;
}

.wpcf7-form p {
  margin-bottom: 1.25rem;
}

/* Case à cocher du consentement.
   Elle ne reçoit PAS .form-check-input : CF7 rend sa propre structure
   (span.wpcf7-list-item > label > input + span), qui ne correspond pas au
   balisage attendu par .form-check de Bootstrap. On l'aligne à la main. */
.wpcf7-form .wpcf7-acceptance .wpcf7-list-item {
  margin: 0;
}

.wpcf7-form .wpcf7-acceptance label {
  display: flex;
  gap: .625rem;
  align-items: flex-start;
  font-weight: 400;
}

.wpcf7-form .wpcf7-acceptance input[type="checkbox"] {
  /* 20px : assez grand pour être touché sans agrandir la ligne de texte. */
  width: 20px;
  height: 20px;
  margin-top: .125rem;
  flex: 0 0 auto;
  accent-color: var(--tlb-violet-500);
}

/* Astérisque des champs requis et texte d'aide (posés dans le contenu du
   formulaire, déjà présents en production avant cet habillage). */
.tlb-requis {
  color: var(--tlb-erreur, #b3261e);
}

.tlb-aide {
  display: block;
  margin-top: .375rem;
  font-size: .875rem;
  color: var(--tlb-attenue);
}