/* sako-internal — utilities (use sparingly, as exceptions, not foundation) */

@layer utilities {
  .flex         { display: flex; }
  .grid         { display: grid; }
  .block        { display: block; }
  .inline-block { display: inline-block; }
  .hide         { display: none !important; }

  .gap      { gap: var(--space-3); }
  .gap-sm   { gap: var(--space-2); }
  .gap-lg   { gap: var(--space-6); }

  .txt-center  { text-align: center; }
  .txt-right   { text-align: right; }
  .txt-sm      { font-size: var(--text-sm); }
  .txt-xs      { font-size: var(--text-xs); }
  .txt-lg      { font-size: var(--text-lg); }
  .txt-muted   { color: var(--ink-2); }
  .txt-mono    { font-family: var(--font-mono); }
  .txt-nowrap  { white-space: nowrap; }

  /* legacy aliases used by existing views */
  .txt-small   { font-size: var(--text-sm); }
  .txt-large   { font-size: var(--text-lg); }
  .txt-subtle  { color: var(--ink-2); }

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