/*********************
 * nudge utilities *
 *********************/

@utility nudge {
  margin-block: var(--nudge-y, var(--nudge, 0));
  margin-inline: var(--nudge-x, var(--nudge, 0));
}

@utility nudge-top {
  margin-block-start: calc(var(--nudge-y, var(--nudge)));
}

@utility nudge-topleft {
  @apply nudge-top;
  margin-block-start: calc(var(--nudge-y, var(--nudge)));
  margin-inline-start: calc(var(--nudge-x, var(--nudge)));
}

@utility nudge-topright {
  @apply nudge-top;
  margin-inline-end: calc(var(--nudge-x, var(--nudge)));
}

@utility nudge-topfull {
  margin-block-start: calc(var(--nudge-y, var(--nudge)));
  margin-inline: calc(var(--nudge-x, var(--nudge)));
}

@utility nudge-bottom {
  margin-block-end: calc(var(--nudge-y, var(--nudge)));
}

@utility nudge-bottomleft {
  @apply nudge-bottom;
  margin-inline-start: calc(var(--nudge-x, var(--nudge)));
}

@utility nudge-bottomright {
  @apply nudge-bottom;
  margin-inline-end: calc(var(--nudge-x, var(--nudge)));
}

@utility nudge-bottomfull {
  @apply nudge-bottom;
  margin-inline: calc(var(--nudge-x, var(--nudge)));
}

@utility nudge-left {
  position: relative;
  margin-inline-start: var(--nudge-x, var(--nudge, 0));
}

@utility nudge-leftfull {
  margin-block: var(--nudge-y, var(--nudge, 0));
  margin-inline-start: var(--nudge-x, var(--nudge, 0));
}

@utility nudge-right {
  margin-inline-end: var(--nudge-x, var(--nudge, 0));
}

@utility nudge-rightfull {
  margin-block: var(--nudge-y, var(--nudge, 0));
  margin-inline-end: var(--nudge-x, var(--nudge, 0));
}

@utility nudge-overlay {
  margin-block: var(--nudge-y, var(--nudge, 0));
  margin-inline: var(--nudge-x, var(--nudge, 0));
}

/*********************
 * Functional Utilities *
 *********************/
@utility nudge-* {
  --nudge: --value([*]);
  --nudge: --spacing(--value());
}

@utility nudge-x-* {
  --nudge-x: --value([*]);
  --nudge-x: --spacing(--value());
}

@utility nudge-y-* {
  --nudge-y: --value([*]);
  --nudge-y: --spacing(--value());
}

@utility inner-radius {
  border-radius: calc(var(--radius) - var(--nudge));
}
