@import "./common";

#Home {
  display: flex;
  flex-direction: row;
  min-height: 100vh;
  flex: auto;

  #HomeSidebar {
    min-width: 15rem;
    max-width: 15rem;
    min-height: 100vh;
    border-right: solid gray 1px;
    border-bottom-right-radius: 7px;
    padding: 2rem 1rem;
    position: fixed;
    top: 0;
    box-shadow: 1px 0px 0px 0px rgba(0, 0, 0, 0.2), 2px 0px 0px 0px rgba(0, 0, 0, 0.1), 3px 0px 0px 0px rgba(0, 0, 0, 0.05);

    #SidebarUserInfo {
      display: flex;
      flex-direction: column;

      button {
        background: none;
        border: none;
        padding: 0;
        text-decoration: none;
        cursor: pointer;
        color: inherit;
        font-size: inherit;
      }
    }

    * {
      margin: 0.5rem 0;
    }

    #SidebarNav {
      a {
        color: black;
        text-decoration: none;

        min-width: 100%;
        height: 2rem;

        display: flex;
        flex-direction: column;
        justify-content: center;
        text-align: left;
        padding-left: 1rem;
        font-size: 1.15rem;

        @include border-shadow;

        &.active {
          background-color: #EFEFEF;
        }

        &.pending {
          background-color: #EEEEEE;
        }

      }

    }
  }

  #HomeContent {
    width: 100%;
    margin: 0 0 0 15rem;
  }
}