body::-webkit-scrollbar {
	width: 10px;
	/* Lebar scrollbar */
	height: 5px;
	/* Tinggi scrollbar */
}

body::-webkit-scrollbar-thumb {
	background-color: #adb1b8;
	/* Warna latar belakang thumb scrollbar */
	border-radius: 5px;
	/* Radius thumb scrollbar */
}

body::-webkit-scrollbar-thumb:hover {
	background-color: #555;
	/* Warna latar belakang thumb scrollbar saat dihover */
}

.tsm_font {
	font-family: "bordeauxblackregular", sans-serif;
}

body.boxed-layout #wrapper {
	max-width: 100%;
	margin: 0 auto;
	-webkit-box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.15);
	box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.15);
}

body.boxed-layout .navbar-custom {
	max-width: 100%;
	margin: 0 auto;
}

table.fix {
	table-layout: fixed;
	/*  width: 180px;*/
}

th.fix {
	background: white;
	position: sticky;
	top: 0;
	/* Don't forget this, required for the stickiness */
	box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
}

td.details-control {
	background: url("../vendor/images/details_open.png") no-repeat center center;
	cursor: pointer;
}

tr.shown td.details-control {
	background: url("../vendor/images/details_close.png") no-repeat center center;
}

th.p-nol,
td.p-nol {
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	padding-right: 0px;
}

/* Autosuggest */
.autosuggest {
	background-color: #fff9c4;
	border: 1px solid #90caf9;
	display: none;
	overflow: hidden;
	padding: 0px;
	position: fixed;
	z-index: 99;
	margin-top: 5px;
	margin-left: 0px;
	text-align: left;
}

.autosuggest ul li,
.autosuggest-up ul li {
	background-color: #fff9c4;
	margin-left: -30px;
	border-bottom: 1px solid #90caf9;
	cursor: pointer;
	display: block;
	list-style: none;
	padding: 2px;
	white-space: nowrap;
	z-index: 99;
}

.autosuggest ul li:hover,
.autosuggest-up ul li:hover {
	background-color: #316ac5;
	color: #ffffff;
	z-index: 10;
}

.autosuggest-up {
	background-color: #bbdefb;
	border: 1px solid #90caf9;
	display: none;
	overflow: hidden;
	padding: 0px;
	position: fixed;
	z-index: 99;
	margin-top: 5px;
	margin-left: 0px;
	top: auto;
	bottom: 130px;
	text-align: left;
}

.progress_bar {
	position: absolute;
	/* fixed or absolute */
	margin: auto;
	top: 30%;
	/*text-align: center;*/
	/*right: 50%;*/
	/*height:100px;*/
	z-index: 9999;
	/* Sit on top */
	display: none;
}

input.f-nol {
	margin-top: 0px;
	padding-left: 4px;
	padding-right: 4px;
}

.fix {
	padding-left: 4px !important;
	padding-right: 4px !important;
}

select.fix {
	padding-left: 4px !important;
	padding-right: 4px !important;
}

select.fix2 {
	padding: 2px !important;
}

.pac-container {
	z-index: 9999999999 !important;
}

.btm-5 {
	margin-bottom: 5px;
}

.top-0 {
	margin-top: 0px;
}

.error {
	color: red;
	font-size: 11px;
}

.label-danger {
	color: red;
	font-size: 11px;
}

label.error {
	color: red;
	font-size: 11px;
}

.form_error {
	border: 1px solid red;
}

.box-primary {
	box-shadow: 2px 2px #7d7d7d9e;
	font-family: Tahoma;
	font-size: 12px;
	border: 1px solid rgba(113, 182, 249, 1);
	background-color: rgba(255, 255, 255, 0.7);
	color: #000000;
}

.badge-lighten-primary {
	border: 1px solid rgba(113, 182, 249, 0.2) !important;
	background-color: rgba(113, 182, 249, 0.25) !important;
	color: #71b6f9 !important;
}

.badge-lighten-secondary {
	border: 1px solid rgba(108, 117, 125, 0.2) !important;
	background-color: rgba(108, 117, 125, 0.25) !important;
	color: #6c757d !important;
}

.badge-lighten-success {
	border: 1px solid rgba(16, 196, 105, 0.2) !important;
	background-color: rgba(16, 196, 105, 0.25) !important;
	color: #10c469 !important;
}

.badge-lighten-info {
	border: 1px solid rgba(53, 184, 224, 0.2) !important;
	background-color: rgba(53, 184, 224, 0.25) !important;
	color: #35b8e0 !important;
}

.badge-lighten-warning {
	border: 1px solid rgba(249, 200, 81, 0.2) !important;
	background-color: rgba(249, 200, 81, 0.25) !important;
	color: #f9c851 !important;
}

.badge-lighten-danger {
	border: 1px solid rgba(255, 91, 91, 0.2) !important;
	background-color: rgba(255, 91, 91, 0.25) !important;
	color: #ff5b5b !important;
}

.badge-lighten-light {
	border: 1px solid rgba(241, 245, 247, 0.2) !important;
	background-color: rgba(241, 245, 247, 0.25) !important;
	color: #f1f5f7 !important;
}

.badge-lighten-dark {
	border: 1px solid rgba(50, 58, 70, 0.2) !important;
	background-color: rgba(50, 58, 70, 0.25) !important;
	color: #323a46 !important;
}

.badge-lighten-pink {
	border: 1px solid rgba(255, 138, 204, 0.2) !important;
	background-color: rgba(255, 138, 204, 0.25) !important;
	color: #ff8acc !important;
}

.badge-lighten-purple {
	border: 1px solid rgba(91, 105, 188, 0.2) !important;
	background-color: rgba(91, 105, 188, 0.25) !important;
	color: #5b69bc !important;
}

.badge-lighten-blue {
	border: 1px solid rgba(113, 182, 249, 0.2) !important;
	background-color: rgba(113, 182, 249, 0.25) !important;
	color: #71b6f9 !important;
}

.lighten-primary {
	border: 1px solid rgba(113, 182, 249, 0.2) !important;
	background-color: rgba(113, 182, 249, 0.25) !important;
	color: #71b6f9 !important;
}

.light-primary {
	border: 1px solid rgba(113, 182, 249, 0.2);
	background-color: rgba(113, 182, 249, 0.25);
	color: #000000;
}

.lighten-secondary {
	border: 1px solid rgba(108, 117, 125, 0.2) !important;
	background-color: rgba(108, 117, 125, 0.25) !important;
	color: #6c757d !important;
}

.lighten-success {
	border: 1px solid rgba(16, 196, 105, 0.2) !important;
	background-color: rgba(16, 196, 105, 0.25) !important;
	color: #10c469 !important;
}

.light-success {
	border: 1px solid rgba(16, 196, 105, 0.25) !important;
	background-color: rgba(16, 196, 105, 0.25) !important;
	color: #000000;
}

.border-success {
	border: 1px solid rgba(16, 196, 105, 0.5);
}

.lighten-info {
	border: 1px solid rgba(53, 184, 224, 0.2) !important;
	background-color: rgba(53, 184, 224, 0.25) !important;
	color: #35b8e0 !important;
}

.lighten-warning {
	border: 1px solid rgba(249, 200, 81, 0.2) !important;
	background-color: rgba(249, 200, 81, 0.25) !important;
	color: #f9c851 !important;
}

