/* =========================================================================
   Shop99s — Men's Fashion Theme
   CSS thuần, mobile-first. Token hoá qua custom properties.
   ========================================================================= */

:root {
	--c-ink: #14110f;
	--c-ink-soft: #4a4540;
	--c-muted: #8a847d;
	--c-line: #e7e3dd;
	--c-bg: #ffffff;
	--c-bg-soft: #f6f4f1;
	--c-accent: #b8893f;        /* vàng đồng — sang trọng nam tính */
	--c-accent-dark: #9a6f2c;
	--c-sale: #c0392b;
	--c-success: #2e7d52;

	--ff-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
	--ff-display: 'Playfair Display', Georgia, serif;

	--container: 1280px;
	--radius: 10px;
	--radius-sm: 6px;
	--shadow-sm: 0 1px 3px rgba(20,17,15,.08);
	--shadow-md: 0 8px 30px rgba(20,17,15,.12);
	--ease: cubic-bezier(.4,0,.2,1);
	--header-h: 72px;
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scrollbar-gutter: stable; }
body {
	font-family: var(--ff-sans);
	color: var(--c-ink);
	background: var(--c-bg);
	line-height: 1.6;
	font-size: 16px;
	-webkit-font-smoothing: antialiased;
}
img, svg, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; transition: color .2s var(--ease); }
a:hover { color: var(--c-accent); }
ul { list-style: none; padding: 0; }
button { font: inherit; cursor: pointer; }
h1,h2,h3,h4 { line-height: 1.2; font-weight: 700; }

.container { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: clamp(16px, 4vw, 32px); }
.container--narrow { max-width: 820px; }

