.table-preview p, .table-preview figure {
margin-bottom: 0 !important;
}

.table-preview td {
vertical-align: middle;
}

.main-preview-calon-pelanggan .form-label, .main-preview-semua-pelanggan .form-label {
margin-bottom: 3px;
}

.main-preview-calon-pelanggan hr, .main-preview-semua-pelanggan hr {
border-color: var(--border);
opacity: 1;
margin: 15px 0;
}

.table-th-vertical th {
writing-mode: sideways-lr;
text-align: center;
white-space: pre-wrap;
font-weight: 400 !important;
height: 92px;
vertical-align: middle;
}

.vertical-th {
writing-mode: sideways-lr;
text-align: center;
white-space: pre-wrap;
font-weight: 400 !important;
height: 58px;
vertical-align: middle;
}

.b-one {
border: 1px solid var(--border);
padding: 8px;
}

.bttnone {
border-top: none !important;
}

.tb-head-preview th {
background-color: var(--background-view-form);
font-weight: 400 !important;
vertical-align: middle;
}

.main-preview-calon-pelanggan, .main-preview-semua-pelanggan {
background-color: var(--card-body);
padding: 10px;
border: 1px solid var(--border);
}

.main-preview-calon-pelanggan table, .main-preview-semua-pelanggan table {
margin-bottom: 0;
}

.dataTables_info {
margin-top: -30px !important;
}

.single-post .entry-content ul li {
margin-bottom: 0;
}

.single-post .entry-content ul {
padding: 0;
}

.horizontal-bar-chart {
float: left;
width: 100%;
padding-left: 0;
}

.horizontal-bar-chart li {
position: relative;
display: flex;
_zoom: 1;
height: 2em;
margin-bottom: .2em;
background: #ebebeb;
}



.horizontal-bar-chart p {
color: #666666;
position: relative;
display: block;
_zoom: 1;
margin: 0 0 .9em 0;
text-indent: .6em;
}


.horizontal-bar-chart .name {
display: block;
position: absolute;
top: 0;
right: 0;
margin: 0 1em;
text-align: right;
color: #999;
font-weight: bold;
font-size: 0.875em;
line-height: 2em;
text-shadow: 1px 1px 0px #e8e8e8;
}

.horizontal-bar-chart .index {
display: inline-block;
/* position: absolute; */
top: 0;
left: 0;
height: 100%;
text-indent: .6em;
font-size: 0.875em;
color: #000;
background: #c9c9c9;
line-height: 2.2em;
}

.chart-container .source {
font-size: .8em;
padding-top: 4.5em;
text-align: center;
}

.hor-bar {
display: flex;
width: 60%;
}

.horizontal-bar-chart .label {
width: 40%;
text-align: left;
display: flex;
align-items: center;
padding-left: 5px;
background-color: var(--card-body);
}

.navbar-feature .nav-link {
padding-left: 8px !important;
padding-right: 8px !important;
}

.card .tab-content>.active {
padding-bottom: 0;
}

.summary-table {
display: flex;
align-items: center;
padding: 0 7px;
border: 1px solid var(--border);
pointer-events: none;
cursor: pointer;
}

.ex-to-pdf .summary-table{
width:130px;
justify-content:center;
}


.tooltip-top {
white-space: nowrap;
visibility: hidden;
width: auto;
background-color: #666;
color: #fff;
text-align: center;
border-radius: 0;
padding: 5px;
position: absolute;
z-index: 1;
top: -32px;
left: 50%;
transform: translateX(-50%);
opacity: 0;
transition: opacity 0.3s;
pointer-events: none;
}

.tooltip-top::after {
content: "";
position: absolute;
left: 50%;
bottom: -12px;
transform: translateX(-50%);
border-width: 6px;
border-style: solid;
border-color: #666 transparent transparent transparent;
}

.input-group:hover .tooltip-top,
.ex-to-pdf:hover .tooltip-top {
visibility: visible;
opacity: 1;
}

.ex-to-pdf .tooltip-top {
left: 50%;
transform: translateX(-90%);
}

.ex-to-pdf .tooltip-top::after {
left: auto;
right: 10px; /* atur jaraknya dari kanan */
transform: none;
}

.ex-to-pdf {
cursor: pointer;
}

