/* =========================================================================
   Trang sản phẩm chi tiết — đè style theo ngôn ngữ của trang chủ (home.css).
   Nạp SAU main.css và CHỈ khi is_product(). Không nhồi vào main.css: file đó
   mọi trang đều phải tải.

   GIỮ NGUYÊN cấu trúc DOM và tên lớp solus- của template. File này chỉ đổi
   cách trình bày: tiêu đề 900 nén chữ, thẻ bo 14px viền #dfe8d9, nút pill,
   số tabular, giá màu xanh #3f7d15 như dải sản phẩm trang chủ, nhãn mục có
   chấm và gạch dẫn như "HÌNH ẢNH TẠI KHO".

   Mọi selector đều đứng sau .solus-product-page để thắng rule (0,1,0) của
   main.css mà không cần !important. Ngoại lệ duy nhất: nút "Thêm vào giỏ",
   main.css đã khoá bằng !important nên phải !important lại.
   ========================================================================= */

.solus-product-page {
	--kl-xanh: #55a61d;
	--kl-xanh-chu: #3f7d15;
	--kl-xanh-sang: #6fbf2a;
	--kl-giay: #fff;
	--kl-muc: #1c2b21;
	--kl-muc-2: #5b6d64;
	--kl-vien: #dfe8d9;
	--kl-bo: 14px;
	--kl-bong: 0 2px 10px rgba(28, 43, 33, .05);
	padding: 16px 0 48px;
}

/* Đã bỏ cột phải: layout còn một cột, nội dung trải hết bề ngang container. */
.solus-product-page .solus-product-detail__layout { display: block; }

