/* ==========================================================================
   BrickCo - main.css
   CSS dùng chung mọi trang: font, reset, header, footer, bottom nav, toast.
   ========================================================================== */

/* ===== Font Inter (self-host, variable 400-900) ===== */
@font-face {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 400 900;
	font-display: swap;
	src: url('../fonts/inter-vietnamese.woff2') format('woff2');
	unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 400 900;
	font-display: swap;
	src: url('../fonts/inter-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 400 900;
	font-display: swap;
	src: url('../fonts/inter-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ===== Reset & Base ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
	--orange-50:#fff7ed; --orange-100:#ffedd5; --orange-200:#fed7aa; --orange-300:#fdba74;
	--orange-400:#fb923c; --orange-500:#f97316; --orange-600:#ea580c; --orange-700:#c2410c;
	--gray-50:#f9fafb; --gray-100:#f3f4f6; --gray-200:#e5e7eb; --gray-300:#d1d5db;
	--gray-400:#9ca3af; --gray-500:#6b7280; --gray-600:#4b5563; --gray-700:#374151;
	--gray-800:#1f2937; --gray-900:#111827;
	--red-500:#ef4444; --rose-500:#f43f5e; --pink-600:#db2777; --amber-500:#f59e0b;
	--white:#fff; --radius-lg:0.75rem; --radius-xl:1rem; --radius-2xl:1rem;
	--shadow-sm:0 1px 2px rgba(0,0,0,.05); --shadow-md:0 4px 6px -1px rgba(0,0,0,.1);
	--shadow-lg:0 10px 15px -3px rgba(0,0,0,.1);
	--max-w:80rem;
}
html { -webkit-text-size-adjust:100%; }
body { font-family:'Inter',system-ui,-apple-system,sans-serif; background:var(--gray-50); color:var(--gray-800); line-height:1.5; padding-bottom:3.5rem; }
img { display:block; max-width:100%; height:auto; }
button { cursor:pointer; border:none; background:none; font-family:inherit; }
input, select, textarea { font-family:inherit; }
a { color:inherit; text-decoration:none; }
[hidden] { display:none !important; } /* Thuộc tính hidden luôn thắng các display:flex/grid của class */
.screen-reader-text { position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* ===== Header ===== */
.header { position:sticky; top:0; z-index:40; background:linear-gradient(to right,var(--orange-500),var(--orange-600)); box-shadow:var(--shadow-md); }
.header-inner { max-width:var(--max-w); margin:0 auto; padding:0 0.5rem; display:flex; align-items:center; gap:0.375rem; height:3.5rem; }
.header-logo { display:flex; align-items:center; gap:0.375rem; flex-shrink:0; }
.logo-icon { height:2.5rem; width:2.5rem; object-fit:contain; filter:drop-shadow(0 0 1px rgba(255,255,255,.9)); }
.logo-text { font-size:0.625rem; font-weight:900; letter-spacing:-0.025em; color:var(--white); white-space:nowrap; }
.logo-text .dot { font-weight:300; opacity:.9; }
.search-wrap { position:relative; flex:1.1 1 0; min-width:0; max-width:42rem; margin:0 auto; }
.search-input { width:100%; height:2.25rem; border:none; border-radius:9999px; background:var(--white); padding:0 2.25rem 0 0.75rem; font-size:0.75rem; color:var(--gray-800); outline:none; -webkit-appearance:none; appearance:none; }
.search-input::-webkit-search-cancel-button { -webkit-appearance:none; }
.search-input:focus { box-shadow:0 0 0 2px var(--orange-200); }
.search-input::placeholder { color:var(--gray-400); }
.search-btn { position:absolute; right:0; top:0; height:2.25rem; width:2.5rem; display:flex; align-items:center; justify-content:center; color:var(--gray-500); border-radius:0 9999px 9999px 0; }
.header-nav { display:none; align-items:center; gap:0.25rem; flex-shrink:0; }
.nav-btn { position:relative; display:flex; align-items:center; gap:0.375rem; height:2.5rem; padding:0 0.5rem; border-radius:0.5rem; color:rgba(255,255,255,.9); transition:background .15s,color .15s; }
.nav-btn:hover { background:rgba(255,255,255,.15); color:var(--white); }
.nav-label { display:none; font-size:0.75rem; font-weight:500; }
.cart-badge { position:absolute; right:0; top:0; height:1.0625rem; min-width:1.0625rem; display:flex; align-items:center; justify-content:center; border-radius:9999px; background:var(--white); color:var(--orange-600); font-size:0.625rem; font-weight:700; padding:0 0.25rem; }
.cart-btn-mobile { position:relative; display:flex; align-items:center; gap:0.25rem; padding:0.25rem; color:var(--white); flex-shrink:0; }
.cart-badge-mobile { position:absolute; right:-0.125rem; top:-0.125rem; height:1.125rem; min-width:1.125rem; display:flex; align-items:center; justify-content:center; border-radius:9999px; background:var(--white); color:var(--orange-600); font-size:0.625rem; font-weight:700; padding:0 0.25rem; }

/* Header dính dưới thanh admin khi đăng nhập */
@media (min-width:601px) { .admin-bar .header { top:46px; } }
@media (min-width:783px) { .admin-bar .header { top:32px; } }

/* ===== Header riêng (trang chi tiết sản phẩm, trang thanh toán) ===== */
.detail-header { position:sticky; top:0; z-index:40; border-bottom:1px solid var(--gray-200); background:rgba(255,255,255,.95); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
.detail-header-inner { max-width:var(--max-w); margin:0 auto; height:3.5rem; padding:0 1rem; display:flex; align-items:center; justify-content:space-between; gap:0.5rem; }
.detail-back { display:flex; align-items:center; gap:0.25rem; font-size:0.875rem; font-weight:500; color:var(--gray-600); transition:color .15s; }
.detail-back:hover { color:var(--orange-600); }
.detail-header-title { font-size:0.875rem; font-weight:700; color:var(--gray-800); }
.detail-cart { position:relative; display:flex; padding:0.5rem; border-radius:9999px; color:var(--gray-500); transition:background .15s, color .15s; }
.detail-cart:hover { background:var(--gray-100); color:var(--gray-800); }
.detail-cart .cart-badge { background:var(--orange-500); color:var(--white); }

@media (min-width:640px) {
	.detail-header-inner { height:4rem; padding:0 1.5rem; }
	.detail-header-title { font-size:1rem; }
}
@media (min-width:601px) { .admin-bar .detail-header { top:46px; } }
@media (min-width:783px) { .admin-bar .detail-header { top:32px; } }
.detail-close { display:flex; padding:0.5rem; border-radius:9999px; color:var(--gray-500); transition:background .15s, color .15s; }
.detail-close:hover { background:var(--gray-100); color:var(--gray-800); }

/* ===== Main ===== */
.main-content,
.site-main { max-width:var(--max-w); margin:0 auto; }
.site-main { padding:1rem 0.5rem; min-height:50vh; }

/* ===== Footer ===== */
.footer { margin-top:2rem; background:var(--white); border-top:1px solid var(--gray-100); padding:1.5rem 1rem; text-align:center; }
.footer-brand { font-weight:700; color:var(--gray-600); margin-bottom:0.25rem; font-size:0.875rem; }
.footer-text { font-size:0.875rem; color:var(--gray-400); }
.footer-copyright { margin-top:0.75rem; font-size:0.75rem; color:var(--gray-400); }

/* ===== Bottom Nav (mobile) ===== */
.bottom-nav { position:fixed; bottom:0; left:0; right:0; z-index:40; border-top:1px solid var(--gray-200); background:var(--white); box-shadow:0 -2px 8px rgba(0,0,0,.06); display:flex; height:3.5rem; }
.bottom-nav-btn { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:0.125rem; flex:1; min-width:4rem; color:var(--gray-500); transition:color .15s; }
.bottom-nav-btn span { font-size:0.625rem; font-weight:500; }
.bottom-nav-btn.active,
.bottom-nav-btn:hover { color:var(--orange-600); }

/* ===== Giỏ hàng trượt từ bên phải (template-parts/cart/drawer.php) ===== */
.cd { position:fixed; inset:0; z-index:100; }
.cd-backdrop { position:absolute; inset:0; background:rgba(0,0,0,.5); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); opacity:0; transition:opacity .3s; }
.cd-panel { position:absolute; top:0; right:0; display:flex; flex-direction:column; width:100%; max-width:28rem; height:100%; background:var(--white); box-shadow:0 25px 50px -12px rgba(0,0,0,.25); transform:translateX(100%); transition:transform .3s ease; outline:none; }
.cd.is-open .cd-backdrop { opacity:1; }
.cd.is-open .cd-panel { transform:translateX(0); }
body.cart-open { overflow:hidden; }

.cd-body { display:flex; flex-direction:column; flex:1; min-height:0; }
.cd-head { display:flex; align-items:center; justify-content:space-between; padding:0.75rem 1rem; border-bottom:1px solid var(--gray-100); }
.cd-head-title { display:flex; align-items:center; gap:0.5rem; color:var(--orange-500); }
.cd-head-title h3 { font-size:1rem; font-weight:700; color:var(--gray-800); }
.cd-close { display:flex; color:var(--gray-400); transition:color .15s; }
.cd-close:hover { color:var(--gray-700); }

/* Nút chọn tròn */
.cd-check { display:flex; flex-shrink:0; align-items:center; justify-content:center; width:1.25rem; height:1.25rem; border:2px solid var(--gray-300); border-radius:9999px; background:var(--white); color:transparent; transition:border-color .15s, background .15s; }
.cd-check svg { stroke-width:3; }
.is-checked > .cd-check,
.cd-check.is-checked { border-color:var(--orange-500); background:var(--orange-500); color:var(--white); }

.cd-select-all { padding:0.625rem 1rem; border-bottom:1px solid var(--gray-50); background:var(--gray-50); }
.cd-check-label { display:flex; align-items:center; gap:0.5rem; font-size:0.875rem; color:var(--gray-600); }

.cd-list { flex:1; display:flex; flex-direction:column; gap:0.75rem; padding:0.75rem 1rem; overflow-y:auto; overscroll-behavior:contain; }

.cd-item { display:flex; gap:0.75rem; padding:0.5rem; border:1px solid var(--gray-100); border-radius:0.5rem; background:var(--gray-50); transition:border-color .15s, background .15s; }
.cd-item.is-selected { border-color:var(--orange-200); background:var(--orange-50); }
.cd-item > .cd-check { margin-top:0.25rem; }
.cd-item-img { flex-shrink:0; width:4rem; height:4rem; overflow:hidden; border-radius:0.375rem; background:var(--gray-100); }
.cd-item-img img { width:100%; height:100%; object-fit:cover; }
.cd-item-info { flex:1; min-width:0; }
.cd-item-name { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:0.875rem; line-height:1.25; color:var(--gray-800); }
.cd-item-name:hover { color:var(--orange-600); }
.cd-item-row { display:flex; align-items:center; justify-content:space-between; gap:0.5rem; margin-top:0.25rem; }
.cd-item-code { min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:0.6875rem; color:var(--gray-500); }
.cd-item-code strong { font-weight:500; color:var(--gray-700); }
.cd-item-price { flex-shrink:0; margin-left:auto; font-size:0.875rem; font-weight:700; color:var(--orange-600); }
.cd-qty { display:flex; align-items:center; gap:0.5rem; }
.cd-qty-btn { display:flex; padding:0.25rem; border-radius:0.25rem; color:var(--gray-600); transition:background .15s; }
.cd-qty-btn:hover { background:var(--gray-200); }
.cd-qty-value { width:1.5rem; text-align:center; font-size:0.875rem; font-weight:500; }
.cd-remove { display:flex; color:var(--gray-400); transition:color .15s; }
.cd-item.is-out { opacity:.65; }
.cd-item-out { flex-shrink:0; margin-left:auto; font-size:0.75rem; font-weight:600; color:var(--red-500); }
.cd-check:disabled { opacity:.4; cursor:not-allowed; }
.cd-note { font-size:0.6875rem; color:var(--gray-500); text-align:center; }
.cd-body.is-loading { opacity:.6; pointer-events:none; transition:opacity .15s; }
.cd-body[data-empty] .js-cart-close { pointer-events:auto; }
.cd-loading { flex:1; display:flex; align-items:center; justify-content:center; padding:2rem 1rem; font-size:0.875rem; color:var(--gray-500); }
.cd-remove:hover { color:var(--red-500); }

.cd-points { display:flex; align-items:center; gap:0.75rem; width:100%; padding:0.625rem 0.75rem; border:1px solid var(--orange-200); border-radius:0.5rem; background:var(--orange-50); text-align:left; transition:border-color .15s, background .15s; }
.cd-points:hover { border-color:var(--orange-300); background:var(--orange-100); }
.cd-points > svg { flex-shrink:0; color:var(--orange-500); }
.cd-points-icon { display:flex; flex-shrink:0; padding:0.375rem; border-radius:0.5rem; background:var(--orange-500); color:var(--white); }
.cd-points-icon svg { fill:currentColor; }
.cd-points-text { flex:1; min-width:0; }
.cd-points-text strong { display:block; font-size:0.875rem; font-weight:600; color:var(--orange-700); }
.cd-points-text span { display:block; font-size:0.75rem; color:var(--orange-600); }

.cd-foot { display:flex; flex-direction:column; gap:0.75rem; padding:0.75rem 1rem calc(0.75rem + env(safe-area-inset-bottom)); border-top:1px solid var(--gray-100); }
.cd-total { display:flex; align-items:center; justify-content:space-between; font-size:0.875rem; color:var(--gray-600); }
.cd-total strong { font-size:1.25rem; font-weight:700; color:var(--orange-600); }
.cd-checkout { display:block; width:100%; padding:0.75rem; border-radius:0.5rem; background:linear-gradient(to right,var(--orange-500),var(--orange-600)); color:var(--white); font-weight:700; text-align:center; transition:opacity .15s, filter .15s; }
.cd-checkout:hover { color:var(--white); filter:brightness(.95); }
.cd-checkout.is-disabled { opacity:.4; pointer-events:none; }

.cd-empty { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:0.75rem; padding:2rem 1rem; color:var(--gray-300); text-align:center; }
.cd-empty p { font-size:0.875rem; color:var(--gray-500); }
.cd-empty-btn { padding:0.625rem 1.5rem; border-radius:0.5rem; background:var(--orange-500); color:var(--white); font-size:0.875rem; font-weight:600; }
.cd-empty-btn:hover { background:var(--orange-600); color:var(--white); }

@media (prefers-reduced-motion:reduce) {
	.cd-backdrop,
	.cd-panel { transition:none; }
}

/* ===== Toast ===== */
.toast { position:fixed; bottom:5rem; left:50%; transform:translateX(-50%) translateY(1rem); background:var(--gray-900); color:var(--white); font-size:0.875rem; font-weight:500; padding:0.625rem 1.25rem; border-radius:0.5rem; z-index:100; opacity:0; transition:opacity .2s,transform .2s; pointer-events:none; }
.toast.show { opacity:1; transform:translateX(-50%) translateY(0); }

/* ===== Product Card (template-parts/product/card.php) ===== */
.product-card { position:relative; overflow:hidden; border-radius:0.5rem; border:1px solid var(--gray-200); background:var(--white); transition:border-color .2s, box-shadow .2s; }
.product-card:hover { border-color:var(--orange-200); box-shadow:var(--shadow-lg); }
.product-card-img-wrap { position:relative; display:block; aspect-ratio:1; overflow:hidden; background:var(--gray-50); }
.product-card-img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.product-card:hover .product-card-img-wrap img { transform:scale(1.05); }
.product-card-discount { position:absolute; top:0; right:0; background:linear-gradient(to bottom left,var(--orange-500),var(--red-500)); color:var(--white); font-size:0.625rem; font-weight:700; padding:0.125rem 0.375rem; border-radius:0 0 0 0.5rem; }
.product-card-info { padding:0.5rem; }
.product-card-name { font-size:0.75rem; font-weight:400; color:var(--gray-800); line-height:1.25; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2.5em; } /* 2.5em = đúng 2 dòng */
.product-card-name a::after { content:''; position:absolute; inset:0; } /* Bấm vào bất kỳ đâu trên thẻ đều mở sản phẩm */
.product-card-name.compact { font-size:0.6875rem; }
.product-card-price-row { display:flex; align-items:baseline; gap:0.25rem; margin-top:0.375rem; min-width:0; }
.product-card-price { flex-shrink:0; color:var(--orange-600); font-weight:700; font-size:0.875rem; }
.product-card-original { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--gray-400); font-size:0.625rem; }
.product-card-meta { display:flex; align-items:center; gap:0.125rem; margin-top:0.25rem; font-size:0.625rem; color:var(--gray-500); white-space:nowrap; overflow:hidden; }
.product-card-star { flex-shrink:0; width:0.6875rem; height:0.6875rem; fill:#facc15; }
.product-card-sep { color:var(--gray-300); margin:0 0.125rem; }
.product-card-meta > span:last-child { min-width:0; overflow:hidden; text-overflow:ellipsis; }
.product-card-add-btn { position:relative; z-index:1; margin-top:0.5rem; width:100%; background:var(--orange-50); color:var(--orange-600); font-size:0.75rem; font-weight:500; padding:0.375rem 0; border-radius:0.375rem; display:flex; align-items:center; justify-content:center; gap:0.25rem; transition:background .15s, color .15s; }
.product-card-add-btn:hover { background:var(--orange-500); color:var(--white); }
.product-card-add-btn svg { width:0.8125rem; height:0.8125rem; }

/* ===== WooCommerce: thông báo (đã thêm vào giỏ, lỗi...) ===== */
.woocommerce-notices-wrapper:empty { display:none; }
.woocommerce-message,
.woocommerce-info,
.woocommerce-error { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:0.5rem; padding:0.75rem 1rem; border-left:4px solid #22c55e; border-radius:0.5rem; background:var(--white); box-shadow:var(--shadow-sm); font-size:0.875rem; color:var(--gray-700); list-style:none; }
.woocommerce-info { border-left-color:#3b82f6; }
.woocommerce-error { display:block; border-left-color:var(--red-500); }
.woocommerce-message .button,
.woocommerce-info .button { order:2; padding:0.375rem 0.75rem; border-radius:0.375rem; background:var(--orange-500); color:var(--white); font-size:0.8125rem; font-weight:600; }
.woocommerce-message .button:hover,
.woocommerce-info .button:hover { background:var(--orange-600); color:var(--white); }

/* ===== WooCommerce: lưới sản phẩm cơ bản (CSS mặc định của WC đã tắt) ===== */
.woocommerce ul.products { display:grid; grid-template-columns:repeat(2,1fr); gap:0.5rem; list-style:none; }
.woocommerce ul.products::before,
.woocommerce ul.products::after { display:none; }

/* ===== Responsive: sm (640px+) ===== */
@media (min-width:640px) {
	body { padding-bottom:0; }
	.header-inner { height:4rem; gap:0.75rem; padding:0 1rem; }
	.logo-icon { height:4rem; width:4rem; transform:scale(1.1); }
	.logo-text { font-size:1.25rem; }
	.search-input { height:2.5rem; padding:0 3rem 0 1rem; font-size:0.875rem; border-radius:0.375rem; }
	.search-btn { height:2.5rem; width:3rem; border-radius:0 0.375rem 0.375rem 0; background:var(--orange-500); color:var(--white); }
	.search-btn:hover { background:var(--orange-600); }
	.header-nav { display:flex; }
	.cart-btn-mobile { display:none; }
	.site-main { padding:1rem; }
	.product-card-info { padding:0.625rem; }
	.product-card-discount { font-size:0.75rem; padding:0.25rem 0.5rem; }
	.product-card-name,
	.product-card-name.compact { font-size:0.875rem; }
	.product-card-price { font-size:1rem; }
	.product-card-original,
	.product-card-meta { font-size:0.75rem; }
	.bottom-nav { display:none; }
	.woocommerce ul.products { grid-template-columns:repeat(3,1fr); gap:0.75rem; }
}

/* ===== Responsive: md (768px+) ===== */
@media (min-width:768px) {
	.nav-label { display:inline; }
	.woocommerce ul.products.columns-4 { grid-template-columns:repeat(4,1fr); }
	.woocommerce ul.products.columns-5 { grid-template-columns:repeat(5,1fr); }
}

/* ===== Responsive: lg (1024px+) ===== */
@media (min-width:1024px) {
	.nav-btn { padding:0 0.625rem; }
}

/* ===== Flash Sale dùng chung: thanh "Đã bán x/y", đồng hồ, nhãn trong giỏ (inc/flash-sale/) ===== */
.fs-bar { position:relative; height:1rem; margin-top:0.375rem; overflow:hidden; border-radius:9999px; background:#fecaca; }
.fs-bar-fill { position:absolute; inset:0 auto 0 0; border-radius:9999px; background:linear-gradient(to right,var(--orange-500),var(--red-500)); }
.fs-bar-text { position:relative; display:block; padding:0 0.375rem; font-size:0.5625rem; font-weight:700; line-height:1rem; color:var(--white); text-align:center; text-transform:uppercase; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-shadow:0 0 2px rgba(0,0,0,.25); }
.fs-bar.is-upcoming { background:var(--orange-100); }
.fs-bar.is-upcoming .fs-bar-text { color:var(--orange-700); text-shadow:none; }
.fs-bar.is-wide { height:1.25rem; }
.fs-bar.is-wide .fs-bar-text { font-size:0.6875rem; line-height:1.25rem; }
.product-card-soldout { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; background:rgba(17,24,39,.45); color:var(--white); font-size:0.75rem; font-weight:700; text-transform:uppercase; }
.fs-timer { display:inline-flex; align-items:center; gap:0.125rem; font-weight:700; font-variant-numeric:tabular-nums; }
.fs-timer-box { min-width:1.375rem; padding:0.0625rem 0.25rem; border-radius:0.25rem; background:var(--gray-900); color:var(--white); font-size:0.75rem; text-align:center; }
.fs-tag { display:inline-flex; align-items:center; gap:0.0625rem; margin-right:0.125rem; padding:0 0.25rem; border-radius:0.25rem; background:var(--red-500); color:var(--white); font-size:0.5625rem; font-weight:700; vertical-align:middle; }
.fs-skeleton-card { aspect-ratio:3/4.3; border-radius:0.5rem; background:linear-gradient(90deg,var(--gray-100) 25%,var(--gray-200) 37%,var(--gray-100) 63%); background-size:400% 100%; animation:fs-shimmer 1.4s ease infinite; }
@keyframes fs-shimmer { 0% { background-position:100% 50%; } 100% { background-position:0 50%; } }
.fs-note { display:block; margin-top:0.25rem; font-size:0.6875rem; line-height:1.35; color:var(--red-500); }
@media (min-width:640px) {
	.fs-bar-text { font-size:0.625rem; }
	.product-card-soldout { font-size:0.875rem; }
}