@font-face {
	font-family: "SVN-Gilroy";
	src: url('../sosene/app-assets/fonts/SVN-Gilroy_Black.otf') format('opentype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "SVN-Gilroy";
	src: url('../sosene/app-assets/fonts/SVN-Gilroy_Black_Italic.otf') format('opentype');
	font-weight: normal;
	font-style: italic;
}

@font-face {
	font-family: "SVN-Gilroy";
	src: url('../sosene/app-assets/fonts/SVN-Gilroy_Regular.otf') format('opentype');
	font-weight: 300;
	font-style: normal;
}

@font-face {
	font-family: "SVN-Gilroy";
	src: url('../sosene/app-assets/fonts/SVN-Gilroy_Regular.otf') format('opentype');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: "SVN-Gilroy";
	src: url('../sosene/app-assets/fonts/SVN-Gilroy_Italic.otf') format('opentype');
	font-weight: 400;
	font-style: italic;
}

@font-face {
	font-family: "SVN-Gilroy";
	src: url('../sosene/app-assets/fonts/SVN-Gilroy_Medium.otf') format('opentype');
	font-weight: 500;
	font-style: normal;
}

@font-face {
	font-family: "SVN-Gilroy";
	src: url('../sosene/app-assets/fonts/SVN-Gilroy_Medium_Italic.otf') format('opentype');
	font-weight: 500;
	font-style: italic;
}

@font-face {
	font-family: "SVN-Gilroy";
	src: url('../sosene/app-assets/fonts/SVN-Gilroy_SemiBold.otf') format('opentype');
	font-weight: 600;
	font-style: normal;
}

@font-face {
	font-family: "SVN-Gilroy";
	src: url('../sosene/app-assets/fonts/SVN-Gilroy_SemiBold_Italic.otf') format('opentype');
	font-weight: 600;
	font-style: italic;
}

@font-face {
	font-family: "SVN-Gilroy";
	src: url('../sosene/app-assets/fonts/SVN-Gilroy_Bold.otf') format('opentype');
	font-weight: bold;
	font-style: normal;
}

@font-face {
	font-family: "SVN-Gilroy";
	src: url('../sosene/app-assets/fonts/SVN-Gilroy_Black_Italic.otf') format('opentype');
	font-weight: bold;
	font-style: italic;
}

body {
	font-family: "SVN-Gilroy" !important;
	/*font-size: 16px;*/
}

html body table p {
	margin-top: revert;
}

.page-item.active .page-link {
	z-index: 3;
	border-radius: 5rem;
	background-color: rgb(235, 61, 99);
	color: #fff !important;
	font-weight: 600;
}

.lightbox svg {
	position: relative;
	top: -5px;
	right: 2px;
	width: 1rem;
	height: 1rem;
	fill: red;
}

.lightbox button.btn-close {
	background: white !important;
	border-radius: 4em;
	padding: 1rem !important;
}

.waves-ripple {
	opacity: 0 !important;
}

.lightbox-carousel .ratio {
	background: transparent !important;
}

.lightbox-caption {
	font-size: 2.5rem;
	position: relative;
	bottom: 30px;
}

.feather {
	width: 1.3rem;
	height: 1.3rem;
}

input[type=search]::-webkit-search-cancel-button {
	-webkit-appearance: searchfield-cancel-button;
}

.btn.btn-sm {
	box-shadow: none;
	font-weight: 500;
	margin: 0.1rem;
}

.tree-demo ul li {
	padding-bottom: 10px;
}

a {
	color: rgb(235, 61, 99);
	text-decoration: none;
}

a:hover,
a.nav-link:hover,
a.nav-link:focus {
	color: rgba(235, 61, 99, 0.7);
	text-decoration: none;
}

.main-menu .navbar-header .navbar-brand .brand-text {
	color: white;
	padding-left: 1rem;
	margin-bottom: 0;
	font-weight: 600;
	letter-spacing: 0.01rem;
	font-size: 1.45rem;
	animation: 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) 0s normal forwards 1 fadein;
}

.modal-content .from-group-object {
	padding: 1rem 0;
}

.modal-content #sale_list_item_form {
	padding: 20px;
}

p.currency_value {
	margin-bottom: 0 !important;
}

.card .toggle-vis.status-false {}

.card .toggle-vis .unchecked {
	display: none;
}

.card .toggle-vis.status-true .checked,
.card .toggle-vis.status-false .unchecked {
	display: initial !important;
}

.card .toggle-vis.status-true .unchecked,
.card .toggle-vis.status-false .checked {
	display: none;
}


.header-navbar .navbar-container ul.navbar-nav li.dropdown-user .dropdown-menu {
	width: 14rem;
}

.main-menu .navbar-header .navbar-brand .brand-logo img {
	max-width: 55px;
}

div.dataTables_wrapper div.dataTables_info {
	margin-left: 20px;
}

div.dataTables_wrapper div.dataTables_paginate {
	margin-right: 20px;
}

.form-group>* {
	flex-shrink: 0;
	width: 100%;
	max-width: 100%;
	padding-right: calc(var(--bs-gutter-x) * .5);
	padding-left: calc(var(--bs-gutter-x) * .5);
	margin-top: var(--bs-gutter-y);
}

/*.form-control {
    text-transform: capitalize;
}
*/

.m-t-sm {
	margin-bottom: 1rem !important;
}

.form-group.m-t-sm {
	margin-bottom: 0.6rem !important;
}

.modal-title {
	text-transform: capitalize;
}

.form-select-sm {
	min-height: 2.142rem;
}

table.dataTable td {
	padding: 0.4rem 0.3rem;
	vertical-align: middle;
	font-size: 1.1em;
}

table.dataTable th {
	vertical-align: middle;
	text-align: left;
	padding: 0.4rem;
}

table.dataTable tr>td:last-child:not(:first-child) {
	text-align: right;
}

td.dataTables_empty {
	text-align: center;
	padding: 20px 0;
}

.dataTables_wrapper .dataTables_processing {
	position: absolute;
	top: 70%;
	left: 50%;
	width: 30%;
	height: 40px;
	margin-left: -20%;
	margin-top: -25px;
	padding-top: 20px;
	text-align: center;
	font-size: 1.2em;
	background: none;
}

.table> :not(caption)>*>* {
	padding: 0.2rem 0.5rem !important;
	vertical-align: middle !important;
}

.checkbox-list {
	text-align: center;
}

/*.btn-action {
    max-width: 2rem !important;
    width: 2rem !important;
}*/

.btn-action {
	max-width: fit-content !important;
	/* width: auto !important; */
	min-width: fit-content !important;
}

#employee_working_time_table .btn-action {
	width: 60px !important;
}

#sale_list_return_table .btn-action,
#store_list_check_table .btn-action,
#store_list_transfer_table .btn-action,
#store_list_export_table .btn-action,
#store_list_import_paid_table .btn-action-ajax,
#sale_list_deposit_table .btn-action-ajax,
#sale_list_item_table .total-list .btn-action-ajax {
	width: fit-content !important;
	max-width: fit-content !important;
}

table .total-list {
	/*width: 16rem !important;
    max-width: 16rem !important;*/
}

.btn.btn-sm.btn-icon {
	margin: 3px !important;
}

.return-alert {
	margin-bottom: 0.2rem !important;
}

.return-alert a:hover {
	text-decoration: underline;
}

.return-alert.alert .alert-body {
	padding: 0.5rem 0.5rem !important;
}

.return-alert a:hover {
	text-decoration: underline;
}

.term-list ul {
	font-size: 12px;
}

.avatar .avatar-content {
	width: 45px;
	height: 45px;
}

.btn-sale-top-bar {
	margin-right: 20px;
}

.avatar .avatar-content .avatar-icon {
	height: 1.8rem;
	width: 1.8rem;
}


.header-navbar .navbar-container ul.navbar-nav li>a.nav-link,
a.nav-link {
	color: #000;
	padding: 0 0.5rem;
	position: relative;
}

.header-navbar .navbar-container ul.navbar-nav li svg.ficon {
	color: #000 !important;
}

.header-navbar h4,
.header-navbar h4 {
	margin-top: 0;
	margin-bottom: 0.5rem;
	font-family: inherit;
	font-weight: 500;
	line-height: 1.2;
	color: #000;
}

.btn-sale-custom {
	line-height: inherit !important;
	border: 0 !important;
	width: auto;
	font-size: 1.5rem;
	padding: 0px;
	margin: 0 !important;
	text-align: left;
	padding-left: 1rem;
}

.main-menu .navbar-header .navbar-brand {
	display: flex;
	align-items: center;
	margin-top: 0.45rem;
	font-size: inherit;
}

.main-menu .navbar-header .navbar-brand .brand-text small {
	display: block;
}

.btn-sale-custom .feather {
	vertical-align: middle;
	height: 1.5rem;
	width: 1.5rem;
}

.navbar-floating .navbar-container:not(.main-menu-content) {
	/*padding: 0.8rem 1rem;*/
	padding: 0;
}

.nav-custom {
	padding: 0.8rem 1rem;
}

.bookmark-wrapper {
	height: 62px;
}

