/* Chợ Nội Thất - giao diện site ngoài (sàn) */
:root
{
	--cam: #ef5a24;
	--cam-dam: #d2461a;
	--cam-nhat: #fff2eb;
	--xanh: #11998e;
	--dam: #1c2230;
	--chu: #2a3140;
	--xam: #6b7382;
	--vien: #e6e8ee;
	--nen: #f3f4f7;
	--trang: #ffffff;
	--bo: 10px;
	--bong: 0 6px 20px rgba(20, 28, 45, .08);
}
html
{
	scroll-behavior: smooth;
}
body
{
	font-family: "Be Vietnam Pro", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	font-size: 14px;
	color: var(--chu);
	background: var(--nen);
	-webkit-font-smoothing: antialiased;
}
a
{
	color: inherit;
	text-decoration: none;
}
a:hover
{
	color: var(--cam);
}
img
{
	max-width: 100%;
}
.text-cam
{
	color: var(--cam) !important;
}
.btn
{
	border-radius: 8px;
	font-weight: 500;
}
.btn-cam
{
	background: var(--cam);
	border-color: var(--cam);
	color: #fff;
}
.btn-cam:hover, .btn-cam:focus
{
	background: var(--cam-dam);
	border-color: var(--cam-dam);
	color: #fff;
}
.btn-outline-cam
{
	border: 1px solid var(--cam);
	color: var(--cam);
	background: #fff;
}
.btn-outline-cam:hover
{
	background: var(--cam);
	color: #fff;
}
.btn-xanh
{
	background: var(--xanh);
	border-color: var(--xanh);
	color: #fff;
}
.btn-xanh:hover
{
	background: #0d7d74;
	color: #fff;
}
.form-control:focus, .form-select:focus
{
	border-color: #f7a37f;
	box-shadow: 0 0 0 .2rem rgba(239, 90, 36, .15);
}
.an-chong-spam
{
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	opacity: 0;
}
.chip
{
	display: inline-flex;
	align-items: center;
	padding: 5px 12px;
	border: 1px solid var(--vien);
	border-radius: 999px;
	background: #fff;
	font-size: 13px;
	white-space: nowrap;
	margin: 0 6px 6px 0;
}
.chip:hover, .chip.chon
{
	border-color: var(--cam);
	color: var(--cam);
	background: var(--cam-nhat);
}
.cuon-ngang
{
	display: flex;
	overflow-x: auto;
	scrollbar-width: thin;
	-webkit-overflow-scrolling: touch;
}

