/* DIPA Learning Custom Styles */

/* Highlight tab yang ada error */
.nav-link.tab-error {
    color: #dc3545 !important;
    border-bottom: 2px solid #dc3545;
}

/* Box pesan error */
#errorBox {
    display: none;
    margin-bottom: 15px;
}

/* Fix DataTable wrapper layout */
.dataTables_wrapper .dataTables_paginate {
    float: right;
    clear: both;
    margin-top: 10px;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 6px 10px !important;
    white-space: nowrap !important;
    line-height: 1.4 !important;
}
/* Pastikan info dan paginate sejajar */
.dataTables_wrapper .row:last-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* ==========================================================================
   FIX CARD CONTAINER HEIGHT & OVERFLOW
   Mencegah card terpotong / runtuh / tabel offside keluar dari card
   akibat aturan bawaan tema Zenix: height: calc(100% - 30px)
   ========================================================================== */
.card {
    height: auto !important;
}
.card.h-100 {
    height: 100% !important;
}
.card-feed {
    height: auto !important;
    border-radius: 14px !important;
    overflow: hidden;
    background-color: #ffffff !important;
}
.card-feed .card-body {
    padding: 0 !important;
    overflow: hidden;
}
.card-feed .table-responsive {
    width: 100%;
    margin-bottom: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.card-feed .table {
    margin-bottom: 0;
    width: 100%;
}
.card-feed .table th,
.card-feed .table td {
    vertical-align: middle;
}

/* ==========================================================================
   FONT AWESOME & ICON GLYPH RENDERING INTEGRITY
   Memastikan semua ikon font awesome (.fa, .fas, .far, .fab) selalu ter-render 
   sempurna dengan font glyph yang benar dan tidak fallback ke karakter kotak silang (☒)
   ========================================================================== */
.fa, .fas, .fa-solid {
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome" !important;
    font-weight: 900 !important;
    font-style: normal !important;
    display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}
.far, .fa-regular {
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome" !important;
    font-weight: 400 !important;
    font-style: normal !important;
    display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}
.fab, .fa-brands {
    font-family: "Font Awesome 6 Brands", "Font Awesome 5 Brands", "FontAwesome" !important;
    font-weight: 400 !important;
    font-style: normal !important;
    display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}

/* ==========================================================================
   FAILSAFE SVG MASK FOR CAMERA & SEARCH ICONS (ANTI-TOFU / ANTI-BOX [☒])
   Memastikan ikon camera dan search selalu tampil sempurna sebagai vektor tajam
   tanpa pernah menampilkan karakter kotak silang [☒] di kondisi browser apapun
   ========================================================================== */
i.fas.fa-camera, i.fa.fa-camera {
    font-style: normal !important;
    display: inline-block !important;
    line-height: 1 !important;
}
i.fas.fa-camera::before, i.fa.fa-camera::before {
    content: "" !important;
    display: inline-block !important;
    width: 1em !important;
    height: 1em !important;
    vertical-align: -0.125em !important;
    background-color: currentColor !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M149.1 64l-20.3 32L64 96C28.7 96 0 124.7 0 160L0 416c0 35.3 28.7 64 64 64l384 0c35.3 0 64-28.7 64-64l0-256c0-35.3-28.7-64-64-64l-64.8 0-20.3-32L149.1 64zM256 192a96 96 0 1 1 0 192 96 96 0 1 1 0-192zm0 48a48 48 0 1 0 0 96 48 48 0 1 0 0-96z'/%3E%3C/svg%3E") no-repeat center / contain !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M149.1 64l-20.3 32L64 96C28.7 96 0 124.7 0 160L0 416c0 35.3 28.7 64 64 64l384 0c35.3 0 64-28.7 64-64l0-256c0-35.3-28.7-64-64-64l-64.8 0-20.3-32L149.1 64zM256 192a96 96 0 1 1 0 192 96 96 0 1 1 0-192zm0 48a48 48 0 1 0 0 96 48 48 0 1 0 0-96z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}

i.fas.fa-search, i.fa.fa-search {
    font-style: normal !important;
    display: inline-block !important;
    line-height: 1 !important;
}
i.fas.fa-search::before, i.fa.fa-search::before {
    content: "" !important;
    display: inline-block !important;
    width: 1em !important;
    height: 1em !important;
    vertical-align: -0.125em !important;
    background-color: currentColor !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0s208 93.1 208 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E") no-repeat center / contain !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0s208 93.1 208 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E") no-repeat center / contain !important;
}

/* ==========================================================================
   DATATABLE SEARCH INPUT WITH MAGNIFYING GLASS ICON (MIDNIGHT NAVY #0E2A47)
   ========================================================================== */
.dataTables_filter {
    position: relative;
    display: inline-flex;
    align-items: center;
    margin-bottom: 12px;
}
.dataTables_filter label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-bottom: 0 !important;
    font-weight: 700 !important;
    color: #0E2A47 !important;
    font-size: 13px !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
}
.dataTables_filter input[type="search"],
.dataTables_filter input[type="text"],
.dataTables_filter input {
    height: 38px !important;
    padding-left: 36px !important;
    padding-right: 12px !important;
    border-radius: 20px !important;
    border: 1.5px solid #CBD5E1 !important;
    background-color: #FFFFFF !important;
    color: #0F172A !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='%230E2A47'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0s208 93.1 208 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 15px 15px !important;
    transition: all 0.2s ease-in-out !important;
    box-shadow: 0 1px 2px rgba(14, 42, 71, 0.05) !important;
}
.dataTables_filter input[type="search"]:focus,
.dataTables_filter input[type="text"]:focus,
.dataTables_filter input:focus {
    border-color: #0E2A47 !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(14, 42, 71, 0.18) !important;
}

