/* ==========================================================================
   VITIMEX – LỚP LÀM MỚI GIAO DIỆN (vtm-refresh.css)
   --------------------------------------------------------------------------
   Nạp SAU general.scss.css. Chỉ ghi đè, không sửa file gốc, nên muốn quay lại
   giao diện cũ chỉ cần bỏ dòng nạp file này trong snippets/preload-head.liquid.
   1. Hệ chữ (một họ Gilroy, 4 độ đậm 400/500/600/700, thang cỡ chữ thống nhất)
   2. Tiêu đề khu vực, nút bấm
   3. Trang sản phẩm: gallery, khối mua, accordion, mô tả, thanh mua dính
   4. Thẻ sản phẩm (dùng chung trang chủ / danh mục / gợi ý)
   5. Trang chủ, danh mục, breadcrumb mobile
   6. Nút nổi (liên hệ, tích điểm)
   ========================================================================== */

:root {
	--vtm-font: "SVN Gilroy", "SVN-Gilroy", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
	--vtm-ink: #0a0a0a;
	--vtm-ink-2: #374151;
	--vtm-muted: #6b7280;
	--vtm-line: #e5e7eb;
	--vtm-soft: #f5f5f5;
	--vtm-sale: #c8102e;
	--vtm-fs-body: 14px;
	--vtm-fs-read: 15px;
	--vtm-fs-small: 13px;
	--vtm-fs-h-section: 20px;
	--vtm-fs-h-page: 18px;
}
@media (min-width: 992px) {
	:root {
		--vtm-fs-read: 16px;
		--vtm-fs-h-section: 26px;
		--vtm-fs-h-page: 24px;
	}
}

/* 1. HỆ CHỮ ================================================================ */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	font-synthesis: none;
	font-feature-settings: "kern" 1;
}
/* Chữ đọc dài: dùng Regular 400 thay vì Medium 500 để thoáng, dễ đọc */
.description-productdetail .content,
.accordion-body__contents,
.pr-infos--accordion .accordion-body,
.page-content, .article-content, .blog-content {
	font-weight: 400;
}
/* Không để letter-spacing âm làm dính dấu tiếng Việt */
h1, h2, h3, h4 { letter-spacing: normal; }

/* 2. TIÊU ĐỀ KHU VỰC + NÚT ================================================ */
.section .s-heading h2,
.section .s-title h2,
.section-collection .s-heading h2,
.section-lookbooks .s-title h2,
.section-category .s-title h2,
.productdetail-inner .s-heading h2 {
	font-size: var(--vtm-fs-h-section) !important;
	line-height: 1.25 !important;
	font-weight: 700 !important;
	text-transform: uppercase;
	letter-spacing: .02em !important;
	color: var(--vtm-ink);
}
/* Tab trong khu "Sản phẩm nổi bật" trang chủ: đồng bộ chữ hoa */
.section-tab .tablist a,
.section-tab .tablist .tabitem,
.section-collection .tablist a {
	text-transform: uppercase;
	letter-spacing: .04em;
}
.btn-vtm {
	letter-spacing: .06em;
}

/* 3. TRANG SẢN PHẨM ======================================================= */
/* 3.1 Gallery: ló mép ảnh kế tiếp để khách biết vuốt được (giữ chấm tròn, không dùng bộ đếm số) */
@media (max-width: 767px) {
	.productdetail-layout .productdetail-gallery .slider-gallery .pr-gallery--list { margin: 0 !important; }
	.productdetail-layout .productdetail-gallery .slider-gallery.swiper-initialized .pr-gallery--item { width: auto; }
	.productdetail-layout .productdetail-gallery .pr-gallery--item > .aspect-ratio img { background-color: var(--vtm-soft); }
}

