/* ============================================================
   user.css — gộp mobile + desktop. Mốc chia: 768px.

   MỤC LỤC
   1. Mục lục (khối chú thích này)
   2. Mobile  — nguyên văn templates/front/mobi/css4/user.css, bọc @media (max-width: 767px)
   3. Desktop — nguyên văn templates/front/css/user.css, bọc @media (min-width: 768px)
   4. Ghi đè — bố cục markup desktop ở khổ dưới 768px

   Hai mục dưới là bản sao nguyên văn, không đổi thứ tự thuộc tính.
   ============================================================ */

/* ===== 2. MOBILE ===== */
@media (max-width: 767px) {
h1.titile_h{
	clear: both;
    font-size: 20px;
    padding-top: 20px;
    padding-left: 8px;
    padding-right: 8px;
    text-align: center;
    text-transform: uppercase;
    font-weight: bold;
}
.dangKyAll{
	clear:both;
	padding-left:8px;
	padding-right:8px;
	position:relative;
	text-align:center;
}
.inputDangky{
	clear: both;
	border: 1px solid #ddd;
	height: 30px;
	text-indent: 5px;
	width: 99%;
	position: relative;
	margin: 8px auto;
}
#dang_ky{
	background: #ef4679;
	color: #fff;
	display: table;
	padding:8px 46px;
	border-radius: 2px;
	margin: 10px auto 0 auto;
}
.dang_nhap_nv{
	clear:both;
	border-bottom:1px solid #ddd;
	height:12px;
	margin-top:35px;
	text-align:center;
}
.dang_nhap_nv span{
	background:#f3f3f3;
	padding: 8px 30px;
}
.tiep_tuc_dn_fb{
	clear:both;
	background:#2e4b88;
	color:#fff;
	display:block;
	text-align:center;
	padding:10px 0;
	margin-top:25px;
	border-radius:2px;
}

.tiep_tuc_dn_fb:last-child{
	margin-top:5px;
}

.gg{
	background:#ea4235 !important;
}
.tiep_tuc_dn_fb:before{
	font-family: FontAwesome;
	font-size:16px;
	padding-right:6px;
}
.quenMatKh{
	text-align:center;
	display:inline-block;
	clear:both;
	padding-top:20px;
	
}

#gioi_tinh2, #gioi_tinh1{
	display:inline-block;
	margin:15px 5px 10px;
	
}
.id_dang_ky_titi{
	clear:both;
	padding-top:10px;
}
.user_header{
	clear:both;
	
}
.user_icon{
	width: 50px;
	border-radius: 50px;
	border: 1px solid #000;
	text-align: center;
	height: 50px;
	line-height: 50px;
	margin: 0 auto 10px;
}
.user_icon:before{
	font-family: FontAwesome;
	font-size:30px;
	content: "\f007";
}
.user_header{
	background:url(../../mobi4/images/line_user.jpg) no-repeat;
	height:100px;
	text-align:center;
	padding:15px 0;
}

.user_header .user_avt img{
	border-radius:50px;
}

.user_gith .hangMuc{
	color:#ef4679;
	font-weight:bold;
	font-size:11pt;
}

.titile_user{
	clear:both;
	font-weight:bold;
}

