/* ============================================================
   Come To Farm — Page /rejoindre (#428) : être prévenu de l'ouverture
   Le gabarit est celui de /preinscription (styles/preinscription.css) ; ici, seulement
   ce qui est propre à /rejoindre : le code postal, les produits recherchés (« Tout
   cocher » + 11 cases), la désinscription.
   Téléphone d'abord. Organic Editorialism (DESIGN.md) : pas de bordure 1px de
   séparation, pas d'ombre portée standard, pas de gris.
   ============================================================ */

/* — Code postal : un champ court — */
.rejoindre__code-postal .input {
  max-width: 10rem;
}

/* — Produits recherchés — */
.rejoindre__produits {
  border: 0;
  padding: 0;
  margin: 0 0 var(--spacing-5);
  min-width: 0;
}

.rejoindre__question {
  padding: 0;
  font-size: var(--text-label-lg);
  font-weight: var(--weight-semibold);
  line-height: var(--leading-body);
}

.rejoindre__produits > .preinscription__aide {
  margin: var(--spacing-1) 0 var(--spacing-3);
}

.rejoindre__produits-liste {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-2);
}

/* Une case = une ligne entière à toucher (au moins 44 px de haut). */
.rejoindre__produit {
  display: flex;
  align-items: center;
  gap: var(--spacing-3);
  min-height: var(--touch-target-min);
  padding: var(--spacing-2) var(--spacing-3);
  background: var(--color-surface-container-low);
  border-radius: var(--radius-md);
  font-weight: var(--weight-medium);
  line-height: 1.3;
  cursor: pointer;
}

.rejoindre__produit input[type="checkbox"] {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  accent-color: var(--color-primary);
  cursor: pointer;
}

.rejoindre__produit:has(input:checked) {
  background: var(--color-primary-fixed);
}

.rejoindre__produit input:focus-visible {
  outline: 3px solid var(--color-primary);
  outline-offset: 3px;
}

/* « Tout cocher » : en tête, détaché des 11 cases par un décalage de surface. */
.rejoindre__produit--tout {
  margin-bottom: var(--spacing-2);
  background: var(--color-surface-container);
  font-weight: var(--weight-semibold);
}

/* Aucune case cochée après une tentative d'envoi. */
.rejoindre__produits[aria-invalid="true"] .rejoindre__produit {
  box-shadow: inset 0 0 0 2px var(--color-error-text);
}

/* — Désinscription — la carte se pose sous un chapeau réduit au titre — */
.rejoindre-page.rejoindre--desinscription .preinscription__chapeau {
  display: none;
}

.rejoindre__desinscription p {
  font-size: var(--text-body-lg);
  line-height: var(--leading-body);
  margin-bottom: var(--spacing-5);
}

.rejoindre__desinscription h2 {
  font-family: var(--font-display);
  font-size: var(--text-headline-md);
  font-weight: var(--weight-extrabold);
  color: var(--color-primary);
  margin-bottom: var(--spacing-3);
}

/* — Tablette et ordinateur : les cases sur deux colonnes — */
@media (min-width: 480px) {
  .rejoindre__produits-liste {
    grid-template-columns: 1fr 1fr;
  }
}