/* 3.2 Khối thông tin */
.productdetail-layout .productdetail-info .pr-infos--heading .pr-title {
	font-size: var(--vtm-fs-h-page);
	line-height: 1.3;
	font-weight: 700;
	letter-spacing: .01em;
	color: var(--vtm-ink);
	margin-bottom: 8px;
}
.productdetail-layout .productdetail-info .pr-infos--prices .price {
	font-size: 20px;
	font-weight: 700;
	color: var(--vtm-ink);
}
@media (min-width: 992px) {
	.productdetail-layout .productdetail-info .pr-infos--prices .price { font-size: 24px; }
}
.productdetail-layout .productdetail-info .pr-infos--prices .price-compare,
.productdetail-layout .productdetail-info .pr-infos--prices del { color: var(--vtm-muted); font-weight: 500; }
.productdetail-layout .productdetail-info .pr-infos--prices .price-percent { color: var(--vtm-sale); font-weight: 700; }

/* Nhãn "Màu sắc / Kích thước / Form dáng / Số lượng": xám, giá trị đậm */
.productdetail-layout .pr-infos--variants .swatch-header .title,
.productdetail-layout .pr-infos--fit > span,
.productdetail-layout .pr-infos--actions .pr-quantity > span {
	font-size: var(--vtm-fs-small);
	font-weight: 500;
	color: var(--vtm-muted);
}
.productdetail-layout .pr-infos--variants .swatch-header .title span:last-child,
.productdetail-layout .pr-infos--fit > span > span {
	color: var(--vtm-ink);
	font-weight: 600;
}
.productdetail-layout .pr-infos--variants .btn-sizeguide {
	font-size: var(--vtm-fs-small);
	font-weight: 600;
	color: var(--vtm-ink);
	text-underline-offset: 3px;
}
/* Nút size: to hơn, dễ bấm (≥ 44px) */
.productdetail-layout .pr-infos--variants .select-swap--size .swatch-element label {
	min-width: 48px;
	min-height: 44px;
	font-size: 14px;
	font-weight: 600;
	color: var(--vtm-ink);
}
/* v3: size còn hàng = nền trắng viền xám chữ đen (trước đây nền xám chữ xám, trông như đã hết hàng);
   đang chọn = viền đen 2px; hết hàng = nền xám + gạch chéo. Áp dụng trang sản phẩm, khung chọn size, thanh mua dính. */
.productdetail-layout .select-swap--size .swatch-element label:not(.soldout),
.modal-sizeswatch .select-swap--size .swatch-element label:not(.soldout),
.sticky-pr .select-swap--size .swatch-element label:not(.soldout) {
	background: #fff !important;
	border: 1px solid #d1d5db !important;
	color: var(--vtm-ink) !important;
	font-weight: 600;
}
.productdetail-layout .select-swap--size .swatch-element:hover label:not(.soldout),
.modal-sizeswatch .select-swap--size .swatch-element:hover label:not(.soldout),
.sticky-pr .select-swap--size .swatch-element:hover label:not(.soldout) {
	border-color: var(--vtm-ink) !important;
}
.productdetail-layout .select-swap--size .swatch-element label.sd,
.modal-sizeswatch .select-swap--size .swatch-element label.sd,
.sticky-pr .select-swap--size .swatch-element label.sd {
	border-color: var(--vtm-ink) !important;
	box-shadow: inset 0 0 0 1px var(--vtm-ink) !important;
	font-weight: 700 !important;
}
.productdetail-layout .select-swap--size .swatch-element label:after,
.modal-sizeswatch .select-swap--size .swatch-element label:after,
.sticky-pr .select-swap--size .swatch-element label:after { display: none !important; }
.productdetail-layout .select-swap--size .swatch-element label.soldout,
.modal-sizeswatch .select-swap--size .swatch-element label.soldout,
.sticky-pr .select-swap--size .swatch-element label.soldout {
	background: var(--vtm-soft) !important;
	border: 1px solid var(--vtm-soft) !important;
	color: #9ca3af !important;
	font-weight: 500;
	opacity: 1 !important;
}
/* Khung mua nhanh: cùng kiểu chọn size */
.vtm-quickbuy__size { border-radius: 4px !important; }
.vtm-quickbuy__size.is-selected { background: #fff !important; box-shadow: inset 0 0 0 1px var(--vtm-ink); font-weight: 700; }
/* Thang phom dáng */
.productdetail-layout .pr-infos--fit .list-form-fit .item span { font-size: var(--vtm-fs-small); }

/* Nút mua chính */
.productdetail-layout .pr-controls #btn-addtocart,
.pr-infos--action-fixed #sticky-btn-addtocart {
	min-height: 48px;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .08em;
}

