.box-flex-member {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.box-flex-member h1 {
    margin-bottom: 0px !important;
}
.danh-sach-bai-kiem-tra h2 {
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 10px;
}
.danh-sach-bai-kiem-tra h5 {
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 10px;
}
.danh-sach-bai-kiem-tra-table {
	--bg: #fff;
	--border: #e5e7eb;
	--text: #111827;
	--muted: #6b7280;
	--head: #f3f4f6;
	--head2: #eef2f7;
	--hover: #f9fafb;
	--shadow: 0 6px 20px rgba(2, 6, 23, .06);
	--radius: 12px;
	font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

.danh-sach-bai-kiem-tra-table h1 {
	font-size: clamp(18px, 2.4vw, 22px);
	font-weight: 700;
	color: var(--text);
	margin: 0 0 12px;
}

.danh-sach-bai-kiem-tra-table {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

/* Bảng */
.danh-sach-bai-kiem-tra-table table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	background: var(--bg);
	border: 1px solid var(--border);
	border-radius: var(--radius);
	box-shadow: var(--shadow);
	min-width: 720px;
}

/* Header */
.danh-sach-bai-kiem-tra-table thead th {
	text-align: left;
	font-size: 13px;
	font-weight: 700;
	color: var(--muted);
	padding: 14px 16px;
	background: linear-gradient(180deg, var(--head), var(--head2));
	position: sticky;
	top: 0;
	z-index: 1;
	border-bottom: 1px solid var(--border);
	letter-spacing: .2px;
	white-space: nowrap;
}

.danh-sach-bai-kiem-tra-table tbody td {
	font-size: 14px;
	color: var(--text);
	padding: 14px 16px;
	border-top: 1px solid var(--border);
	vertical-align: middle;
}

.danh-sach-bai-kiem-tra-table tbody tr:nth-child(even) {
	background: #fcfcfd;
}

.danh-sach-bai-kiem-tra-table tbody tr:hover {
	background: var(--hover);
}

/* Căn giữa cột STT, Số lượng, Tình trạng, Action */
.danh-sach-bai-kiem-tra-table td:nth-child(1),
.danh-sach-bai-kiem-tra-table td:nth-child(4),
.danh-sach-bai-kiem-tra-table td:nth-child(6),
.danh-sach-bai-kiem-tra-table td:nth-child(7) {
	text-align: center;
}

.danh-sach-bai-kiem-tra-table a.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 8px 10px;
	border-radius: 8px;
	border: 1px solid transparent;
	background: #16a34a;
	/* xanh lá */
	color: #fff !important;
	box-shadow: 0 2px 8px rgba(22, 163, 74, .25);
	transition: transform .15s ease, box-shadow .2s ease, background .2s ease;
}

.danh-sach-bai-kiem-tra-table a.btn:hover {
	transform: translateY(-1px);
	box-shadow: 0 6px 16px rgba(22, 163, 74, .28);
	background: #149344;
}


@media (max-width: 640px) {
	.danh-sach-bai-kiem-tra-table table {
	
		border-radius: 0;
		box-shadow: none;
	}


	
	.danh-sach-bai-kiem-tra-table tbody tr {
		background: #fff;
		border: 1px solid var(--border);
		border-radius: 12px;
		box-shadow: var(--shadow);
		padding: 10px 12px;
		margin: 12px 0;
	}

	.danh-sach-bai-kiem-tra-table tbody td {
		border: 0;
		padding: 10px 8px 10px 120px;
		/* chừa chỗ cho nhãn trái */
		position: relative;
	}

	.danh-sach-bai-kiem-tra-table tbody td::before {
		content: attr(data-label);
		position: absolute;
		left: 12px;
		top: 10px;
		width: 100px;
		font-size: 12px;
		font-weight: 600;
		color: var(--muted);
		text-transform: none;
		white-space: nowrap;
	}

	.danh-sach-bai-kiem-tra-table td:nth-child(1),
	.danh-sach-bai-kiem-tra-table td:nth-child(4),
	.danh-sach-bai-kiem-tra-table td:nth-child(6),
	.danh-sach-bai-kiem-tra-table td:nth-child(7) {
		text-align: left;
	}

	.danh-sach-bai-kiem-tra-table td:last-child a.btn {
		width: 100%;
		justify-content: center;
	}
}

.danh-sach-bai-kiem-tra-table .badge {
	display: inline-block;
	padding: .3rem .6rem;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	background: #e5f5ec;
	color: #0f5132;
	border: 1px solid #c6ead7;
}

.danh-sach-bai-kiem-tra-table .badge--danger {
	background: #fde8e8;
	color: #7f1d1d;
	border-color: #facdcd;
}

.danh-sach-bai-kiem-tra-table .badge--warning {
	background: #fff7e6;
	color: #7a4e00;
	border-color: #ffe2a8;
}
.box-title-table h1 {
font-size: 19px;
text-align: center;
padding: 10px;
}

@media (prefers-color-scheme: light){
:root{
  --bg: #f6f7fb;
  --bg-elev: #ffffff;
  --card: #ffffff;
  --text: #0f172a;
  --muted: #5b6472;
  --shadow: 0 8px 24px rgba(16,24,40,.08);
}
}

/* ====== Layout tổng ====== */
.box-bai-hoc{
padding: 20px;
background: var(--bg-elev);
border-radius: calc(var(--radius) + 4px);
box-shadow: var(--shadow);
}

.box-bai-hoc h1{
font-size: 18px;
text-align: center;
margin: 0 0 12px;
color: var(--text);
font-weight: 700;
letter-spacing: .2px;
}

.box-bai-hoc h1 .status-badge{
font-size: .9em;
color: var(--muted);
}

/* Reset UL nếu có */
.box-bai-hoc .list-group{
list-style: none;
padding: 0;
margin: 16px 0 0;
display: grid;
grid-template-columns: 1fr;
gap: 16px;
}

/* Lên lưới 2 cột/3 cột khi rộng */
@media (min-width: 768px){
.box-bai-hoc .list-group{
  grid-template-columns: repeat(2, minmax(0,1fr));
}
}
@media (min-width: 1200px){
.box-bai-hoc .list-group{
  grid-template-columns: repeat(3, minmax(0,1fr));
}
}

/* ====== Card ====== */
.box-bai-hoc .card{
background: var(--card);
border-radius: var(--radius);
overflow: hidden;
border: 1px solid rgba(148,163,184,.12);
transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.box-bai-hoc .card:hover{
transform: translateY(-2px);
box-shadow: 0 14px 30px rgba(0,0,0,.2);
border-color: rgba(148,163,184,.25);
}

.box-bai-hoc .card-header{
padding: 14px 16px;
font-weight: 700;
color: #fff;
background: #a97a31 !important;
border-bottom: 1px solid rgba(255,255,255,.12);
}

.box-bai-hoc .card-body{
padding: 14px 16px;
color: var(--text);
font-size: 14.5px;
}

/* Nếu block bên trong có danh sách/nội dung dài */
.box-bai-hoc .card-body > *:not(:last-child){ margin-bottom: 10px; }

/* ====== Alert ====== */

.box-bai-hoc .btn{display: inline-flex;align-items: center;justify-content: center;gap: 8px;height: 40px;padding: 0 14px;border-radius: 5px;border: 1px solid rgba(148,163,184,.18);background: #a97a31;color: #fff;font-weight: 600;font-size: 13px;letter-spacing: .2px;cursor: pointer;transition: transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;text-decoration: none;user-select: none;white-space: nowrap;margin-top: 0px !important;}
.box-bai-hoc .btn:hover{
transform: translateY(-1px);
box-shadow: var(--shadow);
border-color: rgba(148,163,184,.3);
}
.box-bai-hoc .btn:focus-visible{ outline: none; box-shadow: var(--ring); }

.box-bai-hoc .btn-sm{padding: 0 12px;border-radius: 4px;font-size: 13px;height: 40px;}
.box-bai-hoc .mt-3{ margin-top: 12px; } .mt-4{ margin-top: 16px; }
.box-bai-hoc .ml-2{ margin-left: 8px; }

/* Variants */
.box-bai-hoc .box-bai-hoc .btn-primary{ --btn-bg: var(--primary); color:#fff; border-color: transparent; }
.box-bai-hoc .btn-primary:hover{ background: var(--primary-600); }

/* ====== Khu hành động (sticky như app) ====== */
.box-bai-hoc .lesson-actions{
position: sticky;
bottom: 0;
z-index: 10;
margin-top: 16px;
background: linear-gradient(180deg, transparent, var(--bg-elev) 30%);
padding-top: 8px;
}
.box-bai-hoc .lesson-actions .bar{
display: flex;
gap: 10px;
flex-wrap: wrap;
background: var(--card);
border: 1px solid rgba(148,163,184,.12);
border-radius: 14px;
padding: 10px;
box-shadow: var(--shadow);
}


/* ====== Trạng thái “đã hoàn thành” ====== */
.box-bai-hoc .completed-at{
display: inline-flex;
align-items: center;
gap: 8px;
padding: 8px 10px;
border-radius: 10px;
background: rgba(34,197,94,.1);
color: #16a34a;
border: 1px solid rgba(34,197,94,.25);
font-weight: 600;
}

/* ====== Responsive vi chỉnh nhỏ ====== */
@media (max-width: 480px){
.box-bai-hoc{ padding: 14px; margin: 16px auto; }
.box-bai-hoc .card-header{ padding: 12px; font-size: 14px; }
.box-bai-hoc .card-body{ padding: 12px; font-size: 14px; }
.box-bai-hoc .btn{width: 100%;margin-left: 0px !important;margin-top: 10px !important;}
.box-bai-hoc .lesson-actions .bar{ padding: 8px; }
}
















.total-amount {
display: none !important;
}

.mt-3,
.my-3 {
margin-top: 3px !important;
}

.card-body p {
font-weight: 400 !important;
}

.bg-left p {
padding-bottom: 0px;
}

.btn.btn-sm.btn-info.btn-coppy-link.copyButton.font-13 {
padding: 0 10px;
font-size: 13px;
background: #de2c27;
margin-left: 8px !important;
}

.card-title {
font-size: 18px;
}

#checkrobot~label {
margin-left: 5px;
}

.card-header {
color: #113119;
text-transform: uppercase;
/* background: #a97a31; */
padding-top: 11px;
font-size: 12px !important;
}

h3.card-title {
font-size: 14px;
}

.table-responsive {
padding-top: 15px;
}

.info-box .info-box-icon {}

span.info-box-icon.bg-info {
width: 90px;
height: 90px;
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
border-radius: 100%;
overflow: hidden;
}

span.info-box-icon.bg-info img {
background: #fff;
padding: 17px;
width: 100%;
height: 100%;
object-fit: contain;
}

.info-box .info-box-text,
.info-box .progress-description {
text-transform: capitalize;
}



















div#withdraw-money-box form {
margin-bottom: 20px;
box-shadow: 0 .3125rem .3125rem #523f690d;
}

div#sidebar-profile .avatar {
position: relative;
padding: 85px 10px 10px !important;
border-radius: 0;
/* overflow: hidden; */
justify-content: center;
background: url(https://app.natuh.vn/storage/slider2/TL9lNkq5vRMBdhJp4UrB.jpg);
margin-bottom: 98px;
border-radius: 5px;
background-repeat: no-repeat !important;
background-size: cover !important;
}

div#sidebar-profile .avatar:before {}

div#sidebar-profile .avatar a {
display: inline-block !important;
position: relative;
align-items: center;
margin-bottom: -82px;
}

li.nav-item.active {
border-left: 3px solid #a97a31 !important;
}

.box-nav-virtual {
margin-bottom: 20px;
overflow: hidden;
}

ul.nav.nav-pills.nav-sidebar.menu-profile-mobile {
overflow: hidden;
}

.avata_in {
position: relative;
flex-shrink: 0;
}

.avata_in span {
position: absolute;
color: #333;
background: #fff;
width: 22px;
height: 22px;
font-weight: 700;
top: -7px;
line-height: 22px;
border-radius: 50%;
right: 52px;
}

span.title-qltk {
font-size: 14px;
display: inline-block;
font-weight: 600;
color: #000;
padding-left: 13px;
background: #f5f5f5;
margin-bottom: 0px;
text-transform: uppercase;
height: 40px;
line-height: 40px;
position: relative;
}

#sidebar-profile .avatar h6 {
color: #000;
font-weight: 400;
}

















