/* wwwroot/css/helper/utilities.css */

/* ============================================================
   Spacing Utilities
   Namespaced with "u-" so they never collide with Bootstrap's
   own spacing scale, which uses different increments.
   ============================================================ */

.u-mt-1 { margin-top: var(--spacing-1); }
.u-mt-2 { margin-top: var(--spacing-2); }
.u-mt-3 { margin-top: var(--spacing-3); }
.u-mt-4 { margin-top: var(--spacing-4); }
.u-mt-5 { margin-top: var(--spacing-5); }
.u-mt-6 { margin-top: var(--spacing-6); }

.u-mb-1 { margin-bottom: var(--spacing-1); }
.u-mb-2 { margin-bottom: var(--spacing-2); }
.u-mb-3 { margin-bottom: var(--spacing-3); }
.u-mb-4 { margin-bottom: var(--spacing-4); }
.u-mb-5 { margin-bottom: var(--spacing-5); }
.u-mb-6 { margin-bottom: var(--spacing-6); }

.u-my-1 { margin-top: var(--spacing-1); margin-bottom: var(--spacing-1); }
.u-my-2 { margin-top: var(--spacing-2); margin-bottom: var(--spacing-2); }
.u-my-3 { margin-top: var(--spacing-3); margin-bottom: var(--spacing-3); }
.u-my-4 { margin-top: var(--spacing-4); margin-bottom: var(--spacing-4); }
.u-my-5 { margin-top: var(--spacing-5); margin-bottom: var(--spacing-5); }
.u-my-6 { margin-top: var(--spacing-6); margin-bottom: var(--spacing-6); }

.u-p-1 { padding: var(--spacing-1); }
.u-p-2 { padding: var(--spacing-2); }
.u-p-3 { padding: var(--spacing-3); }
.u-p-4 { padding: var(--spacing-4); }
.u-p-5 { padding: var(--spacing-5); }
.u-p-6 { padding: var(--spacing-6); }

.u-py-1 { padding-top: var(--spacing-1); padding-bottom: var(--spacing-1); }
.u-py-2 { padding-top: var(--spacing-2); padding-bottom: var(--spacing-2); }
.u-py-3 { padding-top: var(--spacing-3); padding-bottom: var(--spacing-3); }
.u-py-4 { padding-top: var(--spacing-4); padding-bottom: var(--spacing-4); }
.u-py-5 { padding-top: var(--spacing-5); padding-bottom: var(--spacing-5); }
.u-py-6 { padding-top: var(--spacing-6); padding-bottom: var(--spacing-6); }

/* ============================================================
   Display Utilities
   ============================================================ */

.u-hidden {
  display: none !important;
}

.u-flex {
  display: flex;
}

.u-flex-center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.u-flex-between {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.u-flex-wrap {
  flex-wrap: wrap;
}

.u-gap-1 { gap: var(--spacing-1); }
.u-gap-2 { gap: var(--spacing-2); }
.u-gap-3 { gap: var(--spacing-3); }

/* ============================================================
   Text Utilities
   ============================================================ */

.u-text-center {
  text-align: center;
}

.u-text-muted {
  color: var(--color-text-muted);
}

.u-text-secondary {
  color: var(--color-text-secondary);
}

.u-text-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Visually hides content while keeping it available to screen readers. */
.u-visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}