/* Padding and margin utilities using --at-space--* / --hs-space--* tokens.
   Sizes: 4xs, 3xs, 2xs, xs, s, m, l, xl, 2xl, 3xl, 4xl, 5xl, 6xl, 7xl. */

/* Padding — all sides */
.hs-p-4xs { padding: var(--hs-space--4xs); }
.hs-p-3xs { padding: var(--at-space--3xs); }
.hs-p-2xs { padding: var(--at-space--2xs); }
.hs-p-xs  { padding: var(--at-space--xs); }
.hs-p-s   { padding: var(--at-space--s); }
.hs-p-m   { padding: var(--at-space--m); }
.hs-p-l   { padding: var(--at-space--l); }
.hs-p-xl  { padding: var(--at-space--xl); }
.hs-p-2xl { padding: var(--at-space--2xl); }
.hs-p-3xl { padding: var(--at-space--3xl); }
.hs-p-4xl { padding: var(--at-space--4xl); }
.hs-p-5xl { padding: var(--at-space--5xl); }
.hs-p-6xl { padding: var(--at-space--6xl); }
.hs-p-7xl { padding: var(--at-space--7xl); }
.hs-p-0   { padding: 0; }

/* Padding — inline (left/right in LTR) */
.hs-px-4xs { padding-inline: var(--hs-space--4xs); }
.hs-px-3xs { padding-inline: var(--at-space--3xs); }
.hs-px-2xs { padding-inline: var(--at-space--2xs); }
.hs-px-xs  { padding-inline: var(--at-space--xs); }
.hs-px-s   { padding-inline: var(--at-space--s); }
.hs-px-m   { padding-inline: var(--at-space--m); }
.hs-px-l   { padding-inline: var(--at-space--l); }
.hs-px-xl  { padding-inline: var(--at-space--xl); }
.hs-px-2xl { padding-inline: var(--at-space--2xl); }
.hs-px-3xl { padding-inline: var(--at-space--3xl); }
.hs-px-4xl { padding-inline: var(--at-space--4xl); }
.hs-px-5xl { padding-inline: var(--at-space--5xl); }
.hs-px-6xl { padding-inline: var(--at-space--6xl); }
.hs-px-7xl { padding-inline: var(--at-space--7xl); }
.hs-px-0   { padding-inline: 0; }

/* Padding — block (top/bottom) */
.hs-py-4xs { padding-block: var(--hs-space--4xs); }
.hs-py-3xs { padding-block: var(--at-space--3xs); }
.hs-py-2xs { padding-block: var(--at-space--2xs); }
.hs-py-xs  { padding-block: var(--at-space--xs); }
.hs-py-s   { padding-block: var(--at-space--s); }
.hs-py-m   { padding-block: var(--at-space--m); }
.hs-py-l   { padding-block: var(--at-space--l); }
.hs-py-xl  { padding-block: var(--at-space--xl); }
.hs-py-2xl { padding-block: var(--at-space--2xl); }
.hs-py-3xl { padding-block: var(--at-space--3xl); }
.hs-py-4xl { padding-block: var(--at-space--4xl); }
.hs-py-5xl { padding-block: var(--at-space--5xl); }
.hs-py-6xl { padding-block: var(--at-space--6xl); }
.hs-py-7xl { padding-block: var(--at-space--7xl); }
.hs-py-0   { padding-block: 0; }

/* Padding — single side: pt=block-start, pb=block-end, ps=inline-start, pe=inline-end */
.hs-pt-4xs { padding-block-start: var(--hs-space--4xs); }
.hs-pt-3xs { padding-block-start: var(--at-space--3xs); }
.hs-pt-2xs { padding-block-start: var(--at-space--2xs); }
.hs-pt-xs  { padding-block-start: var(--at-space--xs); }
.hs-pt-s   { padding-block-start: var(--at-space--s); }
.hs-pt-m   { padding-block-start: var(--at-space--m); }
.hs-pt-l   { padding-block-start: var(--at-space--l); }
.hs-pt-xl  { padding-block-start: var(--at-space--xl); }
.hs-pt-2xl { padding-block-start: var(--at-space--2xl); }
.hs-pt-3xl { padding-block-start: var(--at-space--3xl); }
.hs-pt-4xl { padding-block-start: var(--at-space--4xl); }
.hs-pt-5xl { padding-block-start: var(--at-space--5xl); }
.hs-pt-6xl { padding-block-start: var(--at-space--6xl); }
.hs-pt-7xl { padding-block-start: var(--at-space--7xl); }
.hs-pt-0   { padding-block-start: 0; }