.box-mobile .info-box {
text-align: center;
}

.box-mobile {
margin: 0px 5px;
width: calc(95% / 4);
padding-bottom: 45px;
}

.box-model-slick-welkey .info-box-text {
color: #000;
}

.box-model-slick-welkey .info-box .info-box-number {
color: #de2c27;
margin-bottom: 5px;
}

.info-box .info-box-icon {}

span.info-box-icon.bg-info i {
font-size: 26px;
color: #fff;
}


















.box-mobile.slick-slide.slick-cloned .info-box {
background: #fff;
}



.box-mobile.slick-slide.slick-cloned.slick-active .info-box {
background: linear-gradient(90deg, rgba(41, 111, 252, 1) 0%, rgba(16, 85, 222, 1) 57%, rgba(9, 64, 173, 1) 100%) !important;
}


.box-mobile.slick-slide .info-box {
background: linear-gradient(90deg, rgba(245, 244, 244, 1) 0%, rgba(171, 171, 171, 1) 45%, rgba(232, 232, 232, 1) 100%) !important;
}

.box-mobile.slick-slide.slick-active .info-box {
background: none !important;
position: relative;
padding: 0px !important;
padding-left: 0px !important;
}









.box-mobile.slick-slide .info-box span.info-box-icon.bg-info {}