/* ==========================================================================
   GLOBAL HIGH-CONTRAST TYPOGRAPHY & SOLID NON-PASTEL SURFACES
   Primary: #0E2A47 | Secondary: #E58A00 | Tertiary: #E05338 | Neutral: #FAF9F5
   Fonts: Headlines: Epilogue | Body & Controls: Plus Jakarta Sans
   ========================================================================== */
body, #main-wrapper {
    background-color: #FAF9F5 !important;
    color: #0F172A !important;
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

h1, h2, h3, h4, h5, h6,
.card-title, .modal-title, .dashboard_bar {
    font-family: 'Epilogue', sans-serif !important;
    color: #0E2A47 !important;
    font-weight: 700 !important;
}

p:not(.kpi-subtitle):not([class*="kpi-"]):not(.text-white):not([class*="text-white"]),
span:not([class*="fa-"]):not([class*="flaticon-"]):not([class*="bi-"]):not([class*="la-"]):not([class*="kpi-"]):not(.kpi-title):not(.kpi-subtitle):not(.kpi-number):not(.branch-name):not([class*="branch-"]):not(.badge):not([class*="badge"]):not(.text-white):not([class*="text-white"]):not(.badge-branch-code):not(.fc-icon):not([class*="fc-icon"]):not([class*="fc-"]),
td:not(.text-white), th:not(.text-white), label, .form-label, .form-text,
.text-muted:not(i):not(svg):not([class*="fa-"]):not([class*="flaticon-"]):not([class*="kpi-"]):not(.kpi-subtitle):not(.branch-name),
.text-secondary:not(i):not(svg):not([class*="fa-"]):not([class*="flaticon-"]):not([class*="kpi-"]):not(.branch-name),
.text-gray:not(i):not(svg):not([class*="fa-"]):not([class*="flaticon-"]):not([class*="kpi-"]):not(.branch-name),
.text-grey:not(i):not(svg):not([class*="fa-"]):not([class*="flaticon-"]):not([class*="kpi-"]):not(.branch-name),
[class*="text-slate-"]:not(i):not(svg):not([class*="fa-"]):not([class*="flaticon-"]):not([class*="kpi-"]):not(.branch-name),
small:not(.kpi-subtitle):not([class*="kpi-"]):not(.text-white):not([class*="text-white"]), .small:not(.kpi-subtitle):not([class*="kpi-"]):not(.text-white):not([class*="text-white"]), .breadcrumb-item, .breadcrumb-item.active, .breadcrumb-item a,
.dataTables_info, .dataTables_length, .dataTables_filter label {
    color: #0F172A !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
}

/* Global High-Priority White Text Protection */
.text-white,
span.text-white,
a.text-white,
div.text-white,
p.text-white,
small.text-white,
i.text-white,
strong.text-white,
b.text-white,
h1.text-white, h2.text-white, h3.text-white, h4.text-white, h5.text-white, h6.text-white,
.badge.text-white,
span.badge.text-white,
[class*="text-white"] {
    color: #FFFFFF !important;
}

