#nav-aside .nav-wrapper {
  width: 194px; }

#nav-aside .inner {
  display: flex;
  flex-direction: column;
  gap: 5px;
  width: max-content;
  margin-bottom: 7px; }
  #nav-aside .inner .nav-item {
    font-size: 13px;
    font-weight: 600;
    position: relative;
    border-radius: 7px;
    padding: 14px 14px 10px 0px;
    cursor: pointer;
    opacity: .8;
    display: flex;
    flex-direction: row;
    gap: 14px;
    width: 100%;
    transition: all 100ms linear;
    justify-content: space-between;
    color: var(--main-nav-link-color);
    text-decoration: none;
    align-items: center; }
    #nav-aside .inner .nav-item.active {
      opacity: 1;
      color: var(--main-nav-link-color); }
      #nav-aside .inner .nav-item.active svg {
        fill: var(--color-cta); }
    #nav-aside .inner .nav-item.active, #nav-aside .inner .nav-item:hover {
      opacity: 1; }
      #nav-aside .inner .nav-item.active::after, #nav-aside .inner .nav-item:hover::after {
        content: '';
        position: absolute;
        background: var(--main-nav-bg-color);
        z-index: -1;
        width: calc(100% + 0px);
        height: calc(100% + 0px);
        left: -14px;
        top: 3px;
        border-radius: 7px; }
    #nav-aside .inner .nav-item svg {
      fill: var(--text-color);
      width: 27px;
      height: 27px; }
      #nav-aside .inner .nav-item svg.sub-nav {
        fill: var(--svg-ico-fill);
        width: 18px;
        height: 18px;
        position: absolute;
        z-index: 1;
        right: -7px;
        top: calc(50% - 9px); }
        #nav-aside .inner .nav-item svg.sub-nav:hover {
          fill: var(--color-white); }
    #nav-aside .inner .nav-item .nav-label {
      display: flex;
      flex-direction: row;
      gap: 14px;
      align-items: center; }

#nav-aside .inner .nav-item > div {
  display: none; }

#nav-aside .inner .nav-item .nav-label > div {
  display: none; }

@media only screen and (min-width: 960px) {
  #nav-aside .inner .nav-item > div {
    display: inline-block; }
  #nav-aside .inner .nav-item svg {
    fill: var(--svg-ico-fill); }
  #nav-aside .inner .nav-item .nav-label > div {
    display: inline-block; }
  #nav-aside .inner .nav-item.active::after, #nav-aside .inner .nav-item:hover::after {
    width: calc(100% + 21px); } }
