@include export-module('co-layout-switcher-layout') {
  .co-layout-switcher {

      position: relative;
      min-width: $layout-switcher-mask-min-width;
      height: 100%;
      .icon-wrapper {
        cursor: pointer;
        position: relative;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-evenly;
        width: $layout-switcher-mask-min-width;
        height: $layout-switcher-mask-min-height;

        .icon-mask {


          position: absolute;
          left: $layout-switcher-main-icon-left-position;
          width: 30px;
          height: 30px;
        }

        .icon-mask-sidebar-handle {
          position: absolute;
          left: $layout-switcher-main-icon-active-left-position;
          width: 30px;
          height: 30px;
        }
      }

      .mask-wrapper {
        left: 6em;
        display: flex;
        flex-direction: row;
        position: absolute;
        min-height: $layout-switcher-mask-min-height;
        min-width: $layout-switcher-mask-min-width;
        background: white;
        z-index: 10;
        border-right: 1px solid $layout-switcher-color-border;

      }

      .mask-wrapper-active {
        border: $layout-switcher-border;
        border-radius: 8px;
      }

      .mask-content {
        margin-top: 2rem;
        margin-left: 2rem;
        min-width: 350px;
        background: white;
        overflow: hidden;
        display: flex;
        flex-direction: column;

        span {
          padding: 1rem;
          font-size: $layout-switcher-big-text-font-size;
          font-weight: $layout-switcher-font-weight;
          color: $layout-switcher-color-text-main;
          text-decoration: none;
          height: 50%;
          width: 50%;

          &.active {
              background-color: #f0f5ff;
              border: 1px solid #e5ebfa;
              border-radius: 8px;
              color: #3c7dff;
          }

          p {
            padding: 1rem;
            margin-bottom: 1rem;
            margin-right: 1rem;
            font-size: $layout-switcher-big-text-font-size;
          }
        }


      }


  }
}