.light-warning {
	border: 1px solid rgba(249, 200, 81, 0.2);
	background-color: rgba(249, 200, 81, 0.25);
	color: #000000;
}

.lighten-danger {
	border: 1px solid rgba(255, 91, 91, 0.2) !important;
	background-color: rgba(255, 91, 91, 0.25) !important;
	color: #ff5b5b !important;
}

.light-danger {
	border: 1px solid rgba(255, 91, 91, 0.2) !important;
	background-color: rgba(255, 91, 91, 0.25) !important;
	color: #000000;
}

.lighten-light {
	border: 1px solid rgba(241, 245, 247, 0.2) !important;
	background-color: rgba(241, 245, 247, 0.25) !important;
	color: #f1f5f7 !important;
}

.lighten-dark {
	border: 1px solid rgba(50, 58, 70, 0.2) !important;
	background-color: rgba(50, 58, 70, 0.25) !important;
	color: #323a46 !important;
}

.lighten-pink {
	border: 1px solid rgba(255, 138, 204, 0.2) !important;
	background-color: rgba(255, 138, 204, 0.25) !important;
	color: #ff8acc !important;
}

.lighten-purple {
	border: 1px solid rgba(91, 105, 188, 0.2) !important;
	background-color: rgba(91, 105, 188, 0.25) !important;
	color: #5b69bc !important;
}

.lighten-blue {
	border: 1px solid rgba(113, 182, 249, 0.2) !important;
	background-color: rgba(113, 182, 249, 0.25) !important;
	color: #71b6f9 !important;
}

.bg-lighten-success {
	border: 1px solid rgba(16, 196, 105, 0.2);
	background-color: rgba(16, 196, 105, 0.25);
}

.bg-lighten-primary {
	border: 1px solid rgba(113, 182, 249, 0.2);
	background-color: rgba(113, 182, 249, 0.25);
}

.bg-lighten-secondary {
	border: 1px solid rgba(108, 117, 125, 0.2);
	background-color: rgba(108, 117, 125, 0.25);
}

.bg-lighten-warning {
	border: 1px solid rgba(249, 200, 81, 0.2) !important;
	background-color: rgba(249, 200, 81, 0.25) !important;
}

.bg-lighten-danger {
	border: 1px solid rgba(255, 91, 91, 0.2);
	background-color: rgba(255, 91, 91, 0.25);
}

.bg-lighten-pink {
	border: 1px solid rgba(255, 138, 204, 0.2);
	background-color: rgba(255, 138, 204, 0.25);
}

.bg-lighten-purple {
	border: 1px solid rgba(91, 105, 188, 0.2);
	background-color: rgba(91, 105, 188, 0.25);
}

.bg-lighten-info {
	border: 1px solid rgba(53, 184, 224, 0.2);
	background-color: rgba(53, 184, 224, 0.25);
}

/* Soft / terang variants (background, text, border) */
.bg-soft-primary {
	background-color: #eef6ff;
	color: #0d6efd;
	border: 1px solid #dbeafe;
}
.bg-soft-secondary {
	background-color: #f3f4f6;
	color: #6c757d;
	border: 1px solid #e5e7eb;
}
.bg-soft-success {
	background-color: #ecfdf3;
	color: #16a34a;
	border: 1px solid #bbf7d0;
}
.bg-soft-danger {
	background-color: #fff1f2;
	color: #dc2626;
	border: 1px solid #fecaca;
}
.bg-soft-warning {
	background-color: #fffbeb;
	color: #b45309;
	border: 1px solid #fef3c7;
}
.bg-soft-info {
	background-color: #f0f9ff;
	color: #0891b2;
	border: 1px solid #cfeffb;
}
.bg-soft-light {
	background-color: #f8fafc;
	color: #111827;
	border: 1px solid #e6eef6;
}
.bg-soft-dark {
	background-color: #f1f5f9;
	color: #0f172a;
	border: 1px solid #dbe7f5;
}

.bg-soft-blue {
	background-color: #eef2ff;
	color: #3730a3;
	border: 1px solid #e0e7ff;
}
.bg-soft-green {
	background-color: #f0fdf4;
	color: #065f46;
	border: 1px solid #bbf7d0;
}
.bg-soft-orange {
	background-color: #fff7ed;
	color: #9a3412;
	border: 1px solid #ffedd5;
}
.bg-soft-purple {
	background-color: #faf5ff;
	color: #6d28d9;
	border: 1px solid #f3e8ff;
}
.bg-soft-pink {
	background-color: #fff1f2;
	color: #be185d;
	border: 1px solid #ffdde0;
}
.bg-soft-teal {
	background-color: #ecfeff;
	color: #0f766e;
	border: 1px solid #cffafe;
}
.bg-soft-cyan {
	background-color: #ecfeff;
	color: #0369a1;
	border: 1px solid #cffafe;
}
.bg-soft-gray {
	background-color: #f7f7f8;
	color: #374151;
	border: 1px solid #e6e7e9;
}

/* Text-only soft helpers */
.text-soft-primary {
	color: #0d6efd;
}
.text-soft-secondary {
	color: #6c757d;
}
.text-soft-success {
	color: #16a34a;
}
.text-soft-danger {
	color: #dc2626;
}
.text-soft-warning {
	color: #b45309;
}
.text-soft-info {
	color: #0891b2;
}
.text-soft-dark {
	color: #0f172a;
}

/* Border-only soft helpers */
.border-soft-primary {
	border: 1px solid #dbeafe !important;
}
.border-soft-secondary {
	border: 1px solid #e5e7eb !important;
}
.border-soft-success {
	border: 1px solid #bbf7d0 !important;
}
.border-soft-danger {
	border: 1px solid #fecaca !important;
}
.border-soft-warning {
	border: 1px solid #fef3c7 !important;
}
.border-soft-info {
	border: 1px solid #cfeffb !important;
}
.border-soft-dark {
	border: 1px solid #dbe7f5 !important;
}

/* Utility: softer padding + rounded for soft badges/cards */
.soft-pill {
	padding: 0.25rem 0.6rem;
	border-radius: 0.375rem;
	display: inline-block;
	font-weight: 600;
}

.border-danger {
	border: 1px solid rgba(255, 91, 91, 0.25);
}

.row_hover {
	border: 1px solid rgba(113, 182, 249, 0.2);
	background-color: rgba(113, 182, 249, 0.25);
	color: #71b6f9;
	cursor: pointer;
}

.row_select {
	border: 1px solid rgba(16, 196, 105, 0.2);
	background-color: rgba(16, 196, 105, 0.25);
	color: #10c469;
	cursor: pointer;
}

hr.red {
	border-top: 1px solid rgba(255, 91, 91, 0.5);
}

.red {
	color: red;
}

.blue {
	color: blue;
}

.black {
	color: #000000;
}

.avatar {
	cursor: pointer;
}

.all_red {
	border: 1px solid red;
}

.btm_red {
	/*border-bottom: 1px solid rgba(113, 182, 249, 0.2) !important;*/
	border-bottom: 1px solid rgba(255, 0, 0, 0.5);
	padding-bottom: 0px !important;
}

.top_red {
	border-top: 1px solid rgba(255, 0, 0, 0.5);
	padding-top: 0px;
}

.top_red2 {
	border-top: 2px solid rgba(255, 0, 0, 0.5);
	padding-top: 0px;
}

