/* Small single-purpose helpers. Loaded last so they win over components. */

.stack { display: flex; flex-direction: column; gap: var(--stack-gap, 12px); }
.stack--xs { --stack-gap: 6px; }
.stack--sm { --stack-gap: 8px; }
.stack--lg { --stack-gap: 20px; }
.stack--xl { --stack-gap: 28px; }

.row { display: flex; align-items: center; gap: var(--row-gap, 12px); flex-wrap: wrap; }
.row--sm { --row-gap: 8px; }
.row--between { justify-content: space-between; }
.row--end { justify-content: flex-end; }
.row--baseline { align-items: baseline; }
.row--nowrap { flex-wrap: nowrap; }

.grow { flex: 1; min-width: 0; }
.mt-auto { margin-top: auto; }
.self-start { align-self: flex-start; }
.self-end { align-self: flex-end; }
.text-center { text-align: center; }
.nowrap { white-space: nowrap; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.button_to { display: contents; } /* forms generated by button_to */