/* Hover icon */
.ex-to-pdf:hover .icon-count {
background-color: #b3b2b2 !important;
}

/* Hover bagian text */
.ex-to-pdf:hover .summary-table {
background-color: #4a4a4a !important;
}

.card.form-pengaturan-aplikasi .card-body {
background-color: var(--card-header);
}

.form-pengaturan-aplikasi .form-table {
height: 25px;
}

.form-informasi-umum .custom-width, .custom-width {
width: 60%;
}

.form-informasi-umum .custom-width.sub-input {
width: 61%;
}

form input, form select, form textarea {
font-size: 10px !important;
color: grey !important;
}

input[type="date"]::-webkit-calendar-picker-indicator {
font-size: 13px;
opacity: 0.5;
}

.icon-tab-control {
width: 11px;
}

.icon-tab-control.icon-left {
margin: 0 3px 0 0;
}

.icon-tab-control.icon-right {
margin: 0 0 0 3px;
}

.btn-preview-document {
background-color: #e3e3e3;
}

.document-preview {
display: block;
margin: 0 auto;
width: 700px;
}

.modal .modal-header {
background-color: #e3e3e3;
}

.document-checklist {
display: block;
width: 35px;
height: 26px;
border: 1px solid lightgrey;
padding: 0 5px;
}

.document-checklist img {
width: 100%;
}

.collapse-filter-data {
padding: 0 5px 5px 5px;
margin-left: 19px;
}

#formFilterRekapCalonPesertaDidik .card-header {
background-color: #e7e7e7;
}

#formFilterRekapCalonPesertaDidik .card-body {
background-color: #f8f8f8;
border-bottom: var(--bs-card-border-width) solid var(--bs-card-border-color);
}

.aksi-search {
width: 200px;
}

.profile-child {
margin-bottom: 15px;
display: flex;
border-bottom: 1px solid var(--border);
}

.profile-child p {
margin-bottom: 2px;
width: 65%;
}

.profile-child.school-profile p {
width: 21.4% !important;
}

.profile-child i {
width: 5%;
text-align: center;
}

.profile-child span {
width: 60%;
}

.tooltiptext-right {
white-space: nowrap;
visibility: hidden;
width: auto;
background-color: #666;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px;
position: absolute;
z-index: 1;
/* top: 50%; */
/* left: 70px; */
right: -75px;
margin-top: -26px;
opacity: 0;
transition: opacity 0.3s;
pointer-events: none;
}

.tooltiptext-right::after {
content: "";
position: absolute;
top: 50%;
right: 100%;
margin-top: -5px;
border-width: 5px;
border-style: solid;
border-color: transparent #666 transparent transparent;
}

.tooltip-element:hover .tooltiptext-right {
visibility: visible;
opacity: 1;
}

.btn-preview-document {
background-color: var(--card-header);
}

.btn-preview-document:hover {
background-color: var(--nav-hover);
}

.ex-to-pdf {
cursor: pointer;
}

.top-menu .title-bar .title-text {
margin-top: 5px;
}

.top-menu .title-bar .title-text h6 {
font-size: 12px;
}

.top-menu .title-bar .title-text img {
width: 15px;
height: 15px;
}

.top-menu .title-bar .title-text button {
padding: 0;
height: 20px;
border: none;
margin-left: 4px;
background-color: transparent;
}

.top-menu .title-bar .title-text button.non-active:hover {
scale: unset;
border: unset;
}

.top-menu .title-bar .title-text button:active {
background-color: white;
border: none;
}

.top-menu .title-bar .title-text button:focus-visible {
background-color: white;
border: none;
}

.top-menu .title-bar .title-breadcrumb .breadcrumb-item {
color: grey;
}

.top-menu .title-bar .title-breadcrumb .breadcrumb-item a {
color: var(--title-navigasi);
text-decoration: none;
}

.breadcrumb-item+.breadcrumb-item::before {
color: var(--title-navigasi) !important;
}
.top-menu .title-bar .title-breadcrumb .breadcrumb .breadcrumb-item.home img {
width: 12px;
margin-top: -2px;
margin-right: 5px;
}

.topbar, #topbar_item {
height: unset;
}

.topbar-menu-group-container {
width: fit-content;
padding: 0 0px;
/* border-right: 1px solid lightgrey; */
height: 70px;
}

