/* Trang danh muc san pham (inc/category.php) - trang dau tien dung khung
   <header class="header-fixed-top"> + <footer class="bg-gray"> lam khoi
   CO DINH cho cac trang xay dung sau nay (yeu cau 31/08/2026). File CSS
   rieng (tach khoi main.css) theo dung cach to chuc da co san cua theme
   (moi tinh nang lon 1 file rieng: swiper-custom.css, menu-mobile.css...).
   Dung lai dung 2 mau chu dao cua web (#ffd900 vang, #000 den - xem
   css/menu-mobile.css: icon menu mobi) de dong bo giao dien. */

/* ---- Breadcrumb ---- */
.section-category-breadcrumb {
	padding: 14px 0;
	background-color: #f7f7f7;
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.gd3-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 13px;
}
.gd3-breadcrumb li {
	display: flex;
	align-items: center;
	color: #777;
}
.gd3-breadcrumb li:not(:last-child)::after {
	content: "\f105";
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	margin: 0 8px;
	font-size: 11px;
	color: #bbb;
}
.gd3-breadcrumb li a {
	color: #555;
	text-decoration: none;
	transition: color 0.15s ease;
}
.gd3-breadcrumb li a:hover {
	color: #000;
}
.gd3-breadcrumb li.active {
	color: #000;
	font-weight: 700;
}

/* ---- Breadcrumb tren MAN HINH HEP (yeu cau 01/09/2026) ----
   Truoc: flex-wrap cho phep xuong dong, nen bai co duong dan 4 cap
   (Trang chu > Tin hay xe dien > Tin tuc xe dien > <ten bai>) bi vo lam
   2 dong, chiem 39px va day ca trang xuong.

   Do thuc te o be ngang 375px (khung con 336px):
     "Trang chu" 80px + "Tin hay xe dien" 109px + "Tin tuc xe dien" 108px
     = 297px, tuc RIENG BA CAP DAU da gan het cho. Chi cat rieng muc cuoi
     thi no con ~39px - khong doc duoc gi. Nen phai lam ba viec cung luc:

   1) "Trang chu" rut con BIEU TUONG NGOI NHA - tiet kiem ~64px ma ai cung
      hieu, day la quy uoc quen thuoc tren dien thoai.
   2) AN cac cap o giua, chi giu cap CHA TRUC TIEP. Duong dan day du van
      nam nguyen trong du lieu co cau truc BreadcrumbList nen Google khong
      mat thong tin gi; day thuan tuy la chuyen hien thi.
   3) Muc cuoi (ten trang dang mo) cat bang dau ba cham.

   Dau "..." truoc cap cha bao cho nguoi doc biet co cap bi an - chi hien
   khi that su co tu 4 cap tro len (dung :has). */
@media (max-width: 767px) {
	.gd3-breadcrumb {
		flex-wrap: nowrap;
		overflow: hidden;
	}
	.gd3-breadcrumb li { flex: 0 0 auto; min-width: 0; }
	.gd3-breadcrumb li:not(:last-child)::after { margin: 0 6px; }

	/* 1 - Trang chu thanh bieu tuong */
	.gd3-breadcrumb li:first-child a { font-size: 0; }
	.gd3-breadcrumb li:first-child a::before {
		content: "\f015";
		font-family: "Font Awesome 6 Free";
		font-weight: 900;
		font-size: 14px;
		line-height: 1;
	}

	/* 2 - An cac cap giua, giu lai cap cha truc tiep va muc dang mo */
	.gd3-breadcrumb li:not(:first-child):not(:nth-last-child(-n+2)) { display: none; }
	.gd3-breadcrumb:has(li:nth-child(4)) li:nth-last-child(2)::before {
		content: "\2026";
		margin-right: 6px;
		color: #bbb;
	}

	/* 3 - Muc cuoi an het cho con lai roi cat bang dau ba cham */
	.gd3-breadcrumb li:last-child {
		display: block;
		flex: 1 1 auto;
		min-width: 0;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}
}

/* ---- Tieu de danh muc ---- */
.section-category-products {
	padding: 24px 0 40px;
}
.gd3-category-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 18px;
}
.gd3-category-title {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	font-size: 24px;
	font-weight: 800;
	color: #000;
}
.gd3-category-title-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 42px;
	height: 42px;
	border-radius: 10px;
	background-color: #000000;
	color: #ffd900;
	font-size: 18px;
}
.gd3-category-count {
	font-size: 13px;
	color: #888;
	white-space: nowrap;
}

/* ---- Hang pill danh muc con - hien luon tren ca mobile (khac ban tren
   trang chu chi hien >=lg, vi o day pill la dieu huong CHINH cua trang,
   khong phai trang tri phu duoi luoi san pham co san). Cau truc HTML
   (.gd3-subcat-wrap/.gd3-subcat-scroll/.gd3-subcat-nav-group) dung lai y
   het menu-mobile.css + JS dieu khien cuon/nut prev-next da dung chung
   (js/home.js: $(".gd3-subcat-wrap").each(...)), khong can code rieng. */
.section-category-products .gd3-subcat-wrap {
	max-width: 100%;
}

/* ---- Bo loc "Hang xe" / "Quang duong" + sap xep (yeu cau 31/08/2026,
   bo cuc lai 2 lan theo yeu cau tiep theo cung ngay:
   (1) bo het label ("Hang xe"/"Quang duong"/"Sap xep") - chi con select,
       dung aria-label trong HTML de giu ten cho accessibility, KHONG
       hien ra man hinh;
   (2) tren PC "Xoa bo loc" nam NGAY CANH PHAI "Quang duong" (canh nhom
       loc, KHONG canh "Sap xep") - nen la 1 flex-item RIENG dat GIUA
       .gd3-filter-group-left va .gd3-filter-sort trong DOM; "Sap xep"
       tu day sang phia phai bang margin-left:auto (khong can bao
       .gd3-filter-right rieng nua). Tren mobile van GIU dung yeu cau
       truoc do (nut xoa cung hang voi "Sap xep", ben phai) - dao vi tri
       2 phan tu nay bang thuoc tinh CSS "order" (xem media query duoi). ---- */
.gd3-filter-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
	margin-bottom: 20px;
	padding: 14px 16px;
	background-color: #f7f7f7;
	border-radius: 10px;
}
.gd3-filter-group-left {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
}
.gd3-filter-select {
	height: 38px;
	padding: 0 10px;
	border-radius: 8px;
	border: 1px solid #ddd;
	background-color: #fff;
	font-size: 13px;
	color: #333;
	max-width: 230px;
	min-width: 170px;
}
.gd3-filter-select:focus {
	outline: none;
	border-color: #ffd900;
}
/* Dang co bo loc (hangsx/quangduong khac "Tat ca...") - to nen de phan
   biet voi cac o chua chon (yeu cau 31/08/2026). */
.gd3-filter-select-active {
	background-color: #fff8dc;
	border-color: #ffd900;
	color: #000;
	font-weight: 600;
}
/* "Sap xep" luon o ben phai cung cua thanh loc tren PC (yeu cau
   31/08/2026) - margin-left:auto day no (va moi the sau no, hien khong
   co gi) sang het co the sang phai, trong khi .gd3-filter-group-left +
   "Xoa bo loc" van giu nguyen vi tri ben trai theo dung thu tu DOM. */
.gd3-filter-sortgroup {
	margin-left: auto;
	display: flex;
	align-items: center;
	gap: 14px;
	min-width: 0;
}
/* O tim kiem "Hang xe" (yeu cau 31/08/2026: "tham khao 1102/template_list.php
   cai tim kiem o select tat ca danh muc, ap dung cho select hang xe" - dung
   LAI dung ky thuat cua fxEnhanceSelect()/fxStripAccents() ben trang quan
   tri (xem 1102/template_list.php: select #ddlParent), doi ten tien to
   fx- -> gd3-fxselect- cho khop quy uoc dat ten cua giao dien 3, thay vi tu
   viet 1 kieu combobox rieng khac kien truc. <select> that (#gd3FilterHangsx)
   duoc giu nguyen, dua ra khoi man hinh bang position:absolute;left:-9999px
   (giong het cach admin lam - KHONG dung display:none) de lam "nguon du
   lieu" + noi luu gia tri dang chon; JS (gd3EnhanceSelect() - xem script
   cuoi inc/category.php) tu dong boc no vao 1 span.gd3-fxselect + sinh nut
   "trigger" hien ten dang chon + panel tha xuong co o tim kiem (khong dau
   cung ra) va danh sach o tuy chon - y het luong hoat dong cua fx-select
   ben trang quan tri, chi khac mau sac/kich thuoc cho khop giao dien cong
   khai (font 13px/cao 38px giong cac o loc khac, thay vi 12px/30px cua
   khung quan tri) va hanh dong khi chon (goi gd3ApplyCategoryFilter() de
   chuyen trang, thay vi document.adminForm.submit()). */