.header-navbar .navbar-container ul.navbar-nav li svg.ficon {
	color: #000;
}

.nav-item .d-flex.flex-row {
	width: 150px;
}

@media screen and (min-width: 991px) and (max-width: 1334px) {
	.d-lg-block {
		display: none !important;
	}
}

.btn-preorder-screen,
.btn-sale-screen {
	height: 63px;
	font-size: 20px;
	border-radius: 0 !important;
}

.btn-preorder-screen .feather,
.btn-sale-screen .feather {
	vertical-align: middle;
	height: 1.5rem;
	width: 1.5rem;

}

/*.select2-container--classic .select2-selection--single, .select2-container--default .select2-selection--single {
    min-height:2.142rem !important;
    padding:0;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
    top: 35%;
}*/

.btn-sm,
.btn-group-sm>.btn {
	padding: 0.486rem 0.5rem;
}

.card-body {
	flex: 1 1 auto;
	padding: 1rem 1rem;
}

.main-menu.menu-light .navigation li:not(.disabled) a {
	color: #000;
	padding: 10px 15px 10px 22px;
	line-height: 1.45;
}

.main-menu.menu-light .navigation>li.open:not(.menu-item-closing)>a,
.main-menu.menu-light .navigation>li.sidebar-group-active>a {
	color: rgb(235, 61, 99) !important;
	font-weight: 600 !important;
	background: rgb(255, 247, 247) !important;
}

.modal form div.order-print {
	padding: 30px;
}

.header-navbar .membership h4 {
	color: #000 !important;
}

.header-navbar .navbar-container .membership .dropdown-menu-media {
	width: 20rem !important;
}

.membership .badge.badge-up {
	font-size: 0.586rem !important;
}

.vertical-overlay-menu .navbar .navbar-header {
	min-width: 200px !important;
	width: auto;
}

.main-menu .navbar-header .navbar-brand .brand-text {
	max-width: 210px;
	overflow: hidden;
	padding: 0;
	text-align: center;
}


.card-browser-states .avatar {
	margin-right: 1rem;
}

@media (max-width: 1199.98px) {
	.vertical-layout.vertical-menu-modern .navbar .navbar-header {
		width: 100%;
	}
}

@media (max-width: 1024px) {

	.btn-preorder-screen,
	.btn-sale-screen {
		display: none;
	}
}

@media (max-width: 767px) {
	.footer-static.footer-light {
		text-align: center !important;
	}

	/*html body .app-content {
        /* padding: calc(2rem - 0.8rem + 1.45rem + 1rem) calc(2rem - 0.8rem) 0 calc(2rem - 0.8rem) !important;
        padding: calc(2rem - 0.8rem + 1.45rem + 1rem) 10px 0 10px !important
    }*/
	.card-header {
		padding: 1rem;
	}

	.row {
		--bs-gutter-x: 0rem !important;
		--bs-gutter-y: 0.5rem !important;
	}

	.header-navbar .navbar-container .membership .dropdown-menu.dropdown-menu-media {
		width: 100% !important;
	}
}

@media (max-width: 380px) {
	.btn {
		margin: 2px 0;
	}
}

body {
	color: #000;
}

.table {
	--bs-table-bg: transparent;
	--bs-table-accent-bg: transparent;
	--bs-table-striped-color: #000;
	--bs-table-striped-bg: #fafafc;
	--bs-table-active-color: #000;
	--bs-table-active-bg: rgba(34, 41, 47, 0.1);
	--bs-table-hover-color: #6e6b7b;
	--bs-table-hover-bg: #f6f6f9;
	width: 100%;
	margin-bottom: 1rem;
	color: #000;
	vertical-align: middle;
	border-color: #ebe9f1;
}

.form-label {
	margin-bottom: 0.2857rem;
	font-size: 1.15rem;
	color: #000;
}

.card-congratulations {
	background: linear-gradient(118deg, rgb(255, 255, 255), rgba(255, 255, 255, 0.7));
	color: #000;
}

/*
.header-navbar {
    background:rgba(235,61,99,0.7) !important;
}

.top-bar-custom {
        background: linear-gradient(118deg, rgb(235,61,99), rgba(235,61,99, 0.7));
        color: #000 !important;
}


.main-menu.menu-light .navigation > li.active > a {
    background: linear-gradient(118deg, rgb(235,61,99), rgba(235, 61, 99, 0.9));
    box-shadow: 0 0 10px 1px rgba(235, 61, 99, 0.7);
    color: #fff;
    font-weight: 400;
    border-radius: 4px;
}
*/
.main-menu.menu-light .navigation>li.active>a {
	background: linear-gradient(118deg, #FFF7F7, #FFF7F7);
	box-shadow: none;
	color: rgb(235, 61, 99);
	font-weight: 600;
	border-radius: 5px;
}

.table-hover>tbody>tr:hover {
	--bs-table-accent-bg: #FFF7F7;
	color: rgb(235, 61, 99);
}

#is_loading {
	height: 100vh;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #000;
	width: 100%;
	z-index: 10000;
}

.span_container_btn {
	padding: 1rem 0;
}

#school_manage_class_table th.class_name {
	width: auto !important;
	min-width: 200px !important;
	max-width: 35% !important;
}

#school_manage_class_table th.date_start_end {
	width: auto !important;
	min-width: 20% !important;
	max-width: 25% !important;
}

#school_manage_class_table th.teacher {
	width: auto !important;
	min-width: 30% !important;
	max-width: 40% !important;
}

#school_manage_class_table th.number_student {
	width: auto !important;
	min-width: 50px !important;
	max-width: 20% !important;
}

#school_manage_class_table th.status_student {
	width: auto !important;
	min-width: 100px !important;
	max-width: 10% !important;
}

#school_manage_class_table th.updated_date {
	width: auto !important;
	min-width: 80px !important;
	max-width: 20% !important;
}

/*Manage Student */
#school_manage_student_table th.class {
	width: auto !important;
	min-width: 90px !important;
	max-width: 130px !important;
}

#school_manage_student_table th.student_name {
	width: auto !important;
	min-width: 200px !important;
	max-width: 45% !important;
}

#school_manage_student_table th.updated_by {
	width: auto !important;
	min-width: 140px !important;
	max-width: 180px !important;
}

#school_manage_student_table th.updated_date {
	width: auto !important;
	min-width: 95px !important;
	max-width: 100px !important;
}

#school_manage_student_table th.status_student {
	width: auto !important;
	min-width: 90px !important;
	max-width: 90px !important;
}

#school_manage_student_table tr,
#school_manage_student_table tr td {
	height: 100%;
}

#school_manage_student_table {
	height: 1px;
}

/*Manage Invoice*/
#school_manage_invoice_table tr,
#school_manage_invoice_table tr td {
	height: 100%;
}

#school_manage_invoice_table {
	height: 1px;
}

#school_manage_invoice_table th.title {
	width: auto !important;
	min-width: 50px !important;
	max-width: 55px !important;
}

#school_manage_invoice_table th.student_name {
	width: auto !important;
	max-width: 40% !important;
	min-width: 200px !important;
}

#school_manage_invoice_table th.class_name {
	width: auto !important;
	max-width: 20% !important;
	min-width: 110px !important;
}

#school_manage_invoice_table th.total_price {
	width: auto !important;
	max-width: 20% !important;
	min-width: 110px !important;
}

.pagebreak {
	page-break-before: always;
}

/*-------------------------------------------------------------------class detail--------------------------------------------------------------------------------- css*/
#tfoot th.date_month {
	text-align: center;
	vertical-align: middle;
}

#tfoot th.total_present {
	text-align: center;
	vertical-align: middle;
}

#tfoot th.total_absent {
	text-align: center;
	vertical-align: middle;
}

#tfoot {
	border-collapse: unset !important;
	border-top: 2px solid
}

.total_footer {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.container_print_modal {
	color: black !important;
	padding: 0 10px;
	overflow-y: auto;
	overflow-x: hidden;
	margin-top: 20px
}

#class_detail_table td div.error {
	width: 100%;
	height: 100%;
	background-color: #FF6666;
	display: flex;
	align-items: center;
	justify-content: center;
}

#class_detail_table td div.check {
	width: 100%;
	height: 100%;
	background-color: #99CC99;
	display: flex;
	align-items: center;
	justify-content: center;
}

#class_detail_table td div.none {
	width: 100%;
	height: 100%;
	background-color: #DCDCDC !important;
	display: flex;
	align-items: center;
	justify-content: center;
}

#class_detail_table td.name,
#class_detail_table th.name {
	text-align: left !important;
}

#class_detail_table_wrapper th {
	padding: 0 !important;
	font-size: 9px !important;
	text-align: center !important;
	height: 30px;
}

#class_detail_table td {
	padding: 0 !important;
	font-size: 11px !important;
	text-align: center;
}

#class_detail_table td.date_month,
#roadmap_detail_table td.date_month {
	min-width: 30px;
	min-height: 30px;
}

#class_detail_table th.student_name {
	min-width: 12rem;
}

#class_detail_table td.student_name {
	min-width: 12rem;
}

#class_detail_table thead tr th.name {
	text-align: center;
	vertical-align: middle;
}