/* Khối chat / giao hàng / cam kết */
.productdetail-layout .pr-infos--extrainfo .pr-extrainfo span { font-size: var(--vtm-fs-small); letter-spacing: .02em; }
.productdetail-layout .pr-infos--extrainfo .pr-delivery { font-size: var(--vtm-fs-small); color: var(--vtm-ink-2); }
.productdetail-layout .pr-infos--policy .text h3 { font-size: var(--vtm-fs-small) !important; font-weight: 700 !important; }
.productdetail-layout .pr-infos--policy .text span { font-weight: 500 !important; color: var(--vtm-muted) !important; }

/* 3.3 Accordion kiểu Hugo Boss: tiêu đề chữ hoa, đen, dấu +/- */
.productdetail-layout .pr-infos--accordion { margin-top: 24px; border-bottom: 1px solid var(--vtm-line); }
.productdetail-layout .pr-infos--accordion .accordion__item { border-top: 1px solid var(--vtm-line); }
.productdetail-layout .pr-infos--accordion .accordion__item .accordion-header {
	padding: 16px 32px 16px 0;
	color: var(--vtm-ink) !important;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
}
.productdetail-layout .pr-infos--accordion .accordion__item .accordion-header:after {
	width: 16px !important;
	height: 16px !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='M2 8h12M8 2v12' stroke='%230a0a0a' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") !important;
	background-size: 16px 16px;
	transform: none !important;
}
.productdetail-layout .pr-infos--accordion .accordion__item .accordion-header.active:after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='M2 8h12' stroke='%230a0a0a' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}
.productdetail-layout .pr-infos--accordion .accordion-body { padding: 0 0 16px; }
.productdetail-layout .pr-infos--accordion .accordion-body__contents {
	font-size: 14px;
	line-height: 1.65;
	color: var(--vtm-ink-2);
}
.productdetail-layout .pr-infos--accordion .accordion-body__contents p { margin-bottom: 8px; }

/* 3.4 Mô tả chi tiết: chữ to hơn, giãn dòng, tiêu đề gọn */
.description-productdetail .expandable-detail > .container > h2 {
	font-size: var(--vtm-fs-h-section) !important;
	font-weight: 700 !important;
	text-transform: uppercase;
	letter-spacing: .02em !important;
	margin-bottom: 16px;
}
.description-productdetail .content {
	font-size: var(--vtm-fs-read) !important;
	line-height: 1.65 !important;
	color: var(--vtm-ink-2);
}
.description-productdetail .content p,
.description-productdetail .content li { font-size: inherit !important; line-height: inherit !important; }
.description-productdetail .content p { margin: 0 0 10px; }
.description-productdetail .content h2,
.description-productdetail .content h3 {
	font-size: 16px !important;
	line-height: 1.4 !important;
	font-weight: 700 !important;
	letter-spacing: .02em !important;
	text-transform: uppercase;
	color: var(--vtm-ink);
	margin: 24px 0 10px !important;
}
.description-productdetail .content p.vtm-desc-h {
	font-size: 16px !important;
	line-height: 1.4 !important;
	font-weight: 700;
	letter-spacing: .02em;
	text-transform: uppercase;
	color: var(--vtm-ink);
	margin: 24px 0 10px !important;
}
.description-productdetail .content > h2:first-child,
.description-productdetail .content > h3:first-child { margin-top: 0 !important; }
.description-productdetail .content img {
	max-width: 100%;
	height: auto;
	display: block;
	margin: 12px auto;
	background: var(--vtm-soft);
}
@media (min-width: 992px) {
	.description-productdetail .content h2,
	.description-productdetail .content h3 { font-size: 18px !important; }
}
/* Mục trùng với accordion (bảo quản / đổi trả) được JS gắn class này để ẩn */
.vtm-dup-hidden { display: none !important; }

