@reference "../../../styles/index.css";

.item {
  @apply flex
    flex-col
    gap-1;
}

.return {
  @apply bg-brand-100
    rounded-sm
    px-4
    py-3
    dark:bg-neutral-900/40;
}

/*
 * A top-level return (not nested inside a `.children` group) attaches to the
 * items above it as a full-bleed footer: it bleeds past the container padding
 * and is separated by a divider rather than floating on its own.
 */
.return:not(:first-child, .children .return) {
  @apply -mx-4
    -mb-3
    rounded-t-none
    border-t
    border-neutral-200
    dark:border-neutral-900;
}

.children {
  @apply relative
    flex
    flex-col
    rounded-sm
    border
    border-neutral-200
    dark:border-neutral-900;

  &:has(> .return:only-child) {
    @apply border-0;
  }

  &:not(:has(.return:only-child)) .return {
    @apply mx-4
      mb-3;
  }

  .item:not(.return) {
    @apply mx-4
      py-3;
  }

  .item:not(:last-child, :has(+ .return)) {
    @apply border-b
      border-neutral-200
      dark:border-neutral-900;
  }
}

.description {
  @apply text-sm
    break-all;
}