.text-muted, small.text-muted, span.text-muted, div.text-muted {
    color: #334155 !important;
    font-weight: 500 !important;
}
.text-dark {
    color: #0E2A47 !important;
}
label, .form-label {
    color: #0E2A47 !important;
    font-weight: 600 !important;
}

/* DataTables & Table Styling */
table.dataTable thead th,
.table thead th {
    color: #0E2A47 !important;
    font-weight: 700 !important;
    background-color: #F8FAFC !important;
    border-bottom: 2px solid #E2E8F0 !important;
}
table.dataTable tbody td,
.table td {
    color: #0F172A !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
}
table.dataTable tbody tr:hover, .table tbody tr:hover {
    background-color: #F8FAFC !important;
}

/* ==========================================================================
   BUTTON SYSTEM: SOLID HIGH-CONTRAST (ANTI-PASTEL)
   ========================================================================== */
.btn-primary, .btn.bg-primary {
    background-color: #0E2A47 !important;
    border-color: #0E2A47 !important;
    color: #FFFFFF !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 5px rgba(14, 42, 71, 0.25) !important;
    transition: all 0.2s ease-in-out !important;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background-color: #081B2E !important;
    border-color: #081B2E !important;
    color: #FFFFFF !important;
    box-shadow: 0 4px 10px rgba(14, 42, 71, 0.35) !important;
}

.btn-secondary, .btn.bg-secondary {
    background-color: #E58A00 !important;
    border-color: #E58A00 !important;
    color: #FFFFFF !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 5px rgba(229, 138, 0, 0.25) !important;
}
.btn-secondary:hover, .btn-secondary:focus {
    background-color: #C77700 !important;
    border-color: #C77700 !important;
    color: #FFFFFF !important;
}

.btn-danger, .btn.bg-danger {
    background-color: #E05338 !important;
    border-color: #E05338 !important;
    color: #FFFFFF !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 5px rgba(224, 83, 56, 0.25) !important;
}
.btn-danger:hover, .btn-danger:focus {
    background-color: #C9432A !important;
    border-color: #C9432A !important;
    color: #FFFFFF !important;
}

.btn-success, .btn.bg-success {
    background-color: #15803d !important;
    border-color: #15803d !important;
    color: #FFFFFF !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
}
.btn-success:hover {
    background-color: #166534 !important;
    border-color: #166534 !important;
    color: #FFFFFF !important;
}

.btn-info, .btn.bg-info {
    background-color: #0E2A47 !important;
    border-color: #0E2A47 !important;
    color: #FFFFFF !important;
    font-weight: 600 !important;
}

.btn-outline-primary {
    color: #0E2A47 !important;
    border: 1.5px solid #0E2A47 !important;
    background-color: transparent !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
}
.btn-outline-primary:hover {
    background-color: #0E2A47 !important;
    color: #FFFFFF !important;
}

.btn-outline-secondary {
    color: #0E2A47 !important;
    border: 1.5px solid #94A3B8 !important;
    background-color: #FAF9F5 !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
}
.btn-outline-secondary:hover {
    background-color: #0E2A47 !important;
    border-color: #0E2A47 !important;
    color: #FFFFFF !important;
}

.btn-outline-danger {
    color: #E05338 !important;
    border: 1.5px solid #E05338 !important;
    background-color: transparent !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
}
.btn-outline-danger:hover {
    background-color: #E05338 !important;
    color: #FFFFFF !important;
}

/* Action Icon Buttons */
.btn-xs.sharp.btn-primary, button[title="Edit"].btn-primary {
    background-color: #0E2A47 !important;
    border-color: #0E2A47 !important;
    color: #FFFFFF !important;
}
.btn-xs.sharp.btn-danger, button[title="Hapus"].btn-danger {
    background-color: #E05338 !important;
    border-color: #E05338 !important;
    color: #FFFFFF !important;
}
.btn-xs.sharp.btn-warning, .btn-xs.sharp.btn-secondary {
    background-color: #E58A00 !important;
    border-color: #E58A00 !important;
    color: #FFFFFF !important;
}

/* ==========================================================================
   BADGE SYSTEM: SOLID & HIGH-CONTRAST (ZERO PASTEL MISTAKES)
   ========================================================================== */
