@import "./assets/scss/animation.scss";

html, body {
  background-color: rgb(245, 245, 245);
  overflow: hidden;
}

.blur {
  filter: blur(10px);
  -webkit-filter: blur(10px);
}

.disable-user-select {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.blue-gradient {
  background: linear-gradient(0deg, rgb(20, 56, 68), rgb(252, 252, 252));
}

.rounded {
  border-radius: 1.5rem !important;
}

.rounded-sm {
  border-radius: 0.75rem !important;
}

.card-effect {
  &:active,
  img {
    background-color: #c9c9c9b3 !important;
    transition: background-color 0.5s;
  }
  &:focus,
  img {
    background-color: #c9c9c9b3 !important;
    transition: background-color 0.5s;
  }
}

.overflow-scroll {
  overflow-y: scroll !important;
  overflow-x: hidden !important;
  &::-webkit-scrollbar {
    width: 0.5em;
  }
  &::-webkit-scrollbar-track {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.4);
  }
  &::-webkit-scrollbar-thumb {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.7);
    outline: 1px solid slategrey;
    border-radius: 10px;
    height: 12px;
    &:active{
      -webkit-box-shadow: inset 0 0 8px rgba(255, 0, 0, 0.9);
    }
  }
  &::-webkit-scrollbar-corner {
    border-radius: 10px;
  }
}