/* Compatibility layer for legacy CBT views on Bootstrap 5 / AdminLTE 4. */
:root {
  --cbt-primary: #198754;
  --cbt-sidebar: #14281d;
}

body { min-height: 100vh; background: var(--bs-tertiary-bg); }
.app-wrapper { min-height: 100vh; }
.app-header { position: sticky; top: 0; align-self: start; background: var(--cbt-primary); }
/* Fixed navigation must not depend on the body's overflow/scroll container. */
.cbt-fixed-navigation .app-wrapper { --cbt-header-height: 57px; grid-template-rows: var(--cbt-header-height) 1fr min-content; grid-template-columns: 0 minmax(0, 1fr); }
.cbt-fixed-navigation .app-header { position: fixed; top: 0; right: 0; left: 0; z-index: 1034; }
.app-header .nav-link, .app-header .navbar-brand { color: #fff; }
.app-header > nav { display: flex; width: 100%; }
.navbar-custom-menu { margin-left: auto; }
.navbar-header { display: flex; align-items: center; }
.cbt-year-select { width: auto; min-width: 8.5rem; max-width: 12rem; border-color: rgba(255,255,255,.45); }
.navbar-brand { color: #fff; text-decoration: none; }
.app-sidebar { background: var(--cbt-sidebar); color: rgba(255,255,255,.85); }
.sidebar-brand { border-bottom: 1px solid rgba(255,255,255,.12); }
.brand-link { color: #fff; font-weight: 700; text-decoration: none; }
.sidebar-brand { padding: .75rem; }
.sidebar-brand .brand-link { display: flex; min-width: 0; align-items: center; justify-content: flex-start; gap: .7rem; }
.sidebar-brand .brand-mark { display: inline-flex; flex: 0 0 2.25rem; width: 2.25rem; height: 2.25rem; align-items: center; justify-content: center; border-radius: .65rem; color: #fff; background: linear-gradient(145deg, #198754, #56c596); box-shadow: 0 .2rem .6rem rgba(0,0,0,.2); font-size: 1.1rem; }
.sidebar-brand .brand-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-menu .nav-link { color: rgba(255,255,255,.82); border-radius: .375rem; }
.sidebar-menu .nav-link:hover, .sidebar-menu .nav-link.active { background: rgba(255,255,255,.12); color: #fff; }
.sidebar-menu .treeview-menu { list-style: none; padding-left: 1rem; }
.sidebar-menu .treeview-menu > li > a { display: block; padding: .45rem .75rem; color: rgba(255,255,255,.72); text-decoration: none; }
.app-main { min-width: 0; }
.content-wrapper { min-height: calc(100vh - 7.5rem); padding: 1rem; background: var(--bs-tertiary-bg); }
.content-header { padding: 1rem 1rem .5rem; }
.content-header h1 { margin: 0; font-size: 1.75rem; }
.content-header h1 small { display: block; margin-top: .35rem; font-size: .95rem; color: var(--bs-secondary-color); font-weight: 400; }
.content-header .breadcrumb { margin-top: .75rem; }
.content { padding: 1rem; }
.cbt-page-header { padding: 1.5rem 1.5rem .5rem; }
.cbt-page-header h1 { font-size: 1.65rem; font-weight: 700; letter-spacing: -.02em; }
.cbt-page-header .breadcrumb { padding: .55rem .8rem; background: var(--bs-body-bg); border: 1px solid var(--bs-border-color); border-radius: var(--bs-border-radius); }
.cbt-page-header .breadcrumb a { color: var(--bs-success); text-decoration: none; }
.cbt-page-header .breadcrumb a:hover { color: var(--bs-success-text-emphasis); text-decoration: underline; }
.cbt-page-header .breadcrumb-item { display: flex; align-items: center; white-space: nowrap; }
.cbt-page-header .breadcrumb-item.active { color: var(--bs-secondary-color); }
.cbt-modern-page .box { overflow: hidden; border-top-color: var(--bs-success); }
.cbt-modern-page .box-header { min-height: 3.5rem; background: var(--bs-body-bg); }
.cbt-modern-page .box-body { min-width: 0; }
.cbt-modern-page .dataTables_wrapper .row { align-items: center; row-gap: .75rem; }
.cbt-modern-page .dt-container .row { align-items: center; row-gap: .75rem; }
.cbt-modern-page .dataTables_filter input,
.cbt-modern-page .dataTables_length select,
.cbt-modern-page .dt-search input,
.cbt-modern-page .dt-length select { border-radius: var(--bs-border-radius); }
.cbt-modern-page table.dataTable { margin-top: .75rem !important; margin-bottom: .75rem !important; }
.cbt-modern-page table.dataTable thead th { white-space: nowrap; background: var(--bs-tertiary-bg); }
.cbt-modern-page table,
.cbt-main table,
.content-wrapper table {
  border: var(--bs-border-width) solid var(--bs-border-color);
  border-collapse: collapse;
}
.cbt-modern-page table > :not(caption) > * > *,
.cbt-main table > :not(caption) > * > *,
.content-wrapper table > :not(caption) > * > * {
  border: var(--bs-border-width) solid var(--bs-border-color) !important;
}
.cbt-modern-page .table-responsive,
.cbt-main .table-responsive,
.content-wrapper .table-responsive {
  border-radius: var(--bs-border-radius);
}
.cbt-modern-page table.dataTable > tbody > tr.child > td.child,
.cbt-main table.dataTable > tbody > tr.child > td.child,
.content-wrapper table.dataTable > tbody > tr.child > td.child {
  border: var(--bs-border-width) solid var(--bs-border-color) !important;
}
.cbt-modern-page .box-footer { display: flow-root; }
.callout { margin-bottom: 1rem; padding: 1rem; border-left: .35rem solid var(--bs-secondary); border-radius: var(--bs-border-radius); background: var(--bs-body-bg); }
.callout-info { border-left-color: var(--bs-info); }
.callout-success { border-left-color: var(--bs-success); }
.callout-warning { border-left-color: var(--bs-warning); }
.callout-danger { border-left-color: var(--bs-danger); }
.callout h4 { margin-top: 0; }
.main-footer { padding: 1rem; background: var(--bs-body-bg); border-top: var(--bs-border-width) solid var(--bs-border-color); }

/* AdminLTE 2 box widgets become Bootstrap cards. */
.box { margin-bottom: 1rem; background: var(--bs-body-bg); border: 1px solid var(--bs-border-color); border-top: 3px solid var(--bs-secondary); border-radius: var(--bs-border-radius); box-shadow: 0 .125rem .25rem rgba(0,0,0,.075); }
.box.box-primary { border-top-color: var(--bs-primary); }
.box.box-success { border-top-color: var(--bs-success); }
.box.box-info { border-top-color: var(--bs-info); }
.box.box-warning { border-top-color: var(--bs-warning); }
.box.box-danger { border-top-color: var(--bs-danger); }
.box-header { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .75rem 1rem; border-bottom: 1px solid var(--bs-border-color); }
.box-title { margin: 0; font-size: 1.1rem; font-weight: 600; }
.box-tools { margin-left: auto; }
.box-body { padding: 1rem; }
.box-footer { padding: .75rem 1rem; border-top: 1px solid var(--bs-border-color); background: var(--bs-tertiary-bg); }
.box-header:before, .box-header:after, .box-body:before, .box-body:after { display: none; }

/* Bootstrap 3 utility/component aliases used by existing views. */
.pull-left { float: left !important; }
.pull-right { float: right !important; }
.col-xs-1 { flex: 0 0 auto; width: 8.33333333%; }
.col-xs-2 { flex: 0 0 auto; width: 16.66666667%; }
.col-xs-3 { flex: 0 0 auto; width: 25%; }
.col-xs-4 { flex: 0 0 auto; width: 33.33333333%; }
.col-xs-5 { flex: 0 0 auto; width: 41.66666667%; }
.col-xs-6 { flex: 0 0 auto; width: 50%; }
.col-xs-7 { flex: 0 0 auto; width: 58.33333333%; }
.col-xs-8 { flex: 0 0 auto; width: 66.66666667%; }
.col-xs-9 { flex: 0 0 auto; width: 75%; }
.col-xs-10 { flex: 0 0 auto; width: 83.33333333%; }
.col-xs-11 { flex: 0 0 auto; width: 91.66666667%; }
.col-xs-12 { flex: 0 0 auto; width: 100%; }
.hidden { display: none !important; }
.hide { display: none !important; }
.label { display: inline-block; padding: .35em .65em; border-radius: var(--bs-border-radius-pill); font-size: .75em; font-weight: 600; line-height: 1; color: #fff; vertical-align: baseline; }
.label-default { background: var(--bs-secondary); }
.label-primary { background: var(--bs-primary); }
.label-success { background: var(--bs-success); }
.label-info { background: var(--bs-info); color: #000; }
.label-warning { background: var(--bs-warning); color: #000; }
.label-danger { background: var(--bs-danger); }
.btn-default { --bs-btn-color: #212529; --bs-btn-bg: #f8f9fa; --bs-btn-border-color: #dee2e6; --bs-btn-hover-bg: #e9ecef; --bs-btn-hover-border-color: #ced4da; }

/* Consistent semantic colors for CRUD and bulk-selection actions. */
:is(.cbt-modern-page, .modal) :is(
  #btn-tambah,
  #btn-tambah-kelas,
  #tambah-simpan,
  #edit-simpan,
  #btn-simpan,
  #btn-edit-waktu-simpan,
  a[href*="/index/add"],
  a[href$="/tes_tambah"],
  form[id^="form-tambah"] button[type="submit"],
  form[id^="form-edit"] button[type="submit"]
) {
  --bs-btn-color: #fff;
  --bs-btn-bg: #198754;
  --bs-btn-border-color: #198754;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #157347;
  --bs-btn-hover-border-color: #146c43;
  --bs-btn-focus-shadow-rgb: 60, 153, 110;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #146c43;
  --bs-btn-active-border-color: #13653f;
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #198754;
  --bs-btn-disabled-border-color: #198754;
  color: var(--bs-btn-color);
  background-color: var(--bs-btn-bg);
  border-color: var(--bs-btn-border-color);
}
:is(.cbt-modern-page, .modal) :is(
  #btn-tambah,
  #btn-tambah-kelas,
  #tambah-simpan,
  #edit-simpan,
  #btn-simpan,
  #btn-edit-waktu-simpan,
  a[href*="/index/add"],
  a[href$="/tes_tambah"],
  form[id^="form-tambah"] button[type="submit"],
  form[id^="form-edit"] button[type="submit"]
):hover {
  color: var(--bs-btn-hover-color);
  background-color: var(--bs-btn-hover-bg);
  border-color: var(--bs-btn-hover-border-color);
}
:is(.cbt-modern-page, .modal) :is(#btn-edit-pilih, #btn-pilih-semua) {
  --bs-btn-color: #6c757d;
  --bs-btn-bg: transparent;
  --bs-btn-border-color: #6c757d;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #6c757d;
  --bs-btn-hover-border-color: #6c757d;
  --bs-btn-focus-shadow-rgb: 108, 117, 125;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #6c757d;
  --bs-btn-active-border-color: #6c757d;
  --bs-btn-disabled-color: #6c757d;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: #6c757d;
  color: var(--bs-btn-color);
  background-color: var(--bs-btn-bg);
  border-color: var(--bs-btn-border-color) !important;
}
:is(.cbt-modern-page, .modal) :is(#btn-edit-pilih, #btn-pilih-semua):hover {
  color: var(--bs-btn-hover-color);
  background-color: var(--bs-btn-hover-bg);
  border-color: var(--bs-btn-hover-border-color) !important;
}
.btn-flat { border-radius: 0; }
.close { box-sizing: content-box; width: 1em; height: 1em; padding: .25em; color: #000; background: transparent; border: 0; opacity: .5; font-size: 1.5rem; line-height: 1; }
.input-group-addon { display: flex; align-items: center; padding: .375rem .75rem; background: var(--bs-tertiary-bg); border: var(--bs-border-width) solid var(--bs-border-color); }
.input-group-addon:first-child { border-right: 0; border-radius: var(--bs-border-radius) 0 0 var(--bs-border-radius); }
.input-group-addon:last-child { border-left: 0; border-radius: 0 var(--bs-border-radius) var(--bs-border-radius) 0; }
.form-group { margin-bottom: 1rem; }
.help-block { display: block; margin-top: .25rem; color: var(--bs-secondary-color); }
.panel { margin-bottom: 1rem; background: var(--bs-body-bg); border: 1px solid var(--bs-border-color); border-radius: var(--bs-border-radius); }
.panel-heading { padding: .75rem 1rem; border-bottom: 1px solid var(--bs-border-color); font-weight: 600; }
.panel-body { padding: 1rem; }
.panel-footer { padding: .75rem 1rem; border-top: 1px solid var(--bs-border-color); background: var(--bs-tertiary-bg); }
.panel-primary > .panel-heading { color: #fff; background: var(--bs-primary); }
.panel-success > .panel-heading { color: #fff; background: var(--bs-success); }
.panel-info > .panel-heading { color: #000; background: var(--bs-info); }
.panel-warning > .panel-heading { color: #000; background: var(--bs-warning); }
.panel-danger > .panel-heading { color: #fff; background: var(--bs-danger); }
.well { min-height: 1.25rem; padding: 1rem; margin-bottom: 1rem; background: var(--bs-tertiary-bg); border: 1px solid var(--bs-border-color); border-radius: var(--bs-border-radius); }
.table-condensed > :not(caption) > * > * { padding: .25rem; }
.img-circle { border-radius: 50%; }
.text-center { text-align: center !important; }
.modal-header .close { margin-left: auto; order: 2; }
.modal-header .modal-title { order: 1; }
.user-image { width: 2rem; height: 2rem; object-fit: cover; border-radius: 50%; }
.dropdown-menu .user-header { padding: 1rem; text-align: center; }
.dropdown-menu .user-footer { display: flex; justify-content: space-between; gap: 1rem; padding: .75rem; border-top: 1px solid var(--bs-border-color); }

.cbt-modern-page .card {
  border: 0;
  box-shadow: 0 .125rem .35rem rgba(15, 23, 42, .08);
}
.cbt-modern-page .card-header,
.cbt-modern-page .card-footer { background: var(--bs-body-bg); }

/* AdminLTE clearfix pseudo-elements otherwise become extra flex/grid items. */
.card-header.d-flex::after,
.card-footer.d-flex::after,
.cbt-action-header::after,
.cbt-action-footer::after,
.cbt-mobile-actions::after { display: none !important; content: none !important; }
.cbt-action-header { display: flex; align-items: center; gap: .5rem; }
.cbt-action-header > .btn:first-child,
.cbt-action-header > :not(.btn) + .btn,
.cbt-action-header > .btn-group,
.cbt-action-header > .box-tools { margin-left: auto; }
@media (min-width: 768px) {
  .cbt-action-footer { display: flex; align-items: center; justify-content: flex-end !important; gap: .5rem; }
  .cbt-action-footer > .btn,
  .cbt-action-footer > .btn-group { margin-left: 0 !important; margin-right: 0 !important; float: none !important; }
}

@media (max-width: 767.98px) {
  .hidden-xs { display: none !important; }
  .content-wrapper { padding: .75rem; }
  .pull-right, .pull-left { float: none !important; }
  .table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .cbt-page-header { padding: 1rem .75rem .25rem; }
  .cbt-page-header .breadcrumb { align-self: flex-start; }
}

/* Modal konsisten untuk halaman modern dan halaman lama yang dimuat di template Bootstrap 5. */
.cbt-modal { overflow-x: hidden; overflow-y: auto; }
.cbt-modal .modal-dialog {
  display: flex;
  width: auto;
  height: calc(100dvh - 2rem);
  max-height: calc(100dvh - 2rem);
  margin-top: 1rem;
  margin-bottom: 1rem;
  align-items: center;
}
.cbt-modal .modal-content {
  display: flex;
  max-height: 100%;
  flex-direction: column;
  overflow: hidden;
  border: 0;
  border-radius: .75rem;
  box-shadow: 0 1rem 3rem rgba(17, 43, 30, .2);
}
.cbt-modal .modal-content > form,
.cbt-modal .modal-content > .modal-form {
  display: flex;
  width: 100%;
  min-height: 0;
  max-height: 100%;
  flex: 1 1 auto;
  flex-direction: column;
  overflow: hidden;
}
.cbt-modal .modal-content > form > .modal-header,
.cbt-modal .modal-content > form > .modal-footer,
.cbt-modal .modal-content > .modal-form > .modal-header,
.cbt-modal .modal-content > .modal-form > .modal-footer { flex: 0 0 auto; }
.cbt-modal .modal-content > form > .modal-body,
.cbt-modal .modal-content > .modal-form > .modal-body {
  min-height: 0;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}
.cbt-modal .modal-header {
  position: relative;
  display: flex;
  min-height: 3.75rem;
  flex: 0 0 auto;
  gap: .75rem;
  align-items: center;
  border-bottom-color: var(--bs-border-color);
}
.cbt-modal .modal-title {
  min-width: 0;
  margin: 0;
  padding-right: 2.5rem;
  overflow-wrap: anywhere;
  font-size: 1.1rem;
  font-weight: 650;
  line-height: 1.35;
}
.cbt-modal .modal-header .btn-close {
  position: absolute;
  top: 50%;
  right: 1rem;
  width: 1rem;
  height: 1rem;
  margin: 0;
  padding: .5rem;
  flex: 0 0 auto;
  transform: translateY(-50%);
}
.cbt-modal .modal-body {
  min-height: 0;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-gutter: stable;
}
.cbt-modal .modal-footer { flex: 0 0 auto; border-top-color: var(--bs-border-color); }
.cbt-modal .modal-footer > div { display: flex; flex-wrap: wrap; gap: .5rem; }
.cbt-modal .modal-footer > div .btn { margin: 0 !important; }
.cbt-modal .modal-body > :last-child { margin-bottom: 0; }
.cbt-modal .select2-container { width: 100% !important; }
.cbt-modal .table-responsive { max-height: min(55dvh, 34rem); }

@media (max-width: 575.98px) {
  .cbt-modal .modal-dialog { height: calc(100dvh - 1rem); max-height: calc(100dvh - 1rem); margin: .5rem; }
  .cbt-modal .modal-content { max-height: 100%; border-radius: .65rem; }
  .cbt-modal .modal-header, .cbt-modal .modal-body, .cbt-modal .modal-footer { padding: .875rem; }
  .cbt-modal .modal-title { padding-right: 2.25rem; }
  .cbt-modal .modal-header .btn-close { right: .875rem; }
  .cbt-modal .modal-footer,
  .cbt-modal .modal-footer > div { display: flex !important; width: 100%; flex-direction: column-reverse; align-items: stretch; }
  .cbt-modal .modal-footer .btn,
  .cbt-modal .modal-footer a.btn { width: 100%; margin: 0 !important; }
}
@media (min-width: 768px) and (max-width: 991.98px) { .hidden-sm { display: none !important; } }
@media (min-width: 992px) and (max-width: 1199.98px) { .hidden-md { display: none !important; } }
@media (min-width: 1200px) { .hidden-lg { display: none !important; } }

@media print {
  .no-print, .app-header, .app-sidebar { display: none !important; }
  .app-main, .content-wrapper { margin: 0 !important; padding: 0 !important; }
}

/* Responsive foundation shared by every participant and administrator page. */
html, body { max-width: 100%; overflow-x: hidden; }
img, video, canvas, svg { max-width: 100%; height: auto; }
audio { max-width: 100%; }
iframe { max-width: 100%; }
pre { max-width: 100%; overflow-wrap: anywhere; white-space: pre-wrap; }
.app-main, .cbt-main, .content-wrapper, .content, .container, .container-fluid,
.card, .card-body, .box, .box-body, .row > *, form { min-width: 0; }
.table-responsive { width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.table-responsive > table { min-width: 100%; margin-bottom: 0; }
.dataTables_wrapper, .dt-container { width: 100%; max-width: 100%; overflow: visible; }
.dataTables_wrapper .row > *, .dt-container .row > * { min-width: 0; }
.dataTables_filter input, .dataTables_length select, .dt-search input, .dt-length select { max-width: 100%; }
.select2-container, .jodit-container, .jodit-workplace { max-width: 100% !important; }
.jodit-wysiwyg { overflow-wrap: anywhere; }
.form-control, .form-select, .input-group, textarea, select { max-width: 100%; }
.btn-toolbar, .card-header, .card-footer, .box-header, .box-footer, .modal-footer { flex-wrap: wrap; }
.dropdown-menu { max-width: calc(100vw - 1rem); }
.toast-container { max-width: 100%; }
.min-w-0 { min-width: 0 !important; }
.cbt-dashboard-icon { display: inline-flex; flex: 0 0 3rem; width: 3rem; height: 3rem; align-items: center; justify-content: center; border-radius: .8rem; font-size: 1.35rem; }
.cbt-dashboard-guide { display: flex; padding: 1rem; gap: .85rem; align-items: center; color: var(--bs-body-color); border: 1px solid var(--bs-border-color); border-radius: .75rem; text-decoration: none; transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.cbt-dashboard-guide:hover { color: var(--bs-body-color); border-color: var(--bs-success); box-shadow: 0 .35rem 1rem rgba(25,135,84,.12); transform: translateY(-2px); }
.cbt-dashboard-guide-icon { display: inline-flex; flex: 0 0 2.65rem; width: 2.65rem; height: 2.65rem; align-items: center; justify-content: center; color: var(--bs-success-text-emphasis); background: var(--bs-success-bg-subtle); border-radius: .65rem; font-size: 1.1rem; }
.cbt-option-card { display: flex; height: 100%; min-height: 5rem; padding: 1rem; gap: .75rem; align-items: flex-start; border: 1px solid var(--bs-border-color); border-radius: .7rem; cursor: pointer; transition: border-color .15s ease, background-color .15s ease; }
.cbt-option-card:hover { border-color: var(--bs-success); background: var(--bs-success-bg-subtle); }
.cbt-option-card .form-check-input { flex: 0 0 auto; margin-top: .2rem; }

@media (max-width: 991.98px) {
  .content-wrapper, .content, .cbt-modern-page, .app-content { padding-left: .75rem; padding-right: .75rem; }
  .cbt-page-header, .content-header, .app-content-header { padding-left: .75rem; padding-right: .75rem; }
  .cbt-page-header > .container-fluid > .d-flex,
  .content-header > .container-fluid > .d-flex,
  .app-content-header > .container-fluid > .d-flex { align-items: stretch !important; }
  .cbt-page-header nav, .content-header nav, .app-content-header nav { max-width: 100%; overflow-x: auto; }
  .app-footer { padding-inline: .75rem; }
  .jodit-toolbar__box { overflow-x: auto; }
}

@media (min-width: 992px) {
  .app-wrapper { --lte-sidebar-width: 84px; }
  .cbt-fixed-navigation .app-wrapper { grid-template-columns: 84px minmax(0, 1fr); }
  .cbt-fixed-navigation .app-header { left: 84px; }
  .sidebar-expand-lg.layout-fixed .app-sidebar,
  .app-sidebar { position: fixed !important; top: 0 !important; left: 0 !important; bottom: 0 !important; width: 84px !important; min-width: 84px !important; max-width: 84px !important; max-height: 100vh !important; max-height: 100dvh !important; height: 100vh !important; height: 100dvh !important; align-self: start; display: flex; flex-direction: column; overflow: hidden !important; }
  .sidebar-expand-lg.layout-fixed .app-sidebar .sidebar-wrapper,
  .app-sidebar .sidebar-wrapper { flex: 1 1 auto; min-height: 0; height: auto; max-height: none; overflow-x: hidden !important; overflow-y: auto !important; overscroll-behavior-y: contain; scrollbar-width: thin; }
  .app-sidebar .sidebar-brand { flex: 0 0 76px; height: 76px; padding: .45rem; }
  .app-sidebar .sidebar-brand .brand-link { height: 100%; justify-content: center; gap: 0; }
  .app-sidebar .sidebar-brand .brand-mark { width: 3.3rem; height: 3.3rem; flex-basis: 3.3rem; font-size: 1.45rem; }
  .app-sidebar .sidebar-brand .brand-text,
  .app-sidebar .user-panel { display: none !important; }
  .app-sidebar nav { margin-top: .75rem !important; }
  .app-sidebar .sidebar-menu { padding-inline: .6rem; overflow: visible; }
  .app-sidebar .sidebar-menu > .nav-item { position: relative; margin-bottom: .25rem; }
  .app-sidebar .sidebar-menu > .nav-item > .nav-link { display: flex; width: 48px; min-height: 48px; margin-inline: auto; padding: 0; align-items: center; justify-content: center; border-radius: .45rem; }
  .app-sidebar .sidebar-menu > .nav-item > .nav-link .nav-icon { width: auto; margin: 0; font-size: 1.15rem; }
  .app-sidebar .sidebar-menu > .nav-item > .nav-link p,
  .app-sidebar .sidebar-menu > .nav-item > .nav-treeview { display: none !important; }
  .app-sidebar .sidebar-menu > .nav-item > .nav-link.active::before { position: absolute; left: -.6rem; width: 3px; height: 28px; border-radius: 0 4px 4px 0; background: #56c596; content: ''; }
  .app-sidebar .sidebar-menu > .nav-item > .nav-link:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
  body.sidebar-collapse .app-sidebar { margin-left: 0 !important; transform: none !important; }

  .cbt-sidebar-flyout { position: fixed; z-index: 1045; top: 12px; bottom: 12px; left: 94px; display: block; width: 296px; padding: 0; overflow: hidden auto; visibility: hidden; color: var(--bs-body-color); background: var(--bs-body-bg); border: 1px solid var(--bs-border-color); border-radius: .65rem; box-shadow: 0 1rem 2.5rem rgba(17, 43, 30, .2); opacity: 0; transform: translateX(-12px) scale(.985); transform-origin: left top; transition: opacity 220ms cubic-bezier(.2,.8,.3,1), transform 220ms cubic-bezier(.2,.8,.3,1), visibility 220ms; }
  .cbt-sidebar-flyout.is-open { visibility: visible; opacity: 1; transform: translateX(0) scale(1); }
  .cbt-sidebar-flyout__title { margin: 0; padding: 1.25rem 1.25rem .9rem; border-bottom: 1px solid var(--bs-border-color); font-size: 1.1rem; font-weight: 700; }
  .cbt-sidebar-flyout .nav-treeview { display: flex !important; flex-direction: column; gap: .25rem; padding: .75rem; }
  .cbt-sidebar-flyout .nav-item { width: 100%; }
  .cbt-sidebar-flyout .nav-link { display: flex; min-height: 44px; padding: .65rem .75rem; align-items: center; color: var(--bs-body-color); border-radius: .45rem; text-decoration: none; }
  .cbt-sidebar-flyout .nav-link:hover { color: var(--bs-success-text-emphasis); background: var(--bs-success-bg-subtle); }
  .cbt-sidebar-flyout .nav-link.active { color: #fff; background: var(--bs-success); }
  .cbt-sidebar-flyout .nav-icon { width: 1.5rem; margin-right: .6rem; text-align: center; }
  .cbt-sidebar-flyout .nav-link p { display: block; margin: 0; }
}

@media (max-width: 991.98px) {
  .cbt-sidebar-flyout { display: none !important; }
}

@media (max-width: 767.98px) {
  body { font-size: .9375rem; }
  .container, .container-fluid { --bs-gutter-x: 1.25rem; }
  .cbt-main { width: 100%; }
  .cbt-main > .container, .cbt-main > .container-fluid { padding-top: .75rem; padding-bottom: .75rem; }
  .cbt-main.py-4, .cbt-main .py-4 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
  .content-wrapper, .content, .cbt-modern-page, .app-content { padding: .625rem; }
  .cbt-page-header, .content-header, .app-content-header { padding: 1rem .625rem .35rem; }
  .cbt-page-header .container-fluid > .d-flex,
  .content-header .container-fluid > .d-flex {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: .5rem;
  }
  .cbt-page-header nav,
  .cbt-page-header .breadcrumb,
  .content-header nav,
  .content-header .breadcrumb { max-width: 100%; }
  .cbt-modern-page > .container-fluid > .card > .card-header,
  .cbt-modern-page form > .card > .card-header {
    flex-direction: column;
    align-items: flex-start !important;
  }
  .cbt-modern-page > .container-fluid > .card > .card-header .btn,
  .cbt-modern-page form > .card > .card-header .btn { width: 100%; }
  .cbt-modern-page form > .card > .card-footer,
  .cbt-modern-page .row > [class*="col-"] > .card > .card-footer {
    flex-direction: column-reverse;
    align-items: stretch;
  }
  .cbt-modern-page form > .card > .card-footer > *,
  .cbt-modern-page .row > [class*="col-"] > .card > .card-footer > * { width: 100%; }
  .cbt-modern-page form > .card > .card-footer .btn,
  .cbt-modern-page .row > [class*="col-"] > .card > .card-footer .btn { width: 100%; margin: .2rem 0 !important; }
  .cbt-page-header h1, .content-header h1, .app-content-header h1, h1.h3 { font-size: 1.35rem; }
  h2.h5, .card-title, .box-title { font-size: 1rem; }
  .card-body, .box-body { padding: .875rem; }
  .card-header, .card-footer, .box-header, .box-footer { padding: .75rem .875rem; gap: .5rem; }
  .card-header > .d-flex, .card-footer > .d-flex, .box-header > .d-flex, .box-footer > .d-flex { width: 100%; flex-wrap: wrap; }
  .cbt-mobile-actions, .modal-footer { display: grid !important; grid-template-columns: 1fr; width: 100%; }
  .cbt-mobile-actions > .btn, .cbt-mobile-actions > a.btn, .modal-footer > .btn { width: 100%; }
  .btn-group.cbt-mobile-actions { display: flex !important; flex-direction: column; }
  .btn-group.cbt-mobile-actions > .btn { border-radius: var(--bs-border-radius) !important; margin: 0; }
  .form-horizontal .form-group { margin-inline: 0; }
  .form-horizontal .control-label { text-align: left; margin-bottom: .35rem; }
  .input-group { flex-wrap: nowrap; }
  .input-group > .form-control, .input-group > .form-select { min-width: 0; }
  .modal { padding: 0 !important; }
  .modal-dialog { width: auto; max-width: none; margin: .5rem; }
  .modal-dialog-scrollable { height: calc(100% - 1rem); }
  .modal-content { max-height: calc(100dvh - 1rem); }
  .modal-body { overflow-y: auto; }
  .toast-container { left: 0 !important; right: 0 !important; padding: .5rem !important; }
  .toast-container .toast { width: 100%; }
  .dropdown-menu-end { right: 0; left: auto; }
  .pagination { flex-wrap: wrap; row-gap: .25rem; }
  .dataTables_wrapper .row, .dt-container .row { row-gap: .5rem; }
  .dataTables_length, .dataTables_filter, .dataTables_info, .dataTables_paginate,
  .dt-length, .dt-search, .dt-info, .dt-paging { width: 100%; text-align: left !important; }
  .dataTables_filter label, .dt-search { display: flex; align-items: center; gap: .5rem; }
  .dataTables_filter input, .dt-search input { flex: 1 1 auto; width: 1% !important; margin-left: 0 !important; }
  table.dataTable > tbody > tr.child ul.dtr-details { display: block; width: 100%; }
  table.dataTable > tbody > tr.child ul.dtr-details > li { display: grid; grid-template-columns: minmax(7rem, 35%) 1fr; gap: .5rem; overflow-wrap: anywhere; }
  table.dataTable > tbody > tr.child .dtr-data { min-width: 0; }
  table.dataTable .btn { white-space: normal; }
  .jodit-container { min-height: 16rem !important; }
  .jodit-workplace { min-height: 12rem !important; }
  .jodit-toolbar-button__text { display: none; }
  [style*="width:"] { max-width: 100% !important; }
  .app-footer .float-end { float: none !important; display: block; margin-bottom: .35rem; }
}

@media (max-width: 575.98px) {
  .cbt-navbar .container, .cbt-header .container { gap: .5rem; }
  .cbt-brand, .navbar-brand { max-width: calc(100vw - 7rem); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .cbt-header .dropdown-toggle span { display: none; }
  .cbt-header .dropdown-toggle { padding-inline: .35rem; }
  .cbt-header .user-image { width: 1.75rem; height: 1.75rem; }
  .breadcrumb { flex-wrap: nowrap; width: max-content; min-width: 100%; }
  .modal-header, .modal-body, .modal-footer { padding: .75rem; }
  .table-responsive > table:not(.dataTable) { min-width: 36rem; }
  .table-responsive > table.table-sm:not(.dataTable) { min-width: 30rem; }
}

@media print {
  .cbt-fixed-navigation .app-wrapper { grid-template-columns: 0 minmax(0, 1fr); grid-template-rows: 0 1fr min-content; }
}
/* Matriks pernyataan Benar/Salah dan label kustom (Sesuai/Tidak Sesuai). */
.cbt-boolean-matrix table{min-width:34rem}.cbt-boolean-matrix .cbt-boolean-choice{width:8rem}.cbt-boolean-matrix .form-check-input{width:1.25rem;height:1.25rem;cursor:pointer}.cbt-boolean-statement>p:last-child{margin-bottom:0}
@media (max-width:575.98px){.cbt-boolean-matrix.table-responsive{width:100%;max-width:100%;overflow:visible}.cbt-boolean-matrix table,.cbt-boolean-matrix thead,.cbt-boolean-matrix tbody{display:block;min-width:0!important;width:100%!important;max-width:100%}.cbt-boolean-matrix table{table-layout:fixed;margin-bottom:0;border:1px solid var(--bs-border-color)!important;border-radius:0;border-collapse:separate;border-spacing:0;overflow:hidden;box-shadow:none}.cbt-boolean-matrix tr{display:grid;grid-template-columns:minmax(0,1fr) repeat(2,minmax(3.25rem,.34fr));width:100%;min-width:0;border:0;border-bottom:1px solid var(--bs-border-color);border-radius:0;margin:0;background:var(--bs-body-bg)}.cbt-boolean-matrix tbody tr:last-child{border-bottom:0}.cbt-boolean-matrix thead tr{background:var(--bs-tertiary-bg)}.cbt-boolean-matrix th,.cbt-boolean-matrix td{display:flex;min-width:0!important;width:auto!important;max-width:100%;align-items:center;border:0!important;white-space:normal!important}.cbt-boolean-matrix th{padding:.65rem .35rem;font-size:.78rem;font-weight:700;line-height:1.2;justify-content:center;overflow-wrap:anywhere}.cbt-boolean-matrix th:first-child{padding-left:.75rem;justify-content:flex-start}.cbt-boolean-matrix th+th,.cbt-boolean-matrix td+td{border-left:1px solid var(--bs-border-color)!important}.cbt-boolean-matrix .cbt-boolean-statement{padding:.75rem;align-items:flex-start;line-height:1.45;overflow-wrap:anywhere;word-break:break-word}.cbt-boolean-matrix .cbt-boolean-statement *{max-width:100%!important;white-space:normal!important;overflow-wrap:anywhere}.cbt-boolean-matrix .cbt-boolean-statement img,.cbt-boolean-matrix .cbt-boolean-statement video{height:auto!important}.cbt-boolean-matrix td.text-center{padding:.75rem .25rem;justify-content:center;overflow:hidden}.cbt-boolean-matrix td.text-center:before{display:none}.cbt-boolean-matrix .form-check-input{flex:0 0 auto;margin:0}}