.badge {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: 0.3px;
    padding: 5px 9px;
    border-radius: 6px;
}
.badge-success, .badge.bg-success, span.badge.bg-success, span.badge-success {
    background-color: #15803d !important;
    color: #FFFFFF !important;
}
.badge-primary, .badge.bg-primary, span.badge.bg-primary, span.badge-primary {
    background-color: #0E2A47 !important;
    color: #FFFFFF !important;
}
.badge-secondary, .badge.bg-secondary, span.badge.bg-secondary, span.badge-secondary {
    background-color: #E58A00 !important;
    color: #FFFFFF !important;
}
.badge-warning, .badge.bg-warning, span.badge.bg-warning, span.badge-warning {
    background-color: #E58A00 !important;
    color: #FFFFFF !important;
}
.badge-danger, .badge.bg-danger, span.badge.bg-danger, span.badge-danger {
    background-color: #E05338 !important;
    color: #FFFFFF !important;
}
.badge-info, .badge.bg-info, span.badge.bg-info, span.badge-info {
    background-color: #0E2A47 !important;
    color: #FFFFFF !important;
}

/* Force solid badges and their child elements to crisp white text */
.badge:not(.light):not([class*="badge-outline-"]):not(.bg-light):not(.badge-light):not(.bg-white),
span.badge:not(.light):not([class*="badge-outline-"]):not(.bg-light):not(.badge-light):not(.bg-white) {
    color: #FFFFFF !important;
}
.badge:not(.light):not([class*="badge-outline-"]):not(.bg-light):not(.badge-light):not(.bg-white) *,
span.badge:not(.light):not([class*="badge-outline-"]):not(.bg-light):not(.badge-light):not(.bg-white) * {
    color: #FFFFFF !important;
}

/* Light / Outlined Badges with High Contrast Borders & Dark Text */
.badge-outline-primary, .badge-primary.light, .badge.light.badge-primary {
    background-color: #EEF4FA !important;
    color: #0E2A47 !important;
    border: 1.5px solid #0E2A47 !important;
}
.badge-outline-secondary, .badge-secondary.light, .badge.light.badge-secondary,
.badge-warning.light, .badge.light.badge-warning {
    background-color: #FFF7ED !important;
    color: #9A3412 !important;
    border: 1.5px solid #E58A00 !important;
}
.badge-outline-danger, .badge-danger.light, .badge.light.badge-danger {
    background-color: #FEF2F2 !important;
    color: #991B1B !important;
    border: 1.5px solid #E05338 !important;
}
.badge-outline-success, .badge-success.light, .badge.light.badge-success {
    background-color: #ECFDF5 !important;
    color: #166534 !important;
    border: 1.5px solid #15803d !important;
}
.badge-outline-info, .badge-info.light, .badge.light.badge-info {
    background-color: #EEF4FA !important;
    color: #0E2A47 !important;
    border: 1.5px solid #0E2A47 !important;
}
.badge-light, .badge.bg-light {
    background-color: #F1F5F9 !important;
    color: #0E2A47 !important;
    border: 1px solid #CBD5E1 !important;
}

/* ==========================================================================
   SIDEBAR MENU: MIDNIGHT NAVY & CRISP ACCENTS
   ========================================================================== */
.dlabnav {
    background-color: #FFFFFF !important;
    border-right: 1px solid #E2E8F0 !important;
}
.dlabnav,
.dlabnav *,
.dlabnav .metismenu a,
.dlabnav .metismenu > li > a,
.dlabnav .metismenu ul a,
.dlabnav .metismenu .nav-text,
.dlabnav .metismenu i,
.dlabnav .metismenu svg,
.dlabnav .header-profile,
.dlabnav .header-profile *,
.dlabnav .header-profile .header-info span,
.dlabnav .header-profile .header-info b,
.dlabnav .copyright,
.dlabnav .copyright * {
    color: #0E2A47 !important;
    -webkit-text-fill-color: #0E2A47 !important;
    opacity: 1 !important;
}

.dlabnav .metismenu > li > a {
    color: #0E2A47 !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    border-radius: 8px;
}

.dlabnav .metismenu ul a {
    color: #1E293B !important;
    -webkit-text-fill-color: #1E293B !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    border-radius: 6px;
}

.dlabnav .metismenu .has-arrow:after {
    border-color: #0E2A47 transparent transparent #0E2A47 !important;
    opacity: 1 !important;
}

