body {
  font-size: 0.8rem;
}

.loading-box {
  border-radius: 15px;
  max-width: 200px !important;
  height: 150px !important;
  top: 50% !important;
  left: 50% !important;
  -ms-transform: translate(-50%, -50%) !important;
  transform: translate(-50%, -50%) !important;
}

.spinner-lg {
  --tblr-spinner-width: 2.5rem !important;
  --tblr-spinner-height: 2.5rem !important;
}

/* Navbar */
.navbar {
  min-height: 1.5rem !important;
}

.navbar .navbar-nav {
  min-height: 1rem;
}

.navbar-nav {
  --tblr-nav-link-padding-y: 0.1rem;
}

.navbar .navbar-nav .nav-link {
  position: relative;
  min-width: 2rem;
  min-height: 2rem;
  justify-content: center;
  border-radius: var(--tblr-border-radius);
}

.nav-link-title {
  font-size: 0.75rem !important;
}

.avatar-sm {
  --tblr-avatar-size: 1.75rem;
}

.navbar-brand-image {
  height: 1.5rem;
  width: auto;
}

.navbar-brand {
  padding-top: 0.25rem !important;
  padding-bottom: 0.25rem !important;
  font-size: 1rem;
}

.dropdown-item {
  font-size: 0.75rem !important;
  padding: 0.375rem 0.5rem;
}

.dropdown-divider {
  margin: 0.25rem 0;
}

.page-title {
  font-size: 1rem !important;
}

.page-pretitle {
  font-size: 0.5rem;
  line-height: 0.5rem !important;
}

/* Table */
/* table > tbody {
  font-size: 0.8rem !important;
} */

table > tbody {
  font-size: 0.688rem !important;
}

table > tbody .btn {
  font-size: 0.688rem !important;
}

.table-sm > :not(caption) > * > * {
  padding: 0.125rem;
}

/* input */
.form-control {
  font-size: 0.8rem !important;
  padding: 0.25rem 0.5rem !important;
}

.form-control {
  font-size: 0.8rem !important;
  padding: 0.25rem 0.5rem !important;
}

.form-control:focus {
  color: inherit;
  background-color: var(--tblr-bg-forms);
  border-color: #90b5e2;
  outline: 0;
  box-shadow: 0 0 transparent, 0 0 0 0.15rem rgba(32, 107, 196, 0.25) !important;
}

.form-check {
  margin-top: 3px !important;
  margin-bottom: 0px !important;
}

.form-select {
  font-size: 0.8rem !important;
  padding: 0.25rem 0.5rem !important;
}

.form-select:focus {
  box-shadow: 0 0 transparent, 0 0 0 0.15rem rgba(32, 107, 196, 0.25) !important;
}

.input-group-text {
  padding: 0.2rem 0.5rem !important;
}

.form-label {
  font-size: 0.75rem !important;
}

.col-form-label {
  font-size: 0.75rem !important;
  padding-top: calc(0.28rem + var(--tblr-border-width));
  padding-bottom: calc(0.28rem + var(--tblr-border-width));
}

.col-form-label-right {
  display: block;
  font-size: 0.8rem !important;
  text-align: right;
  padding-top: calc(0.4375rem + var(--tblr-border-width));
  padding-bottom: calc(0.4375rem + var(--tblr-border-width));
  margin-bottom: 0;
  font-size: inherit;
  font-weight: var(--tblr-font-weight-medium);
  line-height: 1.4285714286;
}

.col-form-label-right.required:after {
  content: "*";
  margin-left: 0.25rem;
  color: #d63939;
}

/* Button */
.btn {
  font-size: 0.8rem !important;
  padding: 0.25rem 0.5rem !important;
}

.btn-sm {
  padding: 0.125rem 0.25rem !important;
  line-height: 1.25;
  font-size: 0.75rem !important;
  border-radius: 3px;
}

/* Sweetalert */
.swal2-title {
  font-size: 1.25rem !important;
}

.swal2-html-container {
  font-size: 0.875rem !important;
}

.swal-wide {
  width: 360px !important;
}

.swal-wide2 {
  width: 500px !important;
}

.swal2-confirm {
  font-size: 0.875rem !important;
}

.swal2-cancel {
  font-size: 0.875rem !important;
}

/* Border */
.border-dotted {
  border-bottom: 1px dashed #dadfe5;
}

.line-title {
  /* display: block; */
  height: 2px;
  background: var(--tblr-primary);
  margin-top: 4px;
  width: 80px;
  border-radius: 5px;
}

/* Offcanvas */
.offcanvas-backdrop {
  z-index: 1090 !important;
}

/* Modal */
.modal-header {
  min-height: 3rem !important;
}