.gd3-fxselect {
	position: relative;
	display: inline-block;
	max-width: 230px;
	min-width: 170px;
	vertical-align: middle;
}
.gd3-fxselect select {
	position: absolute;
	left: -9999px;
}
.gd3-fxselect-trigger {
	width: 100%;
	height: 38px;
	box-sizing: border-box;
	display: block;
	text-align: left;
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 8px;
	padding: 0 26px 0 10px;
	cursor: pointer;
	position: relative;
	color: #333;
	font-size: 13px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.gd3-fxselect-trigger:focus {
	outline: none;
	border-color: #ffd900;
}
.gd3-fxselect-caret {
	position: absolute;
	right: 10px;
	top: 50%;
	margin-top: -5px;
	font-size: 11px;
	color: #999;
}
/* Dang co bo loc (khac "Tat ca hang") - to nen de phan biet, dong bo mau
   voi .gd3-filter-select-active cua cac o select thuong khac. */
.gd3-fxselect-trigger-active {
	background-color: #fff8dc;
	border-color: #ffd900;
	color: #000;
	font-weight: 600;
}
.gd3-fxselect.gd3-fxselect-open .gd3-fxselect-trigger {
	border-color: #ffd900;
	box-shadow: 0 0 0 2px rgba(255, 217, 0, 0.25);
}
.gd3-fxselect-panel {
	display: none;
	position: absolute;
	top: calc(100% + 4px);
	left: 0;
	z-index: 20;
	min-width: 230px;
	max-width: 320px;
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 8px;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12);
}
.gd3-fxselect.gd3-fxselect-open .gd3-fxselect-panel {
	display: block;
}
.gd3-fxselect-search-wrap {
	position: relative;
	padding: 6px;
	border-bottom: 1px solid #eee;
}
.gd3-fxselect-search-wrap i {
	position: absolute;
	left: 15px;
	top: 50%;
	margin-top: -6px;
	color: #999;
	font-size: 11px;
}
.gd3-fxselect-search {
	width: 100%;
	box-sizing: border-box;
	padding: 5px 8px 5px 24px;
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: 13px;
}
.gd3-fxselect-search:focus {
	outline: none;
	border-color: #ffd900;
}
.gd3-fxselect-options {
	max-height: 260px;
	overflow-y: auto;
	padding: 4px 0;
}
.gd3-fxselect-option {
	padding: 8px 12px;
	font-size: 13px;
	color: #333;
	cursor: pointer;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.gd3-fxselect-option:hover {
	background-color: #fff4cc;
}
.gd3-fxselect-selected {
	background-color: #ffd900;
	color: #000;
	font-weight: 600;
}
.gd3-fxselect-empty {
	padding: 10px;
	color: #999;
	font-size: 13px;
	text-align: center;
}
.gd3-filter-clear {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 38px;
	padding: 0 14px;
	border-radius: 8px;
	background-color: #000000;
	color: #ffd900;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}
.gd3-filter-clear:hover {
	opacity: 0.85;
	color: #ffd900;
}
.gd3-category-empty .gd3-filter-clear {
	margin-top: 4px;
}

/* ---- Nut doi KIEU TRINH BAY: luoi / danh sach (yeu cau 01/09/2026) ----
   Dat ben phai o "Sap xep" (xem inc/category.php). Trong khung 38px cao
   bang moi o loc khac de ca thanh loc thang hang.

   KHONG co lop "is-active" nao do JS gan: kieu dang xem duoc suy ra tu lop
   `gd3-view-list` tren the <html> (do doan script dau thanh loc gan san
   theo localStorage, TRUOC khi trang ve). Nho vay nut sang dung tu khung
   hinh dau tien, khong nhay mau sau khi tai xong. */
.gd3-filter-viewmode {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	height: 38px;
	padding: 3px;
	box-sizing: border-box;
	border: 1px solid #ddd;
	border-radius: 8px;
	background-color: #fff;
	flex: 0 0 auto;
}
.gd3-viewmode-btn {
	width: 34px;
	height: 30px;
	padding: 0;
	border: 0;
	border-radius: 6px;
	background-color: transparent;
	color: #999;
	font-size: 14px;
	line-height: 1;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background-color 0.2s, color 0.2s;
}
.gd3-viewmode-btn:hover {
	background-color: #f2f2f2;
	color: #000;
}
.gd3-viewmode-btn:focus {
	outline: none;
}
/* Mac dinh (khong co lop tren <html>) = kieu LUOI dang bat. */
.gd3-viewmode-btn.gd3-viewmode-luoi {
	background-color: #ffd900;
	color: #000;
}
/* Khach da chon kieu khac -> tra nut "luoi" ve trang thai thuong va to
   nut dang duoc chon. */
.gd3-view-list .gd3-viewmode-btn.gd3-viewmode-luoi,
.gd3-view-bang .gd3-viewmode-btn.gd3-viewmode-luoi {
	background-color: transparent;
	color: #999;
}
.gd3-view-list .gd3-viewmode-btn.gd3-viewmode-danhsach,
.gd3-view-bang .gd3-viewmode-btn.gd3-viewmode-bang {
	background-color: #ffd900;
	color: #000;
}
.gd3-view-list .gd3-viewmode-btn.gd3-viewmode-luoi:hover,
.gd3-view-bang .gd3-viewmode-btn.gd3-viewmode-luoi:hover {
	background-color: #f2f2f2;
	color: #000;
}

@media (max-width: 575.98px) {
	/* Mobile: 4 o loc chia LUOI 2 COT DEU NHAU (yeu cau 31/08/2026: "o
	   che do mobi danh muc san pham 4 cai bo loc chua deu nhau").

	   Truoc day thanh loc la flexbox voi "flex: 1 1 0" - ve ly thuyet chia
	   deu, nhung THUC TE do tren /xe-may-dien-aima/ ra 148px / 170px o
	   hang tren va 162px / 156px o hang duoi. Ly do: the <select> co kich
	   thuoc toi thieu rieng bang do rong cua dong <option> DAI NHAT ("Tat
	   ca quang duong"), va Chrome KHONG cho no co lai duoi muc do du da
	   dat min-width:0 - o "Quang duong" vi vay chiem 170px, phan con lai
	   moi den luot o "Hang xe".

	   Doi sang CSS Grid voi cot "minmax(0, 1fr)": kich thuoc o do LUOI
	   quyet dinh chu khong phai noi dung ben trong, nen 4 o rong bang
	   nhau tuyet doi. .gd3-filter-group-left dung "display: contents" de
	   2 o ben trong no (Hang xe / Quang duong) tro thanh o luoi truc tiep
	   thay vi 1 khoi long nhau lech nhip.

	   Chu nho lai 12px + le trong hep hon 1 chut de dong "Tat ca quang
	   duong" van nam gon trong o hep hon truoc. */
	.gd3-filter-bar {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		align-items: center;
		gap: 10px;
		padding: 12px;
	}
	.gd3-filter-group-left {
		display: contents;
	}
	.gd3-filter-group-left .gd3-filter-select,
	.gd3-filter-group-left .gd3-fxselect,
	.gd3-filter-price,
	.gd3-filter-sortgroup {
		width: 100%;
		min-width: 0;
		max-width: none;
	}
	/* O luoi thu 4 chua CA "Sap xep" LAN 2 nut doi kieu trinh bay (yeu cau
	   01/09/2026). 2 nut giu nguyen be ngang that cua chung, select an het
	   phan con lai - nen select ngan hon truoc dung nhu yeu cau, va khong
	   phai doan truoc be ngang cua no theo tung co man hinh. */
	.gd3-filter-sortgroup {
		display: flex;
		align-items: center;
		gap: 8px;
		margin-left: 0;
	}
	.gd3-filter-sortgroup .gd3-filter-sort {
		flex: 1 1 auto;
		min-width: 0;
		max-width: none;
		/* O nay phai chia cho cho 2 nut nen chi con ~89px, trong khi dong dai
		   nhat ("Giá giảm dần") can 70px chu. Mui ten mac dinh cua the
		   <select> tren Chrome chiem toi ~18px va VE DE LEN chu khi chat -
		   nen o RIENG o nay tat mui ten mac dinh (appearance: none) va tu ve
		   1 mui ten 8px, doi lai du cho hien het chu. Chi ap dung o man hep;
		   tren PC o nay van la <select> nguyen ban. */
		padding: 0 12px 0 4px;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath fill='%23888' d='M0 0h10L5 6z'/%3E%3C/svg%3E");
		background-repeat: no-repeat;
		background-position: right 3px center;
		background-size: 7px 5px;
	}
	/* 2 nut bo khung vien + le trong o man hep de nhuong lai ~16px cho o
	   "Sap xep" ben canh - van du to de bam (30x34) va van thay ro nut nao
	   dang bat nho o nen vang. */
	.gd3-filter-sortgroup .gd3-filter-viewmode {
		flex: 0 0 auto;
		border: 0;
		background-color: transparent;
		padding: 0;
		gap: 2px;
	}
	.gd3-filter-sortgroup .gd3-viewmode-btn {
		width: 26px;
		height: 34px;
	}
	.gd3-filter-select {
		padding: 0 8px;
		font-size: 12px;
	}
	.gd3-fxselect-trigger {
		padding: 0 22px 0 8px;
		font-size: 12px;
	}
	.gd3-fxselect-caret {
		right: 8px;
	}
	/* Panel tha xuong cua o "Hang xe": o luoi chi con 159px - qua hep cho
	   1 danh sach hang xe co o tim kiem, nen panel duoc phep RONG HON o
	   cua no (giu min-width 230px), chi chan lai o be ngang man hinh.
	   Panel tran qua mep phai thi gd3EnhanceSelect() (script cuoi
	   inc/category.php) da tu lat sang neo phai san. */
	.gd3-fxselect-panel {
		left: 0;
		right: auto;
		min-width: 230px;
		max-width: calc(100vw - 24px);
	}
	/* Thu tu tren luoi: hang 1 = Hang xe + Quang duong (order 0, theo DOM),
	   hang 2 = Muc gia + Sap xep. "Xoa bo loc" (neu co) xuong hang rieng va
	   keo rong het 2 cot - de bam hon nut nho nam lech 1 ben. */
	.gd3-filter-price {
		order: 0;
	}
	.gd3-filter-sortgroup {
		order: 1;
	}
	.gd3-filter-clear {
		order: 2;
		grid-column: 1 / -1;
		justify-content: center;
	}
}

/* ---- Luoi san pham - dung lai .col-product-item/.product-item co san
   (css/main.css), khong can dinh nghia them. ---- */

/* ---- KIEU DANH SACH (yeu cau 01/09/2026) ----
   Chi la 1 cach XEP LAI dung nhung the san pham cu (gd3_product_card()):
   PHP khong sinh markup khac, khong co truy van nao them - doi kieu xem
   thuan tuy la doi CSS, nen bam la doi ngay, khong tai lai trang.

   Ap dung cho MOI .gd3-product-grid tren trang: ca luoi chinh lan khoi
   "Xem them san pham cung danh muc" cua danh muc cha - de 1 trang khong
   bi nua tren danh sach, nua duoi luoi. Rieng cac hang cuon ngang
   ("San pham vua xem") giu nguyen: chung von da la 1 hang cuon, khong
   phai luoi.

   !important o day la BAT BUOC: khoang cach cua the (.pt-3 .mb-3 .my-3
   .p-2 .mt-3) den tu lop tien ich Bootstrap, ma cac lop do deu khai bao
   !important san.

   Viet theo loi "mobile truoc": phan goc la ban cho man hep (1 san pham
   1 dong, anh nho), tu 992px (dung moc "lg" cua Bootstrap - cung moc ma
   kieu luoi doi tu 2 sang 4 cot) moi xep 2 SAN PHAM 1 DONG. */
.gd3-view-list .gd3-product-grid > .col-product-item {
	flex: 0 0 100%;
	max-width: 100%;
}
.gd3-view-list .gd3-product-grid .product-item {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 12px;
	/* KHONG dat height o day: de nguyen .product-item-mb (calc(100% - 16px)
	   trong main.css) lam viec, nho vay 2 the nam cung 1 dong luon cao bang
	   nhau du mo ta dai ngan khac nhau. */
	padding: 10px !important;
	position: relative;
	border: 1px solid #eee;
}
.gd3-view-list .gd3-product-grid .product-item:hover {
	border-color: #ffd900;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
}
/* Ruy bang "Tra gop %" von la the DAU TIEN trong the san pham; o kieu hang
   ngang no se thanh 1 cot rieng, nen cho no de len GOC TREN TRAI cua the. */
.gd3-view-list .gd3-product-grid .product-item .note-installment {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
}
.gd3-view-list .gd3-product-grid .gd3-card-imgwrap {
	flex: 0 0 118px;
	width: 118px;
	margin: 0 !important;
	border-radius: 6px;
	overflow: hidden;
}
/* Cot chu ben phai anh. Xep theo HANG + cho xuong dong (wrap) chu khong
   phai 1 cot doc thuan tuy: ten va mo ta duoc ep rong het hang (100%) nen
   moi cai chiem tron 1 dong, con GIA va nhan "Sale cuc dinh" - 2 thu deu
   ngan - tu dong nam CHUNG hang cuoi.

   Ly do (yeu cau 01/09/2026: "o dang list cai Sale cuc dinh ko nen dung
   tren cai ten sp"): trong HTML cua the san pham, nhan sale nam TRUOC ten
   (o kieu luoi no dung dau the la dung), keo theo o kieu danh sach no
   chen len phia tren ten - vua day ten xuong vua khong lien quan gi den
   chu xung quanh. Dua no ve canh gia thi dung cho: giam gia thi phai doc
   cung voi con so.

   Doi cho bang thuoc tinh "order", KHONG dong vao HTML - de kieu luoi,
   trang chu va cac hang cuon ngang van giu nguyen thu tu cu. */
.gd3-view-list .gd3-product-grid .product-item > .p-2 {
	flex: 1 1 auto;
	min-width: 0;
	padding: 0 !important;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 10px;
}
.gd3-view-list .gd3-product-grid .product-item .product-item-name {
	order: 1;
	flex: 0 0 100%;
}
.gd3-view-list .gd3-product-grid .product-item .product-item-des {
	order: 2;
	flex: 0 0 100%;
}
/* The cuoi cung trong .p-2 la khoi GIA (the <div> khong co class trong
   gd3_product_card()). */
.gd3-view-list .gd3-product-grid .product-item > .p-2 > div:last-child {
	order: 3;
	flex: 0 0 auto;
}
.gd3-view-list .gd3-product-grid .product-item .sale {
	order: 4;
	flex: 0 0 auto;
}
/* Ten van gioi han 2 dong nhu moi cho khac (yeu cau 01/09/2026). Bo
   min-height 3em: o kieu luoi no de giu gia cua ca hang thang nhau, o kieu
   danh sach moi san pham 1 hang rieng nen giu lai chi tao khoang trong. */
.gd3-view-list .gd3-product-grid .product-item .product-item-name {
	margin-top: 0 !important;
	min-height: 0;
	font-size: 14px;
	font-weight: 600;
}
.gd3-view-list .gd3-product-grid .product-item .discount-price {
	font-size: 16px;
}
.gd3-view-list .gd3-product-grid .product-item .old-price {
	font-size: 12px;
	margin-left: 8px;
}

/* Mo ta ngan (cot meta_description) - yeu cau 01/09/2026: "kieu list nen
   goi Meta Description cua SP ra". CHI hien o kieu danh sach: kieu luoi
   the da hep, them 2 dong chu xam nua chi lam le mat gia.

   The <div> nay van duoc PHP in ra ngay ca khi dang xem kieu luoi (xem
   gd3_product_card()) - an bang CSS chu khong bo han - de bam doi kieu la
   thay ngay, khong phai tai lai trang. */
.product-item-des {
	display: none;
}
.gd3-view-list .gd3-product-grid .product-item .product-item-des {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 12.5px;
	line-height: 1.5;
	color: #777;
	font-weight: 400;
	overflow-wrap: break-word;
}
/* Ro chuot vao the thi ca the doi sang xanh (.product-item:hover o
   main.css) - giu mo ta o mau xam de no van la phan phu, khong tranh
   cho voi ten. */
.product-item:hover .product-item-des {
	color: #777;
}

@media (min-width: 992px) {
	/* PC: 2 SAN PHAM 1 DONG (yeu cau 01/09/2026). Truoc do moi dong keo
	   het be ngang mang hinh nen 2/3 ben phai bo trong; chia doi vua lap
	   day cho, vua van du rong cho anh 190px + ten + 2 dong mo ta. */
	.gd3-view-list .gd3-product-grid > .col-product-item {
		flex: 0 0 50%;
		max-width: 50%;
	}
	.gd3-view-list .gd3-product-grid .product-item {
		gap: 16px;
		padding: 12px !important;
	}
	.gd3-view-list .gd3-product-grid .gd3-card-imgwrap {
		flex: 0 0 190px;
		width: 190px;
	}
	.gd3-view-list .gd3-product-grid .product-item > .p-2 {
		gap: 7px 12px;
	}
	.gd3-view-list .gd3-product-grid .product-item .product-item-name {
		font-size: 16px;
	}
	.gd3-view-list .gd3-product-grid .product-item .discount-price {
		font-size: 18px;
	}
	.gd3-view-list .gd3-product-grid .product-item .old-price {
		font-size: 13px;
	}
}

/* ---- KIEU BANG THONG SO (yeu cau 01/09/2026) ----
   Khac 2 kieu tren: day la mot cai <table> RIENG do PHP in ra ngay canh
   luoi san pham (xem gd3_bang_thongso() trong inc/functions.php), khong
   phai xep lai chinh cac the san pham bang CSS. Ly do da ghi o dau ham
   do. O day CSS chi lo viec: dang xem kieu nao thi hien cai do.

   Vi CA HAI cung nam san trong trang nen bam doi kieu la thay ngay,
   khong tai lai trang - giong het 2 kieu con lai. */
.gd3-spec-wrap {
	display: none;
	margin-bottom: 20px;
}
.gd3-view-bang .gd3-spec-wrap {
	display: block;
}
.gd3-view-bang .gd3-product-grid {
	display: none;
}
/* Bang rong hon man hinh (nhat la tren dien thoai) thi cho CHINH NO cuon
   ngang trong khung cua no, khong de ca trang bi keo ngang. */
.gd3-spec-scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid #eee;
	border-radius: 8px;
	background: #fff;
}
.gd3-spec-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
	min-width: 640px;
}
.gd3-spec-table thead th {
	background-color: #f7f7f7;
	color: #333;
	font-weight: 600;
	font-size: 13px;
	text-align: left;
	padding: 10px 12px;
	border-bottom: 2px solid #ffd900;
	white-space: nowrap;
}
.gd3-spec-table tbody td {
	padding: 10px 12px;
	border-bottom: 1px solid #f0f0f0;
	vertical-align: middle;
}
.gd3-spec-table tbody tr:last-child td {
	border-bottom: 0;
}
.gd3-spec-table tbody tr:hover td {
	background-color: #fffbe6;
}
.gd3-spec-anh {
	width: 84px;
}
.gd3-spec-table td.gd3-spec-anh img {
	width: 72px;
	height: auto;
	display: block;
	border-radius: 4px;
}
.gd3-spec-ten a {
	color: #000;
	text-decoration: none;
	font-weight: 600;
	/* Ten dai thi cat con 2 dong, dong bo voi the san pham o 2 kieu kia. */
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	overflow-wrap: break-word;
}
.gd3-spec-ten a:hover {
	color: #4a90e2;
}
.gd3-spec-gia {
	white-space: nowrap;
}
.gd3-spec-table .gd3-spec-gia b {
	color: #ff0000;
	font-size: 15px;
}
.gd3-spec-table .gd3-spec-gia s {
	color: #bdbdbd;
	font-size: 12px;
}
/* O chua co du lieu: hangsx moi co o ~68% san pham, quang duong ~34% -
   de dau gach xam cho ro la "chua co", khong bo trong khien nguoi doc
   tuong bi loi. */