.diem_tich_luy_user{
	clear:both;
}
.content_menu{
	clear:both;
	background:#fff;
	
}
.titile_don_hang{
	clear:both;
	background:#f3f3f3;
	font-weight:bold;
	padding:8px;
}
.content_menu a{
	display:block;
	clear:both;
	padding:4px 8px 4px 8px;
}
.content_menu a:before{
	font-family: FontAwesome;
	font-size:16px;
	padding-right:8px;
}
a.choXacnhan:before{
	content: "\f232";
}
a.choGiaohang:before{
	content: "\f044";
}
a.dang_giao:before{
	content: "\f045";
}
a.da_giao:before{
	content: "\f046";
}
.tai_khoan_in:before{
	content: "\f013";
}
.doi_mat_khau:before{
	content: "\f023";
}
.thoat:before{
	content: "\f011";
}
.clear150px{
	clear:both;
	height:150px;
}
#tb_so_dien_thoai{
	clear:both;
}
.tao_tai_khoan_moi_ne{
	clear: both;
	display: table;
	border: 1px solid #ef4679;
	padding: 8px 20px;
	border-radius: 2px;
	margin: 20px auto;	
	color:#ef4679;
}
#tb_email_user,#tb_mat_khau{
	clear:both;
	color:#ef4679;
	padding-top:4px;
}
.don_hang_all{
	margin-top:10px;
}
.header_sp td{
	background:#929599;
	color:#fff;
}
.header_bd td{
	background:#fff;
}
.gioi_tinh{
	border: 1px solid #ddd;
	width: 100%;
	height: 30px;
	margin-top: 12px;
}
.ngay_sinh_all{
	clear:both;
	margin-top:10px;
}
.ngay_sinh_all select{
	border:1px solid #ddd;
	height:30px;
	width:30%;
	float:left;
	margin-right:4px;
}
.ngay_sinh_all input{
		border:1px solid #ddd;
	height:25px;
	width:33%;
	padding-left:5px;
}

.logoRank{
	position:absolute;
	top:-15px;
}

.logoRank.logo_right{
	right:0;
}

.logoRank.logo_left{
	left:0;
}

.boxUser{
	border-bottom:8px solid #e5e5e5;
	padding:0 15px;
}

.boxUser:last-child{
	border-bottom:none;
}

.boxUser .title{
	font-weight:bold;
}

.boxUser .point{
	color:#F30;
	font-size:25pt;
	font-weight:300;
	font-family:Roboto;
}

.boxUser .point span{
	font-size:12pt;
}

.listRank li{
	display:table;
	width:100%;
	cursor:pointer;
}

.listRank li .cell{
	display:table-cell;
	vertical-align:middle;
	border-bottom:1px solid #e5e5e5;
}

.listRank li .cell img{
	width:70px;
}

.listRank li .cell:first-child{
	width:80px;
}

.listRank li:last-child .cell{
	border-bottom:none;
}

.listRank li .cell p{
	margin:0;
}

.listRank li .cell p.moreInfo{
	font-size:10pt;
	font-style:italic;
	color:#999;
	
}

.listRank li .cell h3{
	color:#ef4679;
	font-weight:bold;
}
}
/* ===== hết mục 2 ===== */