.modal-content .btn-close {
  height: 3rem !important;
}

/* Select2 */

.select2-selection {
  min-height: calc(1.5em + 0.6rem) !important;
  font-size: 0.8rem !important;
}

.select2-selection--single {
  padding: 0.25rem 2.25rem 0.25rem 0.5rem !important;
  background-size: 12px 9px !important;
}

.select2-dropdown .select2-search .select2-search__field {
  padding: 0.25rem 0.625rem !important;
  font-size: 0.8rem !important;
}

.select2-dropdown .select2-results__options .select2-results__option {
  font-size: 0.8rem !important;
}

.select2-container--bootstrap-5.select2-container--focus .select2-selection,
.select2-container--bootstrap-5.select2-container--open .select2-selection {
  box-shadow: 0 0 transparent, 0 0 0 0.15rem rgba(32, 107, 196, 0.25) !important;
}

.select2-container--bootstrap-5
  .select2-dropdown
  .select2-search
  .select2-search__field:focus {
  box-shadow: 0 0 transparent, 0 0 0 0.15rem rgba(32, 107, 196, 0.25) !important;
}

.form-control.readonly,
.form-control:read-only {
  color: #667382 !important;
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  user-select: none !important;
  background-color: var(--tblr-bg-surface-secondary) !important;
  opacity: 1 !important;
}

/* Modal */
.modal-title {
  font-size: 0.9rem !important;
}

.modal-header {
  min-height: 2.5rem !important;
  padding: 0 2rem 0 1rem;
}

.modal-content .btn-close {
  height: 2.5rem !important;
}

.modal-body {
  padding: 0.725rem 1rem;
}

.fixed-sticky-custom {
  position: -webkit-sticky;
  position: sticky;
  /* top: 50px; */
  top: 2.7rem;
}

.periksa-name {
  font-size: 0.875rem !important;
  line-height: 1.3rem !important;
  font-weight: 500 !important;
}

.avatar-itm {
  background: transparent no-repeat center/cover;
  box-shadow: none;
}

.badge-lg {
  width: 0.75rem !important;
  height: 0.75rem !important;
}

.card-header-tabs .nav-link.active {
  font-weight: 600 !important;
}

.btn-left-screen {
  position: fixed !important;
  z-index: 1090 !important;
  left: -1px !important;
  top: auto !important;
  transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform-origin: bottom left;
}

.btn-left-screen .btn {
  font-size: 0.625rem !important;
}

.btn-right-screen {
  position: fixed !important;
  z-index: 1090 !important;
  right: -1px !important;
  /* top: auto !important; */
  top: 2vh !important;
  transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -webkit-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  transform-origin: right bottom;
}

.btn-right-screen .btn {
  font-size: 0.625rem !important;
}

.offcanvas-start {
  z-index: 1100 !important;
}

.offcanvas-end {
  z-index: 1100 !important;
}

.col-before-fixed-bottom {
  margin-bottom: 3rem !important;
}

/*Datatables*/
table tbody td {
  word-break: break-word;
}

/* Others */
.blink {
  animation: blinker 1s linear infinite;
}

.form-select-grid {
  height: 25px !important;
  padding: 0.1rem 0.5rem !important;
}

.tox-promotion {
  display: none !important;
}

.table-cp tbody {
  display: block;
  height: 100%;
  overflow: auto;
  width: 100%;
}

.table-cp thead,
.table-cp tbody tr {
  display: table-row;
  width: 100%;
  table-layout: fixed;
}

/* Backgrund */
.bg-lime {
  background-color: #7bed9f !important;
}

/* Text Color */
.text-gloomypurple {
  color: #8854d0 !important;
}

.bg-yellow {
  background-color: #FFFB73 !important;
}

/* Custom Annimah */


.font-annimah {
    font-family: 'Inter', sans-serif !important;
}

.color-annimah-1 {
    color: #147453 !important;
}

.color-annimah-2 {
    color: #BBD1CF !important;
}

.bg-annimah-1 {
    background-color: #147453 !important;
}

.bg-annimah-2 {
    background-color: #BBD1CF !important;
}

.bg-annimah-3 {
    background-color: #4BA79C !important;
}

/* Dark Theme */

[data-bs-theme="dark"] .dynamic-text {
    color: white !important;
}

[data-bs-theme="dark"] .dynamic-text-2 {
    color: dark !important;
}

[data-bs-theme="dark"] .dynamic-text-3 {
    color: darkgray !important;
}

[data-bs-theme="dark"] .dynamic-bg {
    background-color: #202434 !important;
}