.gd3-spec-trong {
	color: #bbb;
}
/* Ten hang trong bang thong so noi sang trang thuong hieu (01/09/2026).
   Cot "San pham" ben canh da la link mau chu dao roi; cot nay to them mau
   nua se thanh 2 link canh tranh nhau trong cung 1 dong, nen chi gach chan
   nhat, doi mau khi ro chuot. */
.gd3-spec-hang a {
	color: inherit;
	text-decoration: none;
	border-bottom: 1px dashed #c9c9c9;
}
.gd3-spec-hang a:hover {
	color: #067647;
	border-bottom-color: #067647;
}
.gd3-spec-con {
	color: #1aa34a;
	font-size: 13px;
}
.gd3-spec-het {
	color: #d70018;
	font-size: 13px;
	font-weight: 600;
}
@media (max-width: 575.98px) {
	/* Man hep: bo 2 cot it quan trong nhat (Mau, Tinh trang), va ep 5 cot
	   con lai VUA DUNG be ngang man hinh.

	   Phai dung "table-layout: fixed" + be ngang theo phan tram: de bang tu
	   tinh thi cot "Quãng đường/lần sạc" (tieu de dai, khong xuong dong)
	   an het cho, day cot GIA - thu quan trong nhat - ra ngoai man, khach
	   phai cuon ngang moi thay. Voi fixed thi be ngang do CSS quyet dinh,
	   noi dung dai tu xuong dong hoac cat bot. Tong 5 cot = 100%. */
	.gd3-spec-an-mobi {
		display: none;
	}
	.gd3-spec-scroll {
		overflow-x: visible;
	}
	.gd3-spec-table {
		min-width: 0;
		font-size: 12.5px;
		table-layout: fixed;
	}
	.gd3-spec-table thead th {
		white-space: normal;
		font-size: 11px;
		line-height: 1.3;
	}
	.gd3-spec-table thead th,
	.gd3-spec-table tbody td {
		padding: 8px 5px;
	}
	/* Cot GIA duoc chia rong nhat trong 5 cot: chuoi "15,990,000đ" in dam
	   la thu dai nhat trong bang, hep hon la bi cat mat chu so. */
	.gd3-spec-anh { width: 13%; }
	.gd3-spec-ten { width: 29%; }
	.gd3-spec-hang { width: 15%; }
	.gd3-spec-qd { width: 18%; }
	.gd3-spec-gia { width: 25%; white-space: normal; }
	.gd3-spec-table td.gd3-spec-anh img {
		width: 100%;
		max-width: 48px;
	}
	.gd3-spec-table .gd3-spec-gia b {
		font-size: 12.5px;
	}
	.gd3-spec-table .gd3-spec-gia s {
		font-size: 11px;
	}
}