.hs-pb-4xs { padding-block-end: var(--hs-space--4xs); }
.hs-pb-3xs { padding-block-end: var(--at-space--3xs); }
.hs-pb-2xs { padding-block-end: var(--at-space--2xs); }
.hs-pb-xs  { padding-block-end: var(--at-space--xs); }
.hs-pb-s   { padding-block-end: var(--at-space--s); }
.hs-pb-m   { padding-block-end: var(--at-space--m); }
.hs-pb-l   { padding-block-end: var(--at-space--l); }
.hs-pb-xl  { padding-block-end: var(--at-space--xl); }
.hs-pb-2xl { padding-block-end: var(--at-space--2xl); }
.hs-pb-3xl { padding-block-end: var(--at-space--3xl); }
.hs-pb-4xl { padding-block-end: var(--at-space--4xl); }
.hs-pb-5xl { padding-block-end: var(--at-space--5xl); }
.hs-pb-6xl { padding-block-end: var(--at-space--6xl); }
.hs-pb-7xl { padding-block-end: var(--at-space--7xl); }
.hs-pb-0   { padding-block-end: 0; }

.hs-ps-4xs { padding-inline-start: var(--hs-space--4xs); }
.hs-ps-3xs { padding-inline-start: var(--at-space--3xs); }
.hs-ps-2xs { padding-inline-start: var(--at-space--2xs); }
.hs-ps-xs  { padding-inline-start: var(--at-space--xs); }
.hs-ps-s   { padding-inline-start: var(--at-space--s); }
.hs-ps-m   { padding-inline-start: var(--at-space--m); }
.hs-ps-l   { padding-inline-start: var(--at-space--l); }
.hs-ps-xl  { padding-inline-start: var(--at-space--xl); }
.hs-ps-2xl { padding-inline-start: var(--at-space--2xl); }
.hs-ps-3xl { padding-inline-start: var(--at-space--3xl); }
.hs-ps-4xl { padding-inline-start: var(--at-space--4xl); }
.hs-ps-5xl { padding-inline-start: var(--at-space--5xl); }
.hs-ps-6xl { padding-inline-start: var(--at-space--6xl); }
.hs-ps-7xl { padding-inline-start: var(--at-space--7xl); }
.hs-ps-0   { padding-inline-start: 0; }

.hs-pe-4xs { padding-inline-end: var(--hs-space--4xs); }
.hs-pe-3xs { padding-inline-end: var(--at-space--3xs); }
.hs-pe-2xs { padding-inline-end: var(--at-space--2xs); }
.hs-pe-xs  { padding-inline-end: var(--at-space--xs); }
.hs-pe-s   { padding-inline-end: var(--at-space--s); }
.hs-pe-m   { padding-inline-end: var(--at-space--m); }
.hs-pe-l   { padding-inline-end: var(--at-space--l); }
.hs-pe-xl  { padding-inline-end: var(--at-space--xl); }
.hs-pe-2xl { padding-inline-end: var(--at-space--2xl); }
.hs-pe-3xl { padding-inline-end: var(--at-space--3xl); }
.hs-pe-4xl { padding-inline-end: var(--at-space--4xl); }
.hs-pe-5xl { padding-inline-end: var(--at-space--5xl); }
.hs-pe-6xl { padding-inline-end: var(--at-space--6xl); }
.hs-pe-7xl { padding-inline-end: var(--at-space--7xl); }
.hs-pe-0   { padding-inline-end: 0; }

/* Margin — all sides */
.hs-m-4xs { margin: var(--hs-space--4xs); }
.hs-m-3xs { margin: var(--at-space--3xs); }
.hs-m-2xs { margin: var(--at-space--2xs); }
.hs-m-xs  { margin: var(--at-space--xs); }
.hs-m-s   { margin: var(--at-space--s); }
.hs-m-m   { margin: var(--at-space--m); }
.hs-m-l   { margin: var(--at-space--l); }
.hs-m-xl  { margin: var(--at-space--xl); }
.hs-m-2xl { margin: var(--at-space--2xl); }
.hs-m-3xl { margin: var(--at-space--3xl); }
.hs-m-4xl { margin: var(--at-space--4xl); }
.hs-m-5xl { margin: var(--at-space--5xl); }
.hs-m-6xl { margin: var(--at-space--6xl); }
.hs-m-7xl { margin: var(--at-space--7xl); }
.hs-m-0    { margin: 0; }
.hs-m-auto { margin: auto; }

