/* ===== Trang chi tiet san pham - Giao dien 3 (31/08/2026) =====
   Dung lai bang mau + bo cuc chung cua giao dien 3 (den #000 / vang
   #ffd900, the bo goc, vien nhat) nhu trang chu va trang danh muc, khong
   dat lai bien mau rieng. Moi kich thuoc dung px binh thuong: tu 1366px
   den 1920px ca trang duoc phong to bang "zoom" tren <body> (xem cuoi
   css/main.css) nen KHONG duoc dung don vi vw/vh o day. */

.section-detail-breadcrumb {
	padding: 14px 0 0;
}
.section-detail {
	padding: 10px 0 30px;
}

/* ---- Bo cuc 2 cot ---- */
.gd3-detail-main {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 28px;
	background-color: #ffffff;
	border-radius: 12px;
	padding: 20px;
	box-shadow: 0 4px 14px rgb(0 0 0 / 6%);
}
/* Cot anh chiem 46% (thay vi co dinh 460px): tren man rong anh to len
   theo, san pham noi bat hon - do thuc te o 1366px anh chi 460x346 trong
   khi cot chu ben canh rong toi 803px, nhin lech han. */
.gd3-detail-media {
	flex: 0 0 46%;
	max-width: 560px;
	min-width: 0;
	position: sticky;
	top: 12px;
}
.gd3-detail-info {
	flex: 1 1 320px;
	min-width: 0;
}
/* 05/09/2026: bo chan 620px (user: "dien tich ben phai con trong qua, cho
   no rong ra") - cac khoi trong cot chu keo het be rong cot. */
.gd3-detail-info > * {
	max-width: none;
}

/* ---- Anh ---- */
.gd3-detail-img-big {
	position: relative;
	border: 1px solid #eeeeee;
	border-radius: 10px;
	overflow: hidden;
	background-color: #ffffff;
	text-align: center;
}
.gd3-detail-img-big img {
	width: 100%;
	height: auto;
	display: block;
}
/* Anh chinh phai nam TREN lop anh cu de nhip chuyen la "anh moi hien dan
   de len anh cu" (xem #gd3DetailImgOld ngay duoi). */
#gd3DetailMainImg {
	position: relative;
	z-index: 2;
}
/* Lop giu anh VUA XEM trong luc chuyen sang anh khac - nam de len dung vi
   tri anh chinh (position:absolute) nhung KHONG tinh vao chieu cao khoi,
   nen chieu cao van do anh chinh quyet dinh, khong bi nhay. Luc binh
   thuong opacity = 0 va khong co src, khong tai gi ca. */
.gd3-detail-img-old {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	width: 100%;
	height: auto;
	opacity: 0;
	pointer-events: none;
}
.gd3-detail-sale-badge,
.gd3-detail-stock-badge {
	position: absolute;
	top: 10px;
	z-index: 2;
	font-size: 13px;
	font-weight: 700;
	padding: 4px 10px;
	border-radius: 20px;
}
.gd3-detail-sale-badge {
	left: 10px;
	background-color: #e60012;
	color: #ffffff;
}
.gd3-detail-stock-badge {
	right: 10px;
	background-color: #6b7280;
	color: #ffffff;
}
/* Dai anh nho cuon NGANG thay vi xuong dong: o mobile 5 anh bi be thanh
   2 hang, hang duoi tro tro 1 anh nhin rat le. Cuon ngang gon va quen
   thuoc hon tren dien thoai. */
.gd3-detail-thumbs {
	display: flex;
	flex-wrap: nowrap;
	gap: 8px;
	margin-top: 10px;
	overflow-x: auto;
}
/* AN HAN thanh cuon ngang cua dai anh nho (yeu cau 31/08/2026: "dai hinh
   con duoi anh chinh dang hinh thanh thanh truot ngang kha xau nen bo
   di"). Van GIU overflow-x: auto - dai van cuon duoc binh thuong, chi la
   khong ve thanh cuon ra man hinh nua:
     - tren dien thoai thi vuot ngang truc tiep vao dai
     - moi cach doi anh (2 nut tren anh lon, 2 nut canh dai, bam anh nho,
       vuot ngang) deu tu keo anh dang chon vao tam nhin - xem
       keoThumbVaoTamNhin() trong inc/detail.php
   Moi trinh duyet dau bang 1 cach khac nhau nen phai khai bao ca 3 dong:
   Chrome/Safari (::-webkit-scrollbar), Firefox (scrollbar-width), IE va
   Edge cu (-ms-overflow-style). Bo luon padding-bottom vi truoc day no
   chi de chua cho thanh cuon. */
.gd3-detail-thumbs {
	scrollbar-width: none;
	-ms-overflow-style: none;
}
.gd3-detail-thumbs::-webkit-scrollbar {
	display: none;
	width: 0;
	height: 0;
}
.gd3-detail-thumb {
	flex: 0 0 auto;
}
.gd3-detail-thumb {
	width: 72px;
	height: 72px;
	padding: 2px;
	border: 2px solid #eeeeee;
	border-radius: 8px;
	background-color: #ffffff;
	cursor: pointer;
	overflow: hidden;
}
.gd3-detail-thumb img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
}
.gd3-detail-thumb:hover {
	border-color: #ffd900;
}
.gd3-detail-thumb.is-active {
	border-color: #000000;
}

/* ---- Thong tin ---- */
.gd3-detail-title {
	font-size: 26px;
	font-weight: 800;
	line-height: 1.35;
	color: #000000;
	margin: 0 0 10px;
}
.gd3-detail-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	font-size: 13px;
	color: #666666;
	padding-bottom: 12px;
	border-bottom: 1px solid #f0f0f0;
}
.gd3-detail-meta i {
	margin-right: 4px;
}
/* Ten hang noi link sang trang thuong hieu (01/09/2026). De mau xam nhu
   phan con lai cua dong meta, chi gach chan nhat khi ro chuot: dong nay la
   thong tin phu, to mau xanh len se tranh cho voi nut mua hang ngay ben
   duoi. Van la the <a> that nen bam duoc, mo tab moi duoc, va Google doc
   duoc nhu mot link noi bo binh thuong. */
.gd3-detail-meta a.gd3-detail-hang {
	color: inherit;
	text-decoration: none;
	border-bottom: 1px dashed #c9c9c9;
}
.gd3-detail-meta a.gd3-detail-hang:hover {
	color: #067647;
	border-bottom-color: #067647;
}
.gd3-detail-in {
	color: #067647;
}
.gd3-detail-out {
	color: #b42318;
}