.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; overflow: hidden;
	clip: rect(1px,1px,1px,1px); white-space: nowrap;
}
.skip-link { position: absolute; left: -999px; top: 0; background: var(--c-ink); color: #fff; padding: 10px 16px; z-index: 1000; }
.skip-link:focus { left: 8px; top: 8px; }

/* ---------- Buttons ---------- */
.btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	padding: 12px 22px; border: 1px solid transparent; border-radius: var(--radius-sm);
	font-weight: 600; font-size: .95rem; letter-spacing: .01em; text-align: center;
	transition: all .2s var(--ease); background: none; color: var(--c-ink); line-height: 1.1;
}
.btn--primary { background: var(--c-ink); color: #fff; border-color: var(--c-ink); }
.btn--primary:hover { background: var(--c-accent); border-color: var(--c-accent); color: #fff; }
.btn--ghost { background: transparent; border-color: var(--c-line); color: var(--c-ink); }
.btn--ghost:hover { border-color: var(--c-ink); color: var(--c-ink); }
.btn--light { background: #fff; color: var(--c-ink); }
.btn--light:hover { background: var(--c-accent); color: #fff; }
.btn--lg { padding: 15px 32px; font-size: 1rem; }

/* =========================================================================
   Header
   ========================================================================= */
.announcement-bar { background: var(--c-ink); color: #fff; font-size: .8rem; }
.announcement-bar p { text-align: center; padding: 8px 0; letter-spacing: .02em; }

.site-header { position: sticky; top: 0; z-index: 100; background: rgba(255,255,255,.92); backdrop-filter: saturate(180%) blur(10px); border-bottom: 1px solid var(--c-line); }
.site-header__inner { display: flex; align-items: center; gap: 24px; min-height: var(--header-h); }

.site-branding .site-title-wrap { margin: 0; }
.site-title { font-family: var(--ff-display); font-size: 1.6rem; font-weight: 700; letter-spacing: -.01em; color: var(--c-ink); }
.custom-logo { max-height: 44px; width: auto; }

.main-navigation { margin-inline-start: auto; }
.primary-menu { display: flex; gap: 28px; align-items: center; }
.primary-menu a { font-weight: 500; font-size: .95rem; position: relative; padding: 6px 0; }
.primary-menu a::after { content: ''; position: absolute; left: 0; bottom: 0; height: 2px; width: 0; background: var(--c-accent); transition: width .25s var(--ease); }
.primary-menu a:hover::after, .primary-menu .current-menu-item > a::after { width: 100%; }

.header-actions { display: flex; align-items: center; gap: 6px; margin-inline-start: 8px; }
.header-action { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 50%; color: var(--c-ink); background: transparent; border: none; transition: background .2s var(--ease); }
.header-action:hover { background: var(--c-bg-soft); color: var(--c-ink); }

.nav-toggle { display: none; flex-direction: column; gap: 5px; width: 42px; height: 42px; border: none; background: none; align-items: center; justify-content: center; }
.nav-toggle span { width: 22px; height: 2px; background: var(--c-ink); transition: .3s var(--ease); }
body.nav-open .nav-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
body.nav-open .nav-toggle span:nth-child(2) { opacity: 0; }
body.nav-open .nav-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Header search drawer */
.header-search { border-top: 1px solid var(--c-line); background: #fff; padding: 18px 0; }
.search-form { display: flex; gap: 10px; }
.search-form .search-field { flex: 1; padding: 13px 16px; border: 1px solid var(--c-line); border-radius: var(--radius-sm); font-size: 1rem; }
.search-form .search-field:focus { outline: none; border-color: var(--c-ink); }

/* ---------- Mini cart ---------- */
.mini-cart { position: relative; }
.mini-cart__count {
	position: absolute; top: 4px; right: 4px; min-width: 18px; height: 18px; padding: 0 5px;
	background: var(--c-accent); color: #fff; border-radius: 999px; font-size: .68rem; font-weight: 700;
	display: inline-flex; align-items: center; justify-content: center; line-height: 1;
}
.cart-bump { animation: cartBump .4s var(--ease); }
@keyframes cartBump { 0%,100% { transform: scale(1); } 30% { transform: scale(1.25); } 60% { transform: scale(.92); } }

.mini-cart__panel {
	position: fixed; top: 0; right: 0; height: 100dvh; width: min(400px, 90vw);
	background: #fff; box-shadow: var(--shadow-md); z-index: 300;
	transform: translateX(100%); transition: transform .3s var(--ease); display: flex; flex-direction: column;
}
body.mini-cart-open .mini-cart__panel { transform: translateX(0); }
.mini-cart__panel-inner { display: flex; flex-direction: column; height: 100%; }
.mini-cart__header { display: flex; align-items: center; justify-content: space-between; padding: 20px 22px; border-bottom: 1px solid var(--c-line); }
.mini-cart__header strong { font-size: 1.1rem; }
.mini-cart__close { font-size: 1.6rem; line-height: 1; background: none; border: none; color: var(--c-muted); width: 36px; height: 36px; border-radius: 50%; }
.mini-cart__close:hover { background: var(--c-bg-soft); color: var(--c-ink); }

/* WooCommerce mini cart markup */
.widget_shopping_cart_content { display: flex; flex-direction: column; flex: 1; overflow: hidden; padding: 0; }
ul.cart_list, ul.product_list_widget { flex: 1; overflow-y: auto; padding: 8px 22px; margin: 0; list-style: none; }
/* Mỗi item: ảnh vuông 1:1 bên trái (absolute), tên + giá xếp dọc bên phải */
ul.cart_list li, ul.product_list_widget li { position: relative; display: block; list-style: none; padding: 16px 28px 16px 76px; min-height: 92px; border-bottom: 1px solid var(--c-line); }
ul.cart_list li::before, ul.product_list_widget li::before { content: none; }
ul.cart_list li img, ul.product_list_widget li img { position: absolute; left: 0; top: 16px; width: 60px !important; height: 60px !important; object-fit: cover; border-radius: var(--radius-sm); float: none !important; margin: 0 !important; }
ul.cart_list li a:not(.remove), ul.product_list_widget li a:not(.remove) { display: block; font-weight: 600; font-size: .9rem; line-height: 1.35; color: var(--c-ink); }
ul.cart_list li a:not(.remove):hover, ul.product_list_widget li a:not(.remove):hover { color: var(--c-accent); }
ul.cart_list .quantity, ul.product_list_widget .quantity { display: block; color: var(--c-muted); font-size: .85rem; margin-top: 6px; }
ul.cart_list dl.variation, ul.product_list_widget dl.variation { font-size: .78rem; color: var(--c-muted); margin: 4px 0 0; }
ul.cart_list li .remove_from_cart_button, ul.cart_list li a.remove, ul.product_list_widget li a.remove { position: absolute; top: 16px; right: 0; width: 22px; height: 22px; line-height: 20px; text-align: center; border-radius: 50%; color: var(--c-muted); font-size: 1.15rem; }
ul.cart_list li .remove_from_cart_button:hover, ul.cart_list li a.remove:hover { color: #fff; background: var(--c-sale); }
.woocommerce-mini-cart__total { display: flex; justify-content: space-between; padding: 18px 22px; border-top: 1px solid var(--c-line); font-size: 1.05rem; }
.woocommerce-mini-cart__buttons { display: flex; flex-direction: column; gap: 10px; padding: 0 22px 22px; }
.woocommerce-mini-cart__buttons .button { display: block; text-align: center; padding: 13px; border-radius: var(--radius-sm); font-weight: 600; }
.woocommerce-mini-cart__buttons .button:not(.checkout) { background: var(--c-bg-soft); color: var(--c-ink); }
.woocommerce-mini-cart__buttons .button.checkout { background: var(--c-ink); color: #fff; }
.woocommerce-mini-cart__buttons .button.checkout:hover { background: var(--c-accent); }
.woocommerce-mini-cart__empty-message { padding: 40px 22px; text-align: center; color: var(--c-muted); }

/* Overlay */
.site-overlay { position: fixed; inset: 0; background: rgba(20,17,15,.45); z-index: 200; opacity: 0; transition: opacity .25s var(--ease); }
.site-overlay.is-active { opacity: 1; }
/* Menu mobile nằm trong .site-header → khi mở, nâng header lên trên overlay để
   drawer không bị che. (Mini cart đã tách ra cấp body nên không cần nâng header,
   nhờ vậy overlay che được cả header khi mở giỏ.) */
body.nav-open .site-header { z-index: 300; }
/* Khoá cuộn body khi đang mở mini cart / menu mobile (panel vẫn cuộn nội bộ) */
body.mini-cart-open, body.nav-open { overflow: hidden; }

/* Fly to cart */
.fly-to-cart { position: fixed; z-index: 500; pointer-events: none; border-radius: var(--radius-sm); object-fit: cover; box-shadow: var(--shadow-md); transition: transform .8s cubic-bezier(.5,-0.3,.3,1), opacity .8s ease; }

/* =========================================================================
   Hero
   ========================================================================= */
.hero { position: relative; color: #fff; overflow: hidden; background: radial-gradient(130% 130% at 10% 15%, #2a2118 0%, #14110f 56%), var(--c-ink); }
.hero__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 4vw, 64px); align-items: center; min-height: clamp(500px, 70vh, 680px); padding-block: 48px; }

.hero__content { max-width: 560px; }
.hero__eyebrow { letter-spacing: .25em; font-size: .8rem; font-weight: 600; margin-bottom: 18px; color: var(--c-accent); }
.hero__title { font-family: var(--ff-display); font-size: clamp(2.1rem, 4.4vw, 3.7rem); line-height: 1.08; margin-bottom: 18px; }
.hero__sub { font-size: clamp(1rem, 1.4vw, 1.18rem); max-width: 440px; margin-bottom: 30px; color: rgba(255,255,255,.84); }
.hero__actions { display: flex; gap: 14px; flex-wrap: wrap; }
.hero__actions .btn--ghost { border-color: rgba(255,255,255,.5); color: #fff; }
.hero__actions .btn--ghost:hover { background: #fff; color: var(--c-ink); border-color: #fff; }

.hero__stats { display: flex; gap: 40px; margin-top: 44px; padding-top: 28px; border-top: 1px solid rgba(255,255,255,.16); max-width: 460px; }
.hero__stats li { display: flex; flex-direction: column; gap: 2px; }
.hero__stats strong { font-size: 1.6rem; font-family: var(--ff-display); }
.hero__stats span { font-size: .82rem; color: rgba(255,255,255,.62); }

/* Cột ảnh người mẫu bên phải */
.hero__media { justify-self: end; width: 100%; max-width: 480px; aspect-ratio: 4/5; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-md); }
.hero__media-img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s var(--ease); }
.hero__media:hover .hero__media-img { transform: scale(1.03); }

/* =========================================================================
   USP bar
   ========================================================================= */
.usp-bar { border-bottom: 1px solid var(--c-line); }
.usp-bar__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; padding: 32px 0; }
.usp { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; }
.usp__icon { font-size: 1.6rem; }
.usp h3 { font-size: 1rem; }
.usp p { color: var(--c-muted); font-size: .88rem; }

/* =========================================================================
   Home sections
   ========================================================================= */
.home-section { padding: clamp(48px, 7vw, 88px) 0; }
.home-section:nth-child(even) { background: var(--c-bg-soft); }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 36px; gap: 16px; flex-wrap: wrap; }
.section-title { font-family: var(--ff-display); font-size: clamp(1.6rem, 3vw, 2.4rem); }
.section-sub { color: var(--c-muted); margin-top: 4px; }
.section-link { font-weight: 600; color: var(--c-accent); }

/* Category grid */
.category-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.category-card { position: relative; border-radius: var(--radius); overflow: hidden; aspect-ratio: 4/5; }
.category-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.category-card:hover img { transform: scale(1.06); }
.category-card__overlay { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 22px; background: linear-gradient(0deg, rgba(20,17,15,.75), transparent 55%); color: #fff; }
.category-card__name { font-size: 1.35rem; font-weight: 700; font-family: var(--ff-display); }
.category-card__count { font-size: .85rem; opacity: .85; }

/* Editorial banner — gradient nâu ấm để tách biệt rõ với footer (đen) */
.editorial-banner { background: linear-gradient(120deg, #3a2c1d 0%, #1d160f 70%); color: #fff; }
.editorial-banner__inner { padding: clamp(56px, 9vw, 104px) 0; max-width: 620px; margin-inline: auto; text-align: center; }
.editorial-banner .eyebrow { letter-spacing: .2em; font-size: .8rem; color: var(--c-accent); margin-bottom: 14px; font-weight: 600; text-transform: uppercase; }
.editorial-banner h2 { font-family: var(--ff-display); font-size: clamp(1.8rem, 4vw, 3rem); margin-bottom: 14px; }
.editorial-banner p { opacity: .9; margin-bottom: 26px; }

/* =========================================================================
   Product grid & cards (loop)
   ========================================================================= */
ul.products { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin: 0; padding: 0; list-style: none; }
.home-bestsellers ul.products, .shop-content ul.products { gap: 24px; }

li.product-card { list-style: none; }
.product-card__inner { display: flex; flex-direction: column; height: 100%; background: #fff; border-radius: var(--radius); overflow: hidden; transition: box-shadow .25s var(--ease), transform .25s var(--ease); }
.product-card__inner:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
.product-card__media { position: relative; aspect-ratio: 4/5; background: var(--c-bg-soft); overflow: hidden; }
.product-card__img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.product-card__inner:hover .product-card__img { transform: scale(1.05); }

.badge { position: absolute; top: 12px; left: 12px; padding: 5px 10px; font-size: .72rem; font-weight: 700; border-radius: 4px; text-transform: uppercase; letter-spacing: .04em; z-index: 2; }
.badge--sale { background: var(--c-sale); color: #fff; }
.badge--out { background: var(--c-ink-soft); color: #fff; left: auto; right: 12px; }

.product-card__body { display: flex; flex-direction: column; gap: 6px; padding: 16px; flex: 1; }
.product-card__cat { font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; color: var(--c-muted); }
.product-card__title { font-size: 1rem; font-weight: 600; line-height: 1.35; }
.product-card__title a { color: var(--c-ink); }
.product-card__title a:hover { color: var(--c-accent); }

.product-card__rating { min-height: 18px; display: flex; align-items: center; gap: 6px; }
.product-card__rating--empty { min-height: 18px; }
.rating-count { font-size: .8rem; color: var(--c-muted); }

/* Star rating dùng CSS mask qua ký tự */
.stars { --rating: 0; display: inline-block; font-size: .95rem; line-height: 1; font-family: Times, serif; letter-spacing: 2px; }
.stars::before { content: '★★★★★'; background: linear-gradient(90deg, var(--c-accent) calc(var(--rating) / 5 * 100%), #d9d4cd calc(var(--rating) / 5 * 100%)); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* WooCommerce star-rating (đã gỡ CSS gốc của WC nên tự dựng bằng unicode) */
.star-rating { position: relative; display: inline-block; width: 5.3em; height: 1em; line-height: 1; overflow: hidden; font-family: Georgia, 'Times New Roman', serif; font-size: 1rem; letter-spacing: .08em; flex-shrink: 0; vertical-align: middle; }
.star-rating::before { content: '★★★★★'; position: absolute; left: 0; top: 0; color: #d9d4cd; }
.star-rating span { position: absolute; left: 0; top: 0; overflow: hidden; white-space: nowrap; font-size: 0; }
.star-rating span::before { content: '★★★★★'; color: var(--c-accent); font-size: 1rem; letter-spacing: .08em; }
.woocommerce-product-rating { display: flex; align-items: center; gap: 10px; }
.woocommerce-review-link { color: var(--c-muted); font-size: .85rem; }
/* Chọn sao khi viết review */
p.stars a { color: var(--c-accent); }

.product-card__price { font-size: 1.05rem; font-weight: 700; color: var(--c-ink); margin-top: auto; }
.product-card__price del { color: var(--c-muted); font-weight: 400; font-size: .9rem; margin-right: 6px; }
.product-card__price ins { text-decoration: none; color: var(--c-sale); }

.product-card__actions { margin-top: 12px; }
.product-card__add { width: 100%; position: relative; }
.product-card__add.loading, .product-card__add.is-loading { color: transparent !important; pointer-events: none; }
.product-card__add.is-loading::after { content: ''; position: absolute; width: 18px; height: 18px; border: 2px solid rgba(255,255,255,.4); border-top-color: #fff; border-radius: 50%; animation: spin .7s linear infinite; }
.product-card__add.is-added { background: var(--c-success) !important; border-color: var(--c-success) !important; color: #fff !important; }
.product-card__add.added::after { display: none; }
@keyframes spin { to { transform: rotate(360deg); } }

/* nút "added to cart" link mặc định của WC ẩn đi (đã có mini cart) */
.product-card__actions a.added_to_cart { display: none; }

/* =========================================================================
   Shop layout (archive) + Filters
   ========================================================================= */
.breadcrumb-bar { background: var(--c-bg-soft); border-bottom: 1px solid var(--c-line); font-size: .85rem; }
.woocommerce-breadcrumb { list-style: none; margin: 0; padding: 14px 0; color: var(--c-muted); display: flex; flex-wrap: wrap; align-items: center; gap: 0; }
.woocommerce-breadcrumb li { list-style: none; display: inline-flex; align-items: center; }
.woocommerce-breadcrumb li::before { content: none; }
.woocommerce-breadcrumb a { color: var(--c-ink-soft); }
.woocommerce-breadcrumb a:hover { color: var(--c-accent); }
.woocommerce-breadcrumb li:last-child { color: var(--c-ink); font-weight: 500; }
.breadcrumb-bar .sep { margin: 0 10px; color: var(--c-muted); }

.wc-page { padding-block: 40px 72px; }
.shop-header { margin-bottom: 28px; }
.shop-header__title { font-family: var(--ff-display); font-size: clamp(1.8rem, 3.5vw, 2.6rem); }

.shop-layout { display: grid; grid-template-columns: 280px 1fr; gap: 40px; align-items: start; }
/* Bộ lọc: chỉ cuộn nội bộ KHI cao hơn viewport (max-height), còn lại cuộn body.
   scrollbar-gutter:stable + padding-right giữ thanh cuộn không đè lên nội dung. */
.shop-sidebar {
	position: sticky;
	top: calc(var(--header-h) + 16px);
	max-height: calc(100dvh - var(--header-h) - 32px);
	overflow-y: auto;
	scrollbar-gutter: stable;
	padding-right: 12px;
	scrollbar-width: thin;
	scrollbar-color: var(--c-line) transparent;
}
.shop-sidebar::-webkit-scrollbar { width: 8px; }
.shop-sidebar::-webkit-scrollbar-track { background: transparent; }
.shop-sidebar::-webkit-scrollbar-thumb { background: var(--c-line); border-radius: 4px; }
.shop-sidebar::-webkit-scrollbar-thumb:hover { background: var(--c-muted); }
.shop-sidebar__mobile-toggle { display: none; width: 100%; margin-bottom: 16px; }

.shop-filters { display: flex; flex-direction: column; gap: 24px; }
.shop-filters__head { display: flex; align-items: center; justify-content: space-between; }
.shop-filters__title { font-size: 1.2rem; }
.shop-filters__reset { font-size: .8rem; color: var(--c-muted); }
.shop-filters__reset:hover { color: var(--c-sale); }

.filter-group { border: none; padding: 0 0 22px; border-bottom: 1px solid var(--c-line); display: flex; flex-direction: column; gap: 12px; }
.filter-group:last-of-type { border-bottom: none; }
.filter-group__legend { font-weight: 600; font-size: .95rem; padding: 0; margin-bottom: 6px; }
.filter-group input[type="search"], .filter-group input[type="number"] { width: 100%; padding: 10px 12px; border: 1px solid var(--c-line); border-radius: var(--radius-sm); font-size: .9rem; }
.filter-group input:focus { outline: none; border-color: var(--c-ink); }

.filter-list { display: flex; flex-direction: column; gap: 10px; }
.filter-list label { display: flex; align-items: center; gap: 10px; font-size: .9rem; cursor: pointer; }
.filter-list label:hover { color: var(--c-accent); }
.filter-list input { accent-color: var(--c-accent); width: 16px; height: 16px; }
.filter-count { margin-left: auto; color: var(--c-muted); font-size: .78rem; font-style: normal; }
.filter-stars { color: var(--c-accent); font-size: 1rem; letter-spacing: 2px; line-height: 1; }
.filter-stars__empty { color: #d9d4cd; }

.filter-price { display: flex; align-items: center; gap: 8px; }
.filter-price span { color: var(--c-muted); }
.filter-toggle { display: flex; align-items: center; gap: 10px; font-size: .9rem; cursor: pointer; }
.shop-filters__submit { width: 100%; }

/* Shop toolbar */
.shop-content { min-width: 0; }
.shop-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 24px; padding-bottom: 16px; border-bottom: 1px solid var(--c-line); flex-wrap: wrap; }
.woocommerce-result-count { color: var(--c-muted); font-size: .9rem; margin: 0; }
.woocommerce-ordering select { padding: 9px 14px; border: 1px solid var(--c-line); border-radius: var(--radius-sm); font-size: .9rem; background: #fff; }

/* Pagination */
.woocommerce-pagination { margin-top: 48px; }
.woocommerce-pagination ul { display: flex; gap: 8px; justify-content: center; border: none !important; }
.woocommerce-pagination ul li { border: none !important; }
.woocommerce-pagination a, .woocommerce-pagination span { display: inline-flex; align-items: center; justify-content: center; min-width: 42px; height: 42px; border: 1px solid var(--c-line) !important; border-radius: var(--radius-sm); padding: 0 8px; }
.woocommerce-pagination .current { background: var(--c-ink); color: #fff; border-color: var(--c-ink) !important; }

.woocommerce-info, .woocommerce-no-products-found .woocommerce-info { background: var(--c-bg-soft); padding: 18px 22px; border-radius: var(--radius); border-left: 3px solid var(--c-accent); }

/* =========================================================================
   Single product
   ========================================================================= */
/* Grid: gallery (trái) + summary (phải) ở hàng 1; tabs/upsells/related full-width.
   onsale ĐƯA RA position:absolute để không chiếm ô grid làm lệch layout. */
.single-product div.product { position: relative; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); column-gap: clamp(28px, 4vw, 56px); row-gap: 48px; align-items: start; }
.single-product div.product > .woocommerce-product-gallery { grid-column: 1; grid-row: 1; min-width: 0; }
.single-product div.product > .summary { grid-column: 2; grid-row: 1; }
.single-product div.product > .onsale { position: absolute; top: 16px; left: 16px; z-index: 3; margin: 0; background: var(--c-sale); color: #fff; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 6px 12px; border-radius: 4px; line-height: 1; }
/* ---- Product gallery (đã gỡ CSS gốc WC → bổ sung lại + flexslider) ---- */
.woocommerce-product-gallery { position: relative; }
.woocommerce-product-gallery__wrapper { margin: 0; padding: 0; }
/* Main image: ép MỌI ảnh về cùng tỉ lệ 1:1, crop bằng object-fit cover */
.woocommerce-product-gallery__image { aspect-ratio: 1 / 1; overflow: hidden; border-radius: var(--radius); background: var(--c-bg-soft); }
.woocommerce-product-gallery__image a { display: block; width: 100%; height: 100%; }
.woocommerce-product-gallery__image img { display: block; width: 100% !important; height: 100% !important; object-fit: cover; cursor: zoom-in; }
/* fallback trước khi JS slider chạy: ảnh phụ nhỏ lại thay vì stack full chiều cao */
.woocommerce-product-gallery__image:nth-child(n+2) { width: 25%; display: inline-block; }
.flexslider .woocommerce-product-gallery__image:nth-child(n+2) { width: auto; display: block; }
/* viewport của flexslider: chỉ hiện 1 ảnh, chiều cao theo tỉ lệ ảnh (bỏ height inline) */
.flex-viewport { border-radius: var(--radius); overflow: hidden; height: auto !important; }

/* nút phóng to (kính lúp) */
.woocommerce-product-gallery__trigger { position: absolute; top: 12px; right: 12px; z-index: 5; width: 40px; height: 40px; padding: 0; border: none; border-radius: 50%; background: #fff; box-shadow: var(--shadow-sm); cursor: pointer; text-indent: -9999px; }
.woocommerce-product-gallery__trigger::before { content: ""; position: absolute; left: 12px; top: 12px; width: 11px; height: 11px; border: 2px solid var(--c-ink); border-radius: 50%; box-sizing: content-box; }
.woocommerce-product-gallery__trigger::after { content: ""; position: absolute; left: 25px; top: 23px; width: 2px; height: 9px; background: var(--c-ink); border-radius: 2px; transform: rotate(-45deg); }

/* thumbnails dưới ảnh chính: hàng ngang, KHÔNG hiện số thứ tự */
.flex-control-nav.flex-control-thumbs { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; margin: 14px 0 0; padding: 0; }
.flex-control-thumbs li { width: calc(25% - 7.5px); margin: 0; list-style: none; }
.flex-control-thumbs li::before { content: none; }
.flex-control-thumbs li img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: var(--radius-sm); cursor: pointer; opacity: .5; transition: opacity .2s var(--ease); }
.flex-control-thumbs li img.flex-active, .flex-control-thumbs li img:hover { opacity: 1; }
.single-product div.product .product_title { font-family: var(--ff-display); font-size: clamp(1.7rem, 3.5vw, 2.6rem); margin-bottom: 14px; }
.single-product .price { font-size: 1.6rem; font-weight: 700; color: var(--c-ink); margin-bottom: 18px; }
.single-product .price del { color: var(--c-muted); font-weight: 400; font-size: 1.1rem; margin-right: 10px; }
.single-product .price ins { text-decoration: none; color: var(--c-sale); }
.single-product .woocommerce-product-rating { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; }
.single-product .woocommerce-product-details__short-description { color: var(--c-ink-soft); margin-bottom: 24px; }

/* Variations table */
.single-product .variations { width: 100%; margin-bottom: 20px; border-collapse: collapse; }
.single-product .variations th { text-align: left; padding: 10px 12px 10px 0; font-weight: 600; vertical-align: middle; width: 110px; }
.single-product .variations td { padding: 8px 0; }
.single-product .variations select { width: 100%; padding: 12px 14px; border: 1px solid var(--c-line); border-radius: var(--radius-sm); font-size: .95rem; background: #fff; }
.single-product .reset_variations { font-size: .82rem; color: var(--c-muted); display: inline-block; margin-top: 6px; }
.single-product .woocommerce-variation-price { font-size: 1.4rem; font-weight: 700; margin: 4px 0 14px; }

/* ---- Variation swatches: màu = vòng tròn, size = nút pill ---- */
.single-product .variations select.swatch-hidden { display: none; }
.single-product .variations td { padding: 6px 0 4px; }
.swatches { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.swatch { cursor: pointer; background: none; font: inherit; transition: transform .15s var(--ease), border-color .15s var(--ease), background .15s var(--ease), box-shadow .15s var(--ease); }
.swatch.is-disabled { opacity: .3; pointer-events: none; }

/* pill (size & thuộc tính chữ) */
.swatch--pill { min-width: 50px; height: 44px; padding: 0 18px; border: 1px solid var(--c-line); border-radius: var(--radius-sm); font-weight: 600; font-size: .92rem; color: var(--c-ink); background: #fff; }
.swatch--pill:hover { border-color: var(--c-ink); }
.swatch--pill.is-active { background: var(--c-ink); border-color: var(--c-ink); color: #fff; }

/* color circle */
.swatch--color { width: 38px; height: 38px; border-radius: 50%; padding: 0; position: relative; background: var(--swatch, #e3e3e3); box-shadow: inset 0 0 0 2px #fff, 0 0 0 1px var(--c-line); }
.swatch--color:hover { transform: scale(1.08); }
.swatch--color.is-active { box-shadow: inset 0 0 0 2px #fff, 0 0 0 3px var(--c-ink); transform: scale(1.05); }
.swatch--color.swatch--unknown { background: repeating-linear-gradient(45deg, #eee, #eee 5px, #dcdcdc 5px, #dcdcdc 10px); }

/* Variable: form xếp dọc (chỉ hàng qty+button mới flex), không để bảng variations
   bị flex ngang theo rule .single-product form.cart của sản phẩm simple. */
.single-product form.variations_form.cart { display: block; }

/* số lượng + nút thêm giỏ cùng hàng (cả simple & variable) */
.single-product .woocommerce-variation-add-to-cart { display: flex; align-items: stretch; gap: 12px; flex-wrap: wrap; margin-top: 4px; }
.single-product .woocommerce-variation-add-to-cart .quantity { flex: 0 0 auto; }
.single-product .woocommerce-variation-add-to-cart .single_add_to_cart_button { flex: 1; min-width: 220px; }

/* Quantity + add to cart */
.single-product form.cart { display: flex; gap: 12px; align-items: stretch; flex-wrap: wrap; margin-bottom: 28px; }
.single-product form.cart .quantity { display: flex; }
.single-product .quantity input.qty { width: 72px; text-align: center; padding: 13px 8px; border: 1px solid var(--c-line); border-radius: var(--radius-sm); font-size: 1rem; }
.single-product form.cart .single_add_to_cart_button {
	flex: 1; min-width: 220px; background: var(--c-ink); color: #fff; border: 1px solid var(--c-ink);
	padding: 14px 28px; border-radius: var(--radius-sm); font-weight: 600; font-size: 1rem; transition: all .2s var(--ease);
	position: relative;
}
.single-product form.cart .single_add_to_cart_button:hover { background: var(--c-accent); border-color: var(--c-accent); }
.single-product form.cart .single_add_to_cart_button.loading { color: transparent !important; pointer-events: none; }
.single-product form.cart .single_add_to_cart_button.loading::after { content: ""; position: absolute; top: calc(50% - 9px); left: calc(50% - 9px); width: 18px; height: 18px; border: 2px solid rgba(255,255,255,.4); border-top-color: #fff; border-radius: 50%; animation: spin .7s linear infinite; }
.single-product form.cart .single_add_to_cart_button.added { background: var(--c-success) !important; border-color: var(--c-success) !important; }

.single-product .product_meta { font-size: .88rem; color: var(--c-muted); border-top: 1px solid var(--c-line); padding-top: 18px; display: flex; flex-direction: column; gap: 6px; }
.single-product .product_meta a { color: var(--c-ink-soft); }

/* Tabs */
.woocommerce-tabs { grid-column: 1 / -1; margin-top: 24px; }
.woocommerce-tabs ul.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--c-line); margin-bottom: 28px; flex-wrap: wrap; padding: 0; }
.woocommerce-tabs ul.tabs li { list-style: none; }
.woocommerce-tabs ul.tabs li a { display: block; padding: 14px 22px; font-weight: 600; color: var(--c-muted); border-bottom: 2px solid transparent; margin-bottom: -1px; }
.woocommerce-tabs ul.tabs li.active a { color: var(--c-ink); border-bottom-color: var(--c-ink); }
.woocommerce-Tabs-panel h2 { font-family: var(--ff-display); margin-bottom: 16px; }
/* Bảng "Thông tin bổ sung" — cố định cột label để các hàng thẳng cột */
.woocommerce-product-attributes { width: 100%; max-width: 560px; border-collapse: collapse; }
.woocommerce-product-attributes th { width: 180px; text-align: left; vertical-align: top; padding: 13px 20px 13px 0; font-weight: 600; color: var(--c-ink); border-bottom: 1px solid var(--c-line); }
.woocommerce-product-attributes td { padding: 13px 0; vertical-align: top; color: var(--c-ink-soft); border-bottom: 1px solid var(--c-line); }
.woocommerce-product-attributes p { margin: 0; }

/* =========================================================================
   Đánh giá sản phẩm (reviews)
   ========================================================================= */
#reviews .woocommerce-Reviews-title { font-family: var(--ff-display); font-size: 1.5rem; margin-bottom: 24px; }
#reviews .commentlist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 24px; }
#reviews .commentlist > li { list-style: none; }
#reviews .commentlist > li::before { content: none; }
.review-card .comment_container { display: flex; gap: 16px; align-items: flex-start; }
.review-card img.avatar { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; flex-shrink: 0; margin: 0; background: var(--c-bg-soft); }
.review-card .comment-text { flex: 1; min-width: 0; }
.review-card .star-rating { font-size: .95rem; margin-bottom: 6px; }
.review-card .meta { font-size: .9rem; color: var(--c-muted); margin: 0 0 8px; }
.review-card .woocommerce-review__author { color: var(--c-ink); font-weight: 600; }
.review-card .description { color: var(--c-ink-soft); }
.review-card .description p { margin: 0; }
.review-card[hidden] { display: none; }

/* Ảnh trong từng review */
.review-images { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.review-images__thumb { width: 72px; height: 72px; padding: 0; border: 1px solid var(--c-line); border-radius: var(--radius-sm); overflow: hidden; cursor: pointer; background: var(--c-bg-soft); transition: border-color .15s var(--ease); }
.review-images__thumb:hover { border-color: var(--c-ink); }
.review-images__thumb img { width: 100%; height: 100%; object-fit: cover; }

/* Gallery tổng hợp ảnh từ các review (JS dựng) */
.reviews-gallery { margin: 0 0 28px; }
.reviews-gallery__title { font-size: .9rem; font-weight: 600; color: var(--c-ink); margin-bottom: 12px; }
.reviews-gallery__strip { display: flex; flex-wrap: wrap; gap: 8px; }
.reviews-gallery__item { position: relative; width: 84px; height: 84px; padding: 0; border: none; border-radius: var(--radius-sm); overflow: hidden; cursor: pointer; background: var(--c-bg-soft); }
.reviews-gallery__item img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s var(--ease); }
.reviews-gallery__item:hover img { transform: scale(1.08); }
.reviews-gallery__item--more::after { content: attr(data-more); position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(20,17,15,.6); color: #fff; font-weight: 700; }

/* Thanh bộ lọc / sắp xếp (JS dựng) */
.reviews-filter { display: flex; flex-wrap: wrap; gap: 14px 32px; align-items: center; margin-bottom: 24px; padding-bottom: 18px; border-bottom: 1px solid var(--c-line); }
.reviews-filter__group { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
/* Vạch ngăn nhẹ giữa nhóm Lọc và nhóm Sắp xếp */
.reviews-filter__group + .reviews-filter__group { border-left: 1px solid var(--c-line); padding-left: 28px; }
.reviews-filter__btn { padding: 8px 16px; border: 1px solid var(--c-line); border-radius: 999px; font-size: .88rem; font-weight: 500; color: var(--c-ink-soft); background: #fff; cursor: pointer; transition: all .15s var(--ease); }
.reviews-filter__btn:hover { border-color: var(--c-ink); }
.reviews-filter__btn.is-active { background: var(--c-ink); border-color: var(--c-ink); color: #fff; }

/* Lightbox xem ảnh + nội dung bình luận */
.review-lightbox { position: fixed; inset: 0; z-index: 500; display: none; }
.review-lightbox.is-open { display: flex; }
body.review-lb-open { overflow: hidden; }
.review-lightbox__backdrop { position: absolute; inset: 0; background: rgba(10,8,6,.9); }
.review-lightbox__dialog { position: relative; margin: auto; display: grid; grid-template-columns: minmax(0,1.4fr) minmax(0,1fr); max-width: 1000px; width: 92vw; max-height: 88vh; background: #fff; border-radius: var(--radius); overflow: hidden; z-index: 1; }
.review-lightbox__media { background: #14110f; display: flex; align-items: center; justify-content: center; min-height: 320px; }
.review-lightbox__media img { max-width: 100%; max-height: 88vh; object-fit: contain; display: block; }
.review-lightbox__info { padding: 28px; overflow-y: auto; }
.review-lightbox__info .star-rating { margin: 8px 0 12px; }
.review-lightbox__author { font-weight: 600; font-size: 1.05rem; }
.review-lightbox__date { color: var(--c-muted); font-size: .85rem; }
.review-lightbox__text { margin-top: 14px; color: var(--c-ink-soft); line-height: 1.6; }
.review-lightbox__count { color: var(--c-muted); font-size: .85rem; margin-top: 18px; }
.review-lightbox__close { position: absolute; top: 14px; right: 14px; z-index: 3; width: 40px; height: 40px; border-radius: 50%; background: rgba(255,255,255,.92); border: none; font-size: 1.4rem; line-height: 1; cursor: pointer; }
.review-lightbox__nav { position: absolute; top: 50%; transform: translateY(-50%); width: 46px; height: 46px; border-radius: 50%; background: rgba(255,255,255,.92); border: none; font-size: 1.4rem; cursor: pointer; z-index: 3; display: flex; align-items: center; justify-content: center; }
.review-lightbox__nav--prev { left: 14px; }
.review-lightbox__nav--next { right: 14px; }
.review-lightbox__nav[disabled] { opacity: .35; cursor: default; }

/* Form đánh giá */
#review_form_wrapper { margin-top: 40px; padding-top: 28px; border-top: 1px solid var(--c-line); }
#review_form .comment-reply-title { font-family: var(--ff-display); font-size: 1.25rem; margin-bottom: 16px; display: block; }
#review_form .comment-form-rating { margin-bottom: 16px; }
#review_form .comment-form-rating > label { display: block; font-weight: 600; margin-bottom: 8px; }
.comment-form-rating p.stars { display: inline-flex; gap: 2px; }
.comment-form-rating p.stars a { position: relative; width: 1.6em; height: 1.6em; font-size: 1.5rem; text-indent: -999em; display: inline-block; overflow: hidden; }
.comment-form-rating p.stars a::before { content: '★'; position: absolute; top: 0; left: 0; text-indent: 0; width: 1.6em; text-align: center; color: #d9d4cd; line-height: 1.6em; }
.comment-form-rating p.stars:hover a::before { color: var(--c-accent); }
.comment-form-rating p.stars a:hover ~ a::before { color: #d9d4cd; }
.comment-form-rating p.stars a.active::before { color: var(--c-accent); }
.comment-form-rating p.stars a.active ~ a::before { color: #d9d4cd; }
#review_form .comment-form-comment label { display: block; font-weight: 600; margin-bottom: 8px; }
#review_form textarea { width: 100%; min-height: 120px; border: 1px solid var(--c-line); border-radius: var(--radius); padding: 14px; font-family: inherit; font-size: .95rem; }
#review_form textarea:focus { outline: none; border-color: var(--c-ink); }
#review_form .form-submit input[type="submit"] { background: var(--c-ink); color: #fff; border: 1px solid var(--c-ink); border-radius: var(--radius); padding: 13px 28px; font-weight: 600; cursor: pointer; margin-top: 14px; transition: background .2s var(--ease), border-color .2s var(--ease); }
#review_form .form-submit input[type="submit"]:hover { background: var(--c-accent); border-color: var(--c-accent); }
.woocommerce-verification-required { margin-top: 40px; padding: 18px 22px; background: var(--c-bg-soft); border-radius: var(--radius); border-left: 3px solid var(--c-accent); color: var(--c-ink-soft); }
.woocommerce-verification-required a { color: var(--c-accent-dark); font-weight: 600; text-decoration: underline; }

@media (max-width: 700px) {
	.review-lightbox__dialog { grid-template-columns: 1fr; grid-template-rows: auto auto; max-height: 92vh; }
	.review-lightbox__media { min-height: 240px; max-height: 50vh; }
	.review-lightbox__nav--next { right: 14px; }
	.review-lightbox__nav { top: 32%; }
}

/* Related products */
.related.products, .upsells.products { grid-column: 1 / -1; margin-top: 56px; }
.related.products > h2, .upsells.products > h2 { font-family: var(--ff-display); font-size: 1.8rem; margin-bottom: 28px; }

/* =========================================================================
   Cart page
   ========================================================================= */
.woocommerce-cart .wc-page, .woocommerce-checkout .wc-page { padding-block: 40px 80px; }
.woocommerce-cart table.cart { width: 100%; border-collapse: collapse; margin-bottom: 24px; table-layout: fixed; }
.woocommerce-cart table.cart thead th { text-align: left; padding: 12px 14px; border-bottom: 2px solid var(--c-line); font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--c-muted); font-weight: 600; }
.woocommerce-cart table.cart td { padding: 16px 14px; border-bottom: 1px solid var(--c-line); vertical-align: middle; }
/* Độ rộng cột cố định để không bị giãn lung tung */
.woocommerce-cart table.cart .product-remove { width: 52px; text-align: center; padding-inline: 4px; }
.woocommerce-cart table.cart .product-thumbnail { width: 104px; }
.woocommerce-cart table.cart .product-price,
.woocommerce-cart table.cart .product-quantity,
.woocommerce-cart table.cart .product-subtotal { width: 132px; }
.woocommerce-cart table.cart .product-thumbnail img { width: 84px; height: 100px; object-fit: cover; border-radius: var(--radius-sm); display: block; }
.woocommerce-cart table.cart .product-name { word-break: break-word; }
.woocommerce-cart table.cart .product-name a { font-weight: 600; color: var(--c-ink); }
.woocommerce-cart table.cart .product-name a:hover { color: var(--c-accent); }
.woocommerce-cart table.cart .product-name .variation { font-size: .82rem; color: var(--c-muted); margin-top: 4px; }
.woocommerce-cart .product-remove a { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: var(--c-bg-soft); color: var(--c-muted); font-size: 1rem; text-decoration: none; }
.woocommerce-cart .product-remove a:hover { background: var(--c-sale); color: #fff; }
.woocommerce-cart .quantity input.qty { width: 72px; padding: 10px; text-align: center; border: 1px solid var(--c-line); border-radius: var(--radius-sm); }
/* Ẩn nút "Cập nhật giỏ hàng" — số lượng tự cập nhật bằng AJAX */
.woocommerce-cart .actions button[name="update_cart"] { display: none !important; }
/* Trạng thái đang cập nhật AJAX */
.woocommerce.cart-updating { opacity: .5; pointer-events: none; transition: opacity .2s var(--ease); }
.actions .coupon { display: flex; gap: 12px; width: 100%; align-items: stretch; }
.actions .coupon input { flex: 1; min-width: 0; padding: 13px 18px; border: 1px solid var(--c-line); border-radius: var(--radius); }
/* Layout 2 cột: danh sách sản phẩm trái — ô tổng tiền phải (cùng hàng) */
@media (min-width: 880px) {
	.woocommerce-cart .woocommerce { display: grid; grid-template-columns: minmax(0, 1fr) 500px; gap: 40px; align-items: start; }
	.woocommerce-cart .woocommerce > .woocommerce-cart-form { grid-column: 1; grid-row: 1; min-width: 0; }
	.woocommerce-cart .woocommerce > .cart-collaterals { grid-column: 2; grid-row: 1; margin: 0; position: sticky; top: calc(var(--header-h) + 20px); }
	.woocommerce-cart .woocommerce > .woocommerce-notices-wrapper,
	.woocommerce-cart .woocommerce > .woocommerce-message,
	.woocommerce-cart .woocommerce > .woocommerce-info { grid-column: 1 / -1; }
	/* Cột giá/SL/tạm tính gọn hơn vì bảng giờ hẹp lại */
	.woocommerce-cart table.cart .product-price,
	.woocommerce-cart table.cart .product-quantity,
	.woocommerce-cart table.cart .product-subtotal { width: 110px; }
}
.cart-collaterals { display: block; margin-top: 32px; }
.cart_totals { width: 100%; background: var(--c-bg-soft); padding: 28px; border-radius: var(--radius); }
.cart_totals h2 { font-family: var(--ff-display); margin-bottom: 18px; }
.cart_totals table { width: 100%; }
.cart_totals th, .cart_totals td { padding: 12px 0; border-bottom: 1px solid var(--c-line); text-align: left; }
/* Tách label (th) khỏi nội dung (td) + canh trên cho hàng nhiều dòng */
.cart_totals th { padding-right: 28px; vertical-align: top; white-space: nowrap; }
/* Thông tin giao hàng chữ nhỏ hơn, dịu hơn */
.cart_totals .shipping td, .cart_totals .woocommerce-shipping-totals td { font-size: .85rem; color: var(--c-ink-soft); line-height: 1.55; }
.cart_totals .order-total td { font-size: 1.3rem; font-weight: 700; }
.wc-proceed-to-checkout { margin-top: 20px; }
.wc-proceed-to-checkout .checkout-button { display: block; text-align: center; background: var(--c-ink); color: #fff; padding: 16px; border-radius: var(--radius-sm); font-weight: 600; font-size: 1.05rem; }
.wc-proceed-to-checkout .checkout-button:hover { background: var(--c-accent); color: #fff; }
.cart-empty { text-align: center; padding: 40px 0; font-size: 1.1rem; }
.woocommerce-cart .return-to-shop { text-align: center; }

/* =========================================================================
   Checkout page
   ========================================================================= */
.woocommerce-checkout form.checkout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 16px 48px; align-items: start; }
.woocommerce-checkout #customer_details { grid-column: 1; grid-row: 1 / span 2; min-width: 0; }
.woocommerce-checkout #order_review_heading { grid-column: 2; grid-row: 1; }
.woocommerce-checkout form.checkout > #order_review { grid-column: 2; grid-row: 2; min-width: 0; }
.woocommerce-checkout h3 { font-family: var(--ff-display); font-size: 1.4rem; margin-bottom: 18px; padding-bottom: 12px; border-bottom: 1px solid var(--c-line); }
.woocommerce-checkout .form-row { margin-bottom: 16px; display: flex; flex-direction: column; gap: 6px; }
.woocommerce-checkout label { font-weight: 500; font-size: .9rem; }
.woocommerce-checkout .input-text, .woocommerce-checkout select, .woocommerce-checkout textarea {
	width: 100%; padding: 13px 15px; border: 1px solid var(--c-line); border-radius: var(--radius-sm); font-size: .95rem; font-family: inherit;
}
.woocommerce-checkout .input-text:focus, .woocommerce-checkout select:focus, .woocommerce-checkout textarea:focus { outline: none; border-color: var(--c-ink); }
.woocommerce-checkout #order_review { position: sticky; top: calc(var(--header-h) + 20px); background: var(--c-bg-soft); padding: 28px; border-radius: var(--radius); }
.woocommerce-checkout #order_review_heading { font-family: var(--ff-display); font-size: 1.4rem; margin-bottom: 18px; }
.woocommerce-checkout .shop_table { width: 100%; }

/* Form nhập mã giảm giá ở checkout (.checkout_coupon).
   Dùng float thay vì flex vì WC bật/tắt form bằng inline display:none/block. */
.woocommerce-checkout .checkout_coupon { border: 1px solid var(--c-line); border-radius: var(--radius); padding: 18px; margin-bottom: 22px; }
.woocommerce-checkout .checkout_coupon::after { content: ""; display: table; clear: both; }
.woocommerce-checkout .checkout_coupon > p:first-of-type { margin: 0 0 12px; font-size: .88rem; color: var(--c-muted); }
.woocommerce-checkout .checkout_coupon .form-row { margin: 0; padding: 0; }
.woocommerce-checkout .checkout_coupon .form-row-first { float: left; width: calc(100% - 165px); }
.woocommerce-checkout .checkout_coupon .form-row-last { float: left; width: 155px; margin-left: 10px; }
.woocommerce-checkout .checkout_coupon .form-row-first .input-text { width: 100%; min-height: 48px; }
.woocommerce-checkout .checkout_coupon button[name="apply_coupon"] { width: 100%; min-height: 48px; padding: 0 16px; background: var(--c-ink); color: #fff; border: 1px solid var(--c-ink); border-radius: var(--radius); font-weight: 600; white-space: nowrap; transition: background .2s var(--ease), border-color .2s var(--ease); }
.woocommerce-checkout .checkout_coupon button[name="apply_coupon"]:hover { background: var(--c-accent); border-color: var(--c-accent); }
.woocommerce-checkout .checkout_coupon .clear { display: none; }
.woocommerce-checkout .shop_table th, .woocommerce-checkout .shop_table td { padding: 12px 0; border-bottom: 1px solid var(--c-line); text-align: left; }
.woocommerce-checkout .order-total td, .woocommerce-checkout .order-total th { font-size: 1.2rem; font-weight: 700; }
.woocommerce-checkout #payment { background: transparent; margin-top: 18px; }
.woocommerce-checkout #payment ul.payment_methods { list-style: none; padding: 0; border: none; display: flex; flex-direction: column; gap: 8px; }
.woocommerce-checkout #payment ul.payment_methods li { background: #fff; border: 1px solid var(--c-line); border-radius: var(--radius-sm); padding: 14px 16px; }
.woocommerce-checkout #payment .place-order { padding-top: 18px; }
.woocommerce-checkout #place_order { width: 100%; background: var(--c-ink); color: #fff; padding: 16px; border-radius: var(--radius-sm); font-weight: 600; font-size: 1.05rem; border: none; transition: background .2s var(--ease); }
.woocommerce-checkout #place_order:hover { background: var(--c-accent); }

/* WC notices */
.woocommerce-message, .woocommerce-error, .woocommerce-info { border-radius: var(--radius); padding: 16px 20px; margin-bottom: 20px; list-style: none; }
.woocommerce-message { background: #eaf5ee; border-left: 3px solid var(--c-success); }
.woocommerce-error { background: #fbeae8; border-left: 3px solid var(--c-sale); }

/* =========================================================================
   Footer
   ========================================================================= */
.site-footer { background: #0e0c0a; color: #cfc9c1; margin-top: 0; border-top: 3px solid var(--c-accent); }
.site-footer__top { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 40px; padding: 64px 0; }
.site-footer .site-title { color: #fff; }
.footer-tagline { margin: 14px 0 18px; max-width: 320px; font-size: .92rem; }
.footer-social { display: flex; gap: 16px; }
.footer-social a { color: #cfc9c1; font-size: .88rem; }
.footer-social a:hover { color: var(--c-accent); }
.footer-widget__title, .footer-col h3 { color: #fff; font-size: 1rem; margin-bottom: 16px; }
.footer-menu { display: flex; flex-direction: column; gap: 10px; }
.footer-menu a { color: #cfc9c1; font-size: .92rem; }
.footer-menu a:hover { color: #fff; }
.site-footer__bottom { border-top: 1px solid rgba(255,255,255,.12); }
.site-footer__bottom .container { display: flex; justify-content: space-between; gap: 16px; padding: 22px 0; flex-wrap: wrap; }
.site-footer__bottom p { font-size: .82rem; color: #9a948c; }

/* =========================================================================
   Generic content / blog / page
   ========================================================================= */
.page-article, .post-card { padding-block: 40px; }
.page-header { padding-block: 32px 8px; }
.page-title { font-family: var(--ff-display); font-size: clamp(1.8rem, 3.5vw, 2.8rem); }
.entry-content { font-size: 1.05rem; color: var(--c-ink-soft); }
.entry-content > * + * { margin-top: 1.1em; }
.entry-content h2, .entry-content h3 { color: var(--c-ink); margin-top: 1.6em; }
.post-list { display: grid; grid-template-columns: repeat(3,1fr); gap: 28px; padding-block: 40px; }
.post-card { padding: 0; border: 1px solid var(--c-line); border-radius: var(--radius); overflow: hidden; }
.post-card__thumb img { aspect-ratio: 16/10; object-fit: cover; width: 100%; }
.post-card__body { padding: 20px; }
.post-card__title { font-size: 1.2rem; margin-bottom: 8px; }
.post-card__meta { color: var(--c-muted); font-size: .82rem; margin-bottom: 10px; }
.notice { background: var(--c-bg-soft); padding: 20px; border-radius: var(--radius); }

/* =========================================================================
   Responsive
   ========================================================================= */
@media (max-width: 1024px) {
	ul.products { grid-template-columns: repeat(3, 1fr); }
	.single-product div.product { grid-template-columns: 1fr; row-gap: 32px; }
	.single-product div.product > .woocommerce-product-gallery,
	.single-product div.product > .summary { grid-column: 1; grid-row: auto; }
	.single-product div.product > .woocommerce-product-gallery { position: static; }
	.woocommerce-checkout form.checkout { grid-template-columns: 1fr; }
	.woocommerce-checkout #customer_details,
	.woocommerce-checkout #order_review_heading,
	.woocommerce-checkout form.checkout > #order_review { grid-column: 1; grid-row: auto; }
	.woocommerce-checkout #order_review { position: static; }
}

@media (max-width: 880px) {
	.nav-toggle { display: flex; order: -1; }
	.main-navigation {
		position: fixed; top: 0; left: 0; height: 100dvh; width: min(320px, 85vw);
		background: #fff; box-shadow: var(--shadow-md); padding: 80px 28px 28px; margin: 0;
		transform: translateX(-100%); transition: transform .3s var(--ease); z-index: 200; overflow-y: auto;
	}
	body.nav-open .main-navigation { transform: translateX(0); }
	.primary-menu { flex-direction: column; align-items: flex-start; gap: 4px; }
	.primary-menu a { display: block; padding: 12px 0; width: 100%; border-bottom: 1px solid var(--c-line); }
	.primary-menu a::after { display: none; }
	.site-header__inner { gap: 12px; }
	.site-branding { margin-inline-end: auto; }

	.shop-layout { grid-template-columns: 1fr; gap: 20px; }
	.shop-sidebar { position: static; max-height: none; overflow: visible; padding-right: 0; scrollbar-gutter: auto; }
	.shop-sidebar__mobile-toggle { display: block; }
	.shop-sidebar__body { display: none; }
	.shop-sidebar.is-open .shop-sidebar__body { display: block; padding: 20px; border: 1px solid var(--c-line); border-radius: var(--radius); }

	.usp-bar__grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
	.category-grid { grid-template-columns: repeat(2, 1fr); }
	.site-footer__top { grid-template-columns: 1fr 1fr; gap: 32px; }
	.post-list { grid-template-columns: 1fr 1fr; }

	/* Hero mobile: xếp dọc, ảnh model lên trên */
	.hero__grid { grid-template-columns: 1fr; gap: 28px; min-height: 0; padding-block: 36px; text-align: center; }
	.hero__content { max-width: 100%; order: 2; }
	.hero__media { order: 1; justify-self: center; max-width: 300px; aspect-ratio: 4/5; }
	.hero__sub { margin-inline: auto; }
	.hero__actions { justify-content: center; }
	.hero__stats { justify-content: center; margin-inline: auto; }
}

@media (max-width: 560px) {
	ul.products { grid-template-columns: repeat(2, 1fr); gap: 14px; }
	.product-card__body { padding: 12px; }
	.product-card__title { font-size: .9rem; }
	.product-card__add { padding: 10px; font-size: .85rem; }
	.usp-bar__grid { grid-template-columns: 1fr 1fr; }
	.category-grid { grid-template-columns: 1fr; }
	.section-head { flex-direction: column; align-items: flex-start; }
	.site-footer__top { grid-template-columns: 1fr; }
	.post-list { grid-template-columns: 1fr; }
	.hero__actions { width: 100%; }
	.hero__actions .btn { flex: 1; }
	.hero__stats { gap: 18px; margin-top: 28px; padding-top: 20px; }
	.hero__stats strong { font-size: 1.25rem; }
	.hero__stats span { font-size: .72rem; }
	.single-product form.cart .single_add_to_cart_button { min-width: 0; }
}

/* =========================================================================
   WooCommerce — Cart & Checkout (cổ điển)
   ========================================================================= */
.woocommerce-cart .woocommerce, .woocommerce-checkout .woocommerce { max-width: var(--container); margin-inline: auto; }
.woocommerce-checkout #customer_details, .woocommerce-checkout #order_review,
.woocommerce-cart .cart_totals, .woocommerce form.checkout { font-family: var(--ff-sans); color: var(--c-ink); }

.woocommerce-checkout h3, .woocommerce-checkout #order_review_heading,
.woocommerce-billing-fields > h3, .woocommerce-shipping-fields > h3,
.woocommerce .cart_totals h2 {
	font-family: var(--ff-display); font-size: 1.4rem; font-weight: 700; margin: 0 0 18px;
}

/* Inputs */
.woocommerce form .form-row { padding: 0 0 15px; margin: 0; }
.woocommerce form .form-row label { font-size: .82rem; font-weight: 600; color: var(--c-ink-soft); margin-bottom: 6px; display: block; }
.woocommerce form .form-row .required { color: var(--c-sale); border: 0; }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce-checkout select,
.woocommerce #order_review .input-text {
	width: 100%; min-height: 48px; border: 1px solid var(--c-line); border-radius: var(--radius);
	padding: 12px 15px; background: var(--c-bg); font-size: .95rem; color: var(--c-ink);
	font-family: var(--ff-sans); transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.woocommerce form .form-row textarea { min-height: 96px; }
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce-checkout select:focus {
	border-color: var(--c-accent); box-shadow: 0 0 0 3px rgba(184,137,63,.15); outline: none;
}
/* select2 (tỉnh/thành) khớp input */
.woocommerce .select2-container--default .select2-selection--single {
	border: 1px solid var(--c-line) !important; border-radius: var(--radius) !important; height: 48px !important;
}
.woocommerce .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 46px !important; padding-left: 15px !important; color: var(--c-ink); }
.woocommerce .select2-container--default .select2-selection--single .select2-selection__arrow { height: 46px !important; }
.select2-dropdown { border-color: var(--c-line) !important; border-radius: var(--radius) !important; overflow: hidden; }
.select2-container--default .select2-results__option--highlighted[aria-selected] { background: var(--c-accent) !important; }

/* Layout 2 cột dùng GRID (đặt ở .woocommerce-checkout form.checkout phía trên).
   Không dùng float ở đây nữa vì float xung đột với grid → đẩy #order_review
   xuống sai ô khiến cột "Đơn hàng của bạn" trống. */
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 { width: 100%; float: none; padding: 0; }

.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-additional-fields,
.woocommerce-checkout #order_review,
.woocommerce-cart .cart_totals {
	background: var(--c-bg); border: 1px solid var(--c-line); border-radius: var(--radius);
	padding: 26px; margin-bottom: 20px; box-shadow: var(--shadow-sm);
}

/* Bảng đơn hàng */
.woocommerce-checkout-review-order-table, .woocommerce table.shop_table { border: 0 !important; }
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td { border-top: 1px solid var(--c-line) !important; padding: 13px 0 !important; }
.woocommerce-checkout-review-order-table tfoot .order-total th,
.woocommerce-checkout-review-order-table tfoot .order-total td { font-size: 1.1rem; }
.woocommerce-checkout-review-order-table tfoot .order-total .amount,
.woocommerce .cart_totals .order-total .amount { color: var(--c-accent-dark); font-weight: 700; }

/* Payment */
.woocommerce-checkout #payment { background: transparent; border-radius: var(--radius); }
.woocommerce-checkout #payment ul.payment_methods { border: 0; padding: 0; margin: 0 0 12px; }
.woocommerce-checkout #payment ul.payment_methods li {
	list-style: none; border: 1px solid var(--c-line); border-radius: var(--radius); padding: 15px; margin-bottom: 10px;
}
.woocommerce-checkout #payment ul.payment_methods li:has(input:checked) { border-color: var(--c-accent); background: var(--c-bg-soft); }
.woocommerce-checkout #payment div.payment_box { background: var(--c-bg-soft); border-radius: var(--radius-sm); margin-top: 12px; font-size: .9rem; }
.woocommerce-checkout #payment div.payment_box::before { display: none; }

/* Buttons */
.woocommerce #payment #place_order,
.woocommerce a.checkout-button, .woocommerce .cart_totals .button,
.woocommerce-cart .wc-proceed-to-checkout .button {
	background: var(--c-accent); color: #fff; border: 1px solid var(--c-accent); border-radius: var(--radius);
	padding: 15px 26px; font-weight: 600; font-size: 1rem; letter-spacing: .01em; transition: background .2s var(--ease);
}
.woocommerce #payment #place_order, .woocommerce a.checkout-button { width: 100%; margin-top: 8px; }
.woocommerce #payment #place_order:hover,
.woocommerce a.checkout-button:hover, .woocommerce .cart_totals .button:hover { background: var(--c-accent-dark); color: #fff; }
.woocommerce-cart td.actions .button { display: inline-flex; align-items: center; justify-content: center; white-space: nowrap; min-height: 48px; padding: 0 24px; background: var(--c-ink); color: #fff; border: 1px solid var(--c-ink); border-radius: var(--radius); font-weight: 600; }
.woocommerce-cart td.actions .button:hover { background: var(--c-accent); border-color: var(--c-accent); }

/* Cart */
.woocommerce table.cart img { border-radius: var(--radius-sm); width: 64px; }
/* Ô actions: giữ là table-cell full-width, bỏ border-bottom cụt phía dưới */
.woocommerce-cart table.cart td.actions { padding: 18px 0 0; border-bottom: 0; }
.woocommerce-cart table.cart td.actions .coupon { display: flex; gap: 12px; width: 100%; }
.woocommerce-cart table.cart td.actions .coupon .input-text { flex: 1; min-width: 0; max-width: none; min-height: 50px; border-radius: var(--radius); border: 1px solid var(--c-line); padding: 13px 18px; font-size: 1.02rem; }
.woocommerce-cart table.cart td.actions .coupon .input-text::placeholder { font-size: 1.02rem; color: var(--c-muted); }
.woocommerce-cart td.actions .coupon button[name="apply_coupon"] { flex: 0 0 auto; min-width: 130px; }
.woocommerce .quantity .qty { border: 1px solid var(--c-line); border-radius: var(--radius-sm); min-height: 44px; }
.woocommerce table.shop_table { border-radius: var(--radius); }

/* Notices */
.woocommerce-info, .woocommerce-message, .woocommerce-error {
	border-top: 0; border-radius: var(--radius); padding: 15px 18px; background: var(--c-bg-soft);
}
.woocommerce-info::before, .woocommerce-message::before { top: 16px; color: var(--c-accent); }
.woocommerce-message { border-left: 3px solid var(--c-success); }
.woocommerce-info { border-left: 3px solid var(--c-accent); }

/* Gom chi tiết đơn thành card đồng bộ với khối QR */
.woocommerce-order-received ul.woocommerce-order-overview.order_details {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 16px 24px;
	list-style: none; margin: 0 0 24px; padding: 22px 26px;
	background: var(--c-bg); border: 1px solid var(--c-line); border-radius: var(--radius); box-shadow: var(--shadow-sm);
}
.woocommerce-order-received ul.order_details li {
	border: 0 !important; padding: 0 !important; margin: 0 !important; float: none;
	font-size: .8rem; color: var(--c-muted); text-transform: none; display: flex; flex-direction: column; gap: 4px;
}
.woocommerce-order-received ul.order_details li strong { font-size: 1rem; color: var(--c-ink); }

/* QR thanh toán (order-received + email) */
.mba-qr-pay {
	background: var(--c-bg); border: 1px solid var(--c-line); border-radius: var(--radius);
	padding: 32px; margin: 0 0 22px; box-shadow: var(--shadow-md);
}
.mba-qr-pay__title { font-family: var(--ff-display); font-size: 1.5rem; margin: 0 0 6px; }
.mba-qr-pay__sub { color: var(--c-ink-soft); margin: 0 0 26px; }
.mba-qr-pay__grid { display: flex; gap: 36px; align-items: center; }
.mba-qr-pay__qr { flex: 0 0 auto; }
.mba-qr-pay__qr img {
	width: 232px; height: 232px; border: 1px solid var(--c-line); border-radius: var(--radius); background: #fff; display: block; padding: 6px;
}
.mba-qr-pay__info { flex: 1 1 auto; min-width: 0; margin: 0; border-left: 1px solid var(--c-line); padding-left: 32px; }
.mba-qr-pay__info li {
	display: flex; justify-content: space-between; align-items: center; gap: 16px;
	padding: 13px 0; border-bottom: 1px solid var(--c-line); list-style: none;
}
.mba-qr-pay__info li:first-child { padding-top: 0; }
.mba-qr-pay__info li:last-child { border-bottom: 0; padding-bottom: 0; }
.mba-qr-pay__info li span { color: var(--c-muted); font-size: .88rem; white-space: nowrap; }
.mba-qr-pay__info li strong { text-align: right; font-size: 1rem; font-weight: 600; }
.mba-qr-pay__info li.is-highlight strong { color: var(--c-accent-dark); font-size: 1.1rem; letter-spacing: .03em; }
.mba-qr-pay__note { margin: 24px 0 0; padding-top: 18px; border-top: 1px dashed var(--c-line); font-size: .86rem; color: var(--c-muted); text-align: center; }
@media (max-width: 640px) {
	.mba-qr-pay { padding: 22px; }
	.mba-qr-pay__grid { flex-direction: column; align-items: stretch; gap: 18px; }
	.mba-qr-pay__qr img { margin-inline: auto; }
	.mba-qr-pay__info { border-left: 0; padding-left: 0; border-top: 1px solid var(--c-line); padding-top: 6px; }
}

/* Màn "Tiến hành thanh toán" (đơn QR) — căn giữa, focus */
body.mba-qr-thankyou .page-header { text-align: center; margin-bottom: 12px; }
body.mba-qr-thankyou .entry-content { max-width: 720px; margin-inline: auto; }
.mba-pay-actions { display: flex; gap: 14px; }
.mba-pay-actions .btn { flex: 1; padding: 15px 22px; font-size: 1rem; border-radius: var(--radius); }
@media (max-width: 600px) { .mba-pay-actions { flex-direction: column; } }

/* =========================================================================
   WooCommerce — Tài khoản (My Account) & Đăng nhập / Đăng ký
   ========================================================================= */
.woocommerce-account .woocommerce > h2,
.woocommerce-account #customer_login h2 { font-family: var(--ff-display); font-size: 1.4rem; margin-bottom: 16px; }

/* --- Login / Register: 2 cột --- */
.woocommerce-account #customer_login.u-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: start; }
.woocommerce-account #customer_login .u-column1,
.woocommerce-account #customer_login .u-column2 { width: 100%; float: none; margin: 0; }
.woocommerce form.login, .woocommerce form.register, .woocommerce form.lost_reset_password {
	margin: 0; border: 1px solid var(--c-line); border-radius: var(--radius); padding: 28px; background: var(--c-bg); box-shadow: var(--shadow-sm);
}
.woocommerce-form-login__rememberme { display: inline-flex; align-items: center; gap: 8px; font-size: .9rem; font-weight: 400; margin: 2px 0 16px; }
.woocommerce-form-login__rememberme input { width: auto; min-height: 0; }

/* Nút hiện/ẩn mật khẩu của WooCommerce → icon con mắt trong ô input */
.woocommerce .password-input, .woocommerce-Input-wrapper { position: relative; display: block; }
.woocommerce .password-input .input-text { padding-right: 48px; }
.woocommerce .show-password-input { position: absolute; top: 0; right: 0; width: 48px; height: 100%; padding: 0; border: none; cursor: pointer; opacity: .7; background: transparent center / 20px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%238a847d' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-7 11-7 11 7 11 7-4 7-11 7-11-7-11-7z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); }
.woocommerce .show-password-input:hover { opacity: 1; }
.woocommerce .show-password-input.display-password { opacity: 1; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23b8893f' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-7 11-7 11 7 11 7-4 7-11 7-11-7-11-7z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E"); }
.woocommerce-LostPassword { margin-top: 14px; font-size: .9rem; }
.woocommerce-LostPassword a, .woocommerce-ResetPassword + p a { color: var(--c-accent-dark); font-weight: 600; }
.woocommerce-privacy-policy-text { font-size: .82rem; color: var(--c-muted); margin-top: 8px; }

/* --- Đã đăng nhập: nav (trái) + nội dung (phải) --- */
.woocommerce-account.logged-in .woocommerce { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 40px; align-items: start; }
.woocommerce-MyAccount-navigation { position: sticky; top: calc(var(--header-h) + 16px); }
.woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.woocommerce-MyAccount-navigation li { list-style: none; }
.woocommerce-MyAccount-navigation li::before { content: none; }
.woocommerce-MyAccount-navigation li a { display: block; padding: 12px 16px; border-radius: var(--radius-sm); color: var(--c-ink-soft); font-weight: 500; }
.woocommerce-MyAccount-navigation li a:hover { background: var(--c-bg-soft); color: var(--c-ink); }
.woocommerce-MyAccount-navigation li.is-active a { background: var(--c-ink); color: #fff; }
.woocommerce-MyAccount-content { min-width: 0; }
.woocommerce-MyAccount-content > p:first-child { margin-top: 0; }
.woocommerce-MyAccount-content mark { background: var(--c-bg-soft); padding: 0 4px; border-radius: 3px; }

/* --- Bảng đơn hàng --- */
.woocommerce-orders-table, .woocommerce-MyAccount-orders { width: 100%; border-collapse: collapse; }
.woocommerce-orders-table th { text-align: left; padding: 12px 14px; border-bottom: 2px solid var(--c-line); font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--c-muted); font-weight: 600; }
.woocommerce-orders-table td { padding: 14px; border-bottom: 1px solid var(--c-line); vertical-align: middle; }
.woocommerce-orders-table__cell-order-actions { text-align: right; }
.woocommerce-orders-table__cell-order-actions .button { min-height: 38px; padding: 0 16px; font-size: .85rem; }

/* --- Địa chỉ --- */
.woocommerce-Addresses { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 8px; }
.woocommerce-Address { width: 100%; float: none; border: 1px solid var(--c-line); border-radius: var(--radius); padding: 24px; }
.woocommerce-Address-title { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.woocommerce-Address-title h2, .woocommerce-Address-title h3 { font-family: var(--ff-display); font-size: 1.2rem; margin: 0; }
.woocommerce-Address address { font-style: normal; color: var(--c-ink-soft); line-height: 1.7; }
.woocommerce-Address-title .edit { padding: 6px 14px; border: 1px solid var(--c-line); border-radius: 999px; font-size: .8rem; font-weight: 600; color: var(--c-ink); }
.woocommerce-Address-title .edit:hover { border-color: var(--c-ink); background: var(--c-bg-soft); }

/* --- Nút trong account --- */
.woocommerce-account .button, .woocommerce-MyAccount-content .button,
.woocommerce form.login .button, .woocommerce form.register .button, .woocommerce form.lost_reset_password .button {
	display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 24px;
	background: var(--c-ink); color: #fff; border: 1px solid var(--c-ink); border-radius: var(--radius); font-weight: 600; cursor: pointer;
	transition: background .2s var(--ease), border-color .2s var(--ease);
}
.woocommerce-account .button:hover, .woocommerce-MyAccount-content .button:hover,
.woocommerce form.login .button:hover, .woocommerce form.register .button:hover { background: var(--c-accent); border-color: var(--c-accent); color: #fff; }
/* link "Edit" địa chỉ là dạng outline nên loại khỏi style nút fill */
.woocommerce-Address-title .edit { background: none; color: var(--c-ink); min-height: 0; }

/* Nhãn trạng thái đơn — pill màu theo trạng thái */
.wc-status { display: inline-block; padding: 3px 12px; border-radius: 999px; font-weight: 600; font-size: .92em; }
.wc-status--pending, .wc-status--checkout-draft { background: #f1eee9; color: #6b655d; }
.wc-status--on-hold { background: #fbe7cf; color: #9a6f2c; }
.wc-status--processing { background: #e0effb; color: #1f6fb2; }
.wc-status--completed { background: #e3f3ea; color: #2e7d52; }
.wc-status--cancelled, .wc-status--failed { background: #fbe9e7; color: #c0392b; }
.wc-status--refunded { background: #efeae3; color: #6b655d; }

/* Trạng thái trong bảng danh sách đơn (tô màu chữ theo class hàng của WC) */
.woocommerce-orders-table__cell-order-status { font-weight: 600; }
.woocommerce-orders-table__row--status-on-hold .woocommerce-orders-table__cell-order-status { color: #9a6f2c; }
.woocommerce-orders-table__row--status-processing .woocommerce-orders-table__cell-order-status { color: #1f6fb2; }
.woocommerce-orders-table__row--status-completed .woocommerce-orders-table__cell-order-status { color: #2e7d52; }
.woocommerce-orders-table__row--status-cancelled .woocommerce-orders-table__cell-order-status,
.woocommerce-orders-table__row--status-failed .woocommerce-orders-table__cell-order-status { color: #c0392b; }

/* --- Xem chi tiết đơn hàng (view-order) --- */
.woocommerce-order-details__title, .woocommerce-customer-details .woocommerce-column__title { font-family: var(--ff-display); font-size: 1.35rem; margin: 28px 0 16px; }
.woocommerce-table--order-details { width: 100%; border-collapse: collapse; margin-bottom: 8px; }
.woocommerce-table--order-details thead th { text-align: left; padding: 12px 14px; border-bottom: 2px solid var(--c-line); font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--c-muted); font-weight: 600; }
.woocommerce-table--order-details td { padding: 13px 14px; border-bottom: 1px solid var(--c-line); vertical-align: top; }
.woocommerce-table--order-details .product-name { font-weight: 500; }
.woocommerce-table--order-details .product-name a { font-weight: 600; color: var(--c-ink); }
.woocommerce-table--order-details .product-name a:hover { color: var(--c-accent); }
.woocommerce-table--order-details .product-quantity, .woocommerce-table--order-details .wc-item-meta { color: var(--c-muted); font-size: .9rem; }
.woocommerce-table--order-details .wc-item-meta { list-style: none; margin: 6px 0 0; padding: 0; }
.woocommerce-table--order-details th.product-total, .woocommerce-table--order-details td.product-total { text-align: right; white-space: nowrap; }
.woocommerce-table--order-details tfoot th { text-align: left; padding: 13px 14px; font-weight: 600; border-bottom: 1px solid var(--c-line); }
.woocommerce-table--order-details tfoot td { text-align: right; padding: 13px 14px; border-bottom: 1px solid var(--c-line); white-space: nowrap; }
.woocommerce-table--order-details tfoot tr:last-child th, .woocommerce-table--order-details tfoot tr:last-child td { border-bottom: none; font-size: 1.05rem; font-weight: 700; }

/* Địa chỉ khách trong đơn */
.woocommerce-customer-details .woocommerce-columns--addresses { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin-top: 8px; }
.woocommerce-customer-details .woocommerce-column { width: 100%; float: none; margin: 0; }
.woocommerce-customer-details address { font-style: normal; color: var(--c-ink-soft); line-height: 1.7; border: 1px solid var(--c-line); border-radius: var(--radius); padding: 18px 20px; }
.woocommerce-customer-details .woocommerce-customer-details--phone,
.woocommerce-customer-details .woocommerce-customer-details--email { margin: 8px 0 0; }

@media (max-width: 880px) {
	.woocommerce-account.logged-in .woocommerce { grid-template-columns: 1fr; gap: 24px; }
	.woocommerce-MyAccount-navigation { position: static; }
	.woocommerce-MyAccount-navigation ul { flex-direction: row; flex-wrap: wrap; gap: 6px; }
	.woocommerce-MyAccount-navigation li a { padding: 9px 14px; border: 1px solid var(--c-line); }
	.woocommerce-account #customer_login.u-columns, .woocommerce-Addresses,
	.woocommerce-customer-details .woocommerce-columns--addresses { grid-template-columns: 1fr; }
}
/* Bảng đơn hàng dạng xếp dọc trên màn nhỏ (dùng data-title của WC) */
@media (max-width: 600px) {
	.woocommerce-orders-table thead { display: none; }
	.woocommerce-orders-table tr { display: block; border: 1px solid var(--c-line); border-radius: var(--radius); padding: 12px 14px; margin-bottom: 12px; }
	.woocommerce-orders-table td { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border: none; text-align: right; }
	.woocommerce-orders-table td::before { content: attr(data-title); font-weight: 600; color: var(--c-ink); text-align: left; }
	.woocommerce-orders-table__cell-order-actions { justify-content: flex-end; }
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
