.ProfileDropdown-user {
  @apply btu-heading-5 text-gray-900;
}

.ProfileDropdown-userEmail {
  @apply text-sm font-normal text-gray-500;
}

.ProfileDropdown-items {
  @apply px-0 py-1;

  > li {
    @apply last:mt-1 last:border-t last:border-t-gray-200 last:pt-1;

    > a {
      @apply Dropdown-item;
    }
  }
}

.ToolUserWorksInProgress,
.ToolUserSharedPreviews {
  @apply h-full grid-rows-[1fr_auto_auto];

  .ToolUserWorksInProgress-body,
  .ToolUserSharedPreviews-body {
    @apply order-1 !col-[fullbleed-start/fullbleed-end] grid grid-cols-subgrid overflow-y-scroll;
  }

  .LinkTable {
    @apply col-[content-start/content-end] overflow-y-scroll py-4;

    li {
      @apply relative grid max-h-[unset] items-center justify-between rounded-xl px-4 py-[9px] [grid-template-areas:'link_button'_'byline_button'] hover:bg-gray-100;

      &:has(> a:focus-visible) {
        @apply ring-inset;
      }

      a {
        @apply m-0 p-0 text-sm text-primary-600 underline [grid-area:link];
      }

      span {
        @apply text-xs font-medium text-gray-500 [grid-area:byline];
      }

      > form {
        @apply contents;
      }

      button[name='action-delete'],
      button[name='deleteAction'] {
        @apply btu-button btu-button-text-hidden btu-button-fill-none btu-button-error invisible [grid-area:button] before:btu-icon before:btu-icon-minus;
      }
    }

    li:hover,
    li:focus-within {
      button[name='action-delete'],
      button[name='deleteAction'] {
        @apply visible;
      }
    }
  }

  > ul.pagination {
    @apply order-2 col-[fullbleed-start/fullbleed-end] box-content max-h-[38px] rounded-none border-x-0 border-b-0 border-t border-gray-200 px-6 py-[22px];

    > li:not([class]) {
      @apply -order-1 me-auto border-s-0;
    }

    > li:where(.next, .previous, .first, .last) {
      @apply rounded-lg border border-gray-300;

      &:has(~ li.next, ~ li.previous, ~ li.first, ~ li.last) {
        @apply rounded-e-none border-e-0;
      }

      ~ li:is(.next, .previous, .first, .last) {
        @apply rounded-s-none;
      }
    }
  }
}

.ToolUserWorksInProgress-actions,
.ToolUserSharedPreviews-actions {
  @apply order-3 col-[fullbleed-start/fullbleed-end] border-t px-6 py-[22px];

  > button {
    @apply btu-button btu-button-fill-none btu-button-error btu-button-md btu-button-container-none before:btu-icon before:btu-icon-trash;
  }
}
