.Cookies {
  position: fixed;
  z-index: 10;
  width: rem(360px);
  bottom: rem(10px);
  left: 50%;
  transform: translateX(-50%);
  will-change: transform;

  background-color: #d6d6d6;

  transition: opacity 0.25s ease-in-out;
  border: 1px solid $color-lightgray;
  border-radius: 28px;
  box-shadow: 2px 2px 2px 2px #CCCCCC;

  @include iftablet {
    width: rem(700px);
    bottom: rem(20px);
  }
  @include iflaptop {
    width: rem(1000px);
  }
  @include ifdesktop {
    width: rem(1200px);
  }
}

.Container {
  display: flex;
  flex-direction: column;
  gap: rem(20px);
  padding: rem(20px);

  @include iftablet {
    justify-content: space-between;
    flex-direction: row;
    align-items: center;
    gap: rem(25px);
    padding: rem(20px) rem(40px);
  }
}

.Text {
  font-family: $font-open-sans;
  font-weight: $font-regular;
  font-size: rem(16px);
  line-height: 130%;
  opacity: 1;

  @include iftablet {
    max-width: rem(350px);
  }

  @include iflaptop {
    max-width: unset;
  }

  @include ifdesktop {
    font-size: rem(18px);
  }

  a {
    color: $color-orange;

    &:hover {
      color: $color-orange-hover;
    }
  }
}

.ButtonBox {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: rem(32px);

  @include iftablet {
    flex-direction: column-reverse;
    gap: rem(20px);
    max-width: max-content;
  }

  @include iflaptop {
    flex-direction: row;
    justify-content: flex-end;
    max-width: unset;
  }

  @include ifdesktop {
  }
}

.Hide {
  opacity: 0;
  user-select: none;
  pointer-events: none;
}