.btm_blue {
	border-bottom: 1px solid rgba(113, 182, 249, 0.5);
	padding-bottom: 0px;
}

.border_blue {
	/*border-bottom: 1px solid rgba(113, 182, 249, 0.2) !important;*/
	border: 1px solid rgba(113, 182, 249, 0.5);
	/*padding-bottom:  0px !important;*/
}

.btm_black {
	/*border-bottom: 1px solid rgba(113, 182, 249, 0.2) !important;*/
	border-bottom: 0.3px solid #333;
	padding-bottom: 0px !important;
}

.btm_dot {
	/*border-bottom: 1px #000000;*/
	border-style: none none dotted none;
	border-width: 2px;
}

.light-blue {
	background-color: rgba(113, 182, 249, 0.3);
}

.light-warning {
	background-color: rgba(249, 200, 81, 0.3);
}

.light-success {
	background-color: rgba(16, 196, 105, 0.3);
}

.tr_th {
	background-color: #ffffff;
	color: #000000;
	font-weight: bold;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: center;
}

.row-header,
.form-header {
	background-color: #004a99;
	color: #ffffff;
	font-weight: bold;
	padding-top: 5px;
	padding-bottom: 5px;
	vertical-align: middle;
	text-align: center;
}

.row-header-red {
	background-color: red;
	color: #ffffff;
	font-weight: bold;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: center;
}

.row-header2,
.form-header2 {
	background-color: #1c74d0;
	color: #ffffff;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: center;
}

.row-2nd-header {
	color: #000000;
	padding-top: 2px;
	padding-bottom: 2px;
	text-align: center;
	font-size: 12px;
}
.row-sub-header {
	border: 1px solid rgba(113, 182, 249, 0.5);
	background-color: rgba(113, 182, 249, 0.75);
	color: #ffffff;
	padding-top: 2px;
	padding-bottom: 2px;
	text-align: center;
}

.form-sub-header {
	background-color: rgba(0, 0, 204, 0.5);
	color: #ffffff;
	font-size: 11px;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: center;
}

.form-footer {
	background-color: #ece98b;
	color: #000000;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: center;
}

td.agree {
	vertical-align: top;
}

td {
	word-break: break-all;
}

div.dataTables_wrapper {
	width: auto;
	margin: 0 auto;
	padding: 0;
}

th {
	text-transform: uppercase;
	text-align: center;
	border-right: 1px solid #ffffff;
}

.bt-fix {
	margin-top: 5px;
	cursor: pointer;
	/*font-size: 11px;*/
}

.btn-fix {
	cursor: pointer;
	margin-top: 5px;
	margin-right: 2px;
	font-size: 13px;
}

.btn-xs {
	height: 24px;
}

.btn-xxs {
	margin-top: 5px;
	width: 23px;
	height: 23px;
	padding: 3px;
	font-size: 11px;
}

.form-fixx {
	padding: 2px 2px 2px 2px;
}

.form-fix {
	padding: 2px 5px 2px 5px;
	height: 25px;
	margin: 1px;
	font-size: 12px;
	font-family: Tahoma;
}

select.form-fix {
	padding: 0 0 0 0;
	height: 24px;
	margin: 1px;
	font-size: 12px;
	font-family: Tahoma;
}

.form-sm {
	padding: 2px 5px 2px 5px;
}

.lbl-fix {
	font-size: 12px;
}

.form-fix2 {
	padding-left: 2px;
	padding-right: 2px;
}

.form-big {
	padding: 5px;
	/*height: 26px;*/
	/*margin: 3px;*/

	font-size: 30px;
	font-weight: bold;
	font-family: Tahoma;
}

.fix2 {
	padding: 2px;
	height: 26px;
	margin: 2px;
}

.col-fix {
	padding: 1px 4px 0px 4px;
}

.col-fix0 {
	padding-top: 2px;
	padding-left: 0px;
	padding-right: 0px;
	text-align: center;
}

.row-fix {
	margin: 1px 0px -5px 0px;
	padding: 0px;
}

hr.red {
	border-top: 1px solid rgba(255, 91, 91, 0.5);
	margin: 5px;
}

li.nol {
	padding: 0px;
}

li.nol:hover {
	background-color: rgba(0, 152, 253, 0.2);
}

li.sub_nol {
	background-color: transparent;
}

li.sub_nol:hover {
	border-top: 2px solid rgba(255, 91, 91, 0.3);
	border-bottom: 2px solid rgba(255, 91, 91, 0.3);
	background-color: transparent;
	font-weight: bold;
}

.no_doc {
	color: blue;
	font-weight: bold;
	text-align: center;
}

.border_red {
	border: 1px solid rgba(255, 91, 91, 0.75);
}

.btm_red {
	border-bottom: 1px solid rgba(255, 91, 91, 0.5);
}

.btm_blue {
	border-bottom: 1px solid rgba(113, 182, 249, 0.75);
}

.btm_blue2 {
	padding-bottom: 5px;
	border-bottom: 2px solid rgba(113, 182, 249, 0.75);
}

.border_blue {
	border: 1px solid rgba(113, 182, 249, 0.75);
}

.table {
	border-collapse: collapse;
}

.f12 {
	font-size: 12px;
	font-family: Tahoma;
}

.f12_b {
	font-size: 12px;
	font-family: Tahoma;
	font-weight: bold;
}

.f13 {
	font-size: 13px;
	font-family: Tahoma;
}

.f13_b {
	font-size: 13px;
	font-family: Tahoma;
	font-weight: bold;
}

.f14_b {
	font-size: 14px;
	font-family: Tahoma;
	font-weight: bold;
}

.f11 {
	font-size: 11px;
	font-family: Tahoma;
}

.f10 {
	font-size: 10px;
	font-family: Tahoma;
}

.f10_b {
	font-size: 10px;
	font-family: Tahoma;
	font-weight: bold;
}

.f12_b {
	font-size: 12px;
	font-family: Tahoma;
	font-weight: bold;
}

.f9 {
	font-size: 9px;
	font-family: Tahoma;
}

.f8 {
	font-size: 8px;
	font-family: Tahoma;
}

.f14_b {
	font-size: 14px;
	font-family: Tahoma;
	font-weight: bold;
}

.f16 {
	font-size: 16px;
	font-family: Tahoma;
}

.f16_b {
	font-size: 16px;
	font-family: Tahoma;
	font-weight: bold;
}

.f18_b {
	font-size: 18px;
	font-family: Tahoma;
	font-weight: bold;
}

.popup_bg_2nd {
	display: none;
	/* Hidden by default */
	position: fixed;
	/* Stay in place */
	z-index: 9999;
	/* Sit on top */
	padding-top: 80px;
	/* Location of the box */
	left: 0;
	top: 0;
	width: 100%;
	/* Full width */
	height: 100%;
	/* Full height */
	overflow: auto;
	/* Enable scroll if needed */
	background-color: rgba(0, 0, 0, 0.4);
	/* Black w/ opacity */
}

.popup_content_2nd {
	background-color: #bdbdbd;
	border: 1px solid #faebcc;

	padding: 10px;
	max-width: 400px;
	margin: auto;
	font-size: 12px;
}

.r5 {
	text-align: right;
	padding-right: 5px;
}

.r4 {
	text-align: right;
	padding-right: 5px;
	padding-left: 5px;
}