[data-bs-theme="dark"] a:not(.btn):not(.dropdown-toggle):not(.nav-link):not(.card):not(.dropdown-item) {
    color: #619adfff !important;
}

[data-bs-theme="dark"] a:not(.btn):not(.dropdown-toggle):not(.nav-link):not(.card):not(.dropdown-item):hover {
    color: #bfdbfe !important;
    text-decoration: underline;
}

[data-bs-theme="dark"] .page-pretitle {
    color: #e5e7eb !important;
}

[data-bs-theme="dark"] .card {
    color: inherit !important;
}


/* Form control */
[data-bs-theme="dark"] .form-control {
    background-color: #1e293b;
    color: #e5e7eb !important;
    border-color: #334155;
}

[data-bs-theme="dark"] .form-control::placeholder {
    color: #9ca3af;
}

[data-bs-theme="dark"] .form-control:focus {
    background-color: #1e293b;
    color: #f8fafc;
    border-color: #3b82f6;
    box-shadow: 0 0 0 .25rem rgba(59, 130, 246, .25);
}

/* Checkbox */
[data-bs-theme="dark"] .form-check:not(.form-switch) .form-check-input {
    background-color: #1e293b;
    border: 2px solid #94a3b8;
    width: 1.2em;
    height: 1.2em;
    transition: border-color .15s, box-shadow .15s, background-color .15s;
}

[data-bs-theme="dark"] .form-check:not(.form-switch) .form-check-input:hover {
    border-color: #cbd5e1;
}

[data-bs-theme="dark"] .form-check:not(.form-switch) .form-check-input:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 .25rem rgba(59, 130, 246, .25);
}

[data-bs-theme="dark"] .form-check:not(.form-switch) .form-check-input:checked {
    background-color: #3b82f6;
    border-color: #3b82f6;
}

/* Accordion */
/* CPPT */
/* [data-bs-theme="dark"] #accordion-riwayat-cppt .accordion-header,
[data-bs-theme="dark"] #accordion-riwayat-cppt .accordion-header .accordion-button {
    color: #111827 !important;
}

[data-bs-theme="dark"] #accordion-riwayat-cppt .accordion-item .accordion-header .accordion-button * {
    color: inherit !important;
}

[data-bs-theme="dark"] .card[style*="background-color: #ddce9f"],
[data-bs-theme="dark"] .card[style*="background-color: #eaf9ce"],
[data-bs-theme="dark"] .card[style*="background-color: #b5c9e1"],
[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] {
    color: #111827 !important;
    border-color: rgba(17, 24, 39, .15);
}

[data-bs-theme="dark"] .card[style*="background-color: #ddce9f"] .card-title,
[data-bs-theme="dark"] .card[style*="background-color: #ddce9f"] .card-header,
[data-bs-theme="dark"] .card[style*="background-color: #ddce9f"] .card-body,
[data-bs-theme="dark"] .card[style*="background-color: #ddce9f"] ul,
[data-bs-theme="dark"] .card[style*="background-color: #ddce9f"] li,
[data-bs-theme="dark"] .card[style*="background-color: #ddce9f"] p,
[data-bs-theme="dark"] .card[style*="background-color: #ddce9f"] b,
[data-bs-theme="dark"] .card[style*="background-color: #ddce9f"] strong:not(.card[style*="background-color: #ddce9f"] .table),
[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] .card-title,
[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] .card-header,
[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] .card-body,
[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] ul,
[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] li,
[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] p,
[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] b,
[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] strong:not(.card[style*="background-color: #F9E79F"] .table) {
    color: #111827 !important;
}

[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] a.badge.bg-info {
    background-color: #9cc8f9ff !important;
    color: #000000ff !important;
}

[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] a.badge.bg-info:hover {
    background-color: #60a5fa !important;
    color: #0b1220 !important;
}

[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] .table {
    --bs-table-color: #111827 !important;
    --bs-table-bg: transparent !important;
    --bs-table-border-color: rgba(17, 24, 39, .2) !important;

    --bs-table-striped-bg: rgba(17, 24, 39, .05) !important;
    --bs-table-striped-color: #111827 !important;

    --bs-table-hover-bg: rgba(17, 24, 39, .10) !important;
    --bs-table-hover-color: #111827 !important;

    --bs-table-accent-bg: transparent !important;
}


[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] .table tbody tr,
[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] .table tbody td {
    background-color: transparent !important;
    color: #70809fff !important;
}

[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] .table.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(17, 24, 39, .05) !important;
    color: #111827 !important;
}

[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] .table.table-striped tbody tr:nth-of-type(even) {
    background-color: transparent !important;
    color: #111827 !important;
}

[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] .table.table-hover tbody tr:hover {
    background-color: rgba(17, 24, 39, .10) !important;
    color: #111827 !important;
}

[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] .table .table-active,
[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] .table .table-active>* {
    background-color: rgba(17, 24, 39, .10) !important;
    color: #111827 !important;
}

[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] .table thead th {
    background-color: #fef9c3 !important;
    color: #111827 !important;
    border-color: rgba(17, 24, 39, .25) !important;
}

[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] .table,
[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] .table * {
    border-color: rgba(17, 24, 39, .2) !important;
}

[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] a.badge.bg-info {
    background-color: #93c5fd !important;
    color: #111827 !important;
}

[data-bs-theme="dark"] .card[style*="background-color: #F9E79F"] a.badge.bg-info:hover {
    background-color: #60a5fa !important;
    color: #0b1220 !important;
} */