.dlabnav .metismenu > li.mm-active > a,
.dlabnav .metismenu > li > a:hover,
.dlabnav .metismenu ul a:hover,
.dlabnav .metismenu ul a.mm-active,
.dlabnav .metismenu ul li.mm-active > a {
    color: #0E2A47 !important;
    -webkit-text-fill-color: #0E2A47 !important;
    font-weight: 700 !important;
    background-color: #EEF4FA !important;
}
.dlabnav .metismenu > li.mm-active > a {
    border-left: 4px solid #0E2A47 !important;
}
.dlabnav .metismenu ul li.mm-active > a {
    border-left: 3px solid #0E2A47 !important;
    background-color: #EEF4FA !important;
}
.dlabnav .metismenu > li.mm-active > a i,
.dlabnav .metismenu > li > a:hover i {
    color: #0E2A47 !important;
}
.dlabnav .metismenu > li.mm-active > .has-arrow:after {
    border-color: #0E2A47 transparent transparent #0E2A47 !important;
}

/* ==========================================================================
   STANDARDIZED FILTER TOOLBAR HEIGHT & QUICK FILTER (ISS-UI-28)
   Memastikan tinggi input rentang tanggal, dropdown select, dan tombol sejajar (38px)
   ========================================================================== */
#filterForm .form-select,
#filterForm .form-select-sm,
#filterForm .input-group,
#filterForm .input-group-sm,
#filterForm .input-group .form-control,
#filterForm .input-group-sm .form-control,
#filterForm .input-group-text,
#filterForm .btn-sm,
#auditFilterForm .form-select,
#auditFilterForm .form-select-sm,
#auditFilterForm .input-group,
#auditFilterForm .input-group-sm,
#auditFilterForm .input-group .form-control,
#auditFilterForm .input-group-sm .form-control,
#auditFilterForm .input-group-text,
#auditFilterForm .btn-sm {
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    line-height: 1.5 !important;
    box-sizing: border-box !important;
}

#filterForm input[type="date"],
#auditFilterForm input[type="date"] {
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
    padding-left: 0.45rem !important;
    padding-right: 0.25rem !important;
    font-size: 0.8rem !important;
    line-height: normal !important;
    box-sizing: border-box !important;
}

#filterForm .input-group-text,
#auditFilterForm .input-group-text {
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
    background-color: #f1f5f9 !important;
    color: #475569 !important;
    font-weight: 600;
    font-size: 0.75rem !important;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box !important;
}

#filterForm .form-select-sm,
#auditFilterForm .form-select-sm {
    font-size: 0.825rem !important;
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
    padding-left: 0.65rem !important;
    padding-right: 1.75rem !important;
}

/* ==========================================================================
   ALIGNMENT CHECKBOX BULK DELETE (SELECT ALL & ROWS)
   Menjaga keselarasan posisi horizontal antara checkbox select all (th)
   dan checkbox baris data (td) agar 100% presisi dan rata
   ========================================================================== */
table.dataTable thead th.col-bulk-check,
table.dataTable tbody td.col-bulk-check,
table.dataTable tbody td[data-label="Pilih"],
table thead th.col-bulk-check,
table tbody td.col-bulk-check,
table tbody td[data-label="Pilih"],
th.col-bulk-check,
td.col-bulk-check {
    width: 45px !important;
    min-width: 45px !important;
    max-width: 45px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: center !important;
    vertical-align: middle !important;
}

table.dataTable thead th.col-bulk-check .form-check,
table.dataTable tbody td.col-bulk-check .form-check,
table.dataTable tbody td[data-label="Pilih"] .form-check,
table thead th.col-bulk-check .form-check,
table tbody td.col-bulk-check .form-check,
table tbody td[data-label="Pilih"] .form-check,
th.col-bulk-check .form-check,
td.col-bulk-check .form-check {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto !important;
    padding: 0 !important;
    min-height: auto !important;
    width: 20px !important;
    height: 20px !important;
}

table.dataTable thead th.col-bulk-check .form-check input,
table.dataTable tbody td.col-bulk-check .form-check input,
table.dataTable tbody td[data-label="Pilih"] .form-check input,
table thead th.col-bulk-check .form-check input,
table tbody td.col-bulk-check .form-check input,
table tbody td[data-label="Pilih"] .form-check input,
th.col-bulk-check .form-check input,
td.col-bulk-check .form-check input {
    float: none !important;
    margin: 0 !important;
    position: static !important;
}