.l4 {
	text-align: left;
	padding-left: 5px;
	padding-right: 5px;
}

.box-shadow {
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.btm_white {
	border-bottom: 1px solid rgba(255, 255, 255, 0.75);
}

.rb_white {
	border-right: 1px solid rgba(255, 255, 255, 0.75);
	border-bottom: 1px solid rgba(255, 255, 255, 0.75);
}

.r_c_white {
	border-right: 1px solid rgba(255, 255, 255, 0.75);
	text-align: center;
}

.r_l_white {
	border-right: 1px solid rgba(255, 255, 255, 0.75);
	text-align: left;
	left: 5px;
}

.r_r_white {
	border-right: 1px solid rgba(255, 255, 255, 0.75);
	text-align: right;
	padding-right: 5px;
}

.r_r_blue {
	border-right: 1px solid #90caf9;
	padding-right: 5px;
	text-align: right;
	vertical-align: top;
}

.r_r_black {
	border-right: 1px solid #000000;
	padding-right: 5px;
	text-align: right;
	vertical-align: middle;
}

.r_c_blue {
	padding: 2px 5px 2px 5px;
	border-right: 1px solid #90caf9;
	text-align: center;
	vertical-align: middle;
}

.rb_c_blue {
	border-right: 1px solid #90caf9;
	border-bottom: 1px solid #90caf9;
	text-align: center;

	vertical-align: middle;
}

.trb_c_blue {
	border-top: 1px solid #90caf9;
	border-right: 1px solid #90caf9;
	border-bottom: 1px solid #90caf9;
	text-align: center;

	vertical-align: middle;
}

.r_c_black {
	border-right: 1px solid #000000;
	text-align: center;
	vertical-align: middle;
}

.r_l_black {
	border-right: 1px solid #000000;
	padding-left: 5px;
	text-align: left;
	vertical-align: middle;
}

.r_l_blue {
	border-right: 1px solid #90caf9;
	padding-left: 5px;
	text-align: left;
	vertical-align: top;
}

.r_blue {
	padding-left: 5px;
	border-right: 1px solid #90caf9;
}

.l_blue {
	border-left: 1px solid #90caf9;
}

.rb_r_blue {
	border-right: 1px solid #90caf9;
	border-bottom: 1px solid #90caf9;
	padding-right: 5px;
	text-align: right;
}

.t_red {
	/*  border-top: 1px solid rgba(255, 91, 91, 0.75);*/
	border-top: 1px solid #ff5b5b;
}

.tb_red {
	border-top: 1px solid rgba(255, 91, 91, 0.75);
	border-bottom: 1px solid rgba(255, 91, 91, 0.75);
}

.b_red {
	border-bottom: 1px solid rgba(255, 91, 91, 0.75);
}

.r_r_red {
	border-right: 1px solid rgba(255, 91, 91, 0.75);
	padding-right: 5px;
	text-align: right;
}

.r_c_red {
	border-right: 1px solid rgba(255, 91, 91, 0.75);
	padding-right: 5px;
	text-align: center;
}

.lt_l_black {
	border-left: 1px solid #000000;
	border-top: 1px solid #000000;
	padding-left: 5px;
	text-align: left;
}

.lt_c_black {
	border-left: 1px solid #000000;
	border-top: 1px solid #000000;
	padding-right: 5px;
	text-align: center;
}

.lt_r_black {
	border-left: 1px solid #000000;
	border-top: 1px solid #000000;
	padding-left: 5px;
	text-align: right;
}

.l_c_black {
	border-left: 1px solid #000000;
	text-align: center;
}

.l_black {
	border-left: 1px solid #000000;
}

.r_black {
	border-right: 1px solid #000000;
}

.t_black {
	border-top: 1px solid #000000;
}

.b_black {
	border-bottom: 1px solid #000000;
}

.b_blue {
	border-bottom: 1px solid rgba(113, 182, 249, 0.8);
}

.image_frame {
	position: absolute;
	/* fixed or absolute */
	bottom: 150px;
	display: none;
	right: 20px;
	/*margin-right: auto;*/
	/*width: 50%;*/
	z-index: 999;
}

.btn-sm {
	height: 24px !important;
	padding: 1px 4px 2px 4px !important;
	margin-top: 2px !important;
}

.t_head {
	font-family: Tahoma;
	font-size: 12px;
	font-weight: bold;
	border: 1px solid #90caf9;
	border-collapse: collapse;
	text-align: center;
	border-spacing: 0;
	padding: 5px 0 5px 0;
}

.auto-matches {
	color: blue;
	background-color: rgba(255, 247, 0, 0.75);
}

label {
	margin-top: 5px;
}

/*.ui-autocomplete { height: 200px; overflow-y: scroll; overflow-x: hidden;}*/

.table .thead-light-blue th {
	/*  border: 1px solid rgba(113, 182, 249, 0.2) !important;
  background-color: rgba(113, 182, 249, 0.25) !important;
  color: #71b6f9 !important;*/

	vertical-align: middle;
	color: #000;
	background-color: rgba(113, 182, 249, 0.75);
	/*border-color: rgba(113, 182, 249, 0.75);*/
	border-color: #000;
}

.table-grid {
	table-layout: fixed;
	border-collapse: collapse;
	cellpadding: 0;
	cellspacing: 0;
	border-spacing: 0px;
	margin-left: 0;
	/*margin-right: auto;*/
}

.table-grid > tr > td {
	padding: 0;
	/*word-wrap:break-word;*/
	word-break: break-all;
}

.table-grid > thead > tr > th,
.table-grid > tbody > tr > th,
.table-grid > tfoot > tr > th,
.table-grid > thead > tr > td,
.table-grid > tbody > tr > td,
.table-grid > tfoot > tr > td {
	border: 1px solid rgba(113, 182, 249, 0.75);
	vertical-align: top;
}

.table-grid .table-grid td {
	border-top: 0;
	border-right: 1px solid rgba(113, 182, 249, 0.75);
	border-bottom: 0;
	border-left: 0;
	vertical-align: top;
}

.table-grid .table-grid td:last-child,
.table-grid .table-grid th:last-child {
	border-right: 0;
}

.table-wrap td {
	white-space: normal;
	word-break: break-word;
	overflow-wrap: break-word;
	max-width: 300px; /* Sesuaikan dengan kebutuhan */
	padding: 2px 5px 2px 5px !important;
	border: 1px solid #ccc;
}

.form_label {
	color: #000000;
	font-weight: bold;
	margin-top: 5px;
}

.help_card {
	position: fixed;
	top: 80px;
	left: 20px;
	z-index: 995;
	border: 2px solid blue;
	width: 210px;
	height: 500px;
	background-image: url("https://mfg-isys.tosamaabadi.com/erp/assets/images/kertas.png");
	/*opacity: 1;*/
	-webkit-box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.15);
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	color: black;
	display: none;
}

.help_card_body {
	z-index: 996;
	color: black;
	opacity: 1;
	font-size: 12px;
	font-family: Tahoma;
}

.keep_scroll::-webkit-scrollbar {
	display: none;
}

.thin-scroll {
	scrollbar-width: thin;
}

.rack:hover {
	background-color: rgba(255, 91, 91, 0.25);
	color: #ff5b5b;
	cursor: pointer;
}

