/*
  Wortic macOS UI Kit — Spacing utilities
  Utilitários finos que consomem a escala de --wm-space-*.
  Use com moderação: componentes devem preferir CSS próprio;
  estas classes servem para composição em patterns/examples.
*/

@layer utilities {
  .wm-stack {
    display: flex;
    flex-direction: column;
  }
  .wm-row {
    display: flex;
    flex-direction: row;
    align-items: center;
  }

  .wm-gap-1 { gap: var(--wm-space-1); }
  .wm-gap-2 { gap: var(--wm-space-2); }
  .wm-gap-3 { gap: var(--wm-space-3); }
  .wm-gap-4 { gap: var(--wm-space-4); }
  .wm-gap-5 { gap: var(--wm-space-5); }
  .wm-gap-6 { gap: var(--wm-space-6); }
  .wm-gap-8 { gap: var(--wm-space-8); }
  .wm-gap-10 { gap: var(--wm-space-10); }

  .wm-p-2 { padding: var(--wm-space-2); }
  .wm-p-3 { padding: var(--wm-space-3); }
  .wm-p-4 { padding: var(--wm-space-4); }
  .wm-p-6 { padding: var(--wm-space-6); }
  .wm-p-8 { padding: var(--wm-space-8); }

  .wm-px-4 { padding-inline: var(--wm-space-4); }
  .wm-px-6 { padding-inline: var(--wm-space-6); }
  .wm-py-4 { padding-block: var(--wm-space-4); }

  .wm-flex-1 { flex: 1 1 auto; }
  .wm-flex-none { flex: none; }
  .wm-flex-wrap { flex-wrap: wrap; }

  .wm-items-center { align-items: center; }
  .wm-items-start { align-items: flex-start; }
  .wm-justify-between { justify-content: space-between; }
  .wm-justify-center { justify-content: center; }
  .wm-justify-end { justify-content: flex-end; }
}