#class_detail_table thead tr th.status {
	text-align: center;
	vertical-align: middle;
}

#class_detail_table thead tr th.start_date {
	text-align: center;
	vertical-align: middle;
}

#class_detail_table thead tr th.end_date {
	text-align: center;
	vertical-align: middle;
}

#class_detail_table tr.sub_header th {
	text-align: center;
}

#class_detail_table tfoot th {
	font-weight: 700 !important;
	/*font-size: 1.5rem !important;*/
	font-size: 10px !important;
}

#class_detail_table td.total_present,
#class_detail_table td.total_absent,
#class_detail_table td.rate {
	text-align: center !important;
	vertical-align: middle !important;
}

#class_detail_table tr td:nth-child(2) {
	padding-left: 5px !important;
	text-align: left !important;
}


#class_detail_table tr th.present,
#class_detail_table tr th.absent,
#class_detail_table tr th.rate {
	min-width: 60px !important;
	max-width: 60px !important;
}

#class_detail_table td:has(> div.none),
#class_detail_table td:has(> div.check),
#class_detail_table td:has(> div.error) {
	height: 30px !important;
}

#class_detail_table tr td:nth-child(1) {
	min-width: 2rem !important;
	max-width: 2rem !important;
}

#class_detail_table tr td:nth-child(2) {
	min-width: 10rem !important;
	max-width: 10rem !important;
	font-size: 12px !important;
	/*font-weight: 600 !important;*/
}

/*#class_detail_table tr td:nth-child(3) {
	display: none !important;
}*/
#class_detail_table tr th.present,
#class_detail_table tr th.absent,
#class_detail_table tr th.rate {
	min-width: 40px !important;
	max-width: 40px !important;
}

#class_detail_table td:has(> div.present),
#class_detail_table td:has(> div.absent),
#class_detail_table td:has(> div.rate) {
	min-width: 40px !important;
	max-width: 40px !important;
}

#class_detail_table td div.footer_present,
#class_detail_table td div.footer_absent {
	font-size: 12px !important;
	font-weight: 600 !important;
}

#class_detail_table_wrapper th.stt {
	width: 2rem !important
}

#class_detail_table_wrapper th.date_range {
	display: none !important;
}

#class_detail_table_wrapper th.student_name {
	min-width: 10rem !important;
	max-width: 10rem !important;
}

#class_detail_table_wrapper th.date_month {
	width: 30px !important;
	max-width: 30px !important;
	min-width: 30px !important;
	height: 20px;
}

#class_detail_table td:has(> div.date-off) {
	height: 30px !important;
}

#class_detail_table td,
#class_detail_table th,
#roadmap_detail_table th {
	border: 1px solid black
}

#class_detail_table th,
#history-shift_table th,
.close_shift_table th,
#roadmap_detail_table th {
	background-color: #00FFFF;
	font-weight: 700 !important;
	font-size: 11px !important;
}

#class_detail_table_info {
	color: black !important
}

#class_detail_table_paginate {
	display: none !important;
}

.container_print_modal h3 {
	color: black !important
}


.btn.btn-icon,
.btn.admin-btn {
	padding: 1rem !important;
}

.btn.pull-right {
	float: none !important;
}


.btn.btn-icon,
.btn.admin-btn {
	padding: 1rem !important;
}

.btn.pull-right {
	float: none !important;
}
.custom-label {
	padding-bottom: 0.2rem;
	font-size: 0.9rem;
}
/*print*/
@media screen {
	#signed_container {
		display: none;
		color: black !important
	}

	#header_print {
		display: none;
	}
}

@media print {
	#print_container_class {
		overflow: hidden !important;
	}

	#print_container_student {
		overflow: hidden !important;
		width: 100%;
		height: 100%;
	}

	#class_detail_table th {
		font-size: 10px !important;
	}

	#class_detail_table {
		color: black !important
	}

	#class_detail_table td.date_month {
		min-height: 20px !important;
	}

	#class_detail_table td:has>div.date-off {
		height: 20px !important;
	}

	#class_detail_table td:has>div.none,
	#class_detail_table td:has>div.check,
	#class_detail_table td:has>div.error {
		height: 20px !important;
	}

	#class_detail_table td div.date-off {
		background-color: gray !important;
		height: 100%;
		width: 100%;
	}

	#class_detail_table_info {
		display: none !important;
	}

	#class_detail_table_wrapper th.date_month {
		width: 1rem !important;
		max-width: 1rem !important;
		min-width: 1rem !important;
	}

	#class_detail_table_wrapper th.present,
	#class_detail_table_wrapper th.absent,
	#class_detail_table_wrapper th.rate {
		min-width: 40px !important;
		max-width: 40px !important;
	}

	#header_print {
		display: flex !important;
		color: black !important
	}

	#signed_container {
		display: block !important;
	}

	#class_detail_table td div.error,
	#class_detail_table td div.check,
	#class_detail_table td div.none {
		background-color: unset !important;
	}

	.container_print_modal {
		height: auto !important;
		overflow: hidden !important;
	}

	html body {
		background-color: white !important;
		font-family: "SVN-Gilroy";
	}
}

.btn.btn-icon,
.btn.admin-btn {
	padding: 0.8rem !important;
	vertical-align: middle;
	line-height: inherit;
}

.btn.pull-right {
	float: none !important;
}

/* #image_src img {
    max-width: 200px !important;
} */
.dataTables_empty {
	text-align: center !important;
}

#class_detail_table tr td {
	min-height: 20px !important;
	height: 20px !important;
}

/*-------------------------------------------------------------------class detail--------------------------------------------------------------------------------- css*/

/*-------------------------------------------------------------------class detail empty (class_detail_print_table)--------------------------------------------------------------------------------- css*/
#class_detail_print_table tr td {
	min-height: 20px !important;
	height: 20px !important;
}

#class_detail_print_table td.name,
#class_detail_print_table th.name {
	text-align: left !important;
}

#class_detail_print_table_wrapper th {
	padding: 0 !important;
	font-size: 9px !important;
	text-align: center !important;
	height: 30px;
}

#class_detail_print_table td {
	padding: 0 !important;
	font-size: 11px !important;
	text-align: center;
}

#class_detail_print_table td.date_month {
	min-width: 30px;
	min-height: 30px;
}

#class_detail_print_table th.student_name {
	min-width: 12rem;
}

#class_detail_print_table td.student_name {
	min-width: 12rem;
}

#class_detail_print_table thead tr th.name {
	text-align: center;
	vertical-align: middle;
}

#class_detail_print_table thead tr th.status {
	text-align: center;
	vertical-align: middle;
}

#class_detail_print_table thead tr th.start_date {
	text-align: center;
	vertical-align: middle;
}

#class_detail_print_table thead tr th.end_date {
	text-align: center;
	vertical-align: middle;
}

#class_detail_print_table tr.sub_header th {
	text-align: center;
}

#class_detail_print_table tfoot th {
	font-weight: 700 !important;
	/*font-size: 1.5rem !important;*/
	font-size: 10px !important;
}

#class_detail_print_table td.total_present,
#class_detail_print_table td.total_absent,
#class_detail_print_table td.rate {
	text-align: center !important;
	vertical-align: middle !important;
}

#class_detail_print_table tr td:nth-child(2) {
	padding-left: 5px !important;
	text-align: left !important;
}


#class_detail_print_table tr th.present,
#class_detail_print_table tr th.absent,
#class_detail_print_table tr th.rate {
	min-width: 60px !important;
	max-width: 60px !important;
}

#class_detail_print_table td:has(> div.none),
#class_detail_print_table td:has(> div.check),
#class_detail_print_table td:has(> div.error) {
	height: 30px !important;
}

#class_detail_print_table tr td:nth-child(1) {
	min-width: 2rem !important;
	max-width: 2rem !important;
}

#class_detail_print_table tr td:nth-child(2) {
	min-width: 10rem !important;
	max-width: 10rem !important;
	font-size: 12px !important;
	font-weight: 600 !important;
}

/*#class_detail_print_table tr td:nth-child(3) {
	display: none !important;
}*/
#class_detail_print_table tr th.present,
#class_detail_print_table tr th.absent,
#class_detail_print_table tr th.rate {
	min-width: 40px !important;
	max-width: 40px !important;
}

#class_detail_print_table td:has(> div.present),
#class_detail_print_table td:has(> div.absent),
#class_detail_print_table td:has(> div.rate) {
	min-width: 40px !important;
	max-width: 40px !important;
}

#class_detail_print_table td div.footer_present,
#class_detail_print_table td div.footer_absent {
	font-size: 12px !important;
	font-weight: 600 !important;
}

#class_detail_print_table_wrapper th.stt {
	width: 2rem !important
}

#class_detail_print_table_wrapper th.student_name {
	min-width: 10rem !important;
	max-width: 10rem !important;
}

#class_detail_print_table_wrapper th.date_month {
	width: 30px !important;
	max-width: 30px !important;
	min-width: 30px !important;
	height: 20px;
}

#class_detail_print_table td:has(> div.date-off) {
	height: 30px !important;
}

#class_detail_print_table td,
#class_detail_print_table th {
	border: 1px solid black
}