.box-mobile.slick-slide.slick-cloned.slick-active .info-box-icon bg-info {
opacity: 1 !important;
}


.box-mobile.slick-slide.slick-cloned.slick-active span.info-box-icon.bg-info {
opacity: 1;
}

.box-mobile.slick-slide.slick-current.slick-active.slick-center span.info-box-icon.bg-info {
opacity: 1;
}

.box-mobile.slick-slide.slick-active span.info-box-icon.bg-info {
background: none !important;
}











.box-slider-box-welkey .info-box:before {}

.info-box .info-box-content {
position: relative;
z-index: 99;
}

.box-slider-box-welkey .info-box:after {}

.box-mobile.slick-slide .info-box {
border-radius: 6px;
overflow: hidden;
}



.box-slider-box-welkey {
flex-wrap: wrap;
}

.box-mobile:nth-child(5) {
padding-bottom: 0px;
}

.box-mobile:nth-child(6) {
padding-bottom: 0px;
}

.box-mobile:nth-child(7) {
padding-bottom: 0px;
}

p.click-hedding-settings {
display: none;
}

span.title-qltk {
width: 100%;
}

@media (min-width: 1200px) {
#sidebar-profile nav .nav-item {
	padding: 5px 13px !important;
}
}

@media (max-width: 1200px) {
.total-amount {
	display: flex;
	flex-direction: column;
	justify-content: right;
	text-align: left;
	align-items: self-start;
}

.pb-3,
.py-3 {
	padding-bottom: 0rem !important;
}

.bg-left {
	margin-bottom: 0;
}

.box-bg {
	border-radius: 15px;
	background-color: white;
	padding: 16px 10px !important;
}

.wrap-profile-container {
	padding: 0px;
}

.avatar {
	border-bottom: 1px solid #eee;
}

.avatar a {
	display: flex;
	align-items: center;
	margin-bottom: 0px;
}

.avatar-mobile {
	width: 60px !important;
	height: 60px !important;
	margin-bottom: 0px !important;
	border: 3px solid #ffffff;
}

.avatar h4 {
	font-size: 14px;
	font-weight: 500;
	margin: 0;
	margin-left: 10px;
	text-align: left;
}

#sidebar-profile nav .nav-item .nav-link i {
	height: 35px;
	width: 35px;
	color: #a97a31 !important;
	background-color: unset;
	font-size: 13px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 0;
	margin: 0 auto;
}

.total-amount .total {
	text-align: left;
}

.total-amount span {
	font-size: 20px;
	font-weight: bold;
	color: #3e3e3e;
	margin-left: 11px;
}

.total-amount p {
	line-height: 19px;
	font-size: 18px;
	font-weight: 500;
	color: #bbb;
}

.total-amount h6 {
	background-color: #0f575a;
	height: fit-content;
	padding: 3px 8px;
	color: white;
	border-radius: 18px;
	font-size: 12px;
	margin-top: 7px;
}

.total-amount h6.level-1 {
	background-color: #e59705;
	margin-top: 7px;
	width: fit-content;
	margin-left: auto;
}

.bg-left,
.main {
	/* background-color: #f3f5f8; */
}

.menu-profile-mobile {
	/* flex-direction: unset !important; */
	flex-wrap: nowrap;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	scroll-snap-stop: always;
	scroll-snap-type: x mandatory;
	scroll-padding-left: 15px;
	overflow-x: auto;
	overflow-x: auto;
	scrollbar-width: none;
}

#sidebar-profile nav .nav-item {
	min-width: 18%;
	scroll-snap-align: start;
}

#sidebar-profile nav .nav-item .nav-link p {
	display: block;
	margin: 0 auto;
	margin-top: 0px;
	margin-top: 5px;
	padding: 0px;
	width: auto;
}

.wrap-profile-container .col-xl-9 {
	background-color: unset;
	padding: 0px 10px;
}

.info-box {
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
	border-radius: 15px;
	align-items: center;
	padding: 3px 8px;
	min-height: 80px !important;
	margin-bottom: 10px;
}

.info-box .info-box-icon {}

.info-box .info-box-text,
.info-box .progress-description {
	font-size: 14px;
	line-height: 1.2;
	font-weight: 500;
}

.info-box-number strong {}

.wrap-content-main .box-mobile:nth-child(4n+1) .info-box .info-box-icon.bg-info,
#sidebar-profile nav .nav .nav-item .nav-link i {}

.info-box .info-box-content {
	padding-left: 10px;
}

.card {
	border: 0px solid rgba(0, 0, 0, .125);
	border-radius: 15px;
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
	margin-bottom: 20px;
	overflow: hidden;
}

.total-amount .nav-item a {
	padding: 0;
}

.total-amount .nav-item {
	margin-top: 5px;
}

.total-amount .nav-item a p {
	font-size: 11px;
}

.total-amount .nav-item a i {
	font-size: 10px;
	color: #bbb;
	margin-left: 5px;
}
}

@media (max-width: 990px) {
p.click-hedding-settings {
	display: block;
}


.box-hedding-setting.active .box-nav-virtual {
	display: flex;
	flex-wrap: wrap;
	gap: 7px 0px;
}

p.click-hedding-settings {
	margin-bottom: 0px;
}

.box-hedding-setting svg {
	width: 30px;
	height: 30px;
	margin-right: 8px;
}

.box-hedding-setting .title-qltk {
	display: flex;
	justify-content: space-between;
}

.box-hedding-setting svg path {
	/* stroke: #0139a7; */
}

.box-nav-virtual {
	display: none;
}

.wrap-profile-container {
	padding-top: 0px !important;
}

ul.nav.nav-pills.nav-sidebar.menu-profile-mobile {
	display: flex;
	flex-direction: column;
}

.box-nav-virtual {
	box-shadow: unset;
	margin-bottom: 0px;
	background: #fff;
}

.box-bg {
	padding: unset !important;
}
}

@media (max-width: 586px) {

.info-box .info-box-text,
.info-box .progress-description {
	white-space: inherit;
	text-align: left;
}

.info-box .info-box-text,
.info-box .progress-description {
	font-size: 13px;
	line-height: 1.3;
}

.card-title {
	font-size: 14px;
}
}

.copyButton {
color: white;
}

.info-box {
border-radius: .25rem;
background-color: #fff;
display: -ms-flexbox;
/* display: flex; */
margin-bottom: 1rem;
min-height: 80px;
padding: .5rem;
position: relative;
width: 100%;
padding-bottom: 20px;
box-shadow: 0 .3125rem .3125rem #523f690d;
}

