.menu,
.menu-wrapper {
    gap: 5px;
}
/* Ganti warna teks menu */
.menu-link .menu-title {
    color: white !important;
    font-weight: 400;
}

/* Hover effect */
.menu-link:hover .menu-title {
    color: white !important;
}

.aside-menu .menu .menu-item .menu-content,
.aside-menu .menu .menu-item .menu-link {
    height: 50px;
}
.menu-item {
    margin-left: 10px;
    margin-right: 10px;
}

#kt_aside_menu_wrapper .menu-link:hover {
    background-color: #c7c7c733;
    border-radius: 5px;
}

/* Hover: juga ubah warna icon dan teks */
#kt_aside_menu_wrapper .menu-link:hover .menu-icon i,
#kt_aside_menu_wrapper .menu-link:hover .menu-title {
    color: white;
}

/* Active state: untuk menu yang sedang aktif */
#kt_aside_menu_wrapper .menu-link.active {
    background-color: #ac1556 !important; /* warna lebih gelap dari hover */
    border-radius: 0.475rem;
}

/* Background */
.bg-gradient-dark {
    background: linear-gradient(135deg, #1f1f1f, #2d2d2d);
    color: #fff;
}

.aside .menu-item a,
.aside .menu-item .menu-link {
    color: #ffffff;
}

.aside .menu-item.active > .menu-link {
    background-color: rgba(255, 255, 255, 0.1);
}

.menu-state-icon-primary .menu-item .menu-link.active .menu-icon i {
    color: white;
}

/* dropdown */
.menu-state-icon-primary
    .menu-item.hover
    > .menu-link:not(.disabled):not(.active)
    .menu-icon
    i {
    color: white;
}

.menu-state-bullet-primary .menu-item .menu-link.active .menu-bullet .bullet {
    background-color: white;
}

.menu-state-icon-primary .menu-item.show > .menu-link .menu-icon i {
    color: white;
}

/* Teks aktif */
.menu-link.active .menu-title {
    color: white;
    font-weight: bold;
}

/* Ikon hover dan aktif */
.svg-icon.svg-icon-1 svg {
    background-color: white;
    border-radius: 50%;
}

.svg-icon.svg-icon-1 svg:hover {
    background-color: white;
    border-radius: 50%;
    transition: fill 0.3s ease-in-out;
}

/* Header */
.header-fixed .header {
    background-color: #f5f8fa;
    border-radius: 5px;
}

/* .aside-enabled.aside-fixed.header-fixed .header {
    left: 295px;
    transition: left 0.3s ease;
} */

/* Card */
.card {
    border: 0;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1),
        0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

/* Tabel */
.form-control.form-control-solid {
    background-color: white;
    border: solid 1px #e4e6ef;
}

/* Button dalam tabel */
.btn i {
    padding-right: 0;
}

.btn.btn-import,
.btn.btn-tambah {
    background-color: #ac1556;
    color: white;
}
.btn.btn-import:hover,
.btn.btn-tambah:hover {
    background-color: #d65a85;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    border: none;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background-color: white;
    border: none;
    outline: none;
    background: white;
    background: white;
    background: white;
    background: white;
    background: white;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:active {
    outline: none;
    border: none;
}

/* btn */
.btn-cancel {
    background-color: #28282b !important;
    color: white !important;
}

.btn-cancel:hover {
    background-color: rgba(33, 37, 41, 0.85) !important;
}

.btn-next {
    background-color: #ac1556;
    color: white;
}

.btn-next:hover {
    background-color: #c94374 !important;
    color: white;
}

/* check box rekap */
/* .form-check {
    padding-left: 0 !important;
    margin-left: 3rem !important;
} */

/* jadwal pehawai */
.btn-x-hover {
    transition: transform 0.2s ease, color 0.2s ease;
}

.btn-x-hover:hover {
    transform: scale(1.3) rotate(90deg);
    color: #a71d2a;
}

a.text-success:hover i {
    transform: scale(1.2) rotate(90deg);
    transition: transform 0.2s ease;
}

/* Pagging rekap */
div.dt-container .dt-paging .dt-paging-button {
    border-radius: 50%;
    background: transparent;
}
div.dt-container .dt-paging .dt-paging-button.current,
div.dt-container .dt-paging .dt-paging-button.current:hover {
    border-radius: 50%;
    border: none;
    outline: none;
    color: white !important;
    background-color: #ac1556;
}

div.dt-container .dt-paging .dt-paging-button.current:hover {
    border-radius: 50%;
    border: none;
    outline: none;
    color: white !important;
    background-color: #ac1556;
}