#class_detail_print_table th {
	background-color: #00FFFF !important;
	font-weight: 700 !important;
	font-size: 11px !important;
}

#class_detail_print_table_info {
	color: black !important
}

#class_detail_print_table_paginate {
	display: none !important;
}

.container_print_modal h3 {
	color: black !important
}

@media screen {
	#signed_container {
		display: none;
		color: black !important
	}

	#header_print {
		display: none;
	}


}

@media print {
	#class_detail_print_table th {
		font-size: 10px !important;
	}

	#class_detail_print_table {
		color: black !important
	}

	#class_detail_print_table td.date_month {
		min-height: 20px !important;
	}

	#class_detail_print_table td:has(> div.date-off) {
		height: 20px !important;
	}

	#class_detail_print_table td:has(> div.none),
	#class_detail_print_table td:has(> div.check),
	#class_detail_print_table td:has(> div.error) {
		height: 20px !important;
	}

	#class_detail_print_table td div.date-off {
		background-color: gray !important;
		height: 100%;
		width: 100%;
	}

	#class_detail_print_table_info {
		display: none !important;
	}

	#class_detail_print_table_wrapper th.date_month {
		width: 1rem !important;
		max-width: 1rem !important;
		min-width: 1rem !important;
	}

	#class_detail_print_table_wrapper th.present,
	#class_detail_print_table_wrapper th.absent,
	#class_detail_print_table_wrapper th.rate {
		min-width: 40px !important;
		max-width: 40px !important;
	}

	#header_print {
		display: flex !important;
		color: black !important
	}

	#signed_container {
		display: block !important;
	}

	#class_detail_print_table td div.error,
	#class_detail_print_table td div.check,
	#class_detail_print_table td div.none {
		background-color: unset !important;
	}

	.container_print_modal {
		height: auto;
		overflow: hidden !important;
	}

	html body {
		background-color: white !important;
	}
}

/*-------------------------------------------------------------------class detail empty (class_detail_print_table)--------------------------------------------------------------------------------- css*/

/*-------------------------------------------------------------------class general present (class_general_print_table)--------------------------------------------------------------------------------- css*/
#class_general_print_table tr td {
	min-height: 20px !important;
	height: 30px !important;
}

#class_general_print_table td.name,
#class_general_print_table th.name {
	text-align: left !important;
}

#class_general_print_table_wrapper th {
	padding: 0 !important;
	font-size: 9px !important;
	text-align: center !important;
	height: 30px;
}

#class_general_print_table td {
	padding: 0 !important;
	font-size: 11px !important;
	text-align: center;
}

#class_general_print_table td.date_month {
	min-width: 30px;
	min-height: 30px;
}

#class_general_print_table th.student_name {
	min-width: 12rem;
}

#class_general_print_table td.student_name {
	min-width: 12rem;
}

#class_general_print_table thead tr th.name {
	text-align: center;
	vertical-align: middle;
}

#class_general_print_table thead tr th.status {
	text-align: center;
	vertical-align: middle;
}

#class_general_print_table thead tr th.start_date {
	text-align: center;
	vertical-align: middle;
}

#class_general_print_table thead tr th.end_date {
	text-align: center;
	vertical-align: middle;
}

#class_general_print_table tr.sub_header th {
	text-align: center;
}

#class_general_print_table tfoot th {
	font-weight: 700 !important;
	/*font-size: 1.5rem !important;*/
	font-size: 10px !important;
}

#class_general_print_table td.total_present,
#class_general_print_table td.total_absent,
#class_general_print_table td.rate {
	text-align: center !important;
	vertical-align: middle !important;
}

#class_general_print_table tr td:nth-child(2) {
	padding-left: 5px !important;
	text-align: left !important;
}


#class_general_print_table tr th.present,
#class_general_print_table tr th.absent,
#class_general_print_table tr th.rate {
	min-width: 60px !important;
	max-width: 60px !important;
}

#class_general_print_table td:has(> div.none),
#class_general_print_table td:has(> div.check),
#class_general_print_table td:has(> div.error) {
	height: 30px !important;
}

#class_general_print_table tr td:nth-child(1) {
	min-width: 2rem !important;
	max-width: 2rem !important;
}

#class_general_print_table tr td:nth-child(2) {
	min-width: 10rem !important;
	max-width: 10rem !important;
	font-size: 12px !important;
	font-weight: 600 !important;
}

#class_general_print_table tr th.present,
#class_general_print_table tr th.absent,
#class_general_print_table tr th.rate {
	min-width: 40px !important;
	max-width: 40px !important;
}

#class_general_print_table td:has(> div.present),
#class_general_print_table td:has(> div.absent),
#class_general_print_table td:has(> div.rate) {
	min-width: 40px !important;
	max-width: 40px !important;
}

#class_general_print_table td div.footer_present,
#class_general_print_table td div.footer_absent {
	font-size: 12px !important;
	font-weight: 600 !important;
}

#class_general_print_table_wrapper th.stt {
	width: 2rem !important
}

#class_general_print_table_wrapper th.student_name {
	min-width: 10rem !important;
	max-width: 10rem !important;
}

#class_general_print_table_wrapper th.date_month {
	width: 30px !important;
	max-width: 30px !important;
	min-width: 30px !important;
	height: 20px;
}

#class_general_print_table td:has(> div.date-off) {
	height: 30px !important;
}

#class_general_print_table td div.date-off {
	text-align: center;
	vertical-align: middle;
}

#class_general_print_table td,
#class_general_print_table th {
	border: 1px solid black
}

#class_general_print_table th {
	background-color: #00FFFF !important;
	font-weight: 700 !important;
	font-size: 11px !important;
}

#class_general_print_table_info {
	color: black !important
}

#class_general_print_table_paginate {
	display: none !important;
}

.container_print_modal h3 {
	color: black !important
}

@media screen {
	#signed_container {
		display: none;
		color: black !important
	}

	#header_print {
		display: none;
	}


}

@media print {

	#class_general_print_table th {
		font-size: 10px !important;
	}

	#class_general_print_table {
		color: black !important
	}

	#class_general_print_table td.date_month {
		min-height: 20px !important;
	}

	#class_general_print_table td:has(> div.date-off) {
		height: 20px !important;
	}

	#class_general_print_table td:has(> div.none),
	#class_general_print_table td:has(> div.check),
	#class_general_print_table td:has(> div.error) {
		height: 20px !important;
	}

	#class_general_print_table td div.date-off {
		background-color: gray !important;
		height: 100%;
		width: 100%;
	}

	#class_general_print_table_info {
		display: none !important;
	}

	#class_general_print_table_wrapper th.date_month {
		width: 1.7rem !important;
		max-width: 1.7rem !important;
		min-width: 1.7rem !important;
	}

	#class_general_print_table_wrapper th.present,
	#class_general_print_table_wrapper th.absent,
	#class_general_print_table_wrapper th.rate {
		min-width: 40px !important;
		max-width: 40px !important;
		width: 40px !important;
	}

	#header_print {
		display: flex !important;
		color: black !important
	}

	#signed_container {
		display: block !important;
	}

	#class_general_print_table td div.error,
	#class_general_print_table td div.check,
	#class_general_print_table td div.none {
		background-color: unset !important;
	}

	.container_print_modal {
		height: auto;
		overflow: hidden !important;
	}

	html body {
		background-color: white !important;
	}
}

/*-------------------------------------------------------------------class general present (class_general_print_table)--------------------------------------------------------------------------------- css*/

/*-------------------------------------------------------------------all class print empty (all_class_detail_print_table)--------------------------------------------------------------------------------- css*/
.all_class_detail_print tr td {
	min-height: 20px !important;
	height: 24px !important;
}

.all_class_detail_print td.name,
.all_class_detail_print th.name {
	text-align: left !important;
}

.all_class_detail_print th {
	padding: 0 !important;
	font-size: 9px !important;
	text-align: center !important;
	height: 30px;
}

.all_class_detail_print td {
	padding: 0 !important;
	font-size: 11px !important;
	text-align: center;
}

.all_class_detail_print td.date_month {
	min-width: 30px;
	min-height: 30px;
}

.all_class_detail_print th.student_name {
	min-width: 12rem;
}

.all_class_detail_print td.student_name {
	min-width: 12rem;
	font-size: 9px !important;
}

.all_class_detail_print thead tr th.name {
	text-align: center;
	vertical-align: middle;
}

.all_class_detail_print thead tr th.status {
	text-align: center;
	vertical-align: middle;
}

.all_class_detail_print thead tr th.start_date {
	text-align: center;
	vertical-align: middle;
}

.all_class_detail_print thead tr th.end_date {
	text-align: center;
	vertical-align: middle;
}

.all_class_detail_print tr.sub_header th {
	text-align: center;
}

.all_class_detail_print tfoot th {
	font-weight: 700 !important;
	/*font-size: 1.5rem !important;*/
	font-size: 10px !important;
}

.all_class_detail_print td.total_present,
.all_class_detail_print td.total_absent,
.all_class_detail_print td.rate {
	text-align: center !important;
	vertical-align: middle !important;
}

