$action-text-spacing: rem(24px);
$primary-action-button-height: rem(36px);
$primary-action-button-width: rem(100px);

.Biblio-SkeletonPage__Page {
  @include page-layout;
}

.Biblio-SkeletonPage--fullWidth {
  max-width: none;
}

.Biblio-SkeletonPage--singleColumn {
  max-width: layout-width(primary, max);
}

.Biblio-SkeletonPage__Content {
  @include page-content-layout;
}

.Biblio-SkeletonPage__Header {
  @include page-header-layout;
  @include skeleton-page-header-layout;
}

.Biblio-SkeletonPage__Header--hasSecondaryActions {
  @include skeleton-page-header-has-secondary-actions;
}

.Biblio-SkeletonPage__BreadcrumbAction {
  padding-top: spacing(base);
  padding-bottom: spacing(base);
  margin-top: (-1 * spacing(extra-tight));
  margin-bottom: (-1 * spacing(extra-tight));
}

.Biblio-SkeletonPage__TitleAndPrimaryAction {
  display: flex;

  @include page-content-when-partially-condensed {
    display: block;
  }
}

.Biblio-SkeletonPage__Title {
  flex: 1 1 0%;
}

.Biblio-SkeletonPage__PrimaryAction {
  align-self: stretch;

  > * {
    height: $primary-action-button-height;
    min-width: $primary-action-button-width;
  }

  @include page-content-when-layout-stacked {
    margin-top: spacing(base);
    margin-bottom: (-1 * spacing(tight));
  }

  @include page-content-when-not-fully-condensed {
    margin-top: $actions-vertical-spacing;
    margin-bottom: (-1 * spacing(tight));
  }

  @include page-content-when-not-partially-condensed {
    margin-top: 0;
  }

  @include page-content-when-layout-not-stacked {
    margin-top: 0;
  }
}

.Biblio-SkeletonPage__Actions {
  @include skeleton-page-secondary-actions-layout;
}

.Biblio-SkeletonPage__Action {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: control-slim-height();
  padding-right: $action-text-spacing;
  margin-top: (-1 * spacing(extra-tight));
  margin-bottom: (-1 * spacing(extra-tight));
  padding-top: spacing();

  &:first-child {
    padding-right: 0;
  }

  @include page-content-when-partially-condensed {
    &:not(:last-child) {
      display: none;
    }
  }
}