@use './../../../../core/style/breakpoints';
.acontplus-container-wrap,
.acontplus-container {
  --mat-sidenav-content-background-color: transparent;

  height: 100%;
}

.acontplus-sidenav {
  --mat-sidenav-container-width: var(--acp-sidenav-width);

  position: absolute;
  overflow-x: hidden;
  border-width: 0 !important;
  transition-property: transform, width !important;
}

// Layout control
.acontplus-header-above {
  .acontplus-container {
    height: calc(100% - var(--mat-toolbar-standard-height)) !important;

    @include breakpoints.bp-lt(small) {
      height: calc(100% - var(--mat-toolbar-mobile-height)) !important;
    }
  }

  .acontplus-sidebar-main {
    height: 100% !important;
    padding-top: 0.5rem;
  }
}

// Layout control
.acontplus-sidenav-collapsed {
  .acontplus-sidenav {
    width: var(--acp-sidenav-collapsed-width);

    .menu-name,
    .menu-label,
    .menu-badge,
    .menu-caret,
    .acontplus-user-panel-info {
      opacity: 0;
    }

    .menu-icon.submenu-icon {
      opacity: 1;
    }

    .acontplus-user-panel-avatar {
      transform: scale(0.5);
    }

    &:hover {
      width: var(--acp-sidenav-width);

      .menu-name,
      .menu-label,
      .menu-badge,
      .menu-caret,
      .acontplus-user-panel-info {
        opacity: 1;
      }

      .menu-icon.submenu-icon {
        opacity: 0;
      }

      .acontplus-user-panel-avatar {
        transform: scale(1);
      }
    }
  }

  .acontplus-content {
    margin-left: var(--acp-sidenav-collapsed-width) !important;

    [dir='rtl'] & {
      margin-right: var(--acp-sidenav-collapsed-width) !important;
      margin-left: auto !important;
    }
  }

  &[dir='rtl'] .acontplus-content {
    margin-right: var(--acp-sidenav-collapsed-width) !important;
    margin-left: auto !important;
  }
}

// Layout control
.acontplus-navbar-top {
  .acontplus-topmenu {
    top: 0;
  }

  .acontplus-branding {
    margin-left: 1rem;

    [dir='rtl'] & {
      margin-right: 1rem;
      margin-left: auto;
    }
  }
}

// Layout control
.acontplus-header-fixed {
  .acontplus-header {
    position: sticky;
    top: 0;
  }

  .acontplus-topmenu {
    top: var(--mat-toolbar-standard-height);

    @include breakpoints.bp-lt(small) {
      top: var(--mat-toolbar-mobile-height);
    }
  }
}

.acontplus-page-content {
  position: relative;
  padding: var(--acp-gutter);

  .acontplus-header + &,
  .acontplus-header-above &,
  .acontplus-navbar-top & {
    padding-top: 0;
  }
}
// ── Content ───────────────────────────────────────────────────────────────────
.acp-shell-content {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.acp-shell-page-content {
  position: relative;
  flex: 1 1 auto;
  padding: var(--acp-gutter, 1rem);
  overflow: auto;
}

// ── Layout modifiers ──────────────────────────────────────────────────────────

// Header above: the sidenav container must account for the header height
.acp-shell--header-above {
  display: flex;
  flex-direction: column;

  .acp-shell-sidenav-container {
    flex: 1 1 auto;
    height: calc(100% - var(--mat-toolbar-standard-height));

    @include breakpoints.bp-lt(small) {
      height: calc(100% - var(--mat-toolbar-mobile-height));
    }
  }

  .acp-shell-page-content {
    padding-top: 0;
  }
}

// Sidenav collapsed (narrow mode)
.acp-shell--sidenav-collapsed {
  .acp-shell-sidenav {
    width: var(--acp-sidenav-collapsed-width);

    // Fade out text/labels when collapsed
    .menu-name,
    .menu-label,
    .menu-badge,
    .menu-caret,
    .acp-sidebar-user-panel-info {
      opacity: 0;
      pointer-events: none;
    }

    .menu-icon.submenu-icon {
      opacity: 1;
    }

    .acp-sidebar-user-panel-avatar {
      transform: scale(0.5);
    }

    // Expand on hover
    &:hover {
      width: var(--acp-sidenav-width);

      .menu-name,
      .menu-label,
      .menu-badge,
      .menu-caret,
      .acp-sidebar-user-panel-info {
        opacity: 1;
        pointer-events: auto;
      }

      .menu-icon.submenu-icon {
        opacity: 0;
      }

      .acp-sidebar-user-panel-avatar {
        transform: scale(1);
      }
    }
  }

  // Push content to the right matching the collapsed width
  .acp-shell-content {
    margin-left: var(--acp-sidenav-collapsed-width) !important;

    [dir='rtl'] & {
      margin-right: var(--acp-sidenav-collapsed-width) !important;
      margin-left: auto !important;
    }
  }
}

// Top navbar mode
.acp-shell--navbar-top {
  .acp-shell-page-content {
    padding-top: 0;
  }
}

// Header fixed: sticky header inside content
.acp-shell--header-fixed {
  .acp-shell-page-content {
    padding-top: 0;
  }
}