/* ==========================================================================
   STANDARD KPI LINK CARD & WCAG AAA HIGH-CONTRAST THEMES
   Standard design modeled after /manajemen-kuota/
   ========================================================================== */
.kpi-link-card {
    transition: all 0.25s ease-in-out !important;
    cursor: pointer;
    border-radius: 14px !important;
    text-decoration: none !important;
    display: block !important;
    border: 2px solid transparent !important;
    position: relative !important;
    overflow: hidden !important;
}
.kpi-link-card:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25) !important;
    filter: brightness(1.06) !important;
}
.kpi-link-card.active-filter {
    border-color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.9), 0 12px 24px rgba(0, 0, 0, 0.25) !important;
    transform: translateY(-3px) !important;
}

/* WCAG AAA High Contrast Dark Gradient Themes ("Background agak gelap, tulisan putih") */
.kpi-theme-total, .kpi-link-card.kpi-theme-total {
    background: linear-gradient(135deg, #051322 0%, #0B2238 100%) !important;
    color: #ffffff !important;
    border: 2px solid #030C16 !important;
}
.kpi-theme-total:hover, .kpi-link-card.kpi-theme-total:hover {
    background: linear-gradient(135deg, #030C16 0%, #051322 100%) !important;
}

.kpi-theme-healthy, .kpi-theme-success, .kpi-link-card.kpi-theme-healthy, .kpi-link-card.kpi-theme-success {
    background: linear-gradient(135deg, #053D27 0%, #065F38 100%) !important;
    color: #ffffff !important;
    border: 2px solid #032B1B !important;
}
.kpi-theme-healthy:hover, .kpi-theme-success:hover, .kpi-link-card.kpi-theme-healthy:hover, .kpi-link-card.kpi-theme-success:hover {
    background: linear-gradient(135deg, #032B1B 0%, #053D27 100%) !important;
}

.kpi-theme-warning, .kpi-link-card.kpi-theme-warning {
    background: linear-gradient(135deg, #78350F 0%, #9A3412 100%) !important;
    color: #ffffff !important;
    border: 2px solid #552206 !important;
}
.kpi-theme-warning:hover, .kpi-link-card.kpi-theme-warning:hover {
    background: linear-gradient(135deg, #552206 0%, #78350F 100%) !important;
}

.kpi-theme-empty, .kpi-theme-danger, .kpi-link-card.kpi-theme-empty, .kpi-link-card.kpi-theme-danger {
    background: linear-gradient(135deg, #6B1111 0%, #881C1C 100%) !important;
    color: #ffffff !important;
    border: 2px solid #4C0909 !important;
}
.kpi-theme-empty:hover, .kpi-theme-danger:hover, .kpi-link-card.kpi-theme-empty:hover, .kpi-link-card.kpi-theme-danger:hover {
    background: linear-gradient(135deg, #4C0909 0%, #6B1111 100%) !important;
}

.kpi-theme-info, .kpi-theme-primary, .kpi-link-card.kpi-theme-info, .kpi-link-card.kpi-theme-primary {
    background: linear-gradient(135deg, #0C2340 0%, #173870 100%) !important;
    color: #ffffff !important;
    border: 2px solid #08172B !important;
}
.kpi-theme-info:hover, .kpi-theme-primary:hover, .kpi-link-card.kpi-theme-info:hover, .kpi-link-card.kpi-theme-primary:hover {
    background: linear-gradient(135deg, #08172B 0%, #0C2340 100%) !important;
}

.kpi-theme-slate, .kpi-theme-secondary, .kpi-theme-dark, .kpi-link-card.kpi-theme-slate, .kpi-link-card.kpi-theme-secondary, .kpi-link-card.kpi-theme-dark {
    background: linear-gradient(135deg, #0B111E 0%, #182234 100%) !important;
    color: #ffffff !important;
    border: 2px solid #070B14 !important;
}
.kpi-theme-slate:hover, .kpi-theme-secondary:hover, .kpi-link-card.kpi-theme-slate:hover, .kpi-link-card.kpi-theme-secondary:hover {
    background: linear-gradient(135deg, #070B14 0%, #0B111E 100%) !important;
}

.kpi-theme-purple, .kpi-link-card.kpi-theme-purple {
    background: linear-gradient(135deg, #2E0854 0%, #431475 100%) !important;
    color: #ffffff !important;
    border: 2px solid #1E0438 !important;
}
.kpi-theme-purple:hover, .kpi-link-card.kpi-theme-purple:hover {
    background: linear-gradient(135deg, #1E0438 0%, #2E0854 100%) !important;
}

/* Absolute High-Contrast Pure White Typography for All KPI Cards */
.kpi-link-card,
.card[class*="kpi-theme-"],
[class*="kpi-theme-"] {
    color: #ffffff !important;
}

.kpi-link-card .kpi-title,
.card[class*="kpi-theme-"] .kpi-title,
[class*="kpi-theme-"] .kpi-title,
.kpi-title,
span.kpi-title,
div.kpi-title,
.kpi-title * {
    color: #ffffff !important;
    font-family: 'Epilogue', sans-serif !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.75) !important;
}

.kpi-link-card .kpi-number,
.card[class*="kpi-theme-"] .kpi-number,
[class*="kpi-theme-"] .kpi-number,
.kpi-number,
h3.kpi-number,
span.kpi-number,
.kpi-number * {
    color: #ffffff !important;
    font-family: 'Epilogue', sans-serif !important;
    font-size: 28px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.75) !important;
}

.kpi-link-card .kpi-subtitle,
.card[class*="kpi-theme-"] .kpi-subtitle,
[class*="kpi-theme-"] .kpi-subtitle,
.kpi-subtitle,
p.kpi-subtitle,
span.kpi-subtitle,
.kpi-subtitle * {
    color: #f1f5f9 !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.65) !important;
}

.kpi-watermark-icon,
.kpi-watermark-icon * {
    color: #ffffff !important;
    opacity: 0.22 !important;
    font-size: 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* White Pill Badge */
.kpi-badge-pill {
    display: inline-flex !important;
    align-items: center !important;
    background: #ffffff !important;
    color: #0f172a !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    padding: 5px 12px !important;
    border-radius: 20px !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}
.kpi-link-card:hover .kpi-badge-pill,
.kpi-badge-pill:hover {
    background: #f8fafc !important;
    color: #000000 !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3) !important;
}

/* ==========================================================================
   ABSOLUTE ICON FONT INTEGRITY GUARANTEE (ANTI-BOX / ANTI-GLYPH-OVERRIDE)
   Memastikan seluruh jenis font ikon (Font Awesome, Flaticon, Bootstrap Icons,
   Line Awesome) SELALU mempertahankan font-family aslinya dan tidak pernah
   ter-override oleh font teks (Plus Jakarta Sans / Epilogue) apapun kelasnya.
   ========================================================================== */
i[class*="fa-"], span[class*="fa-"], [class^="fa-"], [class*=" fa-"],
.fa, .fas, .far, .fab, .fa-solid, .fa-regular, .fa-brands,
i.fa, i.fas, i.far, i.fab, i.fa-solid, i.fa-regular, i.fa-brands {
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome" !important;
    font-style: normal !important;
    font-variant: normal !important;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
i.fas, i.fa-solid, .fas, .fa-solid {
    font-weight: 900 !important;
}
i.far, i.fa-regular, .far, .fa-regular {
    font-weight: 400 !important;
}
i.fab, i.fa-brands, .fab, .fa-brands {
    font-family: "Font Awesome 6 Brands", "Font Awesome 5 Brands", "FontAwesome" !important;
    font-weight: 400 !important;
}

/* Flaticon & Flaticon_1 Complete Protection */
i[class^="flaticon-"], [class^="flaticon-"], [class*=" flaticon-"] {
    font-family: "Flaticon" !important;
    font-style: normal !important;
    font-variant: normal !important;
    line-height: 1;
    text-rendering: optimizeLegibility;
    text-transform: none;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
}
[class^="flaticon-0"]:before, [class*=" flaticon-0"]:before,
[class^="flaticon-0"]:after, [class*=" flaticon-0"]:after,
[class^="flaticon-381-"]:before, [class*=" flaticon-381-"]:before,
[class^="flaticon-381-"]:after, [class*=" flaticon-381-"]:after {
    font-family: "Flaticon" !important;
    font-style: normal !important;
}

/* ==========================================================================
   BROCHURE SCHEDULE TIMETABLE GRID (DIPA OFFICIAL BROCHURES)
   ========================================================================== */
.brochure-slot-tile {
    border: 1px solid #cbd5e1;
    background-color: #ffffff;
    transition: all 0.15s ease-in-out;
}
.brochure-slot-tile:hover:not(.opacity-75) {
    border-color: #0d6efd !important;
    box-shadow: 0 2px 6px rgba(13, 110, 253, 0.15) !important;
}
.brochure-slot-tile.border-primary {
    border: 2px solid #0d6efd !important;
    background-color: #eff6ff !important;
}
.brochure-slot-tile.opacity-75 {
    background-color: #f8fafc !important;
    border-color: #e2e8f0 !important;
}

/* ==========================================================================
   HEADER BRANCH SWITCHER PILL (HIGH-CONTRAST DARK SURFACE WITH CRISP WHITE TEXT)
   ========================================================================== */
.branch-switcher-pill,
a.branch-switcher-pill,
button.branch-switcher-pill,
.btn.branch-switcher-pill {
    background-color: #0E2A47 !important;
    background: linear-gradient(135deg, #091C30 0%, #0E2A47 100%) !important;
    border: 1.5px solid #1E3A8A !important;
    color: #FFFFFF !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    box-shadow: 0 2px 6px rgba(9, 28, 48, 0.35) !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    transition: all 0.2s ease-in-out !important;
}

.branch-switcher-pill:hover,
.branch-switcher-pill:focus,
.branch-switcher-pill:active,
.branch-switcher-pill.show,
.branch-switcher-pill[aria-expanded="true"] {
    background-color: #081B2E !important;
    background: linear-gradient(135deg, #051322 0%, #091C30 100%) !important;
    border-color: #3B82F6 !important;
    color: #FFFFFF !important;
    box-shadow: 0 4px 12px rgba(14, 42, 71, 0.5) !important;
}

/* Force all child text and labels inside pill to pure white */
.branch-switcher-pill span,
.branch-switcher-pill strong,
.branch-switcher-pill b,
.branch-switcher-pill .branch-name,
.branch-switcher-pill .branch-title,
.branch-switcher-pill [class*="branch-"] {
    color: #FFFFFF !important;
    font-weight: 700 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
}

.branch-switcher-pill i.fa-globe {
    color: #38BDF8 !important; /* Bright sky blue icon */
}

.branch-switcher-pill i.fa-map-marker-alt {
    color: #F87171 !important; /* Bright coral red icon */
}

.branch-switcher-pill .badge-branch-code {
    background-color: #1D4ED8 !important;
    color: #FFFFFF !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    border-radius: 9999px !important;
    padding: 3px 8px !important;
    letter-spacing: 0.5px !important;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
}

.branch-switcher-pill:after,
.branch-switcher-pill.dropdown-toggle:after {
    color: #FFFFFF !important;
    border-top-color: #FFFFFF !important;
}

/* ==========================================================================
   FULLCALENDAR ICON INTEGRITY (FONT AWESOME 6 CHEVRON INTEGRATION)
   Memperbaiki ikon navigasi FullCalendar (prev, next, prevYear, nextYear)
   agar selalu tampil tajam menggunakan Font Awesome 6 dan bebas tofu box [□]
   ========================================================================== */
.fc-icon,
span.fc-icon,
.fc .fc-icon {
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome" !important;
    font-weight: 900 !important;
    font-style: normal !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    text-rendering: auto !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

.fc-icon-chevron-left::before,
.fc-icon-chevron-left:before {
    content: "\f053" !important;
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome" !important;
    font-weight: 900 !important;
    font-size: 13px !important;
}

.fc-icon-chevron-right::before,
.fc-icon-chevron-right:before {
    content: "\f054" !important;
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome" !important;
    font-weight: 900 !important;
    font-size: 13px !important;
}

.fc-icon-chevrons-left::before,
.fc-icon-chevrons-left:before {
    content: "\f100" !important;
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome" !important;
    font-weight: 900 !important;
    font-size: 13px !important;
}

.fc-icon-chevrons-right::before,
.fc-icon-chevrons-right:before {
    content: "\f101" !important;
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome" !important;
    font-weight: 900 !important;
    font-size: 13px !important;
}

.fc-icon-x::before,
.fc-icon-x:before {
    content: "\f00d" !important;
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome" !important;
    font-weight: 900 !important;
    font-size: 13px !important;
}