.all_class_detail_print tr td:nth-child(2) {
	padding-left: 5px !important;
	text-align: left !important;
}


.all_class_detail_print tr th.present,
.all_class_detail_print tr th.absent,
.all_class_detail_print tr th.rate {
	min-width: 60px !important;
	max-width: 60px !important;
}

.all_class_detail_print td:has(> div.none),
.all_class_detail_print td:has(> div.check),
.all_class_detail_print td:has(> div.error) {
	height: 30px !important;
}

.all_class_detail_print tr td:nth-child(1) {
	min-width: 2rem !important;
	max-width: 2rem !important;
}

.all_class_detail_print tr td:nth-child(2) {
	min-width: 10rem !important;
	max-width: 10rem !important;
	font-size: 12px !important;
	font-weight: 600 !important;
}

.all_class_detail_print tr th.present,
.all_class_detail_print tr th.absent,
.all_class_detail_print tr th.rate {
	min-width: 37px !important;
	max-width: 37px !important;
	width: 37px !important;
	font-size: 9px !important;
}

.all_class_detail_print td:has(> div.present),
.all_class_detail_print td:has(> div.absent),
.all_class_detail_print td:has(> div.rate) {
	min-width: 40px !important;
	max-width: 40px !important;
}

.all_class_detail_print td div.footer_present,
.all_class_detail_print td div.footer_absent {
	font-size: 12px !important;
	font-weight: 600 !important;
}

.all_class_detail_print th.stt {
	width: 2rem !important
}

.all_class_detail_print th.student_name {
	min-width: 10rem !important;
	max-width: 10rem !important;
}

.all_class_detail_print th.date_month {
	width: 30px !important;
	max-width: 30px !important;
	min-width: 30px !important;
	height: 20px;
}

.all_class_detail_print td:has(> div.date-off) {
	height: 30px !important;
}

.all_class_detail_print td div.date-off {
	text-align: center;
	vertical-align: middle;
}

.all_class_detail_print td,
.all_class_detail_print th {
	border: 1px solid black
}

.all_class_detail_print th {
	background-color: #00FFFF !important;
	font-weight: 700 !important;
	font-size: 11px !important;
}

.all_class_detail_print div.dataTables_info {
	color: black !important
}

.all_class_detail_print div.dataTables_paginate {
	display: none !important;
}

.container_print_modal h3 {
	color: black !important
}

.sub_heading th.date_month {
	border-bottom: 1px solid !important;
}

@media screen {
	#signed_container {
		display: none;
		color: black !important
	}

	#header_print {
		display: none;
	}


}

@media print {
	#custom_print {
		display: block !important;
	}

	#custom_print_html {
		display: block !important;
	}

	.all_class_detail_print th {
		font-size: 10px !important;
	}

	.all_class_detail_print {
		color: black !important
	}

	.all_class_detail_print td.date_month {
		min-height: 24px !important;
	}

	.all_class_detail_print td:has(> div.date-off) {
		height: 24px !important;
	}

	.all_class_detail_print td:has(> div.none),
	.all_class_detail_print td:has(> div.check),
	.all_class_detail_print td:has(> div.error) {
		height: 24px !important;
	}

	.all_class_detail_print td div.date-off {
		background-color: gray !important;
		height: 100%;
		width: 100%;
	}

	.all_class_detail_print div.dataTables_info {
		display: none !important;
	}

	.all_class_detail_print th.date_month {
		width: 1.1rem !important;
		max-width: 1.1rem !important;
		min-width: 1.1rem !important;
	}

	.all_class_detail_print th.present,
	.all_class_detail_print th.absent,
	.all_class_detail_print th.rate {
		min-width: 30px !important;
		max-width: 30px !important;
		width: 30px !important;
	}

	#header_print {
		display: flex !important;
		color: black !important
	}

	#signed_container {
		display: block !important;
	}

	.all_class_detail_print td div.error,
	.all_class_detail_print td div.check,
	.all_class_detail_print td div.none {
		background-color: unset !important;
	}

	.container_print_modal {
		height: auto;
		overflow: hidden !important;
	}

	html body {
		background-color: white !important;
	}

	div.dataTables_wrapper div.dataTables_paginate,
	div.dataTables_wrapper div.dataTables_info {
		display: none !important;
	}

	.close_shift_table,
	.close_shift_table tr th {
		border: 2px solid #F3F2F7 !important;
	}
}

.fileinput[data-provides="fileinput"] {
	border: 1px solid;
	border-radius: 5px;
	/*height: 100%;
	width: 100%;*/
	max-width: 200px;
	max-height: 200px;

	& .fileinput-new {
		/* height: 100%; */
		display: flex;
		align-items: center;
		justify-content: center;
	}
}

#image_src img {
	/* max-width: 100% !important;
	max-height: 100% !important; */
	border-radius: 5px;
	object-fit: cover;
	/* height: 100%; */
	max-width: 150px;
	max-height: 150px;
}

#image_src.certificate_image img {
	max-width: 350px !important;
	max-height: 400px !important;
}

.class_price {
	max-width: 106px !important;
	height: 30px !important;
}

.position-relative:has(> .select_minus_price) {
	min-width: 106px !important;
	height: 30px !important;
	text-align: end;
}

.position-relative:has(> .select_minus_price) .select2-container .select2-selection--single .select2-selection__rendered {
	padding-right: 8px;
	padding-left: 20px;
}

.position-relative:has(> .select_minus_price) .select2-container--default .select2-selection--single .select2-selection__arrow {
	left: 10px;
}

.position-relative:has(> .select_plus_price) {
	min-width: 106px !important;
	height: 30px !important;
	text-align: end;
}

.position-relative:has(> .select_plus_price) .select2-container .select2-selection--single .select2-selection__rendered {
	padding-right: 8px;
	padding-left: 20px;
}

.position-relative:has(> .select_plus_price) .select2-container--default .select2-selection--single .select2-selection__arrow {
	left: 10px;
}

.income_total {
	min-width: 120px;
}

.day_income {
	max-width: 50px !important;
	height: 30px !important;
}

.invoice_container {
	margin-top: 0.3em;
	margin-bottom: 0.5rem !important;
}

.payment_method {
	margin-top: 0.3em;
}

.total_amount {
	max-width: 300px;
}

.total_amount>input {
	height: 30px;
	border-radius: 5px;
	font-weight: 700;
}

.total_amount>span {
	top: 5px;
	right: 5px;
}

/*-------------------------------------------------------------------print notify fee invoice (print_container)--------------------------------------------------------------------------------- css*/

@page {
	margin-top: 0.2in;
	margin-bottom: 0.2in;
	margin-left: 0.2in;
	margin-right: 0.2in;
}

#print_container {
	padding: 1rem;
	height: 100%;
	display: block;
	position: relative;
}

#print_container_all {
	padding: 1rem 0 1rem 1rem;
	height: 100%;
	display: block;
	position: relative;
}

.container_invoice {
	height: 95vh;
	padding: 1rem 1rem 1rem 1rem;
	border-radius: 5px;
	border: 1px solid black
}

.container_total {
	padding-top: 1.5rem;
}

/*-------------------------------------------------------------------print bill (container_invoice_save)--------------------------------------------------------------------------------- css*/

.container_invoice_save,
.container_invoice_save_temporary {
	padding: 1rem 1rem 4rem 1rem;
	border-radius: 5px;
	border: 1px solid black;
	height: 100% !important;
	color: black !important;
	position: relative;
}

.container_invoice_sent,
.container_invoice_sent_temporary {
	padding: 1rem 1rem 4rem 1rem;
	border-radius: 5px;
	border: 1px solid black;
	height: 100% !important;
	margin-top: 1rem;
	color: black !important;
	position: relative;
}

.title_invoice {
	margin-bottom: 5px;
	line-height: 14px;
	font-size: 1rem;
}

.title_invoice p {
	min-width: 160px !important;
	padding: 0 !important;
	margin-bottom: 0px !important;
}

.value_invoice {
	font-size: 1.3rem;
	font-weight: 900;
}

.value_content {
	margin-bottom: 5px;
	font-size: 1.3rem;
	min-width: fit-content;
	text-align: right;
}

.title_content {
	font-size: 1.2rem;
	margin-bottom: 5px;
	min-width: fit-content
}

/*-------------------------------------------------------------------class_invoice_total (class_invoice_total)--------------------------------------------------------------------------------- css*/

.class_invoice_total {
	font-size: 10px !important;
	color: black !important
}

.class_invoice_total th {
	color: black !important;
	background-color: #33CCCC !important;
}

.class_invoice_total th.student_name,
.class_invoice_total td.student_name {
	min-width: 11rem !important;
	max-width: 11rem !important;
	width: 11rem !important;
	padding-left: 5px !important;
}

.class_invoice_total th.class_name,
.class_invoice_total td.class_name {
	min-width: 3.5rem !important;
	max-width: 3.5rem !important;
	width: 3.5rem !important;
	text-align: center;
}

/*.class_invoice_total tfoot tr th {
	font-size: 11px !important;
	text-align: center;
}
.class_invoice_total tr.header th {
	font-size: 11px !important;
	text-align: center;
}*/

