/**
 * @file
 * Button Row SDC — flex layout for Button — Modal pairs.
 *
 * Figma desktop 29999:57107 > 29727:97466 — row, gap 32px, buttons hug content.
 * Figma mobile 29999:57211 — stacked full-width, gap 16px between buttons.
 */

.button-row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 32px;
  width: 100%;
}

.button-row--center {
  justify-content: center;
}

.button-row > * {
  flex: 0 1 auto;
  max-width: 100%;
}

@media (max-width: 767px) {

  .button-row {
    flex-direction: column;
    gap: 16px;
  }

  .button-row > * {
    width: 100%;
  }

}