.center {
	display: flex;
	justify-content: center;
	align-items: center;
	/*  height: 200px;
  border: 3px solid green;*/
}

.label-fix {
	margin-top: 5px;
}

.big-font {
	font-size: 8em;
	font-weight: bold;
	font-family: Tahoma;
}

.big-font-7 {
	font-size: 7em;
	font-weight: bold;
	font-family: Tahoma;
}

.big-font-9 {
	font-size: 9em;
	font-weight: bold;
	font-family: Tahoma;
}

.bg-plan {
	background-color: blue;
	color: yellow;
}

.bg-actual {
	border: 3px solid blue;
	color: blue;
}

.toast-top-center {
	top: 25px;
}

.brs-hvr {
	cursor: pointer;
}

.brs-hvr:hover {
	color: blue;
}

/* #scroll-to-bottom {
  position: fixed;
  bottom: 40px;
  right: 20px;
  z-index: 99;
  font-size: 14px;
  border: none;
  outline: none;
  background-color: purple;
  color: white;
  cursor: pointer;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 13px;
  padding-left: 13px;
  border-radius: 100%;
} */
#scroll-to-top-btn,
#scroll-to-bottom-btn {
	display: none;
	position: fixed;
	z-index: 99;
	font-size: 16px;
	padding: 10px 15px;
	border: none;
	border-radius: 100%;
	background-color: rgb(61, 61, 61);
	color: white;
	cursor: pointer;
	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25);
}

#scroll-to-top-btn {
	bottom: 20px;
	right: 20px;
}

#scroll-to-bottom-btn {
	bottom: 20px;
	right: 20px;
}

#scroll-to-top-btn:hover,
#scroll-to-bottom-btn:hover {
	box-shadow: 0px 0px 10px 8px rgba(0, 0, 0, 0.25);
}

.bg-blue-1 {
	background-color: #007bff !important;
}

.btn-primary-1 {
	color: #fff;
	background-color: #007bff;
	border-color: #007bff;
}

.btn-primary-1:hover {
	color: #fff;
	background-color: #0069d9;
	border-color: #0062cc;
}

.data_content,
#data_content,
.tableFixHead {
	max-height: 65vh;
	overflow-y: auto;
	overflow-x: hidden;
}

.tableFixHead::-webkit-scrollbar,
.data_content::-webkit-scrollbar,
.scroll-bar-x::-webkit-scrollbar,
#data_content::-webkit-scrollbar {
	width: 5px;
	/* Lebar scrollbar */
	height: 10px;
	/* Tinggi scrollbar */
}

.tableFixHead::-webkit-scrollbar-thumb,
.data_content::-webkit-scrollbar-thumb,
.scroll-bar-x::-webkit-scrollbar-thumb,
#data_content::-webkit-scrollbar-thumb {
	background-color: #888;
	/* Warna latar belakang thumb scrollbar */
	border-radius: 5px;
	/* Radius thumb scrollbar */
}

.tableFixHead::-webkit-scrollbar-thumb:hover,
.data_content::-webkit-scrollbar-thumb:hover,
.scroll-bar-x::-webkit-scrollbar-thumb:hover,
#data_content::-webkit-scrollbar-thumb:hover {
	background-color: #555;
	/* Warna latar belakang thumb scrollbar saat dihover */
}

.scroll-bar-x::-webkit-scrollbar {
	width: 1px;
	/* Lebar scrollbar */
	height: 4px;
	/* Tinggi scrollbar */
}

.scroll-bar-x::-webkit-scrollbar-thumb {
	background-color: #e9e9e9;
	/* Warna latar belakang thumb scrollbar */
	border-radius: 5px;
	/* Radius thumb scrollbar */
}

.scroll-bar-x::-webkit-scrollbar-thumb:hover {
	background-color: #555;
	/* Warna latar belakang thumb scrollbar saat dihover */
}

.border-end {
	border-right: 0.1rem solid #d9d9d9;
}

.border-1 {
	border: 0.1rem solid #d9d9d9;
}

.py-01 {
	padding-top: 0.1rem;
	padding-bottom: 0.1rem;
}

.radius-10 {
	border-radius: 10px;
	overflow: hidden;
}

.text-ellipsis {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.clear {
	background-color: transparent;
}

.f12_card {
	color: #000000;
	font-size: 12px;
	font-weight: bold;
	text-align: left;
}

.f14_card {
	color: #000000;
	font-size: 14px;
	font-weight: bold;
	text-align: left;
}

.name_card {
	text-align: left;
	font-weight: bold;
	color: #000000;
	display: inline-block;
	font-size: 30px;
	letter-spacing: 2px;
	transform: scale(1, 2.5);
	-webkit-transform: scale(1, 2.5);
	-moz-transform: scale(1, 2.5);
	-o-transform: scale(1, 2.5);
	transform-origin: 0% 60%;
}

.post_card {
	text-align: left;
	/* letter-spacing: 2px; */
	display: inline-block;
	font-size: 16px;
	/* transform: scaleY(0.5); */
	transform-origin: 0 0;
	margin-bottom: -50%;
}

.f16_card {
	color: #000000;
	font-size: 16px;
	font-weight: bold;
	text-align: left;
}

.f18_card {
	color: #000000;
	font-size: 18px;
	font-weight: bold;
	text-align: left;
}

.f20_card {
	color: #000000;
	font-size: 20px;
	font-weight: bold;
	text-align: left;
}

.f24_card {
	color: #000000;
	font-size: 24px;
	font-weight: bold;
	text-align: left;
}

.f32_card {
	color: #000000;
	font-size: 32px;
	font-weight: bold;
	text-align: left;
}

.id_card {
	/*  54 mm x 85.6 mm */
	/*  72pt = 25.4 mm */
	background-size: cover;
	max-width: 306pt;
	max-height: 486pt;
	background-repeat: no-repeat;
	top: 0;
	left: 0;
}

.visi_card {
	text-align: center;
	font-weight: bold;
	color: #000000;
	display: inline-block;
	font-size: 10px;
	letter-spacing: 2px;
	transform: scale(1, 2.5);
	-webkit-transform: scale(1, 2.5);
	-moz-transform: scale(1, 2.5);
	-o-transform: scale(1, 2.5);
	transform-origin: 0% 60%;
	text-decoration: underline;
}

#sidebar-menu > ul > li > ul {
	padding-left: 3vh !important;
}

.tableFixHead {
	overflow-y: auto;
	/* make the table scrollable if height is more than 200 px  */
	max-height: 73.5vh !important;
	/* gives an initial height of 200px to the table */
}

.tableFixHead thead tr:first-child th {
	position: sticky;
	top: -1px;
	z-index: 2;
	/* Pastikan baris pertama muncul di atas baris kedua */
}

.tableFixHead thead tr:nth-child(2) th {
	position: sticky;
	top: 27.4px;
	/* Sesuaikan sesuai dengan tinggi baris pertama */
	background-color: #eee;
	/* Warna latar belakang baris kedua */
	z-index: 1;
	/* Pastikan baris kedua berada di bawah baris pertama */
}

.tableFixHead tfoot td {
	position: sticky;
	/* make the table heads sticky */
	bottom: 0px;
	/* table head will be placed from the top of the table and sticks to it */
}

.tableFixHead table {
	border-collapse: collapse;
	/* make the table borders collapse to each other */
	/* width: 100%; */
}

