/* Spacing Utilities */

:root {
  /* Standard gap variables based on --size-4 */
  --gap: var(--size-4);
  --gap-half: calc(var(--size-4) / 2);
  --gap-double: calc(var(--size-4) * 2);
}

/* Gap utility classes */
.gap {
  gap: var(--gap);
}

.gap-half {
  gap: var(--gap-half);
}

.gap-double {
  gap: var(--gap-double);
}

/* Margin utilities */
.margin-gap {
  margin: var(--gap);
}

.margin-gap-bottom {
  margin-bottom: var(--gap);
}

.margin-gap-top {
  margin-top: var(--gap);
}

.margin-gap-double {
  margin: var(--gap-double);
}

.margin-gap-double-bottom {
  margin-bottom: var(--gap-double);
}

/* Padding utilities */
.padding-gap {
  padding: var(--gap);
}

.padding-gap-bottom {
  padding-bottom: var(--gap);
}

.padding-gap-top {
  padding-top: var(--gap);
}