@import "../../../assets/scss/variables";
$sidebarWidth: 91px;

.sidebar {
  display: flex;
flex-direction: column;
  &--logo {
    margin-bottom: 8.2rem;
    text-align: center;
  }

  &--menulist {
    margin-bottom: 0;
    padding-left: 0;

    &--item {
      text-align: center;
      margin-bottom: 3.5rem;

      a {
        display: block;
        border-bottom: 1px solid $main-color;
        position: relative;
        color: #fff;
        text-decoration: none;

        &.active {
          border-bottom: 1px solid #fff
        }

        &:not(.active):before {
          content: "";
          position: absolute;
          display: block;
          width: 100%;
          height: 1px;
          bottom: 0;
          left: 0;
          background-color: #fff;
          transform: scaleX(0);
          transition: transform 0.3s ease;
        }

        &:not(.active):hover::before {
          transform: scaleX(1);
        }

        img {
          position: relative;
        }

      }
      
      span {
        color: #fff;
        display: block;
        font-size: 1.1rem;
        font-weight: $semi-bold;
        text-transform: uppercase;
        padding-top: 0.8rem;
      }

      .text-with-notification {        
        
        &--bell{
          position: absolute;
          color: white;
          background: $error-text;
          border-radius: .4rem;
          font-size: 0.8rem;
          text-align: center;
          padding: 0.1rem 0.4rem;
          top: 0;
          right: 2rem;
          line-height: 1.3rem;
        };
      }
    }
  }
  &--demokritos-logo {
   position: absolute;
    bottom: 0.8rem;
    text-align: center;
  }
}