/* ---- TRANG KET QUA TIM KIEM (yeu cau 01/09/2026) ----
   Trang tim kiem dung lai gan het do hoa cua trang danh muc (tieu de,
   luoi san pham, phan trang, khoi "San pham vua xem"), o day chi them
   may thanh phan rieng cua no. */
/* Da BO o tim kiem rieng cua trang ket qua (yeu cau 01/09/2026: "bo o tim
   kiem trong nay di vi menu top co roi") - cac quy tac .gd3-search-form
   cung xoa theo, khong con the nao dung den. Luu y: o tim kiem tren thanh
   dau trang la #gd3-search-form (dinh danh, khac dau cham) va co bo kieu
   dang rieng trong css/main.css - khong lien quan den doan vua xoa. */
/* Bao "may da tu hieu tu khoa sang tu khac" (bang search_synonym). Khong
   noi ra thi khach thay ket qua khong dung chu minh go va tuong may tim
   sai - nen dong nay co mau nen rieng cho de thay. */
.gd3-search-thaythe {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	margin-bottom: 16px;
	padding: 10px 14px;
	border-radius: 10px;
	background-color: #fffbe6;
	border: 1px solid #ffe58f;
	color: #614700;
	font-size: 14px;
}
.gd3-search-thaythe i {
	color: #d48806;
}
.gd3-search-thaythe span {
	color: #8c6d1f;
	font-size: 13px;
}
.gd3-search-goiy {
	margin-top: 6px;
	color: #888;
	font-size: 14px;
}
.gd3-search-goiy a {
	color: #b58600;
	font-weight: 700;
}

/* ---- 3 tab ket qua tim kiem: San pham / Bai viet / Video (07/09/2026) ----
   Kieu "gach chan" chu khong phai vien hop: hang nay nam ngay duoi tieu de
   H1 va ngay tren luoi ket qua, ba cai hop co vien nua o giua se thanh ba
   tang khung long nhau. Duong ke ngang mong o duoi keo het chieu rong,
   tab dang mo dat len no mot vach vang day - mat bat duoc ngay dang o dau.

   Cuon ngang o man hep: ba tab + so co the qua 375px. overflow-x: auto +
   flex-shrink: 0 tren tung tab, va an thanh truot (nhu dai anh trang
   thuong hieu) vi 3 muc thi khong ai lac duong. */
.gd3-tim-tab {
	display: flex;
	gap: 4px;
	margin-bottom: 18px;
	border-bottom: 1px solid #e6e6e6;
	overflow-x: auto;
	scrollbar-width: none;
	-ms-overflow-style: none;
}
.gd3-tim-tab::-webkit-scrollbar { width: 0; height: 0; display: none; }

