/* stylelint-disable aksel/no-internal-tokens */
/* stylelint-disable aksel/no-class-override */
.navds-show-more {
  --__ac-show-more-mask: linear-gradient(rgba(0 0 0 / 1), rgba(0 0 0 / 0) calc(100% - 0.5rem));

  position: relative;
  border-radius: var(--a-border-radius-large);
  padding: var(--a-spacing-4);
  height: fit-content; /* in case the parent is stretching */
  display: flex;
  flex-direction: column;
  min-width: 12rem;
}

.navds-show-more--default,
.navds-show-more--default .navds-show-more__button-wrapper {
  background: var(--a-surface-default);
}

.navds-show-more--subtle,
.navds-show-more--subtle .navds-show-more__button-wrapper {
  background: var(--a-surface-subtle);
}

.navds-show-more--info,
.navds-show-more--info .navds-show-more__button-wrapper {
  background: var(--a-surface-info-subtle);
}

.navds-show-more--closed .navds-show-more__content {
  -webkit-mask-image: var(--__ac-show-more-mask);
  mask-image: var(--__ac-show-more-mask);
  overflow: hidden;
}

.navds-show-more__button-section {
  text-align: center;
  left: 0;
  right: 0;
  bottom: var(--a-spacing-4);
  margin-top: var(--a-spacing-4);
  z-index: 1;
  order: 1;
}

.navds-show-more--closed .navds-show-more__button-section {
  position: absolute;
}

.navds-show-more__button-wrapper {
  display: inline-block;
  background: var(--a-bg-default);
  /* stylelint-disable-next-line aksel/design-token-no-component-reference */
  border-radius: var(--ac-button-border-radius, var(--a-border-radius-medium)); /* same as Button */
}
