/**
 *
 * You can write your CSS code here, DO NOT touch the default JavaScript file
 * because it will make it harder for you to update.
 *
 */

/*# sourceMappingURL=custom.css.map */

/* =========================================
   GLOBAL
========================================= */

.custom-section {
    position: static !important;
}

@media screen and (max-width: 768px) {
}

/* =========================================
   DROPDOWN MENU CATEGORY
========================================= */

.dropdown-menu-category {
    list-style: none;
    padding: 8px 15px;
    margin: 0;
    pointer-events: none;
}

.dropdown-category-label {
    font-weight: 600;
    color: #495057;
    font-size: 13px;
    text-transform: none;
    display: block;
    padding: 5px 0;
    margin-top: 3px;
}

.dropdown-menu .dropdown-menu-category:first-child .dropdown-category-label {
    margin-top: 0;
}

/* =========================================
   SIDEBAR MENU STYLE
========================================= */

/* Semua nav link */
.sidebar-menu .nav-link {
    background: transparent !important;
    transition: all 0.2s ease;
}

/* Hover menu */
.sidebar-menu .nav-link:hover {
    background: transparent !important;
    color: #4c9bc8 !important;
}

/* Hover icon */
.sidebar-menu .nav-link:hover i {
    color: #4c9bc8 !important;
}

/* Active menu */
.sidebar-menu .nav-link.active,
.sidebar-menu .nav-item.active > .nav-link {
    background: transparent !important;
    color: #4c9bc8 !important;
}

/* Active icon */
.sidebar-menu .nav-link.active i,
.sidebar-menu .nav-item.active > .nav-link i {
    color: #4c9bc8 !important;
}

/* =========================================
   SIDEBAR MULTI LEVEL DROPDOWN
========================================= */

/* Hilangkan background */
.sidebar-menu .nav-link,
.sidebar-menu .dropdown-menu,
.sidebar-menu ul {
    background: transparent !important;
    box-shadow: none !important;
}

/* Hover */
.sidebar-menu .nav-link:hover,
.sidebar-menu .submenu-link:hover,
.sidebar-menu .submenu-level-2 li a:hover {
    color: #4c9bc8 !important;
    background: transparent !important;
}

/* Active */
.sidebar-menu .active {
    color: #4c9bc8 !important;
}

/* Dropdown utama */
.sidebar-menu .dropdown-menu {
    display: block;
    position: relative;
    border: none;
    padding: 0;
    margin: 0;
}

/* Submenu wrapper */
.sidebar-menu .dropdown-submenu {
    position: relative;
}

/* Link level 2 */
.sidebar-menu .submenu-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 20px 10px 45px;
    color: #6c757d;
    text-decoration: none;
    font-size: 15px;
    transition: 0.2s;
}

/* Panah submenu */
.sidebar-menu .submenu-link::after {
    content: "›";
    font-size: 18px;
    font-weight: bold;
}