.topbar-menu-group-container.no-separator {
border-right: none;
}

.topbar-menu-group-container .group-name {
text-align: center;
padding: 2px 0 0 0;
font-size: 8px;
width: 100%;
}

/* #tabulasi_konten {
max-height: 87.6vh !important;
} */

.filter-sidebar .side-tab .form-check input {
padding: 6px;
}

.filter-sidebar .side-tab .form-check {
margin-bottom: 10px;
}

.filter-sidebar .side-tab .form-check label {
padding-top: 3px;
padding-left: 5px;
}

.item-top {
box-sizing: border-box;
}

.topbar {
background-color: var(--td-bg);
}

.form-informasi-umum .custom-height, .custom-height {
height: 24.5px;
}

.accordionCreateForm .accordion-item, .accordionCreateForm .accordion-item .accordion-button {
border-radius: unset;
}

.accordionCreateForm .accordion-item .accordion-body {
background-color: var(--background-view-form);
}

.btn-pick-file:hover, .btn-upload-file:hover {
cursor: pointer;
}

.btn-real {
height: 23px;
}

.logotmk {
width: 67px;
height: fit-content;
padding: 10px;
padding-top: 20px;
}

.nav-sidebar .nav-item .nav-link-no-hover {
background-color: var(--table-bg);
border-radius: 0;
}

.nav-sidebar .nav-item .nav-link-no-hover:hover {
background-color: var(--table-bg);
border-radius: 0;
}

.nav-pills .sub-nav-link.active, .nav-pills .sub-nav-link:hover {
background-color: #dfdfdf !important;
}

.top-aksi-table button {
background-color: transparent;
border: none;
color: #272727;
padding: 0;
}

.top-aksi-table button:hover {
background-color: var(--topbar-hover);
color: #272727;
border-radius: 0px;
}

.top-aksi-table button.active {
background-color: var(--topaksi-hover) !important;
color: #272727 !important;
border-radius: 0px !important;
}

.btn-basic {
background-color: transparent;
border: none;
color: #272727;
}

.side-gear a {
height: 31px;
}

.side-gear a.active {
background-color: var(--topbar-hover);
}

@media screen and (max-width: 1496px) {
.gear-show {
right: 300px;
}
}

@media screen and (max-width: 1536px) {
.gear-show {
right: 5px;
}
}

.nav-item-profil img {
width: 15px;
height: 15px;
}

@media screen and (min-width: 1823px) {
.profil-show {
right: 0%;
}
}

.form-select {
--bs-form-select-bg-img: url('/img/icon/down-arrow.png');
--bs-form-select-feedback-icon-size: 10px;
}

.side-tab button.active {
background-color: var(--nav-hover);
}

#dinamisTabulasi {
margin-bottom: 30px;
width: 100%;
}

.form-select {
background-size: 12px 12px;
}

.form-control:focus {
border-color: #86b7fe;
outline: 0;
box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25);
}

.button-grey-colored img {
width: 11px;
height: 11px;
}

.button-grey-colored .summary-table {
width: 55px;
}

.btn-real-white {
background-color: white !important;
}

.btn-real-white:hover {
background-color: #f1f1f1 !important;
}

.btn-disabled {
pointer-events: none;
opacity: 0.5;
}

.tab-disabled {
opacity: 0.5;
}

.modal-surat {
top: 0;
width: 50% !important;
max-width: 100% !important;
height: 100%;
}

#modalDokumenBodyJenisSurat iframe {
width: 100%;
height: 80vh;
}

.jenis-surat-btn {
background: none;
border: none;
padding: 0;
color: inherit;
cursor: pointer;
font-weight: 500;
}

.alert-primary {
background: #ffae1a !important;
height: 40px !important;
--bs-alert-border-color : #ffffff00 !important;
}

.font-disable {
color: grey !important;
}

.icon-disable {
filter: grayscale(100%) brightness(80%);
opacity: 0.7;
transition: filter 0.3s, opacity 0.3s;
}

.item-akses-cepat.active .icon-disable,
.item-akses-cepat:hover .icon-disable {
filter: none;
opacity: 1;
}

.modal-preview-gambar {
width: fit-content !important;
max-width: 100% !important;
}

.modal-preview-gambar-data {
width: 75% !important;
max-width: 100% !important;
}