.tableFixHead th,
.tableFixHead td {
	padding: 8px 16px;
	border: 1px solid #ccc;
}

.tableFixHead th {
	background: #eee;
}

.tableFixHead thead.bg-dark th {
	background: #2e2e2e;
}

.tableFixHead thead.bg-dark-blue th,
.tableFixHead thead tr:nth-child(2) th {
	background: #003063;
}

.tableFixHead thead.thead-dark th,
.tableFixHead thead tr:nth-child(2) th {
	background: #323a46;
}

.tableFixHead tfoot.bg-primary td {
	background-color: #6575ff;
}

.tableFixHead tfoot.bg-white td {
	background-color: #fff;
}

.tableFixHead tfoot.bg-eee td {
	background-color: #eee;
}

.bg-dark-blue {
	background-color: #003063;
}

input.bg-eee,
textarea.bg-eee {
	background-color: #eee !important;
}

.fs-5 {
	font-size: medium !important;
}

.select-row.active {
	background: #eee;
}

.select-row:hover {
	background: #eee;
	cursor: pointer;
}

.btn-primary-dark {
	color: #fff;
	background-color: #0069d9;
	border-color: #0069d9;
}

.btn-primary-dark:hover {
	color: #fff;
	background-color: #004792;
	border-color: #0062cc;
}

.btn-primary-dark:focus,
.btn-primary-dark.focus {
	box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
}

.btn-primary-dark.disabled,
.btn-primary-dark:disabled {
	color: #fff;
	background-color: #0069d9;
	border-color: #0069d9;
}

.btn-primary-dark:not(:disabled):not(.disabled):active,
.btn-primary-dark:not(:disabled):not(.disabled).active,
.show > .btn-primary-dark.dropdown-toggle {
	color: #fff;
	background-color: #0062cc;
	border-color: #005cbf;
}

.btn-primary-dark:not(:disabled):not(.disabled):active:focus,
.btn-primary-dark:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary-dark.dropdown-toggle:focus {
	box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
}

.text-middle {
	align-items: center;
	vertical-align: middle;
}

#ui-datepicker-div {
	z-index: 9999 !important;
}

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

.opacity-30 {
	opacity: 30% !important;
}

.row_bold {
	font-weight: bold;
}

.custom-table {
	border-collapse: collapse;
	width: 100%;
}

.custom-table th,
.custom-table td {
	border: 1px solid #ddd;
	padding: 8px;
	text-align: left;
}

.custom-table th {
	background-color: #f2f2f2;
}

.custom-table tr:nth-child(even) {
	background-color: #f2f2f2;
}

.bg-grey {
	background-color: #eee !important;
}

.fw-bold {
	font-weight: bold !important;
}

.myImg {
	border-radius: 5px;
	cursor: pointer;
	transition: 0.3s;
}

.myImg:hover {
	opacity: 0.7;
}

/* The Modal (background) */
.modal-img {
	display: none;
	/* Hidden by default */
	position: fixed;
	/* Stay in place */
	z-index: 1050;
	/* Sit on top */
	padding-top: 100px;
	/* Location of the box */
	left: 0;
	top: 0;
	width: 100%;
	/* Full width */
	height: 100%;
	/* Full height */
	overflow: auto;
	/* Enable scroll if needed */
	background-color: rgb(0, 0, 0);
	/* Fallback color */
	background-color: rgba(0, 0, 0, 0.507);
	/* Black w/ opacity */
}

/* Modal Content (image) */
.modal-img-content {
	margin: auto;
	display: block;
	width: 70%;
	max-width: 700px;
}

/* Caption of Modal Image */
#caption {
	margin: auto;
	display: block;
	width: 80%;
	max-width: 700px;
	text-align: center;
	color: #ccc;
	padding: 10px 0;
	height: 150px;
}

/* Add Animation */
.modal-img-content,
#caption {
	-webkit-animation-name: zoom;
	-webkit-animation-duration: 0.6s;
	animation-name: zoom;
	animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
	from {
		-webkit-transform: scale(0);
	}

	to {
		-webkit-transform: scale(1);
	}
}

@keyframes zoom {
	from {
		transform: scale(0);
	}

	to {
		transform: scale(1);
	}
}

/* The Close Button */
.close {
	position: absolute;
	top: 15px;
	right: 35px;
	color: #f1f1f1;
	font-size: 40px;
	font-weight: bold;
	transition: 0.3s;
}

.close:hover,
.close:focus {
	color: #bbb;
	text-decoration: none;
	cursor: pointer;
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px) {
	.modal-img-content {
		width: 100%;
	}
}

.fw-bold {
	font-weight: bold !important;
}

.mr_1 {
	margin-right: 2px;
}

.text-1 {
	color: #ff6384;
}

.text-2 {
	color: #fa970c;
}

.text-3 {
	color: #61ffca;
}

.text-4 {
	color: #43bdff;
}

.text-5 {
	color: #6a6ffe;
}

.text-6 {
	color: #b847f0;
}

.text-7 {
	color: #c04b9f;
}

.slice-1 {
	background-color: #ff6384;
}

.slice-2 {
	background-color: #faa938;
}

.slice-3 {
	background-color: #007200;
}

.slice-4 {
	background-color: #3fb8f9;
}

.slice-5 {
	background-color: #2e35ef;
}

.slice-6 {
	background-color: #b847f0;
}

.slice-7 {
	background-color: #c04b9f;
}

td.mini,
tr.mini {
	line-height: 22px;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 0px;
	padding-bottom: 0px;
	vertical-align: middle;
	font-size: 12px;
	font-family: Tahoma;
}

td.mini10,
tr.mini10 {
	line-height: 22px;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 0px;
	padding-bottom: 0px;
	vertical-align: middle;
	font-size: 10px;
	font-family: Tahoma;
}

td.mini11,
tr.mini11 {
	line-height: 22px;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 0px;
	padding-bottom: 0px;
	vertical-align: middle;
	font-size: 11px;
	font-family: Tahoma;
}

.top_title {
	line-height: 20px;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 0px;
	padding-bottom: 0px;
	vertical-align: middle;
	font-size: 12px;
	font-family: Tahoma;
	font-weight: bold;
}

.tdbreak {
	word-break: break-all;
}

.high_light {
	font-weight: bold;
	border-top: 1px solid #ff5b5b;
	border-bottom: 1px solid #ff5b5b;
}

.row_data:hover,
.row_data_new:hover {
	font-weight: bold;
	border-top: 1px solid #ff5b5b;
	border-bottom: 1px solid #ff5b5b;
}

.readonly {
	background: #f9f9845b !important;
}

.clear {
	color: transparent !important;
}

.btnn {
	cursor: pointer;
}

.btnn:focus {
	font-size: 100;
}

td.vtop {
	vertical-align: top;
}

.p-25 {
	padding-right: "30px";
	padding-left: "300px";
}

.p-510 {
	padding: "0 5px 10px 5px";
}

.angle {
	/* display: block; */
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); //For IE support
}

th span.text-vertical {
	-ms-writing-mode: tb-rl;
	-webkit-writing-mode: vertical-rl;
	writing-mode: vertical-rl;
	transform: rotate(180deg);
	white-space: nowrap;
}

#btnHelp {
	position: fixed;
	bottom: 30px;
	right: 30px;
	z-index: 1050;
	border-radius: 50%;
	width: 46px;
	height: 46px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24px;
}