/* ====== NAV TABS INTERAKTIF DALAM CARD HEADER (DARK THEME) ====== */
/* [data-bs-theme="dark"] .card-header .nav-tabs {
    border-bottom: 1px solid var(--bs-border-color);
}

[data-bs-theme="dark"] .card-header .nav-tabs .nav-link {
    color: var(--bs-secondary-color) !important;
    background-color: transparent;
    border: 1px solid transparent;
    border-top-left-radius: .375rem;
    border-top-right-radius: .375rem;
    transition: color .15s ease, background-color .15s ease, border-color .15s ease;
}

[data-bs-theme="dark"] .card-header .nav-tabs .nav-link::after {
    content: none !important;
}

[data-bs-theme="dark"] .card-header .nav-tabs .nav-link:hover {
    color: var(--bs-emphasis-color) !important;
    background-color: rgba(255, 255, 255, .04);
    border-color: var(--bs-border-color);
}

[data-bs-theme="dark"] .card-header .nav-tabs .nav-link.active,
[data-bs-theme="dark"] .card-header .nav-tabs .nav-item.show .nav-link {
    color: var(--bs-emphasis-color) !important;
    background-color: var(--bs-body-bg);
    border-color: var(--bs-border-color) var(--bs-border-color) transparent;
}

[data-bs-theme="dark"] .card-header .nav-tabs .nav-link.disabled {
    opacity: .5;
    pointer-events: none;
} */

/* ========== ROW LIME DI DARK THEME ========== */
/* 
[data-bs-theme="dark"] .table tr.bg-lime,
[data-bs-theme="dark"] .table tr.bg-lime>td,
[data-bs-theme="dark"] .table tr.bg-lime>th {
    color: #111827 !important;
}

[data-bs-theme="dark"] .table tr.bg-lime>td.sorting_1,
[data-bs-theme="dark"] .table tr.bg-lime>th.sorting_1 {
    color: #111827 !important;
}

[data-bs-theme="dark"] .table.table-hover tbody tr.bg-lime:hover>*,
[data-bs-theme="dark"] .table.table-striped tbody tr.bg-lime:hover>* {
    color: #111827 !important;
} */

/* ========== BARIS TABLE .bg-muted.text-white DI DARK THEME ========== */
/* [data-bs-theme="dark"] .table tbody tr.bg-muted.text-white,
[data-bs-theme="dark"] .table tbody tr.bg-muted.text-white>td,
[data-bs-theme="dark"] .table tbody tr.bg-muted.text-white>th {
    color: #e2e8f0 !important;
    border-color: rgba(255, 255, 255, .08) !important;
}

[data-bs-theme="dark"] .table tbody tr.bg-muted.text-white small,
[data-bs-theme="dark"] .table tbody tr.bg-muted.text-white i,
[data-bs-theme="dark"] .table tbody tr.bg-muted.text-white .text-body-secondary {
    color: #cbd5e1 !important;
}

[data-bs-theme="dark"] .table tbody tr.bg-muted.text-white a:not([class*="text-"]) {
    color: #e2e8f0 !important;
    text-decoration: none;
}

[data-bs-theme="dark"] .table tbody tr.bg-muted.text-white a:not([class*="text-"]):hover {
    color: #f1f5f9 !important;
}

[data-bs-theme="dark"] .table tbody tr.bg-muted.text-white .text-primary,
[data-bs-theme="dark"] .table tbody tr.bg-muted.text-white .text-success,
[data-bs-theme="dark"] .table tbody tr.bg-muted.text-white .text-warning,
[data-bs-theme="dark"] .table tbody tr.bg-muted.text-white .text-danger,
[data-bs-theme="dark"] .table tbody tr.bg-muted.text-white .badge {
    color: inherit;
}

[data-bs-theme="dark"] .table tbody tr.bg-muted.text-white .btn-outline-white {
    --bs-btn-color: #e2e8f0;
    --bs-btn-border-color: #e2e8f0;
    --bs-btn-hover-bg: #e2e8f0;
    --bs-btn-hover-color: #1f2937;
    --bs-btn-hover-border-color: #e2e8f0;
}

[data-bs-theme="dark"] .table tbody tr.bg-muted.text-white .dropdown-menu {
    background-color: #3b4252;
    color: #e5e7eb;
    border-color: rgba(255, 255, 255, .1);
}

[data-bs-theme="dark"] .table tbody tr.bg-muted.text-white .dropdown-item {
    color: #e5e7eb;
}

[data-bs-theme="dark"] .table tbody tr.bg-muted.text-white .dropdown-item:hover {
    background-color: #4b5563;
    color: #fff;
}

[data-bs-theme="dark"] .table.table-hover tbody tr.bg-muted.text-white:hover>* {
    background-color: rgba(255, 255, 255, .02) !important;
    color: #e2e8f0 !important;
}

[data-bs-theme="dark"] .table tr.bg-muted .badge.bg-success {
    color: #fff !important;
}

[data-bs-theme="dark"] .table tr.bg-muted a:hover .badge.bg-success {
    background-color: #16a34a !important;
    color: #fff !important;
} */

