/* Eén kaart per deelnemer: kopje "Deelnemer N", velden in twee kolommen en
   het verwijdericoon rechtsboven. Selectors op data-drupal-selector, want de
   id-attributen krijgen bij een Ajax-herbouw een --2-suffix. */
[data-drupal-selector="edit-deelnemers-items"] {
  display: block;
  width: 100%;
}
[data-drupal-selector="edit-deelnemers-items"] > thead {
  display: none;
}
[data-drupal-selector="edit-deelnemers-items"] > tbody {
  display: block;
  counter-reset: deelnemer;
}
[data-drupal-selector="edit-deelnemers-items"] > tbody > tr {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 0.75rem;
  padding: 1.25rem 1.5rem;
  margin-bottom: 1rem;
}
/* Het kopje per kaart, met taalvarianten voor FR en EN. */
[data-drupal-selector="edit-deelnemers-items"] > tbody > tr::before {
  counter-increment: deelnemer;
  content: "Deelnemer " counter(deelnemer);
  grid-row: 1;
  grid-column: 1;
  font-weight: 600;
  font-size: 0.875rem;
  color: #111827;
}
[data-drupal-selector="edit-deelnemers-items"] > tbody > tr:lang(fr)::before {
  content: "Participant " counter(deelnemer);
}
[data-drupal-selector="edit-deelnemers-items"] > tbody > tr:lang(en)::before {
  content: "Participant " counter(deelnemer);
}
/* De velden: twee kolommen, over de volle kaartbreedte. */
[data-drupal-selector="edit-deelnemers-items"] > tbody > tr > td:first-child {
  grid-row: 2;
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 1.5rem;
  padding: 0.75rem 0 0;
}
@media (max-width: 767px) {
  [data-drupal-selector="edit-deelnemers-items"] > tbody > tr > td:first-child {
    grid-template-columns: minmax(0, 1fr);
  }
}
/* De onderste veldmarge valt weg tegen de kaartpadding, zodat de witruimte
   boven en onder gelijk is. */
[data-drupal-selector="edit-deelnemers-items"] > tbody > tr > td:first-child > .form-item:last-child {
  margin-bottom: 0;
}
/* Het verwijdericoon rechtsboven, naast het kopje. De plus per rij is
   dubbelop met de knop "Deelnemer toevoegen" en gaat weg. */
[data-drupal-selector="edit-deelnemers-items"] > tbody > tr > td:last-child {
  grid-row: 1;
  grid-column: 2;
  justify-self: end;
  white-space: nowrap;
}
[data-drupal-selector="edit-deelnemers-items"] [data-drupal-selector$="-operations-add"] {
  display: none;
}