.info-box .info-box-icon {
border-radius: .25rem;
-ms-flex-align: center;
align-items: center;
display: -ms-flexbox;
display: flex;
font-size: 1.875rem;
-ms-flex-pack: center;
justify-content: center;
text-align: center;
flex: 0 0 auto;
}

.info-box .info-box-content {
display: -ms-flexbox;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
-ms-flex-pack: center;
justify-content: center;
line-height: 1.8;
-ms-flex: 1;
flex: 1;
padding: 0 5px;
}

.info-box .info-box-text,
.info-box .progress-description {
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

.info-box .info-box-number {
display: block;
margin-top: .25rem;
font-weight: 700;
}

.card-title {
font-size: 25px;
font-weight: bold;
margin-top: 0;
}

@media(max-width: 575px) {
.box-mobile {
	padding: 0px 5px;
}

.info-box .info-box-icon {
	border-radius: 0.25rem;
	-ms-flex-align: center;
	align-items: center;
	display: -ms-flexbox;
	display: flex;
	font-size: 1.275rem;
	-ms-flex-pack: center;
	justify-content: center;
	text-align: center;
}

.info-box .info-box-text,
.info-box .progress-description {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 14px;
	font-weight: 600;
}

.info-box .info-box-number {
	display: block;
	margin-top: 0.25rem;
	font-weight: 700;
	font-size: 13px;
	/* color: #e0aa25; */
}
}

@media(min-width: 1200px) {
.income-box {
	display: none;
}
}

.temp-profile {
background-color: #ffffff;
width: 100%;
padding: 10px;
box-shadow: rgba(100, 100, 111, 0.1) 0px 7px 29px 0px;
border-radius: 5px;
}

@media (max-width: 1200px) {
.announcement__title {
	color: #06515a;
	text-shadow: -1px 2px 2px #33333326;
	font-weight: 600;
}

.header-menu-mb ul li .header-mb__search,
.header-menu-mb ul li .header-mb__cart,
.header-menu-mb ul li .header-mb__bar {
	border: 1px solid #07404f;
}

.header-menu-mb ul li svg {
	height: 14px;
	fill: #07404f;
}

.announcement-mobile {
	border-bottom: 1px solid #06515a;
}

.header-mobile {
	background-color: white
}

.header-mobile-bt {
	padding: 5px 0px;
}

.announcement-mobile .announcement__title {
	color: white;
}

.row>* {
	padding-right: 10px;
	padding-left: 10px;
}
}

.list-menu {
display: none;
}

.list-menu .active {
display: block;
}

header .menu .list-menu {
top: 20px;
}

#sidebar-profile {
border-radius: 10px;
overflow: hidden;
padding-bottom: 0px !important;
box-shadow: rgb(0 0 0 / 12%) 0px 1px 4px;
}

.avatar h4 {
font-size: 21px;
font-weight: 600;
margin: 0;
}

.avatar h6 {
font-size: 14px;
}

.avatar .media img {
margin-top: 0;
}

.avatar .media {
align-items: center;
}

.wrap-profile-container {
padding: 40px 0;
background: #eeeeee;
}

#sidebar-profile nav .nav-item {
white-space: nowrap;
padding: 3px 1px;
}

#sidebar-profile nav .nav-item.active {
background: #fafafa;
}

#sidebar-profile nav .nav-item:last-child {
border: unset;
}

.bg-left {
background-color: #fff;
border-radius: 6px;
/* overflow: hidden; */
}

#sidebar-profile nav .nav-item .nav-link {
white-space: nowrap;
overflow: hidden;
font-size: 14px;
position: relative;
padding-left: 25px;
}

#sidebar-profile nav .nav-item .nav-link p {
display: inline-block;
margin: 0;
color: #000;
}

#sidebar-profile nav .nav-item .nav-link i {
margin-right: 5px;
position: absolute;
top: 9px;
left: 0;
color: #a97a31;
}

h1 {
font-size: 25px;
font-weight: bold;
margin-top: 0;
}

.card-title {
margin: 0;
}

.card-title h3 {
margin: 0;
font-size: 25px;
font-weight: bold;
}



/* width */
.hidden-scroll ::-webkit-scrollbar {
width: 2px;
}

/* Track */
.hidden-scroll ::-webkit-scrollbar-track {
background: #f1f1f1;

}

/* Handle */
.hidden-scroll ::-webkit-scrollbar-thumb {
background: #888;

}

/* Handle on hover */
.hidden-scroll ::-webkit-scrollbar-thumb:hover {
background: #555;
}

.info-box .info-box-icon {
background: none !important;
margin: 0 auto;
margin-top: -35px;
}

.info-box .info-box-text,
.info-box .progress-description {
font-size: 16px;
line-height: 1.2;
text-align: center;
}

.info-box .info-box-number {
line-height: 1.4;
font-size: 20px;
}

.table-responsive>.table-bordered {
white-space: nowrap;
background: #fff;
}

.table-responsive>.table-bordered .badge {
font-size: 13px;

}

.card-body p {
font-size: 14px;
padding-bottom: 0px;
}

.card-body p img {
height: 135px;
width: auto;
}

.card-body button {
font-size: 14px;
color: white;
background-color: #a97a31;
border: 1px solid #a97a31;
margin-top: 10px;
padding: 6px 20px;
border-radius: 5px;
text-align: right;
text-transform: uppercase;
float: right;
margin-right: 5px;
}

.card-body button.btn-danger {
color: #06515a;
background-color: #e1e1e1;
border: 1px solid #e1e1e1;
}

.card-body input {
margin-bottom: 10px;
font-size: 14px;

}

.card-body input[type="date"] {
text-align: left;

}
.card-body input[type="date"]::-webkit-date-and-time-value{
text-align: left;
}
.modal-header h5 {
font-size: 18px;
text-align: center;
display: block;
width: 100%;
text-transform: uppercase;
}

.form-control {
display: block;
width: 100%;
height: 40px;
padding: .375rem .75rem;
font-size: 14px;
font-weight: 400;
line-height: 1.5;
color: #495057;
background-color: #fff;
background-clip: padding-box;
border: 1px solid #ced4da;
border-radius: .25rem;
transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
margin-bottom: 6px;
display: block;
}

.modal-header {
background-color: #000;
color: #fff;
background: linear-gradient(297deg, rgb(67, 183, 127) 0%, #06515a 60%);
padding: 10px 10px 6px 10px;
}

br {
display: none;
}

#sidebar-profile .avatar h4 {
text-align: left;
font-size: 18px;
color: #26272b;
font-weight: 600;
}

#sidebar-profile .avatar h6 {
text-align: center;
font-size: 14px;
margin-top: 2px;
}

.im-not-robot {
margin-top: 6px;
}

.im-not-robot~label {
margin-left: 10px;
display: inline-block;
}

