.notifications {
  flex: 1;
  overflow: auto;
  border-top: 1px solid #dfe9f1;
  border-left: 1px solid #dfe9f1;
  border-bottom: 1px solid #dfe9f1;
  box-shadow: -1px 2px 2px -1px rgba(0, 0, 0, 0.1);
  .heading-container {
    border-bottom: 1px solid #dfe9f1;
    h5 {
      padding-top: 10px;
      margin-bottom: 5px;
      font-family: Inter;
      font-style: normal;
      font-weight: 600;
      font-size: 18px;
      line-height: 22px;
    }
  }
  .all-notifications {
    width: 90%;
    margin: 15px auto;
    height: 200px;
    overflow-y: auto;

    .notification-container {
      display: flex;
      border-bottom: 1px solid #ccc;
      padding: 10px 0;
      width: 97%;
      margin-right: 2px;
    }
    .notification-description {
      padding: 0px 20px;
      p {
        color: rgba(29, 33, 41, 0.5);
        font-family: Inter;
        font-style: normal;
        font-weight: normal;
        font-size: 12px;
        line-height: 15px;
        margin-bottom: 2px;
      }
      h6 {
        font-family: Inter;
        font-style: normal;
        font-weight: 600;
        font-size: 14px;
        line-height: 21px;
        display: inline;
      }
      .tag {
        box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.1);
        border-radius: 31px;
        padding: 2px;
        border: 1px solid #007bff;
        background-color: #1a73e8;
        color: #fff;
        font-family: Inter;
        font-style: normal;
        font-weight: 600;
        font-size: 10px;
        line-height: 12px;
        margin-left: 15px;
        position: relative;
        bottom: 5px;
      }
    }
  }

  .notification-img-container > img {
    width: 30px;
    background-blend-mode: normal;
    margin: auto;
    height: 90%;
  }
}

::-webkit-scrollbar,
tbody::-webkit-scrollbar {
  width: 4.3px;
}

::-webkit-scrollbar-track {
  background: #ccc;
  border-radius: 40px;
}

::-webkit-scrollbar-thumb,
tbody::-webkit-scrollbar-thumb {
  background: #90949c;
  border-radius: 40px;
}