/* ===== 3. DESKTOP ===== */
@media (min-width: 768px) {
h1.titile_h{
	clear: both;
	font-size: 18px;
	padding-top: 20px;
	padding-left: 8px;
	padding-right: 8px;
	padding-bottom: 12px;
}
.inFormLogin{
	background: #fff;
	width: 479px;
	margin: 20px auto 20px auto;
	padding: 20px 20px 40px 20px;
	border-radius: 4px;
}
.dangKyAll{
	clear: both;
	padding-left: 8px;
	padding-right: 8px;
	position: relative;
	width: 450px;
	margin: auto;
	padding-bottom: 50px;
}
.ttdhFromTitileBt{
	padding-bottom:10px;
}
.inputDangky{
	clear:both;
	border:1px solid #ddd;
	height:30px;
	padding-left:2%;
	width:98%;
	position:relative;
	margin-top:10px;
}
#dang_ky{
	background: #ef4679;
	color: #fff;
	display: table;
	padding:8px 46px;
	border-radius: 2px;
	margin: 10px auto 0 auto;
	cursor:pointer;
}
#dang_ky:hover{
	background: #ef668f;
}
.dang_nhap_nv{
	clear:both;
	border-bottom:1px solid #ddd;
	height:12px;
	margin-top:35px;
	text-align:center;
}
.dang_nhap_nv span{
	background:#fff;
	padding-left:30px;
	padding-right:30px;
}
.tiep_tuc_dn_fb{
	clear:both;
	background:#2e4b88;
	color:#fff;
	display:block;
	text-align:center;
	padding:8px 0;
	margin-top:20px;
	border-radius:2px;
}
.gg{
	background:#ea4235 !important;
}
.tiep_tuc_dn_fb:before{
	font-family: FontAwesome;
	font-size:16px;
	padding-right:6px;
}
.quenMatKh{
	text-align:center;
	display:block;
	clear:both;
	padding-top:20px;
	color:#ef4679;
}
.id_dang_ky_titi{
	clear:both;
	padding-top:10px;
}
.user_header{
	clear:both;
}
.ttdhFrom{
	float: left;
	background: #fff;
	margin-left: 20px;
	margin-top: 35px;
	border-radius: 4px;
	width: 949px;
	min-height: 283px;
	padding-top: 12px;
}
.user_icon, .user_avt{
	width: 50px;
	border-radius: 50px;
	border: 1px solid #000;
	text-align: center;
	height: 50px;
	line-height: 50px;
	float: left;
	margin-right: 10px;
	overflow:hidden;
}
.user_icon:before{
	font-family: FontAwesome;
	font-size:30px;
	content: "\f007";
}
.user_header{
	background:url(../images/line_user.jpg) no-repeat;
	padding-top: 28px;
	padding-left: 10px;
	height:68px;
	border-top: 2px solid #ddd;
}
.titile_user{
	clear:both;
	font-weight:bold;
}
.user_gith{
	float:left;
}
.diem_tich_luy_user{
	clear:both;
	padding-top:3px;
}
.content_menu{
	background: #fff;
	float: left;
	width: 200px;	
}
.titile_don_hang{
	clear:both;
	background:#f3f3f3;
	font-weight:bold;
	padding:8px;
}
.content_menu a{
	display:block;
	clear:both;
	padding:8px;
}
.content_menu a:before{
	font-family: FontAwesome;
	font-size:16px;
	padding-right:8px;
}
a.choXacnhan:before{
	content: "\f232";
}
a.choGiaohang:before{
	content: "\f044";
}
a.dang_giao:before{
	content: "\f045";
}
a.da_giao:before{
	content: "\f046";
}
.tai_khoan_in:before{
	content: "\f013";
}
.doi_mat_khau:before{
	content: "\f023";
}
.thoat:before{
	content: "\f011";
}
.clear150px{
	clear:both;
	height:45px;
}
.thong_tin_all{
	padding-left:180px;
	padding-top:20px;
}
.cpn{
	color:#e34d86;
}
.tbDonHang{
	border-left: 1px solid #ddd;
	border-right: 1px solid #ddd;
}
.header_bd td{
	border-right:1px solid #ddd;
	border-bottom:1px solid #ddd;
}
.bold{
	font-weight:bold;
}
#tb_so_dien_thoai{
	clear:both;
}
.tao_tai_khoan_moi_ne{
	clear: both;
	display: table;
	border: 1px solid #929599;
	padding: 4px 20px;
	border-radius: 2px;
	margin: 20px auto;	
}
#tb_email_user,#tb_mat_khau{
	clear:both;
	color:#ef4679;
	padding-top:4px;
}
.don_hang_all{
	padding:20px;
}
.ttdhFromTitile{
	clear:both;
	text-align:center;
	font-size:17px;
	padding-top:15px;
}
.header_sp td{
	background:#929599;
	color:#fff;
}
.header_bd td{
	background:#fff;
}
.gioi_tinh{
	border: 1px solid #ddd;
	width: 100%;
	height: 30px;
	margin-top: 12px;
}
.ngay_sinh_all{
	clear:both;
	margin-top:10px;
}
.ngay_sinh_all select{
	border:1px solid #ddd;
	height:30px;
	width:30%;
	float:left;
	margin-right:4px;
}
.ngay_sinh_all input{
		border:1px solid #ddd;
	height:25px;
	width:162px;
	padding-left:5px;
}
.gioi_tinh_check{
	clear:both;
	padding-top:6px;
}
.thongBaoError{
	clear:both;
	padding-top:5px;
	color:#d62e4d;
}
.nhap_xac_nhan_nhan_des{
	clear:both;
}
.hangMuc{
	color:#ef4679;
	font-weight:bold;
}

.rankUser{
	
}

.rankUser .logoRank{
	position:absolute;
	top:-15px;
	width:105px;
	cursor:pointer;
}

.rankUser .logoRank span{
	color:#ef4679;
	font-weight:bold;
	font-size:11pt;
}

