:root {
  --cookie-popup-z-index: calc(var(--z-index-modal) + 1);
  --cookie-popup-right: var(--spacing-20);
  --cookie-popup-bottom: var(--spacing-20);
  --cookie-popup-width: var(--spacing-280);
  --cookie-popup-padding: var(--spacing-20);
  --cookie-popup-radius: var(--border-radius-lg);
  --cookie-popup-bg: rgba(19, 19, 19, 0.96);

  --cookie-popup-text-color: var(--color-white);
  --cookie-popup-text-size: var(--font-size-14);
  --cookie-popup-line-height: var(--spacing-24);
  --cookie-popup-letter-spacing: 0;
  --cookie-popup-text-weight: 400;

  --cookie-popup-link-decoration-thickness: from-font;
  --cookie-popup-link-underline-offset: 0;

  --cookie-popup-button-margin-top: var(--spacing-20);
}

.cookie-popup {
  position: fixed;
  right: var(--cookie-popup-right);
  bottom: var(--cookie-popup-bottom);
  z-index: var(--cookie-popup-z-index);
  width: var(--cookie-popup-width);
  padding: var(--cookie-popup-padding);
  border-radius: 0;
  background: var(--cookie-popup-bg);
  color: var(--cookie-popup-text-color);
}

.cookie-popup__text {
  margin: 0;
  font-family: var(--font-family);
  font-size: var(--cookie-popup-text-size);
  line-height: var(--cookie-popup-line-height);
  letter-spacing: var(--cookie-popup-letter-spacing);
  font-weight: var(--cookie-popup-text-weight);
}

.cookie-popup__link {
  color: inherit;
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-thickness: var(--cookie-popup-link-decoration-thickness);
  text-underline-offset: var(--cookie-popup-link-underline-offset);
}

.cookie-popup__button {
  width: 100%;
  margin-top: var(--cookie-popup-button-margin-top);
}

@media (max-width: 1023px) {
  .cookie-popup {
    left: var(--spacing-10);
    right: var(--spacing-10);
    bottom: var(--spacing-10);
    width: auto;
  }
}