.sc-widget {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 8px;
    position: fixed;
    z-index: 996;
    left: 10px;
    bottom: 10px;
   /* transform: translate(-50%, -50%); */
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    background: var(--bg2);
    padding: 12px 12px;
    gap: 10px;
    width: fit-content;
    box-shadow:0 0 12px #e01b1b6c;
    @media (max-width: 700px) {
      max-width: 320px;
  }
   @media (max-width: 440px) {
      max-width: 300px;
      bottom: 120px;
  }
}

.sc-widget__title {
  color: var(--red);
  font-weight: 700;
  font-size: 14px;
  text-decoration:underline;
    @media (hover: hover) {
      &:hover {
        color: var(--red2);
      }
}
  @media (hover: none) {
    &:active {
      color: var(--red2);
    }
  }
}

.sc-widget__text {
  font-size: 12px;
}

.sc-widget__buttons {
  display: flex;
  gap: 10px;
}

.sc-widget__button {
  border: none;
  padding: 5px 10px;
  border-radius: 2px;
  cursor: pointer;
}

.sc-widget__button--agree {
  background-color: #0c743b;
  font-weight: 600;
  @media (hover:hover) {
    &:hover {
      background-color: #0c743bb2;
      color: #fff;
    }
  }
  @media (hover:none) {
    &:active {
      background-color: #0c743bb2;
      color: #fff;
    }
  }
  
}

.sc-widget__button--decline {
  background-color: rgb(139, 141, 146);
  color: #fff;
  font-weight: 600;
    @media (hover: hover) {
      &:hover {
        background-color: rgb(190, 106, 106);
        color: #000;
      } 
  }
  @media (hover:none) {
    &:active {
        background-color: rgb(190, 106, 106);
        color: #000;
    }
  }
}