.slogan {
flex: 0 0 40%;
text-align: center;
font-weight: bold;
font-size: 20px;
line-height: 27px;
}

.slogan h4 {
background-image: linear-gradient(87deg, rgb(65, 180, 126) 10%, rgb(6, 81, 90) 47%, rgb(62, 175, 124) 81%);
-webkit-background-clip: text;
-webkit-text-fill-color: rgba(0, 0, 0, 0);
font-weight: bold;
font-size: 24px;
}

.slogan h6 {
font-family: "Dancing Script", cursive;
font-size: 25px;
}

.box-slider-box-welkey {
display: flex;
}

span.info-box-icon.bg-info svg {
box-shadow: 0 5px 5px #00000040;
border-radius: 100%;
width: 70px;
height: 70px;
}

.box-mobile:hover {
margin-top: -10px;
transition: 0.5s ease;
}

.box-mobile:hover svg {
box-shadow: unset !important;
transition: 0.5s ease;
}

.content-wrapper {
padding-top: 0px;
}

.box-mobile:nth-child(1) {
margin-left: 0px;
}

.box-mobile:last-child {
margin-right: 0px;
}

.card.card-outline.card-primary {
/* margin-top: 10px; */
border: none;
border-radius: 10px;
overflow: hidden;
}


input.form-control.form-control-sm.price-format.money {
height: 40px;
border-radius: 5px;
}

select#amount_type {
height: 40px;
border-radius: 5px;
}

input.form-control.form-control-sm.price-format {
height: 40px;
border-radius: 5px;
}

.form-group.btn-select-alls {
margin-left: 20px;
}

#confirmation-section table button {
background: #007bff;
border: 1px solid #007bff;
float: left;
}

span.tienich svg {
width: 22px;
height: 22px;
margin-bottom: 0px;
}

p.click-hedding-settings svg path {
fill: #969696 !important;
}

p.click-hedding-settings svg {
width: 16px;
height: 16px;
}

.box-hedding-setting.active p.click-hedding-settings svg {
transform: rotate(90deg);
}

#sidebar-profile nav .nav-item .nav-link svg {
width: 25px;
height: 25px;
}

.box-nav-virtual.logout {
background: #fafafa;
margin-bottom: 0px;
}

span.tienich {
font-size: 13px;
}

.box-hedding-setting.logout span.title-qltk {
font-size: 13px;
}

.box-hedding-setting.logout span.title-qltk {
display: flex;
}


.box-hedding-setting.logout span.title-qltk a {
display: flex;
align-items: center;
gap: 0px 10px;
}

.box-hedding-setting.logout span.title-qltk a p {
margin-bottom: 0px;
}

span.tienich i {
margin-right: 5px;
}

.images-avatar-profile img {
width: 50px;
height: 50px;
border-radius: 100%;
border: 3px solid #fff;
}

.box-header-profile-mobile {
background: url(../images/bg-profile.jpg);
border-radius: 0px 0px 20px 20px;
overflow: hidden;
background-repeat: no-repeat;
background-size: cover;
}

.box-silbar-profile-mobile p {
margin-bottom: 0px;
}

.box-member-left-profile {
display: flex;
align-items: center;
gap: 0px 15px;
}

.content-profile-avatar p {
color: #fff;
font-size: 15px;
}

.content-profile-avatar span,
.content-profile-avatar a {
color: #fff;
font-size: 19px;
letter-spacing: 0.4px;
line-height: 1.2;
font-weight: 700;
}

.disable-event {
pointer-events: none;
}

.box-name-profile {
display: flex;
justify-content: space-between;
padding: 15px 15px 0px;
}

.thongbao-thumb svg {
width: 35px;
height: 35px;
}

.thongbao-thumb {
position: relative;
}

.thongbao-thumb span {
position: absolute;
background: #eee;
font-size: 10px;
padding: 0px 5px;
color: #8d0b0b;
font-weight: 800;
border-radius: 25px;
right: -2px;
top: -1px;
}

.list-data-body-header ul {
display: flex;
justify-content: space-between;
}

.box-data-header-bottom {
margin: 15px 15px;
background: #11321a9c;
padding: 10px 15px;
border-radius: 11px;
}

.list-data-body-header ul li {
width: calc(100% / 3);
text-align: center;
position: relative;
}

.list-data-body-header ul li {
color: #fff;
}

.list-data-body-header ul li p {
font-size: 13px;
font-weight: 300;
}

.list-data-body-header ul li span {
font-size: 16px;
font-weight: 700;
}

.list-data-body-header ul li:before {
content: "";
position: absolute;
width: 1px;
height: 72%;
background: #bdbdbd;
right: 0;
top: 50%;
transform: translateY(-50%);
}

.list-data-body-header ul li:last-child:before {
content: "";
width: unset;
background: none;
}

.box-bottom-kepper-profile {
background: #fff;
padding: 5px 20px;
}

.item-ground-profile-body-bottom svg {
width: 22px;
height: 22px;
}

.item-ground-profile-body-bottom {
text-align: center;
}

.list-groud-bottom-profile {
display: flex;
justify-content: space-between;
}

.thongbao-thumb i {
font-size: 27px;
color: #fff;
}


.box-Statistics p {
font-size: 12px;
line-height: 1.2;
font-weight: 400;
}

.box-Statistics span {
font-weight: 700;
font-size: 14px;
}

.box-silbar-profile-mobile {
margin-bottom: 10px;
}

.row-profile {
flex-wrap: wrap;

}

.row.box-member-desks {
display: none;
}



.box-list-menu-member-mobile {
padding: 10px;
border-radius: 15px 15px 0px 0px;
background: #fff;
}

.wrap-profile-container {
/* min-height: 100vh; */
/* background: #a87932; */
}

.box-member-desks .table {
background: #fff;
}

.box-member-desks .table .badge {
font-size: 14px;
}

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

.list-menus {
display: flex;
flex-wrap: wrap;
//justify-content: space-between;
margin-top: 15px;
gap: 15px 0px;
}

.item-menu-list-member {
width: calc(100% / 4);
}

.item-menu-list-member a {
display: block;
text-align: center;
padding: 0px 15px;
}

.content-icon-menu p {
line-height: 1.1;
font-size: 12px;
color: #000;
margin-bottom: 0px;
}

.content-icon-menu {
margin-top: 5px;
}



.row-profile {
padding-bottom: 90px;
}


.img-avart-list-tv img {
width: 40px;
height: 40px;
margin-bottom: 10px;
border-radius: 100%;
}

.item-qr img {
width: 45px;
height: 45px;
}

.item-ground-profile-body-bottom.thanhvien {
display: flex;
align-items: center;
gap: 0px 10px;
text-align: left;
}