/* Margin — inline */
.hs-mx-4xs { margin-inline: var(--hs-space--4xs); }
.hs-mx-3xs { margin-inline: var(--at-space--3xs); }
.hs-mx-2xs { margin-inline: var(--at-space--2xs); }
.hs-mx-xs  { margin-inline: var(--at-space--xs); }
.hs-mx-s   { margin-inline: var(--at-space--s); }
.hs-mx-m   { margin-inline: var(--at-space--m); }
.hs-mx-l   { margin-inline: var(--at-space--l); }
.hs-mx-xl  { margin-inline: var(--at-space--xl); }
.hs-mx-2xl { margin-inline: var(--at-space--2xl); }
.hs-mx-3xl { margin-inline: var(--at-space--3xl); }
.hs-mx-4xl { margin-inline: var(--at-space--4xl); }
.hs-mx-5xl { margin-inline: var(--at-space--5xl); }
.hs-mx-6xl { margin-inline: var(--at-space--6xl); }
.hs-mx-7xl { margin-inline: var(--at-space--7xl); }
.hs-mx-0    { margin-inline: 0; }
.hs-mx-auto { margin-inline: auto; }

/* Margin — block */
.hs-my-4xs { margin-block: var(--hs-space--4xs); }
.hs-my-3xs { margin-block: var(--at-space--3xs); }
.hs-my-2xs { margin-block: var(--at-space--2xs); }
.hs-my-xs  { margin-block: var(--at-space--xs); }
.hs-my-s   { margin-block: var(--at-space--s); }
.hs-my-m   { margin-block: var(--at-space--m); }
.hs-my-l   { margin-block: var(--at-space--l); }
.hs-my-xl  { margin-block: var(--at-space--xl); }
.hs-my-2xl { margin-block: var(--at-space--2xl); }
.hs-my-3xl { margin-block: var(--at-space--3xl); }
.hs-my-4xl { margin-block: var(--at-space--4xl); }
.hs-my-5xl { margin-block: var(--at-space--5xl); }
.hs-my-6xl { margin-block: var(--at-space--6xl); }
.hs-my-7xl { margin-block: var(--at-space--7xl); }
.hs-my-0    { margin-block: 0; }
.hs-my-auto { margin-block: auto; }

/* Margin — single side */
.hs-mt-4xs { margin-block-start: var(--hs-space--4xs); }
.hs-mt-3xs { margin-block-start: var(--at-space--3xs); }
.hs-mt-2xs { margin-block-start: var(--at-space--2xs); }
.hs-mt-xs  { margin-block-start: var(--at-space--xs); }
.hs-mt-s   { margin-block-start: var(--at-space--s); }
.hs-mt-m   { margin-block-start: var(--at-space--m); }
.hs-mt-l   { margin-block-start: var(--at-space--l); }
.hs-mt-xl  { margin-block-start: var(--at-space--xl); }
.hs-mt-2xl { margin-block-start: var(--at-space--2xl); }
.hs-mt-3xl { margin-block-start: var(--at-space--3xl); }
.hs-mt-4xl { margin-block-start: var(--at-space--4xl); }
.hs-mt-5xl { margin-block-start: var(--at-space--5xl); }
.hs-mt-6xl { margin-block-start: var(--at-space--6xl); }
.hs-mt-7xl { margin-block-start: var(--at-space--7xl); }
.hs-mt-0    { margin-block-start: 0; }
.hs-mt-auto { margin-block-start: auto; }