/* ---- Thanh trên + đầu trang ---- */
.thanh-tren
{
	background: var(--dam);
	color: #c9ced8;
	font-size: 12.5px;
	padding: 6px 0;
}
.thanh-tren a
{
	color: #e3e6ec;
}
.thanh-tren a:hover
{
	color: #fff;
}
.dau-trang
{
	background: #fff;
	position: sticky;
	top: 0;
	z-index: 1030;
	box-shadow: 0 1px 0 var(--vien);
}
.dau-hang
{
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 14px 0;
}
.nut-menu
{
	border: 0;
	background: none;
	font-size: 22px;
	color: var(--dam);
	padding: 4px 6px;
}
.logo
{
	display: flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
}
.logo-bieu-tuong
{
	width: 42px;
	height: 42px;
	border-radius: 12px;
	background: linear-gradient(135deg, var(--cam), #ff8a3d);
	color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	box-shadow: 0 4px 12px rgba(239, 90, 36, .35);
}
.logo-chu b
{
	display: block;
	font-size: 20px;
	line-height: 1.1;
	color: var(--dam);
	font-weight: 700;
	letter-spacing: -.3px;
}
.logo-chu small
{
	display: block;
	font-size: 11px;
	color: var(--xam);
}
.o-tim
{
	flex: 1;
	position: relative;
	display: flex;
	max-width: 640px;
	margin: 0 auto;
	border: 2px solid var(--cam);
	border-radius: 10px;
	background: #fff;
}
.o-tim-nhap
{
	flex: 1;
	border: 0;
	outline: 0;
	padding: 10px 14px;
	font-size: 14px;
	border-radius: 10px 0 0 10px;
	min-width: 0;
}
.o-tim button
{
	border: 0;
	background: var(--cam);
	color: #fff;
	padding: 0 22px;
	font-size: 16px;
	border-radius: 0 7px 7px 0;
}
.goi-y-tim
{
	display: none;
	position: absolute;
	left: -2px;
	right: -2px;
	top: calc(100% + 6px);
	background: #fff;
	border-radius: 10px;
	box-shadow: 0 12px 32px rgba(20, 28, 45, .16);
	padding: 12px;
	z-index: 50;
	max-height: 70vh;
	overflow: auto;
}
.o-tim.mo .goi-y-tim
{
	display: block;
}
.goi-y-tieu-de
{
	font-size: 12px;
	font-weight: 600;
	color: var(--xam);
	text-transform: uppercase;
	margin-bottom: 8px;
}
.goi-y-sp
{
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 6px;
	border-radius: 8px;
}
.goi-y-sp:hover
{
	background: var(--nen);
}
.goi-y-sp img
{
	width: 44px;
	height: 44px;
	object-fit: contain;
	background: #fff;
	border: 1px solid var(--vien);
	border-radius: 6px;
}
.goi-y-sp span
{
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.goi-y-sp b
{
	color: var(--cam);
	font-size: 13px;
	white-space: nowrap;
}
.goi-y-ket-qua:not(:empty)
{
	margin-bottom: 10px;
	padding-bottom: 8px;
	border-bottom: 1px dashed var(--vien);
}
.dau-cong-cu
{
	display: flex;
	align-items: center;
	gap: 18px;
	flex-shrink: 0;
}
.cong-cu
{
	display: flex;
	align-items: center;
	gap: 8px;
	position: relative;
	color: var(--dam);
}
.cong-cu > i
{
	font-size: 24px;
	color: var(--cam);
}
.cong-cu small
{
	display: block;
	font-size: 11px;
	color: var(--xam);
	line-height: 1.2;
}
.cong-cu b
{
	display: block;
	font-size: 13px;
	line-height: 1.25;
	max-width: 130px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.so-gio
{
	position: absolute;
	top: -7px;
	left: 16px;
	min-width: 18px;
	height: 18px;
	border-radius: 9px;
	background: var(--dam);
	color: #fff;
	font-size: 11px;
	font-style: normal;
	text-align: center;
	line-height: 18px;
	padding: 0 4px;
}
.thanh-menu
{
	background: var(--cam);
	color: #fff;
}
.menu-danh-muc
{
	position: relative;
}
.nut-danh-muc
{
	height: 100%;
	border: 0;
	background: rgba(0, 0, 0, .14);
	color: #fff;
	font-weight: 600;
	padding: 11px 22px;
	min-width: 240px;
	text-align: left;
}
.mega
{
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	width: 820px;
	background: #fff;
	color: var(--chu);
	border-radius: 0 0 12px 12px;
	box-shadow: 0 18px 40px rgba(20, 28, 45, .18);
	padding: 18px;
	z-index: 40;
	grid-template-columns: 1fr 220px;
	gap: 18px;
}
.menu-danh-muc:hover .mega, .menu-danh-muc.mo .mega
{
	display: grid;
}
.mega-luoi
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 6px;
}
.mega-muc
{
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px;
	border-radius: 8px;
	font-weight: 500;
}
.mega-muc i
{
	width: 34px;
	height: 34px;
	border-radius: 8px;
	background: var(--cam-nhat);
	color: var(--cam);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}
.mega-muc:hover
{
	background: var(--nen);
}
.mega-phu
{
	border-left: 1px solid var(--vien);
	padding-left: 18px;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.mega-phu a
{
	padding: 9px 6px;
	font-weight: 500;
}
.menu-ngang
{
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0 0 0 8px;
}
.menu-ngang a, .menu-noi-bat
{
	display: block;
	padding: 11px 14px;
	color: #fff;
	font-weight: 500;
	white-space: nowrap;
}
.menu-ngang a:hover, .menu-noi-bat:hover
{
	color: #fff;
	background: rgba(0, 0, 0, .12);
}
.menu-noi-bat
{
	background: rgba(0, 0, 0, .14);
}
.dd-tai-khoan
{
	display: flex;
	justify-content: space-between;
	padding: 12px 16px;
	background: var(--cam-nhat);
	font-weight: 500;
}
.dd-menu
{
	list-style: none;
	margin: 0;
	padding: 6px 0;
}
.dd-menu a
{
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 11px 16px;
	border-bottom: 1px solid var(--nen);
}
.dd-menu i
{
	width: 20px;
	color: var(--cam);
	text-align: center;
}
.dd-menu-phu
{
	border-top: 6px solid var(--nen);
}
.dd-nhom
{
	padding: 12px 16px 4px;
	font-size: 12px;
	font-weight: 600;
	color: var(--xam);
	text-transform: uppercase;
}
.duong-dan
{
	padding: 12px 0 2px;
}
.breadcrumb
{
	margin: 0;
	font-size: 13px;
	flex-wrap: nowrap;
	overflow-x: auto;
	white-space: nowrap;
	scrollbar-width: none;
}
.breadcrumb-item a
{
	color: var(--xam);
}
.breadcrumb-item.active
{
	color: var(--chu);
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 60vw;
}

/* ---- Khối nội dung ---- */
.khoi
{
	margin: 26px 0;
}
.khoi-dau
{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 14px;
	flex-wrap: wrap;
}
.khoi-dau h2
{
	font-size: 20px;
	font-weight: 700;
	margin: 0;
	color: var(--dam);
}
.khoi-dau-mau
{
	background: linear-gradient(90deg, var(--cam), #ff8a3d);
	color: #fff;
	padding: 12px 16px;
	border-radius: var(--bo) var(--bo) 0 0;
	margin-bottom: 0;
}
.khoi-dau-mau h2, .khoi-dau-mau .xem-tat-ca
{
	color: #fff;
}
.khoi-vip .luoi-sp
{
	background: #fff;
	padding: 12px;
	border-radius: 0 0 var(--bo) var(--bo);
}
.xem-tat-ca
{
	font-weight: 500;
	color: var(--cam);
	font-size: 13.5px;
}
.tieu-de-trang
{
	padding: 8px 0 12px;
}
.tieu-de-trang h1, .tieu-de-trang-nho
{
	font-size: 24px;
	font-weight: 700;
	margin: 0;
	color: var(--dam);
}
.tieu-de-trang-nho
{
	margin: 10px 0 16px;
}
.tieu-de-trang-nho small
{
	font-size: 14px;
	color: var(--xam);
	font-weight: 400;
}
.trong
{
	text-align: center;
	padding: 48px 16px;
	background: #fff;
	border-radius: var(--bo);
	color: var(--xam);
}
.trong i
{
	font-size: 44px;
	color: #c9ced8;
	margin-bottom: 12px;
}

/* ---- Hero trang chủ ---- */
.hero
{
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
	margin-top: 14px;
}
.hero-dm
{
	background: #fff;
	border-radius: var(--bo);
	overflow: hidden;
}
.hero-dm-tieu-de
{
	padding: 12px 16px;
	font-weight: 700;
	border-bottom: 1px solid var(--vien);
}
.hero-dm ul
{
	list-style: none;
	margin: 0;
	padding: 4px 0;
}
.hero-dm a
{
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8.4px 16px;
	font-size: 13.5px;
}
.hero-dm a i:first-child
{
	width: 18px;
	color: var(--cam);
	text-align: center;
}
.hero-dm a span
{
	flex: 1;
}
.mui-ten
{
	font-size: 11px;
	color: #b8bdc7;
}
.hero-dm a:hover
{
	background: var(--cam-nhat);
}
.hero-slider
{
	border-radius: var(--bo);
	overflow: hidden;
	background: #e9ebf0;
	min-height: 160px;
}
.hero-slider img
{
	width: 100%;
	aspect-ratio: 870 / 370;
	object-fit: cover;
	display: block;
}
.hero-phai
{
	flex-direction: column;
	gap: 12px;
}
.hero-qc img
{
	width: 100%;
	border-radius: var(--bo);
	display: block;
}
.hero-cta
{
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 18px;
	border-radius: var(--bo);
	color: #fff;
	position: relative;
	overflow: hidden;
}
.hero-cta i
{
	font-size: 28px;
	margin-bottom: 8px;
}
.hero-cta b
{
	font-size: 16px;
}
.hero-cta span
{
	font-size: 12.5px;
	opacity: .9;
}
.hero-cta:hover
{
	color: #fff;
	filter: brightness(1.05);
}
.cta-1
{
	background: linear-gradient(135deg, #1c2230, #3b4660);
}
.cta-2
{
	background: linear-gradient(135deg, var(--xanh), #38c7a0);
}
@media (min-width: 992px)
{
	.hero
	{
		grid-template-columns: 230px 1fr;
	}
}
@media (min-width: 1200px)
{
	.hero
	{
		grid-template-columns: 230px 1fr 250px;
	}
}

/* Danh mục nổi bật */
.dm-noi-bat
{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
}
.dm-o
{
	background: #fff;
	border-radius: var(--bo);
	padding: 14px 8px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	border: 1px solid transparent;
	transition: border-color .15s, transform .15s;
}
.dm-o:hover
{
	border-color: var(--cam);
	transform: translateY(-2px);
}
.dm-o-anh
{
	position: relative;
	width: 84px;
	height: 84px;
	border-radius: 50%;
	background: var(--nen);
	overflow: hidden;
}
.dm-o-anh img
{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.dm-o-anh i
{
	position: absolute;
	right: 0;
	bottom: 0;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--cam);
	color: #fff;
	font-size: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2px solid #fff;
}
.dm-o-ten
{
	font-weight: 600;
	font-size: 13px;
	line-height: 1.3;
}
.dm-o-so
{
	font-size: 12px;
	color: var(--xam);
}
@media (min-width: 576px)
{
	.dm-noi-bat
	{
		grid-template-columns: repeat(4, 1fr);
	}
}
@media (min-width: 992px)
{
	.dm-noi-bat
	{
		grid-template-columns: repeat(6, 1fr);
	}
}

/* ---- Lưới + thẻ sản phẩm ---- */
.luoi-sp
{
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
}
@media (min-width: 576px)
{
	.luoi-sp
	{
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}
@media (min-width: 768px)
{
	.luoi-sp
	{
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 12px;
	}
}
@media (min-width: 992px)
{
	.luoi-sp-6
	{
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}
}
@media (min-width: 1200px)
{
	.luoi-sp-6
	{
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}
	.luoi-sp-5
	{
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}
}
.the-sp
{
	background: #fff;
	border-radius: var(--bo);
	border: 1px solid var(--vien);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: box-shadow .18s, transform .18s;
}
.the-sp:hover
{
	box-shadow: var(--bong);
	transform: translateY(-2px);
}
.the-sp-anh
{
	position: relative;
	display: block;
	aspect-ratio: 1 / 1;
	background: #fff;
}
.the-sp-anh img
{
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 6px;
}
.nhan-vip, .nhan-giam
{
	position: absolute;
	top: 8px;
	left: 8px;
	background: linear-gradient(135deg, #f7b500, #f08c00);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	padding: 2px 8px;
	border-radius: 4px;
}
.nhan-giam
{
	left: auto;
	right: 8px;
	background: #e53935;
}
.nhan-uy-tin
{
	position: absolute;
	bottom: 6px;
	right: 6px;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--xanh);
	color: #fff;
	font-size: 11px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.the-sp-than
{
	padding: 8px 10px 10px;
	display: flex;
	flex-direction: column;
	gap: 4px;
	flex: 1;
}
.the-sp-ten
{
	font-size: 13.5px;
	font-weight: 500;
	line-height: 1.4;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.8em;
}
.the-sp-gia b
{
	color: var(--cam);
	font-size: 15px;
	font-weight: 700;
}
.the-sp-gia b.lien-he
{
	color: var(--xanh);
	font-size: 14px;
}
.the-sp-gia del
{
	color: #a0a6b2;
	font-size: 12px;
	margin-left: 6px;
}
.the-sp-phu
{
	margin-top: auto;
	display: flex;
	flex-direction: column;
	gap: 2px;
	font-size: 11.5px;
	color: var(--xam);
}
.the-sp-phu span
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.the-sp-phu i
{
	width: 14px;
	margin-right: 4px;
	color: #b0b6c1;
}

/* Gian hàng uy tín (trang chủ) */
.gh-uy-tin
{
	gap: 12px;
	padding-bottom: 6px;
}
.gh-the
{
	flex: 0 0 200px;
	background: #fff;
	border-radius: var(--bo);
	padding: 16px 12px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	border: 1px solid var(--vien);
}
.gh-the:hover
{
	border-color: var(--cam);
}
.gh-the-logo
{
	width: 90px;
	height: 90px;
	border-radius: 50%;
	border: 1px solid var(--vien);
	overflow: hidden;
	background: #fff;
}
.gh-the-logo img
{
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.gh-the-ten
{
	font-weight: 600;
	line-height: 1.35;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.7em;
}
.gh-the-phu
{
	font-size: 12px;
	color: var(--xam);
}
.gh-the-nhan
{
	font-size: 12px;
	color: var(--xanh);
	font-weight: 600;
}

/* Tabs gợi ý */
.khoi-dau-tab
{
	background: #fff;
	border-radius: var(--bo);
	padding: 10px 14px;
}
.tab-goi-y
{
	gap: 6px;
	flex-wrap: nowrap;
	overflow-x: auto;
	scrollbar-width: none;
	max-width: 100%;
}
.tab-goi-y .nav-link
{
	border-radius: 999px;
	color: var(--chu);
	background: var(--nen);
	padding: 6px 14px;
	font-size: 13px;
	white-space: nowrap;
	border: 0;
}
.tab-goi-y .nav-link.active
{
	background: var(--cam);
	color: #fff;
}

/* Tin tức */
.tin-the
{
	display: block;
	background: #fff;
	border-radius: var(--bo);
	overflow: hidden;
	height: 100%;
	border: 1px solid var(--vien);
}
.tin-the-anh
{
	display: block;
	aspect-ratio: 16 / 10;
	background: var(--nen);
}
.tin-the-anh img
{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.tin-the-ten
{
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-weight: 600;
	padding: 10px 12px 4px;
	line-height: 1.4;
}
.tin-the-tom-tat
{
	padding: 0 12px 12px;
	font-size: 12.5px;
	color: var(--xam);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ---- Trang danh sách có lọc ---- */
.chip-dm
{
	margin-bottom: 10px;
}
.trang-ds
{
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
	margin-bottom: 20px;
}
@media (min-width: 992px)
{
	.trang-ds
	{
		grid-template-columns: 240px minmax(0, 1fr);
	}
}
.cot-loc
{
	display: none;
}
@media (min-width: 992px)
{
	.cot-loc
	{
		display: block;
	}
}
.cot-loc.mo
{
	display: block;
	position: fixed;
	inset: 0 auto 0 0;
	width: 300px;
	max-width: 88vw;
	background: var(--nen);
	z-index: 1050;
	overflow-y: auto;
	padding: 12px;
}
.nen-loc
{
	display: none;
}
.nen-loc.mo
{
	display: block;
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, .4);
	z-index: 1049;
}
.cot-loc-dau
{
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 4px 4px 12px;
	font-size: 16px;
}
.hop-loc
{
	background: #fff;
	border-radius: var(--bo);
	padding: 14px;
	margin-bottom: 12px;
}
.hop-loc-tieu-de
{
	font-weight: 700;
	margin-bottom: 8px;
}
.ds-loc
{
	list-style: none;
	margin: 0;
	padding: 0;
}
.ds-loc a
{
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 6px 0;
	font-size: 13.5px;
}
.ds-loc a i
{
	width: 16px;
	color: #b0b6c1;
}
.ds-loc a.chon
{
	color: var(--cam);
	font-weight: 600;
}
.ds-loc a em
{
	margin-left: auto;
	font-style: normal;
	font-size: 12px;
	color: var(--xam);
}
.o-chon
{
	width: 16px;
	height: 16px;
	border: 1.5px solid #c3c8d1;
	border-radius: 4px;
	flex-shrink: 0;
}
.ds-loc a.chon .o-chon
{
	border-color: var(--cam);
	background: var(--cam) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='white' stroke-width='2.5' d='M3.5 8.5l3 3 6-7'/%3E%3C/svg%3E") center / 12px no-repeat;
}
.ds-loc-gon li:nth-child(n+9)
{
	display: none;
}
.ds-loc-gon.het li
{
	display: list-item;
}
.loc-gia-tu-nhap
{
	display: flex;
	gap: 6px;
	align-items: center;
	margin-top: 8px;
}
.loc-gia-tu-nhap input
{
	min-width: 0;
}
.thanh-cong-cu
{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	background: #fff;
	border-radius: var(--bo);
	padding: 10px 14px;
	margin-bottom: 12px;
}
.tcc-trai
{
	display: flex;
	align-items: center;
	gap: 10px;
}
.tcc-dem
{
	color: var(--xam);
}
.tcc-sap-xep
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
}
.tcc-sap-xep a
{
	padding: 5px 12px;
	border-radius: 6px;
	background: var(--nen);
	font-size: 13px;
}
.tcc-sap-xep a.chon
{
	background: var(--cam);
	color: #fff;
}
.mo-ta-dm
{
	background: #fff;
	border-radius: var(--bo);
	padding: 16px;
	margin-bottom: 20px;
	color: var(--xam);
}
.phan-trang
{
	margin: 20px 0;
}
.page-link
{
	color: var(--chu);
	border-radius: 8px !important;
	margin: 0 3px;
	border-color: var(--vien);
	min-width: 38px;
	text-align: center;
}
.page-item.active .page-link
{
	background: var(--cam);
	border-color: var(--cam);
}
.gh-tim-thay
{
	background: #fff;
	border-radius: var(--bo);
	padding: 12px 14px;
	margin-bottom: 12px;
}
.gh-tim-tieu-de
{
	font-weight: 600;
	margin-bottom: 8px;
}
.gh-dong
{
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px;
	border: 1px solid var(--vien);
	border-radius: 8px;
}
.gh-dong img
{
	width: 48px;
	height: 48px;
	object-fit: contain;
	border-radius: 50%;
	border: 1px solid var(--vien);
}
.gh-dong span
{
	min-width: 0;
}
.gh-dong b, .gh-dong small
{
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.gh-dong small
{
	color: var(--xam);
}

/* ---- Chi tiết sản phẩm ---- */
.ct-sp
{
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
	background: #fff;
	border-radius: var(--bo);
	padding: 16px;
	margin-top: 8px;
}
@media (min-width: 768px)
{
	.ct-sp
	{
		grid-template-columns: 1fr 1fr;
	}
}
@media (min-width: 1200px)
{
	.ct-sp
	{
		grid-template-columns: 5fr 5fr 3.2fr;
		gap: 24px;
		padding: 20px;
	}
}
.anh-chinh
{
	display: block;
	position: relative;
	aspect-ratio: 1 / 1;
	border: 1px solid var(--vien);
	border-radius: var(--bo);
	overflow: hidden;
	background: #fff;
	cursor: zoom-in;
}
.anh-chinh img
{
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.anh-goi-y
{
	text-align: center;
	color: var(--xam);
	font-size: 12px;
	margin-top: 6px;
}
.ct-sp-ten
{
	font-size: 22px;
	font-weight: 700;
	line-height: 1.35;
	color: var(--dam);
	margin-bottom: 8px;
}
.ct-sp-meta
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px 16px;
	font-size: 13px;
	color: var(--xam);
	padding-bottom: 12px;
	border-bottom: 1px dashed var(--vien);
}
.ct-sp-gia
{
	background: var(--cam-nhat);
	border-radius: var(--bo);
	padding: 12px 16px;
	margin: 14px 0;
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 10px;
}
.ct-sp-gia b
{
	font-size: 28px;
	color: var(--cam);
	font-weight: 700;
}
.ct-sp-gia b.lien-he
{
	color: var(--xanh);
	font-size: 24px;
}
.ct-sp-gia del
{
	color: #9aa1ad;
}
.ct-sp-gia small
{
	color: var(--xam);
}
.ct-sp-mo-ta
{
	font-size: 13.5px;
	color: var(--chu);
	margin-bottom: 12px;
}
.ct-sp-thuoc-tinh
{
	list-style: none;
	padding: 0;
	margin: 0 0 14px;
}
.ct-sp-thuoc-tinh li
{
	display: flex;
	gap: 10px;
	padding: 5px 0;
	font-size: 13.5px;
}
.ct-sp-thuoc-tinh li span
{
	width: 110px;
	color: var(--xam);
	flex-shrink: 0;
}
.ct-sp-mua
{
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 12px;
}
.so-luong
{
	display: inline-flex;
	border: 1px solid var(--vien);
	border-radius: 8px;
	overflow: hidden;
	height: 46px;
}
.so-luong button
{
	width: 38px;
	border: 0;
	background: var(--nen);
	font-size: 18px;
}
.so-luong input
{
	width: 52px;
	border: 0;
	text-align: center;
	font-weight: 600;
	-moz-appearance: textfield;
}
.so-luong input::-webkit-outer-spin-button, .so-luong input::-webkit-inner-spin-button
{
	-webkit-appearance: none;
	margin: 0;
}
.so-luong-nho
{
	height: 34px;
}
.so-luong-nho button
{
	width: 30px;
	font-size: 15px;
}
.so-luong-nho input
{
	width: 42px;
}
.nut-them-gio
{
	height: 46px;
	padding: 0 16px;
}
.nut-mua-ngay
{
	flex: 1;
	min-width: 180px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	line-height: 1.2;
	height: 46px;
}
.nut-mua-ngay small
{
	font-size: 11px;
	font-weight: 400;
	opacity: .9;
}
.ct-sp-goi
{
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.ct-sp-goi .btn-xanh
{
	display: flex;
	align-items: center;
	flex: 1;
	min-width: 200px;
	justify-content: center;
	line-height: 1.2;
	padding: 8px 14px;
}
.ct-sp-goi .btn-xanh span
{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
.ct-sp-goi small
{
	font-size: 11px;
	font-weight: 400;
}
.ct-sp-tag
{
	margin-top: 14px;
	font-size: 13px;
	color: var(--xam);
}
.hop-nguoi-ban, .hop-chinh-sach
{
	border: 1px solid var(--vien);
	border-radius: var(--bo);
	padding: 14px;
	margin-bottom: 12px;
}
.hnb-dau
{
	display: flex;
	gap: 12px;
	align-items: center;
	padding-bottom: 12px;
	border-bottom: 1px dashed var(--vien);
}
.hnb-logo
{
	width: 64px;
	height: 64px;
	border-radius: 50%;
	border: 1px solid var(--vien);
	overflow: hidden;
	flex-shrink: 0;
	background: #fff;
}
.hnb-logo img
{
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.hnb-logo-chu
{
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24px;
	color: var(--xam);
}
.hnb-ten
{
	display: block;
	font-weight: 700;
	font-size: 15px;
	line-height: 1.3;
}
.hnb-loai
{
	font-size: 12px;
	color: var(--xam);
}
.nhan-dam-bao
{
	display: inline-flex;
	gap: 4px;
	align-items: center;
	font-size: 11.5px;
	font-weight: 600;
	color: var(--xanh);
	background: #e6f7f5;
	border-radius: 999px;
	padding: 2px 8px;
	margin-top: 4px;
}
.hnb-tt
{
	list-style: none;
	padding: 10px 0;
	margin: 0;
	font-size: 13px;
}
.hnb-tt li
{
	display: flex;
	gap: 8px;
	padding: 3px 0;
}
.hnb-tt i
{
	width: 16px;
	color: var(--cam);
	margin-top: 3px;
}
.hnb-nut
{
	display: flex;
	gap: 8px;
}
.hnb-nut .btn
{
	flex: 1;
}
.hcs-muc
{
	display: flex;
	gap: 10px;
	align-items: flex-start;
	padding: 7px 0;
	font-size: 13px;
}
.hcs-muc i
{
	color: var(--cam);
	width: 20px;
	font-size: 16px;
	margin-top: 2px;
}
.ct-sp-duoi
{
	background: #fff;
	border-radius: var(--bo);
	padding: 16px 20px;
	margin-top: 16px;
}
.tab-sp .nav-link
{
	color: var(--chu);
	font-weight: 600;
}
.tab-sp .nav-link.active
{
	color: var(--cam);
	border-bottom-color: #fff;
}
.tab-sp + .tab-content
{
	padding-top: 16px;
}
.noi-dung-html
{
	line-height: 1.7;
	overflow-wrap: anywhere;
}
.noi-dung-html img
{
	max-width: 100% !important;
	height: auto !important;
}
.noi-dung-html table
{
	max-width: 100%;
}
.noi-dung-html iframe
{
	max-width: 100%;
}
.thu-gon.dang-gon
{
	max-height: 520px;
	overflow: hidden;
	position: relative;
}
.thu-gon.dang-gon::after
{
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 90px;
	background: linear-gradient(rgba(255, 255, 255, 0), #fff);
}
.nut-xem-them
{
	display: block;
	margin: 12px auto 0;
}
.thanh-mua-di-dong
{
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1020;
	display: flex;
	background: #fff;
	box-shadow: 0 -4px 16px rgba(0, 0, 0, .08);
}
.tmd-goi
{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 8px 18px;
	color: var(--xanh);
	font-size: 12px;
	border-right: 1px solid var(--vien);
}
.tmd-mua
{
	flex: 1;
	border: 0;
	background: var(--cam);
	color: #fff;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 14px;
}
.tmd-mua:hover
{
	color: #fff;
}
.trang-sp .goi-nhanh
{
	display: none !important;
}
@media (max-width: 991.98px)
{
	.trang-sp .chan-trang
	{
		padding-bottom: 70px;
	}
}

/* ---- Tin tức ---- */
.bo-cuc-tin
{
	display: grid;
	grid-template-columns: 1fr;
	gap: 20px;
	margin: 8px 0 24px;
}
@media (min-width: 992px)
{
	.bo-cuc-tin
	{
		grid-template-columns: minmax(0, 1fr) 300px;
	}
}
.cot-chinh-tin
{
	background: #fff;
	border-radius: var(--bo);
	padding: 18px;
}
.tieu-de-tin-trang
{
	font-size: 24px;
	font-weight: 700;
	margin-bottom: 14px;
}
.tin-dong
{
	display: grid;
	grid-template-columns: 130px 1fr;
	gap: 14px;
	padding: 14px 0;
	border-bottom: 1px solid var(--vien);
}
@media (min-width: 768px)
{
	.tin-dong
	{
		grid-template-columns: 240px 1fr;
	}
}
.tin-dong-anh
{
	aspect-ratio: 16 / 10;
	border-radius: 8px;
	overflow: hidden;
	background: var(--nen);
}
.tin-dong-anh img
{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.tin-dong h2
{
	font-size: 17px;
	font-weight: 700;
	line-height: 1.4;
	margin-bottom: 6px;
}
.tin-dong p
{
	color: var(--xam);
	margin: 6px 0 0;
	font-size: 13.5px;
}
.tin-meta
{
	display: flex;
	gap: 14px;
	font-size: 12.5px;
	color: var(--xam);
}
.bai-viet h1
{
	font-size: 26px;
	font-weight: 700;
	line-height: 1.35;
	margin-bottom: 8px;
}
.bai-sapo
{
	font-weight: 600;
	margin: 14px 0;
	color: var(--dam);
}
.cot-tin .hop-cot
{
	background: #fff;
	border-radius: var(--bo);
	padding: 14px;
	margin-bottom: 14px;
}
.hop-cot-tieu-de
{
	font-weight: 700;
	margin-bottom: 8px;
	padding-bottom: 8px;
	border-bottom: 2px solid var(--cam);
	display: inline-block;
}
.ds-cot
{
	list-style: none;
	padding: 0;
	margin: 0;
}
.ds-cot a
{
	display: block;
	padding: 6px 0;
	border-bottom: 1px dashed var(--vien);
}
.tin-nho
{
	display: flex;
	gap: 10px;
	padding: 8px 0;
	font-size: 13px;
	line-height: 1.4;
}
.tin-nho img
{
	width: 80px;
	height: 56px;
	object-fit: cover;
	border-radius: 6px;
	flex-shrink: 0;
}
.hop-tim-tin
{
	display: flex;
	gap: 6px;
	margin-bottom: 14px;
}

/* ---- Danh sách gian hàng ---- */
.loc-gh
{
	display: grid;
	grid-template-columns: 1fr;
	gap: 8px;
	background: #fff;
	padding: 12px;
	border-radius: var(--bo);
}
@media (min-width: 768px)
{
	.loc-gh
	{
		grid-template-columns: 2fr 1fr 1fr auto;
	}
}
.luoi-gh
{
	display: grid;
	grid-template-columns: 1fr;
	gap: 10px;
}
@media (min-width: 576px)
{
	.luoi-gh
	{
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media (min-width: 992px)
{
	.luoi-gh
	{
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}
.gh-o
{
	display: flex;
	gap: 12px;
	align-items: center;
	background: #fff;
	border: 1px solid var(--vien);
	border-radius: var(--bo);
	padding: 12px;
}
.gh-o:hover
{
	border-color: var(--cam);
}
.gh-o-uy-tin
{
	border-color: #ffd2bf;
	background: linear-gradient(180deg, #fff, #fff8f4);
}
.gh-o-logo
{
	width: 72px;
	height: 72px;
	border-radius: 50%;
	border: 1px solid var(--vien);
	overflow: hidden;
	flex-shrink: 0;
	background: #fff;
}
.gh-o-logo img
{
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.gh-o-than
{
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.gh-o-than b
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.gh-o-than small
{
	color: var(--xam);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ---- Form, thông báo ---- */
.hop-form
{
	background: #fff;
	border-radius: var(--bo);
	padding: 20px;
	margin: 12px 0 20px;
}
.hop-form h1
{
	font-size: 24px;
	font-weight: 700;
}
.hop-form-rong
{
	max-width: 920px;
	margin-left: auto;
	margin-right: auto;
}
.hop-form-hep
{
	max-width: 480px;
	margin-left: auto;
	margin-right: auto;
}
.nhom-form
{
	border: 1px solid var(--vien);
	border-radius: var(--bo);
	padding: 14px 16px 18px;
	margin-bottom: 16px;
}
.nhom-form legend
{
	float: none;
	width: auto;
	font-size: 15px;
	font-weight: 700;
	padding: 0 6px;
	margin: 0;
}
.o-captcha
{
	display: flex;
	gap: 8px;
	align-items: center;
}
.o-captcha img
{
	border-radius: 6px;
	cursor: pointer;
	border: 1px solid var(--vien);
	flex-shrink: 0;
}
.ds-lien-he
{
	list-style: none;
	padding: 0;
}
.ds-lien-he li
{
	display: flex;
	gap: 10px;
	padding: 6px 0;
}
.ds-lien-he i
{
	color: var(--cam);
	width: 18px;
	margin-top: 3px;
}
.hop-thong-bao
{
	max-width: 720px;
	margin: 30px auto;
	background: #fff;
	border-radius: var(--bo);
	padding: 28px;
	text-align: center;
	box-shadow: var(--bong);
}
.htb-icon
{
	font-size: 48px;
	color: var(--cam);
	margin-bottom: 8px;
}
.hop-ok .htb-icon
{
	color: #16a34a;
}
.hop-loi .htb-icon
{
	color: #dc2626;
}
.htb-noi-dung
{
	font-size: 15px;
	margin-bottom: 18px;
}
.htb-nut
{
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
}
.bang-don
{
	text-align: left;
}
.trang-404
{
	text-align: center;
	padding: 40px 16px 10px;
}
.so-404
{
	font-size: 96px;
	font-weight: 800;
	line-height: 1;
	background: linear-gradient(135deg, var(--cam), #ffb347);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.trang-404 h1
{
	font-size: 24px;
	font-weight: 700;
	margin-top: 8px;
}
.tim-404
{
	display: flex;
	gap: 8px;
	max-width: 480px;
	margin: 16px auto 0;
}

/* ---- Giỏ hàng ---- */
.gio-nhom
{
	background: #fff;
	border-radius: var(--bo);
	margin-bottom: 12px;
	overflow: hidden;
}
.gio-nhom-dau
{
	padding: 12px 16px;
	font-weight: 700;
	border-bottom: 1px solid var(--vien);
	background: #fcfcfd;
}
.gio-dong
{
	display: grid;
	grid-template-columns: 64px 1fr auto;
	grid-template-areas: "anh tt xoa" "anh sl tien";
	gap: 6px 12px;
	padding: 12px 16px;
	border-bottom: 1px solid var(--nen);
	align-items: center;
}
.gio-anh
{
	grid-area: anh;
}
.gio-anh img
{
	width: 64px;
	height: 64px;
	object-fit: contain;
	border: 1px solid var(--vien);
	border-radius: 8px;
}
.gio-tt
{
	grid-area: tt;
	min-width: 0;
}
.gio-ten
{
	font-weight: 500;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.gio-gia
{
	color: var(--xam);
	font-size: 13px;
}
.gio-dong .so-luong
{
	grid-area: sl;
	justify-self: start;
}
.gio-thanh-tien
{
	grid-area: tien;
	font-weight: 700;
	color: var(--cam);
	text-align: right;
}
.gio-xoa
{
	grid-area: xoa;
	border: 0;
	background: none;
	color: #9aa1ad;
	justify-self: end;
}
.gio-xoa:hover
{
	color: #dc2626;
}
@media (min-width: 768px)
{
	.gio-dong
	{
		grid-template-columns: 72px 1fr auto 130px 36px;
		grid-template-areas: "anh tt sl tien xoa";
	}
}
.gio-nhom-tong
{
	text-align: right;
	padding: 10px 16px;
}
.gio-tong-hop
{
	background: #fff;
	border-radius: var(--bo);
	padding: 18px;
	position: sticky;
	top: 90px;
}
.gio-tong b
{
	font-size: 20px;
	color: var(--cam);
}
.trong-lon
{
	padding: 60px 16px;
}
.lua-chon-tt
{
	display: flex;
	gap: 10px;
	padding: 12px;
	border: 1px solid var(--vien);
	border-radius: 8px;
	margin-bottom: 8px;
	cursor: pointer;
}
.lua-chon-tt span
{
	display: flex;
	flex-direction: column;
}
.lua-chon-tt small
{
	color: var(--xam);
}
.tt-nhom
{
	margin-bottom: 10px;
}
.tt-nhom-ten
{
	font-weight: 600;
	font-size: 13px;
	margin-bottom: 4px;
}
.tt-dong
{
	display: flex;
	justify-content: space-between;
	gap: 10px;
	font-size: 13px;
	padding: 3px 0;
}
.tt-dong em
{
	color: var(--xam);
	font-style: normal;
}

/* ---- Cam kết + chân trang ---- */
.dai-cam-ket
{
	background: #fff;
	padding: 18px 0;
	margin-top: 30px;
	border-top: 1px solid var(--vien);
}
.cam-ket
{
	display: flex;
	align-items: center;
	gap: 12px;
}
.cam-ket i
{
	font-size: 26px;
	color: var(--cam);
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--cam-nhat);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	font-size: 18px;
}
.cam-ket b
{
	display: block;
	font-size: 13.5px;
}
.cam-ket span
{
	display: block;
	font-size: 12px;
	color: var(--xam);
}
.chan-trang
{
	background: #171c27;
	color: #aeb5c2;
	padding-top: 36px;
	font-size: 13.5px;
}
.chan-trang a
{
	color: #d5dae3;
}
.chan-trang a:hover
{
	color: #fff;
}
.ct-logo
{
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 20px;
	color: #fff;
	margin-bottom: 10px;
}
.ct-mo-ta
{
	color: #8f97a6;
}
.ct-lien-he
{
	list-style: none;
	padding: 0;
}
.ct-lien-he li
{
	display: flex;
	gap: 10px;
	padding: 4px 0;
}
.ct-lien-he i
{
	width: 16px;
	color: var(--cam);
	margin-top: 3px;
}
.ct-tieu-de
{
	font-size: 14.5px;
	font-weight: 700;
	color: #fff;
	margin-bottom: 12px;
}
.ct-ds
{
	list-style: none;
	padding: 0;
	margin: 0;
}
.ct-ds li
{
	padding: 4px 0;
}
.dang-ky-tin
{
	margin-top: 14px;
}
.dang-ky-tin .form-label
{
	color: #fff;
	font-weight: 600;
}
.ct-ho-tro
{
	border-top: 1px solid #2a3140;
	margin-top: 26px;
	padding-top: 22px;
}
.ht-bo-phan
{
	font-weight: 600;
	color: #fff;
	margin-bottom: 6px;
}
.hop-form .ht-bo-phan
{
	color: var(--dam);
}
.ht-ds
{
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.ht-nv
{
	display: flex;
	flex-wrap: wrap;
	gap: 6px 12px;
	align-items: center;
	font-size: 13px;
}
.ht-ten
{
	min-width: 150px;
}
.ht-zalo
{
	background: #0068ff;
	color: #fff !important;
	border-radius: 4px;
	padding: 0 6px;
	font-size: 11.5px;
	font-weight: 600;
}
.ht-wa, .ht-fb
{
	font-size: 17px;
	line-height: 1;
}
.ht-wa
{
	color: #25d366 !important;
}
.ht-fb
{
	color: #0084ff !important;
}
.ct-lien-ket, .ct-menu-duoi
{
	border-top: 1px solid #2a3140;
	margin-top: 22px;
	padding-top: 16px;
	display: flex;
	flex-wrap: wrap;
	gap: 8px 16px;
}
.ct-cuoi
{
	background: #11151e;
	margin-top: 26px;
	padding: 14px 0;
	font-size: 12.5px;
	color: #7f8898;
}
.ct-footer-html
{
	margin-bottom: 6px;
}
.goi-nhanh
{
	position: fixed;
	left: 14px;
	bottom: 18px;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: var(--xanh);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	z-index: 1010;
	box-shadow: 0 6px 18px rgba(17, 153, 142, .45);
	animation: rung 2.4s infinite;
}
.goi-nhanh:hover
{
	color: #fff;
}
@keyframes rung
{
	0%, 80%, 100%
	{
		transform: rotate(0);
	}
	85%
	{
		transform: rotate(-12deg);
	}
	90%
	{
		transform: rotate(12deg);
	}
	95%
	{
		transform: rotate(-8deg);
	}
}
.len-dau
{
	position: fixed;
	right: 14px;
	bottom: 18px;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	border: 0;
	background: var(--dam);
	color: #fff;
	opacity: 0;
	pointer-events: none;
	transition: opacity .2s;
	z-index: 1010;
}
.len-dau.hien
{
	opacity: .85;
	pointer-events: auto;
}
.trang-sp .len-dau
{
	bottom: 76px;
}
@media (min-width: 992px)
{
	.trang-sp .len-dau
	{
		bottom: 18px;
	}
}

/* ---- Mobile ---- */
@media (max-width: 991.98px)
{
	.dau-hang
	{
		flex-wrap: wrap;
		gap: 10px;
		padding: 10px 0;
	}
	.logo
	{
		flex: 1;
	}
	.logo-bieu-tuong
	{
		width: 36px;
		height: 36px;
		font-size: 17px;
	}
	.logo-chu b
	{
		font-size: 17px;
	}
	.logo-chu small
	{
		display: none;
	}
	.o-tim
	{
		order: 5;
		flex-basis: 100%;
		max-width: none;
	}
	.o-tim-nhap
	{
		padding: 8px 12px;
	}
	.cong-cu > i
	{
		font-size: 22px;
	}
	.khoi-dau h2
	{
		font-size: 17px;
	}
	.ct-sp-ten
	{
		font-size: 19px;
	}
	.ct-sp-gia b
	{
		font-size: 24px;
	}
	.hop-form
	{
		padding: 16px;
	}
}
@media (max-width: 575.98px)
{
	.the-sp-than
	{
		padding: 7px 8px 9px;
	}
	.the-sp-ten
	{
		font-size: 13px;
	}
	.the-sp-gia b
	{
		font-size: 14px;
	}
	.cam-ket
	{
		flex-direction: column;
		text-align: center;
	}
	.tieu-de-trang h1
	{
		font-size: 20px;
	}
}
.trang-tam-dong
{
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 100vh;
}
.hop-tam-dong
{
	text-align: center;
	padding: 30px;
}
.loc-gia-tu-nhap .btn
{
	white-space: nowrap;
}
.hnb-nut .btn
{
	white-space: nowrap;
	font-size: 12.5px;
	padding-left: 6px;
	padding-right: 6px;
}