/* .list-menus .item-menu-list-member:nth-child(n+9) {
display: none;
} */
.list-menus .item-menu-list-member:nth-child(n+8):not(:last-child) {
display: none;
}

.list-menus.show-all .item-menu-list-member {
display: block !important;
}

.images-avatar-profile .logout i {
color: #fff;
position: absolute;
bottom: 0;
right: 0;
width: 20px;
height: 20px;
background: #11321a9c;
font-size: 10px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 100%;
}

.box-member-right-profile {
gap: 10px 15px;
}

.logout-profile {
width: 30px;
height: 30px;
background: #11321a9c;
font-size: 14px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 100%;
color: white;
}

.images-avatar-profile {
position: relative;
}

.box-list-menu-member-mobile {
display: none;
}

.row.box-member-desks {
display: block;
}


.box-silbar-profile-mobile {
display: none;
}

.profile-cover {
position: relative;
z-index: 1;
}

.profile-cover label {
position: relative;
overflow: hidden;
line-height: 0;
}

.profile-cover label::before {
content: "";
padding-top: calc((3/8) * 100%);
display: block;
}

.profile-cover img,
.profile-avatar-editer img {
max-width: 100% !important;
width: 100%;
height: 100% !important;
position: absolute;
left: 0;
top: 0;
padding: 0 !important;
border: 0 !important;
}

.profile-cover input[type="file"],
.profile-avatar-editer input[type="file"] {
position: absolute;
left: 0;
opacity: 0;
}

.profile-avatar-editer label {
position: relative;
overflow: hidden;
line-height: 0;
border-radius: 50%;
width: 150px;
height: 150px;
border: 5px solid #fff;
transform: translateY(-50%);
z-index: 2;
margin: 0 auto;
margin-bottom: -60px;
}

.profile-box-image .fas {
position: absolute;
top: 10px;
right: 10px;
z-index: 2;
width: 30px;
height: 30px;
background: #11321a9c;
font-size: 14px;
display: flex;
justify-content: center;
align-items: center;
border-radius: 100%;
color: white;
}

.profile-box-image {
margin: -10px -13px 0;
}























.list-filter-service {
position: relative;
/* Responsive design */
}
.list-filter-service .search-container {
max-width: 1000px;
margin: 0 auto;
background: linear-gradient(135deg, #c53030, #e53e3e);
border-radius: 12px;
padding: 20px;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
position: absolute;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
}
.list-filter-service .search-bar {
display: flex;
gap: 12px;
margin-bottom: 16px;
}
.list-filter-service .search-input-wrapper {
flex: 1;
position: relative;
}
.list-filter-service .search-input {
width: 100%;
padding: 14px 16px 14px 48px;
border: none;
border-radius: 8px;
font-size: 16px;
background: #f2f2f2;
color: #333;
outline: none;
transition: all 0.3s ease;
}
.list-filter-service .search-input:focus {
box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.3);
}
.list-filter-service .search-input::placeholder {
color: #666;
}
.list-filter-service .search-icon {
position: absolute;
left: 16px;
top: 50%;
transform: translateY(-50%);
color: #666;
font-size: 18px;
}
.list-filter-service .search-button {
padding: 14px 28px;
background: #fff;
color: #000;
border: none;
border-radius: 8px;
font-size: 16px;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
white-space: nowrap;
}
.list-filter-service .search-button:hover {
background: #ffffff;
transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
color: #d23d39;
}
.list-filter-service .filters {
display: flex;
gap: 12px;
}
.list-filter-service .filter-select {
flex: 1;
padding: 14px 16px;
border: none;
border-radius: 8px;
font-size: 16px;
background: rgb(255 255 255 / 90%);
color: #000000;
cursor: pointer;
outline: none;
/* appearance: none; */
/* background-image: url('data:image/svg+xml;charset=US-ASCII,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4 5"><path fill="white" d="m0 0 2 2 2-2z"/></svg>'); */
background-repeat: no-repeat;
background-position: right 16px center;
background-size: 12px;
transition: all 0.3s ease;
}
.item-images-products-custum {
position: relative;
border-radius: 10px;
overflow: hidden;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}
.search-input-wrapper select {
width: 100%;
}
.content-products-tion {
position: absolute;
bottom: 10px;
left: 50%;
transform: translateX(-50%);
font-size: 17px;
color: #fff;
width: 90%;
text-align: center;
line-height: 1.3;
}

.item-images-products-custum:before {
content: "";
position: absolute;
width: 100%;
height: 100%;
background-image: linear-gradient(180deg, rgba(44, 44, 44, 0) 27%, #000000 100%);
}
.list-filter-service .search-container:after {
content: "";
position: absolute;
width: 100%;
height: 100%;
/* background: url(https://app.natuh.vn/storage/slider2/8l0xXGISYgIUW3MmRR6J.jpg); */
top: 0;
left: 0;
right: 0;
opacity: .1;
background-size: cover;
z-index: -1;
}

.list-filter-service .search-button svg {
height: 21px;
}
.wrap-load-image-text{
background: #11321a9c;
position: absolute;
left: 0;
bottom: 0;
width: 100%;
color: white;
font-size: 13px;
text-align: center;
z-index: 2;
line-height: 1;
padding: 5px;
}.box-images-servicer-filter img {
width: 100%;
}
.list-filter-service .search-button svg {
display: none;
}
section.blogs.giaotrinh_dangky  .info-text {
text-align: center;
margin-top: 20px;
font-size: 12px;
color: #718096;
line-height: 1.5;
display: inline-block;
}

@media(max-width:990px) {
.list-filter-service .search-button span {
	display: none;
}
.content-products-tion {
	font-size: 13px;
	width: 96%;
	text-align: center;
}
button.search-button {
	padding: unset !important;
}
.row.box-member-desks {
	display: none;
}

.box-list-menu-member-mobile {
	display: block;
}

.box-silbar-profile-mobile {
	display: block;
}

.bg-left {
	display: none;
}

.wrap-profile-container .form-control {
	height: 33px;
}
}

@media(min-width:1200px) {
#sidebar-profile nav .nav-item .nav-link svg {
	margin-top: -10px;
}
}

@media(min-width:990px) {

.clm-right {
	padding: 0px 10px;
}

.row-profile {
	display: flex;
}

.box-nav-virtual {
	margin-bottom: 0px;
}

div#sidebar-profile .avatar a {
	display: flex !important;
	margin-bottom: unset !important;
	gap: 0px 10px;
}

div#sidebar-profile .avatar {
	display: block !important;
	padding: 15px !important;
	margin-bottom: unset;
	background: #f5f6f9;
}

span.tienich {
	font-size: 14px;
}

span.tienich i {
	margin-right: 5px;
}

span.tienich svg {
	margin-right: 5px;
}

