@media (max-width: 768px) {
    	.modal-body #toolbox {
				position: sticky !important;
			}
}

@media (max-width: 5008px) {

			#addModal2 #toolbox {
				padding-inline: 20px;
			}
		
			.view-content-popup.view-big .modal-header {
				z-index: 999999999;
			}

			.thongtin-baihoc span i {
				padding-right: 5px;
				width: 18px;
			}

			#addModal2 #toolbox::-webkit-scrollbar {
				width: 2px !important;
				height: 2px !important;
			}

			#addModal2 #load-view-cauhoiluyentap .col-md-10 {
				margin-bottom: 20px;
			}

			#addModal2 .modal-dialog.view-contentbaihoc.view-big {
				margin-top: 0px !important;
				width: 100%;
				display: flex;
			}

			#addModal2 #load-view-cauhoiluyentap .col-md-2 {
				top: 70px !important;
				right: 0px !important;
				background: #fff;
			}

			#addModal2 #load-view-cauhoiluyentap .col-md-2.no-top {
				top: 0px !important;
			}

			#addModal2 .modal-footer.exam {
				width: 100%;
				bottom: 0px;
				right: 0px;
				position: sticky !important;
			}

			.user-section .col.s2 {
				width: 20% !important;
			}

			.user-section .col.s10 {
				width: 80% !important;
			}

			.user-section .col.s2.media-image {
				max-width: 100% !important;
				margin-right: auto !important;
			}

			.modal-body #toolbox {
				width: 100% !important;
				bottom: 50px ;
				left: 0px !important;
				top: auto !important;
				z-index: 9999999;
			}

			.modal-body #toolbox .pagination {
				display: flex ;
				margin: 10px 0px -2px 0px !important;
			}
		}
		
/*.cauhoitracnghiem img{*/
/*    width: 100%;*/
/*}*/
body.theme-dark{
    background-color: #000;
}
.dot-spinner {
  --uib-size: 2.8rem;
  --uib-speed: .9s;
  --uib-color: #183153;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  height: var(--uib-size);
  width: var(--uib-size);
  margin: 48vh auto;
  width: 45px;
  height: 45px;
}
#loader.ajax-loader{background: #ffffffe3!important;}
.dot-spinner__dot {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  height: 100%;
  width: 100%;
}

.dot-spinner__dot::before {
  content: '';
  height: 20%;
  width: 20%;
  border-radius: 50%;
  background-color: var(--uib-color);
  transform: scale(0);
  opacity: 0.5;
  animation: pulse0112 calc(var(--uib-speed) * 1.111) ease-in-out infinite;
  box-shadow: 0 0 20px rgba(18, 31, 53, 0.3);
}

.dot-spinner__dot:nth-child(2) {
  transform: rotate(45deg);
}

.dot-spinner__dot:nth-child(2)::before {
  animation-delay: calc(var(--uib-speed) * -0.875);
}

.dot-spinner__dot:nth-child(3) {
  transform: rotate(90deg);
}

.dot-spinner__dot:nth-child(3)::before {
  animation-delay: calc(var(--uib-speed) * -0.75);
}

.dot-spinner__dot:nth-child(4) {
  transform: rotate(135deg);
}

.dot-spinner__dot:nth-child(4)::before {
  animation-delay: calc(var(--uib-speed) * -0.625);
}

.dot-spinner__dot:nth-child(5) {
  transform: rotate(180deg);
}

.dot-spinner__dot:nth-child(5)::before {
  animation-delay: calc(var(--uib-speed) * -0.5);
}

.dot-spinner__dot:nth-child(6) {
  transform: rotate(225deg);
}

.dot-spinner__dot:nth-child(6)::before {
  animation-delay: calc(var(--uib-speed) * -0.375);
}

.dot-spinner__dot:nth-child(7) {
  transform: rotate(270deg);
}

.dot-spinner__dot:nth-child(7)::before {
  animation-delay: calc(var(--uib-speed) * -0.25);
}

.bg-black{
    background-color: #000;
}

.dot-spinner__dot:nth-child(8) {
  transform: rotate(315deg);
}

.dot-spinner__dot:nth-child(8)::before {
  animation-delay: calc(var(--uib-speed) * -0.125);
}

