::-webkit-scrollbar { width: 7px; height: 10px; }
/* Track */
::-webkit-scrollbar-track { background: #f1f1f1; }
.dark ::-webkit-scrollbar-track { background: #bdc8d8; }
/* Handle */
::-webkit-scrollbar-thumb { background: var(--bs-primary); }
.dark ::-webkit-scrollbar-thumb { background: #68717c; }
/* Handle on hover */
::-webkit-scrollbar-thumb:hover { background: #77818e; }
.dark ::-webkit-scrollbar-thumb:hover { background: #222738; }
.dark { background-color: #191c27 !important; }
.dark .bg-white { background: #222738 !important; }
.dark .sidebar-base .nav-item .nav-link, .dark .list-group-item .icon, .dark .list-group-item .name { color: #d7dbdf !important; }
.dark .caption-title, .dark .card-title, .dark .modal-title { color: #E2E4E9; }
.dark .bg-white.text-secondary { color: #E2E4E9 !important; }
@media (max-width: 1601px) {
    .theme-fs-sm { font-size: 13px; }
    .theme-fs-md { font-size: 14px; }
    .theme-fs-lg { font-size: 16px; }
}
.theme-fs-sm { font-size: 14px; }
.theme-fs-md { font-size: 16px; }
.theme-fs-lg { font-size: 18px; }
.swal2-popup, .modal-content { border-radius:20px !important; }
.dark .swal2-popup, .dark .modal-content { background: #222738; }
.dark .swal2-header .swal2-title { color: #E2E4E9; }
.dark .swal2-html-container { color: #8A92A6; }
.swal2-actions button { border-radius:20px !important; }
.sidebar.left-bordered .sidebar-body:not(.sub-nav) .nav-item:not(.static-item).active::before {
    height: 100%;
}
.sidebar.left-bordered .sidebar-body:not(.sub-nav) .nav-item:not(.static-item):hover::before {
    height: 100%;
    -webkit-transition: var(--sidebar-transition);
    -o-transition: var(--sidebar-transition);
    transition: var(--sidebar-transition);
    -webkit-transition-duration: var(--sidebar-transition-duration);
    -o-transition-duration: var(--sidebar-transition-duration);
    transition-duration: var(--sidebar-transition-duration);
    -webkit-transition-timing-function: var(--sidebar-transition-function-ease-in-out);
    -o-transition-timing-function: var(--sidebar-transition-function-ease-in-out);
    transition-timing-function: var(--sidebar-transition-function-ease-in-out);
    z-index: 1;
}
.sidebar.left-bordered .sidebar-body:not(.sub-nav) .nav-item:not(.static-item) .sub-nav .nav-item:not(.static-item):hover::before {
    height: 0%;
}
.sidebar.left-bordered .sidebar-body:not(.sub-nav) .nav-item:not(.static-item)::before {
    position: absolute;
    content: "";
    width: 4px;
    height: 0%;
    background-color: var(--bs-primary) !important;
    top: 0;
    left: 0;
    -webkit-border-top-right-radius: .25rem;
    border-top-right-radius: .25rem;
    -webkit-border-bottom-right-radius: .25rem;
    border-bottom-right-radius: .25rem;
    z-index: 1;
    -webkit-transition: var(--sidebar-transition);
    -o-transition: var(--sidebar-transition);
    transition: var(--sidebar-transition);
    -webkit-transition-duration: var(--sidebar-transition-duration);
    -o-transition-duration: var(--sidebar-transition-duration);
    transition-duration: var(--sidebar-transition-duration);
    -webkit-transition-timing-function: var(--sidebar-transition-function-ease-in-out);
    -o-transition-timing-function: var(--sidebar-transition-function-ease-in-out);
    transition-timing-function: var(--sidebar-transition-function-ease-in-out);
}
.sidebar.left-bordered:not(.sidebar-color) .nav-item:not(.static-item) .nav-link.active, .sidebar.left-bordered:not(.sidebar-color) .nav-item:not(.static-item) .nav-link[aria-expanded=true], .sidebar.left-bordered:not(.sidebar-color) .nav-item:not(.static-item) .nav-link:hover {
    color: var(--bs-primary) !important;
}
.sidebar.left-bordered .sidebar-body:not(.sub-nav) .nav-item:not(.static-item) {
    position: relative;
}
.dropdown-menu a:hover, .dropdown-menu a:hover svg,
#sidebar-menu a:hover, #sidebar-menu a:hover svg,
a:hover .sidenav-mini-icon, a:hover .item-name { color: var(--bs-primary) !important; }
a.dropdown-item:active, a.dropdown-item:active svg  { color: #FFFFFF !important; }
.mt-svg-min1 .svg-icon, .mt-svg-min1.svg-icon { margin-top: -1px !important; }
.mt-svg-min2 .svg-icon, .mt-svg-min2.svg-icon { margin-top: -2px !important; }
.mt-svg-min3 .svg-icon, .mt-svg-min3.svg-icon { margin-top: -3px !important; }
.mt-svg-min4 .svg-icon, .mt-svg-min4.svg-icon { margin-top: -4px !important; }
.mt-svg-min5 .svg-icon, .mt-svg-min5.svg-icon { margin-top: -5px !important; }
.invalid-feedback { margin-left: 15px; }
.has-feedback { position: relative; }
.has-feedback input { padding-right: 35px !important; }
.has-feedback input.parsley-error, .has-feedback input.parsley-success { padding-right: 55px !important; }
button.toggle-password { display: none; }
.has-feedback button.toggle-password {
    display: block;
    position: absolute;
    top: 36px;
    right: 5px;
    float: right;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    background: transparent;
    border: 0px;
}
.dark .has-feedback button.toggle-password { background: #222738;}
.dark .eye-open, .dark .eye-closed { color: aliceblue; }
.was-validated .has-feedback button.toggle-password { right:27px }

.theme-fs-md .has-feedback button.toggle-password { top: 41px; }
.theme-fs-md .was-validated .has-feedback button.toggle-password { right: 30px; }

.theme-fs-lg .has-feedback button.toggle-password { top: 46px; }
.theme-fs-lg .was-validated .has-feedback button.toggle-password { right: 35px; }

.dark .bg-error { background: #222738 !important; color: #8a92a6 !important; }
.dark .container-error .text-white { color: #8a92a6 !important; }
.dark .container-error .bg-white { background: #8a92a6 !important; color: #222738 !important }
.iq-navbar-header { margin-top:40px; }
.navbar-collapse {
    top: 0 !important;
    right: 0px !important;
    background: transparent !important;
    z-index: 0 !important;
}
.logo-main .logo-normal img { height:26px !important;max-width:200px !important; }
.logo-main .logo-mini img { height:26px !important;max-width:35px !important; }
.sidebar .navbar-brand { padding: 0.9rem 1rem; }
.img-bordered { border: 2px solid #f1f1f1;}
.sidebar-body .caption-sub-title { color:#8a92a6; }
.dark .sidebar-body .caption-sub-title { color:#6c757d; }
.sidebar-body .caption.ms-3 {
    margin-left: .7rem !important;
}
.sidebar-body .caption-title, .sidebar-body .caption-sub-title{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 150px;
}
.nav-item.static-item { margin-bottom: -15px; }
.nav-item.active ul.dropdown-menu-end.show li { padding: 0px !important; }
.float-left { float:left; }
.float-right { float:right; }
.mr-30 { margin-right:30px; }
.btn-action-dot-3 { height: 20px; margin-top: 3px;}
.btn-action-dot-3 svg { margin-top: -6px;}
.floating-button {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1000;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
.dropdown-action-menu.show {
    position: absolute !important;
    inset: 0px 0px auto auto !important;
    margin: 0px !important;
    transform: translate(-14px, 32px) !important;
}
.cursor-default { cursor: unset !important; }
.vtheme-light, .vtheme-dark { display: none; }
.vtheme-light.show, .vtheme-dark.show { display: block; }
.show { display: block; }
.hide { display: none; }
.uppercase { text-transform: uppercase; }
.lowercase { text-transform: lowercase; }
.simple-loader { background: rgba(0, 0, 0, 0.5) !important; text-align: center; margin-top: -35px; }
.simple-loader .loader-body { font-size: 20px; height: auto !important; }
.border-1 { border: 1px solid #aaa; }
.search-highlight { background: #3a57e8 !important; color: #FFFFFF }
.mt-2px { margin-top: 2px; }
.text-bold { font-weight: bold !important; }
.dark .modal-header { border-bottom: 1px solid #4b5164 !important; }
.dark .modal-footer { border-top: 1px solid #4b5164 !important; }
.position-absolute { position: absolute; }
textarea.rounded-pill { border-radius: 20px !important; }
.custom-tab.header-title {
    display: flex;
    flex-wrap: wrap; /* Supaya turun ke bawah jika penuh */
    align-items: center;
    justify-content: space-between; /* Tab kiri, search kanan */
    gap: 10px; /* Jarak antar elemen */
}
.custom-tab #vTextSearch { flex-shrink: 0; }
.inline-div { display: inline; }
.input-file-holder + .attr-accept {
    position: absolute;
    margin-top: 40px !important;
    font-size: 11px;
}
.table-custom tbody td  {
    padding: 10px;
}
.table-striped>tbody>tr:nth-of-type(even)>* {
    color: #232d42 !important;
}
.table-custom>tbody>tr:hover>* {
    color: #8A92A6 !important;
}
.datatables-custom th, .datatables-custom td {
    padding: 10px;
}
.datatables-custom td {
    vertical-align: top !important;
}
.pre {
    white-space: pre-wrap;
}
.truncate-3 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3; /* number of lines to show */
            line-clamp: 3;
    -webkit-box-orient: vertical;
}
.copy-btn { cursor: pointer; }
.table thead, .table tbody, .table tfoot, .table tr, .table td, .table th { white-space:normal; }
input.form-control:read-only, select.form-control:disabled { background: #f3f4f6 !important; cursor: not-allowed !important; }
.dark input.form-control:read-only,
.dark select.form-control:disabled,
.dark .select2-container--default.select2-container--disabled .select2-selection--single,
.dark .select2-container--default.select2-container--disabled .select2-selection--multiple {
    background: #2d3348 !important;
    cursor: not-allowed !important;
}
input.form-control:read-only, .dark input.form-control:read-only { cursor: pointer !important; }
.break-word {
  word-break: break-word;
  overflow-wrap: break-word;
}
input.bg-transparent:read-only { background: transparent !important; cursor:pointer !important; }
.text-history-trans { color:#333 }
.dark .text-history-trans { color:#f3f3f3 }
.dark .text-danger {
    color: #f44336 !important;
}
.dark .text-success {
    color: #4CAF50 !important;
}
.br-bottom-0 {
    border-bottom-left-radius: 0px !important;border-bottom-right-radius: 0px !important;
}
.bg-filter-custom {
    background: #f5f6fa !important;
}
.dark .bg-filter-custom {
    background: #151824 !important;
}
.cursor-pointer { cursor: pointer !important; }
.cursor-grab { cursor: grab; }