.gd3-detail-price-box {
	background: linear-gradient(180deg, #fffbe8 0%, #fff6cf 100%);
	border: 1px solid #ffd900;
	border-radius: 10px;
	padding: 14px 16px;
	margin: 14px 0;
}
.gd3-detail-price-row {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 12px;
}
.gd3-detail-price {
	font-size: 32px;
	font-weight: 800;
	color: #e60012;
	line-height: 1.2;
}
.gd3-detail-price-call {
	font-size: 24px;
	color: #000000;
}
.gd3-detail-price-old {
	font-size: 16px;
	color: #999999;
	text-decoration: line-through;
}
.gd3-detail-price-off {
	font-size: 13px;
	font-weight: 600;
	color: #067647;
	background-color: #e7f6ec;
	border-radius: 20px;
	padding: 2px 10px;
}
.gd3-detail-installment {
	margin-top: 8px;
	font-size: 13px;
	color: #7a5b00;
}
/* (08/09/2026) Huy hieu nay nay la the <a> tro sang /mua-tra-gop-<alias>.html.
   inline-flex + gap de mui ten khong dinh sat chu; mau giu nguyen nhu cu de
   khong bien no thanh mot nut moi tranh cho nut Mua hang ben duoi. */
a.gd3-detail-installment { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
a.gd3-detail-installment:hover { color: #b58600; }
.gd3-detail-installment-xem {
	padding: 2px 8px;
	border: 1px solid #e4cf8a;
	border-radius: 20px;
	font-size: 12px;
	white-space: nowrap;
}
a.gd3-detail-installment:hover .gd3-detail-installment-xem { border-color: #b58600; background: #fff8dd; }
.gd3-detail-installment-xem i { margin-left: 3px; }

/* (08/09/2026) Dong lien ket sang trang bang tinh tra gop, ngay duoi cum nut
   mua hang. Vien dut de doc ra ngay day la lien ket phu chu khong phai them
   mot nut mua hang nua tranh cho nut chinh. */
.gd3-detail-tglink { margin: 10px 0 0; font-size: 13px; }
.gd3-detail-tglink a {
	display: inline-flex; align-items: center; gap: 7px;
	padding: 7px 13px;
	border: 1px dashed #e4cf8a; border-radius: 8px;
	color: #7a5b00; text-decoration: none;
}
.gd3-detail-tglink a:hover { border-color: #b58600; background: #fff8dd; color: #b58600; }
@media (max-width: 767px) {
	.gd3-detail-tglink a { width: 100%; justify-content: center; }
}

.gd3-detail-quick {
	list-style: none;
	padding: 0;
	margin: 0 0 16px;
}
.gd3-detail-quick li {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 0;
	border-bottom: 1px dashed #eeeeee;
	font-size: 14px;
}
.gd3-detail-quick li i {
	width: 20px;
	text-align: center;
	color: #7a5b00;
}
.gd3-detail-quick li span {
	flex: 1 1 auto;
	color: #666666;
}
.gd3-detail-quick li b {
	color: #000000;
}

/* ---- Mua hang ---- */
.gd3-detail-buy {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 10px;
	margin-top: 4px;
}
.gd3-detail-qty {
	display: flex;
	align-items: center;
	border: 1px solid #dddddd;
	border-radius: 8px;
	overflow: hidden;
	height: 48px;
}
.gd3-qty-btn {
	width: 38px;
	height: 100%;
	border: 0;
	background-color: #f7f7f7;
	font-size: 18px;
	cursor: pointer;
	color: #333333;
}
.gd3-qty-btn:hover {
	background-color: #eeeeee;
}
.gd3-detail-qty input {
	width: 46px;
	height: 100%;
	border: 0;
	text-align: center;
	font-size: 15px;
	font-weight: 700;
	outline: none;
}
.gd3-btn-cart {
	flex: 1 1 220px;
	max-width: 320px;
	height: 48px;
	border: 0;
	border-radius: 8px;
	background-color: #000000;
	color: #ffd900;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
}
.gd3-btn-cart:hover {
	opacity: 0.9;
	transform: translateY(-1px);
}
.gd3-btn-cart,
.gd3-btn-hotline {
	transition: transform 0.15s ease, opacity 0.15s ease, background-color 0.15s ease;
}
.gd3-btn-cart[disabled] {
	opacity: 0.6;
	cursor: default;
}
.gd3-btn-hotline {
	display: flex;
	align-items: center;
	gap: 10px;
	height: 48px;
	padding: 0 16px;
	border-radius: 8px;
	background-color: #fff100;
	color: #000000;
	text-decoration: none;
	border: 1px solid #ffd400;
}
.gd3-btn-hotline:hover {
	background-color: #ffd900;
	color: #000000;
}
.gd3-btn-hotline i {
	font-size: 18px;
}
.gd3-btn-hotline small {
	display: block;
	font-size: 11px;
	line-height: 1.2;
}
.gd3-btn-hotline b {
	font-size: 16px;
	line-height: 1.2;
}
.gd3-detail-cart-msg {
	margin-top: 10px;
	font-size: 13px;
	min-height: 18px;
	color: #666666;
}
.gd3-detail-cart-msg.is-ok {
	color: #067647;
}
.gd3-detail-cart-msg.is-error {
	color: #b42318;
}

/* ---- Khoi noi dung (thong so / mo ta / video) ---- */
.gd3-detail-block {
	background-color: #ffffff;
	border-radius: 12px;
	padding: 22px 24px;
	margin-top: 22px;
	box-shadow: 0 4px 14px rgb(0 0 0 / 6%);
}
.gd3-detail-block-title {
	font-size: 20px;
	font-weight: 800;
	color: #000000;
	margin: 0 0 14px;
	padding-bottom: 10px;
	border-bottom: 2px solid #ffd900;
}
.gd3-detail-block-title i {
	color: #7a5b00;
	margin-right: 6px;
}
.gd3-detail-content {
	font-size: 15px;
	line-height: 1.7;
	color: #333333;
	overflow-x: auto;
}
.gd3-detail-content img {
	max-width: 100%;
	height: auto;
}
.gd3-detail-content table {
	max-width: 100%;
}
/* Bo anh "Dac diem noi bat" (khoi #sp-anh-nb, 17/09/2026) - FULL be ngang,
   dat tren khoi noi dung 2 cot. Anh kho lon xep doc, khong tieu de. */
.gd3-nb-full {
	margin: 4px 0 16px;
}
.gd3-nb-full img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 8px;
	margin: 0 auto 12px;
}
.gd3-nb-full img:last-child {
	margin-bottom: 0;
}
/* Thu gon: chi hien ~480px dau, mo bang nut "Xem them" (toggle rieng). */
.gd3-nb-box.gd3-nb-thu {
	max-height: 480px;
	overflow: hidden;
	position: relative;
}
.gd3-nb-box.gd3-nb-thu::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 90px;
	background: linear-gradient(to bottom, rgb(255 255 255 / 0%), #ffffff);
	pointer-events: none;
}
.gd3-nb-more {
	display: block;
	margin: 12px auto 0;
	padding: 8px 22px;
	border: 1px solid #e0e0e0;
	border-radius: 22px;
	background-color: #ffffff;
	font-size: 14px;
	font-weight: 600;
	color: #333333;
	cursor: pointer;
}
.gd3-nb-more:hover {
	border-color: #ffd900;
	background-color: #fff8db;
}
/* Dai chon MAU de xem 360 (17/09/2026) - chi hien khi SP co tu 2 bo anh
   xoay tro len (bo chinh + cac bo theo mau trong bang themhinh). */
/* (17/09/2026) Dai mau chi MOT HANG: nhieu mau thi cuon ngang + nut
   trai/phai (JS an nut khi khong du dai de cuon). Ap dung ca mobile. */
.gd3-360-mau-boc {
	position: relative;
	margin-top: 12px;
}
.gd3-360-mau-ds {
	display: flex;
	flex-wrap: nowrap;
	gap: 8px;
	overflow-x: auto;
	scroll-behavior: smooth;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	padding: 2px 0;
}
.gd3-360-mau-ds::-webkit-scrollbar {
	display: none;
}
.gd3-360-mau-nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 1px solid #e0e0e0;
	border-radius: 50%;
	background-color: #ffffff;
	color: #333333;
	box-shadow: 0 2px 8px rgb(0 0 0 / 18%);
	cursor: pointer;
	z-index: 2;
}
/* display:flex o tren DE LEN [hidden] (UA chi dat display:none do uu tien
   thap) -> phai tat tay, khong thi JS an nut ma nut van hien. */
.gd3-360-mau-nav[hidden] { display: none; }
.gd3-360-mau-nav.is-prev { left: 0; }
.gd3-360-mau-nav.is-next { right: 0; }
.gd3-360-mau-nav:hover {
	border-color: #ffd900;
	background-color: #fff8db;
}
.gd3-360-mau-nav:disabled {
	opacity: 0.35;
	cursor: default;
	box-shadow: none;
}
.gd3-360-mau {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 4px 10px 4px 4px;
	border: 2px solid #e6e6e6;
	border-radius: 999px;
	background-color: #ffffff;
	font-size: 13px;
	font-weight: 600;
	color: #333333;
	cursor: pointer;
	line-height: 1.2;
}
.gd3-360-mau img {
	width: 36px;
	height: 36px;
	object-fit: cover;
	border-radius: 50%;
	background-color: #f5f5f5;
	flex-shrink: 0;
}
.gd3-360-mau:hover {
	border-color: #ffd900;
	background-color: #fffdf2;
}
.gd3-360-mau.is-chon {
	border-color: #ffd900;
	background-color: #fff8db;
}

/* Slide "dinh kem" (bang dinhkem) o DAU trang - anh full be ngang; nhieu anh
   -> 1 slide Swiper (06/10/2026), 1 anh -> anh tinh. */
.gd3-dinhkem {
	margin: 0 0 16px;
	border-radius: 10px;
	overflow: hidden;
}
.gd3-dinhkem .swiper-slide { line-height: 0; }
.gd3-dinhkem img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 10px;
}
.gd3-dinhkem .gd3-dinhkem-dot { bottom: 10px; }
.gd3-dinhkem .swiper-pagination-bullet { width: 9px; height: 9px; background: #fff; opacity: .65; box-shadow: 0 0 3px rgba(0,0,0,.4); }
.gd3-dinhkem .swiper-pagination-bullet-active { background: #ffc600; opacity: 1; }
/* Noi dung dai bi thu gon lai, bam "Xem them" de mo het. */
.gd3-detail-collapsible {
	max-height: 420px;
	overflow: hidden;
	position: relative;
}
.gd3-detail-collapsible::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 70px;
	background: linear-gradient(to bottom, rgb(255 255 255 / 0%), #ffffff);
}
.gd3-detail-more {
	display: block;
	margin: 12px auto 0;
	border: 1px solid #dddddd;
	background-color: #ffffff;
	border-radius: 20px;
	padding: 7px 18px;
	font-size: 13px;
	cursor: pointer;
	color: #333333;
}
.gd3-detail-more:hover {
	border-color: #ffd900;
	background-color: #fff8db;
}
.gd3-detail-video {
	position: relative;
	padding-top: 56.25%;
}
.gd3-detail-video iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	border-radius: 10px;
}

/* ---- Tablet ---- */
@media (max-width: 991.5px) {
	.gd3-detail-media {
		flex: 0 0 42%;
		max-width: 420px;
		position: static;
	}
	.gd3-detail-info > * {
		max-width: none;
	}
	.gd3-detail-title {
		font-size: 20px;
	}
	.gd3-detail-price {
		font-size: 26px;
	}
}

/* ---- Mobile ---- */
@media (max-width: 767.5px) {
	.gd3-detail-main {
		padding: 12px;
		gap: 14px;
	}
	.gd3-detail-media {
		flex: 1 1 100%;
		max-width: 100%;
	}
	.gd3-detail-title {
		font-size: 18px;
	}
	.gd3-detail-price {
		font-size: 24px;
	}
	.gd3-detail-thumb {
		width: 60px;
		height: 60px;
	}
	/* So luong va nut "Them vao gio" nam CHUNG 1 hang (truoc day o so
	   luong dung mot minh 1 hang, thua ca khoang trong ben phai), hotline
	   xuong hang duoi cho de bam bang ngon cai. */
	.gd3-detail-buy {
		gap: 8px;
	}
	.gd3-detail-qty {
		order: 1;
		flex: 0 0 auto;
	}
	.gd3-btn-cart {
		flex: 1 1 auto;
		max-width: none;
		order: 2;
	}
	.gd3-btn-hotline {
		flex: 1 1 100%;
		order: 3;
		justify-content: center;
	}
	.gd3-detail-block {
		padding: 14px;
		margin-top: 14px;
	}
	.gd3-detail-block-title {
		font-size: 17px;
	}
	.gd3-detail-content {
		font-size: 14px;
	}
	.gd3-detail-collapsible {
		max-height: 300px;
	}
}

/* ---- Bo sung 31/08/2026 (doi chieu library/template_detail.php de lam
   tiep): o mau, 3 cam ket dich vu, khoi cam ket ban hang, tieu de khoi co
   link "Xem tat ca". ---- */
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.gd3-detail-used {
	color: #b06b00;
}
/* Ma san pham (= cot id) - de chu deu mot be ngang cho de doc/doc cho
   nhau qua dien thoai, va khach boi den de sao chep thi lay dung con so. */
.gd3-detail-code b {
	font-family: Consolas, "Courier New", monospace;
	letter-spacing: 0.3px;
	user-select: all;
}
.gd3-detail-colors {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 14px;
}
.gd3-detail-colors-label {
	font-size: 14px;
	color: #666666;
	margin-right: 2px;
}
.gd3-color-dot {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	border: 2px solid #dddddd;
	cursor: pointer;
	padding: 0;
	position: relative;
}
.gd3-color-dot:hover {
	border-color: #ffd900;
}
.gd3-color-dot.is-active {
	border-color: #000000;
	box-shadow: 0 0 0 2px #ffd900;
}
.gd3-detail-services {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	padding: 0;
	margin: 16px 0 0;
}
.gd3-detail-services li {
	flex: 1 1 130px;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 2px;
	padding: 10px 8px;
	border: 1px solid #f0f0f0;
	border-radius: 10px;
	background-color: #fafafa;
}
.gd3-detail-services i {
	font-size: 18px;
	color: #7a5b00;
	margin-bottom: 2px;
}
.gd3-detail-services b {
	font-size: 13px;
	color: #000000;
}
.gd3-detail-services span {
	font-size: 12px;
	color: #777777;
	line-height: 1.35;
}
.gd3-detail-commit {
	background-color: #fffdf2;
	border: 1px solid #ecdfa8;
	border-radius: 10px;
	padding: 14px 16px;
}
.gd3-detail-block-title {
	display: flex;
	align-items: center;
	gap: 8px;
}
.gd3-detail-block-more {
	margin-left: auto;
	font-size: 13px;
	font-weight: 600;
	color: #3381ed;
	text-decoration: none;
	white-space: nowrap;
}
.gd3-detail-block-more:hover {
	color: #000000;
}

@media (max-width: 767.5px) {
	.gd3-detail-services li {
		flex: 1 1 100px;
		padding: 8px 4px;
	}
	.gd3-detail-services b {
		font-size: 12px;
	}
	.gd3-detail-services span {
		font-size: 11px;
	}
	.gd3-detail-block-more {
		font-size: 12px;
	}
}

/* ==========================================================================
   HANG THE "NOI DUNG SAN PHAM" (08/09/2026)
   Cot trai, ngay duoi dai anh nho. Bam la mo popup tai cho (Album / Video /
   360 do / Thong so / Noi bat) hoac cuon xuong khoi (Hoi dap / Thong tin
   san pham). Markup o inc/detail.php - chi in the nao san pham co du lieu,
   va ca hang chi hien khi co >= 4 the VA co it nhat 1 the "nhin duoc".
   Nen so the luon nam trong khoang 4 - 7.
   ========================================================================== */
/* LUON MOT HANG, CHIA DEU HET BE NGANG (yeu cau 08/09/2026: "luon dan deu
   icon tren 1 hang o ca PC lan mobi chiem vua du dien tich ko de trong 2
   ben").

   `flex: 1 1 0` + `flex-wrap: nowrap`: moi the lay dung 1/n be ngang, khong
   bao gio xuong hang, khong bao gio thua khoang trong ben phai.
   `min-width: 0` la bat buoc - khong co no thi chu ben trong dat san the
   mot be rong toi thieu va 7 the se tran ra ngoai khung.

   Da thu hai cach truoc do va ca hai deu sai: `grid` 7 cot co dinh (4 the
   de lai 3 o trong ngoac) va `flex: 0 0 calc((100% - 36px)/7)` (van tinh
   theo nhip 7 nen 4 the chi chiem hon nua hang). */
.gd3-nd {
	/* Cho phep @container o duoi hoi "hang the nay dang rong bao nhieu".
	   Xem doan "VI SAO KHONG DUNG MEDIA QUERY" ngay ben duoi. */
	container-type: inline-size;
	container-name: gd3nd;
	display: flex;
	flex-wrap: nowrap;
	gap: 6px;
	margin-top: 12px;
}
.gd3-nd-o {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 5px;
	padding: 9px 3px 8px;
	border: 1px solid #e6e6e6;
	border-radius: 8px;
	background: #ffffff;
	text-align: center;
	text-decoration: none;
	/* Cac o cao bang nhau du nhan 1 hay 2 dong - khong thi hang the so le. */
	min-height: 70px;
	transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
}
.gd3-nd-o i {
	font-size: 18px;
	line-height: 1;
	color: #333333;
	transition: color .15s ease;
}
.gd3-nd-o span {
	font-size: 10.5px;
	line-height: 1.25;
	font-weight: 600;
	color: #444444;
	word-break: keep-all;   /* khong be doi mot tu ra lam hai dong */
}
.gd3-nd-o:hover,
.gd3-nd-o:focus-visible {
	border-color: #ffc600;
	background: #fffdf3;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .07);
	text-decoration: none;
}
.gd3-nd-o:hover i,
.gd3-nd-o:focus-visible i { color: #b58600; }
.gd3-nd-o:hover span,
.gd3-nd-o:focus-visible span { color: #111111; }

/* ---- BA MUC NHAN: dai -> ngan -> chi bieu tuong ------------------------
   MAC DINH la nhan NGAN ("Album", "360 do", "Thong so", "Thong tin"). Day
   cung la duong lui cho trinh duyet khong hieu @container: nhan ngan doc
   duoc o gan nhu moi be rong, khong bao gio vo tran.
   Cac quy tac @container ben duoi NANG len nhan dai khi rong rai, va HA
   xuong chi bieu tuong khi qua chat. */
.gd3-nd-dai { display: none; }
.gd3-nd-ngan { display: block; }

/* ---- VI SAO KHONG DUNG MEDIA QUERY (@media) ---------------------------
   Vi be rong CUA HANG THE khong di theo be rong man hinh. Do that
   08/09/2026 tren san pham 7 the:

       man hinh 360px  -> hang rong 297px   (1 cot, hang chiem het be ngang)
       man hinh 640px  -> hang rong 578px
       man hinh 700px  -> hang rong 638px
       man hinh 768px  -> hang rong 290px   <-- HEP NHAT!
       man hinh 992px  -> hang rong 420px
       man hinh 1440px -> hang rong 582px

   Tu 768px trang chuyen sang bo cuc HAI COT, cot trai (chua hang the) tut
   xuong con ~290px - hep hon ca dien thoai 360px. Ban dau toi viet
   `@media (max-width: 575.98px)` de rut chu, ket qua la o 768px hang the
   co 7 o rong 35px MA VAN in nhan dai - khong doc noi. Media query hoi be
   rong MAN HINH, ma thu can hoi la be rong CUA CHINH HANG THE.

   Nguong tinh theo be rong MOT O (rong hang tru khe, chia so o):
       >= 62px : nhan dai (2 dong)
       >= 44px : nhan ngan (1 tu moi dong)
       <  44px : chi bieu tuong
   Doi ra be rong hang cho tung so the (khe 6px):
       4 the: dai >= 266, ngan >= 194
       5 the: dai >= 334, ngan >= 244
       6 the: dai >= 402, ngan >= 294
       7 the: dai >= 470, ngan >= 344                                    */
@container gd3nd (min-width: 266px) {
	.gd3-nd[data-so="4"] .gd3-nd-dai { display: block; }
	.gd3-nd[data-so="4"] .gd3-nd-ngan { display: none; }
}
@container gd3nd (min-width: 334px) {
	.gd3-nd[data-so="5"] .gd3-nd-dai { display: block; }
	.gd3-nd[data-so="5"] .gd3-nd-ngan { display: none; }
}
@container gd3nd (min-width: 402px) {
	.gd3-nd[data-so="6"] .gd3-nd-dai { display: block; }
	.gd3-nd[data-so="6"] .gd3-nd-ngan { display: none; }
}
@container gd3nd (min-width: 470px) {
	.gd3-nd[data-so="7"] .gd3-nd-dai { display: block; }
	.gd3-nd[data-so="7"] .gd3-nd-ngan { display: none; }
}
/* Nhan dai la hai dong nen o cao hon mot chut. */
@container gd3nd (min-width: 266px) {
	.gd3-nd-o { min-height: 74px; padding: 9px 3px 8px; gap: 6px; }
}

/* Qua chat cho ca nhan ngan -> bo han chu, chi con bieu tuong. O thap va
   vuong lai, bieu tuong to len; van du 44px de ngon tay bam trung. */
@container gd3nd (max-width: 193.98px) {
	.gd3-nd[data-so="4"] .gd3-nd-o span { display: none; }
	.gd3-nd[data-so="4"] .gd3-nd-o { min-height: 46px; padding: 12px 2px; }
	.gd3-nd[data-so="4"] .gd3-nd-o i { font-size: 19px; }
}
@container gd3nd (max-width: 243.98px) {
	.gd3-nd[data-so="5"] .gd3-nd-o span { display: none; }
	.gd3-nd[data-so="5"] .gd3-nd-o { min-height: 46px; padding: 12px 2px; }
	.gd3-nd[data-so="5"] .gd3-nd-o i { font-size: 19px; }
}
@container gd3nd (max-width: 293.98px) {
	.gd3-nd[data-so="6"] .gd3-nd-o span { display: none; }
	.gd3-nd[data-so="6"] .gd3-nd-o { min-height: 46px; padding: 12px 2px; }
	.gd3-nd[data-so="6"] .gd3-nd-o i { font-size: 19px; }
}
@container gd3nd (max-width: 343.98px) {
	.gd3-nd[data-so="7"] .gd3-nd-o span { display: none; }
	.gd3-nd[data-so="7"] .gd3-nd-o { min-height: 46px; padding: 12px 2px; }
	.gd3-nd[data-so="7"] .gd3-nd-o i { font-size: 19px; }
}

/* ==========================================================================
   HOP THOAI CHO HANG THE "NOI DUNG SAN PHAM" (08/09/2026)
   Bam the Album / Video / 360 do / Thong so / Noi bat -> mo ngay tai cho.
   JS o cuoi inc/detail.php DOI CHO khoi that vao day roi tra ve khi dong.
   ========================================================================== */
/* z-index 1900: PHAI nam tren thanh dau trang (1050) va menu (1060) nhung
   PHAI nam DUOI lightbox cua album (2000). Album mo trong hop thoai nay, bam
   vao anh lon la bung lightbox - de hop thoai cao hon thi lightbox chui
   xuong duoi, khach bam phong to xong khong thay gi. */
.gd3-nd-modal {
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 1900;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px 14px;
}
.gd3-nd-modal[hidden] { display: none; }
.gd3-nd-modal-nen {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, .6);
}
.gd3-nd-modal-hop {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	width: 100%;
	max-width: 900px;
	max-height: 100%;
	border-radius: 14px;
	background: #ffffff;
	box-shadow: 0 18px 50px rgba(0, 0, 0, .4);
	overflow: hidden;
}
.gd3-nd-modal-dau {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex: 0 0 auto;
	padding: 13px 16px;
	border-bottom: 1px solid #eeeeee;
	background: #ffffff;
	font-size: 16px;
	font-weight: 800;
	color: #111111;
}
.gd3-nd-modal-dong {
	flex: 0 0 auto;
	width: 30px;
	height: 30px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: #ffc600;
	color: #111111;
	font-size: 15px;
	line-height: 1;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.gd3-nd-modal-dong:hover { background: #111111; color: #ffc600; }
.gd3-nd-modal-than {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	padding: 14px 16px 18px;
}
/* Khoi duoc doi vao day van mang nguyen lop .gd3-detail-block cua no, nen
   phai go bot may thu chi hop khi no nam giua trang. */
.gd3-nd-modal-than .gd3-detail-block {
	margin: 0;
	padding: 0;
	border: 0;
	box-shadow: none;
	background: none;
}
/* Tieu de da hien o thanh dau hop thoai roi, in lai lan nua la thua. */
.gd3-nd-modal-than .gd3-detail-block-title { display: none; }
/* Trong hop thoai thi MO HET noi dung: chinh hop thoai da cuon duoc roi,
   con bat khach bam "Xem them" mot lan nua la thua mot buoc. Chi ghi de
   bang CSS chu KHONG doi lop tren the - de khi tra khoi ve trang, trang
   thai thu gon cua no van y nguyen, khong phai khoi phuc gi. */
.gd3-nd-modal-than .gd3-detail-collapsible { max-height: none; overflow: visible; }
.gd3-nd-modal-than .gd3-detail-collapsible::after { display: none; }
.gd3-nd-modal-than .gd3-detail-more { display: none !important; }
/* ==========================================================================
   HOP THOAI THONG SO KY THUAT (08/09/2026)
   Khac ba hop thoai kia (album / video / 360) o cho: day la mat de DOC,
   khong phai de NGAM - nen giu nen SANG, chu to, bang ro rang. Nen toi doc
   bang so lieu lau moi mat.

   JS o cuoi inc/detail.php da don HTML cu truoc khi mo (go style noi dong,
   go border/cellpadding..., an doan chi chua anh) nen o day CSS thuong to
   duoc kieu, khong can `!important` chong nhau. Xem chu thich o do de biet
   vi sao phai don: 2.965/3.319 bang thong so mang style noi dong.
   ========================================================================== */
/* To han hop thoai chung (900px): bang thong so la thu doc theo hang, cang
   rong cang do phai lia mat. */
.gd3-nd-modal[data-loai="sp-thong-so"] .gd3-nd-modal-hop {
	max-width: 1180px;
	height: 100%;
}
.gd3-nd-modal[data-loai="sp-thong-so"] .gd3-nd-modal-than { padding: 18px 22px 24px; }
.gd3-nd-modal[data-loai="sp-thong-so"] .gd3-nd-modal-dau { font-size: 17.5px; padding: 15px 22px; }

/* Anh: JS da go `src` roi, day chi la chan not cho khoi lo khung vo. */
.gd3-nd-modal-than[data-loai="sp-thong-so"] img { display: none !important; }
/* Doan chi chua anh + dong chu thich cua no. */
.gd3-nd-modal-than[data-loai="sp-thong-so"] [data-ts-an] { display: none !important; }

/* HAI COT o man rong. Mot bang thong so xe co 40-60 dong; de mot cot thi
   thanh mot dai bang hep chay dai ca hai man hinh cuon. Chia hai cot thi
   nhin mot phat thay gan het, va o man 1180px moi cot van rong ~560px -
   du cho nhan va gia tri nam cung hang. `break-inside: avoid` de mot bang
   khong bi cat doi giua chung sang cot ben kia. */
@media (min-width: 992px) {
	.gd3-nd-modal-than[data-loai="sp-thong-so"] .gd3-detail-content {
		column-count: 2;
		column-gap: 26px;
	}
	.gd3-nd-modal-than[data-loai="sp-thong-so"] .gd3-detail-content > table {
		break-inside: avoid;
		page-break-inside: avoid;   /* trinh duyet cu */
	}
}

.gd3-nd-modal-than[data-loai="sp-thong-so"] .gd3-detail-content > table {
	width: 100%;
	margin: 0 0 18px;
	/* `separate` + `border-spacing: 0` chu KHONG phai `collapse`: voi
	   `collapse` thi trinh duyet BO QUA `border-radius`, goc bang vuong
	   chan - nhin ra ngay o thanh tieu de nhom mau den. Dat `separate` roi
	   khu khoang cach o ve 0 thi vua bo goc duoc vua khong ho ke. */
	border-collapse: separate;
	border-spacing: 0;
	border: 1px solid #e8e8e8;
	border-radius: 10px;
	overflow: hidden;
	background: #ffffff;
}
/* Dong tieu de nhom ("Thong tin chung", "Ngoai hinh", "Tinh nang"...).
   Dung mau den + vang cua tiem, viet hoa, dan cach chu - nhin ra ngay day
   la mot muc moi khi luot nhanh. */
.gd3-nd-modal-than[data-loai="sp-thong-so"] .gd3-detail-content > table th {
	background: #111111;
	color: #ffc600;
	text-align: left;
	padding: 10px 14px;
	border: 0;
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}
.gd3-nd-modal-than[data-loai="sp-thong-so"] .gd3-detail-content > table td {
	padding: 10px 14px;
	border: 0;
	border-top: 1px solid #f1f1f1;
	font-size: 14.5px;
	line-height: 1.5;
	vertical-align: top;
	color: #111111;
}
/* Cot NHAN: nhat va hep hon cot gia tri - mat chay doc cot trai de tim
   dong minh can, roi mo sang phai doc gia tri. */
.gd3-nd-modal-than[data-loai="sp-thong-so"] .gd3-detail-content > table td:first-child {
	width: 42%;
	background: #fafafa;
	color: #5a5a5a;
	font-weight: 600;
}
.gd3-nd-modal-than[data-loai="sp-thong-so"] .gd3-detail-content > table td:last-child { font-weight: 600; }
.gd3-nd-modal-than[data-loai="sp-thong-so"] .gd3-detail-content > table tr:hover td { background: #fffdf3; }
.gd3-nd-modal-than[data-loai="sp-thong-so"] .gd3-detail-content > table tr:hover td:first-child { background: #fff8dc; }

/* Doan van con lai (thong so viet kieu van xuoi, khong bang). */
.gd3-nd-modal-than[data-loai="sp-thong-so"] .gd3-detail-content p {
	margin: 0 0 10px;
	font-size: 14.5px;
	line-height: 1.65;
	color: #222222;
}
/* ...NHUNG doan van NAM TRONG O BANG thi phai theo o, khong theo luat tren.
   Bang cu boc chu trong o bang <p> (do that: <th><p>Thong tin chung</p></th>)
   nen luat tren de bep mau vang cua tieu de nhom -> chu XAM DEN tren nen
   DEN, gan nhu khong doc duoc, va cai margin 10px lam thanh tieu de cao vong
   len 52px. `color: inherit` de chu theo mau cua o. */
.gd3-nd-modal-than[data-loai="sp-thong-so"] .gd3-detail-content th p,
.gd3-nd-modal-than[data-loai="sp-thong-so"] .gd3-detail-content td p {
	margin: 0;
	color: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
}

@media (max-width: 767.98px) {
	.gd3-nd-modal[data-loai="sp-thong-so"] .gd3-nd-modal-than { padding: 14px 14px 18px; }
	.gd3-nd-modal-than[data-loai="sp-thong-so"] .gd3-detail-content > table td { padding: 9px 11px; font-size: 13.5px; }
	.gd3-nd-modal-than[data-loai="sp-thong-so"] .gd3-detail-content > table td:first-child { width: 45%; }
	.gd3-nd-modal-than[data-loai="sp-thong-so"] .gd3-detail-content > table th { padding: 9px 11px; font-size: 12px; }
}

/* ---- RIENG ALBUM: TRINH XEM TOAN MAN HINH NEN TOI (08/09/2026) --------
   Ba buoc lam moi den ket qua nay, ghi lai ca hai buoc sai de khong ai lam
   lai:

   1) Ban dau: hop thoai cao bang noi dung, khung anh co `aspect-ratio: 3/2`.
      Do tren 375x812 -> hop thoai chi cao 365px, anh 335x223, BO PHI 447px
      man hinh. Nhin nhu mot cai the nho xiu chu khong ra album anh.

   2) Sua thanh "khung anh cao het cho": hop thoai cao 792px, khung anh
      335x650. Nhung anh san pham la anh NGANG, `object-fit: contain` giu
      nguyen ty le nen anh van chi 335x223 va noi giua khung, tren duoi la
      HAI DAI TRANG moi ben ~210px. Te hon ca buoc 1 - trong nhu trang bi
      hong. BAI HOC: tren dien thoai doc, anh ngang KHONG THE to hon be
      ngang man hinh; co keo khung cao len cung khong lam anh to them.

   3) Cach dung: van cao het cho, nhung doi NEN THANH TOI. Luc do hai dai
      thua khong con la "cho trong" ma la nen cua mot trinh xem anh - dung
      cach moi thu vien anh chuyen nghiep van lam. Anh khong to hon duoc
      nhung TRONG dung hon han, va man hinh nho hay to deu mot kieu.

   Chi doi ben trong hop thoai; album nam tren trang van nen sang nhu cu. */
.gd3-nd-modal[data-loai="sp-album"] { padding: 0; }
.gd3-nd-modal[data-loai="sp-album"] .gd3-nd-modal-nen { background: #0d0d0d; }
.gd3-nd-modal[data-loai="sp-album"] .gd3-nd-modal-hop {
	width: 100%;
	max-width: none;
	height: 100%;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}
.gd3-nd-modal[data-loai="sp-album"] .gd3-nd-modal-dau {
	background: transparent;
	border-bottom: 0;
	color: #ffffff;
	padding: 12px 16px;
}
.gd3-nd-modal[data-loai="sp-album"] .gd3-nd-modal-than {
	display: flex;
	flex-direction: column;
	overflow: hidden;          /* album tu chia cho, khong cuon ca than */
	padding: 0 16px 16px;
}
/* `min-height: 0` o moi tang la BAT BUOC - thieu no thi phan tu flex khong
   chiu co lai duoi kich thuoc noi dung, dai anh nho bi day ra ngoai man. */
.gd3-nd-modal[data-loai="sp-album"] .gd3-detail-block,
.gd3-nd-modal[data-loai="sp-album"] .gd3-album {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
}
.gd3-nd-modal[data-loai="sp-album"] .gd3-album-lon {
	flex: 1 1 auto;
	min-height: 0;
	aspect-ratio: auto;        /* bo ty le 3/2 - cao bao nhieu la do cho con lai */
	background: transparent;
	border: 0;
	border-radius: 0;
	margin-bottom: 12px;
}
.gd3-nd-modal[data-loai="sp-album"] .gd3-album-thanh { flex: 0 0 auto; }

/* `scale-down` chu KHONG phai `contain`. Anh album trong kho chi khoang
   900x600 (do that 08/09/2026), ma khung anh o man 1440 la 1407x748 -
   `contain` se KEO GIAN anh len 1122x748, tuc phong to 1,25 lan: anh mo,
   ria rang cua, nhin la biet hang re. `scale-down` xu su y het `contain`
   nhung KHONG BAO GIO phong qua kich thuoc that cua anh. Tren dien thoai
   anh von da phai thu nho nen khong khac gi. */
.gd3-nd-modal[data-loai="sp-album"] .gd3-album-lon img { object-fit: scale-down; }

/* Nut lui/toi tren anh: nen toi thi nut toi mo tan luon vao nen - doi sang
   sang mo. */
.gd3-nd-modal[data-loai="sp-album"] .gd3-album-lon-nut {
	background: rgba(255, 255, 255, 0.16);
	color: #ffffff;
}
.gd3-nd-modal[data-loai="sp-album"] .gd3-album-lon-nut:hover { background: #ffc600; color: #111111; }
/* So thu tu: nen toi thi vien den tan vao nen -> doi sang vien mo. Va dua
   ra GIUA day khung thay vi goc trai: khung anh gio cao het man hinh, mot
   cai nhan nam le o goc duoi trai cach anh ca tram pixel nhin nhu bi bo
   quen; nam giua thi ro rang la co y. */
.gd3-nd-modal[data-loai="sp-album"] .gd3-album-dem {
	left: 50%;
	transform: translateX(-50%);
	bottom: 6px;
	background: rgba(255, 255, 255, 0.16);
	color: #ffffff;
}
/* Anh nho tren nen toi. */
.gd3-nd-modal[data-loai="sp-album"] .gd3-album-item {
	border-color: rgba(255, 255, 255, 0.22);
	background-color: rgba(255, 255, 255, 0.06);
}
.gd3-nd-modal[data-loai="sp-album"] .gd3-album-item.is-chon {
	border-color: #ffc600;
	box-shadow: 0 0 0 2px #ffc600 inset;
}
/* Trong hop thoai thi bam vao anh khong lam gi (chan o JS) nen bo luon con
   tro hinh kinh lup. */
.gd3-nd-modal[data-loai="sp-album"] .gd3-album-lon img { cursor: default; }

@media (max-width: 767.98px) {
	.gd3-nd-modal[data-loai="sp-album"] .gd3-nd-modal-dau { padding: 10px 12px; font-size: 14.5px; }
	.gd3-nd-modal[data-loai="sp-album"] .gd3-nd-modal-than { padding: 0 12px 12px; }
}

/* ---- RIENG VIDEO: cung kieu trinh xem toan man hinh nen toi ----------
   Ly do doi: khoi video von da co panel TOI (.gd3-sp-vd nen #121212, chu
   trang) - dat no giua mot the trang cua hop thoai la mot mang den vuong
   noi giua nen trang, nhin roi. Cho ca hop thoai toi thi lien mach.

   Va cung mot benh nhu album: do that tren 375x812 truoc khi sua, hop thoai
   chi cao 418px, khung phat 319x179, BO PHI 394px man hinh. */
.gd3-nd-modal[data-loai="sp-video"] { padding: 0; }
.gd3-nd-modal[data-loai="sp-video"] .gd3-nd-modal-nen { background: #0d0d0d; }
.gd3-nd-modal[data-loai="sp-video"] .gd3-nd-modal-hop {
	width: 100%;
	max-width: none;
	height: 100%;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}
.gd3-nd-modal[data-loai="sp-video"] .gd3-nd-modal-dau {
	background: transparent;
	border-bottom: 0;
	color: #ffffff;
	padding: 12px 16px;
}
.gd3-nd-modal[data-loai="sp-video"] .gd3-nd-modal-than {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	padding: 0 16px 16px;
}
/* MAT XICH BAT BUOC (da quen mot lan -> khung phat sap 0x0 o ca 8 co man
   hinh). Chuoi flex phai LIEN TUC tu than hop thoai xuong toi khung phat:
       .gd3-nd-modal-than  (cot flex)
         -> .gd3-detail-block  <-- quen mat nay thi dut chuoi
              -> .gd3-sp-vd     (cot flex)
                   -> .gd3-yt   (flex: 1 1 0 -> chieu cao xac dinh)
   Dut mot mat la chieu cao khong con "xac dinh", `flex: 1 1 0` cua khung
   phat quy ve 0 va `aspect-ratio` suy ra be rong 0.
   Cung vi vay KHONG dat `justify-content: center` o than: cang giua thi
   cac muc khong duoc keo gian, chieu cao lai thanh khong xac dinh. */
.gd3-nd-modal[data-loai="sp-video"] .gd3-detail-block {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
}
/* Panel toi cua khoi video thanh trong suot: de nguyen thi thanh mot hop
   #121212 nam tren nen #0d0d0d - hai mau cach nhau 5 bac, nhin ra mot vet
   vuong mo mo chu khong ra cai gi. */
.gd3-nd-modal[data-loai="sp-video"] .gd3-sp-vd {
	background: transparent;
	padding: 0;
	border-radius: 0;
	/* CHAN BE RONG O DAY - o khoi CHA, khong phai o chinh khung phat.
	   Khung phat cao bang `padding-top: 56.25%`, ma padding tinh theo phan
	   tram thi lay be rong CUA KHOI CHA lam moc, KHONG phai be rong cua
	   chinh no. Dat max-width len .gd3-yt (da thu, sai): the co hep lai
	   that nhung padding van tinh tren be rong cha -> khung cao 791px o moi
	   co man hinh, dai chon video bi day han ra ngoai. Chan o cha thi ca
	   hai chieu deu theo, va ty le 16:9 luon dung.

	   268px = phan khong phai khung phat, do THAT chu khong uoc chung: dau
	   hop thoai 53 + le duoi 16 + dong ten 24 + dai chon 128 + cac le ~28,
	   cong them ~12px du phong (do o 1440x900 voi 255px con tran 8px). Hang so nay CHI dung duoc
	   vi dai chon da bi ep be rong the co dinh o duoi - de nguyen kieu
	   "4 the chia deu" thi dai cao 105px o dien thoai nhung 239px o man
	   1440, khong hang so nao dung cho ca hai. */
	width: 100%;
	max-width: calc((100vh - 268px) * 16 / 9);
	margin-left: auto;
	margin-right: auto;
}

/* DAI CHON VIDEO: the co be rong CO DINH trong hop thoai.
   Luat goc la `flex: 0 0 calc((100% - 30px) / 4)` - bon the chia deu be
   ngang, hop ly khi dai nam trong cot noi dung. Trong hop thoai toan man
   hinh thi cha rong ca 1400px, moi the thanh ~340px, anh nho 16:9 cua no
   cao 191px -> ca dai cao 239px, an mat mot phan tu man hinh va lam moi
   uoc luong chieu cao sai. Co dinh 132px: anh nho 74px + ten 2 dong. */
.gd3-nd-modal[data-loai="sp-video"] .gd3-sp-vd-dai .gd3-yt-chon { flex: 0 0 132px; }
@media (max-width: 575.98px) {
	.gd3-nd-modal[data-loai="sp-video"] .gd3-sp-vd-dai .gd3-yt-chon { flex: 0 0 108px; }
}

/* Khung phat giu nguyen ky thuat `padding-top: 56.25%` (khong doi sang
   `aspect-ratio`: trinh duyet cu khong hieu thuoc tinh do se lam khung sap
   thanh cao 0). Be rong da bi khoi cha chan roi.

   PHAI go `max-width: 900px`: cuoi tep co luat `.gd3-yt.gd3-detail-video
   { max-width: 900px }` danh cho khung video NAM TREN TRANG (cot noi dung
   rong 900px la vua). Trong hop thoai toan man hinh thi no khoa cung khung
   phat o 900px du man hinh 1440 hay 1920 - phi ca nua man. */
.gd3-nd-modal[data-loai="sp-video"] .gd3-yt.gd3-detail-video {
	/* `100%` chu KHONG phai `none`. Da vap: dat `none` de go tran 900px thi
	   no VO HIEU HOA luon cai chan cua chinh minh - luat nay nam SAU khoi
	   @supports nen de bep `max-width: 100%` trong do, khung phat rong theo
	   chieu cao suy ra tu aspect-ratio va tran han ra ngoai man (do o
	   375px: khung 1071px rong trong khoi cha 351px). `100%` vua go duoc
	   tran 900px vua chan lai theo khoi cha. */
	max-width: 100%;
	border-radius: 10px;
}

@media (max-width: 767.98px) {
	.gd3-nd-modal[data-loai="sp-video"] .gd3-nd-modal-dau { padding: 10px 12px; font-size: 14.5px; }
	.gd3-nd-modal[data-loai="sp-video"] .gd3-nd-modal-than { padding: 0 12px 12px; }
}

/* ---- RIENG 360 DO: cung kieu trinh xem toan man hinh nen toi ---------
   Do that truoc khi sua tren 375x812: hop thoai chi cao 322px, khung xem
   335x241, BO PHI 490px man hinh.

   O day de duoc "khung cao het cho" ma khong so hai dai trong hai ben (cai
   bay da vap o album): anh xoay 360 la the <img> that, nen chi can
   `object-fit: scale-down` la no tu can giua va KHONG BAO GIO phong qua
   kich thuoc goc. Nen toi lam phan thua trong khung thanh nen cua trinh
   xem chu khong phai cho trong. */
.gd3-nd-modal[data-loai="sp-360"] { padding: 0; }
.gd3-nd-modal[data-loai="sp-360"] .gd3-nd-modal-nen { background: #0d0d0d; }
.gd3-nd-modal[data-loai="sp-360"] .gd3-nd-modal-hop {
	width: 100%;
	max-width: none;
	height: 100%;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}
.gd3-nd-modal[data-loai="sp-360"] .gd3-nd-modal-dau {
	background: transparent;
	border-bottom: 0;
	color: #ffffff;
	padding: 12px 16px;
}
.gd3-nd-modal[data-loai="sp-360"] .gd3-nd-modal-than {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	padding: 0 16px 16px;
}
/* Chuoi flex phai LIEN TUC tu than hop thoai xuong toi khung xem, dut mot
   mat la chieu cao khong con xac dinh (xem chu thich cung viec o khoi
   video - da vap mot lan o do). */
.gd3-nd-modal[data-loai="sp-360"] .gd3-detail-block,
.gd3-nd-modal[data-loai="sp-360"] .gd3-360 {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
}
.gd3-nd-modal[data-loai="sp-360"] .gd3-360-stage {
	flex: 1 1 auto;
	min-height: 0;
	background: transparent;
	border: 0;
	border-radius: 0;
	margin-bottom: 12px;
}
.gd3-nd-modal[data-loai="sp-360"] .gd3-360-stage img {
	width: 100%;
	height: 100%;
	object-fit: scale-down;
}
/* Hang nut can GIUA trong hop thoai: khung xem gio rong ca man hinh, de
   cum nut nam le ben trai nhu tren trang thi trong nhu bi bo quen o goc. */
.gd3-nd-modal[data-loai="sp-360"] .gd3-360-tools {
	flex: 0 0 auto;
	justify-content: center;
}

/* Vuot ngang de lat anh: `pan-y` cho trinh duyet giu lai viec cuon DOC
   (khach van vuot len xuong de cuon trang), con vuot NGANG thi nhuong cho
   JS xu ly. Khong dat thi tren mot so may vuot ngang bi hieu la keo chon
   van ban / dieu huong lui-toi cua trinh duyet. */
.gd3-album-lon {
	touch-action: pan-y;
	-webkit-user-select: none;
	user-select: none;
}

/* Khoa cuon trang nen. Dung LOP chu khong dung `style.overflow`: lightbox
   cua album khi dong tu dat `document.body.style.overflow = ''` - neu khoa
   bang inline style thi mo anh trong album roi dong lai la trang nen cuon
   duoc trong khi hop thoai van dang mo. */
body.gd3-nd-mo { overflow: hidden; }

@media (max-width: 767.98px) {
	.gd3-nd-modal { padding: 10px 8px; }
	.gd3-nd-modal-hop { border-radius: 12px; }
	.gd3-nd-modal-dau { padding: 11px 12px; font-size: 15px; }
	.gd3-nd-modal-than { padding: 12px 12px 16px; }
}

/* ---- Album anh + lightbox (31/08/2026; doi bo cuc 07/09/2026) ----
   MOT ANH LON + MOT HANG ANH NHO. Truoc day la luoi auto-fill
   `minmax(150px, 1fr)`: san pham co 20-60 anh thi thanh 4-5 hang anh nho
   keo dai le the, ma khong anh nao du to de nhin ra chi tiet.

   Anh lon dung `object-fit: contain` chu KHONG phai `cover`: day la anh
   san pham chup nhieu ty le khac nhau, `cover` se cat mat banh xe / mat
   yen. Nen xam nhat de anh nen trang khong "tan" ra khoi khung. */
.gd3-album-lon {
	position: relative;
	border: 1px solid #eeeeee;
	border-radius: 10px;
	overflow: hidden;
	background-color: #fafafa;
	aspect-ratio: 3 / 2;
	margin-bottom: 10px;
}
.gd3-album-lon img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
	cursor: zoom-in;
}

/* CHUYEN ANH MUOT (07/09/2026) - "hieu ung chuyen doi giua cac anh cho
   muot ma hon".

   Doi thang `src` cua mot the <img> thi anh cu bien mat NGAY o khung hinh
   do, con anh moi phai giai ma xong moi ve -> khach thay mot nhip nen xam
   nhap nhay. Cach lam o day: nhan ban anh dang hien thanh mot lop phu
   tuyet doi DE LEN TREN, gan anh moi vao the goc ben duoi, roi cho lop
   phu mo dan -> hai anh giao nhau (cross fade), khong bao gio co khoang
   trong o giua. JS o cuoi inc/detail.php dung lop .gd3-album-cu nay.

   `object-fit: contain` + cung kich thuoc khung => anh cu nam DUNG cho no
   dang nam, khong bi xe dich mot pixel nao khi chuyen sang lop phu. */
.gd3-album-lon .gd3-album-cu {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
	opacity: 1;
	pointer-events: none;
	transition: opacity .32s ease;
}
.gd3-album-lon .gd3-album-cu.la-mo { opacity: 0; }

/* Anh moi duoc tai truoc (new Image) roi moi doi, nen voi anh nang khach
   phai cho mot chut - vong quay nho de biet la dang tai chu khong phai
   bam hut. */
.gd3-album-lon.dang-tai::after {
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 2;
	width: 28px;
	height: 28px;
	margin: -14px 0 0 -14px;
	border: 3px solid rgba(17, 17, 17, 0.16);
	border-top-color: #ffc600;
	border-radius: 50%;
	animation: gd3AlbumQuay .7s linear infinite;
}
@keyframes gd3AlbumQuay { to { transform: rotate(360deg); } }

/* (08/09/2026) Nut kinh lup DA BO. Bam thang vao anh lon la bung hop thoai
   xem anh nen toi roi, khong con gi de "phong to" nua - de them mot cai nut
   lam viec y het viec bam vao anh chi thua va che mat goc anh. */

/* Hai nut lui/toi NGAY TREN ANH LON (08/09/2026). Khach dang nhin anh lon
   thi lat ngay tai cho, khong phai dua chuot xuong hang anh nho.

   Luon hien chu khong chi hien khi ro chuot: tren dien thoai khong co
   trang thai ro chuot, ma day cung la cach nut kinh lup dang lam - de hai
   thu tren cung mot khung hanh xu khac nhau moi la la. Nen mo cung mau
   nut kinh lup de ba cai moc tren anh nhin ra mot bo. */
.gd3-album-lon-nut {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(17, 17, 17, 0.72);
	color: #ffffff;
	font-size: 15px;
	line-height: 1;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background-color .15s ease, color .15s ease;
}
.gd3-album-lon-nut:hover { background: #ffc600; color: #111111; }
.gd3-album-lon-nut.la-truoc { left: 10px; }
.gd3-album-lon-nut.la-sau { right: 10px; }

.gd3-album-dem {
	position: absolute;
	left: 10px;
	bottom: 10px;
	padding: 3px 10px;
	border-radius: 999px;
	background: rgba(17, 17, 17, 0.72);
	color: #ffffff;
	font-size: 12px;
	font-weight: 700;
}

/* Hang anh nho: MOT hang, cuon ngang, hai nut lui/toi de len hai canh. */
.gd3-album-thanh {
	position: relative;
}

.gd3-album-cuon {
	/* `position: relative` de cac anh nho lay chinh khung nay lam moc
	   (offsetParent): JS keo hang bang `item.offsetLeft` so voi
	   `scrollLeft`, hai so phai cung mot he toa do. */
	position: relative;
	display: flex;
	gap: 8px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	/* An thanh truot - da co hai nut lui/toi roi, de them mot vach truot
	   mong duoi hang anh vua thua vua xau. */
	scrollbar-width: none;
	-ms-overflow-style: none;
	scroll-behavior: smooth;
}
.gd3-album-cuon::-webkit-scrollbar { width: 0; height: 0; display: none; }

.gd3-album-item {
	flex: 0 0 auto;
	width: 96px;
	padding: 0;
	border: 1px solid #eeeeee;
	border-radius: 8px;
	overflow: hidden;
	background-color: #ffffff;
	cursor: pointer;
	aspect-ratio: 3 / 2;
	transition: border-color .18s ease, box-shadow .18s ease;
}
.gd3-album-item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.25s ease;
}
.gd3-album-item:hover {
	border-color: #ffd900;
}
.gd3-album-item:hover img {
	transform: scale(1.06);
}
/* Anh dang xem: vien vang day - dau hieu duy nhat cho biet anh lon o tren
   dang la cai nao trong hang. */
/* Vien day 3px van nhu cu, nhung lam bang `box-shadow ... inset` chu
   KHONG doi `border-width` 1px -> 2px: doi be day vien la doi layout, anh
   ben trong nhay 1px va khong the chay transition. Kieu nay chay muot va
   dung y het. Cung khong dung box-shadow phia NGOAI: khung .gd3-album-cuon
   co `overflow-x: auto` (keo theo overflow-y) nen vien ngoai se bi cat. */
.gd3-album-item.is-chon {
	border-color: #ffc600;
	box-shadow: 0 0 0 2px #ffc600 inset;
}

/* Hai nut lui/toi: KHONG bao gio tu an. Chung doi ANH DANG CHON (chay vong
   tron qua anh cuoi ve anh dau) chu khong phai chi de cuon hang anh - nen
   van co ich ca khi hang anh ngan hon khung. */
.gd3-album-nut {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 3;
	width: 34px;
	height: 34px;
	padding: 0;
	border: 1px solid #e2e2e2;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.96);
	color: #111111;
	font-size: 13px;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.16);
	transition: background-color .15s ease, color .15s ease;
}
.gd3-album-nut:hover { background: #ffc600; border-color: #ffc600; color: #111111; }
.gd3-album-nut.la-truoc { left: -6px; }
.gd3-album-nut.la-sau { right: -6px; }

.gd3-lightbox {
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 2000;
	background-color: rgb(0 0 0 / 88%);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 20px;
}
.gd3-lightbox[hidden] {
	display: none;
}
.gd3-lb-figure {
	margin: 0;
	max-width: 100%;
	max-height: 100%;
	text-align: center;
}
.gd3-lb-figure img {
	max-width: 100%;
	max-height: 80vh;
	border-radius: 8px;
	display: block;
	margin: 0 auto;
}
.gd3-lb-figure figcaption {
	color: #ffffff;
	font-size: 13px;
	margin-top: 10px;
	opacity: 0.85;
}
.gd3-lb-close,
.gd3-lb-nav {
	border: 0;
	background-color: rgb(255 255 255 / 15%);
	color: #ffffff;
	border-radius: 50%;
	width: 44px;
	height: 44px;
	cursor: pointer;
	font-size: 18px;
	flex: 0 0 auto;
}
.gd3-lb-close:hover,
.gd3-lb-nav:hover {
	background-color: #ffd900;
	color: #000000;
}
.gd3-lb-close {
	position: absolute;
	top: 16px;
	right: 16px;
}

/* ---- Anh xoay 360 ---- */
.gd3-360-stage {
	position: relative;
	border: 1px solid #eeeeee;
	border-radius: 10px;
	overflow: hidden;
	background-color: #fafafa;
	min-height: 200px;
}
.gd3-360-stage img {
	width: 100%;
	height: auto;
	display: block;
	user-select: none;
	-webkit-user-drag: none;
	cursor: grab;
}
.gd3-360-stage img:active {
	cursor: grabbing;
}
.gd3-360-overlay {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: rgb(255 255 255 / 55%);
}
.gd3-360-overlay[hidden] {
	display: none;
}
.gd3-360-start {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	border: 0;
	border-radius: 12px;
	padding: 16px 24px;
	background-color: #000000;
	color: #ffd900;
	cursor: pointer;
	box-shadow: 0 6px 20px rgb(0 0 0 / 25%);
}
.gd3-360-start i {
	font-size: 26px;
}
.gd3-360-start span {
	font-size: 15px;
	font-weight: 700;
}
.gd3-360-start small {
	font-size: 12px;
	opacity: 0.75;
	color: #ffffff;
}
.gd3-360-loading {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 220px;
	max-width: 80%;
	text-align: center;
}
.gd3-360-loading[hidden] {
	display: none;
}
.gd3-360-bar {
	height: 8px;
	background-color: #e6e6e6;
	border-radius: 10px;
	overflow: hidden;
}
.gd3-360-bar span {
	display: block;
	height: 100%;
	width: 0;
	background-color: #ffd900;
	transition: width 0.15s linear;
}
.gd3-360-percent {
	margin-top: 6px;
	font-size: 13px;
	font-weight: 700;
	color: #333333;
}
.gd3-360-tools {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 10px;
	flex-wrap: wrap;
}
.gd3-360-tools[hidden] {
	display: none;
}
.gd3-360-btn {
	border: 1px solid #dddddd;
	background-color: #ffffff;
	border-radius: 8px;
	height: 36px;
	min-width: 36px;
	padding: 0 12px;
	cursor: pointer;
	font-size: 13px;
	color: #333333;
}
.gd3-360-btn:hover {
	border-color: #ffd900;
	background-color: #fff8db;
}
.gd3-360-play {
	font-weight: 700;
}
.gd3-360-hint {
	margin-left: auto;
	font-size: 12px;
	color: #888888;
}

@media (max-width: 767.5px) {
	.gd3-album-item {
		width: 76px;
	}
	.gd3-album-cuon {
		gap: 6px;
	}
	/* Man hep khong con cho de nut nam ngoai canh - keo han vao trong. */
	.gd3-album-nut {
		width: 30px;
		height: 30px;
	}
	.gd3-album-nut.la-truoc { left: 2px; }
	.gd3-album-nut.la-sau { right: 2px; }
	.gd3-album-lon-nut { width: 34px; height: 34px; font-size: 13px; }
	.gd3-album-lon-nut.la-truoc { left: 8px; }
	.gd3-album-lon-nut.la-sau { right: 8px; }
	.gd3-lightbox {
		padding: 10px;
		gap: 4px;
	}
	.gd3-lb-close,
	.gd3-lb-nav {
		width: 36px;
		height: 36px;
		font-size: 15px;
	}
	.gd3-360-hint {
		margin-left: 0;
		flex: 1 1 100%;
	}
}

/* ---- Tinh chinh giao dien 31/08/2026 (sau khi do bo cuc that o 375px va
   1366px) ---- */

/* Breadcrumb 1 dong, cuon ngang - ten san pham thuong dai nen o mobile
   no xuong 2-3 dong, day tut noi dung chinh xuong. Chi ap dung TRONG
   trang chi tiet, khong dung den breadcrumb trang danh muc. */
.section-detail-breadcrumb .gd3-breadcrumb {
	flex-wrap: nowrap;
	overflow-x: auto;
	white-space: nowrap;
	scrollbar-width: none;
}
.section-detail-breadcrumb .gd3-breadcrumb::-webkit-scrollbar {
	display: none;
}
.section-detail-breadcrumb .gd3-breadcrumb li.active {
	max-width: 460px;
	overflow: hidden;
	text-overflow: ellipsis;
}
/* Khi duong dan dai hon man hinh (hay gap tren dien thoai vi ten san pham
   dai), lam mo dan o mep phai de nguoi dung hieu la CON NUA VA CUON DUOC,
   thay vi trong nhu chu bi cat cut. */
@media (max-width: 767.5px) {
	.section-detail-breadcrumb .gd3-breadcrumb {
		-webkit-mask-image: linear-gradient(to right, #000 88%, transparent 100%);
		mask-image: linear-gradient(to right, #000 88%, transparent 100%);
	}
	.section-detail-breadcrumb .gd3-breadcrumb li.active {
		max-width: none;
	}
}

/* 3 o cam ket dich vu tren mobile: dung LUOI 3 cot deu nhau thay vi flex
   - da thu cho phep xuong hang thi o 375px no be thanh 2+1, o le loi 1
   minh 1 hang, xau hon han. 3 o deu nhau van doc duoc o 360px. */
@media (max-width: 767.5px) {
	.gd3-detail-services {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 6px;
	}
	.gd3-detail-services li {
		flex: none;
	}
}

/* Man hinh rat hep (<=360px): chi thu nho chu, khong doi bo cuc. */
@media (max-width: 360px) {
	.gd3-detail-title {
		font-size: 17px;
	}
	.gd3-detail-price {
		font-size: 22px;
	}
	.gd3-detail-services span {
		font-size: 10px;
	}
}

/* Man hinh rong (>=1200px): thong tin nhanh xep 2 cot cho do loang, va
   anh nho to hon mot chut cho can voi anh lon. */
@media (min-width: 1200px) {
	.gd3-detail-quick {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 0 20px;
	}
	.gd3-detail-thumb {
		width: 84px;
		height: 84px;
	}
}

/* =====================================================================
   BO SUNG 31/08/2026 (theo yeu cau chu du an sau khi test that tren
   /xe-dap-dien-honda-a6.html):
   1. Nut Truoc/Sau tren anh dai dien (chay vong lap vo han)
   2. Nut "Mua ngay" ben canh nut "Them vao gio hang"
   3. Khoi "San pham vua xem" (cuon ngang)
   4. Khoi "Phu tung, linh kien di kem" doi sang dang danh sach gon, khac
      han the san pham cua khoi "San pham cung loai" ben duoi
   Van dung px binh thuong - tu 1366px den 1920px ca trang duoc phong to
   bang "zoom" tren <body> (xem cuoi css/main.css) nen KHONG dung vw/vh.
   ===================================================================== */

/* ---- 1. Nut chuyen anh tren anh dai dien ---- */
.gd3-img-nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 3;
	width: 40px;
	height: 40px;
	border: 0;
	border-radius: 50%;
	background-color: rgb(255 255 255 / 88%);
	color: #111111;
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 2px 8px rgb(0 0 0 / 18%);
	/* Mo nhe khi khong ro chuot vao anh - nut khong che mat xe, nhung van
	   nhin thay du de biet la co the chuyen anh (tren dien thoai khong co
	   trang thai hover nen luon hien ro, xem media query ben duoi). */
	opacity: 0.55;
	transition: opacity 0.15s ease, background-color 0.15s ease;
}
.gd3-detail-img-big:hover .gd3-img-nav { opacity: 1; }
.gd3-img-nav:hover { background-color: #ffd900; }
.gd3-img-prev { left: 10px; }
.gd3-img-next { right: 10px; }
.gd3-img-counter {
	position: absolute;
	right: 10px;
	bottom: 10px;
	z-index: 3;
	padding: 3px 10px;
	border-radius: 20px;
	background-color: rgb(0 0 0 / 55%);
	color: #ffffff;
	font-size: 12px;
	font-weight: 600;
	pointer-events: none;
}

/* Nut "anh truoc" luc chua duoc dung den: an han (khong chi trong suot)
   de khong an nham vao vung do. Co transition de luc lo ra thi mo dan chu
   khong hien "bup" mot cai. */
.gd3-img-nav.is-hidden {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

/* ---- Dai anh nho + 2 nut cuon ---- */
.gd3-detail-thumbs-wrap {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-top: 10px;
}
/* Dai anh nho da co margin-top rieng khi dung mot minh - trong khung nay
   thi khung lo phan cach voi anh lon, bo di cho khoi cong don. */
.gd3-detail-thumbs-wrap .gd3-detail-thumbs {
	margin-top: 0;
	flex: 1 1 auto;
	min-width: 0;
}
/* 2 nut trai/phai canh dai anh nho CHI co nghia khi dai bi tran (co cho de
   cuon). Tren man hinh rong ma san pham chi co 3-4 anh thi ca dai nam gon
   trong khung - luc do nut "sau" van hien ra nhung bam vao khong cuon di
   dau ca, chi to them nhieu chi tiet thua (yeu cau 31/08/2026: "tren pc
   hinh thumb ko du nhieu (tran qua mep phai) thi ko can nut next va pre
   nua"). Anh lon o tren van co doi nut chuyen anh rieng, va khi tat ca anh
   nho deu nhin thay thi bam thang vao anh nho la nhanh nhat.

   Mac dinh AN, chi hien khi JS gan class "has-nav" cho khung boc - xem
   capNhatNutDaiThumb() trong inc/detail.php. */
.gd3-detail-thumbs-wrap .gd3-thumbs-nav {
	display: none;
}
.gd3-detail-thumbs-wrap.has-nav .gd3-thumbs-nav {
	display: block;
}
.gd3-thumbs-nav {
	flex: 0 0 26px;
	width: 26px;
	height: 26px;
	border: 1px solid #dddddd;
	border-radius: 50%;
	background-color: #ffffff;
	color: #333333;
	font-size: 11px;
	line-height: 1;
	cursor: pointer;
	padding: 0;
	transition: opacity 0.15s ease, background-color 0.15s ease;
}
/* Nut lui canh dai anh nho: an luc dau y het nut lui tren anh lon, chi lo
   ra khi khach bat dau xem qua lai (xem hienNutTruoc() trong
   inc/detail.php). Dung visibility chu khong display de o trong van duoc
   giu cho - dai anh nho khong bi nhay ngang khi nut lo ra. */
.gd3-thumbs-nav.is-hidden {
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
}
.gd3-thumbs-nav:hover {
	background-color: #ffd900;
	border-color: #ffd900;
	color: #000000;
}

/* ---- 2. Khu vuc mua hang: 2 nut canh nhau ---- */
.gd3-detail-buy-btns {
	display: flex;
	gap: 10px;
	flex: 1 1 320px;
	min-width: 0;
}
.gd3-detail-buy-btns .gd3-btn-cart,
.gd3-btn-buynow {
	flex: 1 1 0;
	min-width: 0;
	max-width: none;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	border: 0;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	transition: transform 0.15s ease, opacity 0.15s ease, background-color 0.15s ease;
}
.gd3-detail-buy-btns .gd3-btn-cart {
	background-color: #ffffff;
	color: #111111;
	border: 2px solid #111111;
}
.gd3-detail-buy-btns .gd3-btn-cart:hover {
	background-color: #ffd900;
	border-color: #111111;
	opacity: 1;
}
.gd3-btn-buynow {
	background-color: #d70018;
	color: #ffffff;
}
.gd3-btn-buynow:hover {
	background-color: #b3000f;
	transform: translateY(-1px);
}
.gd3-btn-buynow[disabled],
.gd3-detail-buy-btns .gd3-btn-cart[disabled] {
	opacity: 0.6;
	cursor: default;
	transform: none;
}
/* Vua them thanh cong (05/09/2026): chinh nut hien dau tich + "Da them vao
   gio" trong 2,5 giay - nen vang, chu den, khong mo di du dang disabled
   trong ~1 giay khoa. Ap cho ca nut chinh lan nut "Them" o khoi phu tung. */
.gd3-detail-buy-btns .gd3-btn-cart.is-da-them,
.gd3-detail-buy-btns .gd3-btn-cart.is-da-them[disabled],
.gd3-lk-add.is-da-them,
.gd3-lk-add.is-da-them[disabled] {
	background-color: #ffd900;
	border-color: #ffd900;
	color: #111111;
	opacity: 1;
}
.gd3-btn-cart.is-da-them .fa-check { animation: gd3-tich-nay 0.35s ease; }
@keyframes gd3-tich-nay {
	0% { transform: scale(0.4); }
	60% { transform: scale(1.25); }
	100% { transform: scale(1); }
}
/* Dong chu nho duoi ten nut ("Chon them xe khac" / "Giao tan nha...") -
   xep doc ngay duoi dong chinh, chu khong nam ngang. */
.gd3-detail-buy-btns span {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	line-height: 1.15;
	text-align: left;
}
.gd3-detail-buy-btns span small {
	font-size: 10.5px;
	font-weight: 400;
	opacity: 0.72;
	margin-top: 2px;
	white-space: nowrap;
}
.gd3-detail-buy .gd3-btn-hotline {
	flex: 1 1 100%;
	justify-content: center;
}

/* ---- O mau: ten mau dang chon ---- */
.gd3-detail-colors-list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.gd3-detail-colors-picked {
	font-size: 13px;
	color: #444444;
}
.gd3-detail-colors-picked b { color: #d70018; }

/* ---- 3. Hang cuon ngang (San pham vua xem) ----
   Yeu cau 31/08/2026: BO thanh truot ngang (nhin xau), thay bang 2 nut
   trai/phai chay vong lap vo han (JS trong inc/detail.php). Van giu
   overflow-x: auto de tren dien thoai vuot ngang truc tiep duoc, chi la
   khong ve thanh cuon ra man hinh - moi trinh duyet an mot kieu nen phai
   khai bao ca 3 dong. */
.gd3-hscroll-wrap {
	position: relative;
}
.gd3-hscroll {
	display: flex;
	flex-wrap: nowrap;
	gap: 12px;
	overflow-x: auto;
	/* Dung lai vao dung 1 the khi vuot tay tren dien thoai, khong dung
	   lung chung giua 2 the. */
	scroll-snap-type: x proximity;
	scrollbar-width: none;
	-ms-overflow-style: none;
}
.gd3-hscroll::-webkit-scrollbar { display: none; width: 0; height: 0; }

/* 2 nut de LEN 2 mep hang (khong dat ben ngoai) de khong an bot be ngang
   danh cho the san pham. Mac dinh an, JS them class "has-nav" cho khung
   boc khi hang that su bi tran - it san pham thi khong co gi de cuon. */
.gd3-hscroll-nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 3;
	width: 36px;
	height: 36px;
	border: 1px solid #e6e6e6;
	border-radius: 50%;
	background-color: #ffffff;
	color: #222222;
	font-size: 14px;
	line-height: 1;
	padding: 0;
	cursor: pointer;
	box-shadow: 0 3px 10px rgb(0 0 0 / 16%);
	visibility: hidden;
	opacity: 0;
	transition: opacity 0.15s ease, background-color 0.15s ease;
}
.gd3-hscroll-wrap.has-nav .gd3-hscroll-nav {
	visibility: visible;
	opacity: 1;
}
.gd3-hscroll-nav:hover {
	background-color: #ffd900;
	border-color: #ffd900;
}
/* Nhoi ra ngoai mep hang 1 chut de khong che mat anh san pham dau/cuoi. */
.gd3-hscroll-prev { left: -6px; }
.gd3-hscroll-next { right: -6px; }
.gd3-hscroll-item {
	flex: 0 0 206px;
	max-width: 206px;
	scroll-snap-align: start;
}
/* The san pham dung chung (.product-item) von duoc thiet ke cho o luoi
   Bootstrap - trong hang cuon ngang phai ep cao bang nhau de day the
   thang hang. */
.gd3-hscroll-item .product-item {
	height: 100%;
	display: flex;
	flex-direction: column;
}

/* ---- 4. Phu tung, linh kien di kem (dang danh sach) ---- */
.gd3-lk-note {
	margin: -4px 0 14px;
	font-size: 13.5px;
	color: #777777;
}
.gd3-lk-list {
	display: grid;
	/* 2 cot tren man rong, tu ve 1 cot khi hep - dung auto-fill de khong
	   phai viet lai o tung media query. */
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	gap: 10px;
}
.gd3-lk-item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px;
	border: 1px solid #eeeeee;
	border-radius: 10px;
	background-color: #fcfcfc;
	transition: border-color 0.15s ease, background-color 0.15s ease;
}
.gd3-lk-item:hover {
	border-color: #ffd900;
	background-color: #ffffff;
}
.gd3-lk-thumb {
	flex: 0 0 62px;
	width: 62px;
	height: 62px;
	border: 1px solid #eeeeee;
	border-radius: 8px;
	background-color: #ffffff;
	overflow: hidden;
	display: block;
}
.gd3-lk-thumb img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
}
.gd3-lk-info {
	flex: 1 1 auto;
	min-width: 0;
}
.gd3-lk-name {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.35;
	color: #111111;
	text-decoration: none;
}
.gd3-lk-name:hover { color: #d70018; }
.gd3-lk-price {
	display: block;
	margin-top: 4px;
	font-size: 14px;
	font-weight: 700;
	color: #d70018;
}
.gd3-lk-add {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 36px;
	padding: 0 12px;
	border: 1px solid #111111;
	border-radius: 8px;
	background-color: #ffffff;
	color: #111111;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color 0.15s ease;
}
.gd3-lk-add:hover { background-color: #ffd900; color: #111111; }
.gd3-lk-add[disabled] { opacity: 0.6; cursor: default; }

/* Tu mon thu 9 tro di bi an cho toi khi bam "Xem them" (xem $gd3_lkHien
   trong inc/detail.php). Dung display:none co chu dich: anh loading="lazy"
   nam trong display:none thi trinh duyet KHONG tai - mo ra moi tai. */
.gd3-lk-item.is-an { display: none; }
.gd3-lk-list.is-mo .gd3-lk-item.is-an { display: flex; }
.gd3-lk-more {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	margin-top: 10px;
	height: 40px;
	border: 1px dashed #cccccc;
	border-radius: 10px;
	background-color: #ffffff;
	color: #111111;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: border-color 0.15s ease, background-color 0.15s ease;
}
.gd3-lk-more:hover {
	border-color: #ffd900;
	border-style: solid;
	background-color: #fffdf0;
}
.gd3-lk-more i { font-size: 12px; transition: transform 0.15s ease; }
.gd3-lk-more.is-mo i { transform: rotate(180deg); }
/* Chi hien mot trong hai nhan, tuy trang thai. */
.gd3-lk-more .gd3-lk-more-dong { display: none; }
.gd3-lk-more.is-mo .gd3-lk-more-mo { display: none; }
.gd3-lk-more.is-mo .gd3-lk-more-dong { display: inline; }

/* Nhan "So luong" - chi dung o ban dien thoai (xem media query cuoi file). */
.gd3-detail-qty-label { display: none; }

/* ===================== DIEN THOAI / MAY TINH BANG ===================== */
@media (max-width: 767.5px) {
	/* Thu tu 2 nut mua PHAI giong nhau o PC va dien thoai: "Them vao gio"
	   ben trai, "Mua ngay" ben phai. Quy tac cu .gd3-btn-cart{order:2} viet
	   cho thoi con 1 nut duy nhat nay khien nut "Them vao gio" bi day xuong
	   sau "Mua ngay" khi 2 nut vao chung 1 khoi - go bo o day. */
	.gd3-detail-buy-btns .gd3-btn-cart { order: 0; }
	.gd3-detail-qty-label {
		display: inline-flex;
		align-items: center;
		order: 1;
		height: 48px;
		font-size: 14px;
		color: #666666;
		margin-right: 2px;
	}
	.gd3-detail-qty { order: 1; }
	/* Khong co trang thai hover tren dien thoai - de nut chuyen anh luon
	   hien ro, va thu nho lai cho khoi che mat xe. */
	.gd3-img-nav {
		opacity: 0.9;
		width: 34px;
		height: 34px;
		font-size: 14px;
	}
	.gd3-img-prev { left: 6px; }
	.gd3-img-next { right: 6px; }

	/* So luong + 2 nut mua nam CHUNG 1 hang. Bo dong chu nho trong nut de
	   du cho: tren man 375px moi nut chi con khoang 115px. */
	.gd3-detail-buy-btns {
		order: 2;
		flex: 1 1 auto;
		gap: 8px;
	}
	.gd3-detail-buy-btns span small { display: none; }
	.gd3-detail-buy-btns span { align-items: center; text-align: center; }
	.gd3-detail-buy-btns .gd3-btn-cart,
	.gd3-btn-buynow {
		font-size: 13px;
		gap: 6px;
		padding: 0 8px;
	}
	.gd3-detail-buy .gd3-btn-hotline { order: 3; }
	.gd3-detail-buy .gd3-btn-tragop { order: 4; }   /* (05/09) duoi hotline tren dien thoai */

	/* Man 375px: dai anh nho chi con ~330px, 2 nut cuon phai nho lai de
	   con cho cho anh. */
	.gd3-thumbs-nav {
		flex: 0 0 22px;
		width: 22px;
		height: 22px;
		font-size: 10px;
	}
	.gd3-detail-thumbs-wrap { gap: 4px; }

	.gd3-hscroll-item {
		flex: 0 0 150px;
		max-width: 150px;
	}
	/* Man hep: nut nho lai va nam han trong mep hang cho khoi cham vien
	   khoi (.gd3-detail-block co padding 14px o mobile). */
	.gd3-hscroll-nav {
		width: 30px;
		height: 30px;
		font-size: 12px;
	}
	.gd3-hscroll-prev { left: -2px; }
	.gd3-hscroll-next { right: -2px; }
	.gd3-lk-list { grid-template-columns: 1fr; }
	.gd3-lk-item { padding: 8px; gap: 10px; }
	.gd3-lk-thumb { flex: 0 0 54px; width: 54px; height: 54px; }
	.gd3-lk-name { font-size: 13.5px; }
	/* Nut chi con icon cho do chat cho ten phu tung. */
	.gd3-lk-add { padding: 0 10px; }
	.gd3-lk-add span { display: none; }
}

/* Man rat hep (320-360px): 2 nut mua xuong 2 hang cho de bam. */
@media (max-width: 360px) {
	.gd3-detail-buy-btns { flex-wrap: wrap; }
	.gd3-detail-buy-btns .gd3-btn-cart,
	.gd3-btn-buynow { flex: 1 1 100%; }
}

/* ==========================================================================
   CHIA SE (yeu cau 01/09/2026: "trang chi tiet san pham nen co cac icon
   bieu tuong share mang xa hoi pho bien o vn va tren toan cau")

   Nam cuoi cot thong tin ben phai, duoi 3 cam ket dich vu. Co y de nho va
   nhat mau: day la viec phu, khong duoc canh tranh su chu y voi 2 nut
   "Them vao gio" / "Mua ngay" ngay phia tren. Mau thuong hieu cua tung
   mang chi hien ra khi ren chuot vao.
   ========================================================================== */
.gd3-share {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid #eee;
}

.gd3-share-label {
    font-size: 13px;
    color: #777;
    margin-right: 2px;
}

.gd3-share-label i {
    color: #999;
    margin-right: 2px;
}

.gd3-share-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 1px solid #e2e2e2;
    border-radius: 50%;
    background: #fff;
    color: #666;
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    text-decoration: none;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.gd3-share-btn:hover,
.gd3-share-btn:focus-visible {
    color: #fff;
    text-decoration: none;
}

/* Mau chinh thuc cua tung mang - chi dung luc ren chuot vao. */
.gd3-share-btn.is-fb:hover,
.gd3-share-btn.is-fb:focus-visible { background: #1877f2; border-color: #1877f2; }

.gd3-share-btn.is-x:hover,
.gd3-share-btn.is-x:focus-visible { background: #000; border-color: #000; }

.gd3-share-btn.is-tele:hover,
.gd3-share-btn.is-tele:focus-visible { background: #229ed9; border-color: #229ed9; }

.gd3-share-btn.is-wa:hover,
.gd3-share-btn.is-wa:focus-visible { background: #25d366; border-color: #25d366; }

.gd3-share-btn.is-pin:hover,
.gd3-share-btn.is-pin:focus-visible { background: #e60023; border-color: #e60023; }

.gd3-share-btn.is-copy:hover,
.gd3-share-btn.is-copy:focus-visible,
.gd3-share-btn.is-native:hover,
.gd3-share-btn.is-native:focus-visible { background: #141414; border-color: #141414; }

/* Da sao chep xong: doi han sang mau thuong hieu cho de thay, khong chi
   doi luc ren chuot. */
.gd3-share-btn.is-copy.da-chep {
    background: #ffd900;
    border-color: #ffd900;
    color: #141414;
}

.gd3-share-msg {
    font-size: 12.5px;
    color: #1a9c53;
}

@media (max-width: 575.98px) {
    .gd3-share-label {
        /* Man hinh hep: bo chu "Chia se:", chi de rieng icon o dau hang cho
           du cho 6 nut nam tron mot dong. */
        font-size: 0;
    }
    .gd3-share-label i {
        font-size: 14px;
    }
    .gd3-share-btn {
        width: 32px;
        height: 32px;
        font-size: 13px;
    }
}

/* ==========================================================================
   TRANG CHI TIET "DO SO" (05/09/2026): thanh muc luc dinh, qua tang, bo cuc
   2 cot phan noi dung (9/3) + cot phai (dung lai .gd3-tcp-* cua
   css/category.css va .gd3-yt/.gd3-home-vd-them cua css/video.css).
   ========================================================================== */
/* --- Thanh muc luc dinh --- */
.gd3-detail-nav {
	position: sticky;
	top: 0;
	z-index: 40;
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 18px;
	padding: 0 8px 0 4px;
	background: #fff;
	border-radius: 10px;
	box-shadow: 0 4px 14px rgb(0 0 0 / 6%);
	/* `top` cung phai co transition: khi khoi vang o thanh dau trang truot
	   len, JS ha luon `top` cua thanh nay xuong cho vua - hai cai phai chay
	   CUNG NHIP, khong thi thanh muc luc nhay mot phat con header thi truot
	   tu tu. Xem js/detail-nav.js. */
	transition: box-shadow .2s ease, border-radius .2s ease, top .22s ease;
}
.gd3-detail-nav.is-dinh { border-radius: 0 0 10px 10px; box-shadow: 0 8px 20px rgb(0 0 0 / 14%); border-top: 3px solid #ffc600; }

/* ---- An khoi vang o thanh dau trang khi cuon xuong (07/09/2026) ----
   Chi doi mot thu: `top` cua the sticky. Xem chu thich day du trong
   js/detail-nav.js (vi sao khong thu nho chieu cao header, vi sao chi tu
   1200px). Dat o day chu khong o main.css vi day la hanh vi cua RIENG
   trang chi tiet san pham - tuy `.header-fixed-top` la the dung chung,
   quy tac nay chi la mot dong transition, khong doi gi o cac trang khac. */
.header-fixed-top {
	transition: box-shadow .2s ease, top .22s ease;
}
.gd3-detail-nav-cuon { flex: 1 1 auto; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.gd3-detail-nav-cuon::-webkit-scrollbar { display: none; }
.gd3-detail-nav-ds { display: flex; gap: 2px; margin: 0; padding: 0; list-style: none; white-space: nowrap; }
.gd3-detail-nav-ds a {
	display: block;
	padding: 13px 12px;
	border-bottom: 3px solid transparent;
	font-size: 14px;
	font-weight: 700;
	color: #333;
	text-decoration: none;
	transition: color .15s ease, border-color .15s ease;
}
.gd3-detail-nav-ds a:hover { color: #111; border-color: #ffe27a; }
.gd3-detail-nav-ds a.is-active { color: #111; border-color: #ffc600; }
.gd3-detail-nav-mua { flex: 0 0 auto; display: flex; align-items: center; gap: 10px; padding-left: 10px; border-left: 1px solid #eee; }
.gd3-detail-nav-gia { font-size: 16px; font-weight: 800; color: #d70018; white-space: nowrap; }
.gd3-detail-nav-nut {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 14px;
	border-radius: 999px;
	background: #111;
	color: #ffc600;
	font-size: 13px;
	font-weight: 800;
	text-decoration: none;
	white-space: nowrap;
}
.gd3-detail-nav-nut:hover { background: #ffc600; color: #111; text-decoration: none; }
/* Khi header tren dien thoai an di luc cuon xuong (body.gd3-cuon-xuong) thi
   thanh nay dinh len sat mep tren. */
@media (max-width: 767.98px) {
	body.gd3-cuon-xuong .gd3-detail-nav { top: 0 !important; }
	.gd3-detail-nav { gap: 6px; padding: 0 6px 0 2px; }
	.gd3-detail-nav-ds a { padding: 11px 9px; font-size: 13px; }
	.gd3-detail-nav-gia { font-size: 14px; }
	.gd3-detail-nav-nut span { display: none; }
}

/* --- Qua tang khi mua xe (cot thong tin) --- */
.gd3-detail-quatang {
	margin-top: 14px;
	/* (07/09/2026) Tu khi khoi qua tang duoc dua len TREN khoi mau sac, no
	   khong con la khoi cuoi mot cum nua ma co phan tu dung ngay duoi. Khoi
	   .gd3-detail-colors khong dat margin-top, nen khong co dong nay thi
	   hop vang dinh sat vao hang cham mau. */
	margin-bottom: 12px;
	border: 1px solid #ffe27a;
	border-radius: 10px;
	background: #fffbe6;
	overflow: hidden;
}
.gd3-detail-quatang > summary {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 14px;
	list-style: none;
	cursor: pointer;
	font-size: 14px;
	font-weight: 800;
	color: #111;
}
.gd3-detail-quatang > summary::-webkit-details-marker { display: none; }
.gd3-detail-quatang > summary > .fa-gift { color: #d70018; font-size: 16px; }
.gd3-detail-quatang > summary > span { flex: 1 1 auto; }
.gd3-detail-quatang-mui { font-size: 12px; color: #999; transition: transform .2s ease; }
.gd3-detail-quatang[open] .gd3-detail-quatang-mui { transform: rotate(180deg); }
.gd3-detail-quatang-nd { padding: 0 14px 12px; font-size: 13.5px; line-height: 1.6; color: #333; }
.gd3-detail-quatang-nd p { margin: 0 0 4px; }
.gd3-detail-quatang-nd p:first-child { font-weight: 700; color: #111; }
.gd3-detail-quatang-nd a { color: #b58600; font-weight: 600; }
.gd3-detail-quatang-dk { margin-top: 6px; font-size: 12.5px; }
.gd3-detail-quatang-dk > summary { cursor: pointer; color: #777; text-decoration: underline; }
.gd3-detail-quatang-dk > div { margin-top: 4px; color: #a33; }
.gd3-detail-quatang-dk > div span { color: inherit !important; }

/* --- Bo cuc 2 cot phan noi dung --- */
.gd3-detail-duoi { margin-top: 0; }
.gd3-detail-cot-chinh > .gd3-detail-block:first-child { margin-top: 22px; }
/* `top` la khoang tru cho thanh dau trang (110px) + thanh muc luc san pham
   (52px, cung dinh) + 8px tho. Truoc day de 200px - thua ra gan 40px trong
   khong, va tu 07/09 (khi cuon xuong thi khoi vang o thanh dau trang truot
   len, header chi con 46px) thi thua toi ~100px: khach thay mot mang trang
   to tuong phia tren khoi "Cua hang gan ban" dang chay theo man hinh.

   Con so 170 nay chi la MAC DINH (trang khong co thanh muc luc, hoac JS
   chua chay). Khi co thanh muc luc thi js/detail-nav.js tinh lai chinh xac
   theo vi tri THAT cua no va ghi de bang style noi tuyen - nho vay cot phai
   tu nhich len theo moi khi khoi vang an di. */
.gd3-detail-cot-phai { position: sticky; top: 170px; display: flex; flex-direction: column; gap: 18px; margin-top: 22px; transition: top .22s ease; }
/* PC: cot phai rong hon luoi 3/12 (25%) -> 31% (yeu cau 05/09 "cot phai rong ra chut") */
@media (min-width: 992px) {
	.gd3-detail-duoi > .gd3-detail-cot-chinh { flex: 0 0 69%; max-width: 69%; }
	.gd3-detail-duoi > .gd3-detail-cot-phai-boc { flex: 0 0 31%; max-width: 31%; }
}
.gd3-detail-cot-phai .gd3-tcp-khoi { box-shadow: 0 4px 14px rgb(0 0 0 / 6%); }
.gd3-cp-showroom { margin: 0; padding: 0; list-style: none; }
.gd3-cp-showroom li { border-bottom: 1px dashed #eee; }
.gd3-cp-showroom li:last-child { border-bottom: 0; }
.gd3-cp-showroom a { display: block; padding: 8px 0; color: #222; text-decoration: none; }
.gd3-cp-showroom a:hover { color: #b58600; text-decoration: none; }
.gd3-cp-showroom b { display: block; font-size: 13px; }
.gd3-cp-showroom span { display: block; font-size: 12px; color: #777; line-height: 1.4; }
/* Video san pham dang khung phat nhe (.gd3-yt) thay iframe. */
.gd3-yt.gd3-detail-video { max-width: 900px; }
@media (max-width: 991.98px) {
	.gd3-detail-cot-phai { position: static; }
}

/* ==========================================================================
   BO SUNG "DO SO" 05/09/2026 (tham khao demo chi-tiet-san-pham.html + gd1):
   dem nguoc khuyen mai, nut Mua tra gop / Dat hang nhanh, 7 cam ket. Hop thoai dat hang: css/dat-hang-nhanh.css.
   ========================================================================== */
/* --- Dem nguoc khuyen mai (duoi gia) --- */
/* 07/09/2026 - dung lai theo khoi "CON LAI" cua giao dien 1 tren ban that
   (thegioixechaydien.com.vn/xe-dien-type3-pro.html, .detail-countdown):
   MOT thanh chia lam 2 o - o den ben trai la nhan, o vang ben phai la dong
   ho. Kieu cu (nen den + 4 the vuong vang) don het thoi gian ve mep phai,
   giua thanh trong hoac (cot hep) 4 the dinh sat nhau -> chat va roi.
   Nay: nhan chi rong bang chu, o vang an het cho con lai va can giua, cac
   so dung mot hang "17 NGÀY 15:11:07" nen thoang hon han va van doc duoc
   ngay ca khi cot chi rong ~300px. */
.gd3-detail-cdown {
	display: flex;
	align-items: stretch;
	flex-wrap: nowrap;   /* luon 1 dong */
	margin-top: 10px;
	min-height: 42px;
	border-radius: 10px;
	overflow: hidden;    /* bo goc an sang ca 2 o con */
	background: #111;
	color: #fff;
	text-decoration: none;
}
.gd3-detail-cdown:hover { color: #fff; text-decoration: none; }
.gd3-detail-cdown:hover .gd3-detail-cdown-gio { background: #ffd233; }
.gd3-detail-cdown:hover .gd3-cd-mui { transform: translateX(2px); }
/* O den (nhan) - chi rong bang chu, khong co (khong flex-grow) */
.gd3-detail-cdown-nhan { flex: 0 0 auto; display: flex; align-items: center; gap: 6px; padding: 0 12px; font-size: 12px; font-weight: 700; color: #ffc600; text-transform: uppercase; letter-spacing: .3px; white-space: nowrap; }
.gd3-detail-cdown-nhan i { font-size: 13px; }
.gd3-detail-cdown-nhan em { font-style: normal; }
.gd3-detail-cdown-nhan .gd3-cd-ngan { display: none; }
/* Man hep: nhan ngan "Con lai" thay vi bi cat "KHUYE..." */
@media (max-width: 575.98px) {
	.gd3-detail-cdown-nhan { padding: 0 10px; font-size: 11px; }
	.gd3-detail-cdown-nhan .gd3-cd-dai { display: none; }
	.gd3-detail-cdown-nhan .gd3-cd-ngan { display: inline; }
}
/* O vang (dong ho) - chiem het phan con lai, can giua */
.gd3-detail-cdown-gio { flex: 1 1 auto; min-width: 0; display: flex; align-items: baseline; justify-content: center; gap: 1px; padding: 0 12px; background: #ffc600; color: #111; transition: background .15s ease; }
.gd3-detail-cdown-gio b { font-size: 20px; font-weight: 800; line-height: 42px; font-variant-numeric: tabular-nums; letter-spacing: .5px; }
.gd3-detail-cdown-gio em { font-style: normal; }
.gd3-cd-dv { margin: 0 9px 0 4px; font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px; color: #6b5200; }
.gd3-cd-cham { margin: 0 1px; font-size: 17px; font-weight: 700; color: rgba(17, 17, 17, .45); }
.gd3-cd-mui { margin-left: 10px; font-size: 12px; color: rgba(17, 17, 17, .5); transition: transform .15s ease; }
.gd3-detail-cdown.is-het { opacity: .5; }
/* --- Nut Mua tra gop / Dat hang nhanh: hang rieng duoi 2 nut mua, rong het --- */
.gd3-btn-tragop {
	flex: 1 1 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	height: 48px;
	border: 2px solid #111;
	border-radius: 8px;
	background: #fff;
	color: #111;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	transition: background .15s ease, color .15s ease, transform .15s ease;
}
.gd3-btn-tragop i { font-size: 18px; color: #b58600; }
.gd3-btn-tragop span { display: flex; flex-direction: column; align-items: flex-start; line-height: 1.15; }
.gd3-btn-tragop small { font-size: 11px; font-weight: 500; color: #666; }
.gd3-btn-tragop:hover { background: #111; color: #ffc600; transform: translateY(-1px); }
.gd3-btn-tragop:hover i, .gd3-btn-tragop:hover small { color: #ffc600; }
.gd3-btn-dhn { border-color: #ffc600; background: #ffc600; }
.gd3-btn-dhn i { color: #111; }
/* --- 7 cam ket --- */
.gd3-detail-camket {
	margin-top: 14px;
	border: 1px solid #e6e6e6;
	border-radius: 10px;
	background: #fff;
	overflow: hidden;
}
.gd3-detail-camket > summary {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 14px;
	list-style: none;
	cursor: pointer;
	font-size: 14px;
	font-weight: 800;
	color: #111;
	background: #fafafa;
}
.gd3-detail-camket > summary::-webkit-details-marker { display: none; }
.gd3-detail-camket > summary > .fa-circle-check { color: #16a34a; font-size: 16px; }
.gd3-detail-camket > summary > span { flex: 1 1 auto; }
.gd3-detail-camket[open] .gd3-detail-quatang-mui { transform: rotate(180deg); }
.gd3-detail-camket-ds { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px 14px; margin: 0; padding: 10px 14px 12px; list-style: none; }
.gd3-detail-camket-ds li { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; line-height: 1.4; color: #333; }
.gd3-detail-camket-ds li i { flex: 0 0 18px; margin-top: 2px; text-align: center; color: #b58600; }
@media (max-width: 575.98px) {
	.gd3-detail-camket-ds { grid-template-columns: 1fr; }
	.gd3-detail-cdown-gio { padding: 0 8px; }
	.gd3-detail-cdown-gio b { font-size: 18px; }
	.gd3-cd-dv { margin: 0 7px 0 3px; }
	.gd3-cd-mui { display: none; }   /* man hep: bo mui ten cho thoang */
	.gd3-btn-tragop { height: 46px; font-size: 14px; }
}

/* ==========================================================================
   KHU VUC MUA HANG - BO CUC 2 HANG (05/09/2026, gop y "so luong + them gio 1
   hang, mua ngay + mua tra gop 1 hang, goi tu van kieu khac, khong nen mau").
   Ap cho .gd3-detail-buy.gd3-buy-v2 - ghi de cac luat cu ben tren (order,
   flex, max-width) ma khong phai sua chung.
   ========================================================================== */
/* (07/09/2026) DUNG LAI BO CUC.
   Truoc do: tren PC hai the .gd3-buy-hang bi lam phang bang `display: contents`
   -> o so luong + 3 nut nam CHUNG mot hang. Cot phai cua trang chi tiet chi
   rong ~400px o man hinh 1280, chia 4 phan thi moi nut con ~110px, trong khi
   moi nut co 2 dong chu (ten + dong phu) -> chu vo hang giua chung ("Mua tra /
   gop"), dong phu tran ra ngoai vien. Do la loi do hoa khach bao.
   Nay: bo o so luong (xe hau nhu chi mua 1 chiec), va sap lai theo dung thu tu
   quan trong, GIONG NHAU o moi be ngang man hinh:
       hang 1: Mua ngay          (chiem het be ngang - viec chinh)
       hang 2: Them vao gio | Mua tra gop   (chia doi)
       hang 3: So sanh xe nay
       hang 4: Goi tu van
   (07/09/2026 lan 2 - xem tiep phia duoi) khach doi lai: "Mua ngay" xuong
   nam cung hang voi "So sanh xe nay", con "Them vao gio | Mua tra gop" len
   hang tren.
   Lam bang `order` + `flex-basis`, khong dong vao cau truc HTML, nen hai the
   .gd3-buy-hang van con nguyen cho ai doc ma nguon.
   Nut cao `auto` chu khong ep 48px: dong chu phu neu co xuong hang thi nut cao
   them, khong bao gio tran ra ngoai nua. */
.gd3-detail-buy.gd3-buy-v2 { display: flex; flex-direction: row; flex-wrap: wrap; align-items: stretch; gap: 10px; }
.gd3-buy-v2 .gd3-buy-hang { display: contents; }
.gd3-buy-v2 .gd3-btn-cart,
.gd3-buy-v2 .gd3-btn-buynow,
.gd3-buy-v2 .gd3-btn-tragop {
	min-width: 0;
	max-width: none;
	height: auto;
	min-height: 50px;
	padding: 7px 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	transition: transform .15s ease, opacity .15s ease, background-color .15s ease, color .15s ease;
}
/* (07/09/2026 - lan 2) DOI THU TU: "Mua ngay" xuong hang duoi, DUNG CHUNG
   HANG voi "So sanh xe nay" (yeu cau: "nut mua ngay nen dua xuong duoi va
   cho cung hang voi nut so sanh (ca mobi + pc)"). Thu tu moi:
       hang 1: Mua ngay     | Mua tra gop      (xem tiep "lan 4" ben duoi)
       hang 2: Them vao gio | So sanh xe nay
       hang 3: Goi tu van

   CACH NGAT HANG - doc ky truoc khi sua:
   flex-wrap KHONG ngat theo nhom `order`, no chi ngat khi mot dong da day.
   Bo cuc cu ngat dung chi vi "Mua ngay" va "So sanh" deu `flex-basis: 100%`.
   Neu nay chi doi `order` ma de basis 150px thi tren PC (cot ~620px) CA BON
   nut se nam gon mot dong - dung thu tu nhung sai bo cuc.
   Vi vay moi hang dung basis theo PHAN TRAM cong lai vua dung 100%:
       hang 1: 2 x calc(50% - 5px) + gap 10px = 100%
       hang 2: 2 x calc(50% - 5px) + gap 10px = 100%
   Cong vua khit thi nut thu ba BUOC PHAI xuong hang, o moi be ngang man
   hinh - khong can @media, khong phu thuoc do dai chu trong nut. */
.gd3-buy-v2 .gd3-btn-tragop { order: 1; flex: 1 1 calc(50% - 5px); }
.gd3-buy-v2 .gd3-btn-cart   { order: 2; flex: 1 1 calc(50% - 5px); }
/* (07/09/2026 lan 3) Hai hang deu chia 50/50 - yeu cau "nen cho no can deu
   voi 2 nut tren do". Truoc do hang duoi la 58/42 de "Mua ngay" to hon, nhung
   thanh ra mep phai cua "Mua ngay" khong thang hang voi mep phai cua "Them
   vao gio" o tren -> nhin lech. Do noi bat cua "Mua ngay" van giu bang nen
   vang dac + chu 16px + cao 54px so voi 50px cua hang con lai. */
/* (07/09/2026 lan 4) Doi cho "Mua ngay" <-> "Them vao gio" (yeu cau khach).
   Bo cuc cuoi cung:
       hang 1: Mua ngay      | Mua tra gop
       hang 2: Them vao gio  | So sanh xe nay
       hang 3: Goi tu van
   Chi doi so `order`, HTML van giu nguyen thu tu Them gio -> Mua ngay ->
   Mua tra gop -> So sanh (thu tu doc man hinh cua trinh doc / khi tat CSS). */
.gd3-buy-v2 .gd3-btn-buynow { order: 1; flex: 1 1 calc(50% - 5px); min-height: 54px; font-size: 16px; }
/* Truong hop gia lien he / het hang: chi co MOT nut mua. */
.gd3-buy-v2 .gd3-btn-dhn { order: 1; flex: 1 1 100%; min-height: 54px; }
/* Mac dinh "So sanh" rieng mot hang (chi con dung cho gd3-buy-2nut). */
.gd3-buy-v2 .gd3-detail-ss { order: 3; flex: 1 1 100%; margin: 0; }

/* "So sanh" nam CUNG HANG voi nut mua - ap cho CA HAI truong hop:
     - du 3 nut  : hang duoi la  Them vao gio      | So sanh   (order 2)
     - 1 nut mua : (07/09/2026 lan 5, yeu cau khach "neu chi co 2 nut thi
       nen cho 2 nut cung hang - ca mobi + PC - va deu nhau")
                   hang duy nhat  Nhan bao gia     | So sanh   (order 1)
   Rieng `gd3-buy-2nut` (linh kien co gia) KHONG ap: o do hang tren da co du
   2 nut mua roi, So sanh la nut thu ba nen van rieng mot hang.
   Ghi de `height: 38px` cua .gd3-ss-them.gd3-detail-ss trong main.css de hai
   nut cung chieu cao; chu trong nut duoc phep xuong 2 dong khi cot hep. */
.gd3-buy-v2:not(.gd3-buy-2nut) .gd3-detail-ss {
	order: 2;
	flex: 1 1 calc(50% - 5px);
	min-width: 0;
	height: auto;
	min-height: 54px;
	padding: 4px 10px;
	line-height: 1.25;
	text-align: center;
}
/* Gia lien he / het hang: keo nut mua tu 100% ve 50% va dua So sanh len
   CUNG nhom order voi no -> hai nut deu nhau, mot hang, o moi be ngang.
   (`.gd3-btn-dhn` cung mang lop `.gd3-btn-tragop` nen phai du 3 lop moi
   thang duoc luat `.gd3-buy-v2 .gd3-btn-dhn { flex: 1 1 100% }` o tren.) */
.gd3-buy-v2.gd3-buy-1nut .gd3-btn-dhn { flex: 1 1 calc(50% - 5px); }
.gd3-buy-v2.gd3-buy-1nut .gd3-detail-ss { order: 1; }

/* CHI CO 2 NUT (linh kien - khong co "Mua tra gop"): hai nut chia doi cung
   MOT hang, o ca PC lan dien thoai. Khong con ly do de "Mua ngay" chiem
   tron mot hang khi duoi no chi con dung mot nut nua.
   Thu tu trai -> phai: "Them vao gio" (vien den) roi "Mua ngay" (vang dac)
   - dung DUNG thu tu trong ma nguon, va dat viec chinh o ben phai giong
   thanh mua co dinh day man hinh tren dien thoai. */
.gd3-buy-v2.gd3-buy-2nut .gd3-btn-cart,
.gd3-buy-v2.gd3-buy-2nut .gd3-btn-buynow { order: 2; flex: 1 1 150px; }
.gd3-buy-v2.gd3-buy-2nut .gd3-btn-buynow { min-height: 50px; font-size: 15px; }
.gd3-buy-v2 .gd3-detail-tuvan { order: 4; flex: 1 1 100%; margin: 0; }
/* (07/09/2026) "Them vao gio" bo VIEN DEN 2px, doi sang vien mo 1px
   #e2e2e2 - DUNG BANG vien cua nut "So sanh xe nay" nam ngay canh no
   (.gd3-ss-them.gd3-detail-ss trong css/main.css).
   Ly do (yeu cau khach): hai nut nay o CUNG MOT HANG, mot cai vien den day
   2px, mot cai vien xam mong 1px -> nhin nhu hai bo giao dien khac nhau
   ghep lai. Hang tren da co du do dam roi (Mua ngay nen vang dac, Mua tra
   gop nen den dac), hang duoi de nhe deu nhau moi can.
   Re chuot van dam len (nen #ffd900) vi day la nut mua hang - can phan hoi
   ro hon nut So sanh; chi luc DUNG YEN moi phai giong nhau.
   Truong hop khong co nut tra gop (`gd3-buy-ktg`) van la nen den chu vang -
   luat do o duoi, do lop nen thang luat nay. */
.gd3-buy-v2 .gd3-btn-cart { background: #fff; color: #111; border: 1px solid #e2e2e2; }
.gd3-buy-v2 .gd3-btn-cart:hover { background: #ffd900; border-color: #ffd900; opacity: 1; }
.gd3-buy-v2 .gd3-btn-cart.is-da-them, .gd3-buy-v2 .gd3-btn-cart.is-da-them[disabled] { background: #ffd900; border-color: #ffd900; color: #111; opacity: 1; }
/* Mua ngay: nen vang chu den, hover dao nguoc (05/09/2026 theo yeu cau). */
.gd3-buy-v2 .gd3-btn-buynow { background: #ffc600; color: #111; border: 2px solid #ffc600; }
.gd3-buy-v2 .gd3-btn-buynow i, .gd3-buy-v2 .gd3-btn-buynow small { color: #111; }
.gd3-buy-v2 .gd3-btn-buynow:hover { background: #111; color: #ffc600; border-color: #111; }
.gd3-buy-v2 .gd3-btn-buynow:hover i, .gd3-buy-v2 .gd3-btn-buynow:hover small { color: #ffc600; }
.gd3-buy-v2 .gd3-btn-tragop { background: #111; color: #ffc600; border: 2px solid #111; }
.gd3-buy-v2 .gd3-btn-tragop i, .gd3-buy-v2 .gd3-btn-tragop small { color: #ffc600; }
.gd3-buy-v2 .gd3-btn-tragop:hover { background: #ffc600; color: #111; border-color: #ffc600; }
.gd3-buy-v2 .gd3-btn-tragop:hover i, .gd3-buy-v2 .gd3-btn-tragop:hover small { color: #111; }
.gd3-buy-v2 .gd3-btn-dhn { background: #ffc600; color: #111; border-color: #ffc600; }
.gd3-buy-v2 .gd3-btn-dhn i, .gd3-buy-v2 .gd3-btn-dhn small { color: #111; }
.gd3-buy-v2 .gd3-btn-dhn:hover { background: #111; color: #ffc600; border-color: #111; }
.gd3-buy-v2 .gd3-btn-dhn:hover i, .gd3-buy-v2 .gd3-btn-dhn:hover small { color: #ffc600; }
/* (07/09/2026) KHONG CO nut "Mua tra gop" (linh kien, hoac xe duoi 8tr):
   doi "Them vao gio" tu vien den sang NEN DEN CHU VANG - dung bo mau ma nut
   tra gop von giu, de khoi mua khong bi nhat di khi mat mot nut.
   Yeu cau khach: "nut mua tra gop ma ko hien thi thi nut them vao gio nen
   chuyen sang nen den chu vang". Lop `gd3-buy-ktg` do inc/detail.php gan. */
.gd3-buy-v2.gd3-buy-ktg .gd3-btn-cart { background: #111; color: #ffc600; border-color: #111; }
.gd3-buy-v2.gd3-buy-ktg .gd3-btn-cart i, .gd3-buy-v2.gd3-buy-ktg .gd3-btn-cart small { color: #ffc600; }
.gd3-buy-v2.gd3-buy-ktg .gd3-btn-cart:hover { background: #ffc600; color: #111; border-color: #ffc600; }
.gd3-buy-v2.gd3-buy-ktg .gd3-btn-cart:hover i, .gd3-buy-v2.gd3-buy-ktg .gd3-btn-cart:hover small { color: #111; }
/* Da them vao gio: van bao hieu bang nen vang nhu cu. Phai ep lai mau chu
   cho `i` va `small` - khong thi chu VANG nam tren nen VANG, mat hut. */
.gd3-buy-v2.gd3-buy-ktg .gd3-btn-cart.is-da-them,
.gd3-buy-v2.gd3-buy-ktg .gd3-btn-cart.is-da-them[disabled] { background: #ffd900; border-color: #ffd900; color: #111; }
.gd3-buy-v2.gd3-buy-ktg .gd3-btn-cart.is-da-them i,
.gd3-buy-v2.gd3-buy-ktg .gd3-btn-cart.is-da-them small { color: #111; }
.gd3-buy-v2 .gd3-btn-cart[disabled], .gd3-buy-v2 .gd3-btn-buynow[disabled] { opacity: .6; cursor: default; transform: none; }
.gd3-buy-v2 .gd3-buy-hang button span { display: flex; flex-direction: column; align-items: flex-start; line-height: 1.15; text-align: left; }
.gd3-buy-v2 .gd3-buy-hang button small { font-size: 10.5px; font-weight: 400; opacity: .75; margin-top: 2px; white-space: nowrap; }
.gd3-buy-v2 .gd3-buy-hang button i { font-size: 16px; }
/* Dong "Goi tu van" - chu thuong, khong nen, so dien thoai in dam co gach vang. */
.gd3-detail-tuvan {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin: 2px 0 0;
	font-size: 13.5px;
	line-height: 1.5;
	color: #555;
}
.gd3-detail-tuvan i { margin-top: 3px; color: #b58600; font-size: 14px; }
.gd3-detail-tuvan a { color: #111; font-weight: 800; font-size: 15px; text-decoration: none; border-bottom: 2px solid #ffc600; white-space: nowrap; }
.gd3-detail-tuvan a:hover { background: #fff3b8; color: #111; }
.gd3-detail-tuvan small { color: #999; font-size: 12px; white-space: nowrap; }
/* (07/09/2026) So TONG DAI in ngay sau so tu van, ngan cach bang dau cham
   giua. `nowrap` de cum "Tổng đài 1800 6726" khong bi tach doi khi xuong
   hang tren dien thoai - ca cum tu xuong hang cung nhau. */
.gd3-detail-tuvan .gd3-tuvan-td { white-space: nowrap; }
.gd3-detail-tuvan .gd3-tuvan-td::before { content: '·'; margin: 0 7px; color: #c9c9c9; }
/* Dong chu phu duoc phep xuong hang o moi be ngang - nut cao `auto` nen no
   day nut cao them chu khong tran ra ngoai. */
.gd3-buy-v2 .gd3-buy-hang button small { white-space: normal; }

/* ==========================================================================
   KHOI "SO SANH VOI XE KHAC" (07/09/2026)
   ==========================================================================
   Nam ngay duoi khoi mua hang. Co tinh lam NHE: vien mo, chu nho, khong nen
   mau - day la loi moi doc them, khong duoc tranh cho voi "Mua ngay" ngay
   phia tren. Moi dong la mot link toi /so-sanh-a-vs-b.html.
   ========================================================================== */
.gd3-ssgy { margin-top: 14px; border: 1px solid #ececec; border-radius: 10px; overflow: hidden; }
.gd3-ssgy-dau {
	padding: 9px 12px;
	background: #fafafa;
	border-bottom: 1px solid #ececec;
	font-size: 13px;
	font-weight: 700;
	color: #333;
}
.gd3-ssgy-dau i { color: #b58600; margin-right: 5px; }
.gd3-ssgy-o {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 9px 12px;
	border-top: 1px solid #f4f4f4;
	color: #111;
	text-decoration: none;
	transition: background-color .15s ease;
}
.gd3-ssgy-o:first-of-type { border-top: 0; }
.gd3-ssgy-o:hover { background: #fffdf3; color: #111; text-decoration: none; }
.gd3-ssgy-o img {
	flex: 0 0 40px;
	width: 40px;
	height: 40px;
	object-fit: contain;
	border: 1px solid #eee;
	border-radius: 6px;
	background: #fff;
}
.gd3-ssgy-chu { flex: 1 1 auto; min-width: 0; }
.gd3-ssgy-chu b {
	display: block;
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1.35;
	/* Ten xe dai thi cat 1 dong - khoi nay la loi moi, khong phai cho doc ky. */
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.gd3-ssgy-chu em { display: block; margin-top: 2px; font-style: normal; font-size: 12.5px; color: #d70018; font-weight: 700; }
/* Chenh lech gia so voi xe dang xem - cho khach thay ngay dat/re bao nhieu. */
.gd3-ssgy-lech { margin-left: 4px; font-weight: 500; color: #888; }
.gd3-ssgy-o > i { flex: 0 0 auto; color: #bbb; font-size: 12px; }
.gd3-ssgy-o:hover > i { color: #b58600; }
@media (max-width: 767.5px) {
	.gd3-ssgy-o { padding: 10px; }
	.gd3-ssgy-chu b { font-size: 13px; }
}

/* ==========================================================================
   KHOI "LAP DUOC CHO N MAU XE" - trang chi tiet LINH KIEN   (07/09/2026)
   ==========================================================================
   Dat ngay duoi nut mua. Vien xanh nhat + dau tich: day la mot LOI KHANG
   DINH ("vua xe cua ban"), khac han khoi goi y mau vang ben trang xe.
   ========================================================================== */
.gd3-xd { margin-top: 14px; border: 1px solid #d6ecd8; border-radius: 10px; overflow: hidden; background: #fbfffb; }
.gd3-xd-dau { padding: 9px 12px; background: #f0f9f1; border-bottom: 1px solid #ddeede; font-size: 13.5px; color: #1e6b2b; }
.gd3-xd-dau i { margin-right: 6px; }
.gd3-xd-dau b { font-weight: 700; }
.gd3-xd-tim { position: relative; padding: 8px 12px 0; }
.gd3-xd-tim i { position: absolute; left: 22px; top: 17px; font-size: 12px; color: #999; }
.gd3-xd-tim input {
	width: 100%;
	height: 34px;
	padding: 0 10px 0 28px;
	border: 1px solid #dcdcdc;
	border-radius: 8px;
	font-size: 13px;
	background: #fff;
	box-sizing: border-box;
	-webkit-appearance: none;
	appearance: none;
}
.gd3-xd-tim input:focus { outline: 0; border-color: #7fb987; }
/* (07/09/2026) BO THANH TRUOT, doi sang "Xem them" nhu khoi phu tung o trang
   xe. Thanh truot trong mot khoi nam giua trang thi khach de khong nhan ra la
   con cuon duoc, va tren dien thoai no an tranh voi cuon cua ca trang. */
.gd3-xd-ds { padding: 6px 12px; }
.gd3-xd-o.is-an { display: none; }
.gd3-xd-ds.is-mo .gd3-xd-o.is-an { display: flex; }
/* Dang loc thi dong khong khop phai an, KE CA khi danh sach dang mo.
   Phai co ban `.is-mo ...` rieng: luat `.gd3-xd-ds.is-mo .gd3-xd-o.is-an`
   o tren nang 4 lop, mot luat 3 lop khong thang duoc no -> da gap dung loi
   nay khi thu (go tim ra 55/60 dong thay vi loc that). */
.gd3-xd-ds .gd3-xd-o.is-loc-an,
.gd3-xd-ds.is-mo .gd3-xd-o.is-loc-an { display: none; }
.gd3-xd-them {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 100%;
	padding: 8px 12px;
	border: 0;
	border-top: 1px dashed #dfeadf;
	background: none;
	color: #1e6b2b;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
}
.gd3-xd-them:hover { background: #f2faf3; }
.gd3-xd-them i { font-size: 11px; transition: transform 0.15s ease; }
.gd3-xd-them.is-mo i { transform: rotate(180deg); }
.gd3-xd-them .gd3-xd-them-dong { display: none; }
.gd3-xd-them.is-mo .gd3-xd-them-mo { display: none; }
.gd3-xd-them.is-mo .gd3-xd-them-dong { display: inline; }
.gd3-xd-o { display: flex; align-items: center; gap: 8px; padding: 5px 0; color: #111; text-decoration: none; font-size: 13px; line-height: 1.35; }
.gd3-xd-o:hover { color: #d70018; text-decoration: none; }
.gd3-xd-o img { flex: 0 0 28px; width: 28px; height: 28px; object-fit: contain; border: 1px solid #eee; border-radius: 4px; background: #fff; }
.gd3-xd-o span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gd3-xd-khong { margin: 0; padding: 4px 12px 10px; font-size: 12.5px; color: #b00; }
.gd3-xd-luuy { margin: 0; padding: 8px 12px 10px; border-top: 1px solid #eef4ee; font-size: 12px; line-height: 1.5; color: #777; }
@media (max-width: 767.5px) {
	.gd3-detail-buy.gd3-buy-v2 { gap: 8px; }
	.gd3-buy-v2 .gd3-buy-hang button { font-size: 14px; padding: 7px 8px; gap: 6px; }
	.gd3-buy-v2 .gd3-btn-buynow { font-size: 15px; }
	/* Hai nut hang duoi bi hep -> bo dong chu phu cho gon. Rieng "Mua ngay"
	   (va nut bao gia khi het hang) chiem het hang nen van du cho, giu lai. */
	.gd3-buy-v2 .gd3-btn-cart small,
	.gd3-buy-v2 .gd3-btn-tragop small { display: none; }
	.gd3-buy-v2 .gd3-btn-buynow small,
	.gd3-buy-v2 .gd3-btn-dhn small { display: block; }
	/* ...tru khi "Mua ngay" dang chia doi hang voi "Them vao gio": luc do
	   no chi rong ~160px, nhet them dong chu phu vao la vo hang. */
	.gd3-buy-v2.gd3-buy-2nut .gd3-btn-buynow small { display: none; }
	.gd3-buy-v2.gd3-buy-2nut .gd3-btn-buynow span { align-items: center; text-align: center; }
	.gd3-buy-v2 .gd3-btn-cart span,
	.gd3-buy-v2 .gd3-btn-tragop span { align-items: center; text-align: center; }
	.gd3-detail-tuvan { font-size: 13px; }
}

/* ===== Video san pham - panel toi + dai video 1 hang (05/09/2026) =====
   Khung phat + dong ten/so thu tu + dai .gd3-yt-chon cuon ngang (scroll-snap,
   an thanh cuon) voi 2 nut tron vang Truoc/Sau de len 2 mep; KHONG tran xuong
   hang. Lop .gd3-yt-chon goc o video.css (nen sang) duoc ghi de cho nen toi. */
.gd3-sp-vd { background: #121212; border-radius: 14px; padding: 12px; }
.gd3-sp-vd .gd3-yt { border-radius: 10px; overflow: hidden; }
.gd3-sp-vd-hang { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 12px 4px 10px; }
.gd3-sp-vd-ten { color: #fff; font-weight: 700; font-size: 15px; line-height: 1.35; text-decoration: none; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
a.gd3-sp-vd-ten:hover { color: #ffc600; text-decoration: none; }
.gd3-sp-vd-dem { flex: none; color: #111; background: #ffc600; font-size: 12px; font-weight: 700; padding: 3px 10px; border-radius: 999px; }
.gd3-sp-vd-boc { position: relative; }
.gd3-sp-vd-dai { display: flex; gap: 10px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x proximity; scrollbar-width: none; -ms-overflow-style: none; padding: 2px; }
.gd3-sp-vd-dai::-webkit-scrollbar { display: none; }
.gd3-sp-vd-dai .gd3-yt-chon { flex: 0 0 calc((100% - 30px) / 4); scroll-snap-align: start; display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 0; margin: 0; background: #1e1e1e; border: 2px solid transparent; border-radius: 10px; overflow: hidden; color: #cfcfcf; text-decoration: none; transition: border-color .15s, transform .15s; }
.gd3-sp-vd-dai .gd3-yt-chon:hover { background: #262626; color: #fff; transform: translateY(-2px); }
.gd3-sp-vd-dai .gd3-yt-chon.is-active { border-color: #ffc600; background: #262626; color: #fff; }
.gd3-sp-vd-dai .gd3-yt-chon-anh { position: relative; flex: none; width: 100%; height: 0; padding-top: 56.25%; border-radius: 0; background: #000; }
.gd3-sp-vd-dai .gd3-yt-chon-anh img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
.gd3-sp-vd-dai .gd3-yt-chon-anh i { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 32px; height: 32px; border-radius: 50%; background: rgba(0,0,0,.6); color: #ffc600; font-size: 12px; display: flex; align-items: center; justify-content: center; transition: background .15s; }
.gd3-sp-vd-dai .gd3-yt-chon.is-active .gd3-yt-chon-anh i, .gd3-sp-vd-dai .gd3-yt-chon:hover .gd3-yt-chon-anh i { background: #ffc600; color: #111; }
.gd3-sp-vd-so { position: absolute; left: 6px; top: 6px; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 6px; background: rgba(0,0,0,.65); color: #fff; font-size: 11px; font-weight: 700; line-height: 20px; text-align: center; }
.gd3-sp-vd-dai .gd3-yt-chon-ten { padding: 7px 8px 9px; font-size: 12px; line-height: 1.35; font-weight: 600; color: inherit; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; min-height: calc(12px * 1.35 * 2 + 16px); }
.gd3-sp-vd-nav { position: absolute; top: 50%; z-index: 2; width: 38px; height: 38px; margin-top: -19px; border: 0; border-radius: 50%; background: #ffc600; color: #111; font-size: 14px; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 4px 14px rgba(0,0,0,.45); transition: transform .15s, background .15s; }
.gd3-sp-vd-nav:hover { background: #fff; transform: scale(1.06); }
.gd3-sp-vd-truoc { left: -10px; }
.gd3-sp-vd-sau { right: -10px; }
.gd3-sp-vd-nav.is-hidden { display: none; }
@media (max-width: 991px) { .gd3-sp-vd-dai .gd3-yt-chon { flex-basis: calc((100% - 20px) / 3); } }
@media (max-width: 767px) {
	.gd3-sp-vd { padding: 8px; border-radius: 12px; }
	.gd3-sp-vd-hang { margin: 10px 2px 8px; }
	.gd3-sp-vd-ten { font-size: 14px; }
	/* Dien thoai: o nho lai (3 o + 1 phan o thu 4 lo ra de goi y vuot), chu 11px 2 dong. */
	.gd3-sp-vd-dai { gap: 6px; }
	.gd3-sp-vd-dai .gd3-yt-chon { flex-basis: 30%; border-width: 1.5px; border-radius: 8px; }
	.gd3-sp-vd-dai .gd3-yt-chon-ten { font-size: 11px; padding: 5px 6px 7px; min-height: calc(11px * 1.35 * 2 + 12px); }
	.gd3-sp-vd-dai .gd3-yt-chon-anh i { width: 24px; height: 24px; font-size: 10px; }
	.gd3-sp-vd-so { min-width: 16px; height: 16px; line-height: 16px; font-size: 10px; left: 4px; top: 4px; padding: 0 4px; }
	.gd3-sp-vd-nav { width: 32px; height: 32px; margin-top: -16px; font-size: 12px; }
	.gd3-sp-vd-truoc { left: -4px; }
	.gd3-sp-vd-sau { right: -4px; }
}

/* ===== Cua hang gan ban - dinh vi + sap theo khoang cach (05/09/2026, ban 2 "dep chuyen nghiep") =====
   Moi cua hang la 1 the: o tron icon cua hang + so thu tu, tinh (chu nho hoa),
   ten, dia chi, dien thoai; sau khi dinh vi: badge km ben phai, the #1 vien
   vang + nhan "Gan nhat", hang nut Goi / Chi duong. */
.gd3-gb .gd3-tcp-tieude { display: flex; align-items: center; gap: 8px; }
.gd3-gb-dem { margin-left: auto; font-size: 11px; font-weight: 600; color: #777; background: #f1f1f1; padding: 2px 9px; border-radius: 999px; white-space: nowrap; }
.gd3-gb-nut { position: relative; display: flex; align-items: center; gap: 12px; width: 100%; margin: 0 0 12px; padding: 11px 14px; border: 0; border-radius: 12px; background: linear-gradient(120deg, #111 0%, #2a2a2a 100%); color: #fff; text-align: left; cursor: pointer; box-shadow: 0 6px 18px rgba(0,0,0,.18); transition: transform .15s, box-shadow .15s; overflow: hidden; }
.gd3-gb-nut::before { content: ''; position: absolute; right: -30px; top: -30px; width: 110px; height: 110px; border-radius: 50%; background: radial-gradient(circle, rgba(255,198,0,.35), transparent 70%); }
.gd3-gb-nut:hover { transform: translateY(-1px); box-shadow: 0 10px 24px rgba(0,0,0,.25); }
.gd3-gb-nut:disabled, .gd3-gb-nut.is-cho { cursor: default; transform: none; }
.gd3-gb-nut-icon { flex: none; width: 40px; height: 40px; border-radius: 50%; background: #ffc600; color: #111; display: flex; align-items: center; justify-content: center; font-size: 17px; box-shadow: 0 0 0 4px rgba(255,198,0,.2); }
.gd3-gb-nut.is-cho .gd3-gb-nut-icon i { animation: gd3-gb-xoay 1.2s linear infinite; }
@keyframes gd3-gb-xoay { to { transform: rotate(360deg); } }
.gd3-gb-nut-chu { display: flex; flex-direction: column; line-height: 1.3; flex: 1; min-width: 0; }
.gd3-gb-nut-chu b { font-size: 14px; color: #fff; }
.gd3-gb-nut-chu small { font-size: 11px; color: #cfcfcf; }
.gd3-gb-nut-mui { flex: none; color: #ffc600; font-size: 13px; }
.gd3-gb-tt { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 7px; margin: 0 0 10px; padding: 8px 11px; border-radius: 10px; font-size: 12px; line-height: 1.45; background: #f5f5f5; color: #444; border-left: 3px solid #bbb; }
.gd3-gb-tt > i { margin-top: 2px; }
.gd3-gb-tt.is-ok { background: #ecf8ef; color: #1b5e20; border-left-color: #2e7d32; }
.gd3-gb-tt.is-ok b { color: #111; }
.gd3-gb-tt.is-loi { background: #fdecec; color: #8a1c1c; border-left-color: #d70018; }
.gd3-gb-tt.is-cho { background: #fff8dc; color: #6b5300; border-left-color: #ffc600; }
.gd3-gb-tt .gd3-gb-tt-nut { margin-left: auto; display: inline-flex; gap: 5px; flex: none; }
.gd3-gb-tt .gd3-gb-lai, .gd3-gb-tt .gd3-gb-bo { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 600; text-decoration: none; white-space: nowrap; border: 1px solid rgba(0,0,0,.12); background: #fff; color: #1b5e20; }
.gd3-gb-tt .gd3-gb-bo { color: #8a1c1c; }
.gd3-gb-tt .gd3-gb-lai:hover, .gd3-gb-tt .gd3-gb-bo:hover { border-color: currentColor; text-decoration: none; }
.gd3-gb-ds { display: flex; flex-direction: column; gap: 8px; }
.gd3-gb-ds [hidden] { display: none !important; }
.gd3-gb-ds .gd3-gb-o { position: relative; border: 1px solid #ececec; border-radius: 12px; background: #fff; padding: 0; transition: box-shadow .15s, border-color .15s; }
.gd3-gb-ds .gd3-gb-o:hover { border-color: #ffc600; box-shadow: 0 4px 14px rgba(0,0,0,.06); }
.gd3-gb-ds .gd3-gb-lk { display: flex; align-items: flex-start; gap: 10px; padding: 10px 10px 10px; color: #222; text-decoration: none; }
.gd3-gb-ds .gd3-gb-lk:hover { text-decoration: none; }
.gd3-gb-ds .gd3-gb-lk:hover b { color: #b58600; }
.gd3-gb-ds .gd3-gb-stt { position: relative; flex: none; width: 38px; height: 38px; border-radius: 10px; background: #f3f3f3; color: #444; display: flex; align-items: center; justify-content: center; font-size: 15px; }
.gd3-gb-ds .gd3-gb-stt em { position: absolute; right: -5px; bottom: -5px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 999px; background: #111; color: #fff; font-size: 10px; font-style: normal; font-weight: 700; line-height: 17px; text-align: center; border: 2px solid #fff; }
.gd3-gb-ds .gd3-gb-chu { flex: 1; min-width: 0; }
.gd3-gb-ds .gd3-gb-tinh { display: flex; align-items: center; gap: 6px; font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #999; line-height: 1.2; margin-bottom: 2px; }
.gd3-gb-ds .gd3-gb-nhan-gan { display: none; padding: 1px 7px; border-radius: 999px; background: #d70018; color: #fff; font-size: 9.5px; letter-spacing: .04em; }
.gd3-gb-ds .gd3-gb-chu b { display: block; font-size: 13px; line-height: 1.35; color: #111; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gd3-gb-ds .gd3-gb-dc { display: block; font-size: 12px; color: #6b6b6b; line-height: 1.4; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gd3-gb-ds .gd3-gb-chu { overflow: hidden; }   /* ten + dia chi 1 dong, dai qua cat ... (yeu cau 05/09) */
.gd3-gb-ds .gd3-gb-dc i { display: inline-block; width: 12px; margin-right: 4px; color: #bbb; font-size: 11px; }
.gd3-gb-ds .gd3-gb-km { flex: none; align-self: flex-start; padding: 3px 9px; border-radius: 999px; background: #111; color: #ffc600; font-size: 11.5px; font-weight: 700; white-space: nowrap; }
.gd3-gb-o.is-gan-nhat { border-color: #ffc600; background: linear-gradient(180deg, #fffbe6, #fff 70%); box-shadow: 0 6px 18px rgba(255,198,0,.25); }
.gd3-gb-o.is-gan-nhat .gd3-gb-stt { background: #ffc600; color: #111; }
.gd3-gb-o.is-gan-nhat .gd3-gb-stt em { background: #d70018; }
.gd3-gb-o.is-gan-nhat .gd3-gb-nhan-gan { display: inline-block; }
.gd3-gb-o.is-gan-nhat .gd3-gb-km { background: #d70018; color: #fff; }
.gd3-gb .gd3-home-vd-them { margin-top: 10px; }


/* ==========================================================================
   BANG THONG SO SINH TU FORM CHUAN O QUAN TRI                  06/09/2026
   ==========================================================================
   Tu 06/09/2026, man 1102 progid=16 co form nhap thong so co cau truc
   (lib/thong-so-mau.php) va sinh ra bang SACH: <table class="tgx-ts"> voi
   dong tieu de nhom <tr class="tgx-ts-nhom"><th colspan="2"> va dong du
   lieu <td class="spec-title">Nhan</td><td>Gia tri</td>.
   Cac bang CU (chep tay) mang theo ~1,5KB style noi dong nen chung tu giu
   dang cu - style noi dong luon thang CSS ngoai. Khoi nay chi to kieu cho
   bang moi, va vi the KHONG lam xo lech gi cua 3.700 san pham cu. */
.gd3-detail-content table.tgx-ts {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid #ececec;
	border-radius: 10px;
	overflow: hidden;
}

.gd3-detail-content table.tgx-ts tr.tgx-ts-nhom th {
	background: #111111;
	color: #ffc600;
	text-align: left;
	padding: 8px 14px;
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.gd3-detail-content table.tgx-ts td {
	padding: 9px 14px;
	border-bottom: 1px solid #f0f0f0;
	font-size: 14.5px;
	line-height: 1.5;
	vertical-align: top;
}

.gd3-detail-content table.tgx-ts td.spec-title {
	width: 38%;
	background: #fafafa;
	color: #555555;
	font-weight: 600;
}

.gd3-detail-content table.tgx-ts tr:last-child td {
	border-bottom: 0;
}

@media (max-width: 767.98px) {
	.gd3-detail-content table.tgx-ts td {
		padding: 8px 10px;
		font-size: 13.5px;
	}

	.gd3-detail-content table.tgx-ts td.spec-title {
		width: 42%;
	}
}