/* Utility Classes */

/* Minimal, exception-based utilities - keep additive, not foundational */

@layer utilities {
  /* ============================================
     VISIBILITY
     ============================================ */
  .u-hidden {
    display: none !important;
  }

  .u-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;
  }

  /* ============================================
     LAYOUT HELPERS
     ============================================ */
  .u-block {
    display: block;
  }

  .u-flex {
    display: flex;
  }

  .u-flex-col {
    display: flex;
    flex-direction: column;
  }

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

  .u-items-start {
    align-items: flex-start;
  }

  .u-justify-between {
    justify-content: space-between;
  }

  .u-justify-center {
    justify-content: center;
  }

  .u-justify-end {
    justify-content: flex-end;
  }

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

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

  .u-gap-xs {
    gap: var(--space-xs);
  }

  .u-gap-sm {
    gap: var(--space-sm);
  }

  .u-gap-md {
    gap: var(--space-md);
  }

  .u-gap-lg {
    gap: var(--space-lg);
  }

  .u-grid {
    display: grid;
  }

  .u-grid-cols-2 {
    grid-template-columns: repeat(2, 1fr);
  }

  .u-grid-cols-3 {
    grid-template-columns: repeat(3, 1fr);
  }

  .u-grid-cols-4 {
    grid-template-columns: repeat(4, 1fr);
  }

  .u-grid-cols-5 {
    grid-template-columns: repeat(5, 1fr);
  }

  /* ============================================
     SPACING (exception-based, use sparingly)
     ============================================ */
  .u-mt-0 {
    margin-top: 0 !important;
  }

  .u-mt-xs {
    margin-top: var(--space-xs);
  }

  .u-mt-sm {
    margin-top: var(--space-sm);
  }

  .u-mt-md {
    margin-top: var(--space-md);
  }

  .u-mt-lg {
    margin-top: var(--space-lg);
  }

  .u-mt-xl {
    margin-top: var(--space-xl);
  }

  .u-mt-xxl {
    margin-top: var(--space-xxl);
  }

  .u-mb-0 {
    margin-bottom: 0 !important;
  }

  .u-mb-xs {
    margin-bottom: var(--space-xs);
  }

  .u-mb-sm {
    margin-bottom: var(--space-sm);
  }

  .u-mb-md {
    margin-bottom: var(--space-md);
  }

  .u-mb-lg {
    margin-bottom: var(--space-lg);
  }

  .u-mb-xl {
    margin-bottom: var(--space-xl);
  }

  .u-mb-xxl {
    margin-bottom: var(--space-xxl);
  }

  .u-ml-sm {
    margin-left: var(--space-sm);
  }

  .u-ml-lg {
    margin-left: var(--space-lg);
  }

  .u-my-md {
    margin-top: var(--space-md);
    margin-bottom: var(--space-md);
  }

  .u-mx-auto {
    margin-left: auto;
    margin-right: auto;
  }

  .u-m-0 {
    margin: 0 !important;
  }

  .u-p-0 {
    padding: 0 !important;
  }

  .u-p-md {
    padding: var(--space-md);
  }

  .u-p-lg {
    padding: var(--space-lg);
  }

  .u-p-xl {
    padding: var(--space-xl);
  }

  .u-pt-lg {
    padding-top: var(--space-lg);
  }

  .u-pt-xl {
    padding-top: var(--space-xl);
  }

  .u-pb-md {
    padding-bottom: var(--space-md);
  }

  .u-px-lg {
    padding-left: var(--space-lg);
    padding-right: var(--space-lg);
  }

  .u-py-xxl {
    padding-top: var(--space-xxl);
    padding-bottom: var(--space-xxl);
  }

  /* ============================================
     TEXT
     ============================================ */
  .u-text-center {
    text-align: center;
  }

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

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

  /* Font sizes */
  .u-text-xs {
    font-size: var(--font-size-xs);
  }

  .u-text-sm {
    font-size: var(--font-size-sm);
  }

  .u-text-md {
    font-size: var(--font-size-md);
  }

  .u-text-lg {
    font-size: var(--font-size-lg);
  }

  .u-text-xl {
    font-size: var(--font-size-xl);
  }

  .u-text-2xl {
    font-size: var(--font-size-2xl);
  }

  /* Font weights */
  .u-text-normal {
    font-weight: var(--font-weight-normal);
  }

  .u-text-medium {
    font-weight: var(--font-weight-medium);
  }

  .u-text-semibold {
    font-weight: var(--font-weight-semibold);
  }

  .u-text-bold {
    font-weight: var(--font-weight-bold);
  }

  /* Text colors */
  .u-text-muted {
    color: var(--color-gray-3);
  }

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

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

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

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

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

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

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

  /* Text styles */
  .u-text-italic {
    font-style: italic;
  }

  .u-text-underline {
    text-decoration: underline;
  }

  .u-text-no-underline {
    text-decoration: none;
  }

  .u-text-uppercase {
    text-transform: uppercase;
  }

  .u-text-lowercase {
    text-transform: lowercase;
  }

  .u-text-capitalize {
    text-transform: capitalize;
  }

  /* Line heights */
  .u-leading-tight {
    line-height: var(--line-height-tight);
  }

  .u-leading-normal {
    line-height: var(--line-height-normal);
  }

  .u-leading-relaxed {
    line-height: var(--line-height-relaxed);
  }

  /* ============================================
     WIDTH
     ============================================ */
  .u-w-full {
    width: 100%;
  }

  .u-min-width-150 {
    min-width: 150px;
  }

  /* ============================================
     DIVIDER
     ============================================ */
  .u-divider {
    height: 1px;
    background: var(--color-gray-2);
    margin: var(--space-xl) 0;
    border: none;
  }

  /* ============================================
     CONTAINERS
     ============================================ */
  .container {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }

  .container--narrow {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }

  .container--form {
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }

  .container--full {
    max-width: none;
  }

  .container--wide {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }

  /* ============================================
     BACKGROUNDS & BORDERS
     ============================================ */
  .u-bg-secondary {
    background-color: var(--color-bg-secondary);
  }

  .u-rounded-md {
    border-radius: var(--radius-md);
  }

  .u-border-bottom {
    border-bottom: 1px solid var(--color-gray-2);
  }

  .u-border-top {
    border-top: 1px solid var(--color-gray-2);
  }

  /* ============================================
     TYPOGRAPHY EXTRAS
     ============================================ */
  .u-font-mono {
    font-family: var(--font-mono);
  }

  .u-list-disc {
    list-style: disc;
  }

  /* ============================================
     TRUNCATION
     ============================================ */
  .u-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .u-break-all {
    word-break: break-all;
    min-width: 0;
  }
}
