/* utilities.css — Spacing and text helpers */

.text-center  { text-align: center; }
.text-right   { text-align: right; }
.text-muted   { color: var(--text-secondary); }
.text-light   { color: var(--text-light); }
.text-sm      { font-size: 0.875rem; }
.text-xs      { font-size: 0.75rem; }
.font-mono    { font-family: var(--font-mono); }
.font-heading { font-family: var(--font-heading); }

.mt-1 { margin-top: var(--s1); }
.mt-2 { margin-top: var(--s2); }
.mt-3 { margin-top: var(--s3); }
.mt-4 { margin-top: var(--s4); }
.mb-1 { margin-bottom: var(--s1); }
.mb-2 { margin-bottom: var(--s2); }
.mb-3 { margin-bottom: var(--s3); }
.mb-4 { margin-bottom: var(--s4); }

.flex           { display: flex; }
.flex-between   { display: flex; justify-content: space-between; align-items: center; }
.flex-center    { display: flex; justify-content: center; align-items: center; }
.gap-1          { gap: var(--s1); }
.gap-2          { gap: var(--s2); }
.flex-wrap      { flex-wrap: wrap; }

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