tr.sub_header_sumarize th {
	text-align: center;
	color: black !important;
	background-color: #33CCCC !important;
}

.class_invoice_total tr td.created_date {
	/*max-width: 110px;
	min-width: 90px;*/
	width: 60px;
	text-align: center;
	font-size: 10px !important
}

.class_invoice_total tr td.invoice_num,
.class_invoice_total tr th.invoice_num,
.class_invoice_total tr th.created_date {
	max-width: 55px;
	min-width: 55px !important;
	width: 55px !important;
	font-size: 10px !important;
}

.class_invoice_total tr th {
	padding: 0px !important;
	font-size: 11px;
}

.class_invoice_total tr th.income {
	min-width: 65px !important;
	max-width: 65px !important;
	width: 65px !important;
	padding: 0px !important;
	font-size: 9px;
}

.class_invoice_total tr th.total_absent {
	max-width: 30px !important;
	min-width: 30px !important;
	width: 30px !important;
}

.bootstrap-table .fixed-table-container .table thead th .th-inner {
	padding: 0 !important
}

.bootstrap-table .fixed-table-container .table thead th.income .th-inner {
	padding: 0px !important;
}

.class_invoice_total tr td.income {
	text-align: center;
}

.class_invoice_total tr.header th.payment_before,
.class_invoice_total tr.header th.payment_remaining,
.class_invoice_total tr.header th.total_absent,
.class_invoice_total tr td.payment_before,
.class_invoice_total tr td.payment_remaining,
.class_invoice_total tr td.total_absent,
.class_invoice_total tfoot tr th.payment_before,
.class_invoice_total tfoot tr th.payment_remaining,
.class_invoice_total tfoot tr th.total_absent,
.class_invoice_total tr th.student_code {
	min-width: 40px !important;
	max-width: 40px !important;
	width: 40px !important;
	padding: 0px !important;
}

.class_invoice_total tr.header th.total_absent,
.class_invoice_total tr td.total_absent,
.class_invoice_total tfoot tr th.total_absent {
	min-width: 50px !important;
	max-width: 50px !important;
	width: 50px !important;
	padding: 0px !important;
}

.class_invoice_total tr td.invoice_num,
.class_invoice_total tr td.payment_remaining,
.class_invoice_total tr td.total_absent {
	text-align: center;
}

.class_invoice_total td,
.class_invoice_total th {
	border: 1px solid !important
}

.class_invoice_total td.stt,
.class_invoice_total th.stt {
	width: 35px !important;
	max-width: 35px !important;
	min-width: 35px !important;
	font-size: 11px !important;
	text-align: center;
}

.bootstrap-table .fixed-table-container .table thead th.stt .th-inner {
	padding: 0 !important;
}

.class_invoice_total {
	color: black !important;
}

.class_invoice_total td,
.class_invoice_total th {
	padding: 0px !important;
}

table.dataTable th.income_month,
table.dataTable th.month_before {
	text-align: center !important;
}

table.dataTable th.month_before {
	max-width: 120px !important;
	min-width: 100px !important;
	width: 100px !important
}

.class_invoice_total tr th {
	text-align: center !important;
	font-size: 9px !important;
}

.class_invoice_total tr td {
	text-align: center !important;
	font-size: 10px !important;
}

.class_invoice_total tr td {
	min-height: 24px !important;
	height: 24px !important;
}

.class_invoice_total tr td div.student_name {
	text-align: left;
	padding-left: 5px;
}

.class_invoice_total tr td:has(> div.total_absent) {
	max-width: 20px !important;
}

#history-shift_table th {
	text-align: center;
}

.close_shift_table .close_shift_sub {
	min-width: 70px !important;
}

.close_shift_table .income {
	min-width: 70px !important;
}

.close_shift_table .total_invoice {
	min-width: 70px !important;
	text-align: center !important;
}

.close_shift_table .day_absent {
	min-width: 10% !important;
}

/*-------------------------------------------------------------------total_invoice_by_days_print_table (total_invoice_by_days_print_table)--------------------------------------------------------------------------------- css*/

#total_invoice_by_days_print_table tr th.number_day,
#total_invoice_by_days_print_table tr th.total_student {
	min-width: 95px !important;
	max-width: 95px !important;
	text-align: center;
}

#total_invoice_by_days_print_table tr td div.number_day,
#total_invoice_by_days_print_table tr td div.total_student {
	text-align: center;
}

#total_invoice_by_days_print_table tr th {
	text-align: center;
	font-size: 11px !important;
	color: black !important;
	background-color: #33CCCC !important;
}

#total_invoice_by_days_print_table {
	font-size: 11px !important;
}

/*-------------------------------------------------------------------close_shift_table (close_shift_table)--------------------------------------------------------------------------------- css*/
.close_shift_table tr th {
	height: 50px !important;
	border: 1px solid #F3F2F7 !important;
}

.close_shift_table td {
	font-size: 0.9rem !important;
}

.close_shift_table .class_name {
	width: 4rem !important;
	min-width: 50px;
}

.close_shift_table .payment_method {
	max-width: 100px !important;
	min-width: 60px !important;
	width: 85px !important;
}

.close_shift_table .invoice_number {
	max-width: 100px !important;
	min-width: 70px !important;
	width: 70px !important;
}

.close_shift_table th.student_name {
	max-width: 150px !important;
	min-width: 150px !important;
	width: 150px !important;
}

.close_shift_table th.content {
	max-width: 105px !important;
	min-width: 105px !important;
	width: 105px !important;
}

.close_shift_table th.paid_sign {
	max-width: 90px !important;
	min-width: 75px !important;
	width: 90px !important;
}

.close_shift_table th.date_paid {
	max-width: 90px !important;
	min-width: 82px !important;
	width: 82px !important;
}


.close_shift_table tr th,
#history-shift_table tr th {
	background-color: #f3f2f7 !important;
}

.close_shift_table tr>td:last-child:not(:first-child) {
	text-align: left !important;
}

@media print {
	.close_shift_table {
		font-size: 0.7rem !important;
	}
}

/*filter: Status*/

.custom-options-checkable .custom-option-item {
	width: 100%;
	cursor: pointer;
	border-radius: 0.42rem;
	color: #000;
	background-color: rgb(135 138 142 / 6%);
	border: none;
	/*1px solid #ebe9f1;*/
	text-align: center;
	padding: 1rem !important;
	font-size: 1.2rem;
}

.custom-option-item-check:checked+.custom-option-item {
	color: rgb(235, 61, 99);
	background-color: #FFF7F7;
	border-color: rgb(235, 61, 99);
}

.custom-options-checkable.row>* {
	padding-right: 0 !important;
}

.me-auto {
	margin: auto !important;
}

.main-menu .navbar-header {
	background: linear-gradient(118deg, rgb(235, 61, 99), rgba(235, 61, 99, 1));
}

.main-menu .navbar-header.nav_root {
	background: linear-gradient(118deg, rgb(115, 103, 240), rgba(115, 103, 240, 1));
}

/*-------------------------------------------------------------------------------- roadmap_detail_table ----------------------------------------------------------*/
#roadmap_detail_table td div.is_check {
	background-color: #FF6666;
}

#roadmap_detail_table td div.is_check,
#roadmap_detail_table td div.is_not_check {
	min-width: 30px !important;
}

#roadmap_detail_table td:has(> div.is_check),
#roadmap_detail_table td:has(> div.is_not_check) {
	height: 30px !important;
	min-width: 30px !important;
	padding: 0 !important;
}

table tr th.update_status_header {
	cursor: pointer !important;
}

#roadmap_detail_table tr td div.is_exist_data {
	overflow: hidden !important;
	display: -webkit-box !important;
	-webkit-line-clamp: 2 !important;
	-webkit-box-orient: vertical;

}

#roadmap_detail_table td:has(> div.is_exist_data) {
	max-width: 100px !important;
	min-width: 50px !important;
}

.mb-invoice {
	margin-bottom: 5px;
}

#catalog_manage_student_debt_table tr th.title {
	width: 55% !important
}

#catalog_manage_student_debt_table tr th.total_price {
	width: 13% !important
}

p.form-control {
	background-color: #efefef !important;
}

.pd1 {
	padding: 0.3rem !important;
}

.card-header-dashboard {
	padding: 1.5rem 1.5rem !important;
}

.apexcharts-theme-light text {
	font-family: 'SVN-Gilroy' !important;
}

th.is_sticky_top {
	top: 0;
	position: sticky;
	z-index: 8;
}

th.is_sticky_left {
	left: 0;
	position: sticky;
	z-index: 9;
}

td.is_sticky_left {
	left: 0;
	position: sticky;
	z-index: 10;
	--bs-table-accent-bg: var(--bs-table-striped-bg);
}

#roadmap_detail_table .student_name {
	width: fit-content;
	min-width: 15rem;
}

#roadmap_detail_table td>div:not(.student_name) {
	font-size: 0.8rem !important;
}

#roadmap_detail_table td.hightlight {
	border: solid #99CC99;
}

.main-menu .shadow-bottom {
	background: transparent;
}

.main-menu.menu-light .navigation>li.active {
	background: #FFF7F7;
}