/* Row merah lebih soft */
/* [data-bs-theme="dark"] .table tr.bg-red,
[data-bs-theme="dark"] .table tr.bg-red>td,
[data-bs-theme="dark"] .table tr.bg-red>th {
    background-color: #CD1818 !important;
}

[data-bs-theme="dark"] .table tr.bg-red .btn-outline-primary {
    --bs-btn-color: #fff !important;
    --bs-btn-border-color: #fff !important;
    background-color: transparent;
    border-color: #fff !important;
    color: #fff !important;
    transition: all .15s ease-in-out;
}

[data-bs-theme="dark"] .table tr.bg-red .btn-outline-primary:hover {
    background-color: #fff !important;
    color: #CD1818 !important;
    border-color: #fff !important;
}

[data-bs-theme="dark"] .table tr.bg-red .btn-outline-primary i {
    color: #fff !important;
}

[data-bs-theme="dark"] .table tr.bg-red .btn-outline-primary:hover i {
    color: #CD1818 !important;
} */


/* Semua tombol outline-primary di tabel */
/* [data-bs-theme="dark"] .table .btn-outline-primary {
    color: #619adf !important;
    border-color: #619adf !important;
    background-color: transparent !important;
}

[data-bs-theme="dark"] .table .btn-outline-primary:hover,
[data-bs-theme="dark"] .table .btn-outline-primary:focus {
    background-color: #619adf !important;
    color: #fff !important;
    border-color: #619adf !important;
}

[data-bs-theme="dark"] .table .btn-outline-primary i {
    color: #619adf !important;
}

[data-bs-theme="dark"] .table .btn-outline-primary:hover i {
    color: #fff !important;
}

[data-bs-theme="dark"] .table .text-primary,
[data-bs-theme="dark"] .table small.text-primary,
[data-bs-theme="dark"] .table i.text-primary {
    color: #619adf !important;
}

[data-bs-theme="dark"] .table td small.text-primary {
    font-weight: 500;
} */

/* ====== GLOBAL STYLE UNTUK SEMUA GRIDTABLE (DARK THEME) ====== */
[data-bs-theme="dark"] .gridtable,
[data-bs-theme="dark"] .gridtable * {
    --grid-bg: #202434;
    --grid-bg-muted: rgba(255, 255, 255, .06);
    --grid-text: #e5e7eb;
    --grid-text-muted: #cbd5e1;
    --grid-border: rgba(255, 255, 255, .15);
    --grid-border-strong: rgba(255, 255, 255, .25);
    --grid-focus: #619adf;
}

[data-bs-theme="dark"] .gridtable thead th {
    color: var(--bs-secondary-color) !important;
    /* color: #e5e7eb !important; */
    background: transparent !important;
    border-color: var(--grid-border-strong) !important;
}

[data-bs-theme="dark"] .gridtable tbody td {
    border-color: var(--grid-border) !important;
    color: var(--grid-text) !important;
}

[data-bs-theme="dark"] .gridtable .grid-input,
[data-bs-theme="dark"] .gridtable .form-select-grid {
    color: var(--grid-text) !important;
    background-color: var(--grid-bg) !important;
    border: 1px solid var(--grid-border) !important;
    box-shadow: none !important;
}

[data-bs-theme="dark"] .gridtable .grid-input::placeholder {
    color: var(--grid-text-muted) !important;
    opacity: .85;
}

