@utility divider-scaffold {
  & {
    align-self: stretch;
    display: flex;
    align-items: center;
    padding: 0 !important;
    border-radius: 0 !important;

    &:where(:not(:empty)) {
      gap: var(--gap, 1rlh);
    }

    &::before,
    &::after {
      content: '';
      background-color: var(--border-color, currentColor);
    }
  }
}

@utility divider-x {
  & {
    @apply divider-scaffold;
    flex-grow: 1;

    &::before,
    &::after {
      flex-grow: 1;
      height: var(--border-width, 1px);
    }
  }
}

@utility divider-y {
  & {
    @apply divider-scaffold;
    flex-grow: 0;
    flex-direction: column;

    &::before,
    &::after {
      flex-grow: 1;
      width: var(--border-width, 1px);
    }
  }
}

/* Divider aliases *
 *********************/
@utility divider-horizontal {
  @apply divider-x;
}

@utility divider-vertical {
  @apply divider-y;
}

/*********************
 * Divider between *
 *********************/
@utility divider-between-x {
  & {
    flex-direction: column;
    row-gap: 0;

    > * + *,
    > * + *:where(astro-island, astro-slot):not(:first-of-type) > * {
      border-top-width: var(--border-width, 1px);
      border-color: var(--_bc, var(--border-color));
    }
  }
}

@utility divider-between-y {
  & {
    column-gap: 0;

    > * + *,
    > * + *:where(astro-island, astro-slot) > * {
      border-left-width: var(--border-width, 1px);
      border-color: var(--_bc, var(--border-color));
    }
  }
}

/* Divider between aliases *
 *********************/
@utility divider-between-horizontal {
  @apply divider-between-x;
}

@utility divider-between-vertical {
  @apply divider-between-y;
}