li.sidebar-group-active {
	background: rgb(255, 247, 247);
}

li.sidebar-group-active ul.menu-content {
	background: whitesmoke;
}

li ul.menu-content li.active {
	color: black !important;
	box-shadow: none !important;
	background: whitesmoke !important;
}

li ul.menu-content li.active>a {
	color: rgb(235, 61, 99) !important;
}

.form-check-inline {
	display: inline-block;
	margin-right: 1rem;
	line-height: 2.5rem;
}

.form-check-inline .form-check-input {
	margin-top: 0.4825rem;
}

.btn-icon-only {
	background: transparent;
	border: 0;
}

.btn-icon-only.add_repeater_btn {
	color: #28c76f;
}

.btn-icon-only.delete_income {
	color: #ea5455;
}

.btn-icon-only svg {
	width: 2rem;
	height: 2rem;
}

.vertical-layout.vertical-menu-modern .main-menu .navigation>li>a svg,
.vertical-layout.vertical-menu-modern .main-menu .navigation>li>a i {
	height: 28px;
	width: 28px;
	font-size: 2rem;
	margin-right: 1.1rem;
	flex-shrink: 0;
}

.main-menu.menu-light .navigation>li>a {
	margin: 0;
}

.rotate-show_group {
	rotate: -90deg;
}

.bill_debt {
	margin-right: 5px;
}

.bill_debt_container {
	min-height: 30px !important;
}

.invoice_setting p {
	margin: 0 !important;
	line-height: 1.2rem !important;
}

/* -------------------------------------------------------------------------income_cash_fund -------------------------------------------------------------------------------- */
.income_cash_fund th {
	text-align: center !important;
}

.income_cash_fund tr th.total_student {
	min-width: 30% !important;
}

.income_cash_fund tr th.stt {
	max-width: 10% !important;
}

/*START Dashboard*/

.apexcharts-canvas .apexcharts-datalabel {
	fill: #fff;
	font-weight: 800;
	font-size: 16px;
}

.apexcharts-canvas .apexcharts-text,
.apexcharts-canvas .apexcharts-tooltip-text,
.apexcharts-canvas .apexcharts-datalabel-label {
	fill: #000;
	font-weight: 800;
}

.card .card-title {
	font-weight: 600;
	font-size: 1.385rem;
	margin-bottom: 1.53rem;
}

.card-statistics h2 {
	color: #000;
}

.fc .fc-toolbar .fc-toolbar-title {
	margin-left: 0.25rem;
	text-transform: capitalize;
}

/*END Dashboard*/
.employee_print {
	position: absolute;
	bottom: 5px;
}

/* calendar employee */
.employee-shifts-day {
	font-size: 14px;
	font-weight: 600;
	opacity: .6;
}

.employee-shifts-popup .mbsc-popup .mbsc-popup-header {
	padding-top: 8px;
	padding-bottom: 8px;
}

.employee-shifts-cont {
	position: relative;
	/* padding-left: 42px; */
	max-height: 40px;
}

.employee-shifts-avatar {
	position: absolute;
	max-height: 40px;
	max-width: 40px;
	top: 18px;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	left: 20px;
}

.employee-shifts-name {
	font-size: 1.2rem;
}

.employee-shifts-title {
	font-size: 1rem;
	color: darkgray;
}

.md-employee-shifts .mbsc-timeline-resource,
.md-employee-shifts .mbsc-timeline-resource-col {
	width: 150px;
	align-items: center;
	display: flex;
}

.md-employee-shifts .mbsc-schedule-event {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 5rem;
}

.mbsc-timeline-slot {
	min-width: 10rem;
	width: auto;
}

.mbsc-schedule-event-title {
	font-size: 1.2em !important;
}

.mbsc-timeline-slot-title {
	text-align: center;
}

/* calendar employee - END */


.custom_name {
	min-width: 15rem !important;
	text-align: center !important;
}

.custom_day {
	min-width: 8rem !important;
	text-align: center !important;
}

.custom_content table th {
	padding: 0.5rem 0 !important;
	background-color: #fff !important;
}

.custom_content .span_container_btn {
	padding: 0 !important;
}

/* th.is_sticky_right {
	right: 0;
	position: sticky;
	z-index: 9;
}
td.is_sticky_right {
	right: 0;
	position: sticky;
	z-index: 10;
	--bs-table-accent-bg: var(--bs-table-striped-bg);
} */
.custom_content table caption {
	caption-side: top !important;
}

.update_working_time {
	cursor: pointer;
}

/* START */
.md-custom-header-controls {
	display: flex;
	flex: 1 0 auto;
	justify-content: center;
	align-items: center;
}

.md-custom-header-nav,
.md-custom-header-view {
	width: 180px;
}

.md-custom-header-button.mbsc-button {
	font-size: 20px;
	height: auto;
	padding: 0;
	margin: 0;
}

.md-custom-header .mbsc-segmented {
	width: 110px;
	float: right;
	margin-top: 0;
	margin-bottom: 0;
}

.md-custom-header .mbsc-material.mbsc-segmented,
.md-custom-header .mbsc-windows.mbsc-segmented {
	padding: 0;
}

.md-custom-header .mbsc-segmented .mbsc-segmented-button {
	font-size: 20px;
	height: 32px;
	padding: 0;
}

.md-timetable .mbsc-timeline-row-date-col {
	width: 90px;
}

.md-timetable .mbsc-timeline-row-gutter {
	height: 8px;
}

.md-timetable .mbsc-timeline-column,
.md-timetable .mbsc-timeline-header-column {
	width: 130px;
}

.md-timetable .mbsc-schedule-event-range {
	display: none;
}

.md-timetable-day {
	font-size: 14px;
	padding: 7px;
}

.md-timetable-day-name {
	font-weight: 600;
	padding-bottom: 5px;
}

.md-timetable-event-title {
	font-size: 12px;
	line-height: 18px;
}

.md-timetable-event-prop {
	color: #555;
	padding-bottom: 5px;
}

.md-timetable-event-class {
	color: #555;
	font-style: italic;
}

.mbsc-timeline-row {
	height: 80px !important;
}

/*   END */
#agenda-container {
	width: 99% !important;
}

#example.dataTable {
	border-collapse: collapse;
	border: 1px solid darkgray;
}

#example.dataTable th {
	text-align: center !important;
	border: 1px solid darkgray;
}

#example.dataTable td {
	text-align: center !important;
	border: 1px solid darkgray;
}

#demo-employee-shifts-calendar {
	max-height: 75vh !important;
}

table caption {
	caption-side: top !important;
}


#owl-demo .item {
	background: rgba(130, 134, 139, 0.1);
	padding: 15px 0px;
	margin: 10px;
	color: #000;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
	font-weight: 600;
	text-align: center;
	cursor: pointer;
}

#owl-demo .item.active,
#owl-demo .item:hover {
	background-color: #fbdcdc !important;
	color: rgb(235, 61, 99);
	font-weight: 900;
}

#owl-demo .item.active>div,
#owl-demo .item:hover>div {
	color: #41433E !important;
}

.owl-theme .owl-controls .owl-buttons div {
	display: flex !important;
	/* justify-content: center; */
	align-items: center;
	height: 26px !important;
	width: 26px !important;
	background: #ff7f25 !important;
	outline-color: transparent;
	color: white;
	padding: 0 !important;
	margin: 0 !important;
}

.owl-carousel .owl-wrapper-outer {
	padding-bottom: 0;
	/* width: 96%; */
}

.owl-theme .owl-controls .owl-buttons div.owl-next {
	right: -2rem !important;
	top: 50%;
	transform: translateY(-50%);
	position: absolute;
}

.owl-theme .owl-controls .owl-buttons div.owl-prev {
	left: -2rem !important;
	top: 50%;
	transform: translateY(-50%);
	position: absolute;
}

.header_name {
	text-align: center !important;
}

.custom_table table th {
	background-color: #fff !important;
	padding: 1rem !important;
}

.custom_point {
	min-width: 10rem !important;
}

.swal2-select {
	border-radius: 5px;
	border: 1px solid darkgray;
}

.guide_container {
	border: 1px solid #555;
	border-radius: 5px;
	width: 100%;
	padding: 20px;
	flex: 1 1 0%;
	min-width: 150px;
	min-height: 150px;
	text-align: center;
}

.guide_container .item:not(:last-child) {
	padding-bottom: 1rem;
}

.guide_container .item>img {
	width: 120px;
	height: 80px;
	object-fit: cover;
}

.guide_container .item .guide_title {
	display: inline-block;
	width: 30px;
	height: 30px;
	line-height: 30px;
	text-align: center;
	border-radius: 50%;
	font-size: 15px;
	font-weight: bold;
	border: 1px solid;
	font-weight: 600;
}

.line_text_container {
	display: flex;
	align-items: center;
	text-align: center;
	/* margin: 10px 0; */
}

.line_text_container .item_line {
	flex: 1;
	border-bottom: 1px solid darkgray;
}

.line_text_container .item_text {
	margin: 0 10px;
	font-size: 1rem;
	font-weight: 600;
}