.border-info {
	border: 1px solid #17a2b8 !important;
}

.border-success {
	border: 1px solid #28a745 !important;
}

.border-warning {
	border: 1px solid #ffc107 !important;
}

.border-dark-blue {
	border: 1px solid #23395d !important;
}

.text-red {
	color: red;
}

.text-green {
	color: green;
}

.text-blue {
	color: blue;
}

.bg-danger-100 {
	background-color: #ffd4da !important;
}

.border-start-5 {
	border-left-width: 5px !important;
	border-right-width: 0 !important;
	border-top-width: 0 !important;
	border-bottom-width: 0 !important;
	border-style: solid !important;
}

.pilih {
	font-weight: bold;
}

.text-end {
	text-align: right;
}

.badge-v2 {
	display: inline-block;
	padding: 0.35em 0.65em;
	font-size: 0.8em;
	font-weight: 600;
	line-height: 1;
	text-align: center;
	white-space: nowrap;
	vertical-align: baseline;
	border-radius: 0.5rem;
}

.badge-v2-pill {
	border-radius: 0.2rem;
}

.badge-v2-primary {
	background: #2563eb;
	color: #fff;
}

.badge-v2-secondary {
	background: #64748b;
	color: #fff;
}

.badge-v2-success {
	background: #22c55e;
	color: #fff;
}

.badge-v2-danger {
	background: #ef4444;
	color: #fff;
}

.badge-v2-warning {
	background: #facc15;
	color: #212529;
}

.badge-v2-info {
	background: #0ea5e9;
	color: #fff;
}

.badge-v2-light {
	background: #f3f4f6;
	color: #212529;
}

.badge-v2-dark {
	background: #334155;
	color: #fff;
}

.badge-v2-blue {
	background: #3b82f6;
	color: #fff;
}

.badge-v2-green {
	background: #10b981;
	color: #fff;
}

.badge-v2-orange {
	background: #fb923c;
	color: #fff;
}

.badge-v2-purple {
	background: #a21caf;
	color: #fff;
}

.badge-v2-pink {
	background: #ec4899;
	color: #fff;
}

.badge-v2-teal {
	background: #14b8a6;
	color: #fff;
}

.badge-v2-cyan {
	background: #06b6d4;
	color: #fff;
}

.badge-v2-brown {
	background: #92400e;
	color: #fff;
}

.badge-v2-gray {
	background: #9ca3af;
	color: #212529;
}

.badge-v2-soft {
	background: #f8fafc;
	color: #334155;
	border: 1px solid #e5e7eb;
}

.badge-v2-soft-blue {
	background: #eff6ff;
	color: #2563eb;
	border: 1px solid #dbeafe;
}

.badge-v2-soft-green {
	background: #ecfdf5;
	color: #10b981;
	border: 1px solid #d1fae5;
}

.badge-v2-soft-yellow {
	background: #fefce8;
	color: #ca8a04;
	border: 1px solid #fef9c3;
}

.badge-v2-soft-red {
	background: #fef2f2;
	color: #ef4444;
	border: 1px solid #fee2e2;
}

.badge-v2-soft-purple {
	background: #f5f3ff;
	color: #7c3aed;
	border: 1px solid #ede9fe;
}

.badge-v2-soft-orange {
	background: #fff7ed;
	color: #fb923c;
	border: 1px solid #ffedd5;
}

.badge-v2-soft-pink {
	background: #fdf2f8;
	color: #ec4899;
	border: 1px solid #fce7f3;
}

.badge-v2-soft-teal {
	background: #f0fdfa;
	color: #14b8a6;
	border: 1px solid #ccfbf1;
}

.badge-v2-soft-gray {
	background: #f3f4f6;
	color: #6b7280;
	border: 1px solid #e5e7eb;
}

.text-dark-blue {
	color: #1e3a8a;
}

.table-striped-soft tbody tr:nth-of-type(odd) {
	background-color: #f7f8fa !important;
}

.table-striped-soft tbody tr:nth-of-type(even) {
	background-color: #ffffff !important;
}

.table-striped-soft th,
.table-striped-soft td {
	border-color: #e5e7eb !important;
}

.read-only {
	background-color: #e9ecef !important;
}

/* Base button */
[class^="cbt-"],
[class*=" cbt-"] {
	padding: 8px 16px;
	font-size: 14px;
	border: none;
	border-radius: 6px;
	color: #fff;
	cursor: pointer;
	display: inline-block;
	transition: 0.2s;
}

/* Basic Colors */
.cbt-primary {
	background: #0d6efd;
}
.cbt-success {
	background: #198754;
}
.cbt-warning {
	background: #ffc107;
	color: #000;
}
.cbt-danger {
	background: #dc3545;
}
.cbt-info {
	background: #0dcaf0;
	color: #000;
}
.cbt-dark {
	background: #212529;
}
.cbt-light {
	background: #f8f9fa;
	color: #000;
}

/* Extra Colors */
.cbt-blue {
	background: #3b82f6;
}
.cbt-indigo {
	background: #6610f2;
}
.cbt-purple {
	background: #6f42c1;
}
.cbt-pink {
	background: #d63384;
}
.cbt-teal {
	background: #20c997;
}
.cbt-cyan {
	background: #0dcaf0;
}
.cbt-orange {
	background: #fd7e14;
}
.cbt-brown {
	background: #795548;
}
.cbt-grey {
	background: #6c757d;
}

/* Outline */
[class^="cbt-outline-"],
[class*=" cbt-outline-"] {
	background: transparent;
	border: 1px solid;
	color: inherit;
}

.cbt-outline-primary {
	color: #0d6efd;
	border-color: #0d6efd;
}
.cbt-outline-success {
	color: #198754;
	border-color: #198754;
}
.cbt-outline-warning {
	color: #ffc107;
	border-color: #ffc107;
}
.cbt-outline-danger {
	color: #dc3545;
	border-color: #dc3545;
}
.cbt-outline-info {
	color: #0dcaf0;
	border-color: #0dcaf0;
}
.cbt-outline-dark {
	color: #212529;
	border-color: #212529;
}
.cbt-outline-orange {
	color: #fd7e14;
	border-color: #fd7e14;
}

/* Shapes */
.cbt-rounded {
	border-radius: 10px;
}
.cbt-pill {
	border-radius: 50px;
}
.cbt-square {
	border-radius: 0;
}

/* Sizes */
.cbt-sm {
	padding: 4px 10px;
	font-size: 12px;
}
.cbt-md {
	padding: 8px 16px;
	font-size: 14px;
}
.cbt-lg {
	padding: 12px 22px;
	font-size: 16px;
}