.modal-preview-gambar-data-dapodik {
width: 65% !important;
max-width: 100% !important;
}

.text-judul-2 {
font-weight: 400 !important;
}

/* .btn-berlangganan {
background-color: #187FC1 !important;
color: white;
height: 30px !important;
} */

.btn-berlangganan {
background-color: #187FC1 !important;
border: 1px solid #adadad !important;
color: white;
border-radius: 5px;
padding: 2px 5px !important;
height: 30px !important;
}

.btn-berlangganan:hover, .btn-berlangganan:focus, .btn-berlangganan:active {
background-color: #fff !important;
border: 1px solid #909090 !important;
border-radius: 5px;
color: #000;
}

.form-filter {
width: 65% !important;
}

.select2-container {
width: 65% ;
}

.topbar-school-description {
margin-left: -50px;
padding-top: 15px !important;
}

.topbar-school-description h6 {
color: var(--text-color) !important;
}

.title-breadcrumb-custom {
background-color: var(--background) !important;
}

.list-icon-side {
width: 20px;
height: 20px;
filter: var(--icon-side-list);
}

/* .breadcrumb-item a {
color: var(--text-color) !important;
} */

.btn-crud-new:hover {
background-color: #d7d7d7;
}

/* .btn-crud-icon:hover {
background-color: #a9a9a9;
} */

.preview-icon {
width: 18px;
}

.preview-icon-blue {
filter: brightness(0) saturate(100%) invert(35%) sepia(99%) saturate(3000%) hue-rotate(190deg) brightness(95%)
contrast(97%);
cursor: pointer;
}

.preview-icon-arrow {
background-color: #A9A9A9;
cursor: pointer;
}

.preview-icon-arrow:hover {
background-color: #808080;
}

.icon-dokumen-oren{
color: #FF7B00;
}

.unggah-dokumentasi {
width: 100%;
height: 285px;
background: #fff;
border: 2px dashed #ff8c00;
border-radius: 10px;
position: relative;
display: flex;
align-items: center;
padding-left: 90px;
}

.preview-box {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.unggah-dokumen-pendukung{
width: 470px !important;
height: 660px !important;
background-color: #EFEFEF !important;
border: 1px solid var(--border);
display: flex;
justify-content: center;
align-items: center;
}

.garis-bawah-informasi {
border-bottom: 1px solid var(--border);
width: 95%;
}

.pdf-container {
width: 80%;
max-width: 900px;
height: 625px;
border: 1px solid #ddd;
border-radius: 10px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}


.pdf-viewer {
width: 100%;
height: 100%;
border: none;
}

.pagination-custom {
display: flex;
justify-content: center;
margin-top: 15px;
}

.pagination-custom button {
border: 1px solid #dee2e6;
background: #fff;
color: #333;
padding: 5px 12px;
margin: 0 3px;
border-radius: 6px;
transition: all 0.2s ease-in-out;
}

.pagination-custom button:hover {
background: #f0f0f0;
}

.pagination-custom button.btn-primary {
background: #C0C0C0;
border-color: #C0C0C0;
color: white;
}

.pagination-custom button:disabled {
opacity: 0.5;
cursor: not-allowed;
}

.select2-dropdown {
width: 5% !important;
}

.form-group-sp30,
.form-group-sp50,
.form-group-sp75,
.form-group-sp90,
.form-group-sp100 {
display: none;
}

.hide-sidebar .sidebar {
display: none !important;
}

.hide-sidebar .content-wrapper {
margin-left: 0 !important;
width: 100% !important;
}

.unggah-dokumen {
min-height: 815px;
padding: 20px;
border: 2px dashed #d0d0d0;
border-radius: 12px;
background: #ffffff;
}

.unggah-dokumen .preview-box {
width: 100%;
height: 100%;
min-height: 500px;
background: #f8f9fa;
border-radius: 12px;
overflow: hidden;
border: 1px solid #e0e0e0;
}

.unggah-dokumen .preview-box iframe {
width: 100%;
height: 100%;
border: none;
}

.unggah-dokumen:hover {
border-color: #0d6efd;
background: #f8fbff;
}

.btn-icon-detail:hover {
background: #59B843 !important;
}

.btn-icon-pemberitahuan:hover {
background: #FFC12E !important;
}

.btn-icon-perbarui:hover {
background: #0078D7 !important;
}

.preview-pdf-icon {
margin-top: 15px;
}

.upload-info {
margin-top: 10px;
}

.modal-full-height {
height: 90vh;
max-height: 90vh;
}

.modal-full-height .modal-content {
height: 100%;
}

.modal-full-height .modal-body {
flex: 1 1 auto;
overflow-y: auto;
}

#previewImage {
width: 100%;
/* max-width: 500px; */
height: 400px;
object-fit: contain;
/* background-color: #f5f5f5; */
}

