/**
 * @file
 * Visual styles for buttons.
 */

.button,
.image-button {
  margin-right: 1em;
  margin-left: 1em;
}
.button:first-child,
.image-button:first-child {
  margin-right: 0;
  margin-left: 0;
}

/* ==========================================================================
   Buttons & CTAs
   ========================================================================== */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-sm) var(--space-lg);
  font-weight: var(--fw-medium);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  transition: background-color var(--transition-base:), color var(--transition-base:) border var(--transition-base:);
  border: 2px solid transparent;
}

.btn--centered {
  display: flex; /* remplace inline-flex */
  margin-inline: auto;
  width: fit-content;
}

.btn--centered---large {
  display: flex; /* remplace inline-flex */
  margin-inline: auto;
}

/* Variantes */
.btn--primary {
  background-color: var(--clr-primary);
  color: var(--clr-white);
  border-color: var(--clr-primary);
}

.btn--white {
  background-color: var(--clr-white);
  color: var(--clr-default);
  border-color: var(--clr-white);
}

.btn--white:hover {
  background-color: var(--clr-primary);
  color: var(--clr-white);
  border-color: var(--clr-primary);
}

.btn--outline {
  background-color: transparent;
  color: var(--clr-default);
  border-color: var(--clr-primary);
}

/* Tailles */
.btn--large {
  padding: var(--space-md) var(--space-xl);
  font-size: var(--font-size-lg);
}

.btn--small {
  padding: var(--space-xs) var(--space-md);
  font-size: var(--font-size-sm);
}

.btn--margin---top10 { margin-top: var(--space-10); }

/* ── Infinite scroll pager wrapper ─────────────────────────── */
[data-drupal-views-infinite-scroll-pager] {
  list-style: none;
  margin: var(--space-8) 0;
  padding: 0;
  display: flex;
  justify-content: center;
}