@use '@carbon/colors';
@use '@carbon/layout';
@use '@carbon/type';

.skeletonContainer {
  margin: layout.$spacing-05;
}

.dataTableSkeleton {
  background-color: transparent;
  padding: 0;
}

.tile {
  border: 1px solid colors.$gray-20;
  padding: layout.$spacing-06 0;
  margin: 0 layout.$spacing-05;
  text-align: center;
}

.link {
  cursor: pointer;
  text-decoration: none;
}

.emptyStateContainer {
  background-color: colors.$white-0;
}

.illo {
  margin-top: layout.$spacing-05;
}

.content {
  @include type.type-style('heading-compact-01');
  color: colors.$gray-70;
  margin-top: layout.$spacing-05;
  margin-bottom: layout.$spacing-03;
}

.filterEmptyStateTile {
  margin: auto;
}

.filterEmptyState {
  align-items: center;
  background-color: colors.$white-0;
  display: flex;
  justify-content: center;
  padding: layout.$spacing-09 !important;
  text-align: center;
}

.filterEmptyStateContent {
  @include type.type-style('heading-compact-02');
  color: colors.$gray-70;
  margin-bottom: layout.$spacing-03;
}

.filterEmptyStateHelper {
  @include type.type-style('body-compact-01');
  color: colors.$gray-70;
}