[data-bs-theme="dark"] .gridtable .grid-input[readonly],
[data-bs-theme="dark"] .gridtable .grid-input:disabled {
    background-color: #202434 !important;
    color: var(--grid-text-muted) !important;
    cursor: not-allowed;
}

[data-bs-theme="dark"] .gridtable .grid-input:focus,
[data-bs-theme="dark"] .gridtable .form-select-grid:focus {
    outline: 0 !important;
    border-color: var(--grid-focus) !important;
    box-shadow: 0 0 0 .2rem rgba(97, 154, 223, .25) !important;
}

[data-bs-theme="dark"] .gridtable .grid-input.is-valid {
    border-color: rgba(16, 185, 129, .6) !important;
}

[data-bs-theme="dark"] .gridtable .grid-input.is-invalid {
    border-color: rgba(248, 113, 113, .7) !important;
}

[data-bs-theme="dark"] .gridtable .form-select-grid {
    appearance: none;
    background-image:
        url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='%23619adf' d='M3.2 5.5L8 10.3l4.8-4.8.9.9-5.7 5.7-5.7-5.7.9-.9z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right .5rem center;
    background-size: 12px 12px;
    padding-right: 1.75rem;
}

[data-bs-theme="dark"] .gridtable .gridcomplete-items {
    background: #202434;
    border: 1px solid var(--grid-border-strong);
    color: var(--grid-text);
}

[data-bs-theme="dark"] .gridtable .gridcomplete-items .gridcomplete-table-row {
    background: transparent;
    color: var(--grid-text);
}

[data-bs-theme="dark"] .gridtable .gridcomplete-items .gridcomplete-table-row:hover {
    background: rgba(255, 255, 255, .06);
}

[data-bs-theme="dark"] .gridtable select.form-select-grid option {
    color: #e5e7eb;
    background: #0b1220;
}

[data-bs-theme="dark"] .gridtable .btn-outline-primary {
    color: #619adf !important;
    border-color: #619adf !important;
    background-color: transparent !important;
}

[data-bs-theme="dark"] .gridtable .btn-outline-primary:hover {
    background-color: #619adf !important;
    color: #fff !important;
}

[data-bs-theme="dark"] .gridtable thead th {
    background-color: #1f2937 !important;
    color: #f9fafb !important;
    border-color: rgba(255, 255, 255, .25) !important;
    font-weight: 600;
}

[data-bs-theme="dark"] svg text[onclick^="reset("] {
    fill: #e5e7eb !important;
    stroke: #e5e7eb !important;
}

[data-bs-theme="dark"] .input-group .input-group-text {
    background-color: #0f172a;
    color: #f9fafb !important;
    border-color: rgba(255, 255, 255, .15) !important;
}

[data-bs-theme="dark"] .input-group .input-group-text i,
[data-bs-theme="dark"] .input-group .input-group-text svg {
    color: #ffffff !important;
    fill: #ffffff !important;
}

[data-bs-theme="dark"] .input-group .input-group-text i[class*="text-"] {
    color: #ffffff !important;
}

[data-bs-theme="dark"] table [class*="bg-black"] {
    background-color: transparent !important;
    color: inherit !important;
}

[data-bs-theme="dark"] h4.accordion-header[style*="#f4f4f4"],
[data-bs-theme="dark"] h4.accordion-header[style*="background-color:#f4f4f4"i],
[data-bs-theme="dark"] h4.accordion-header[style*="background-color: #f4f4f4"i] {
    background-color: transparent !important;
}

[data-bs-theme="dark"] .accordion .accordion-button {
    /* background-color: #0f172a !important; */
    color: #111827 !important;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: .5rem;
}

[data-bs-theme="dark"] .accordion .accordion-button:not(.collapsed):not(i) {
    /* background-color: #111827 !important; */
    color: #111827 !important;
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .08);
}

[data-bs-theme="dark"] .accordion .accordion-button::after {
    filter: invert(1) grayscale(1);
    opacity: .9;
}

[data-bs-theme="dark"] .accordion .accordion-button * {
    color: inherit !important;
}

[data-bs-theme="dark"] .accordion .accordion-button .btn {
    background-color: #0b1220 !important;
    color: #e5e7eb !important;
    border: 1px solid #334155 !important;
    padding: .25rem .5rem !important;
    line-height: 1 !important;
    border-radius: .75rem !important;
}

[data-bs-theme="dark"] .accordion .accordion-button .btn:hover {
    background-color: #1e293b !important;
    color: #fff !important;
}

[data-bs-theme="dark"] .accordion .accordion-button .btn.bg-default {
    background-color: #0f172a !important;
    color: #e5e7eb !important;
    border-color: #334155 !important;
}

