//
// Core: Sidebar Mini
//

// A fix for text overflow while transitioning from sidebar mini to full sidebar
.sidebar-menu,
.sidebar-menu > .nav-header,
.sidebar-menu .nav-link {
  white-space: nowrap;
}

.sidebar-collapse {
  .app-sidebar {
    min-width: $lte-sidebar-mini-width;
    max-width: $lte-sidebar-mini-width;
  }

  // Make the sidebar headers
  .sidebar-menu .nav-header {
    display: none;
  }

  .sidebar-menu {
    .nav-link {
      width: $lte-sidebar-mini-width - $lte-sidebar-padding-x * 2;
    }
  }

  .sidebar-menu .nav-link p {
    width: 0;
    white-space: nowrap;
  }

  .sidebar-menu .nav-link p,
  .brand-link {
    animation-name: fadeOut;
    animation-duration: $lte-transition-speed;
    animation-fill-mode: both;
  }

  &.sidebar-is-hover {
    .app-sidebar {
      min-width: var(--#{$lte-prefix}sidebar-width);
      max-width: var(--#{$lte-prefix}sidebar-width);
    }

    .sidebar-menu .nav-header {
      display: inline-block;
    }

    .sidebar-menu .nav-link {
      width: subtract(var(--#{$lte-prefix}sidebar-width), $lte-sidebar-padding-x * 2);
    }

    .sidebar-menu .nav-link p,
    .brand-link {
      margin-left: 0;
      visibility: visible;
      animation-name: fadeIn;
      animation-duration: $lte-transition-speed;
      animation-fill-mode: both;
    }
  }

  &:not(.sidebar-is-hover) {
    .sidebar-menu .nav-link p {
      .float-end {
        // clear: both;
        float: none !important;
      }
    }
  }
}