@keyframes pulse0112 {
  0%,
  100% {
    transform: scale(0);
    opacity: 0.5;
  }

  50% {
    transform: scale(1);
    opacity: 1;
  }
}
.dropdown-menu{ 
    padding: 0px 10px;
}
.dropdown-item{
    border-radius: 8px;
    background-color: #f1f1f1;
    padding: 10px;
    margin: 10px 0px;  
    display: flex !important;
    justify-content: space-between;
    line-height: 30px;
}

.main-menu-wrapper{
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    border-radius: 8px; 
}
.header-nav{background-color:#fff!important;}
.main-nav > li > a, .main-nav > li .submenu li a{color: #000!important;}
.main-nav > li.active > a, .main-nav .has-submenu.active > a, .main-nav .has-submenu.active .submenu li.active > a{
    color: #ff9f43!important;
}
a:hover{color: #ff9f43!important;}
.main-nav li a:hover{color: #ff9f43!important;}
.banner-bg {
	height:600px!important;
	background: url(../images/banner.png) top right no-repeat!important;
	background-size: 600px!important;
}
.main-wrapper .banner-section {
	background: #CFE8FC!important;
}
.banner-content {
    padding: 100px 100px 100px 0px!important;
}
.view-mb{display:none;}
/* .footer{background-color: #fff!important;} */
.home-page .footer{border-top: 15px solid #EEFAFF;}
.footer-title{color: #ff9f43!important;}
.footer .footer-menu ul li a, .footer .footer-widget .footer-about-content p, .footer-contact-info{color: #737373!important;}
.about-footer h2{color: #ff9f43!important;}
.footer .footer-widget.footer-menu ul{color: #737373!important;}
.icon-footer{width:30px;}
.footer-contact-info .icon-link{margin:10px 10px;}
.banner-content span{color:#253246!important; font-weight: bold;}
.footer .footer-top{padding-bottom: 0px!important;}
.header-nav{height:70px!important;}
.logo{width:auto!important; margin-right: 50px;}
.main-nav > li.add-sukienkhuyenmai a{color:#2E3842!important;}
.add-sukienkhuyenmai .fa-gift{color:#FDDE6A!important; font-size: 18px;}
.header .menu-login{background: #ff9f43!important;}
.header .menu-register{background: #fff!important; color: #2E3842!important; border-color: #7a7a7a!important;}
.header .contact-item a:hover{color: #ff9f43!important; border-color: #ff9f43!important;}
.bg-login{background: #EEEEEE!important;}
.breadcrumb-bar{background-color:#EEFAFF!important; padding:10px 0px!important; display: none;}
.page-breadcrumb ol li a{color: #ff9f43!important;}
.page-breadcrumb ol li.active{color: #2E3842!important;}
.page-breadcrumb .breadcrumb-item+.breadcrumb-item:before{color: #ff9f43!important;}
.login-right{background-color:transparent!important; border:none!important;}
.btn-lg.login-btn { 
	background: #FF9F43!important;
    color: #fff;
    border-radius: 8px;
    border: 5px solid #FF9F43!important;
    border-right: none!important;
    border-top: none!important;}
.login-right .dont-have a{color: #ff9f43!important;}
.form-focus .form-control {
    padding: 21px 21px 6px!important;
    border-radius: 8px;
}
.form-focus .focus-label{left: 21px!important;}
#register .form-group{margin-bottom: 15px!important;}
.captcha-image.image_captcha img, input#captcha{border-radius: 8px;}
.login-header h3 {
    font-size: 24px!important;
    margin-bottom: 3px;
    font-weight: bold;
}
input#captcha{padding:5px 20px!important;}
.book-btn {
    background-color: #ff9f43!important;
    border: 2px solid #ff9f43!important;
    border-radius: 8px;
}

.profile-widget{background-color: #fff!important; text-align: center; border-radius: 8px;box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;}
.list-loptructuyen{ padding-bottom: 30px;}
.gridFilter .tab-menu{color: #2E3842!important; border: none!important; border-radius: 8px; box-shadow: 0 0 0 rgb(0 0 0 / 1%)!important;}
.gridFilter button.active, .gridFilter button:hover{background:#FDDE6A!important; color: #2E3842!important; box-shadow: 0 5px 18px rgb(0 0 0 / 5%)!important;}
.modal-header{background: none!important;}



.modal-content .close.close-primary{background: #8D8D8D; width: 30px; height: 30px; position: absolute; right: -8px; top: -8px; color: white; border-radius: 4px; font-weight: 300;
    opacity: 1!important;
}

@media only screen and (max-width: 765px){
    .modal-content .close.close-primary{
        right: 0px; top: 0px;
    }
}
.modal-content .close.close-primary:hover{
    font-weight: 600;
    background-color:  #ff9f43!important;
}
.select-icon:before{
    display: block;
    content: url("data:image/svg+xml;charset=UTF-8, <svg width='16' height='9' viewBox='0 0 16 9' fill='none' xmlns='http://www.w3.org/2000/svg'> <path d='M1.87884 0.928905C1.47153 0.521595 0.811151 0.521596 0.403842 0.928906C-0.00346849 1.33622 -0.00346849 1.9966 0.403841 2.40391L5.17125 7.17132C6.73335 8.73341 9.266 8.73341 10.8281 7.17131L15.5955 2.40391C16.0028 1.9966 16.0028 1.33622 15.5955 0.928906C15.1882 0.521596 14.5278 0.521596 14.1205 0.928906L10.8281 4.22131C9.266 5.78341 6.73334 5.78341 5.17125 4.22131L1.87884 0.928905Z' fill='#FF9F43'/> </svg>");
    background-size: 28px 28px;
    height: 28px;
    width: 28px;     
    color: #ff9f43;
  }
.modal-footer .btn-danger{
	background-color:  #ff9f43!important;
    border: 1px solid  #ff9f43!important;
}
.modal-footer .open-modal-1.btn-primary, .modal-footer .dong-tracnghiem{
	margin-left: 10px;
}
/* Nút số câu hỏi - Light mode */
#toolbox a.page {
    position: relative;
    cursor: pointer;
    background: #f9f9f9;
    color: #529bc5;
    width: 40px;
    height: 40px;
    font-size: 14px;
    text-align: center;
    display: inline-block;
    padding: 10px !important;
    margin: 2px 5px;
    border-radius: 12px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow:
        2px 2px 6px rgba(0, 0, 0, 0.1),
        -2px -2px 6px rgba(255, 255, 255, 0.5);
    transition: background 0.3s ease, box-shadow 0.3s ease;
}

#toolbox a.page:hover,
#toolbox a.page.active {
    background: #5899fc !important;
    color: #fff;
    box-shadow:
        inset 2px 2px 6px rgba(0, 0, 0, 0.1),
        inset -2px -2px 6px rgba(255, 255, 255, 0.3);
}

/* Chấm trạng thái (căn giữa trên đầu nút) */
#toolbox a.page .select:before,
#toolbox a.page .select.dung:before,
#toolbox a.page .sai:before {
    content: "";
    position: absolute;
    top: -6px;
    left: 50%;
    transform: translateX(-50%);
    width: 10px;
    height: 10px;
    border-radius: 50%;
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.25);
}

#toolbox a.page .select:before {
    background: #0065FF;
}

#toolbox a.page .select.dung:before {
    background: #2fb809 !important;
}

#toolbox a.page .sai:before {
    background: #f3251b;
}


.modal-dialog.view-big{margin: 0px auto!important;}
.contact-item a{background:#fff!important; color: #ff9f43!important;  border-color: #ff9f43!important;}
#updateUser input[name="diemthuong"]{background:#fff!important; color:#ee2c4d!important;}
.main-nav > li {
    margin-right: 40px!important;
}
.dark-mode-icon i{font-size:28px;}
.dark-mode-icon .bx-moon{color: #fdde6a;}
.dark-mode-icon .bx-sun{color: #fdc26a;}

/* theme dark */

.theme-dark .dropdown-menu { background-color: #121212;}
.theme-dark .dropdown-item { background-color: #1A1D1F;}
.theme-dark .header-nav{background-color:#212121!important;}
.theme-dark .main-nav li a{color:#fff!important;}
.theme-dark .giftcode{color:#dadada;}
.theme-dark .main-nav > li.active > a, .theme-dark .main-nav .has-submenu.active > a, .theme-dark .main-nav .has-submenu.active .submenu li.active > a{
    color: #ff9f43;
}
.theme-dark .main-nav li a:hover{color: #ff9f43!important;}
.theme-dark .banner-bg {
	height:calc(100vh - 70px)!important;
	background: url(../images/banner.png) top right no-repeat!important;
	background-size: calc(100vh - 70px)!important;
}
.theme-dark .main-wrapper .banner-section {
	background: #000!important;
}

.theme-dark .footer{background-color: #000!important; border-top: 1px solid #000;}
.theme-dark .footer .row.p-5{background-color: #212121!important; border-top: 1px solid #000;}
.theme-dark .about-footer{color: #cccccc!important;}
.theme-dark .home-page .footer{border-top: 15px solid #EEFAFF;}
.theme-dark .footer-title{color: #cccccc!important;}
.theme-dark .footer .footer-menu ul li a, .theme-dark .footer .footer-widget .footer-about-content p, .theme-dark .footer-contact-info{color: #cccccc!important;}
.theme-dark .about-footer h2{color: #ff9f43!important;}
.theme-dark .footer .footer-widget.footer-menu ul{color: #737373!important;}
.theme-dark .icon-footer{width:30px;}
.theme-dark .footer-contact-info .icon-link{margin:10px 10px;}
.theme-dark .banner-content span{color:#fff!important; font-weight: bold;}
.theme-dark .banner-content h2{color: #ff9f43!important;}
.theme-dark .banner-content p{color:#cccccc!important;}
.theme-dark .navbar-brand.logo img{max-height:50px;}
.theme-dark .footer .footer-top{padding-bottom: 0px!important;}
.theme-dark .header-nav{height:70px!important; border-bottom: 1px solid #252526!important;}
.theme-dark .logo{width:auto!important; margin-right: 50px;}
.theme-dark .main-nav > li.add-sukienkhuyenmai a{color:#2E3842!important;}
.theme-dark .add-sukienkhuyenmai .fa-gift{color:#FDDE6A!important; font-size: 18px;}
.theme-dark .header .menu-login{background: #ff9f43!important;}
.theme-dark .header .menu-register{background: #fff!important; color: #2E3842!important; border-color: #7a7a7a!important;}
.theme-dark .header .contact-item a:hover{color: #ff9f43!important; border-color: #ff9f43!important;}
@media (min-width: 768px) {
.theme-dark .bg-login{background: #1A1D1F!important;}
}
.theme-dark .breadcrumb-bar{background-color:#000!important; padding:10px 0px!important;}
.theme-dark .page-breadcrumb ol li a{color: #fff!important;}
.theme-dark .page-breadcrumb ol li.active{color: #ccc!important;}
.theme-dark .page-breadcrumb .breadcrumb-item+.breadcrumb-item:before{color: #fff!important;}
.theme-dark .login-right{background-color:transparent!important; border:none!important;}
.theme-dark .btn-lg.login-btn { 
	background: #FF9F43!important;
    color: #fff;
    border-radius: 8px;
    border-right: none!important;
    border-top: none!important;}
.theme-dark h1, .theme-dark h2, .theme-dark h3, .theme-dark h4, .theme-dark h5, .theme-dark h6{color:#fff;}
.theme-dark .login-right .dont-have a{color: #ff9f43!important;}
.theme-dark .form-focus .form-control {
    padding: 21px 21px 6px!important;
    border-radius: 8px;
}
.theme-dark .form-focus .focus-label{left: 21px!important;}
.theme-dark #register .form-group{margin-bottom: 15px!important;}
.theme-dark .captcha-image.image_captcha img, input#captcha{border-radius: 8px;}
.theme-dark .login-header h3 {
    font-size: 24px!important;
    margin-bottom: 3px;
    font-weight: bold;
    color: #fff!important;
}
.theme-dark .login-right .dont-have{color: #fff!important;}
.theme-dark input#captcha{padding:5px 20px!important;}
.theme-dark .tieude-giaotrinh{color: #ff9f43!important;}
.theme-dark .book-btn {
    background-color: #ff9f43!important;
    border: 2px solid #ff9f43!important;
}
.theme-dark .profile-widget{background-color: #000000!important; text-align: center;  border: 1px solid #343434!important;}
.theme-dark .profile-widget a{color: #ccc;}
.theme-dark .profile-widget p.speciality{color: #ccc;}
.theme-dark a.btn{color: #fff!important;}
.theme-dark .card{background-color: #212121!important; border: 1px solid #000000;}
.theme-dark .card-table .table td, .theme-dark .card-table .table th{border: 1px solid #000000; color: #ccc;}
.theme-dark .table-hover tbody tr:hover{background-color: #000!important;}
.theme-dark .list-loptructuyen{background: #000!important; padding-bottom: 30px; margin-bottom: 0px!important;}
.theme-dark .gridFilter .tab-menu{color: #2E3842!important; border: none!important; border-radius: 8px; box-shadow: 0 0 0 rgb(0 0 0 / 1%)!important;}
.theme-dark .gridFilter button.active, .theme-dark .gridFilter button:hover{background:#FDDE6A!important; color: #2E3842!important; box-shadow: 0 5px 18px rgb(0 0 0 / 5%)!important;}
.theme-dark .view-left-baihoc{color: #ff9f43!important;}
.theme-dark .modal-header{background: #212121!important;}
.theme-dark .modal-footer .btn-danger{
	background-color:  #ff9f43!important;
    border: 1px solid  #ff9f43!important;
}
.theme-dark .modal-footer .open-modal-1.btn-primary, .theme-dark .modal-footer .dong-tracnghiem{
	background-color: transparent!important;
    border: 1px solid #7e7a7b!important;
	margin-left: 10px;
}
/* Dark mode nâng cao */
.theme-dark #toolbox a.page {
    background: #2b2b2b;
    color: #b5b5b5;
    border: 1px solid #444;
    box-shadow:
        2px 2px 5px rgba(0, 0, 0, 0.6),
        -2px -2px 5px rgba(60, 60, 60, 0.1);
}

.theme-dark #toolbox a.page:hover,
.theme-dark #toolbox a.page.active {
    background: #000 !important;
    color: #fff;
    box-shadow:
        inset 2px 2px 6px rgba(0, 0, 0, 0.6),
        inset -2px -2px 6px rgba(60, 60, 60, 0.1);
}

.theme-dark #toolbox a.page .select:before,
.theme-dark #toolbox a.page .select.dung:before,
.theme-dark #toolbox a.page .sai:before {
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
}

.theme-dark .modal-content, .theme-dark .modal-dialog.view-big .modal-body{background: #212121!important; border:none!important; color: #ccc;}
.theme-dark .contact-item a{background:#fff!important; color: #ff9f43!important;  border-color: #ff9f43!important;}
.theme-dark #updateUser input[name="diemthuong"]{background:#fff!important; color:#ee2c4d!important;}
.theme-dark .main-nav > li {
    margin-right: 40px!important;
}
.theme-dark .modal-footer.exam{background: #000; border-top:none!important;}
.dark-mode-icon i{font-size:28px;}
.dark-mode-icon .bx-moon{
    color: #00000040;
    font-size: 25px;
    stroke-width: 1.5;
}
.dark-mode-icon .bx-sun{
    color: #fff;
    font-size: 25px;
    stroke-width: 1.5;
}
  
.theme-dark .loader-tyle-tong{color: #ccc!important;}
.theme-dark .modal-header .close{color: #ccc!important;}
.theme-dark .card .card-header{color: #ccc!important; background-color: #000!important; border-bottom: #212121;}
.theme-dark .post-info h4 a{color: #ccc!important;}
.theme-dark .post-info h4 a:hover{color: #ff9f43!important;}
.theme-dark .post-info p{color: #bcbbbb!important;}
.theme-dark .modal-dialog.update-giftcode p{color: #ccc!important;}
.theme-dark #hello-user{color: #ccc!important;}
.theme-dark #hello-user a strong, .theme-dark #hello-user a i{color: #fff!important;}
.theme-dark #updateUser .control-label{color: #ccc!important;}
.theme-dark ul.dapaan-giay li{color: #fff!important;}
.theme-dark .dapaan-giay img{opacity: 0.2!important;}
.nhomtinhhuong{color: #000000!important; background: #a7d8ff; border: 1px solid #c8d6e4!important;}
.theme-dark .nhomtinhhuong{color: #000000!important; background: #a7d8ff; border: 1px solid #c8d6e4!important;}
.theme-dark .refresh.icon-refresh{color: #ccc!important;}
.content-table-dethi table, .content-table-dethi table td{border: 1px solid #8b8b8b!important;}
.theme-dark .content-table-dethi table, .theme-dark .content-table-dethi table td{border: 1px solid #8b8b8b!important; color: #f9f9f9!important;}
modal.fade .modal-dialog {
    transform: none!important;
}
.theme-dark .modal-backdrop{background-color: #656565f7!important;}
.theme-dark .content-table-dethi{color: #f9f9f9!important;}
.img-doidiem{
    height: 36px;
    position: absolute;
    margin-top: -8px;
    margin-left: -35px;
}
.img-doidiem-mb{padding-left: 30px;}
.img-doidiem-mb .img-doidiem{
    height: 26px;
    position: absolute;
    margin-top: -3px;
    margin-left: -33px;
}
.bg-light-gray{
    background-color: #eeeeee !important;
}
.alert.alert-error{border-radius: 8px;}
.theme-dark a{color: #cccccc;}
.theme-dark .view-nhombaihoc{background: #000!important; border: 1px dotted #535353!important;}
.theme-dark .thongtin-baihoc span{color: #ededed;}
.theme-dark .view-nhombaihoc .info-baihoc{border-bottom: 1px solid #212121!important;}
.menu-login:hover{color: #98c6ff!important;}
.theme-dark .actionContent .table td, .theme-dark .actionContent .table th{color: #f9f9f9;}
.swal2-container, .swal2-title, .swal2-content{color: #272b41!important;}
#giftcode-sukien-table td, #giftcode-sukien-table th{color: #272b41!important;}
.theme-dark .row.course center{color: #f9f9f9!important;}
@media only screen and (max-width: 980px){
    .navbar-header {min-width: 60%;}
    .banner-section .banner-bg .col-md-9{
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .main-nav li:first-child a{float: left;}
    .header-navbar-rht .doidiemthuong{margin-left: 20px;}
    .main-nav li.login-link{display: block;}
    .menu-header{height:80px;}
	.menu-logo img{max-height:60px;}
	.bar-icon span{background-color: #ff9f43!important;}
	.theme-dark .bar-icon span{background-color: #fff!important;}
	.navbar-brand.logo img {
		height: 60px!important;
	}
	.main-menu-wrapper{ border-radius: 0px;}
    .menu-item{
        padding-left: 10px;
    }
	.main-nav ul {background-color: #CFE8FC!important;}
	.main-nav > li > a, .main-nav > li .submenu li a{font-weight: 500!important;}
	.footer-widget {
		padding-left: 20px!important;
		border-bottom: 1px solid #eee;
		padding-bottom: 15px;
		margin-bottom: 15px!important;
	}
	.footer-widget.footer-about{padding-left: 0px!important;}
	.footer-widget.footer-contact{border-bottom:none!important; margin-bottom:0px!important; padding-left: 120px!important;}
	.footer-widget.footer-menu{padding-left: 120px!important;}
	.banner-section .banner-bg{
		background: url(../images/banner.png) bottom right no-repeat!important;
		background-size: 80%!important;
		background-position: revert;
	}
	.footer-contact-info .icon-link{margin-left: 0px;}
	.banner-content {
		padding: 50px 20px!important;
		text-align: center;
	}
	.theme-dark .main-menu-wrapper {
        background-color: #212121!important;
    }
    .header .main-nav > li {
        margin-right: 0px!important;
    }
    .doidiemthuong{
        background: transparent!important;
        color: #da1790;
        padding: 0px!important;
        border-radius: 0px!important;
        color: #2E3842!important;
    }
    .doidiemthuong i{font-size: 18px; color: #2E3842!important;}
    .theme-dark .doidiemthuong{
        background: transparent!important;
        color: #da1790;
        padding: 0px!important;
        border-radius: 0px!important;
        color: #dadada!important;
    }
    .theme-dark .doidiemthuong i{font-size: 18px; color: #dadada!important;}
    #nav-expander{width: 160px; color: #ff9f43!important; padding: 10px 15px!important;}
    .main-nav li:last-child{border-bottom:none!important;}
    .theme-dark .main-nav ul {
        background-color: #212121!important;
    }
    .theme-dark .main-nav > li > a, .theme-dark .main-nav > li .submenu li a {
        color: #dadada!important;
    }
    .theme-dark #menu_close{color:#ccc!important;}
    .theme-dark .footer-widget{border-bottom: 1px solid #000!important;}
    .modal-dialog.view-big{margin: 0px auto!important; transform: none!important;}
}
@media only screen and (max-width: 765px){
	.menu-header{height:80px;}
	.menu-logo img{max-height:60px;}
	.bar-icon span{background-color: #ff9f43!important;}
	.theme-dark .bar-icon span{background-color: #fff!important;}
	.navbar-brand.logo img {
		height: 60px!important;
		width: 70px;
	}
	.main-nav ul {background-color: #CFE8FC!important;}
	.main-nav > li > a, .main-nav > li .submenu li a{font-weight: 500!important;}
	.footer-widget {
		padding-left: 20px!important;
		border-bottom: 1px solid #eee;
		padding-bottom: 15px;
		margin-bottom: 15px!important;
	}
	.footer-widget.footer-about{padding-left: 0px!important;}
	.footer-widget.footer-contact{border-bottom:none!important; margin-bottom:0px!important; padding-left: 120px!important;}
	.footer-widget.footer-menu{padding-left: 120px!important;}
	.banner-section .banner-bg{
		background: url(../images/banner.png) bottom right no-repeat!important;
		background-size: 90%!important;
		background-position: revert;
	}
	.footer-contact-info .icon-link{margin-left: 0px;}
	.banner-content {
		padding: 50px 0px!important;
		text-align: center;
	}
	.view-mb{display:block;}
	.theme-dark .main-menu-wrapper {
        background-color: #212121!important;
    }
    .header .main-nav > li {
        margin-right: 0px!important;
    }
    .doidiemthuong{
        background: transparent!important;
        color: #da1790;
        padding: 0px!important;
        border-radius: 0px!important;
        color: #2E3842!important;
    }
    .doidiemthuong i{font-size: 18px; color: #2E3842!important;}
    .theme-dark .doidiemthuong{
        background: transparent!important;
        color: #da1790;
        padding: 0px!important;
        border-radius: 0px!important;
        color: #dadada!important;
    }
    .theme-dark .doidiemthuong i{font-size: 18px; color: #dadada!important;}
    #nav-expander{width: 160px; color: #ff9f43!important; padding: 10px 15px!important;}
    .main-nav li:last-child{border-bottom:none!important;}
    .theme-dark .main-nav ul {
        background-color: #212121!important;
    }
    .theme-dark .main-nav > li > a, .theme-dark .main-nav > li .submenu li a {
        color: #dadada!important;
    }
    .theme-dark #menu_close{color:#ccc!important;}
    .theme-dark .footer-widget{border-bottom: 1px solid #000!important;}
    .modal-dialog.view-big{margin: 0px auto!important; transform: none!important;}
    }
    
    /* Hiếu Fix dư layout khi bật dark mode */
body.theme-dark {
  overflow-x: hidden !important;
  max-width: 100vw;
}

/* Đảm bảo không có phần tử đẩy giao diện tràn sang phải */
.theme-dark #toolbox,
.theme-dark .question-wrapper,
.theme-dark .sidebar,
.theme-dark .main {
  max-width: 100%;
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Nếu có phần tử cố định (fixed) bên phải như thanh công cụ */
.theme-dark .question-navigator {
  right: 0 !important;
}

    /* === FIX DƯ LAYOUT KHI Ở LIGHT MODE === */
body {
  overflow-x: hidden !important;
  max-width: 100vw;
  box-sizing: border-box;
}

/* Chặn các phần tử tràn ngang ra ngoài giao diện */
#toolbox,
.question-wrapper,
.sidebar,
.main {
  max-width: 100%;
  box-sizing: border-box;
  overflow-x: hidden;
}

/* Nếu có thanh điều hướng cố định bên phải */
.question-navigator {
  right: 0 !important;
  max-width: 100%;
  box-sizing: border-box;
}

.dethi #addModal2 .q-list.pagination {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 340px;    /* Điều chỉnh nếu cần */
    margin: 0 auto !important;
    padding: 0 !important;
    overflow-x: auto !important;
    justify-content: flex-start !important;
    flex-wrap: wrap;
}
.dethi #addModal2 .q-list.pagination a {
    flex: 0 0 auto;
    margin: 2px 2px;
    min-width: 36px;
    text-align: center;
}
.dethi #addModal2 #toolbox {
    width: 100% !important;
    max-width: 340px;
    margin: 0 auto;
    right: 0 !important;
    left: 0 !important;
    float: none !important;
    position: relative !important;
    padding: 0;
}
.dethi #addModal2 .modal-body {
    overflow-x: hidden !important;
}
.dethi #addModal2 .q-list.pagination::-webkit-scrollbar {
    display: none;
}
    /* Nền chính */
    .theme-dark .form-thanh-toan {
        background-color: #1e1e1e;
    }

    /* Màu nền của 2 cột */
    .theme-dark .doi-mau,
    .theme-dark .col-md-6.position-relative {
        background-color: #2c2c2c !important;
    }

    /* Màu chữ tiêu đề */
    .theme-dark h3,
    .theme-dark h4 {
        color: #f5f5f5 !important;
    }
    
    /* Màu icon SVG */
    .theme-dark h4 svg path {
        stroke: #f5f5f5 !important;
    }

    /* Màu chữ phụ và đường kẻ */
    .theme-dark div[style*="color: #555"],
    .theme-dark div[style*="color: #333"],
    .theme-dark .product-info,
    .theme-dark .total-info {
        color: #dcdcdc !important;
    }
    
    .theme-dark div[style*="border-bottom: 1px solid"],
    .theme-dark div[style*="border-top: 1px solid"] {
        border-color: #4a4a4a !important;
    }

    /* Mã QR */
    .theme-dark img[alt="Mã QR Thanh toán"] {
        border-color: #4a4a4a !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4) !important;
        background: white; /* Giữ nền trắng để đảm bảo quét mã được */
    }

    /* Khung thông tin chuyển khoản */
    .theme-dark .thong-tin-chuyen-khoan {
        background-color: #383838 !important;
        border-color: #555 !important;
    }

    .theme-dark .thong-tin-chuyen-khoan span[style*="color: #666"] {
        color: #b0b0b0 !important;
    }

    .theme-dark .thong-tin-chuyen-khoan div[style*="border-bottom: 1px dashed"] {
        border-color: #555 !important;
    }

    /* Giữ nguyên màu của các thành phần nhấn mạnh */
    .theme-dark b[style*="color: #007bff"],
    .theme-dark b[style*="color: #d9534f"] {
        /* Không cần thay đổi, màu này vẫn nổi bật trên nền tối */
    }
    /* Đường kẻ ngăn cách giữa các sản phẩm */
    .theme-dark table[style*="border-bottom: 1px solid #eeeeee"] {
        border-bottom-color: #4a4a4a !important;
    }

    /* Tên sản phẩm (thẻ a) */
    .theme-dark a[style*="color: #222222"] {
        color: #f5f5f5 !important;
    }

    /* Chi tiết sản phẩm (size, màu sắc, v.v.) */
    .theme-dark td[style*="color: #666666"] {
        color: #b0b0b0 !important;
    }
     /* Màu chữ chung cho khu vực giảm giá và các thẻ con */
    .theme-dark .form-group div {
        color: #dcdcdc;
    }
    
    /* Làm nổi bật phần chữ in đậm (mã giảm giá, số tiền) */
    .theme-dark .form-group b {
        color: #ffffff;
    }

    /* Đường kẻ ngăn cách */
    .theme-dark div[style*="border-bottom: 1px solid #f0f0f0"] {
        border-bottom-color: #4a4a4a !important;
    }

    /* Chữ "Tổng còn lại" có màu đỏ sẫm, cần đổi sang màu đỏ tươi hơn để dễ đọc trên nền tối */
    .theme-dark b[style*="color: #ab0000"] {
        color: #ff5c5c !important; 
    }