[data-bs-theme="dark"] .accordion .accordion-button .text-danger {
    color: var(--bs-danger, #ef4444) !important;
}

[data-bs-theme="dark"] .accordion .accordion-button .text-success {
    color: var(--bs-success, #22c55e) !important;
}

[data-bs-theme="dark"] .accordion .accordion-button .text-warning {
    color: var(--bs-warning, #f59e0b) !important;
}

[data-bs-theme="dark"] .accordion .accordion-button .text-primary {
    color: var(--bs-primary, #3b82f6) !important;
}

[data-bs-theme="dark"] .gridtable td .form-check.form-check-inline .form-check-input {
  background-color: #1e293b;             
  border: 2px solid #94a3b8;
  width: 1.1em; height: 1.1em;
  transition: border-color .15s, box-shadow .15s, background-color .15s;
}
[data-bs-theme="dark"] .gridtable td .form-check.form-check-inline .form-check-input:hover {
  border-color: #cbd5e1;
}
[data-bs-theme="dark"] .gridtable td .form-check.form-check-inline .form-check-input:focus {
  border-color: #3b82f6;
  box-shadow: 0 0 0 .2rem rgba(59,130,246,.25);
}
[data-bs-theme="dark"] .gridtable td .form-check.form-check-inline .form-check-input:checked {
  background-color: #3b82f6;
  border-color: #3b82f6;
}

[data-bs-theme="dark"] .gridtable td .form-check.form-check-inline .form-check-label {
  color: #1e293b !important;               
  margin-left: .35rem;                      
  user-select: none;
}

[data-bs-theme="dark"] .gridtable td .form-check.form-check-inline .form-check-input:disabled,
[data-bs-theme="dark"] .gridtable td .form-check.form-check-inline .form-check-input[disabled] {
  opacity: .7;
}

[data-bs-theme="dark"] .gridtable td .form-check.form-check-inline .form-check-input:disabled + .form-check-label {
  color: #9ca3af !important;              
}

[data-bs-theme="dark"] table thead > tr > th,
[data-bs-theme="dark"] table#datatable-main.dataTable thead > tr > th,
[data-bs-theme="dark"] table#datatable-main.dataTable thead > tr > td {
  background-color: transparent !important;                 
  color: #f8fafc !important;                            
  border-color: rgba(255,255,255,.25) !important;
  font-weight: 600;
}

[data-bs-theme="dark"] table#datatable-main.dataTable thead .sorting::before,
[data-bs-theme="dark"] table#datatable-main.dataTable thead .sorting::after,
[data-bs-theme="dark"] table#datatable-main.dataTable thead .sorting_asc::before,
[data-bs-theme="dark"] table#datatable-main.dataTable thead .sorting_desc::after,
[data-bs-theme="dark"] table#datatable-main.dataTable thead .sorting_asc_disabled::before,
[data-bs-theme="dark"] table#datatable-main.dataTable thead .sorting_desc_disabled::after {
  color: #9ca3af !important;                            
  opacity: .8;
}

[data-bs-theme="dark"] table#datatable-main.dataTable thead .sorting_asc::after,
[data-bs-theme="dark"] table#datatable-main.dataTable thead .sorting_desc::before {
  color: #3b82f6 !important;
  opacity: 1;
}

[data-bs-theme="dark"] table#datatable-main.dataTable thead > tr > th:hover {
  background-color: #223046 !important;
}

[data-bs-theme="dark"] table#datatable-main.dataTable thead > tr > th:focus {
  outline: none !important;
  box-shadow: inset 0 -1px 0 rgba(255,255,255,.12);
}


 /* =========================
   PATCH — DARK THEME HARMONIZE
   Tempelkan kode ini SETELAH CSS kamu sekarang
   ========================= */


[data-bs-theme="dark"] .accordion-item[style*="background-color: #ddce9f" i] ,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #eaf9ce" i] ,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #b5c9e1" i] ,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #F9E79F" i]  {
  color: #111827 !important; 
}

[data-bs-theme="dark"] .accordion-item[style*="background-color: #ddce9f" i]  *,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #eaf9ce" i]  *,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #b5c9e1" i]  *,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #F9E79F" i]  *{
  color: inherit !important;
}

[data-bs-theme="dark"] .accordion-item[style*="background-color: #ddce9f" i]  .table,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #eaf9ce" i]  .table,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #b5c9e1" i]  .table,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #F9E79F" i]  .table{
  --bs-table-color: #111827 !important;
  --bs-table-bg: transparent !important;
  --bs-table-border-color: rgba(17,24,39,.2) !important;

  --bs-table-striped-bg: rgba(17,24,39,.05) !important;
  --bs-table-striped-color: #111827 !important;

  --bs-table-hover-bg: rgba(17,24,39,.10) !important;
  --bs-table-hover-color: #111827 !important;

  --bs-table-accent-bg: transparent !important;
}

