.list {
  &__main {
    position: relative;
  
    &[data-display="block"] {
      display: block; 
    }

    &[data-display="none"] {
      display: none;
    }
  }

  &__sidebar {
    &.l {
      margin-left: 1rem;

      &[data-dir="rtl"] {
        margin-left: 0;
        margin-right: 1rem;
      }

      &[data-dir="ltr"] {
        margin-left: 1rem;
        margin-right: 0;
      }
    }

    &[data-dir="rtl"] {
      margin-left: 1rem;
      margin-right: 0;
    }

    &[data-dir="ltr"] {
      margin-left: 0;
      margin-right: 1rem;
    }
  }

  &__header {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 1.25rem 0;
    font-family: $title-font;

    &--title {
      @include themify($themes) {
        color: themed('list-header-title-color');
      }
    }

    &--desc {
      padding: 1rem;
      line-height: 1.7rem;
    }
  }
}