/* 3.5 Thanh mua dính đáy: giá rõ ràng, không gạch chân */
.pr-infos--action-fixed .sticky-pr-infos--prices .price {
	font-size: 16px;
	font-weight: 700;
	text-decoration: none !important;
	color: var(--vtm-ink);
}

/* 3.6 Breadcrumb: chữ in hoa nhỏ, xám (đồng bộ dù tên danh mục trong dữ liệu viết hoa hay thường) */
.breadcrumb-wrapper .breadcrumb-list .breadcrumb-arrows {
	font-size: 11px !important;
	letter-spacing: .06em;
	text-transform: uppercase;
	line-height: 1.4;
}
.breadcrumb-wrapper .breadcrumb-list .breadcrumb-arrows > li a,
.breadcrumb-wrapper .breadcrumb-list .breadcrumb-arrows > li a span { color: var(--vtm-muted); }
.breadcrumb-wrapper .breadcrumb-list .breadcrumb-arrows > li strong { color: var(--vtm-ink); font-weight: 600; }
@media (max-width: 991px) {
	/* JS đặt breadcrumb ngay trên khối gallery, ngoài lưới có khoảng cách 24px */
	.productdetail-layout .vtm-breadcrumb-mb { display: block !important; padding: 0; margin: 0; background: transparent; }
	.productdetail-layout .vtm-breadcrumb-mb .breadcrumb-arrows { padding: 10px 0 !important; margin: 0; }
	.productdetail-layout .vtm-breadcrumb-mb .breadcrumb-arrows > li:last-child { display: none !important; }
}

/* 3.7 Dòng mã sản phẩm dưới tên */
.productdetail-layout .vtm-pr-code {
	font-size: 12px;
	color: var(--vtm-muted);
	letter-spacing: .04em;
	margin: -2px 0 10px;
}
/* Link "Hướng dẫn chọn size" có biểu tượng thước, chữ thường */
.productdetail-layout .pr-infos--variants .btn-sizeguide,
.vtm-quickbuy__sizechart {
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	text-decoration: underline;
	text-underline-offset: 3px;
	text-transform: none !important;
}
.productdetail-layout .pr-infos--variants .btn-sizeguide::before,
.vtm-quickbuy__sizechart::before {
	content: "";
	width: 18px;
	height: 18px;
	flex: 0 0 18px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%230a0a0a' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='7' width='20' height='10' rx='1.5'/%3E%3Cpath d='M6 7v3M10 7v4M14 7v3M18 7v4'/%3E%3C/svg%3E") no-repeat center / contain;
}
/* Link chat: chữ thường như câu (không in hoa) */
.productdetail-layout .pr-infos--extrainfo .pr-extrainfo span { text-transform: none !important; }
/* Gợi ý size cho khách đã nhập số đo */
.vtm-sg-hint {
	font-size: 13px;
	line-height: 1.5;
	color: var(--vtm-ink-2);
	margin: 6px 0 10px;
}
.vtm-sg-hint strong { color: var(--vtm-ink); font-weight: 700; }
.vtm-sg-hint span { color: var(--vtm-muted); }
.vtm-sg-hint button {
	border: 0; background: none; padding: 0; margin-left: 4px;
	font-size: 13px; font-weight: 600; color: var(--vtm-ink);
	text-decoration: underline; text-underline-offset: 3px; cursor: pointer;
}
.productdetail-layout .pr-infos--variants .select-swap--size label.vtm-sg-reco,
.vtm-quickbuy__size.vtm-sg-reco { position: relative; }
.productdetail-layout .pr-infos--variants .select-swap--size label.vtm-sg-reco::after,
.vtm-quickbuy__size.vtm-sg-reco::after {
	content: "";
	position: absolute;
	top: 5px;
	right: 5px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #16a34a;
}