[data-bs-theme="dark"] .accordion-item[style*="background-color: #ddce9f" i]  .table thead th,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #eaf9ce" i]  .table thead th,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #b5c9e1" i]  .table thead th,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #F9E79F" i]  .table thead th{
  background-color: #fef9c3 !important;
  color: #111827 !important;
  border-color: rgba(17,24,39,.25) !important;
}

[data-bs-theme="dark"] .accordion-item[style*="background-color: #ddce9f" i]  a:not(.btn),
[data-bs-theme="dark"] .accordion-item[style*="background-color: #eaf9ce" i]  a:not(.btn),
[data-bs-theme="dark"] .accordion-item[style*="background-color: #b5c9e1" i]  a:not(.btn),
[data-bs-theme="dark"] .accordion-item[style*="background-color: #F9E79F" i]  a:not(.btn){
  color: #111827 !important; 
}
[data-bs-theme="dark"] .accordion-item[style*="background-color: #ddce9f" i]  a:not(.btn):hover,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #eaf9ce" i]  a:not(.btn):hover,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #b5c9e1" i]  a:not(.btn):hover,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #F9E79F" i]  a:not(.btn):hover{
  color: #111827 !important;
  /* text-decoration: underline; */
}

/* ===== Fix teks tabel di dalam accordion body (kartu terang / bg putih) ===== */

/* 1) Warna dasar isi accordion body pada latar terang/putih */
[data-bs-theme="dark"] .accordion-item[style*="background-color: #ddce9f" i] ,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #eaf9ce" i] ,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #b5c9e1" i] ,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #F9E79F" i]  {
  color: #111827 !important; /* teks gelap */
}

/* 2) Tabel di dalam accordion body → pakai variabel tabel gelap */
[data-bs-theme="dark"] .accordion-item[style*="background-color: #ddce9f" i]  .table,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #eaf9ce" i]  .table,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #b5c9e1" i]  .table,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #F9E79F" i]  .table {
  --bs-table-color: #111827 !important;
  --bs-table-bg: transparent !important;
  --bs-table-border-color: rgba(17,24,39,.2) !important;
  --bs-table-striped-bg: rgba(17,24,39,.05) !important;
  --bs-table-striped-color: #111827 !important;
  --bs-table-hover-bg: rgba(17,24,39,.10) !important;
  --bs-table-hover-color: #111827 !important;
}

/* 3) Paksa sel tbody tetap gelap (menang atas rule lain yang sempat memutihkan) */
[data-bs-theme="dark"] .accordion-item[style*="background-color: #ddce9f" i]  .table tbody td,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #ddce9f" i]  .table tbody th,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #eaf9ce" i]  .table tbody td,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #eaf9ce" i]  .table tbody th,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #b5c9e1" i]  .table tbody td,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #b5c9e1" i]  .table tbody th,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #F9E79F" i]  .table tbody td,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #F9E79F" i]  .table tbody th {
  color: #111827 !important;
  background-color: transparent !important;
}

/* 4) Header tabel di body terang */
[data-bs-theme="dark"] .accordion-item[style*="background-color: #ddce9f" i]  .table thead th,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #eaf9ce" i]  .table thead th,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #b5c9e1" i]  .table thead th,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #F9E79F" i]  .table thead th {
  background-color: #fef9c3 !important; /* boleh ganti sesuai skema */
  color: #111827 !important;
  border-color: rgba(17,24,39,.25) !important;
}

/* 5) Link non-button di body terang -> biru gelap agar kontras */
[data-bs-theme="dark"] .accordion-item[style*="background-color: #ddce9f" i] :not(.btn),
[data-bs-theme="dark"] .accordion-item[style*="background-color: #eaf9ce" i] :not(.btn),
[data-bs-theme="dark"] .accordion-item[style*="background-color: #b5c9e1" i] :not(.btn),
[data-bs-theme="dark"] .accordion-item[style*="background-color: #F9E79F" i] :not(.btn) {
  color: #111827 !important;
}

[data-bs-theme="dark"] .accordion-item[style*="background-color: #ddce9f" i] :not(.btn):hover,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #eaf9ce" i] :not(.btn):hover,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #b5c9e1" i] :not(.btn):hover,
[data-bs-theme="dark"] .accordion-item[style*="background-color: #F9E79F" i] :not(.btn):hover {
  color: #111827 !important;
  /* text-decoration: underline; */
}