$icon_color: #4665fdde;
$text_color: #3d3c42;

.sidebar {
  height: 100vh;
  // margin-left: 10px;

  .links {
    margin: 10px 10px 10px;
    // margin: 10px;
    ul {
      .spann {
        text-transform: uppercase;
        color: gray;
        margin: 10px 0px 5px;
        font-size: 14px;
      }

      li {
        display: flex;
        align-items: center;
        color: $text_color;
        padding: 7px 10px;
        margin-bottom: 5px;
        font-weight: 500;
        transition: all 0.2s ease;
        border-radius: 4px;
        cursor: pointer;
        font-size: 18px;
        transition: all 0.2s ease;

        &:hover {
          background-color: $text_color;
          color: white;
        }
        &:hover .icon {
          color: white;
        }
        .icon {
          color: $text_color;
          margin-right: 10px;
          font-size: 18px;
        }
      }
    }
  }
}