/* ---------- NHÃN DẪN + TIÊU ĐỀ ---------- */
.kl-spct__nhan {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 12px;
	margin: 2px 0 8px;
	font-size: 11.5px;
	font-weight: 800;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--kl-xanh-chu);
}
.kl-spct__nhan i { display: block; width: 24px; height: 2px; border-radius: 2px; background: var(--kl-xanh); }
.kl-spct__nhan a { color: inherit; text-decoration: none; }
.kl-spct__nhan a:hover { color: var(--kl-xanh); text-decoration: none; }
.kl-spct__nhan span { font-weight: 700; letter-spacing: .06em; color: #9aa5a0; font-variant-numeric: tabular-nums; }

.solus-product-page .solus-product-detail__title {
	margin: 0 0 20px;
	font-size: clamp(24px, 3vw, 34px);
	font-weight: 900;
	letter-spacing: -.025em;
	line-height: 1.15;
	color: var(--kl-muc);
	text-wrap: balance;
}

/* ---------- GALLERY ---------- */
.solus-product-page .solus-product-gallery__main {
	border: 1px solid var(--kl-vien);
	border-radius: var(--kl-bo);
	background: #fafbfa;
	box-shadow: var(--kl-bong);
}
.solus-product-page .solus-product-gallery__figure { padding: 4%; }
.solus-product-page .solus-product-gallery__image { border-radius: 8px; }

.solus-product-page .solus-product-gallery__nav {
	width: 36px;
	height: 36px;
	margin-top: -18px;
	border: 1.5px solid #cfdec6;
	background: rgba(255, 255, 255, .94);
	box-shadow: 0 4px 14px rgba(0, 0, 0, .12);
	transition: border-color .2s, background .2s;
}
.solus-product-page .solus-product-gallery__nav:hover { border-color: var(--kl-xanh); background: #f2f9ec; }
.solus-product-page .solus-product-gallery__nav::before { border-color: var(--kl-xanh-chu); }
/* main.css giấu mũi tên lùi; có nút lùi thì khách khỏi phải bấm vòng hết ảnh. */
.solus-product-page .solus-product-gallery__nav--prev { display: block; left: 10px; }

.solus-product-page .solus-product-gallery__thumb {
	border: 1.5px solid var(--kl-vien);
	border-radius: 10px;
	transition: border-color .2s, transform .2s;
}
.solus-product-page .solus-product-gallery__thumb:hover { border-color: var(--kl-xanh-sang); transform: translateY(-2px); }
.solus-product-page .solus-product-gallery__thumb.is-active { border-color: var(--kl-xanh-chu); box-shadow: inset 0 0 0 1px var(--kl-xanh-chu); }
.solus-product-page .solus-product-gallery__thumb img { border-radius: 7px; }

/* ---------- HÀNG ĐẦU CỘT MUA: tình trạng bên trái, chia sẻ bên phải ---------- */
.solus-product-page .kl-spct__dau {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px 14px;
}
.solus-product-page .kl-spct__dau > .solus-product-summary__meta { flex: 0 1 auto; }

/* ---------- META: chip tròn ---------- */
.solus-product-page .solus-product-summary__meta { flex-direction: row; flex-wrap: wrap; gap: 8px; }
.solus-product-page .solus-product-summary__meta li {
	gap: 5px;
	padding: 5px 12px;
	border: 1px solid var(--kl-vien);
	border-radius: 99px;
	background: var(--kl-giay);
	font-size: 12.5px;
}
.solus-product-page .solus-product-summary__meta-label { color: #8a978d; }
.solus-product-page .solus-product-summary__meta strong { font-weight: 700; color: var(--kl-muc); }
.solus-product-page .solus-product-summary__meta li:has(.solus-product-summary__stock--in) { border-color: #cfe6b6; background: #eef7e5; }
.solus-product-page .solus-product-summary__meta li:has(.solus-product-summary__stock--out) { border-color: #f3c2c0; background: #fdeeed; }
.solus-product-page .solus-product-summary__meta .solus-product-summary__stock--in { color: var(--kl-xanh-chu) !important; }

/* ---------- Ô GIÁ (hàng KHÔNG có thang bậc) ---------- */
.solus-product-page .solus-product-summary__price-box {
	border: 1px solid var(--kl-vien);
	border-radius: 12px;
	background: #f7faf5;
}
.solus-product-page .solus-product-summary__price .solus-price__sale,
.solus-product-page .solus-product-summary__price .solus-price__sale .woocommerce-Price-amount,
.solus-product-page .solus-product-summary__price .solus-price__sale .woocommerce-Price-amount bdi,
.solus-product-page .solus-product-summary__price .solus-price__current,
.solus-product-page .solus-product-summary__price .solus-price__current .woocommerce-Price-amount,
.solus-product-page .solus-product-summary__price .solus-price__current .woocommerce-Price-amount bdi {
	font-weight: 900;
	letter-spacing: -.02em;
	color: var(--kl-xanh-chu);
	font-variant-numeric: tabular-nums;
}
.solus-product-page .mg-sp__dvt { font-size: 13px; font-weight: 700; color: #9aa5a0; }
.solus-product-page .mg-sp__lienhe {
	margin: 0;
	padding: 12px 14px;
	border: 1px dashed #c7d8bc;
	border-radius: 12px;
	background: #f7faf5;
	font-size: 13.5px;
	color: var(--kl-muc-2);
}

/* ---------- THANG BẬC GIÁ: dựng như bảng giá trang chủ ----------
   Đầu bảng nền xanh đậm (cùng gradient khối .kl-gia), thân trắng, chân xám
   nhạt — khách vừa thấy ở trang chủ thì ở đây gặp lại đúng cái bảng đó. */
.solus-product-page .mg-sp__bac {
	margin-top: 0;
	padding: 0;
	overflow: hidden;
	border: 1px solid var(--kl-vien);
	border-radius: var(--kl-bo);
	background: var(--kl-giay);
	box-shadow: 0 16px 34px -26px rgba(28, 43, 33, .45);
}
.solus-product-page .mg-sp__bac-nhan {
	margin: 0;
	padding: 11px 16px;
	background: linear-gradient(135deg, #58ab1e 0%, #55a61d 55%, #4a9419 100%);
	color: #fff;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
}
.solus-product-page .mg-sp__bac-list { padding: 2px 16px 0; }
.solus-product-page .mg-sp__bac-row { padding: 10px 0; font-size: 13.5px; color: var(--kl-muc-2); }
.solus-product-page .mg-sp__bac-row + .mg-sp__bac-row { border-top: 1px solid #f0f3f0; }
.solus-product-page .mg-sp__bac-moc { font-weight: 600; }
.solus-product-page .mg-sp__bac-gia { font-weight: 900; letter-spacing: -.02em; color: var(--kl-muc); }
.solus-product-page .mg-sp__bac-gia i { font-size: 12px; font-weight: 700; color: #9aa5a0; }
.solus-product-page .mg-sp__bac-row.is-dang-ap { padding: 12px 0 14px; }
.solus-product-page .mg-sp__bac-row.is-dang-ap .mg-sp__bac-moc { font-weight: 800; color: var(--kl-xanh-chu); }
.solus-product-page .mg-sp__bac-row.is-dang-ap .mg-sp__bac-gia {
	font-size: 30px;
	line-height: 1.05;
	letter-spacing: -.03em;
	color: var(--kl-xanh-chu);
}
.solus-product-page .mg-sp__bac-row.is-dang-ap .mg-sp__bac-gia i { font-size: 13px; }
.solus-product-page .mg-sp__bac-ghi {
	margin: 0;
	padding: 10px 16px 12px;
	border-top: 1px solid #e0e0e0;
	background: #f7faf5;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.5;
	color: #6b7a72;
}

/* ---------- SỐ LƯỢNG + NÚT ---------- */
.solus-product-page .solus-product-actions__qty-label {
	font-size: 11.5px;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #6b7a72;
}
/* Vùng chạm 44px theo PRODUCT.md. Nút cũ 32px, ngón tay bấm trượt sang ô số. */
.solus-product-page .solus-product-summary__purchase .quantity { gap: 10px; }
.solus-product-page .solus-product-summary__purchase .quantity .qty {
	width: 74px;
	height: 44px;
	border: 1.5px solid #c7d8bc;
	border-radius: 99px;
	font-size: 16px;
	font-weight: 800;
	color: var(--kl-muc);
	font-variant-numeric: tabular-nums;
	transition: border-color .2s, box-shadow .2s;
}
.solus-product-page .solus-product-summary__purchase .quantity .qty:focus {
	outline: 0;
	border-color: var(--kl-xanh);
	box-shadow: 0 0 0 3px rgba(85, 166, 29, .18);
}
.solus-product-page .solus-product-summary__purchase .quantity .minus,
.solus-product-page .solus-product-summary__purchase .quantity .plus {
	width: 44px;
	height: 44px;
	min-width: 44px;
	border: 1.5px solid #c7d8bc;
	border-radius: 50%;
	background: #eef7e5;
	color: var(--kl-xanh-chu);
	font-size: 20px;
	font-weight: 800;
	line-height: 1;
}
.solus-product-page .solus-quantity__steppers { gap: 10px; }
.solus-product-page .solus-product-summary__purchase .quantity .minus:hover,
.solus-product-page .solus-product-summary__purchase .quantity .plus:hover { border-color: var(--kl-xanh-chu); background: var(--kl-xanh-chu); color: #fff; }
.solus-product-page .solus-product-summary__purchase .quantity .minus:focus-visible,
.solus-product-page .solus-product-summary__purchase .quantity .plus:focus-visible { outline: 2px solid var(--kl-xanh); outline-offset: 2px; }

.solus-product-page .solus-product-summary__buy-now {
	min-height: 54px;
	border-radius: 99px;
	background: var(--kl-xanh-chu);
	box-shadow: 0 12px 28px -12px rgba(63, 125, 21, .95);
	transition: background .24s cubic-bezier(.2, .7, .3, 1), transform .24s cubic-bezier(.2, .7, .3, 1);
}
.solus-product-page .solus-product-summary__buy-now:hover { background: var(--kl-xanh); transform: translateY(-2px); }
.solus-product-page .solus-product-summary__buy-main { font-size: 15px; font-weight: 800; letter-spacing: .02em; }
.solus-product-page .solus-product-summary__buy-sub { font-size: 11px; font-weight: 500; opacity: .9; }

.solus-product-page .solus-product-summary__add-cart {
	height: 54px;
	border: 1.5px solid #c7d8bc !important;
	border-radius: 99px !important;
	background: rgba(255, 255, 255, .7) !important;
	color: var(--kl-xanh-chu) !important;
	transition: border-color .24s, background .24s, transform .24s cubic-bezier(.2, .7, .3, 1);
}
.solus-product-page .solus-product-summary__add-cart:hover { border-color: var(--kl-xanh) !important; background: #fff !important; transform: translateY(-2px); }
.solus-product-page .solus-product-summary__add-cart-text { font-weight: 800; color: var(--kl-xanh-chu); }
.solus-product-page .solus-product-summary__add-cart-icon { color: var(--kl-xanh-chu); }

/* ---------- MIỄN PHÍ GIAO HÀNG: thẻ như ba thẻ chứng nhận .kl-the ---------- */
.solus-product-page .solus-product-coupons {
	margin: 0;
	padding: 16px 18px 15px;
	border: 1px solid var(--kl-vien);
	border-radius: var(--kl-bo);
	background: linear-gradient(180deg, #fff 0%, #f4faef 100%);
	box-shadow: var(--kl-bong);
}
.solus-product-page .solus-product-coupons__badge {
	position: static;
	gap: 12px;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	font-size: 15.5px;
	font-weight: 800;
	letter-spacing: -.012em;
	color: var(--kl-muc);
}
.solus-product-page .solus-product-coupons__badge-icon {
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	border: 1px solid #d3e8c0;
	border-radius: 12px;
	background: #eef7e5;
	color: var(--kl-xanh-chu);
}
.solus-product-page .mg-freeship__main,
.solus-product-page .mg-freeship__sub,
.solus-product-page .mg-freeship__note { padding-left: 52px; color: var(--kl-muc-2); opacity: 1; }
.solus-product-page .mg-freeship__main { margin: 8px 0 2px; font-size: 14.5px; }
.solus-product-page .mg-freeship__main strong { font-weight: 800; color: var(--kl-muc); font-variant-numeric: tabular-nums; }
.solus-product-page .mg-freeship__sub { margin: 0 0 8px; font-size: 13.5px; }
.solus-product-page .mg-freeship__note { font-size: 12.5px; color: #8a978d; }

/* ---------- THÔNG TIN CHI TIẾT: nhãn chấm + gạch như "HÌNH ẢNH TẠI KHO" ---------- */
.solus-product-page .solus-product-details {
	border: 1px solid var(--kl-vien);
	border-radius: var(--kl-bo);
	box-shadow: var(--kl-bong);
}
.solus-product-page .solus-product-details__title {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 16px 18px 0;
	border: 0;
	background: var(--kl-giay);
	font-size: 13px;
	font-weight: 900;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--kl-muc);
}
.solus-product-page .solus-product-details__title::before {
	content: "";
	flex: 0 0 auto;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: #55a61d;
}
.solus-product-page .solus-product-details__title::after { content: ""; flex: 1; height: 1px; background: #e0e0e0; }
.solus-product-page .solus-product-details__content { padding: 14px 18px 20px; }

/* ---------- CỘT PHẢI ---------- */
.solus-product-page .solus-product-widget {
	padding: 15px 15px 14px;
	border: 1px solid var(--kl-vien);
	border-radius: var(--kl-bo);
	box-shadow: var(--kl-bong);
}
.solus-product-page .solus-product-widget__title {
	display: flex;
	align-items: center;
	gap: 9px;
	font-size: 12.5px;
	font-weight: 900;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--kl-muc);
}
.solus-product-page .solus-product-widget__title::before {
	content: "";
	flex: 0 0 auto;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #55a61d;
}
/* Có hàng nút bên phải thì bớt giãn chữ để "SẢN PHẨM CÙNG LOẠI" nằm gọn một dòng
   trong 250px của cột — giãn .1em là gãy chữ "LOẠI" xuống dòng hai. */
.solus-product-page .solus-product-widget__head .solus-product-widget__title { font-size: 12px; letter-spacing: .07em; }
.solus-product-page .solus-product-widget__nav { flex: 0 0 auto; }
/* Widget không có hàng nút thì tiêu đề tự kéo gạch tới mép phải. */
.solus-product-page .solus-product-widget > .solus-product-widget__title { margin-bottom: 12px; }
.solus-product-page .solus-product-widget > .solus-product-widget__title::after { content: ""; flex: 1; height: 1px; background: #e0e0e0; }

.solus-product-page .solus-product-widget__nav-btn {
	width: 28px;
	height: 28px;
	border: 1.5px solid #cfdec6;
	border-radius: 50%;
	background: var(--kl-giay);
}
.solus-product-page .solus-product-widget__nav-btn::before { width: 6px; height: 6px; border-color: var(--kl-xanh-chu); }
.solus-product-page .solus-product-widget__nav-btn:hover:not(:disabled) { border-color: var(--kl-xanh); background: #f2f9ec; }

.solus-product-page .solus-product-widget__item { gap: 11px; padding: 9px 0; border-bottom: 1px solid #f0f3f0; }
.solus-product-page .solus-product-widget__thumb {
	width: 60px;
	height: 56px;
	border: 1px solid var(--kl-vien);
	border-radius: 9px;
	background: #eef2ee;
}
.solus-product-page .solus-product-widget__thumb img { transition: transform .5s cubic-bezier(.2, .7, .3, 1); }
.solus-product-page .solus-product-widget__item:hover .solus-product-widget__thumb img { transform: scale(1.08); }
/* Ảnh mặc định là hình vẽ nét: thu nhỏ, canh giữa, đừng phủ kín ô. */
.solus-product-page .solus-product-widget__thumb img[src*="placeholder"] { width: 60%; height: 60%; margin: 20%; object-fit: contain; opacity: .5; }
.solus-product-page .solus-product-widget__badge { border-radius: 0 0 8px 0; background: #e03131; font-weight: 800; }
.solus-product-page .solus-product-widget__name {
	font-size: 13.5px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: -.01em;
	color: var(--kl-muc);
}
.solus-product-page .solus-product-widget__name:hover { color: var(--kl-xanh-chu); }
.solus-product-page .solus-product-widget__price {
	font-size: 13.5px;
	font-weight: 900;
	letter-spacing: -.02em;
	color: var(--kl-xanh-chu);
	font-variant-numeric: tabular-nums;
}
.solus-product-page .solus-product-widget__price del { color: #9aa5a0; font-weight: 500; }
/* Cột chữ phải GIÃN hết bề ngang thì canh phải mới có nghĩa: main.css để
   __info flex:0 1 auto nên nó chỉ rộng bằng chữ, giá dừng so le mỗi dòng
   một chỗ. Cho giãn để ba giá thẳng một mép phải. */
.solus-product-page .solus-product-widget__info { flex: 1 1 auto; min-width: 0; }
/* Giá (kèm ₫) canh phải, sát mép card — số thẳng cột dễ liếc. */
.solus-product-page .solus-product-widget__price { display: block; text-align: right; }

.solus-product-page .solus-product-widget__more {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	margin-top: 12px;
	padding: 9px 16px;
	border: 1.5px solid #e0e0e0;
	border-radius: 99px;
	background: var(--kl-giay);
	color: var(--kl-xanh-chu);
	font-size: 13px;
	font-weight: 800;
	transition: border-color .22s, transform .22s;
}
.solus-product-page .solus-product-widget__more::after { content: "→"; transition: transform .25s; }
.solus-product-page .solus-product-widget__more:hover { border-color: var(--kl-xanh); color: var(--kl-xanh-chu); transform: translateY(-2px); }
.solus-product-page .solus-product-widget__more:hover::after { transform: translateX(4px); }

/* ---------- CÂN BẰNG HÀNG NÚT ----------
   main.css cho MUA NGAY flex:1 còn Thêm vào giỏ min-width 116px cố định, nên nút
   giỏ teo nhỏ lọt thỏm bên phải để hở một khoảng. Cho cả hai nút CÙNG co giãn lấp
   đầy hàng, MUA NGAY nhỉnh hơn (nút chính) theo tỉ lệ ~1,5 : 1. */
.solus-product-page .solus-product-actions__cta { gap: 12px; }
.solus-product-page .solus-product-summary__buy-now { flex: 1.5 1 0; }
.solus-product-page .solus-product-summary__add-cart { flex: 1 1 0; min-width: 0 !important; }

/* ---------- CHIA SẺ SẢN PHẨM ---------- */
.solus-product-page .kl-spct__chia { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 0; }
.solus-product-page .kl-spct__chia-nhan { font-size: 11.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #6b7a72; }
.solus-product-page .kl-spct__chia-nut {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 8px 16px;
	border: 1.5px solid #c7d8bc;
	border-radius: 99px;
	background: rgba(255, 255, 255, .7);
	color: var(--kl-xanh-chu);
	font: inherit;
	font-size: 13px;
	font-weight: 800;
	line-height: 1;
	white-space: nowrap;
	cursor: pointer;
	transition: border-color .22s, background .22s, transform .22s cubic-bezier(.2, .7, .3, 1);
}
.solus-product-page .kl-spct__chia-nut:hover { border-color: var(--kl-xanh); background: #fff; transform: translateY(-2px); }
.solus-product-page .kl-spct__chia-nut:focus-visible { outline: 2px solid var(--kl-xanh); outline-offset: 2px; }
.solus-product-page .kl-spct__chia-nut svg { flex: 0 0 auto; }

/* Nút share chỉ có icon — hình tròn; báo "đã chép" bằng tooltip vì bỏ chữ. */
.solus-product-page .kl-spct__chia-nut--icon { position: relative; width: 40px; height: 40px; padding: 0; justify-content: center; }
.solus-product-page .kl-spct__chia-bao {
	position: absolute;
	bottom: calc(100% + 8px);
	left: 50%;
	transform: translateX(-50%) translateY(4px);
	padding: 5px 9px;
	border-radius: 7px;
	background: var(--kl-muc);
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
	white-space: nowrap;
	opacity: 0;
	pointer-events: none;
	transition: opacity .18s, transform .18s;
}
.solus-product-page .kl-spct__chia-bao.hien { opacity: 1; transform: translateX(-50%) translateY(0); }

/* Menu Hỏi AI — mở sẵn câu hỏi kèm link sang ChatGPT / Claude / Perplexity. */
.solus-product-page .kl-spct__ai { position: relative; }
.solus-product-page .kl-spct__ai-menu {
	position: absolute;
	top: calc(100% + 6px);
	/* Neo theo mép PHẢI: cụm chia sẻ nằm sát phải cột mua, để left:0 thì menu
	   thò khỏi khung 36px và cả trang cuộn ngang — kể cả khi menu đang ẩn,
	   vì visibility:hidden vẫn tính vào vùng cuộn. */
	right: 0;
	z-index: 20;
	min-width: 150px;
	margin: 0;
	padding: 6px;
	list-style: none;
	border: 1px solid var(--kl-vien);
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 16px 34px -18px rgba(28, 43, 33, .45);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-4px);
	transition: opacity .16s, transform .16s, visibility .16s;
}
.solus-product-page .kl-spct__ai.dang-mo .kl-spct__ai-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.solus-product-page .kl-spct__ai-menu a {
	display: block;
	padding: 8px 12px;
	border-radius: 8px;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--kl-muc);
	text-decoration: none;
}
.solus-product-page .kl-spct__ai-menu a:hover { background: #eef7e5; color: var(--kl-xanh-chu); }

/* ---------- CAROUSEL SẢN PHẨM CÙNG LOẠI (dưới mô tả) ---------- */
.solus-product-page .kl-lq { margin-top: 30px; }
.solus-product-page .kl-lq__dau { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.solus-product-page .kl-lq__h {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	font-size: 13px;
	font-weight: 900;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--kl-muc);
	white-space: nowrap;
}
.solus-product-page .kl-lq__cham { flex: 0 0 auto; width: 9px; height: 9px; border-radius: 50%; background: #55a61d; }
.solus-product-page .kl-lq__ke { flex: 1; height: 1px; background: var(--kl-vien); }
.solus-product-page .kl-lq__nut { display: flex; gap: 6px; }
.solus-product-page .kl-lq__mui {
	position: relative;
	width: 30px;
	height: 30px;
	padding: 0;
	border: 1.5px solid #cfdec6;
	border-radius: 50%;
	background: #fff;
	color: var(--kl-xanh-chu);
	cursor: pointer;
	transition: border-color .2s, background .2s;
}
.solus-product-page .kl-lq__mui:hover:not(:disabled) { border-color: var(--kl-xanh); background: #f2f9ec; }
.solus-product-page .kl-lq__mui:disabled { opacity: .35; cursor: default; }
.solus-product-page .kl-lq__mui::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 7px;
	height: 7px;
	border-top: 1.5px solid currentColor;
	border-right: 1.5px solid currentColor;
}
.solus-product-page .kl-lq__mui--prev::before { transform: translate(-30%, -50%) rotate(-135deg); }
.solus-product-page .kl-lq__mui--next::before { transform: translate(-70%, -50%) rotate(45deg); }

.solus-product-page .kl-lq__ray {
	display: flex;
	gap: 14px;
	margin: 0 -4px;
	padding: 4px 4px 6px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	-ms-overflow-style: none;
}
.solus-product-page .kl-lq__ray::-webkit-scrollbar { display: none; }
/* Cuộn vòng: bỏ snap vì thao tác dời scrollLeft xung khắc với scroll-snap. */
.solus-product-page .kl-lq--loop .kl-lq__ray { scroll-snap-type: none; }
.solus-product-page .kl-lq__ray > .kl-the {
	flex: 0 0 clamp(158px, 20vw, 196px);
	scroll-snap-align: start;
}

/* Giá trong thẻ: khuôn chuẩn .kl-the ở main.css để ĐỎ #e03131, còn dải sản phẩm
   trang chủ để xanh #3f7d15. Trang này lấy màu thanh menu làm chuẩn nên kéo về
   xanh — đè tại đây, KHÔNG sửa main.css (bản trên host mới hơn nhánh này và
   thuộc đợt danh mục). Lưu ý: thẻ ở trang danh mục vẫn đỏ. */
.solus-product-page .kl-lq__ray .kl-the__gia,
.solus-product-page .kl-lq__ray .kl-the__gia-nay,
.solus-product-page .kl-lq__ray .kl-the__gia ins {
	color: var(--kl-xanh-chu);
	text-decoration: none;
}

.solus-product-page .kl-lq__more {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 14px;
	padding: 9px 20px;
	border: 1.5px solid #e0e0e0;
	border-radius: 99px;
	background: #fff;
	color: var(--kl-xanh-chu);
	font-size: 13px;
	font-weight: 800;
	text-decoration: none;
	transition: border-color .22s, transform .22s;
}
.solus-product-page .kl-lq__more i { font-style: normal; transition: transform .25s; }
.solus-product-page .kl-lq__more:hover { border-color: var(--kl-xanh); transform: translateY(-2px); text-decoration: none; }
.solus-product-page .kl-lq__more:hover i { transform: translateX(4px); }

/* =========================================================================
   Màn hẹp
   ========================================================================= */
@media (max-width: 560px) {
	.solus-product-page { padding-top: 10px; }
	/* Mobile: mỗi hàng đúng 2 sản phẩm, phần còn lại vuốt cuộn (vòng vô tận). */
	.solus-product-page .kl-lq__ray > .kl-the { flex: 0 0 calc((100% - 14px) / 2); }
	.solus-product-page .solus-product-detail__title { margin-bottom: 14px; font-size: 23px; }
	.solus-product-page .mg-sp__bac-row.is-dang-ap .mg-sp__bac-gia { font-size: 26px; }
	.solus-product-page .solus-product-coupons { padding: 14px 15px 13px; }
	.solus-product-page .mg-freeship__main,
	.solus-product-page .mg-freeship__sub,
	.solus-product-page .mg-freeship__note { padding-left: 0; }
	.solus-product-page .solus-product-details__content { padding: 12px 15px 18px; }
	/* main.css ép MUA NGAY rộng calc(100% - 58px) ở màn hẹp, đẩy nút giỏ rớt xuống
	   đứng lẻ. Gỡ ràng buộc đó để giữ đúng một hàng: GIỎ bên trái, MUA NGAY bên
	   phải — cùng thứ tự với desktop, không phải học lại bố cục khi đổi máy. */
	.solus-product-page .solus-product-summary__buy-now { min-width: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.solus-product-page .solus-product-summary__buy-now,
	.solus-product-page .solus-product-summary__add-cart,
	.solus-product-page .solus-product-widget__more,
	.solus-product-page .kl-spct__chia-nut,
	.solus-product-page .kl-lq__ray { scroll-behavior: auto; transition: none; }
	.solus-product-page .solus-product-gallery__thumb { transition: none; }
	.solus-product-page .solus-product-summary__buy-now:hover,
	.solus-product-page .solus-product-summary__add-cart:hover,
	.solus-product-page .solus-product-widget__more:hover,
	.solus-product-page .kl-spct__chia-nut:hover,
	.solus-product-page .solus-product-gallery__thumb:hover { transform: none; }
}