.gd3-tim-tab-o {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 10px 14px;
	/* Vach vang cua tab dang mo phai DE LEN duong ke chung o duoi, khong
	   phai nam duoi no - nen day xuong 1px. */
	margin-bottom: -1px;
	border-bottom: 3px solid transparent;
	background: none;
	color: #555555;
	font-size: 14.5px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	transition: color .15s ease, border-color .15s ease;
}
.gd3-tim-tab-o i { font-size: 14px; color: #999999; transition: color .15s ease; }

a.gd3-tim-tab-o:hover,
a.gd3-tim-tab-o:focus-visible { color: #111111; text-decoration: none; }
a.gd3-tim-tab-o:hover i,
a.gd3-tim-tab-o:focus-visible i { color: #d70018; }

.gd3-tim-tab-o.is-hien {
	color: #111111;
	font-weight: 800;
	border-bottom-color: #ffc600;
}
.gd3-tim-tab-o.is-hien i { color: #d70018; }

/* So ket qua: vien tron nho, khong to bang chu de no la thong tin phu. */
.gd3-tim-tab-so {
	display: inline-block;
	padding: 1px 7px;
	border-radius: 999px;
	background: #f0f0f0;
	color: #666666;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.55;
}
.gd3-tim-tab-o.is-hien .gd3-tim-tab-so { background: #111111; color: #ffc600; }

/* Tab khong co ket qua nao: ve bang <span> (khong bam duoc) - lam mo di
   de khach hieu ngay la khong con gi ben do, thay vi bam vao roi moi biet. */
.gd3-tim-tab-o.la-rong:not(.is-hien) { color: #bbbbbb; cursor: default; }
.gd3-tim-tab-o.la-rong:not(.is-hien) i { color: #d5d5d5; }
.gd3-tim-tab-o.la-rong:not(.is-hien) .gd3-tim-tab-so { background: #f7f7f7; color: #bbbbbb; }

/* Bao "trang da tu chuyen tab" (07/09/2026). Dung tong xanh chu khong
   phai vang: mau vang o trang nay da danh cho .gd3-search-thaythe ("may
   da hieu tu khoa sang tu khac") - hai dong bao khac chuyen ma cung mot
   mau nen thi mat luot qua tuong la mot. */
.gd3-tim-doi {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	margin: -4px 0 16px;
	padding: 10px 14px;
	border-radius: 10px;
	background-color: #f0f7ff;
	border: 1px solid #cfe3fb;
	color: #1d4d80;
	font-size: 14px;
	line-height: 1.5;
}
.gd3-tim-doi i { margin-top: 3px; color: #3b82c4; }
.gd3-tim-doi b { color: #123a63; }

@media (max-width: 575.98px) {
	.gd3-tim-doi { font-size: 13.5px; padding: 9px 12px; }
}

/* Dien thoai: BA TAB CHIA DEU BE RONG, bo bieu tuong.
   Do 07/09/2026 o 375px: giu nguyen kieu may tinh thi hang tab rong 393px
   trong khung 351px - tab "Video" bi cat mat mot goc. Ky thuat thi van cuon
   ngang duoc (khung co overflow-x rieng, than trang khong he tran), nhung
   mot tab bi cat trong nhu loi bo cuc chu khong nhu mot cai de vuot. Chia
   deu ba phan thi luon vua, va bo bieu tuong di - ba chu "San pham" /
   "Bai viet" / "Video" tu no da du ro. */
@media (max-width: 575.98px) {
	.gd3-tim-tab { gap: 0; margin-bottom: 14px; overflow-x: visible; }
	.gd3-tim-tab-o {
		flex: 1 1 0;
		min-width: 0;
		justify-content: center;
		padding: 9px 4px;
		font-size: 13.5px;
		gap: 6px;
	}
	.gd3-tim-tab-o i { display: none; }
	.gd3-tim-tab-so { font-size: 11px; padding: 1px 6px; }
}
.gd3-search-tran {
	margin-top: 14px;
	color: #888;
	font-size: 13px;
	font-style: italic;
	text-align: center;
}
/* ---- Trang thai rong (danh muc chua co san pham) ---- */
.gd3-category-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding: 60px 15px;
	text-align: center;
	color: #999;
}
.gd3-category-empty i {
	font-size: 40px;
	color: #ddd;
}
.gd3-category-empty p {
	margin: 0;
	font-size: 14px;
}

/* ---- Phan trang (lam thoang lai 31/08/2026: "xem lai do hoa phan
   trang o danh muc san pham nen cho thoang ra dep ca mobi + pc") ----

   Markup do gd3_render_cate_pagination() (inc/category_data.php) sinh ra,
   dung chung cho luoi chinh lan khoi "san pham danh muc cha".

   3 viec chinh so voi ban cu:
   1. Tach khoi luoi san pham bang 1 duong ke mo + nhieu khoang trang tren
      duoi, thay vi dinh sat vao hang san pham cuoi.
   2. Nut to hon va CACH NHAU bang "gap" that (38px sat nhau -> 44px cach
      8px tren PC), bo nen/vien cua o "..." de no khong bi nhin nham la 1
      nut bam duoc.
   3. Tren mobile an bot 2 so o ria (.gd3-page-far) de 5-6 nut con lai
      duoc to va de bam - nut ve trang 1 / trang cuoi van luon con nen
      khach khong mat phuong huong. */
.gd3-category-pagination {
	margin-top: 36px;
	padding-top: 28px;
	border-top: 1px solid #ececec;
}
/* Bootstrap .pagination von dung margin am + border chung giua cac nut
   (kieu "thanh lien khoi"). O day moi nut la 1 vien rieng nen dung "gap"
   de tao khoang ho that su, va cho phep xuong dong tren man hinh rat hep
   thay vi tran ngang. */
.gd3-category-pagination .pagination {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
}
.gd3-category-pagination .page-item {
	display: flex;
}
.gd3-category-pagination .page-link {
	min-width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 0 12px;
	border-radius: 12px;
	border: 1px solid #e6e6e6;
	background-color: #fff;
	color: #333;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	text-decoration: none;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}
.gd3-category-pagination .page-link:focus {
	outline: none;
	box-shadow: 0 0 0 3px rgba(255, 217, 0, 0.45);
}
/* Nut lui/toi: vuong vuc hon 1 chut va icon nho lai cho can voi chu so. */
.gd3-category-pagination .gd3-page-nav .page-link {
	padding: 0;
	color: #555;
	font-size: 13px;
}
/* Trang dang xem - dung dung cap mau chu dao den/vang, nhac them 1 chut
   bang bong do de noi han giua day nut trang. */
.gd3-category-pagination .page-item.active .page-link {
	background-color: #000000;
	border-color: #000000;
	color: #ffd900;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.22);
}
.gd3-category-pagination .page-item:not(.active):not(.disabled) .page-link:hover {
	background-color: #fff8dc;
	border-color: #ffd900;
	color: #000;
	transform: translateY(-2px);
}
/* Lui/toi khi het duong di: ve bang <span> (khong bam duoc), lam nhat han
   va bo hieu ung de khach khong co bam. */
.gd3-category-pagination .page-item.disabled .page-link {
	color: #ccc;
	background-color: #fafafa;
	border-color: #eee;
	box-shadow: none;
	cursor: default;
}
/* Dau "..." - chi la ky hieu ngat quang, bo han nen va vien de khong
   trong giong 1 nut bam duoc. */
.gd3-category-pagination .gd3-page-dots .page-link {
	min-width: 22px;
	padding: 0;
	border-color: transparent;
	background-color: transparent;
	color: #bbb;
	box-shadow: none;
	cursor: default;
}
@media (max-width: 575.98px) {
	.gd3-category-title {
		font-size: 19px;
	}
	.gd3-category-title-icon {
		width: 36px;
		height: 36px;
		font-size: 15px;
	}
	/* Mobile: AN 2 so o ria cua so 5 so (.gd3-page-far) - con lai
	   "truoc / dang xem / sau" + nut nhay ve trang 1 va trang cuoi. Nho
	   bot 2 nut ma cac nut con lai VAN to 40px (thay vi bi bop xuong 32px
	   nhu ban cu) va van du cho tren man hinh 360px. Dong "Trang X / Y"
	   ben duoi bu lai thong tin bi an. */
	.gd3-category-pagination {
		margin-top: 28px;
		padding-top: 22px;
	}
	.gd3-category-pagination .pagination {
		gap: 5px;
	}
	/* 38px + gap 5: truong hop day nut dai nhat (lui - 1 - ... - truoc -
	   dang xem - sau - ... - cuoi - toi) rong ~330px, con vua man hinh
	   hep nhat thuong gap (360px, container chua 12px le moi ben). Hep
	   hon nua thi flex-wrap cho xuong dong chu khong tran ngang. */
	.gd3-category-pagination .page-link {
		min-width: 38px;
		height: 38px;
		padding: 0 7px;
		border-radius: 11px;
		font-size: 13px;
	}
	.gd3-category-pagination .gd3-page-far {
		display: none;
	}
	.gd3-category-pagination .gd3-page-dots .page-link {
		min-width: 12px;
	}
}

/* ---- Khoi "San pham vua xem" (yeu cau 31/08/2026) ----
   Nam duoi luoi san pham cua danh muc, TREN khoi "Xem them san pham cung
   danh muc". Ban than hang cuon ngang + 2 nut dieu huong dung chung CSS
   voi khoi cung ten o trang chi tiet (css/detail.css: .gd3-hscroll-*,
   file do duoc nap o moi trang) - o day chi lo phan khung ngoai. */
.gd3-vuaxem-section {
	padding-top: 0;
	padding-bottom: 8px;
}
.gd3-vuaxem-section .gd3-category-head {
	margin-bottom: 14px;
}
/* Nho hon tieu de H1 cua danh muc: day la khoi phu tro, khong duoc canh
   tranh thi giac voi ten danh muc dang xem. */
.gd3-vuaxem-title {
	font-size: 20px;
}

@media (max-width: 575.98px) {
	.gd3-vuaxem-title {
		font-size: 17px;
	}
}

/* ---- Khoi "San pham khac cua danh muc cha" (yeu cau 31/08/2026) ----
   Hien duoi luoi chinh khi vao 1 danh muc con qua it san pham (xem
   inc/category_data.php: $gd3_parentBlockShow). Nen xam nhat + duong ke
   tren de tach bach voi san pham cua danh muc DANG xem - khach nhin la
   biet ngay day la phan goi y them, khong nham lan. Cac lop dung chung
   (.gd3-category-head/.gd3-category-title/.gd3-category-pagination) giu
   nguyen, o day chi bo sung phan rieng. */
.gd3-parent-cat-section {
	margin-top: 8px;
	padding-top: 26px;
	border-top: 1px solid #e8e8e8;
	background-color: #fbfbfb;
}
.gd3-parent-cat-headline {
	min-width: 0;
}
.gd3-parent-cat-lead {
	margin-bottom: 6px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: #999;
}
.gd3-parent-cat-title {
	font-size: 21px;
}
/* Ten danh muc cha la LINK sang chinh danh muc do - giu nguyen mau chu
   den nhu tieu de thuong, chi doi mau khi ren chuot de khong bien tieu
   de thanh mot dong link xanh la loi giua trang. */
.gd3-parent-cat-title a {
	color: #000;
	text-decoration: none;
	transition: color 0.15s ease;
}
.gd3-parent-cat-title a:hover {
	color: #c9a800;
}
/* Neo #sp-danh-muc-cha: header dung position:sticky nen khi bam phan
   trang cua khoi nay, trinh duyet cuon dung mep tren cua section va bi
   header che mat tieu de. Chua san 1 khoang bang chieu cao header. */
.gd3-parent-cat-section {
	scroll-margin-top: 90px;
}

@media (max-width: 575.98px) {
	.gd3-parent-cat-title {
		font-size: 18px;
	}
	.gd3-parent-cat-section {
		scroll-margin-top: 70px;
	}
}

/* Man hinh sieu hep (<375px - iPhone SE doi dau, vai may Android cu):
   giau not dau "..." di. Con lai 7 nut (lui - 1 - truoc - dang xem - sau
   - cuoi - toi) rong ~292px, vua khit 296px long trong -> phan trang van
   gon 1 hang thay vi vo lam 2 dong nhu khi con dau "...". Thong tin ngat
   quang da co dong "Trang X / Y" ben duoi lo. */
@media (max-width: 374.98px) {
	.gd3-category-pagination .gd3-page-dots {
		display: none;
	}
	.gd3-category-pagination .pagination {
		gap: 4px;
	}
	.gd3-category-pagination .page-link {
		min-width: 37px;
		padding: 0 5px;
	}
}

/* ==========================================================================
   TRANG THUONG HIEU (yeu cau 01/09/2026) - /thuong-hieu/ va
   /thuong-hieu/<slug>/. Dung lai gan het do hoa cua trang danh muc (tieu
   de, luoi san pham, phan trang, hang danh muc cuon ngang), o day chi them
   may thanh phan rieng.
   ========================================================================== */

/* ---- Dau trang cua 1 hang: logo + ten + so xe ---- */
.gd3-th-dau {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-bottom: 16px;
	padding-bottom: 14px;
	border-bottom: 1px solid #eee;
}

.gd3-th-logo {
	flex: 0 0 auto;
	width: 96px;
	height: 96px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 8px;
	border: 1px solid #eee;
	border-radius: 10px;
	background: #fff;
}

.gd3-th-logo img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

.gd3-th-dau-chu {
	min-width: 0;
}

.gd3-th-ten {
	margin: 0 0 4px;
}

.gd3-th-mota {
	margin-bottom: 16px;
	color: #555;
	font-size: 14px;
	line-height: 1.6;
}

.gd3-th-mota img {
	max-width: 100%;
	height: auto;
}

.gd3-th-quaylai {
	margin-top: 18px;
	text-align: center;
}

.gd3-th-quaylai a {
	display: inline-block;
	padding: 8px 18px;
	border: 1px solid #e2e2e2;
	border-radius: 20px;
	color: #333;
	font-size: 14px;
	text-decoration: none;
}

.gd3-th-quaylai a:hover {
	background: #ffd900;
	border-color: #ffd900;
	color: #141414;
	text-decoration: none;
}

/* ---- Trang chi muc: luoi cac hang ---- */
.gd3-th-o {
	display: block;
	margin-bottom: 16px;
	padding: 12px 8px;
	border: 1px solid #eee;
	border-radius: 10px;
	background: #fff;
	text-align: center;
	text-decoration: none;
	color: #333;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.gd3-th-o:hover {
	border-color: #ffd900;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
	text-decoration: none;
	color: #333;
}

.gd3-th-o-anh {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 52px;
	margin-bottom: 8px;
}

.gd3-th-o-anh img {
	max-width: 100%;
	max-height: 52px;
	object-fit: contain;
}

/* 170/249 hang chua co logo - lay chu cai dau lam bieu tuong tam de o
   khong bi trong hoac cao thap khong deu. */
.gd3-th-o-chu {
	font-size: 26px;
	font-weight: 700;
	color: #bbb;
	text-transform: uppercase;
}

.gd3-th-o-ten {
	display: block;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.35;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.gd3-th-o-so {
	display: block;
	margin-top: 2px;
	font-size: 12px;
	color: #999;
}

@media (max-width: 575.98px) {
	.gd3-th-logo {
		width: 68px;
		height: 68px;
	}
	.gd3-th-o-anh {
		height: 40px;
	}
	.gd3-th-o-anh img {
		max-height: 40px;
	}
}

/* ---- O loc tai cho o trang danh sach thuong hieu (yeu cau 01/09/2026) ----
   Loc bang JS ngay tren trang, khong goi may chu - xem ghi chu trong
   inc/brand.php. */
.gd3-th-loc {
	position: relative;
	margin-bottom: 6px;
}

/* Chan 420px CHI TU 768px tro len (yeu cau 01/09/2026: "tren mobi o tim do
   phai hien full chu nhi").

   Truoc do chan 420px o moi kich thuoc. Duoi 460px thi khong thay gi (khung
   con hep hon 420 nen o tim van chiem het), nhung tu khoang 500px den 767px
   - dung khoang dien thoai nam ngang va may tinh bang - o tim dung lai o
   420px trong khi luoi hang keo dai het chieu ngang: do duoc o kho 576px la
   thua 126px trong ben phai, kho 700px thua 250px. Nhin nhu o tim bi cat cut
   so voi phan con lai cua trang.

   Van giu chan o desktop: khung rong 1200px ma keo o tim dai 1170px thi mot
   o chi go vai chu lai to nhat trang. */
@media (min-width: 768px) {
	.gd3-th-loc {
		max-width: 420px;
	}
}

.gd3-th-loc > i {
	position: absolute;
	left: 14px;
	top: 50%;
	margin-top: -7px;
	color: #999;
	font-size: 14px;
	pointer-events: none;
}

.gd3-th-loc input {
	width: 100%;
	height: 44px;
	padding: 0 40px 0 38px;
	border: 1px solid #ddd;
	border-radius: 10px;
	background-color: #fff;
	color: #333;
	font-size: 15px;
}

.gd3-th-loc input:focus {
	outline: none;
	border-color: #ffd900;
	box-shadow: 0 0 0 3px rgba(255, 217, 0, 0.35);
}

/* Nut X cua rieng minh: nut xoa san co cua <input type="search"> moi trinh
   duyet ve mot kieu, Firefox thi khong co. */
.gd3-th-loc input::-webkit-search-cancel-button {
	-webkit-appearance: none;
	appearance: none;
}

.gd3-th-loc-xoa {
	position: absolute;
	right: 6px;
	top: 50%;
	margin-top: -14px;
	width: 28px;
	height: 28px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: #f0f0f0;
	color: #666;
	font-size: 13px;
	line-height: 28px;
	cursor: pointer;
}

.gd3-th-loc-xoa:hover {
	background: #141414;
	color: #fff;
}

.gd3-th-loc-ket {
	margin-bottom: 14px;
	min-height: 18px;
	color: #888;
	font-size: 13px;
}

.gd3-th-trong {
	margin-top: 4px;
}

/* Nut "Xem them" o trang danh sach thuong hieu. Dung lai lop
   .btn-see-all-products cua nut "Xem them" o trang chu de nhin lien mach,
   chi doi vai thu cho hop voi mot nut BAM TAI CHO (khong phai duong dan
   sang trang khac): la the <button> nen phai tu bo vien/nen mac dinh cua
   trinh duyet. */
.gd3-th-them {
	border: 0;
	background: none;
	cursor: pointer;
	font: inherit;
}

.gd3-th-them .gd3-see-more-icon {
	transition: transform 0.15s ease;
}

.gd3-th-them:hover .gd3-see-more-icon {
	transform: translateY(2px);
}

/* ============ TRANG DANH MUC TIN TUC (01/09/2026) ============
   Dung chung khung .section-category-products / .gd3-category-head /
   .gd3-subcat-wrap / .gd3-category-pagination voi trang danh muc san pham,
   nen o day chi can them phan the bai viet. */
.gd3-tin-mota {
	font-size: 14px;
	line-height: 1.7;
	color: #444;
}
.gd3-tin-mota img { max-width: 100%; height: auto; }

.gd3-tin-item {
	display: block;
	height: 100%;
	padding: 10px;
	border-radius: 8px;
	background: #fff;
	color: inherit;
	text-decoration: none;
	transition: box-shadow .15s ease;
}
.gd3-tin-item:hover {
	color: inherit;
	text-decoration: none;
	box-shadow: 0 2px 12px rgba(0, 0, 0, .12);
}
/* Khung anh ti le 16:9 co dinh: anh bai viet moi bai mot kich thuoc khac
   nhau, khong ep ti le thi cac the trong cung mot hang cao thap lech nhau
   va luoi vo bo cuc. Dung padding-top thay vi aspect-ratio de con chay
   duoc tren trinh duyet cu. */
.gd3-tin-anh {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
	overflow: hidden;
	border-radius: 6px;
	background: #f2f2f2;
}
.gd3-tin-anh img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .25s ease;
}
.gd3-tin-item:hover .gd3-tin-anh img { transform: scale(1.05); }

/* Anh bia chuyen muc (display_time = 1) - giong .tdm-bia giao dien 1
   (05/09/2026, sua lai PC 05/09: anh 62% phu kin chieu cao the (object-fit
   cover, toi da 320px), mo ta 38% tu cuon khi dai, the khong padding de anh
   sat mep; truoc do anh 40% co padding nen ngan, chu dai keo the cao 380px
   voi khoang trong lon duoi anh). Mobile xep doc. */
.gd3-tin-bia {
	display: flex;
	align-items: stretch;
	overflow: hidden;
	border: 1px solid #ececec;
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 2px 10px rgba(0, 0, 0, .05);
}
.gd3-tin-bia-anh {
	position: relative;
	flex: 1 1 62%;
	max-width: 62%;
	min-width: 0;
	border-right: 1px solid #ececec;
	background: #111;
}
.gd3-tin-bia-anh a { display: block; height: 100%; }
.gd3-tin-bia-anh img {
	display: block;
	width: 100%;
	height: 100%;
	max-height: 320px;
	object-fit: cover;
}
.gd3-tin-bia-the {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 12px;
	border-radius: 999px;
	background: #ffc600;
	color: #111;
	font-size: 12px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .3px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, .25);
}
.gd3-tin-bia-chu {
	flex: 1 1 38%;
	min-width: 0;
	max-height: 320px;
	overflow-y: auto;
	padding: 16px 18px;
}
.gd3-tin-bia-chu.gd3-tin-mota { margin: 0; border: 0; background: none; box-shadow: none; font-size: 13.5px; line-height: 1.6; color: #555; }
.gd3-tin-bia-chu p { margin: 0 0 8px; }
.gd3-tin-bia-chu p:empty { display: none; }
.gd3-tin-bia-chu strong { color: #111; }
.gd3-tin-bia-chu a { color: #b58600; font-weight: 700; }
@media (max-width: 767.98px) {
	.gd3-tin-bia { flex-direction: column; border-radius: 10px; }
	.gd3-tin-bia-anh { flex-basis: auto; max-width: none; border-right: 0; border-bottom: 1px solid #ececec; }
	.gd3-tin-bia-anh img { max-height: 200px; }
	.gd3-tin-bia-chu { max-height: none; padding: 12px 14px; }
}

/* Chuyen muc KHUYEN MAI - nhan het han / dang dien ra (05/09/2026, giong co
   "HET HAN" o giao dien 1). Tong vang-den: dang dien ra = nen vang chu den,
   het han = nen den chu vang + anh mo va bo mau. */
.gd3-km-nhan {
	position: absolute;
	top: 8px;
	left: 8px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 3px 9px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: .2px;
	box-shadow: 0 1px 4px rgba(0, 0, 0, .25);
}
.gd3-km-con { background: #ffc600; color: #111; }
.gd3-km-het { background: #111; color: #ffc600; }
.gd3-tin-het .gd3-tin-anh img { filter: grayscale(1); opacity: .75; }
.gd3-tin-het .gd3-tin-ten { color: #666; }
.gd3-tin-het .gd3-tin-item:hover .gd3-tin-ten { color: #111; }
.gd3-km-han { color: #b58600; font-weight: 600; }
.gd3-tin-het .gd3-km-han { color: #999; font-weight: 400; }

/* Cat con 2 dong (tieu de) va 3 dong (tom tat) de moi the cao bang nhau.
   -webkit-line-clamp chay tren tat ca trinh duyet pho bien hien nay; trinh
   duyet nao khong ho tro thi chu chi dai ra chu khong vo giao dien. */
.gd3-tin-ten {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin: 10px 0 6px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.4;
	color: #111;
}
.gd3-tin-item:hover .gd3-tin-ten { color: #067647; }
.gd3-tin-tomtat {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin: 0 0 8px;
	font-size: 13px;
	line-height: 1.5;
	color: #666;
}
.gd3-tin-meta {
	display: flex;
	gap: 14px;
	font-size: 11px;
	color: #888;
}
.gd3-tin-meta i { margin-right: 3px; }

@media (max-width: 575px) {
	.gd3-tin-item { padding: 6px; }
	.gd3-tin-ten { font-size: 13px; }
	/* Man hinh hep thi 2 the mot hang, bo tom tat di cho do roi mat. */
	.gd3-tin-tomtat { display: none; }
}

/* ============ TRANG CHI TIET BAI VIET ============
   Da chuyen sang css/bai-viet.css (04/09/2026) - chi nap o trang bai viet
   (page=news_detail_bv), khong bat moi trang tai theo nua. */

/* ============ TRANG LIEN HE (01/09/2026) ============ */
.gd3-lh-bao {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-bottom: 18px;
	padding: 12px 16px;
	border-radius: 8px;
	font-size: 14px;
	line-height: 1.6;
}
.gd3-lh-bao i { margin-top: 3px; font-size: 16px; }
.gd3-lh-bao a { font-weight: 700; }
.gd3-lh-bao-ok { background: #eaf7f0; border: 1px solid #b7e2ca; color: #10603c; }
.gd3-lh-bao-ok i, .gd3-lh-bao-ok a { color: #067647; }
.gd3-lh-bao-loi { background: #fdecec; border: 1px solid #f5c2c2; color: #a12020; }
.gd3-lh-bao-loi i { color: #d92d20; }

/* ---- Khoi thong tin nhanh ----
   Dat TREN form: phan lon khach vao trang lien he la de goi dien ngay.
   Moi o la mot the <a> that (tel:, mailto:, ban do) nen tren dien thoai
   cham mot cai la goi/mo duoc luon. */
.gd3-lh-nhanh {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	margin-bottom: 26px;
}
.gd3-lh-o {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 14px;
	border: 1px solid #e8ebe9;
	border-radius: 8px;
	background: #fff;
	color: inherit;
	text-decoration: none;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.gd3-lh-o:hover {
	border-color: #067647;
	box-shadow: 0 2px 10px rgba(6, 118, 71, .1);
	color: inherit;
	text-decoration: none;
}
.gd3-lh-o-icon {
	flex: 0 0 38px;
	width: 38px;
	height: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: #eaf3ee;
	color: #067647;
	font-size: 15px;
}
.gd3-lh-o-nhan { display: block; font-size: 11px; color: #8a8a8a; text-transform: uppercase; letter-spacing: .3px; }
.gd3-lh-o b { font-size: 14px; color: #111; word-break: break-word; }

/* ---- Form ---- */
.gd3-lh-tieude {
	margin: 0 0 4px;
	font-size: 19px;
	font-weight: 800;
	color: #111;
}
.gd3-lh-tieude-ch { margin-top: 34px; padding-top: 22px; border-top: 1px solid #eef0ef; }
.gd3-lh-motangan { margin: 0 0 16px; font-size: 13px; color: #777; }
.gd3-lh-form { margin-bottom: 8px; }
.gd3-lh-hang { display: flex; gap: 14px; }
.gd3-lh-hang > .gd3-lh-cot { flex: 1 1 0; min-width: 0; }
.gd3-lh-cot { margin-bottom: 14px; }
.gd3-lh-cot label { display: block; margin-bottom: 5px; font-size: 13px; font-weight: 600; color: #333; }
.gd3-lh-sao { color: #d92d20; }
.gd3-lh-tuychon { font-weight: 400; color: #999; font-size: 12px; }
.gd3-lh-cot input, .gd3-lh-cot textarea {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid #dcdfdd;
	border-radius: 6px;
	background: #fff;
	font-size: 14px;
	font-family: inherit;
	color: #111;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.gd3-lh-cot input:focus, .gd3-lh-cot textarea:focus {
	outline: 0;
	border-color: #067647;
	box-shadow: 0 0 0 3px rgba(6, 118, 71, .12);
}
.gd3-lh-cot input.co-loi, .gd3-lh-cot textarea.co-loi { border-color: #d92d20; background: #fffafa; }
.gd3-lh-cot textarea { resize: vertical; min-height: 110px; line-height: 1.6; }
.gd3-lh-loi { display: block; margin-top: 5px; font-size: 12px; color: #d92d20; }

/* O bay bot: phai an bang CSS chu KHONG dung type="hidden" - may gui rac
   bo qua o hidden nhung van dien vao o text bi an. Dung position tuyet doi
   thay vi display:none vi vai loai bot co kiem tra display. */
.gd3-lh-bay {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.gd3-lh-nut {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 11px 26px;
	border: 0;
	border-radius: 6px;
	background: #067647;
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	transition: background .15s ease;
}
.gd3-lh-nut:hover { background: #04532f; }

/* ---- Ban do ---- */
.gd3-lh-map {
	position: relative;
	width: 100%;
	padding-top: 100%;
	border-radius: 8px;
	overflow: hidden;
	border: 1px solid #e8ebe9;
}
.gd3-lh-map iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }

/* ---- He thong cua hang ---- */
.gd3-lh-tinh-luoi {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}
.gd3-lh-tinh {
	padding: 14px 16px;
	border: 1px solid #e8ebe9;
	border-radius: 8px;
	background: #fff;
}
.gd3-lh-tinh-ten {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 10px;
	padding-bottom: 8px;
	border-bottom: 2px solid #eaf3ee;
	font-size: 15px;
	font-weight: 800;
	color: #111;
}
.gd3-lh-tinh-ten i { color: #067647; font-size: 13px; }
.gd3-lh-tinh-so {
	margin-left: auto;
	padding: 1px 8px;
	border-radius: 10px;
	background: #eaf3ee;
	color: #067647;
	font-size: 11px;
	font-weight: 700;
}
.gd3-lh-ch { padding: 9px 0; border-bottom: 1px dashed #eee; }
.gd3-lh-ch:last-child { border-bottom: 0; padding-bottom: 0; }
.gd3-lh-ch-ten { font-size: 13px; font-weight: 700; color: #222; line-height: 1.4; }
.gd3-lh-ch-ten a { color: #222; text-decoration: none; }   /* 05/09/2026: ten -> trang cua hang /ban-do-<id>.html */
.gd3-lh-ch-ten a:hover { color: #b58600; text-decoration: none; }
.gd3-lh-ch-dc, .gd3-lh-ch-dt { margin-top: 4px; font-size: 12.5px; line-height: 1.55; color: #666; }
.gd3-lh-ch-dc i, .gd3-lh-ch-dt i { width: 13px; margin-right: 4px; color: #a8a8a8; }
.gd3-lh-ch-dt a { color: #067647; font-weight: 600; text-decoration: none; }
.gd3-lh-ch-dt a:hover { text-decoration: underline; }
.gd3-lh-ch-cach { color: #ccc; }
.gd3-lh-ch-chidan {
	margin-left: 6px;
	color: #067647;
	font-size: 12px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}
.gd3-lh-ch-chidan:hover { text-decoration: underline; }

@media (max-width: 991px) {
	.gd3-lh-tinh-luoi { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	/* Ban do tren mobile: 1:1 qua cao, ep ve 4:3 cho vua man hinh. */
	.gd3-lh-map { margin-top: 20px; padding-top: 75%; }
}
@media (max-width: 575px) {
	.gd3-lh-nhanh { grid-template-columns: 1fr; }
	.gd3-lh-tinh-luoi { grid-template-columns: 1fr; }
	/* Hai o tren cung 1 hang o man hinh hep se chi con ~150px moi o -
	   khong du de go so dien thoai. Cho xuong dong. */
	.gd3-lh-hang { flex-direction: column; gap: 0; }
	.gd3-lh-nut { width: 100%; justify-content: center; }
	.gd3-lh-map { padding-top: 85%; }
}

/* ==========================================================================
   NUT "XEM THEM" O TRANG DANH MUC                               02/09/2026
   ==========================================================================
   Thay cho thanh so trang: bam la san pham trang ke tiep duoc noi them vao
   cuoi luoi (xem giaodien3/js/xem-them.js). Thanh so trang VAN CON trong
   HTML - chi bi an di - de bo may tim kiem con duong di het danh muc va de
   trinh duyet khong co JS van lat trang binh thuong.
   ========================================================================== */

/* An thanh so trang khi (va chi khi) JS da dung duoc nut "Xem them". Lop
   nay do JS gan vao, khong viet san trong HTML. */
.gd3-category-pagination.gd3-co-xem-them {
	display: none;
}

/* Khoi nut nhan luon duong ke ngan cach ma thanh so trang de lai. */
.gd3-them {
	margin-top: 36px;
	padding-top: 28px;
	border-top: 1px solid #ececec;
	text-align: center;
}

.gd3-them-nut {
	min-width: 240px;
	height: 48px;
	padding: 0 28px;
	border: 1px solid #e6e6e6;
	border-radius: 12px;
	background-color: #fff;
	color: #222;
	font-size: 15px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}
.gd3-them-nut:hover {
	background-color: #fff8dc;
	border-color: #ffd900;
	color: #000;
	transform: translateY(-2px);
}
.gd3-them-nut:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px rgba(255, 217, 0, 0.45);
}
.gd3-them-nut:active {
	transform: translateY(0);
}
/* Dang tai: giu nguyen kich thuoc (khong nhay chan trang), chi lam nhat va
   bo con tro bam de khach biet phai doi. */
.gd3-them-nut[disabled] {
	background-color: #fafafa;
	border-color: #eee;
	color: #aaa;
	box-shadow: none;
	transform: none;
	cursor: default;
}

/* "Dang hien thi 48 trong 349 san pham" - dong phu, khong duoc hut mat khoi
   nut ben tren. */
.gd3-them-dem {
	margin: 12px 0 0;
	font-size: 13px;
	color: #888;
}

@media (max-width: 767px) {
	.gd3-them {
		margin-top: 24px;
		padding-top: 20px;
	}
	/* Man hinh hep: nut trai het be ngang cho de bam bang ngon cai. */
	.gd3-them-nut {
		width: 100%;
		min-width: 0;
	}
}

/* ==========================================================================
   CHUYEN MUC TIN THUONG - bo cuc 2 cot + cot phai "do so" (05/09/2026)
   ==========================================================================
   Trai (8/12): the lon bai moi nhat (hero) + luoi 2 cot. Phai (4/12): chuyen
   muc nhanh, tin moi, xem nhieu, video (thumb, khong iframe), san pham moi.
   Tong vang-den nhu ca site. Mobile: cot phai xuong duoi. */
.gd3-tin-hero {
	display: flex;
	gap: 0;
	overflow: hidden;
	border-radius: 12px;
	background: #111;
	color: #fff;
	text-decoration: none;
	box-shadow: 0 4px 18px rgba(0, 0, 0, .12);
}
.gd3-tin-hero:hover { color: #fff; text-decoration: none; }
.gd3-tin-hero-anh {
	position: relative;
	flex: 0 0 55%;
	max-width: 55%;
	min-height: 260px;
	overflow: hidden;
	background: #222;
}
.gd3-tin-hero-anh img {
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .35s ease;
}
.gd3-tin-hero:hover .gd3-tin-hero-anh img { transform: scale(1.04); }
.gd3-tin-hero-chu {
	flex: 1 1 auto;
	min-width: 0;
	padding: 22px 24px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.gd3-tin-hero-nhan {
	display: inline-block;
	align-self: flex-start;
	margin-bottom: 10px;
	padding: 3px 10px;
	border-radius: 999px;
	background: #ffc600;
	color: #111;
	font-size: 11px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .3px;
}
.gd3-tin-hero-ten {
	margin: 0 0 10px;
	font-size: 22px;
	font-weight: 800;
	line-height: 1.3;
	color: #fff;
}
.gd3-tin-hero:hover .gd3-tin-hero-ten { color: #ffc600; }
.gd3-tin-hero-tomtat {
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin: 0 0 14px;
	font-size: 14px;
	line-height: 1.6;
	color: #ccc;
}
.gd3-tin-hero .gd3-tin-meta { color: #aaa; }
.gd3-tin-hero-doc { margin-left: auto; color: #ffc600; font-weight: 700; }
.gd3-tin-hero.gd3-tin-het .gd3-tin-hero-anh img { filter: grayscale(1); opacity: .7; }

/* Luoi 2 cot ben trong cot trai: chu to hon luoi 4 cot mot chut. */
.gd3-tin-2cot .gd3-tin-ten { font-size: 15px; }
.gd3-tin-2cot .gd3-tin-tomtat { -webkit-line-clamp: 2; }

/* --- Cot phai --- */
.gd3-tin-cot-phai { display: flex; flex-direction: column; gap: 18px; }
.gd3-tcp-khoi {
	padding: 16px 16px 12px;
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .05);
}
.gd3-tcp-tieude {
	position: relative;
	margin: 0 0 12px;
	padding-bottom: 10px;
	border-bottom: 1px solid #eee;
	font-size: 16px;
	font-weight: 800;
	color: #111;
}
.gd3-tcp-tieude::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 56px;
	height: 3px;
	border-radius: 2px;
	background: #ffc600;
}
.gd3-tcp-tieude i { margin-right: 6px; color: #b58600; }

/* 6 o chuyen muc nhanh */
.gd3-tcp-o-luoi {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
}
.gd3-tcp-o {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 12px 6px 10px;
	border-radius: 10px;
	background: #111;
	color: #fff;
	text-align: center;
	text-decoration: none;
	transition: background .15s ease, transform .15s ease;
}
.gd3-tcp-o i { font-size: 20px; color: #ffc600; margin-bottom: 6px; }
.gd3-tcp-o b { font-size: 13px; line-height: 1.2; }
.gd3-tcp-o small { margin-top: 2px; font-size: 10.5px; color: #bbb; line-height: 1.2; }
.gd3-tcp-o:hover { background: #ffc600; color: #111; text-decoration: none; transform: translateY(-2px); }
.gd3-tcp-o:hover i, .gd3-tcp-o:hover small { color: #111; }
.gd3-tcp-o.is-hien-tai { background: #ffc600; color: #111; }
.gd3-tcp-o.is-hien-tai i, .gd3-tcp-o.is-hien-tai small { color: #111; }

/* Dong tin / san pham: anh nho trai + chu phai */
.gd3-tcp-tin, .gd3-tcp-sp {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	padding: 8px 0;
	border-bottom: 1px dashed #eee;
	color: #222;
	text-decoration: none;
}
.gd3-tcp-tin:last-child, .gd3-tcp-sp:last-child { border-bottom: 0; padding-bottom: 2px; }
.gd3-tcp-tin:hover, .gd3-tcp-sp:hover { color: #111; text-decoration: none; }
.gd3-tcp-tin img, .gd3-tcp-sp img {
	flex: 0 0 84px;
	width: 84px;
	height: 60px;
	border-radius: 6px;
	object-fit: cover;
	background: #f2f2f2;
}
.gd3-tcp-sp img { height: 64px; object-fit: contain; background: #fff; border: 1px solid #f0f0f0; }
.gd3-tcp-tin-chu { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.gd3-tcp-tin-ten {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1.4;
}
.gd3-tcp-tin:hover .gd3-tcp-tin-ten, .gd3-tcp-sp:hover .gd3-tcp-tin-ten { color: #b58600; }
.gd3-tcp-tin-meta { font-size: 11px; color: #888; }
.gd3-tcp-sp-gia { font-size: 13px; font-weight: 800; color: #d70018; }

/* Xem nhieu: danh so */
.gd3-tcp-xn { margin: 0; padding: 0; list-style: none; counter-reset: xn; }
.gd3-tcp-xn li {
	position: relative;
	padding: 7px 0 7px 34px;
	border-bottom: 1px dashed #eee;
	counter-increment: xn;
}
.gd3-tcp-xn li:last-child { border-bottom: 0; }
.gd3-tcp-xn li::before {
	content: counter(xn);
	position: absolute;
	left: 0;
	top: 8px;
	width: 24px;
	height: 24px;
	border-radius: 6px;
	background: #111;
	color: #ffc600;
	font-size: 12px;
	font-weight: 800;
	line-height: 24px;
	text-align: center;
}
.gd3-tcp-xn li:nth-child(-n+3)::before { background: #ffc600; color: #111; }
.gd3-tcp-xn a {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1.4;
	color: #222;
	text-decoration: none;
}
.gd3-tcp-xn a:hover { color: #b58600; }
.gd3-tcp-xn small { display: block; font-size: 11px; color: #888; }

/* Video: 2 cot thumb, nut play */
.gd3-tcp-video-luoi { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.gd3-tcp-video { color: #222; text-decoration: none; }
.gd3-tcp-video:hover { color: #b58600; text-decoration: none; }
.gd3-tcp-video-anh {
	position: relative;
	display: block;
	padding-top: 56.25%;
	overflow: hidden;
	border-radius: 8px;
	background: #111;
}
.gd3-tcp-video-anh img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; }
.gd3-tcp-video-anh i {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 34px;
	height: 34px;
	margin: -17px 0 0 -17px;
	border-radius: 50%;
	background: rgba(0, 0, 0, .65);
	color: #ffc600;
	font-size: 13px;
	line-height: 34px;
	text-align: center;
	transition: transform .15s ease, background .15s ease;
}
.gd3-tcp-video:hover .gd3-tcp-video-anh i { background: #ffc600; color: #111; transform: scale(1.1); }
.gd3-tcp-video-ten {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 6px;
	font-size: 12.5px;
	font-weight: 600;
	line-height: 1.35;
}

@media (max-width: 991.98px) {
	.gd3-tin-cot-phai { margin-top: 8px; }
}
@media (max-width: 767.98px) {
	.gd3-tin-hero { flex-direction: column; }
	.gd3-tin-hero-anh { flex-basis: auto; max-width: none; min-height: 0; padding-top: 56.25%; }
	.gd3-tin-hero-chu { padding: 16px; }
	.gd3-tin-hero-ten { font-size: 18px; }
	.gd3-tin-hero-tomtat { -webkit-line-clamp: 3; font-size: 13px; }
	.gd3-tin-2cot .gd3-tin-ten { font-size: 13px; }
	.gd3-tcp-o b { font-size: 12px; }
	.gd3-tcp-o small { display: none; }
}

/* (26/09/2026) Khe doc giua 2 cot san pham tren DIEN THOAI: gutter Bootstrap 5
   mac dinh 24px -> 8px, cho bang trang chu (css/main.css + js/home.js) - khe
   hep thi the san pham rong ra, anh to ro hon. Ap cho MOI .gd3-product-grid
   (luoi chinh + "Xem them cung danh muc"); hang cuon ngang "Vua xem" khong
   phai luoi nen khong dung. Tu 768px tro len giu nguyen. */
@media (max-width: 767.98px) {
  .gd3-product-grid { --bs-gutter-x: 8px; }
}

/* (26/09/2026) Anh slide + 3 anh gioi thieu cua danh muc (inc/category.php,
   khoi .gd3-dmbn-*). Tren dien thoai 3 anh chay ngang, hien 2 anh ruoi de
   khach biet con anh nua; tu 768px xep du 3 anh mot hang. */
.gd3-dmbn-slide { margin: 0 0 12px; border-radius: 8px; overflow: hidden; background: #f1f1f1; }
.gd3-dmbn-slide .carousel-control-prev, .gd3-dmbn-slide .carousel-control-next { width: 44px; opacity: .85; }
.gd3-dmbn-slide .carousel-control-prev-icon, .gd3-dmbn-slide .carousel-control-next-icon {
  background: rgba(0,0,0,.45); border-radius: 50%; width: 34px; height: 34px;
  display: flex; align-items: center; justify-content: center; color: #fff; font-size: 14px;
}
.gd3-dmbn-3 { display: flex; gap: 8px; margin: 0 0 14px; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.gd3-dmbn-3::-webkit-scrollbar { display: none; }
.gd3-dmbn-o { flex: 0 0 calc((100% - 8px) / 2.2); scroll-snap-align: start; display: block; color: #111; text-decoration: none; background: #fff; border-radius: 8px; overflow: hidden; }
.gd3-dmbn-o:hover { color: #000; }
.gd3-dmbn-anh { position: relative; display: block; background: #f1f1f1; }
.gd3-dmbn-anh img { display: block; width: 100%; height: auto; }
.gd3-dmbn-ten { display: block; padding: 7px 8px; font-size: 13px; font-weight: 600; text-align: center; line-height: 1.3; }
@media (min-width: 768px) {
  .gd3-dmbn-3 { gap: 12px; overflow: visible; }
  .gd3-dmbn-o { flex: 1 1 0; }
  .gd3-dmbn-o:only-child { flex: 0 1 calc((100% - 24px) / 3); }
}