#sidebar-profile nav .nav-item .nav-link p {
	margin-left: 8px;
}
}
@media(min-width:600px){
.box-navigation-footer .nav-text {
	font-size: 15px;
}

.box-navigation-footer .nav-item img {
	height: 40px !important;
}
}
@media(max-width: 1200px) {
.menu-profile-mobile {
	gap: 5px;
}

#sidebar-profile nav .nav-item .nav-link i {
	margin-right: 5px;
	position: unset;
}

.menu-profile-mobile .nav-item {
	white-space: normal;
	border-bottom: 1px solid #e5e5e5;
	margin: 0 auto;
}

.menu-profile-mobile .nav-item .nav-link:hover {
	color: #06515a;
}

.menu-profile-mobile .nav-item .nav-link {
	white-space: normal !important;
	overflow: hidden;
	display: flex;
	/* flex-direction: column; */
	text-align: center;
	padding: 0px;
	align-items: center;
	padding-left: 0px !important;
}

.menu-profile-mobile .nav-item .nav-link i {
	margin-right: 5px;
	background: #ffffff;
	border-radius: 200px;
	margin: 0px 0px 0px 0px !important;
	color: var(--color-body) !important;
	font-size: 26px;
	width: 75px;
	height: 43px;
	margin: 0 auto;
	padding-top: 11px;
}

.menu-profile-mobile .nav-item {
	white-space: nowrap;
	border-bottom: 1px solid #ffffff !important;
}

.menu-profile-mobile .nav-item .nav-link p {
	display: inline-block;
	word-wrap: break-word;
	width: 60px;
	font-size: 13px;
	margin: 0 auto;
	font-weight: bold;
}

.avatar-mobile {
	width: 60px !important;
	height: 60px !important;
	border-radius: 60px !important;
}

.info-box-number strong {
	font-size: 15px;
}

.info-box {
	min-height: 50px !important;
}

.bg-left {
	margin-bottom: 15px;
}

.wrap-profile-container .col-xl-9 {
	background-color: white;
	padding: 15px;
}
}

@media(max-width:990px) {

.list-filter-service .search-button svg {
	display: block;
	height: 17px;

}

.box-images-servicer-filter {
	display: none;
}

.list-filter-service {
	display: flex;
	flex-direction: column;
}
.list-filter-service .search-button {
	width: 40px;
	height: 40px;
	border: 1px solid #a97a3163;
}

.list-filter-service .filter-select {height: 40px;padding: 0px 10px;font-size: 14px;border: 1px solid #a97a3163;}
.list-filter-service .search-container {
	max-width: unset;
	position: unset;
	transform: unset;
	order: 1;
	margin-bottom: 10px;
	border-radius: unset;
	padding: 20px 10px;
	background: #eee;
}

.box-images-servicer-filter {
	order: 2;
}

.wrap-profile-container {
	padding-bottom: 146px !important;
}
.wrap-profile-container .ctnr {
	padding: unset;
	overflow: hidden;
}

.box-nav-virtual {
	/* opacity: 0; */
	/* height: 0px; */
	/* margin-bottom: 0px; */
}


.header-profiles {
	padding: unset;
}

#sidebar-profile {
	border-radius: unset;
}

.bg-left {
	border-radius: unset;
}



#sidebar-profile nav .nav-item {
	min-width: unset;
	margin: unset !important;
	padding: 5px 5px;
	/* border-bottom: 1px solid #cdcdcd7a !important; */
	width: calc(100% / 3);
	text-align: center;
}

#sidebar-profile nav .nav-item .nav-link {
	justify-content: center;
	display: flex;
	flex-direction: column;
	text-align: center;
}

#sidebar-profile nav .nav-item .nav-link i {
	display: unset;
	width: 30px;
	height: unset;
	color: #999 !important;
	font-size: 20px;
	background: none;
	margin: 0 auto !important;
}

#sidebar-profile nav .nav-item .nav-link p {
	display: unset !important;
	margin-top: 2px !important;
	width: unset !important;
	/* padding-left: 15px; */
	font-size: 12px;
	color: #000000;
	text-align: center;
	font-weight: 400;
}

#sidebar-profile nav .nav-item:last-child {
	border-bottom: none !important;
}

section.header-mobile {
	/* display: none; */
}

.box-form-rutien {
	display: block !important;
}

.box-slider-box-welkey {
	flex-wrap: wrap;
}

.box-mobile {
	width: 100%;
	flex: 0 0 100%;
	max-width: 100%;
	margin: unset;
	margin-bottom: 40px;
}



button.btn.btn-sm.btn-info.btn-coppy-link.copyButton.font-13 {
	background: none;
	margin-top: 0px;
	margin-top: 5px !important;
	padding: 0px;
	width: auto;
	font-weight: 800;
	font-size: 14px !important;
	margin-left: 15px;
}

span.title-qltk {
	width: 100%;
}

.total-amount {
	display: none;
}

.profile-avatar-editer label {
	width: 100px;
	height: 100px;
}
.box-navigation-footer .nav-item img {
	height: 35px !important;
}

.box-navigation-footer .bottom-navigation {
padding: unset;
}
.wrapper.home {
padding-bottom: 115px;
} 
}

@media (max-width: 575px) {
.list-filter-service .filter-select {
	width: calc(100% / 3 - 10px);
}

.search-input-wrapper select {
	width: 100% !important;
}

.box-mobile {
	padding: 0px 5px;
	width: 50%;
	-ms-flex: 0 0 50%;
	flex: 0 0 50%;
	max-width: 50%;
}

.wrap-pay .col-md-6 {
	padding: 0px 5px;
}

#sidebar-profile nav .nav-item .nav-link {
	padding-left: 0px;
}

.btn-coppy-link {
	font-size: 10px !important;
	padding: 0px !important;
	background-color: transparent;
	border: 0 !important;
	color: black !important;
}

.btn-delete-form {
	font-size: 10px !important;
	padding: 0px !important;
	background-color: transparent;
	border: 0 !important;
	color: black !important;

}


}

@media (max-width: 575px) {
.box-mobile {
	padding: 0px 5px;
	width: 50%;
	-ms-flex: 0 0 50%;
	flex: 0 0 50%;
	max-width: 50%;
	margin-bottom: 30px;
}

.wrap-pay .col-md-6 {
	padding: 0px 5px;
}

#sidebar-profile nav .nav-item .nav-link {
	padding-left: 0px;
}

footer .row .clm:nth-child(2) {
	display: none;
}

.footer-logo img {
	display: none;
}

footer {
	padding-bottom: 0px !important;
}

.card-title {
	font-size: 14px;
}
}

@media (max-width: 485px) {
.menu-profile-mobile .nav-item .nav-link p {
	font-size: 10px;
}
}

.avatar-mobile {
width: 65px;
height: 65px;
object-fit: cover;
margin-bottom: 11px;
border-radius: 100%;
border: 2px solid #fff;
}

