/* ============================================================
   CORRECTION D'UNE RÈGLE DU GABARIT

   css/style.css contient, ligne 5046 :

        input, section { clear: both; padding-top: 10px; display: none; }

   Elle vise les onglets du gabarit — qui emploient des « input »
   cachés — mais elle est écrite SANS AUCUNE RESTRICTION. Elle
   masque donc TOUS les champs du site : cases à cocher, boutons
   radio, champs de saisie.

   Les champs texte s'en sortaient parce que .form-control leur
   redonne « display » indirectement. Les CASES À COCHER, elles,
   restaient invisibles — d'où l'impossibilité de choisir un module
   ou d'accepter les conditions.

   On rétablit ici l'affichage normal, sans toucher au fichier du
   gabarit : une mise à jour l'écraserait.
   ============================================================ */
input:not(.tab-input),
select,
textarea {
  display: inline-block;
  clear: none;
  padding-top: 0;
}
input[type="checkbox"], input[type="radio"] { display: inline-block !important; }
.form-control, .contact-form input, .contact-form select, .contact-form textarea {
  display: block;
}

/* ============================================================
   JERE360 — ajustements au gabarit Dcode
   Chargée APRÈS style.css. On ne modifie JAMAIS les fichiers du
   gabarit : une mise à jour du gabarit écraserait nos réglages.
   ============================================================ */

/* Le logo du gabarit était un mot court ; le nôtre porte le
   symbole ET la signature « La gestion, à 360 degrés ».
   Il lui faut donc plus de hauteur pour rester lisible. */
.logo img { max-height: 100px !important; }
.menu-fixed .logo img { max-height: 72px !important; }
.logo-container { padding: 18px 0 !important; }
.menu-fixed .logo-container { padding: 10px 0 !important; }

@media (max-width: 991px) {
  .logo img { max-height: 72px !important; }
}
@media (max-width: 575px) {
  .logo img { max-height: 56px !important; }
}

/* La photo d'équipe en ouverture : arrondie comme les visuels
   du gabarit, avec la même ombre portée. */
.page-header .image-wrapper img {
  border-radius: 14px;
  box-shadow: 0 24px 60px rgba(24, 35, 56, .22);
}

/* Les cases de modules : le gabarit en prévoyait six par rangée,
   nos libellés sont plus longs. */
.module-section .features-block .text h4 {
  font-size: 15px;
  line-height: 1.35;
}

/* Le formulaire : le gabarit ne prévoyait pas de cases à cocher
   en liste. On les aligne proprement. */
.contact-form label input[type="checkbox"] {
  width: auto;
  height: auto;
  min-height: 0;
}
.contact-form h4 {
  padding-bottom: .5rem;
  border-bottom: 1px solid rgba(0, 0, 0, .08);
}

/* ============================================================
   LE FORMULAIRE — CORRECTION

   Le gabarit impose « height: 48px » à tout .form-control. Sur un
   <select>, cela écrase la flèche et rend la liste difficile à
   ouvrir ; sur une case à cocher, cela produit un carré géant
   invisible. On rétablit un comportement normal.
   ============================================================ */

/* Les listes déroulantes : flèche visible, hauteur respectée */
.contact-form select.form-control,
select.form-control {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath fill='%236C7891' d='M1.4 0L7 5.6 12.6 0 14 1.4 7 8.4 0 1.4z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  padding-right: 42px !important;
  cursor: pointer;
}

/* Les cases à cocher.

   Le gabarit redessine les cases lui-même — appearance:none, puis
   une coche dessinée en ::before — mais uniquement dans .form-group.
   Nos blocs de modules n'en font pas partie : les cases y étaient
   donc invisibles, et impossibles à cocher.

   On reprend SON style plutôt que de le combattre : l'apparence
   reste celle du gabarit, et les cases fonctionnent. */
.choix-module {
  display: flex;
  align-items: flex-start;
  gap: .7rem;
  background: #F7F9FC;
  border: 1px solid #E0E6F0;
  border-radius: 8px;
  padding: .8rem .9rem;
  margin-bottom: .7rem;
  transition: border-color .15s, background .15s;
}
.choix-module:hover { border-color: var(--primary-color); background: #fff; }

.choix-module input[type="checkbox"] {
  position: relative;
  width: 22px;
  height: 22px;
  min-height: 0;
  flex: 0 0 22px;
  margin: 2px 0 0;
  padding: 0;
  border: 1px solid #ced4da;
  border-radius: 4px;
  background: #fff;
  -webkit-appearance: none;
  appearance: none;
  outline: 0;
  cursor: pointer;
  transition: all .25s;
}
.choix-module input[type="checkbox"]::before {
  position: absolute;
  content: '';
  display: block;
  top: 2px;
  left: 7px;
  width: 8px;
  height: 14px;
  border-style: solid;
  border-color: #fff;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
  opacity: 0;
}
.choix-module input[type="checkbox"]:checked {
  background: var(--primary-color);
  border-color: var(--primary-color);
}
.choix-module input[type="checkbox"]:checked::before { opacity: 1; }
.choix-module input[type="checkbox"]:focus-visible {
  box-shadow: 0 0 0 3px rgba(242, 140, 40, .25);
}

.choix-module label {
  margin: 0 !important;
  cursor: pointer;
  font-weight: 400;
  line-height: 1.45;
  flex: 1;
}
.choix-module label strong {
  display: block;
  font-size: 15px;
  font-weight: 600;
  color: var(--heading-text-color);
}
.choix-module label small {
  display: block;
  font-size: 13px;
  opacity: .72;
  margin-top: .1rem;
  line-height: 1.45;
}
.choix-conditions { background: #fff; }
.choix-conditions label { font-size: 14.5px; }