div.edit-category {
  display: block;

  .edit-category-nav {
    width: 100%;
    background-color: var(--secondary);
    position: relative;
    border-top: 1px solid var(--primary-low);
    border-bottom: 1px solid var(--primary-low);
    margin: 0.5em 0;
    overflow: hidden;
    &:after {
      background: linear-gradient(
        to right,
        rgba(var(--secondary-rgb), 0),
        rgba(var(--secondary-rgb), 1)
      );
      content: "";
      position: absolute;
      right: 0px;
      height: 100%;
      width: 30px;
    }
  }

  .nav-stacked {
    white-space: nowrap;
    flex-wrap: nowrap;
    overflow-x: scroll;
    display: inline-flex;
    width: 100%;
    margin-bottom: 0;
    li {
      font-size: var(--font-down-1);
      border-bottom: none;
    }
    a.active::after {
      display: none;
    }
  }

  .edit-category-title-bar {
    justify-content: start;
    align-items: center;
    padding-bottom: 1em;

    .menu-toggle {
      order: 1;
      margin-right: 1em;
    }

    h2 {
      order: 2;
      margin-bottom: 0;
      @include ellipsis;
    }
  }

  .edit-category-content {
    padding: 0.5em;
  }

  .edit-category-footer {
    padding: 0 0.5em 2em 0.5em;
  }
}