#checkrobot {
margin-right: 5px;
}

.text-success {
color: #ff6363 !important;
}

@media(max-width : 586px) {
.hide-mobile {
	/* display: none; */
}
}



.giaotrinh_dangky .service-slider-blog {
padding: 40px 0;
align-items: center;
justify-content: center;
}
.giaotrinh_dangky .service-slider-blog .container {
max-width: 500px;
margin: 0 auto;
}
.giaotrinh_dangky .service-slider-blog h1 {
text-align: center;
color: #2c3e50;
font-size: 23px;
font-weight: 700;
margin-bottom: 30px;
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.giaotrinh_dangky .guide-register-form {
background: white;
padding: 20px;
border-radius: 5px;
transition: all 0.3s ease;
border: 1px solid rgba(255, 255, 255, 0.2);
margin: 0 auto;
width: 500px;
box-shadow: 0 15px 35px rgb(0 0 0 / 13%);
}
.giaotrinh_dangky .guide-register-form:hover {
transform: translateY(-5px);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}
.giaotrinh_dangky .form-group {
position: relative;
margin-bottom: 25px;
}
.giaotrinh_dangky .form-group label {
display: block;
margin-bottom: 8px;
color: #34495e;
font-weight: 600;
font-size: 13px;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.giaotrinh_dangky .form-control {
width: 100%;
padding: 14px 18px;
border: 1px solid #e8ecef;
border-radius: 5px;
font-size: 14px;
background: #f8f9fa;
transition: all 0.3s ease;
color: #2c3e50;
}
.giaotrinh_dangky .form-control:focus {
outline: none;
border-color: #3498db;
background: white;
box-shadow: 0 0 0 4px rgba(52, 152, 219, 0.1);
transform: translateY(-2px);
}
.giaotrinh_dangky .form-control::placeholder {
color: #95a5a6;
font-style: italic;
}
.giaotrinh_dangky textarea.form-control {
resize: vertical;
min-height: 100px;
}
.giaotrinh_dangky .btn-primary {
background: linear-gradient(107deg, rgba(17, 50, 26, 1) 18%, rgba(16, 57, 27, 1) 49%, rgba(0, 69, 19, 1) 85%);
border: none;
padding: 9px 15px;
border-radius: 5px;
font-size: 16px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 1px;
transition: all 0.3s ease;
box-shadow: 0 5px 15px rgba(52, 152, 219, 0.3);
}
.giaotrinh_dangky .btn-primary:hover {
background: #a97a31;
transform: translateY(-3px);
box-shadow: 0 8px 25px rgba(52, 152, 219, 0.4);
}
.giaotrinh_dangky .btn-primary:active {
transform: translateY(-1px);
}
.giaotrinh_dangky .text-danger {
color: #e74c3c !important;
font-size: 13px;
margin-top: 5px;
display: block;
font-weight: 500;
}
@keyframes slideInUp {
from {
	opacity: 0;
	transform: translateY(30px);
}
to {
	opacity: 1;
	transform: translateY(0);
}
}
.giaotrinh_dangky .form-group {
animation: slideInUp 0.6s ease forwards;
margin-bottom: 20px !important;
}
.giaotrinh_dangky .form-group:nth-child(1) {
animation-delay: 0.1s;
}
.giaotrinh_dangky .form-group:nth-child(2) {
animation-delay: 0.2s;
}
.giaotrinh_dangky .form-group:nth-child(3) {
animation-delay: 0.3s;
}
.giaotrinh_dangky .form-group:nth-child(4) {
animation-delay: 0.4s;
}
.giaotrinh_dangky .btn-primary {
animation-delay: 0.5s;
}
@media (max-width: 768px) {
.giaotrinh_dangky .service-slider-blog {
	padding: 10px 0px;
	}
.giaotrinh_dangky .guide-register-form {
	padding: 30px 20px;
	width: 100%;
	}
.giaotrinh_dangky .service-slider-blog h1 {
	font-size: 19px;
	margin-bottom: 25px;
	}
.giaotrinh_dangky .form-control {
	padding: 6px 16px;
	font-size: 15px;
	height: 35px;
}
.giaotrinh_dangky .btn-primary {
	padding: 9px 21px;
	font-size: 14px;
	}
}
.giaotrinh_dangky .form-control.is-valid {
border-color: #27ae60;
background-repeat: no-repeat;
background-position: right calc(0.375em + 0.1875rem) center;
background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}
.giaotrinh_dangky .btn-primary.loading {
pointer-events: none;
position: relative;
color: transparent;
}
.giaotrinh_dangky .btn-primary.loading::after {
content: "";
position: absolute;
width: 20px;
height: 20px;
top: 50%;
left: 50%;
margin-left: -10px;
margin-top: -10px;
border: 2px solid transparent;
border-top-color: #fff;
border-radius: 50%;
animation: spin 1s linear infinite;
}


@keyframes spin {
0% {
	transform: rotate(0deg);
}
100% {
	transform: rotate(360deg);
}
}
.giaotrinh_dangky .form-control:focus, .giaotrinh_dangky .btn-primary:focus {
outline: 2px solid #3498db;
outline-offset: 2px;
}
.giaotrinh_dangky .form-group:hover label {
color: #3498db;
transition: color 0.3s ease;
}
.giaotrinh_dangky textarea.form-control::-webkit-scrollbar {
width: 6px;
}
.giaotrinh_dangky textarea.form-control::-webkit-scrollbar-track {
background: #f1f1f1;
border-radius: 3px;
}
.giaotrinh_dangky textarea.form-control::-webkit-scrollbar-thumb {
background: #bdc3c7;
border-radius: 3px;
}
.giaotrinh_dangky textarea.form-control::-webkit-scrollbar-thumb:hover {
background: #95a5a6;
}

.content-profile-avatar {
    color: #Fff;
}

.danh-sach-bai-kiem-tra{
	overflow: hidden;
}
.card-footer.text-center a.btn.btn-success.btn-sm {
    color: #fff;
    border-radius: 10px;
}
@media(min-width:990px){
	.box-profile-hoc-vien .box-nav-virtual li img {
		display: none;
	}
}

@media(max-width:990px){
	.box-flex-member {
		flex-wrap: wrap;
	}

	.box-profile-hoc-vien .images-icon-menu i {
		font-size: 28px;
		color: #fff;
	}
	
	.box-profile-hoc-vien .images-icon-menu {
		padding: 15px 10px;
		border-radius: 8px;
		background: linear-gradient(90deg,rgba(13, 94, 181, 1) 0%, rgba(44, 146, 201, 1) 50%, rgba(89, 220, 227, 1) 100%);
		margin-bottom: 10px;
		height: 65px;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	
	.box-profile-hoc-vien  .item-menu-list-member a {
		padding: 0px 9px;
	}
	
}