.modal-dokumen-pendukung {
height: 80em;
top: -5em;
}

.dokumen-pendukung-gambar {
height: 790px !important;
}

.dokumen-pendukung-pdf {
height: 790px;
}

.dokumentasi-gambar {
height: 25em !important;
}

.form-select {
font-size: 10.5px !important;
}

.filter-no-margin {
margin-top: 0 !important;
}

.filter-margin {
margin-top: 10px !important;
}

.keterangan-item {
display: flex;
align-items: center;
margin-bottom: 10px;
font-size: 10.5px;
}

.range-box {
padding: 4px 10px;
border-radius: 5px;
font-weight: 400;
margin-right: 10px;
min-width: 85px;
text-align: center;
}

.hebat .range-box {
background: rgba(40, 167, 69, 0.25);
color: #155724;
}

.rendah .range-box {
background: rgba(220, 53, 69, 0.15);
color: #000;
}

.sedang .range-box {
background: rgba(220, 53, 69, 0.25);
color: #000;
}

.penting .range-box {
background: rgba(220, 53, 69, 0.4);
color: #000;
}

.sangat-penting .range-box {
background: rgba(220, 53, 69, 0.55);
color: #fff;
}

.kritis .range-box {
background: rgba(220, 53, 69, 0.7);
color: #fff;
}

.sangat-kritis .range-box {
background: rgba(220, 53, 69, 0.85);
color: #fff;
}

.genting .range-box {
background: rgba(200, 0, 0, 0.9);
color: #fff;
}

.sangat-genting .range-box {
background: rgb(150, 0, 0);
color: #fff;
}

.border-arrow {
border: 1px solid black;
border-radius: 50%;
padding: 2px;
display: flex;
align-items: center;
justify-content: center;
transition: 0.3s;
}

.border-arrow img {
transition: 0.3s;
}

.border-arrow:hover {
border: 1px solid #0d6efd;
background-color: #0d6efd;
}

.border-arrow:hover img {
filter: brightness(0) invert(1);
}

.arrow-right {
transform: rotate(-90deg);
transition: 0.3s;
}

.garis-bawah-informasi-padding {
border-bottom: 1px solid var(--border);
width: 95%;
padding-bottom: 8px;
}

.nav-tabs .nav-link {
width: 8em;
height: 3em;
padding: 0;
display: flex;
align-items: center;
justify-content: center;
}

.select-hover {
background-color: white;
border: 1px solid var(--border);
transition: background-color .15s ease, border-color .15s ease;
}

.select-hover:hover:not(:focus-within) {
background-color: #dbdbdb;
cursor: pointer;
}

.select-hover .form-select {
background-color: transparent;
border: 0;
cursor: pointer;
}

.hidden-btn {
visibility: hidden;
}

.toggle-arrow {
transition: transform 0.3s ease;
}

.toggle-arrow.rotate {
transform: rotate(180deg);
}



.topbar-logo-sekolah {
margin-top: -0.7em;
}

.disabled-div {
pointer-events: none;
opacity: 0.5;
cursor: not-allowed;
}

.lebar-tabulasi-13em {
width: 13em !important;
}

.icon-btn {
    width: 18px;
    height: 18px;
}

.badge-bg-success {
    background-color: #b1edb3 !important;
    border: 1px solid #4CAF50;
    color: #333;
    font-weight: 400 !important;
}

.badge-bg-primary {
    background-color: #cce5ff !important;
    border: 1px solid #007bff;
    color: #333;
    font-weight: 400 !important;
}

.badge-bg-warning {
    background-color: #fff3cd !important;
    border: 1px solid #ffc107;
    color: #333;
    font-weight: 400 !important;
}

