/* Lọc Lend Bởi Hùng Vũ — all selectors are prefixed hvlf-. */
.hvlf-root{
	--hvlf-bg:#fff;
	--hvlf-text:inherit;
	--hvlf-muted:rgba(0,0,0,.55);
	--hvlf-line:rgba(0,0,0,.14);
	--hvlf-strong-line:rgba(0,0,0,.55);
	--hvlf-radius:0px;
	--hvlf-shadow:0 24px 80px rgba(0,0,0,.22);
	--hvlf-site-width:1080px;
	font:inherit;
	color:var(--hvlf-text);
	box-sizing:border-box;
}
.hvlf-root *, .hvlf-root *::before, .hvlf-root *::after{box-sizing:border-box}
.hvlf-root button,.hvlf-root input,.hvlf-root select{font:inherit;color:inherit}

.hvlf-root fieldset,.hvlf-root legend{border:0!important;box-shadow:none!important;background:none!important}
.hvlf-root legend::before,.hvlf-root legend::after{display:none!important;content:none!important}
.hvlf-backdrop{position:fixed;inset:0;z-index:999997;background:rgba(0,0,0,.48);backdrop-filter:blur(2px)}
.hvlf-modal{position:fixed;z-index:999998;top:4vh;bottom:4vh;left:50%;right:auto;width:min(calc(100vw - 30px),var(--hvlf-site-width,1080px));max-width:none;max-height:92vh;margin:0;transform:translateX(-50%);background:var(--hvlf-bg);box-shadow:var(--hvlf-shadow);overflow:hidden;border-radius:var(--hvlf-radius)}
.hvlf-modal[hidden],.hvlf-backdrop[hidden]{display:none!important}
.hvlf-form{height:100%;max-height:92vh;display:flex;flex-direction:column;margin:0}
.hvlf-modal-header{position:relative;display:flex;align-items:center;justify-content:center;min-height:88px;padding:20px 68px 18px;border-bottom:1px solid rgba(0,0,0,.12)}
.hvlf-modal-title{margin:0!important;font:inherit!important;font-size:28px!important;font-weight:300!important;letter-spacing:.03em;text-transform:uppercase;line-height:1.15;color:inherit}
.hvlf-close{position:absolute;top:50%;right:18px;transform:translateY(-50%);width:40px;height:40px;border:0;background:transparent;display:grid;place-items:center;cursor:pointer;padding:0;line-height:1;box-shadow:none}
.hvlf-close span{font-size:34px;font-weight:300;line-height:1}
.hvlf-modal-body{overflow:auto;padding:6px 24px 12px;overscroll-behavior:contain;flex:1 1 auto}
.hvlf-group{border:0!important;padding:20px 16px 18px;margin:0;min-width:0;box-shadow:none!important;background:transparent!important}
.hvlf-group:last-child{border:0!important}
.hvlf-group-title{display:block;width:100%;padding:0;margin:0 0 18px;font:inherit;font-size:inherit;font-weight:600;line-height:1.4;text-transform:uppercase}
.hvlf-options{display:grid;grid-template-columns:repeat(var(--hvlf-columns,2),minmax(0,1fr));gap:12px 40px}
.hvlf-option{position:relative;display:flex;align-items:center;gap:14px;min-width:0;margin:0;cursor:pointer;font:inherit;line-height:1.45}
.hvlf-input{position:absolute!important;opacity:0!important;width:1px!important;height:1px!important;pointer-events:none!important}
.hvlf-checkbox{flex:0 0 26px;width:26px;height:26px;border:1px solid var(--hvlf-line);display:grid;place-items:center;background:var(--hvlf-bg);transition:.18s ease}
.hvlf-checkbox span{opacity:0;font-size:.95em;transform:scale(.7);transition:.18s ease}
.hvlf-input:focus-visible + .hvlf-checkbox,.hvlf-input:focus-visible + .hvlf-swatch{outline:2px solid currentColor;outline-offset:3px}
.hvlf-input:checked + .hvlf-checkbox{border-color:currentColor;background:transparent}
.hvlf-input:checked + .hvlf-checkbox span{opacity:1;transform:scale(1)}
.hvlf-option:hover .hvlf-checkbox{border-color:var(--hvlf-strong-line)}
.hvlf-display-swatch .hvlf-options{grid-template-columns:repeat(var(--hvlf-columns,5),minmax(70px,1fr));gap:18px 18px}
.hvlf-display-swatch .hvlf-option{flex-direction:column;justify-content:flex-start;gap:10px;text-align:center;font:inherit}
.hvlf-swatch{position:relative;display:block;width:72px;max-width:100%;aspect-ratio:1;border-radius:50%;border:0;background-color:#f2f2f2;background-size:cover;background-position:center;box-shadow:none;opacity:.5;transform:scale(1);transform-origin:center;transition:opacity .18s ease,transform .18s ease}
.hvlf-swatch::after{display:none!important;content:none!important}
.hvlf-swatch-check{display:none!important}
.hvlf-input:checked + .hvlf-swatch{opacity:1;transform:scale(1.2);z-index:2}
.hvlf-display-swatch .hvlf-option:hover .hvlf-swatch{opacity:.8}
.hvlf-option-label{font:inherit}
.hvlf-option-label small{font-size:.85em;color:var(--hvlf-muted)}
.hvlf-modal-footer{display:grid;grid-template-columns:auto minmax(330px,1fr);align-items:end;gap:14px;padding:16px 24px 24px;border:0!important;box-shadow:0 -10px 20px rgba(255,255,255,.98);background:var(--hvlf-bg);position:sticky;bottom:0;z-index:3}
.hvlf-clear,.hvlf-apply{min-height:58px;padding:12px 22px;border-radius:999px;cursor:pointer;transition:.18s ease;font:inherit}
.hvlf-clear{border:0;background:transparent;text-decoration:underline;text-underline-offset:3px;align-self:center;justify-self:start}
.hvlf-apply{display:block;width:100%;border:0;background:#666;color:#fff!important;border-radius:10px;font-weight:500;text-align:center}
.hvlf-clear:hover,.hvlf-apply:hover{transform:translateY(-1px)}
.hvlf-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:66px;padding:8px 0 18px;background:transparent;border:0;box-shadow:none}
.hvlf-mode-sticky .hvlf-bar{position:fixed;z-index:999990;left:50%;right:auto;bottom:0;width:min(calc(100vw - 30px),var(--hvlf-site-width,1080px));transform:translateX(-50%);padding:12px 0;background:var(--hvlf-bg);box-shadow:0 -8px 32px rgba(0,0,0,.08)}
body.admin-bar .hvlf-mode-sticky .hvlf-bar{bottom:0}
.hvlf-mode-inline .hvlf-bar{position:relative;margin:0 0 18px}
.hvlf-root.hvlf-auto-injected .hvlf-bar{margin:0 0 18px}
.hvlf-root.hvlf-auto-injected{display:block;width:100%}
.hvlf-chips{display:flex;align-items:center;gap:8px 18px;flex:1;min-width:0;overflow:auto;scrollbar-width:thin}
.hvlf-chip{display:inline-flex;align-items:center;gap:7px;flex:0 0 auto;min-height:30px;padding:2px 0;border:0;background:transparent;cursor:pointer;font:inherit;font-size:95%;white-space:nowrap}
.hvlf-chip b{font-size:1.15em;font-weight:300;line-height:1}
.hvlf-empty-selection{color:var(--hvlf-muted);font:inherit;font-size:95%}
.hvlf-trigger{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:0 0 auto;min-height:38px;padding:5px 14px;border:1px solid currentColor;border-radius:999px;background:transparent;cursor:pointer;font:inherit;font-size:95%;text-transform:uppercase;letter-spacing:.04em}
.hvlf-filter-icon{width:32px;height:20px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round}
.hvlf-filter-icon circle{fill:var(--hvlf-bg)}
body.hvlf-has-sticky-filter{padding-bottom:94px}
body.hvlf-modal-open{overflow:hidden!important}
.hvlf-admin-message{padding:12px;border:1px solid #dba617;background:#fff8e5}
.hvlf-root .screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal!important}
@media (max-width:849px){
	body.hvlf-has-sticky-filter{padding-bottom:72px}
	.hvlf-modal{inset:0;width:100%;max-width:none;max-height:none;transform:none;border-radius:0}
	.hvlf-form{max-height:100vh}
	.hvlf-modal-header{min-height:74px;padding:14px 52px 12px 20px}
	.hvlf-modal-title{font-size:18px!important;font-weight:300!important;letter-spacing:.03em}
	.hvlf-close{right:12px;width:40px;height:40px}
	.hvlf-close span{font-size:28px}
	.hvlf-modal-body{padding:4px 18px 12px}
	.hvlf-group{padding:18px 2px 14px}
	.hvlf-group-title{margin-bottom:16px}
	.hvlf-options{grid-template-columns:1fr 1fr!important;gap:12px 24px}
	.hvlf-option{gap:12px}
	.hvlf-checkbox{flex-basis:24px;width:24px;height:24px}
	.hvlf-display-swatch .hvlf-options{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:16px 10px}
	.hvlf-display-swatch .hvlf-option{gap:8px}
	.hvlf-swatch{width:54px}
	.hvlf-modal-footer{position:sticky;bottom:0;display:grid;grid-template-columns:1fr;gap:12px;padding:12px 16px 18px;border:0!important;box-shadow:0 -8px 18px rgba(255,255,255,.98)}
	.hvlf-clear{display:block;justify-self:start;padding:0;min-height:auto;background:transparent;border:0;text-decoration:underline;text-underline-offset:3px}
	.hvlf-apply{width:100%;border-radius:8px;min-height:48px;order:2}
	.hvlf-bar{min-height:48px;padding:6px 0 12px;gap:12px}
	.hvlf-root.hvlf-auto-injected .hvlf-bar{margin:0 0 12px}
	.hvlf-mode-sticky .hvlf-bar{left:0;right:0;width:100%;transform:none;padding:10px 12px;border-width:1px 0 0}
	.hvlf-chips{gap:8px 14px}
	.hvlf-chip{gap:7px;min-height:26px;padding:1px 0;font-size:95%}
	.hvlf-trigger{min-height:12px;padding:4px 12px;font-size:95%;gap:8px}
	.hvlf-filter-icon{width:24px;height:16px}
}
@media (max-width:420px){
	.hvlf-display-swatch .hvlf-options{grid-template-columns:repeat(4,minmax(0,1fr))!important}
}
@media (prefers-reduced-motion:reduce){.hvlf-root *{scroll-behavior:auto!important;transition:none!important}.hvlf-chip,.hvlf-empty-selection,.hvlf-trigger{font-size:95%}}

/* v1.1.8: category parent headings, centered modal title, stacked footer. */
.hvlf-modal-title{width:100%;text-align:center}
.hvlf-category-group{padding-top:10px}
.hvlf-category-section{margin:0;padding:18px 0 22px;border:0}
.hvlf-category-section + .hvlf-category-section{border-top:1px solid var(--hvlf-line)}
.hvlf-category-parent-title{margin:0 0 18px!important;padding:0;font:inherit!important;font-size:inherit!important;font-weight:600!important;line-height:1.4;text-transform:none;color:inherit}
.hvlf-category-section .hvlf-option-label{white-space:normal}
.hvlf-modal-footer{grid-template-columns:1fr;align-items:stretch;gap:12px}
.hvlf-clear{justify-self:start;align-self:auto;min-height:auto;padding:0 0 2px;border-radius:0}
.hvlf-clear[hidden]{display:none!important}
.hvlf-apply{grid-column:1;width:100%}
.hvlf-apply.is-loading{opacity:.78;cursor:progress}
@media (max-width:849px){
	.hvlf-category-group{padding-top:6px}
	.hvlf-category-section{padding:16px 0 18px}
	.hvlf-category-parent-title{margin-bottom:14px!important}
	.hvlf-modal-footer{grid-template-columns:1fr}
}


/* v1.1.9: swatch selection uses opacity + scale, no border/check marker. */
.hvlf-display-swatch .hvlf-swatch{
	border:0!important;
	box-shadow:none!important;
	opacity:.5;
	transform:scale(1);
}
.hvlf-display-swatch .hvlf-swatch::before,
.hvlf-display-swatch .hvlf-swatch::after,
.hvlf-display-swatch .hvlf-swatch-check{display:none!important;content:none!important}
.hvlf-display-swatch .hvlf-input:checked + .hvlf-swatch{
	opacity:1!important;
	transform:scale(1.2)!important;
	z-index:2;
}
.hvlf-chip{gap:7px;font-size:95%}
.hvlf-trigger{font-size:95%}
@media (max-width:849px){
	.hvlf-trigger{min-height:12px;padding:4px 12px;font-size:95%;gap:8px}
}


/* v1.1.10: remove gray swatch halo/background completely. */
.hvlf-swatch,
.hvlf-display-swatch .hvlf-swatch{
	background-color: transparent !important;
	background-clip: padding-box !important;
	border: 0 !important;
	box-shadow: none !important;
}


/* v1.1.11: checked checkbox and label turn red. */
.hvlf-display-checkbox .hvlf-input:checked + .hvlf-checkbox,
.hvlf-group:not(.hvlf-display-swatch) .hvlf-input:checked + .hvlf-checkbox{
	border-color:#e60023 !important;
	background:#e60023 !important;
	color:#fff !important;
}
.hvlf-display-checkbox .hvlf-input:checked + .hvlf-checkbox span,
.hvlf-group:not(.hvlf-display-swatch) .hvlf-input:checked + .hvlf-checkbox span{
	color:#fff !important;
}
.hvlf-display-checkbox .hvlf-option:has(.hvlf-input:checked) .hvlf-option-label,
.hvlf-group:not(.hvlf-display-swatch) .hvlf-option:has(.hvlf-input:checked) .hvlf-option-label{
	color:#e60023 !important;
}
/* Fallback for browsers without :has(), JS already adds .is-selected. */
.hvlf-display-checkbox .hvlf-option.is-selected .hvlf-option-label,
.hvlf-group:not(.hvlf-display-swatch) .hvlf-option.is-selected .hvlf-option-label{
	color:#e60023 !important;
}