/* 4. THẺ SẢN PHẨM ========================================================= */
.product-loop .product-loop--head .product-loop--img { background: var(--vtm-soft); }
.product-loop .product-loop--body .product-loop--title {
	font-size: 12px !important;
	line-height: 1.45 !important;
	font-weight: 500;
	letter-spacing: .02em;
	margin-bottom: 4px;
	/* tên hiện 2 dòng thay vì 1 dòng bị cắt */
	display: -webkit-box !important;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2 !important;
	overflow: hidden;
	height: auto !important;
	min-height: calc(2 * 1.45em);
	white-space: normal !important;
}
.product-loop .product-loop--body .product-loop--title a { display: inline !important; white-space: normal !important; }
.product-loop .product-loop--prices .price-current { font-size: 14px; font-weight: 700; }
.product-loop .product-loop--prices .price-current.hightlight { color: var(--vtm-sale); }
.product-loop .product-loop--prices .price-compare del { color: var(--vtm-muted); font-weight: 500; font-size: 12px; }
.product-loop .product-loop--labels .label-percent-sale {
	background: var(--vtm-sale);
	color: #fff;
	font-weight: 700;
	font-size: 11px;
	letter-spacing: .02em;
}
@media (min-width: 992px) {
	.product-loop .product-loop--body .product-loop--title { font-size: 13px !important; }
	.product-loop .product-loop--prices .price-current { font-size: 15px; }
}
/* Chế độ 6 SP/dòng (tên = mã màu) chỉ áp dụng màn hình ≥ 1024px;
   trên điện thoại luôn hiện tên đầy đủ */
@media (max-width: 1023px) {
	.collection-body.js-body-grid-6 .product-loop .product-loop--title .title-full { display: inline !important; }
	.collection-body.js-body-grid-6 .product-loop .product-loop--title .title-color { display: none !important; }
}

/* 5. TRANG CHỦ + DANH MỤC ================================================= */
/* Khung chờ "Set đồ cho bạn": lưới 16 hàng làm khung chờ cao ~8.300px → về 1 khối */
.grid-lookbooks-loading .lookbooks-banner__photo {
	display: block !important;
	height: auto !important;
	min-height: 0 !important;
}
.grid-lookbooks-loading .lookbooks-banner__photo .mask-line {
	background: var(--vtm-soft);
	aspect-ratio: 4 / 5;
	min-height: 0 !important;
	height: auto;
}
/* Danh mục: tiêu đề trang */
.collection-layout .collection-title h1,
.collection-layout .collection-head h1 {
	font-weight: 700;
	letter-spacing: .02em;
}

/* 5b. Tên danh mục trên thẻ ảnh trang chủ: in hoa như các tiêu đề khác */
.section-category .box-card .text h3 { text-transform: uppercase; letter-spacing: .04em; font-weight: 700; }

/* 6. NÚT NỔI ============================================================== */
@media (max-width: 767px) {
	.vtm-float-contact { right: 10px !important; bottom: 88px !important; }
	.vtm-float-contact .vtm-float-contact__toggle { width: 50px !important; height: 54px !important; }
	.vtm-float-contact .vtm-float-contact__toggle-icon { width: 48px !important; }
	.vtm-float-contact .vtm-float-contact__actions { right: 3px !important; bottom: 56px !important; }
}
/* Tim tích điểm (Haravan Loyalty) đè lên giá ở thanh mua → ẩn khi thanh mua đang hiện */
@media (max-width: 991px) {
	html.vtm-sticky-buy #hrv-loyalty {
		opacity: 0 !important;
		visibility: hidden !important;
		pointer-events: none !important;
	}
}


