--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/default/assets/scss/layout/_sidebar.scss	Sat May 31 09:21:51 2025 +0800
@@ -0,0 +1,569 @@
+// main: ../style.scss
+/********************************
+*********************************
+SIDEBAR
+*********************************
+*********************************/
+.site-sidebar {
+  position: relative;
+  z-index: 9;
+  background: $sidebar-bg;
+  border-right: 1px solid $theme-border-color;
+  padding: 0;
+  display: flex;
+  flex-flow: column;
+  padding-bottom: 30px;
+
+  &.scrollbar-enabled {
+    padding-right: 0;
+  }
+
+  .rtl & {
+    border-right: 0;
+    border-left: 1px solid $theme-border-color;
+  }
+}
+
+.sidebar-nav {
+  flex: 1;
+  padding: 0 em(15);
+}
+
+@media (max-width: $theme-breakpoint) {
+  .scrollbar-enabled.site-sidebar {
+    position: absolute;
+  }
+
+  .site-sidebar {
+    display: none;
+    width: em(420);
+    max-width: 100%;
+    position: absolute;
+  }
+}
+
+.sidebar-collapse .sidebar-collapse-hidden {
+  display: none !important;
+}
+
+/* Sidebar User Area
+========================*/
+.side-user {
+  padding: em(20) 0;
+  border-bottom: 1px solid $theme-border-color;
+  margin-right:-1px;
+  position: relative;
+
+
+  .sidebar-collapse & {
+    padding-top: em(10);
+    padding-bottom: em(10);
+    position: relative;
+    top: 20px;
+    padding-bottom: 0;
+
+    .media-left {
+      padding-right: 0;
+      position: relative;
+      left: em(-8);
+    }
+
+    .dropdown-toggle {
+      display: none;
+    }
+
+    figure::after {
+      @include size(0.7em);
+      bottom: 0px;
+      left: em(4);
+    }
+
+    img {
+      max-width: em(40);
+      height: auto;
+    }
+  }
+
+	.media {
+		color: $nav-link-color;
+	}
+
+  .side-user-heading {
+		color: $headings-color;
+    font-family: $headings-font-family;
+    &:hover { color: $color-scheme; }
+  }
+
+  .side-user-link {
+    display: none;
+    height: em(26);
+    width: em(26);
+    background: #fff;
+    @include position(absolute, null -5px -5px null);
+    box-shadow: 0 0 5px 0px rgba(0, 0, 0, 0.4);
+    border-radius: em(50);
+
+    & .list-icon {
+      font-size: em(14);
+      line-height: em(27);
+    }
+  }
+
+  & > a:hover .media-heading,
+  .active .media-heading {
+    color: $color-scheme;
+  }
+
+  .media-body {
+    font-size: em(13);
+  }
+
+  [class*="user--"]:after {
+    right: auto;
+    left: rem(8);
+  }
+
+  body.rtl & {
+    padding-right: 0;
+  }
+}
+
+
+/* Vertical Sidebar
+========================*/
+.side-menu {
+  flex-direction: column;
+  position: relative;
+  line-height: em(30);
+  margin-top: em(20);
+  font-family: $headings-font-family;
+
+  ul {
+    font-size: em(12);
+    font-weight: 300;
+    margin-left: em(43,12);
+    position: relative;
+    top: -10px;
+
+    ul {
+      font-size: em(12);
+      margin-left: em(15,12);
+      top: 0;
+    }
+  }
+
+  .collapse.in {
+    display: block;
+  }
+
+  li {
+    position: relative;
+
+    a {
+      color: $nav-link-color;
+      position: relative;
+      display: block;
+      @include padding(0 null);
+      font-weight: 500;
+      &:hover { color: $color-scheme; }
+    }
+  }
+
+  > li {
+    > a {
+      padding: em(6.5) 0 em(6.5) em(15);
+      line-height: em(48);
+      color: $nav-heading-link-color;
+      border-top: 1px solid transparent;
+      font-family: $headings-font-family;
+      display: flex;
+      align-items: center;
+
+      &:hover,
+      &:focus {
+        color: $headings-color;
+        background: transparent;
+      }
+      .hide-text {
+        flex: 1;
+      }
+      i {
+        font-size: em(18);
+        vertical-align: middle;
+        position: relative;
+        top: -2px;
+      }
+
+      body.rtl & {
+        i.list-icon {
+          margin-left: .4em;
+        }
+      }
+    }
+
+    > a .badge {
+      position: relative;
+      top: em(13,11);
+      font-size: em(11,15);
+      line-height: 1.2;
+    }
+
+    &::after {
+      content: " ";
+      position: absolute;
+      width: 100%;
+      height: 1px;
+      right: 0;
+      background: rgba(255,255,255,.05);
+    }
+  }
+
+  .sidebar-collapse & > li > a {
+    padding: em(6.5) 0 em(6.5) em(20);
+  }
+
+  body.rtl.sidebar-collapse & {
+    > li > a {
+      padding: em(6.5) em(15) em(6.5) em(20);
+    }
+  }
+
+  > li:first-child > a {
+    border-top: 0;
+  }
+
+  .list-icon {
+    margin-right: em(8,20);
+    line-height: inherit;
+  }
+
+  :not([class*="color-"]) {
+    > .list-icon {
+      color: $nav-icon-color;
+    }
+  }
+
+  .menu-item-has-children {
+    > a {
+      position: relative;
+      &::before {
+        font-family: 'feather';
+        content: "\e928";
+        position: absolute;
+        right: em(10,18);
+        top: 50%;
+        transform: translateY(-50%);
+        font-size: rem(12);
+        color: #7b7b7b;
+      }
+
+      body.rtl &::before {
+        right: auto;
+        left: 0;
+      }
+    }
+    &.active > a::before {
+      content: "\e928";
+    }
+  }
+
+  body.rtl & {
+    padding-right: 0;
+    ul {
+      margin-left: 0;
+
+      ul {
+        padding-right: 0;
+        margin-right: 1em;
+      }
+    }
+  }
+}
+
+
+/* Expanded Vertical Sidebar
+========================*/
+@media (min-width: #{$theme-breakpoint + 1px}) {
+  .sidebar-expand {
+    .site-sidebar {
+      position: fixed;
+      width: $sidebar-width;
+      height: calc(100vh - #{$nav-height});
+
+      .side-menu > li > a {
+        border-top-color: $theme-border-color;
+      }
+    }
+  }
+}
+
+
+/* Collapsed Vertical Sidebar
+========================*/
+@media (min-width: #{$theme-breakpoint + 1px}) {
+  .sidebar-collapse {
+    .site-sidebar {
+      position: absolute;
+      top: $nav-height;
+      left: 0;
+      width: $collapse-sidebar-width;
+      bottom: 0;
+      overflow: visible !important;
+    }
+
+    .hide-menu, .hide-menu .badge {
+      display: none;
+    }
+
+    .sidebar-nav {
+      padding: 0;
+    }
+
+    .side-menu {
+      > li {
+        &:hover {
+          width: em(279,13);
+          border-top-right-radius: 5px;
+          > a {
+            background: $nav-link-hover-color;
+            display: block;
+            z-index: 9;
+            .hide-menu { display: inline-block }
+          }
+
+          .sub-menu {
+            margin-top: em(15);
+          }
+
+          > a, .sub-menu {
+            box-shadow: 0 3px 5px 0 rgba(0,0,0,0.1);
+          }
+        }
+
+        > a {
+          transition: none;
+          &::before { display: none; }
+        }
+      }
+
+      li:hover {
+        > .sub-menu { display: block; }
+      }
+
+      .sub-menu {
+        position: absolute;
+        top: em(48,13);
+        left: calc(#{$logo-width} - 1px);
+        width: calc(100% - #{$logo-width} + 1px);
+        margin-left: 0;
+        padding: 0 0 em(15,13);
+        display: none;
+        background: $nav-link-hover-color;
+        z-index: 10;
+
+        li {
+          background: $nav-link-hover-color;
+        }
+
+        .sub-menu {
+          left: 100%;
+          top: 0;
+          padding-top: em(15,13);
+        }
+
+        a {
+          padding: 0 em(15,13) 0 em(25,13);
+        }
+      }
+    }
+
+    .sidebar-module {
+      display: none;
+    }
+  }
+
+  body.rtl.sidebar-collapse {
+    .site-sidebar {
+      left: auto;
+      right: 0;
+    }
+
+    .side-menu .sub-menu {
+      left: 0;
+    }
+  }
+}
+
+
+/* Horizontal Sidebar
+========================*/
+@media (min-width: #{$theme-breakpoint + 1px}) {
+  .sidebar-horizontal {
+    .site-sidebar {
+      padding: 0 em(15);
+      box-shadow: 0 2px 2px 0 rgba(0,0,0,.1);
+      position: relative;
+      width: 100%;
+    }
+
+    .fix-top .site-sidebar {
+      position: fixed;
+      top: 0;
+    }
+
+    .list-icon { margin-right: 0; }
+    .side-user, .side-menu .badge { display:none; }
+
+    .side-menu {
+      margin-top: 0;
+      display: flex;
+      flex-flow: row;
+      ul {
+        position: absolute;
+        top: 0;
+        left: 100%;
+        background: $nav-link-hover-color;
+        z-index: 9;
+        margin-left: 0;
+        width: em(220,13);
+        padding: em(10,13) 0;
+        display: none;
+        line-height: em(36,13);
+        box-shadow: 0 10px 30px rgba(0,0,0,.1);
+        li { background: $nav-link-hover-color }
+        li:last-child {padding-bottom: em(5);}
+      }
+
+      li:hover > ul {display: block;}
+      a {@include padding(null em(15));}
+
+      > li {
+        display: inline-block;
+
+        > ul {
+          left: 0;
+          top: 100%;
+
+          a {
+            font-size: em(14,13);
+          }
+        }
+
+        > a {
+          border: 0;
+          padding: em(10,15) em(15,15) em(5,15);
+          text-align: center;
+
+          &::after {
+            content: "";
+            width: 100%;
+            height: em(2,15);
+            background: transparent;
+            position: absolute;
+            bottom: em(-1,15);
+            left: 0;
+            z-index: 10;
+          }
+
+          &::before {display: none;}
+          & .list-icon {display: block;}
+        }
+      }
+
+      .two-li {
+        width: em(440);
+        @include clearfix();
+
+        li {
+          float: left;
+          width: 50%;
+        }
+      }
+    }
+  }
+}
+
+
+/* Sidebar Dark
+========================*/
+.sidebar-dark {
+  .content-wrapper {
+    background: $color-scheme-dark;
+  }
+
+  .site-sidebar {
+    background: $color-scheme-dark;
+    border-color: rgba(255,255,255, 0.2);
+
+    .ps-scrollbar-y-rail,
+    .ps-scrollbar-x {
+      background: transparent !important;
+    }
+
+    .ps-scrollbar-y {
+      background: rgb(220,220,220) !important;
+      right: 0 !important;
+      width: rem(5) !important;
+    }
+  }
+
+  .side-menu {
+    li {
+      &:hover,
+      &.active {
+        background: $color-scheme-dark-hover;
+      }
+
+      &.active > a { color: #fff; }
+
+      a {
+        color: #afb2ba;
+        &:hover { color: #fff; }
+      }
+    }
+
+    :not([class*="color-"]) > .list-icon,
+    .menu-item-has-children > a::before {
+      color: #737986;
+    }
+  }
+
+  &.sidebar-collapse,
+  &.sidebar-horizontal {
+    .side-menu .sub-menu {
+      background: $color-scheme-dark-hover;
+
+      li {
+        background: $color-scheme-dark-hover;
+      }
+    }
+  }
+
+  .side-user {
+    border-bottom: 0;
+
+    .media {
+  		color: #afb2ba;
+  	}
+
+    .media-heading {
+      color: #fff;
+      font-weight: 400;
+    }
+
+    & > a:hover .media-heading,
+    .active .media-heading {
+      color: #fff;
+    }
+
+    .side-menu {
+      li:hover { background: transparent; }
+  		li a { color: #afb2ba; }
+      li a:hover { color: #fff; }
+  	}
+
+    [class*="user--"]:after {
+      border-color: $color-scheme-dark-hover;
+    }
+  }
+}