/* Sidebar Styles */

#sidebar-menu {
  background-color: #2a3650;
  width: 250px;
  height: 100vh;
  overflow-y: auto;
  padding-top: 10px;
}

.sidebar-links {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sidebar-list {
  position: relative;
}

.sidebar-list a {
  display: flex;
  align-items: center;
  color: #ffffff;
  text-decoration: none;
  padding: 12px 15px;
  font-size: 12px;
  transition: background 0.3s;
  font-weight: bold; /* Tambahkan ketebalan */
  text-shadow: 0px 0px 2px rgba(255, 255, 255, 0.6); /* Efek shadow untuk meningkatkan keterbacaan */
}

.sidebar-list a:hover,
.sidebar-list a.active {
  background-color: #1e293b;
}

.sidebar-title {
  font-weight: bold;
}

.sidebar-list i.fa-thumb-tack {
  color: #ffffff;
  margin-right: 10px;
}

.sidebar-submenu {
  list-style: none;
  padding-left: 20px;
  display: none;
}

.sidebar-submenu li a {
  font-size: 13px;
  padding: 8px 15px;
  display: block;
  color: #b0bec5;
  transition: color 0.3s;
}

.sidebar-submenu li a:hover {
  color: #FF9F43;
}

.sidebar-list .according-menu i {
  transition: transform 0.3s;
}

.sidebar-list.active .according-menu i {
  transform: rotate(90deg);
}

/* Simplebar Customization */
.simplebar-content-wrapper {
  overflow-x: hidden;
}


.sidebar-menu ul li a {
  color: #ffffff !important; /* Warna putih */
}

.sidebar-menu ul li a:hover {
  color: #FF9F43 !important; /* Warna lebih terang saat hover */
}


.sidebar .sidebar-menu > ul > li.submenu-open .submenu-hdr {
  font-weight: 500;
  font-size: 13px;
  color: #FF9F43;
  margin: 15px 0 0;
}



/* Button Style */
.page-header .btn-added {
  background: #7a70ba;
  padding: 7px 15px;
  color: #fff;
  font-weight: 700;
  font-size: 14px;
}
.page-header .btn-added img {
  filter: brightness(0) invert(1);
}
@media (max-width: 991.98px) {
  .page-header .btn-added {
    padding: 3px 8px;
  }
}
.page-header .btn-added:hover {
  background: #1B2850;
}

.btn-primary {
  color: #fff;
  background-color: #7a70ba !important;
  border-color: #7a70ba !important;
}

.btn-primary:hover {
  background: #1B2850 !important;
  color: #fff !important;
}


/******* COMPONENTS ******/
.btn-submit {
  min-width: 100px;
  background: #7a70ba;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  /* padding: 14px 10px; */
  -webkit-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.btn-submit:hover {
  background: #1B2850;
  color: #fff;
}
@media (max-width: 991.98px) {
  .btn-submit {
    min-width: auto;
    padding: 5px 7px;
  }
}




.pagination li {
  margin: 0 5px;
}
.pagination li a {
  border-radius: 5px;
  background: #637381;
  color: #fff;
}
.pagination li a:hover {
  background: #7a70ba;
  color: #fff;
}
.pagination li.active a.page-link {
  background: #7a70ba;
  border-color: #7a70ba;
  border-radius: 5px;
}

.sidebar .sidebar-menu > ul > li.submenu-open ul > li.active a {
  background: rgba(138, 173, 255, 0.08) !important;
}

.sidebar .sidebar-menu > ul li.active svg {
  color: #91A2FF !important;
}

.sidebar .sidebar-menu > ul > li.submenu-open .submenu-hdr {
  color: #91A2FF !important;
}

.sidebar .sidebar-menu > ul li a:hover {
  color: #91A2FF !important;
}

.header-left #toggle_btn {
  background: #91A2FF !important;
}

.header-left #toggle_btn:hover {
  background: #91A2FF !important;
}

.header .mobile-user-menu a {
  color: #91A2FF !important;
}

.mobile_btn {
  color: #91A2FF !important;
}

.bar-icon span {
  background: #91A2FF !important;
}

.nav-item-box:hover svg {
  color: #91A2FF !important;
}

.user-menu.nav > li > a .badge {
  background: #91A2FF !important;
}

.main-drop a:hover svg {
  color: #91A2FF !important;
}