/*********************
 * Inner Margin *
 *********************/
@utility im-* {
  & > * {
    margin: --spacing(--value(integer));
    margin: calc(--value([length]));
  }
}

@utility im-x-* {
  margin-inline: --spacing(--value(integer));
  margin-inline: calc(--value([length]));
}

@utility im-y-* {
  margin-block: --spacing(--value(integer));
  margin-block: calc(--value([length]));
}

/*********************
 * Inner Padding *
 *********************/
@utility ip-* {
  & > * {
    padding: --spacing(--value(integer));
    padding: calc(--value([length]));
  }
}

@utility ip-x-* {
  padding-inline: --spacing(--value(integer));
  padding-inline: calc(--value([length]));
}

@utility ip-y-* {
  padding-block: --spacing(--value(integer));
  padding-block: calc(--value([length]));
}