.hs-mb-4xs { margin-block-end: var(--hs-space--4xs); }
.hs-mb-3xs { margin-block-end: var(--at-space--3xs); }
.hs-mb-2xs { margin-block-end: var(--at-space--2xs); }
.hs-mb-xs  { margin-block-end: var(--at-space--xs); }
.hs-mb-s   { margin-block-end: var(--at-space--s); }
.hs-mb-m   { margin-block-end: var(--at-space--m); }
.hs-mb-l   { margin-block-end: var(--at-space--l); }
.hs-mb-xl  { margin-block-end: var(--at-space--xl); }
.hs-mb-2xl { margin-block-end: var(--at-space--2xl); }
.hs-mb-3xl { margin-block-end: var(--at-space--3xl); }
.hs-mb-4xl { margin-block-end: var(--at-space--4xl); }
.hs-mb-5xl { margin-block-end: var(--at-space--5xl); }
.hs-mb-6xl { margin-block-end: var(--at-space--6xl); }
.hs-mb-7xl { margin-block-end: var(--at-space--7xl); }
.hs-mb-0    { margin-block-end: 0; }
.hs-mb-auto { margin-block-end: auto; }

.hs-ms-4xs { margin-inline-start: var(--hs-space--4xs); }
.hs-ms-3xs { margin-inline-start: var(--at-space--3xs); }
.hs-ms-2xs { margin-inline-start: var(--at-space--2xs); }
.hs-ms-xs  { margin-inline-start: var(--at-space--xs); }
.hs-ms-s   { margin-inline-start: var(--at-space--s); }
.hs-ms-m   { margin-inline-start: var(--at-space--m); }
.hs-ms-l   { margin-inline-start: var(--at-space--l); }
.hs-ms-xl  { margin-inline-start: var(--at-space--xl); }
.hs-ms-2xl { margin-inline-start: var(--at-space--2xl); }
.hs-ms-3xl { margin-inline-start: var(--at-space--3xl); }
.hs-ms-4xl { margin-inline-start: var(--at-space--4xl); }
.hs-ms-5xl { margin-inline-start: var(--at-space--5xl); }
.hs-ms-6xl { margin-inline-start: var(--at-space--6xl); }
.hs-ms-7xl { margin-inline-start: var(--at-space--7xl); }
.hs-ms-0    { margin-inline-start: 0; }
.hs-ms-auto { margin-inline-start: auto; }

.hs-me-4xs { margin-inline-end: var(--hs-space--4xs); }
.hs-me-3xs { margin-inline-end: var(--at-space--3xs); }
.hs-me-2xs { margin-inline-end: var(--at-space--2xs); }
.hs-me-xs  { margin-inline-end: var(--at-space--xs); }
.hs-me-s   { margin-inline-end: var(--at-space--s); }
.hs-me-m   { margin-inline-end: var(--at-space--m); }
.hs-me-l   { margin-inline-end: var(--at-space--l); }
.hs-me-xl  { margin-inline-end: var(--at-space--xl); }
.hs-me-2xl { margin-inline-end: var(--at-space--2xl); }
.hs-me-3xl { margin-inline-end: var(--at-space--3xl); }
.hs-me-4xl { margin-inline-end: var(--at-space--4xl); }
.hs-me-5xl { margin-inline-end: var(--at-space--5xl); }
.hs-me-6xl { margin-inline-end: var(--at-space--6xl); }
.hs-me-7xl { margin-inline-end: var(--at-space--7xl); }
.hs-me-0    { margin-inline-end: 0; }
.hs-me-auto { margin-inline-end: auto; }

/* Gap (for flex/grid containers) */
.hs-gap-4xs { gap: var(--hs-space--4xs); }
.hs-gap-3xs { gap: var(--at-space--3xs); }
.hs-gap-2xs { gap: var(--at-space--2xs); }
.hs-gap-xs  { gap: var(--at-space--xs); }
.hs-gap-s   { gap: var(--at-space--s); }
.hs-gap-m   { gap: var(--at-space--m); }
.hs-gap-l   { gap: var(--at-space--l); }
.hs-gap-xl  { gap: var(--at-space--xl); }
.hs-gap-2xl { gap: var(--at-space--2xl); }
.hs-gap-3xl { gap: var(--at-space--3xl); }
.hs-gap-4xl { gap: var(--at-space--4xl); }
.hs-gap-5xl { gap: var(--at-space--5xl); }
.hs-gap-6xl { gap: var(--at-space--6xl); }
.hs-gap-7xl { gap: var(--at-space--7xl); }
.hs-gap-0   { gap: 0; }