.rankUser .logo_left{
	float:left;
	left:0;
}

.rankUser .logo_right{
	float:right;
	right:0;
}

.meter{
	margin:20px 90px;
	top:20px;
}

.groupPoint{
	margin-bottom:30px;
	border-bottom:1px solid #e5e5e5;
}

.groupPoint .title{
	font-size:12pt;
	font-weight:bold;
}

.groupPoint .point{
	color: #F30;
	font-size: 25pt;
	font-weight: 300;
	margin:15px 0;
}

.groupPoint .point span{
	font-size:12pt;
}

.tabInfo{
	margin-top:30px;
}

.listTitle li{
	display: inline-block;
	text-align: center;
	width: 150px;
	border: 1px solid #e5e5e5;
	height: 85px;
	vertical-align: top;
	margin-left:-4px;
	cursor:pointer;
	background:#e5e5e5;
}

.listTitle li.selected{
	background:#ffffff;
	border-bottom-color:#ffffff;
}

.listTitle li:last-child{
	margin-left:-5px;
}

.listTitle li img{
	height:55px;
}

.description{
	border: 1px solid #e5e5e5;
	margin-left: -4px;
	margin-right: 6px;
	margin-top: -1px;
	padding: 15px;
}

.listDescription li{
	display:none;
	font-size:11pt;
}

.listDescription li.selected{
	display:block;
}
}
/* ===== hết mục 3 ===== */

/* ===== 4. GHI ĐÈ DƯỚI 768PX ===== */
@media (max-width: 767px) {
  /* Tiêu đề trang tài khoản: căn giữa như desktop thay vì dính mép trái. */
  .ttdhFromTitile { clear: both; text-align: center; font-size: 17px; padding: 15px 12px 0; }
  .ttdhFromTitileBt { padding-bottom: 10px; }

  /* Khung tích điểm: bỏ lề 20px nội tuyến để nội dung rộng hơn trên màn nhỏ. */
  .ttdhFrom > div[style*="padding:20px"] { padding: 12px !important; }
  .groupPoint { margin-bottom: 20px; border-bottom: 1px solid #e5e5e5; }
  .groupPoint .title { font-size: 12pt; font-weight: bold; }
  .groupPoint .point { color: #F30; font-size: 22pt; font-weight: 300; margin: 10px 0; }
  .groupPoint .point span { font-size: 12pt; }

  /* Hàng hạng hiện tại → hạng kế: khung cao 58px nội tuyến không chứa nổi ảnh 80px, đổi sang flex. */
  .rankUser > div[style*="height:58px"] { display: flex; align-items: center; gap: 8px; height: auto !important; }
  .rankUser .logoRank { position: static; flex: 0 0 72px; width: 72px; float: none; text-align: center; cursor: pointer; }
  .rankUser .logoRank img { width: auto; height: 56px; }
  .rankUser .logoRank span { color: #ef4679; font-weight: bold; font-size: 10pt; }
  .rankUser .meter { flex: 1; margin: 0; top: 0; }
  .rankUser > p { margin: 12px 0 0; line-height: 1.5; }

  /* Tab 6 hạng: lưới 3 cột thay cho hàng ngang 6 × 150px. */
  .tabInfo { margin-top: 24px; }
  .tabsVT .listTitle { display: grid; grid-template-columns: repeat(3, 1fr); }
  .tabsVT .listTitle li {
    display: block;
    width: auto;
    height: auto;
    margin: 0 !important;
    padding: 6px 0;
    text-align: center;
    border: 1px solid #e5e5e5;
    background: #e5e5e5;
    cursor: pointer;
  }
  .tabsVT .listTitle li.selected { background: #fff; }
  .tabsVT .listTitle li img { height: 44px; }
  .tabsVT .listTitle li span { font-size: 10pt; }
  .tabsVT .description { margin: -1px 0 0; padding: 12px; border: 1px solid #e5e5e5; }
  .listDescription li { display: none; font-size: 11pt; line-height: 1.5; }
  .listDescription li.selected { display: block; }
}
/* ===== hết mục 4 ===== */