/* 7. HƯỚNG DẪN CHỌN SIZE (snippets/vtm-size-guide.liquid) ================ */
html.vtm-sg-lock, html.vtm-sg-lock body { overflow: hidden !important; }
.vtm-sg { display: none; }
.vtm-sg.is-open { display: block; }
.vtm-sg [hidden] { display: none !important; }
.vtm-sg__overlay { position: fixed; inset: 0; z-index: 100000; background: rgba(0, 0, 0, .5); }
.vtm-sg__panel {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 100001;
	display: flex; flex-direction: column;
	max-height: 90vh; background: #fff; border-radius: 16px 16px 0 0;
	box-shadow: 0 -12px 32px rgba(0, 0, 0, .18);
	font-family: var(--vtm-font); color: var(--vtm-ink);
	animation: vtmSgUp .22s ease-out;
}
@keyframes vtmSgUp { from { transform: translateY(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (min-width: 768px) {
	.vtm-sg__panel {
		left: 50%; right: auto; top: 50%; bottom: auto;
		width: 540px; max-height: 88vh; border-radius: 12px;
		transform: translate(-50%, -50%);
		animation: none;
	}
}
.vtm-sg__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; border-bottom: 1px solid var(--vtm-line); }
.vtm-sg__title { margin: 0; font-size: 15px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.vtm-sg__close { width: 36px; height: 36px; flex: 0 0 36px; border: 0; border-radius: 50%; background: #f3f4f6; color: var(--vtm-ink); display: flex; align-items: center; justify-content: center; cursor: pointer; }
.vtm-sg__body { overflow: auto; -webkit-overflow-scrolling: touch; padding: 16px 20px calc(20px + env(safe-area-inset-bottom)); }
.vtm-sg__fit { background: var(--vtm-soft); padding: 10px 12px; font-size: 13px; color: var(--vtm-ink-2); margin-bottom: 16px; border-radius: 8px; }
.vtm-sg__fit b { color: var(--vtm-ink); font-weight: 600; }
.vtm-sg__inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.vtm-sg__field { display: block; margin: 0; }
.vtm-sg__label { display: block; font-size: 13px; font-weight: 500; color: var(--vtm-muted); margin-bottom: 6px; }
.vtm-sg__input { display: flex; align-items: center; gap: 6px; height: 48px; padding: 0 12px; border: 1px solid #d1d5db; border-radius: 8px; background: #fff; transition: border-color .15s; }
.vtm-sg__input:focus-within { border-color: var(--vtm-ink); }
.vtm-sg__input input { flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: transparent; padding: 0; font-size: 16px; font-weight: 600; color: var(--vtm-ink); -moz-appearance: textfield; appearance: textfield; }
.vtm-sg__input input::-webkit-outer-spin-button,
.vtm-sg__input input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.vtm-sg__input input::placeholder { color: #b3b3b3; font-weight: 500; }
.vtm-sg__input em { font-style: normal; font-size: 13px; color: var(--vtm-muted); }
.vtm-sg__pref { margin-top: 14px; }
.vtm-sg__pref-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.vtm-sg__pref-list button { height: 40px; border: 1px solid #d1d5db; border-radius: 8px; background: #fff; color: var(--vtm-ink); font-size: 13px; font-weight: 500; cursor: pointer; }
.vtm-sg__pref-list button.is-active { border-color: var(--vtm-ink); background: var(--vtm-ink); color: #fff; font-weight: 600; }
.vtm-sg__result { margin-top: 16px; padding: 14px; border: 1.5px solid var(--vtm-ink); border-radius: 10px; display: grid; gap: 12px; }
.vtm-sg__result-text { font-size: 14px; color: var(--vtm-ink-2); }
.vtm-sg__result-text strong { font-size: 24px; font-weight: 700; color: var(--vtm-ink); margin-left: 8px; vertical-align: -2px; }
.vtm-sg__result-note { display: block; margin-top: 6px; font-size: 12px; color: #b45309; }
.vtm-sg__result-note:empty { display: none; }
.vtm-sg__apply { height: 48px; border: 0; border-radius: 8px; background: var(--vtm-ink); color: #fff; font-size: 14px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; }
.vtm-sg__apply:disabled { background: #e5e7eb; color: var(--vtm-muted); cursor: default; }
.vtm-sg__msg { margin: 14px 0 0; font-size: 13px; line-height: 1.5; color: #b45309; }
.vtm-sg__table-wrap { margin-top: 20px; }
.vtm-sg__table-title { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 8px; }
.vtm-sg__table { width: 100%; border-collapse: collapse; font-size: 13px; }
.vtm-sg__table th { background: var(--vtm-soft); color: var(--vtm-ink); font-weight: 600; text-align: center; padding: 10px 6px; border-bottom: 1px solid var(--vtm-line); }
.vtm-sg__table td { text-align: center; padding: 10px 6px; border-bottom: 1px solid var(--vtm-line); color: var(--vtm-ink-2); }
.vtm-sg__table td:first-child { font-weight: 700; color: var(--vtm-ink); }
.vtm-sg__table tr.is-reco td { background: var(--vtm-ink); color: #fff; font-weight: 700; }
.vtm-sg__hint { margin: 8px 0 0; font-size: 12px; line-height: 1.5; color: var(--vtm-muted); }
.vtm-sg__help { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--vtm-line); display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; font-size: 13px; color: var(--vtm-ink-2); }
.vtm-sg__help a { color: var(--vtm-ink); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

/* 7. v5 – TRANG DANH MỤC: tiêu đề + hàng danh mục ảnh nhỏ ===================
   Hàng ảnh do VTM.Collection.renderCate (main.js) vẽ: ảnh dọc 3:4 (thấy trọn áo, không cắt sát) + tên bên dưới.
   Trước: ô ảnh người mẫu cao ~300px (PC) / ~200px (mobile), tải ảnh gốc 2048px.
   Sau: ~170px / ~150px, ảnh _large 480px (đủ nét màn hình Retina, nhẹ hơn ảnh gốc nhiều lần). */
@media (min-width: 992px) {
	.collection-layout .collection-title { display: block; padding: 22px 0 6px; }
	.collection-layout .collection-title h1 { font-size: 26px; margin: 0; }
}
.collection-layout .cate-wrapper.vtm-cate-on { padding: 6px 0 14px; background: transparent; }
.vtm-cate__list {
	display: flex; justify-content: flex-start; gap: 16px;
	overflow-x: auto; overflow-y: hidden; scrollbar-width: none; -webkit-overflow-scrolling: touch;
	scroll-snap-type: x proximity; padding: 4px 4px 2px;
}
.vtm-cate__list::-webkit-scrollbar { display: none; }
/* căn giữa khi đủ chỗ, vẫn cuộn được khi nhiều mục (justify-content:center sẽ cắt mất mục đầu) */
.vtm-cate__list > :first-child { margin-left: auto; }
.vtm-cate__list > :last-child { margin-right: auto; }
.vtm-cate__item {
	flex: 0 0 108px; width: 108px; display: flex; flex-direction: column; align-items: center; gap: 8px;
	color: var(--vtm-ink) !important; text-decoration: none !important; scroll-snap-align: start;
	-webkit-tap-highlight-color: transparent;
}
.vtm-cate__img {
	position: relative; display: block; width: 100%; aspect-ratio: 3 / 4; border-radius: 6px; overflow: hidden;
	background: var(--vtm-soft); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .04); transition: box-shadow .15s;
}
.vtm-cate__img img {
	width: 100%; height: 100%; object-fit: cover; object-position: 50% 15%;
	transition: transform .35s ease;
}
.vtm-cate__img.is-empty img { visibility: hidden; }
.vtm-cate__item:hover .vtm-cate__img img { transform: scale(1.05); }
.vtm-cate__item.is-active .vtm-cate__img { box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--vtm-ink); }
.vtm-cate__name {
	max-width: 100%; font: 600 12.5px/1.3 var(--vtm-font); text-align: center; text-transform: none;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.vtm-cate__item.is-active .vtm-cate__name { font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 991px) {
	.collection-layout .collection-title { padding: 18px 0 8px; }
	.collection-layout .cate-wrapper.vtm-cate-on { padding: 2px 0 10px; }
	.collection-layout .cate-wrapper.vtm-cate-on > .container { padding-left: 0; padding-right: 0; }
	.vtm-cate__list { gap: 10px; padding: 4px 16px 2px; scroll-padding: 0 16px; }
	.vtm-cate__item { flex-basis: 80px; width: 80px; gap: 6px; }
	.vtm-cate__name { font-size: 11.5px; }
}
@media (prefers-reduced-motion: reduce) { .vtm-cate__img img { transition: none; } }