/* dropdown button */
/* .dropdown {
	position: relative;
	display: inline-block;
	width: 100%;
	text-align: center;
	min-width: 130px;
} */

.dropdown .dropdown-button {
	/* width: 100%; */
	padding: 8px 16px;
	cursor: pointer;
}

.dropdown-content {
	display: none;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	background-color: #f9f9f9;
	z-index: 1;
	border-radius: 4px;
	padding: 8px 0;
	text-align: left;
	width: 100%;
}

.dropdown-content .dropdown-button {
	background-color: white;
	border: none;
	cursor: pointer;
	text-align: left;
	padding: 8px 16px;
	width: 100%;
}

.dropdown-content .dropdown-button:hover {
	background-color: #f1f1f1;
}

.dropdown:hover .dropdown-content {
	display: block;
}

.login_guide {
	font-size: 11px;
}

/* dropdown button end */

@font-face {
	font-family: 'Bungee-Regular';
	src: url('../fonts/Bungee-Regular.ttf') format('truetype');
}

@font-face {
	font-family: 'PaytoneOne-Regular';
	src: url('../fonts/PaytoneOne-Regular.ttf') format('truetype');
}

.vertical-layout.vertical-menu-modern.menu-expanded .main-menu .navigation .navigation-header .feather-more-horizontal {
	display: inline-block !important;
}

.main-menu.menu-light .navigation .navigation-header svg {
	height: 30px !important;
	width: 30px !important;
	margin-right: 1.1rem;
}

.main-menu.menu-light .navigation .navigation-header {
	margin: calc(2rem + 0.286rem) 0 0.8rem 0.5rem !important;
}

.vertical-layout.vertical-menu-modern .main-menu .navigation .menu-content>li>a svg {
	height: 20px !important;
	width: 20px !important;
}

.rotate_navigation {
	transform: rotate(90deg) !important;
}

.setting_fee_type_disabled {
	pointer-events: none;
	opacity: 0.5;
}

.rotate-transition {
	transition: transform 0.3s ease-in-out;
}

.form-content {
	min-height: 200px;
}

.course_roadmap_list {
	display: flex;
	flex-direction: column;
}

.course_roadmap_list .payment-multi {
	order: 2;
}

.course_roadmap_list .payment-single {
	order: 1;
}

/* ::-webkit-scrollbar {
    width: 10px; 
} */

::-webkit-scrollbar-track {
	background-color: #f1f1f1;
	border-radius: 10px;
}

::-webkit-scrollbar-thumb {
	background-color: #888;
	border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
	background-color: #555;
}

.ui-autocomplete {
	z-index: 100000;
	display: block;
}

#editableTable input {
	border: none;
}

ul#top-menu-navigation>li {
	padding-top: 1rem;
	padding-bottom: 1rem;
	padding-left: 0.5rem;
}

ul#top-menu-navigation>li.active>a {
	/* background: linear-gradient(118deg, rgb(235, 61, 99), rgba(115, 103, 240, 0.7)); */
	/* background: linear-gradient(118deg, #f3a2a2, #f3a2a2); */
	background: #fbd1d1;
	box-shadow: none;
	color: rgb(235, 61, 99);
	/* box-shadow: 0px 0px 6px 1px rgba(115, 103, 240, 0.6); */
	/* color: #fff; */
	font-weight: 600;
	border-radius: 4px;
}

ul#top-menu-navigation>li>a {
	padding: 0.5rem;
	display: flex;
	margin-right: 0.5rem;
}

#top-menu-navigation .dropdown-menu {
	min-width: 215px;
	border: none;
	margin-top: 0;
	min-height: 52px;
}

#top-menu-navigation li.dropdown .dropdown-menu {
	top: 60px !important;
	right: 0;
}

#top-menu-navigation .nav-link.dropdown-toggle::after {
	left: 0.4rem;
	content: "\f0d7";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
}

.dropdown-item:hover,
#top-menu-navigation .dropdown-item:focus {
	color: rgba(235, 61, 99, 0.7);
	/* background-color: rgba(115, 103, 240, 0.12); */
	text-decoration: none;
	background-color: transparent;
}

#top-menu-navigation .dropdown-item {
	color: #000;
}

.mbsc-timeline .mbsc-timeline-event-slot .mbsc-schedule-event-inner,
.mbsc-timeline.mbsc-timeline-no-rows .mbsc-schedule-event-inner {
	height: 100%;
	padding: 5px;
}

/* .md-employee-shifts .mbsc-schedule-event{ 
	height: fit-content;
} */
.mds-variable-event-height-title {
	white-space: normal;
	line-height: 16px;
	font-size: 15px;
	font-weight: 600;
	text-align: center;

}

.mds-variable-event-height-description {
	padding: 8px 0;
	white-space: normal;
	font-size: 12px;
	line-height: 18px;
	font-weight: 400;
	text-align: center;

}

.mds-variable-event-height .mbsc-schedule-event-range {
	font-size: 12px;
	font-weight: 600;
}

.mds-variable-event-height .mbsc-schedule-event-inner {
	padding: 1em;
}

.mbsc-schedule-event-all-day-inner {
	height: fit-content !important;
}

/* .mbsc-timeline-event .mbsc-schedule-event-range, .mbsc-timeline-event .mbsc-schedule-event-title {
	overflow: unset;
    text-overflow: unset;
    white-space: unset;
} */

.qr-container {
	position: relative;
}

.qr-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.8);
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 5px;
	display: none;
}

.qr-overlay button {
	background: #007bff;
	color: white;
	border: none;
	padding: 10px 20px;
	border-radius: 5px;
	cursor: pointer;
	font-size: 14px;
}

/* Tab highlight styles for student info modal */
.custom-options-checkable.class-tab .custom-option-item-check {
	position: absolute;
	clip: rect(0, 0, 0, 0);
	opacity: 0;
}

.custom-options-checkable.class-tab .custom-option-item {
	display: block;
	padding: 0.75rem 1rem;
	border: 1px solid #d8d6de;
	border-radius: 0.428rem;
	background-color: #fff;
	color: rgb(235, 61, 99);
	cursor: pointer;
	transition: all 0.15s ease-in-out;
	text-align: center;
	margin: 0;
}

.custom-options-checkable.class-tab .custom-option-item:hover {
	/* background-color: rgba(115, 103, 240, 0.04); */
	border-color: rgb(235, 61, 99);
}

.custom-options-checkable.class-tab .custom-option-item-check:checked+.custom-option-item,
.custom-options-checkable.class-tab .custom-option-item.active {
	color: rgb(235, 61, 99) !important;
	background-color: rgba(115, 103, 240, 0.12) !important;
	border-color: rgb(235, 61, 99) !important;
	/* box-shadow: 0 2px 4px 0 rgba(115, 103, 240, 0.25); */
}

.custom-options-checkable.class-tab .custom-option-item-check:checked+.custom-option-item .fw-bolder,
.custom-options-checkable.class-tab .custom-option-item.active .fw-bolder {
	color: rgb(235, 61, 99) !important;
	font-weight: 600 !important;
}

/* Force remove active class from radio buttons */
.custom-options-checkable.class-tab .custom-option-item-check.active {
	/* Remove any active styling from radio buttons */
}

/* Ensure only the checked radio's label is active */
.custom-options-checkable.class-tab .custom-option-item-check:not(:checked)+.custom-option-item {
	color: #6e6b7b !important;
	background-color: #fff !important;
	border-color: #d8d6de !important;
	box-shadow: none !important;
}

.custom-options-checkable.class-tab .custom-option-item-check:not(:checked)+.custom-option-item .fw-bolder {
	color: #6e6b7b !important;
	font-weight: normal !important;
}

/* Additional specificity for student history tabs */
#studentInfoModal .custom-options-checkable.class-tab .custom-option-item-check:checked+.custom-option-item,
#studentInfoModal .custom-options-checkable.class-tab .custom-option-item.active {
	color: rgb(235, 61, 99) !important;
	background-color: rgba(115, 103, 240, 0.12) !important;
	border-color: rgb(235, 61, 99) !important;
	box-shadow: 0 2px 4px 0 rgba(115, 103, 240, 0.25) !important;
}

#studentInfoModal .custom-options-checkable.class-tab .custom-option-item-check:not(:checked)+.custom-option-item {
	color: #6e6b7b !important;
	background-color: #fff !important;
	border-color: #d8d6de !important;
	box-shadow: none !important;
}

/* Ensure proper spacing */
.custom-options-checkable.class-tab .col-4 {
	padding: 0 0.5rem;
}

.custom-options-checkable.class-tab .col-4:first-child {
	padding-left: 0;
}

.custom-options-checkable.class-tab .col-4:last-child {
	padding-right: 0;
}

.dt_adv_search {
	font-size: 0.9rem ;
}
/* .card:has(.custom-options-checkable) {
	margin-bottom: 1rem;
} */

/* JSTree - Finance Account */
/* Selected */
.jstree-wholerow-clicked {
    background: #dff4ff !important;   /* xanh nhạt */
}
.jstree-clicked {
    color: var(--bs-danger) !important;
    font-weight: 600;
}

/* Hover */
.jstree-wholerow-hovered {
    background: #eef9ff !important;
}