.md-sidebar--primary {
  .md-nav--primary {
    &::before {
      position: absolute;
      z-index: -1;
      top: -30px;
      right: 0;
      display: block;
      width: 200%;
      height: calc(100vh - 21px);
      background: var(--primary-colors-white);
      box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.15);
      content: '';
    }

    .md-logo {
      margin: 0;
      color: var(--primary-colors-white);
    }

    .md-nav__title {
      @media screen and (width <= 1220px) {
        display: flex;
        align-items: end;
        padding: 16px;
        border-radius: 0;
        color: var(--primary-colors-white);
        font: var(--roboto-17-500);
        background: var(--primary-colors-almost-black);
      }

      @media screen and (width >= 1220px) {
        display: none;
      }
    }

    .md-nav__list {
      @media screen and (width <= 1220px) {
        margin-top: 24px;
        box-shadow: none;
      }

      .md-nav__item {
        margin-bottom: 8px;
        padding: 8px 16px;

        @media screen and (width <= 1220px) {
          border-top: none;
        }

        &:last-child {
          margin-bottom: 0;
        }

        .md-nav__link {
          align-items: center;
          margin-top: 0;
          padding: 0;
          color: var(--primary-colors-almost-black);
          font: var(--roboto-15-500);
          text-decoration: none;

          &:hover {
            color: var(--topaz-hover);
          }

          &:focus {
            text-decoration: underline;
          }
        }

        .md-nav__link--active {
          color: var(--topaz-pressed);
        }
      }
    }

    .md-nav__item--nested {
      @media screen and (width >= 1220px) {
        height: 40px;
        transition: height 0.25s cubic-bezier(0.86, 0, 0.07, 1);

        &:has(.md-nav__toggle:checked) {
          height: 100%;
          transition: height 0.25s cubic-bezier(0.86, 0, 0.07, 1);
        }
      }

      .md-nav__list {
        @media screen and (width >= 1220px) {
          margin-top: 16px;
          padding-bottom: 0;
        }

        .md-nav__item {
          .md-nav__link {
            color: var(--primary-colors-almost-black);
            font: var(--roboto-13-400);

            @media screen and (width <= 1220px) {
              border-top: none;
              font-size: 15px;
              font-weight: 500;
            }

            &:hover {
              color: var(--topaz-hover);
            }
          }

          .md-nav__link--active {
            color: var(--topaz-pressed);

            .md-nav__icon {
              display: none;
            }
          }
        }
      }
    }
  }
}

.md-search__form {
  border: 1px solid #626262;
  border-radius: 3px;
}

.md-footer {
  z-index: 1;
}

.md-sidebar--secondary {
  .md-sidebar__scrollwrap {
    height: 80vh !important;
  }
}