#btn--don__mobile {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;

  padding-top: calc(var(--spacing) * 0.5);
  padding-bottom: calc(var(--spacing) * 1.5);
  position: fixed;
  bottom: 0px;
  left: 0;
  z-index: 100;
  opacity: 0;
  transition: opacity ease-in 0.2s;

  pointer-events: none;
  &.is-visible {
    pointer-events: all;
    opacity: 1;
  }

  &.is-sticky {
    position: relative;
  }

  @media #{$small-up} {
    display: none !important;
  }
}

.btn--don {
  --vertical-padding: 0.5ch;
  height: calc(var(--h-block) + var(--vertical-padding));
  border-radius: calc(var(--h-block) / 1);
  padding: var(--vertical-padding) 2ch;
  background-color: var(--color-accent);
  color: var(--color-bg);
  font-family: var(--font);
  font-size: var(--fs-medium);
  font-weight: var(--fw-bold);

  a {
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 0.5ch;
  }

  .icon {
    height: 28px;
    position: relative;
    top: 1px;
  }

  svg {
    fill: var(--color-bg);
    width: 24px;
    height: 24px;
  }
}