.badge-bg-info {
    background-color: #9fe0af !important;
    border: 1px solid #28a745;
    color: #333;
    font-weight: 400 !important;
}

.badge-bg-secondary {
    background-color: #e2e3e5 !important;
    border: 1px solid #6c757d;
    color: #333;
    font-weight: 400 !important;
}

.badge-bg-danger {
    background-color: #f8d7da !important;
    border: 1px solid #dc3545;
    color: #333;
    font-weight: 400 !important;
}

.btn-generate {
    background-color: transparent !important;
    border: 1px solid #007bff !important;
    color: #007bff;
}

.btn-generate:hover {
    background-color: #007bff !important;
    border: 1px solid #007bff !important;
    color: white;
}

.btn-generate img {
    content: url('/img/icon/password-color.png');
    width: 20px;
    height: 20px;
}

.btn-generate:hover img {
    content: url('/img/icon/password-white.png');
}

.btn-reset {
    background-color: transparent !important;
    border: 1px solid #6c757d !important;
    color: #6c757d;
}

.btn-reset:hover {
    background-color: #6c757d !important;
    border: 1px solid #6c757d !important;
    color: white;
}

.btn-reset img {
    content: url('/img/icon/reset-password-color.png');
    width: 20px;
    height: 20px;
}

.btn-reset:hover img {
    content: url('/img/icon/reset-password-white.png');
}

.btn-aktifkan {
    background: transparent !important;
    border: 1px solid #28a745 !important;
    color: #28a745 !important;
    border-radius: 0 !important;
}

.btn-aktifkan:hover {
    background: #28a745 !important;
    color: white !important;
}

.btn-aktifkan:hover img {
    content: url('/img/icon/checklist-white.png');
}

.btn-aktifkan-all {
    background: transparent !important;
    border: 1px solid #28a745 !important;
    color: #28a745 !important;
    border-radius: 0 !important;
}

.btn-aktifkan-all:hover {
    background: #28a745 !important;
    color: white !important;
}

.btn-aktifkan-all:hover img {
    content: url('/img/icon/checklist-white.png');
}

.btn-aktif-selected {
    background: #28a745 !important;
    border: 1px solid #28a745 !important;
    color: white !important;
    border-radius: 0 !important;
}

.btn-nonaktifkan {
    background: transparent !important;
    border: 1px solid #dc3545 !important;
    color: #dc3545 !important;
    border-radius: 0 !important;
}

.btn-nonaktifkan:hover {
    background: #dc3545 !important;
    color: white !important;
}

.btn-nonaktifkan:hover img {
    content: url('/img/icon/nonaktif-button-white.png');
}

.btn-nonaktifkan-all {
    background: transparent !important;
    border: 1px solid #dc3545 !important;
    color: #dc3545 !important;
    border-radius: 0 !important;
}

.btn-nonaktifkan-all:hover {
    background: #dc3545 !important;
    color: white !important;
}

.btn-nonaktifkan-all:hover img {
    content: url('/img/icon/nonaktif-button-white.png');
}

.btn-nonaktif-selected {
    background: #dc3545 !important;
    border: 1px solid #dc3545 !important;
    color: white !important;
    border-radius: 0 !important;
}

.btn-view-eye {
    background-color: transparent !important;
    border: 1px solid #6c757d !important;
    color: #6c757d;
}

.btn-view-eye:hover {
    background-color: #6c757d !important;
    border: 1px solid #6c757d !important;
    color: white;
}

.btn-view-eye img {
    width: 15px;
    height: 15px;
}

/* hover saat mode hide */
.btn-view-eye.eye-hide:hover img {
    content: url('/img/icon/eye-hide-white.png');
}

/* hover saat mode view */
.btn-view-eye.eye-view:hover img {
    content: url('/img/icon/eye-view-white.png');
}

.btn-create {
    background-color: transparent !important;
    border: 1px solid #007bff !important;
    color: #007bff;
}

.btn-create:hover {
    background-color: #007bff !important;
    border: 1px solid #007bff !important;
    color: white;
}

.btn-create img {
    content: url('/img/icon/password-color.png');
    width: 20px;
    height: 20px;
}

.btn-create:hover img {
    content: url('/img/icon/password-white.png');
}