/* Level 3 */
.sidebar-menu .submenu-level-2 {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* Link level 3 */
.sidebar-menu .submenu-level-2 li a {
    display: block;
    padding: 9px 20px 9px 70px;
    color: #6c757d;
    text-decoration: none;
    font-size: 14px;
    transition: 0.2s;
}

/* Hover level 3 */
.sidebar-menu .submenu-level-2 li a:hover {
    color: #4c9bc8 !important;
}

/* Active level 3 */
.sidebar-menu .submenu-level-2 li a.active {
    color: #4c9bc8 !important;
    font-weight: 600;
}

/* Hover menu utama */
.sidebar-menu .nav-link:hover {
    color: #4c9bc8 !important;
}

/* Hover icon */
.sidebar-menu .nav-link:hover i {
    color: #4c9bc8 !important;
}

/* Active menu utama */
.sidebar-menu .nav-item.active > .nav-link {
    color: #4c9bc8 !important;
}

/* Rapikan spacing */
.sidebar-menu li {
    list-style: none;
}

/* Hilangkan style bawaan stisla */
.sidebar-menu .dropdown-menu::before,
.sidebar-menu .dropdown-menu::after {
    display: none !important;
}

/* =========================================
   SIDEBAR DROPDOWN FIX
========================================= */

/* Remove default bootstrap/stisla dropdown style */
.sidebar-menu .dropdown-menu {
    position: relative !important;
    inset: auto !important;
    transform: none !important;

    width: 100%;
    min-width: 100%;

    padding: 0 !important;
    margin: 0 !important;

    border: none !important;
    box-shadow: none !important;

    background: transparent !important;
}

/* Remove bootstrap arrow */
.sidebar-menu .dropdown-menu::before,
.sidebar-menu .dropdown-menu::after {
    display: none !important;
}

/* =========================================
   MAIN NAV LINK
========================================= */

.sidebar-menu .nav-link {
    display: flex;
    align-items: center;

    width: 100%;

    color: #6c757d !important;
    background: transparent !important;

    transition: all 0.2s ease;
}

/* Hover */
.sidebar-menu .nav-link:hover {
    color: #4c9bc8 !important;
}

/* Active */
.sidebar-menu .nav-item.active > .nav-link {
    color: #4c9bc8 !important;
}

/* Icon */
.sidebar-menu .nav-link i {
    width: 18px;
    margin-right: 12px;
    text-align: center;
}

/* =========================================
   DROPDOWN LEVEL 1
========================================= */

.sidebar-menu .has-dropdown {
    position: relative;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between;
}

/* Arrow level 1 */
.sidebar-menu .has-dropdown::after {
    content: "\f105";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;

    font-size: 12px;

    position: absolute;
    right: 20px;

    top: 50%;
    transform: translateY(-50%) rotate(0deg);

    line-height: 1;
    transition: transform 0.25s ease;
}

/* =========================================
   LEVEL 2
========================================= */

.sidebar-menu .submenu-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;

    width: 100%;

    padding: 10px 20px 10px 45px;

    color: #6c757d;
    text-decoration: none;

    transition: all 0.2s ease;
}

/* Hover */
.sidebar-menu .submenu-toggle:hover {
    color: #4c9bc8 !important;
}

/* Arrow level 2 */
.sidebar-menu .submenu-toggle::after {
    content: "\f105";

    font-family: "Font Awesome 5 Free";
    font-weight: 900;

    font-size: 11px;

    transform: rotate(0deg);
    transform-origin: center;

    transition: transform 0.25s ease;
}

/* rotate saat open */
.sidebar-menu .dropdown-submenu.open > .submenu-toggle::after {
    transform: rotate(90deg);
}

/* Open state */
.sidebar-menu .dropdown-submenu.open > .submenu-toggle {
    color: #4c9bc8 !important;
}

/* =========================================
   LEVEL 3
========================================= */

.sidebar-menu .submenu-level {
    display: none;

    padding: 0;
    margin: 0;
}

/* show submenu */
.sidebar-menu .dropdown-submenu.open .submenu-level {
    display: block;
}

/* level 3 link */
.sidebar-menu .submenu-level li a {
    display: block;

    /* top right bottom left */
    padding: 9px 20px 9px 95px;

    color: #6c757d;
    text-decoration: none;

    font-size: 14px;

    transition: all 0.2s ease;
}

/* Hover */
.sidebar-menu .submenu-level li a:hover {
    color: #4c9bc8 !important;
}

/* Active */
.sidebar-menu .submenu-level li a.active {
    color: #4c9bc8 !important;
    font-weight: 600;
}
/* Level 2 title */
.sidebar-menu .submenu-toggle {
    font-weight: 600;
}

/* Level 3 item */
.sidebar-menu .submenu-level li a {
    opacity: 0.9;
}

/* Rapikan semua dropdown sidebar */
.sidebar-menu .nav-item.dropdown > .nav-link {
    min-height: 45px;
    display: flex !important;
    align-items: center !important;
}

/* Icon kiri */
.sidebar-menu .nav-item.dropdown > .nav-link i {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Tulisan menu */
.sidebar-menu .nav-item.dropdown > .nav-link span {
    display: flex;
    align-items: center;
}
/* =========================================
   SPACING
========================================= */

.sidebar-menu li {
    list-style: none;
}

.sidebar-menu .level-1-menu {
    margin-top: 4px;
}

/* =========================================
   MOBILE
========================================= */

@media (max-width: 768px) {
    .sidebar-menu .submenu-toggle {
        padding-left: 35px;
    }

    .sidebar-menu .submenu-level li a {
        padding-left: 55px;
    }
}