/* Hover states for .cbt buttons */
.cbt-primary:hover {
	background: #0b5ed7;
	box-shadow: 0 2px 8px 0 rgba(13, 110, 253, 0.15);
}
.cbt-success:hover {
	background: #157347;
	box-shadow: 0 2px 8px 0 rgba(25, 135, 84, 0.15);
}
.cbt-warning:hover {
	background: #e0a800;
	color: #000;
	box-shadow: 0 2px 8px 0 rgba(255, 193, 7, 0.15);
}
.cbt-danger:hover {
	background: #bb2d3b;
	box-shadow: 0 2px 8px 0 rgba(220, 53, 69, 0.15);
}
.cbt-info:hover {
	background: #0aa2c0;
	color: #000;
	box-shadow: 0 2px 8px 0 rgba(13, 202, 240, 0.15);
}
.cbt-dark:hover {
	background: #1a1e21;
	box-shadow: 0 2px 8px 0 rgba(33, 37, 41, 0.15);
}
.cbt-light:hover {
	background: #e2e6ea;
	color: #000;
	box-shadow: 0 2px 8px 0 rgba(248, 249, 250, 0.15);
}
.cbt-blue:hover {
	background: #2563eb;
	box-shadow: 0 2px 8px 0 rgba(59, 130, 246, 0.15);
}
.cbt-indigo:hover {
	background: #520dc2;
	box-shadow: 0 2px 8px 0 rgba(102, 16, 242, 0.15);
}
.cbt-purple:hover {
	background: #59359c;
	box-shadow: 0 2px 8px 0 rgba(111, 66, 193, 0.15);
}
.cbt-pink:hover {
	background: #ad2167;
	box-shadow: 0 2px 8px 0 rgba(214, 51, 132, 0.15);
}
.cbt-teal:hover {
	background: #13896b;
	box-shadow: 0 2px 8px 0 rgba(32, 201, 151, 0.15);
}
.cbt-cyan:hover {
	background: #0997b3;
	box-shadow: 0 2px 8px 0 rgba(13, 202, 240, 0.15);
}
.cbt-orange:hover {
	background: #c75c00;
	box-shadow: 0 2px 8px 0 rgba(253, 126, 20, 0.15);
}
.cbt-brown:hover {
	background: #5d4037;
	box-shadow: 0 2px 8px 0 rgba(121, 85, 72, 0.15);
}
.cbt-grey:hover {
	background: #495057;
	box-shadow: 0 2px 8px 0 rgba(108, 117, 125, 0.15);
}

/* Hover for outline buttons: fill background and invert color */
.cbt-outline-primary:hover {
	background: #0d6efd;
	color: #fff;
	box-shadow: 0 2px 8px 0 rgba(13, 110, 253, 0.15);
}
.cbt-outline-success:hover {
	background: #198754;
	color: #fff;
	box-shadow: 0 2px 8px 0 rgba(25, 135, 84, 0.15);
}
.cbt-outline-warning:hover {
	background: #ffc107;
	color: #000;
	box-shadow: 0 2px 8px 0 rgba(255, 193, 7, 0.15);
}
.cbt-outline-danger:hover {
	background: #dc3545;
	color: #fff;
	box-shadow: 0 2px 8px 0 rgba(220, 53, 69, 0.15);
}
.cbt-outline-info:hover {
	background: #0dcaf0;
	color: #000;
	box-shadow: 0 2px 8px 0 rgba(13, 202, 240, 0.15);
}
.cbt-outline-dark:hover {
	background: #212529;
	color: #fff;
	box-shadow: 0 2px 8px 0 rgba(33, 37, 41, 0.15);
}
.cbt-outline-orange:hover {
	background: #fd7e14;
	color: #fff;
	box-shadow: 0 2px 8px 0 rgba(253, 126, 20, 0.15);
}

/* Fokus: tambahkan border biru / ring pada tombol .cbt */
[class^="cbt-"]:focus,
[class*=" cbt-"]:focus,
[class^="cbt-"]:focus-visible,
[class*=" cbt-"]:focus-visible {
	outline: none;
	border: 1px solid #3b82f6;
	box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.18);
}

/* Variant outline: jaga ring agar terlihat pada fokus keyboard */
[class^="cbt-outline-"]:focus,
[class*=" cbt-outline-"]:focus,
[class^="cbt-outline-"]:focus-visible,
[class*=" cbt-outline-"]:focus-visible {
	outline: none;
	box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.18);
}

/* Disabled state for .cbt buttons (by attribute or :disabled) */
[class^="cbt-"][disabled],
[class*=" cbt-"][disabled],
[class^="cbt-outline-"][disabled],
[class*=" cbt-outline-"][disabled],
[class^="cbt-"]:disabled,
[class*=" cbt-"]:disabled,
[class^="cbt-outline-"]:disabled,
[class*=" cbt-outline-"]:disabled {
	opacity: 0.6;
	cursor: not-allowed;
	pointer-events: none;
	filter: grayscale(30%) brightness(95%);
	box-shadow: none !important;
	transform: none !important;
	transition: none !important;
}

/* Tweak for outline variants: mute border/text when disabled */
[class^="cbt-outline-"][disabled],
[class*=" cbt-outline-"][disabled],
[class^="cbt-outline-"]:disabled,
[class*=" cbt-outline-"]:disabled {
	background: transparent !important;
	color: rgba(0, 0, 0, 0.55) !important;
	border-color: rgba(0, 0, 0, 0.12) !important;
}

/* Prevent hover/focus visual changes on disabled buttons */
[class^="cbt-"][disabled]:hover,
[class*=" cbt-"][disabled]:hover,
[class^="cbt-outline-"][disabled]:hover,
[class*=" cbt-outline-"][disabled]:hover,
[class^="cbt-"][disabled]:focus,
[class*=" cbt-"][disabled]:focus,
[class^="cbt-outline-"][disabled]:focus,
[class*=" cbt-outline-"][disabled]:focus {
	box-shadow: none !important;
	background: inherit !important;
}

.bgr-primary {
	background-color: #0d6efd !important;
}
.bgr-success {
	background-color: #198754 !important;
}
.bgr-warning {
	background-color: #ffc107 !important;
}
.bgr-danger {
	background-color: #dc3545 !important;
}
.bgr-info {
	background-color: #0dcaf0 !important;
}
.bgr-dark {
	background-color: #212529 !important;
}
.bgr-light {
	background-color: #f8f9fa !important;
}
.bgr-blue {
	background-color: #3b82f6 !important;
}
.bgr-indigo {
	background-color: #6610f2 !important;
}
.bgr-purple {
	background-color: #6f42c1 !important;
}
.bgr-pink {
	background-color: #d63384 !important;
}
.bgr-teal {
	background-color: #20c997 !important;
}
.bgr-cyan {
	background-color: #0dcaf0 !important;
}
.bgr-orange {
	background-color: #fd7e14 !important;
}
.bgr-brown {
	background-color: #795548 !important;
}
.bgr-grey {
	background-color: #6c757d !important;
}

.text-capitalized,
.text-capitalized th,
.text-capitalized td {
	text-transform: capitalize !important;
}

/* Sticky semua kolom aksi di kanan tabel */
.sticky-action {
	position: sticky;
	right: 0;
	background: #fff;
	z-index: 2;
	box-shadow: -8px 0 16px -4px rgba(0, 0, 0, 0.12);
}

thead .sticky-action {
	z-index: 30 !important;
}

tbody .sticky-action {
	z-index: 2;
	background-color: cornsilk !important;
}

/* align-middle for cells */
.align-middle,
.align-middle th,
.align-middle td {
	vertical-align: middle !important;
}

.tableFixHead.p-small table tr th,
.tableFixHead.p-small table tr td {
	padding: 0.25rem !important;
}

.cbt-secondary {
	background: #6c757d;
}

.table thead.text-capitalize,
.table thead.text-capitalize th,
.table thead.text-capitalize td {
	text-transform: capitalize !important;
}

.overflow-x-auto {
	overflow-x: auto !important;
}