.btn-create-all {
    background-color: transparent !important;
    border: 1px solid #007bff !important;
    color: #007bff;
}

.btn-create-all:hover {
    background-color: #007bff !important;
    border: 1px solid #007bff !important;
    color: white;
}

.btn-create-all img {
    content: url('/img/icon/password-color.png');
    width: 20px;
    height: 20px;
}

.btn-create-all:hover img {
    content: url('/img/icon/password-white.png');
}

.readonly-select {
    pointer-events: none;
    background-color: #fff;
    color: #000;
}

.custom-dropdown {
    min-width: 135px;
    background: #fff;
    position: absolute !important;
    left: -150px !important;
    top: 14px !important;
}

.catat-konseling-btn {
    background-color: transparent !important;
    border: 1px solid #007bff !important;
    color: #007bff;
}

.catat-konseling-btn:hover {
    background-color: #007bff !important;
    border: 1px solid #007bff !important;
    color: white;
}

.catat-konseling-btn-lihat {
    background-color: transparent !important;
    border: 1px solid #007bff !important;
    color: #007bff;
}

.catat-konseling-btn-lihat:hover {
    background-color: #007bff !important;
    border: 1px solid #007bff !important;
    color: white;
}

.catat-konseling-btn-lihat img {
    content: url('/img/icon/eye-view.png');
    width: 20px;
    height: 20px;

    filter: brightness(0) saturate(100%) invert(35%) sepia(98%)
            saturate(1867%) hue-rotate(194deg) brightness(96%) contrast(101%);
}

.catat-konseling-btn-lihat:hover img {
    content: url('/img/icon/eye-view-white.png');
    filter: none;
}

.lihat-catatan-konseling-btn {
    background-color: transparent !important;
    border: 1px solid #6c757d !important;
    color: #6c757d;
}

.lihat-catatan-konseling-btn:hover {
    background-color: #6c757d !important;
    border: 1px solid #6c757d !important;
    color: white;
}

.btn-hari-ini {
    background-color: transparent !important;
    border: 1px solid #6c757d !important;
    color: #6c757d;
}

.btn-hari-ini:hover {
    background-color: #6c757d !important;
    border: 1px solid #6c757d !important;
    color: white;
}

.btn-hari-ini img {
    content: url('/img/icon/hari-ini-color.png');
    width: 20px;
    height: 20px;
}

.btn-hari-ini:hover img {
    content: url('/img/icon/hari-ini-white.png');
}

/* Override all standard Bootstrap badges to match Penilaian badge styles */
.badge.bg-success, .badge-success, .badge-bg-success {
    background-color: #b1edb3 !important;
    border: 1px solid #4CAF50 !important;
    color: #333 !important;
    font-weight: 400 !important;
    font-size: 10.5px !important;
    padding: 6px !important;
}

.badge.bg-primary, .badge-primary, .badge-bg-primary {
    background-color: #cce5ff !important;
    border: 1px solid #007bff !important;
    color: #333 !important;
    font-weight: 400 !important;
    font-size: 10.5px !important;
    padding: 6px !important;
}

.badge.bg-warning, .badge-warning, .badge-bg-warning {
    background-color: #fff3cd !important;
    border: 1px solid #ffc107 !important;
    color: #333 !important;
    font-weight: 400 !important;
    font-size: 10.5px !important;
    padding: 6px !important;
}

.badge.bg-info, .badge-info, .badge-bg-info {
    background-color: #9fe0af !important;
    border: 1px solid #28a745 !important;
    color: #333 !important;
    font-weight: 400 !important;
    font-size: 10.5px !important;
    padding: 6px !important;
}

.badge.bg-secondary, .badge-secondary, .badge-bg-secondary {
    background-color: #e2e3e5 !important;
    border: 1px solid #6c757d !important;
    color: #333 !important;
    font-weight: 400 !important;
    font-size: 10.5px !important;
    padding: 6px !important;
}

.badge.bg-danger, .badge-danger, .badge-bg-danger {
    background-color: #f8d7da !important;
    border: 1px solid #dc3545 !important;
    color: #333 !important;
    font-weight: 400 !important;
    font-size: 10.5px !important;
    padding: 6px !important;
}

/* Center all table cells containing badges globally */
table td:has(> .badge), table td:has(.badge) {
    text-align: center !important;
}