/* ============================================================
   HONG YIN — Custom CSS Final (Fixed)
   Haravan / Greenweave Theme
   Fix: tất cả font-weight: 600 → 500 để đúng với DM Sans (300/400/500)
   ============================================================ */

/* ── 1. BRAND TOKENS ─────────────────────────────────────── */
:root {
  --hy-bg:               #f5f0e6;
  --hy-ink:              #2e1e14;
  --hy-ink-soft:         #3a2515;
  --hy-off-white:        #eeede2;
  --hy-puerh:            #7c4130;
  --hy-puerh-light:      #f0ddd0;
  --hy-puerh-secondary:  #b07060;
  --hy-oolong:           #d68f7a;
  --hy-oolong-dark:      #6b2d20;
  --hy-oolong-secondary: #a84b4d;
  --hy-green:            #b8c994;
  --hy-green-dark:       #4a5a2e;
  --hy-gold:             #c8a84a;
  --hy-muted:            #b08070;
  --hy-font-body:        'DM Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --hy-font-display:     'Playfair Display', Georgia, serif;
  --hy-font-cjk:         'Noto Serif SC', serif;
  --hy-body-size:        15px;
}

/* ── 2. GLOBAL ───────────────────────────────────────────── */
html { background-color: var(--hy-bg) !important; scroll-behavior: smooth; }

body {
  font-family: var(--hy-font-body) !important;
  font-size: var(--hy-body-size) !important;
  font-weight: 400 !important;
  color: var(--hy-ink) !important;
  background-color: var(--hy-bg) !important;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* ── 3. HEADINGS ─────────────────────────────────────────── */
h1, h2, h3, h4, h5, h6,
.section-title, .page-title,
.product-title, .collection-title,
.blog-title, .article-title,
h1.title, h2.title, h2.title2, h3.title {
  font-family: var(--hy-font-display) !important;
  font-weight: 500 !important;
  color: var(--hy-ink) !important;
  letter-spacing: -0.01em;
  line-height: 1.25;
}

h2 { font-size: clamp(1.6rem, 3.5vw, 2.4rem) !important; }
h3 { font-size: 1rem !important; }

/* ── 4. BODY TEXT — ĐỒNG NHẤT 15px ──────────────────────── */

div.desc,
p.desc,
.greenweave-index-collection div.desc,
.greenweave-index-about-1 div.desc,
.greenweave-index-about-3 div.desc,
.greenweave-index-service div.desc,
.greenweave-index-blog div.desc {
  font-family: var(--hy-font-body) !important;
  font-size: var(--hy-body-size) !important;
  font-weight: 400 !important;
  line-height: 1.75 !important;
  color: var(--hy-ink-soft) !important;
}

div.desc[style*="600"],
.greenweave-index-about-1 div.desc {
  font-size: var(--hy-body-size) !important;
  font-weight: 400 !important; /* Fix: 600 → 400, DM Sans không có weight 600 */
}

p, .rte p, section p, .template-index p,
.template-collection p, .template-page p {
  font-family: var(--hy-font-body) !important;
  font-size: var(--hy-body-size) !important;
  font-weight: 400 !important;
  line-height: 1.75 !important;
  color: var(--hy-ink-soft) !important;
}

div.short-article {
  font-family: var(--hy-font-body) !important;
  font-size: var(--hy-body-size) !important;
  font-weight: 400 !important;
  line-height: 1.75 !important;
  color: var(--hy-ink-soft) !important;
}

/* Section label nhỏ (title1) */
div.title1 {
  font-family: var(--hy-font-body) !important;
  font-size: 11px !important;
  font-weight: 500 !important; /* Fix: 600 → 500 */
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: var(--hy-muted) !important;
}

/* ── 5. REVIEW / TESTIMONIAL ─────────────────────────────── */
.greenweave-index-review p.name {
  font-family: var(--hy-font-body) !important;
  font-size: var(--hy-body-size) !important;
  font-weight: 500 !important; /* Fix: 600 → 500 */
  color: var(--hy-ink) !important;
  line-height: 1.4 !important;
  margin-bottom: 2px !important;
  white-space: nowrap !important;
}

.greenweave-index-review p.position {
  font-family: var(--hy-font-body) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  color: var(--hy-muted) !important;
  line-height: 1.4 !important;
  white-space: nowrap !important;
  letter-spacing: 0.02em !important;
  margin: 0 !important;
}

.greenweave-index-review p.desc {
  font-family: var(--hy-font-body) !important;
  font-size: var(--hy-body-size) !important;
  font-weight: 400 !important;
  color: var(--hy-ink-soft) !important;
  line-height: 1.75 !important;
}

/* ── 6. NAVIGATION ───────────────────────────────────────── */
.site-nav a, nav a, .nav-link,
.header__nav a, .gw-nav a, .gw-menu a {
  font-family: var(--hy-font-body) !important;
  font-weight: 500 !important; /* Fix: 600 → 500 (DM Sans 500 = medium, vừa đủ nổi) */
  font-size: 12px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

/* ── 7. SIDEBAR — DANH MỤC BÀI VIẾT ─────────────────────── */
.group-sidebox .sidebox-title h3,
.group-sidebox .htitle {
  font-family: var(--hy-font-body) !important;
  font-size: 0.6rem !important;
  font-weight: 500 !important; /* Fix: 600 → 500 */
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: var(--hy-muted) !important;
  margin-bottom: 0.8rem !important;
}

.group-sidebox .menuList-links li a,
.group-sidebox .menuList-links li a span,
.group-sidebox .menuList-links > li.has-submenu > a,
.group-sidebox .menuList-links > li > a {
  font-family: var(--hy-font-body) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  color: var(--hy-ink-soft) !important;
  line-height: 1.8 !important;
  padding: 4px 0 !important;
  padding-right: 0 !important;
  display: block !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
}

.group-sidebox .submenu-links li a {
  font-size: 12px !important;
  padding-left: 10px !important;
  color: #7a6050 !important;
}

.group-sidebox .menuList-links li a:hover,
.group-sidebox .submenu-links li a:hover {
  color: var(--hy-puerh) !important;
}

/* ── 8. ARTICLE / BLOG ───────────────────────────────────── */
body.template-article h1 {
  font-size: 2rem !important;
  font-weight: 400 !important;
  color: var(--hy-puerh) !important;
  line-height: 1.25 !important;
  text-align: left !important;
}

@media (max-width: 768px) {
  body.template-article h1 { font-size: 1.6rem !important; }
}

body.template-article .rte h2,
body.template-article .article__body h2 {
  font-size: 1.25rem !important;
  font-weight: 400 !important;
  color: var(--hy-puerh) !important;
  margin-top: 2.5rem !important;
  margin-bottom: 0.8rem !important;
  padding-bottom: 0.4rem !important;
  border-bottom: 1px solid #e8ddd5 !important;
}

body.template-article .rte h3,
body.template-article .article__body h3 {
  font-size: 1.05rem !important;
  font-style: italic !important;
  font-weight: 400 !important;
  color: var(--hy-puerh) !important;
  margin-top: 1.8rem !important;
}

body.template-article .rte p,
body.template-article .article__body p {
  font-size: 1rem !important;
  font-weight: 400 !important;
  line-height: 1.9 !important;
  color: var(--hy-ink-soft) !important;
  margin-bottom: 1.3rem !important;
}

blockquote,
body.template-article blockquote {
  font-family: var(--hy-font-display) !important;
  font-style: italic !important;
  font-size: 1rem !important;
  color: var(--hy-puerh) !important;
  background: var(--hy-puerh-light) !important;
  border-left: 3px solid var(--hy-oolong) !important;
  border-top: none !important;
  border-right: none !important;
  border-bottom: none !important;
  padding: 1rem 1.4rem !important;
  margin: 2rem 0 !important;
  border-radius: 0 3px 3px 0 !important;
}

span.date {
  font-size: 12px !important;
  color: var(--hy-muted) !important;
  letter-spacing: 0.05em !important;
}

/* ── 9. BUTTONS ──────────────────────────────────────────── */
.btn, .button, button[type="submit"],
.cart__submit, .product-form__submit {
  font-family: var(--hy-font-body) !important;
  font-weight: 500 !important; /* Fix: 600 → 500 */
  font-size: 12px !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  background-color: var(--hy-puerh) !important;
  color: #ffffff !important;
  border-radius: 2px !important;
  padding: 1rem 2.5rem !important;
  transition: all 0.3s ease !important;
}

.btn:hover, .button:hover {
  background-color: var(--hy-ink) !important;
  transform: translateY(-1px);
}

/* ── 10. FOOTER ──────────────────────────────────────────── */
p.hy-footer__tagline {
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.75 !important;
  color: rgba(240, 220, 200, 0.6) !important;
  font-style: normal !important;
}

span.hy-footer__contact-val,
span.hy-footer__contact-label {
  font-size: var(--hy-body-size) !important;
  font-weight: 400 !important;
}

span.hy-footer__contact-label {
  font-size: 10px !important;
  font-weight: 500 !important; /* Fix: 600 → 500 */
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  color: var(--hy-muted) !important;
}

span.hy-footer__col-title {
  font-size: 11px !important;
  font-weight: 500 !important; /* Fix: 600 → 500 */
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: var(--hy-muted) !important;
}

span.hy-footer__brand-cjk {
  font-family: var(--hy-font-cjk) !important;
  font-size: 14px !important;
}

span.hy-footer__copyright {
  font-size: 12px !important;
  color: var(--hy-muted) !important;
}

.hy-footer__links li,
.hy-footer__links a {
  font-size: var(--hy-body-size) !important;
  font-weight: 400 !important;
  color: var(--hy-ink-soft) !important;
  line-height: 1.8 !important;
}

/* ── 11. PRODUCT CARDS ───────────────────────────────────── */
.product-card__title, .grid-product__title, .product__title {
  font-family: var(--hy-font-display) !important;
  font-weight: 500 !important;
  font-size: 1.1rem !important;
  line-height: 1.4 !important;
}

.product-card__price, .price {
  font-family: var(--hy-font-body) !important;
  font-weight: 500 !important;
  color: var(--hy-puerh-secondary) !important;
  font-size: var(--hy-body-size) !important;
}

/* ── 12. CJK ACCENT ──────────────────────────────────────── */
.cjk, [lang="zh"], .hy-cjk {
  font-family: var(--hy-font-cjk) !important;
  font-weight: 400 !important;
}

/* ── 13. SCROLLBAR ───────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--hy-bg); }
::-webkit-scrollbar-thumb {
  background: var(--hy-puerh-secondary);
  border-radius: 10px;
}

/* ── 14. FAQ HEADER TEXT ─────────────────────────────────── */
.greenweave-about-us-faqs .header-faqs,
.greenweave-about-us-faqs .intro-list-faqs .header-faqs {
  font-family: var(--hy-font-body) !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  color: var(--hy-ink) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  line-height: 1.5 !important;
}

/* ── 15. BLOG WIDGET — TRANG CHỦ ────────────────────────── */
.template-index .greenweave-index-blog .item-article h3,
.template-index .greenweave-index-blog .item-article .article-title,
.template-index .greenweave-index-blog .item-article a {
  font-family: var(--hy-font-display) !important;
  color: var(--hy-puerh) !important;
  font-size: 19px !important;
  line-height: 1.3 !important;
  font-weight: 500 !important;
  text-align: left !important;
  text-decoration: none !important;
  margin-top: 12px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.template-index .greenweave-index-blog .item-article a:hover {
  color: var(--hy-ink) !important;
}

/* ── Thumbnail vuông dùng padding-top trick ── */
.greenweave-index-blog .media-article {
  position: relative !important;
  width: 100% !important;
  height: 0 !important;
  padding-top: 100% !important;   /* 1:1 ratio — đổi thành 75% nếu muốn 4:3 */
  overflow: hidden !important;
  margin-bottom: 15px !important;
}
.greenweave-index-blog .media-article img {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;   /* hiện toàn bộ hình, không crop */
  object-position: center !important;
  background: var(--hy-bg, #f5f0e6) !important; /* nền nếu ảnh có letterbox */
}

.greenweave-index-blog .short-article {
  display: -webkit-box !important;
  visibility: visible !important;
  opacity: 1 !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  color: var(--hy-ink-soft) !important;
  margin: 12px 0 !important;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  height: auto !important;
}
.greenweave-index-blog .title-article h4 {
  margin-bottom: 5px !important;
}
.greenweave-index-blog .title-article h4 a {
  font-size: 19px !important;
  line-height: 1.3 !important;
  font-weight: 500 !important;
}
/* ── 16. LOGO ────────────────────────────────────────────── */
.header-main .header-left,
.header-logo {
  padding-left: 160px !important;
}

img.logoimg {
  width: 200px !important;
  max-width: 280px !important;
  height: auto !important;
  max-height: 80px !important;
  image-rendering: -webkit-optimize-contrast;
  object-fit: contain;
}

@media (max-width: 767px) {
  .header-main .header-left {
    padding-left: 15px !important;
  }
  img.logoimg {
    width: 140px !important;
  }
}

/* ══ END HONG YIN CUSTOM CSS — FIXED ══ */
/* ============================================================
   HONG YIN — CSS bổ sung cho Product Page
   Thêm vào CUỐI file custom CSS hiện tại
   Fix: <strong> tags, product FAQ, tab nav, deliverly titles
   ============================================================ */
/* Collection — sort active + filter button */
.sort-by li.active span,
.sort-by li span,
.title-filter span,
.filter_tags b { font-family: var(--hy-font-body) !important; font-weight: 500 !important; }
/* ── FIX 1: TAG <strong> TOÀN TRANG — NGUYÊN NHÂN CHÍNH ── */
/* Browser mặc định strong = bold (700). DM Sans không có 700 → fallback serif */
strong, b {
  font-weight: 500 !important;
  font-family: var(--hy-font-body) !important;
}

/* Cụ thể hơn cho product page */
.productDetail--content strong,
.productDetail--content b,
.product-heading strong,
.product-heading b,
span#pro_sku strong,
span.pro-soldold strong,
span.pro-vendor strong {
  font-weight: 500 !important;
  font-family: var(--hy-font-body) !important;
}

/* ── FIX 2: COUPON BLOCK ─────────────────────────────────── */
.product-coupon strong,
.coupon-item strong,
.cp-bottom strong,
.cp-top h3 {
  font-family: var(--hy-font-body) !important;
  font-weight: 500 !important;
}

/* ── FIX 3: FAQ TRONG PRODUCT PAGE ─────────────────────── */
/* Selector cũ chỉ cover .greenweave-about-us-faqs, không cover product FAQ */
.faq-item .header-faqs,
.list-faqs .header-faqs,
.product-question .header-faqs {
  font-family: var(--hy-font-body) !important;
  font-size: 15px !important;
  font-weight: 500 !important; /* Đủ nổi để là heading, nhưng DM Sans có sẵn weight này */
  color: var(--hy-ink) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  line-height: 1.5 !important;
}

.faq-item .content-faqs,
.list-faqs .content-faqs,
.product-question .content-faqs {
  font-family: var(--hy-font-body) !important;
  font-size: var(--hy-body-size) !important;
  font-weight: 400 !important;
  color: var(--hy-ink-soft) !important;
  line-height: 1.75 !important;
}

/* ── FIX 4: TAB NAVIGATION ───────────────────────────────── */
/* Tab "Mô tả sản phẩm" / "Đánh giá" — theme thường set bold cho active */
.productDetail--navs .nav-item,
.productDetail--navs .nav-item.active,
.productDetail--navs a.nav-item {
  font-family: var(--hy-font-body) !important;
  font-weight: 500 !important; /* Active tab nổi bằng màu, không cần bold */
  font-size: 13px !important;
  letter-spacing: 0.05em !important;
  text-transform: none !important;
}

/* ── FIX 5: DELIVERLY / CHÍNH SÁCH GIAO HÀNG ────────────── */
.title-deliverly span,
.title-deliverly,
.deliverly-item {
  font-family: var(--hy-font-body) !important;
  font-weight: 400 !important;
  font-size: var(--hy-body-size) !important;
}

/* ── FIX 6: DESCRIPTION CONTENT ─────────────────────────── */
/* Nội dung mô tả sản phẩm có thể chứa <strong> từ editor */
.description-productdetail strong,
.description-productdetail b,
.product-description strong,
.product-description b {
  font-weight: 500 !important;
  font-family: var(--hy-font-body) !important;
}

/* ── FIX 7: ADD TO CART / BUY NOW BUTTON ─────────────────── */
/* Haravan theme thường set bold riêng cho button trong product form */
.btn-addtocart,
.btn-buynow,
.add-to-cartProduct,
#add-to-cart,
#buy-now {
  font-family: var(--hy-font-body) !important;
  font-weight: 500 !important;
  letter-spacing: 0.12em !important;
}

/* ══ END PRODUCT PAGE FIX ══ */
/* ============================================================
   HONG YIN — Cart Page Fix
   Thêm vào CUỐI file custom CSS hiện tại
   Fix: heading h2 quá to trong sidebar cart và promotion blocks
   ============================================================ */

/* ── CART: OVERRIDE H2 SIZE ──────────────────────────────── */
/* h2 toàn cục đang là clamp(1.6rem, 3.5vw, 2.4rem) — đúng cho section titles
   nhưng quá to cho sidebar cart và widget tiêu đề nhỏ */

/* "Thông tin đơn hàng" */
h2.summary-title {
  font-size: 1rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  color: var(--hy-ink) !important;
  margin-bottom: 1rem !important;
}

/* "Có thể bạn sẽ thích" */
h2.collectionCart-title,
h2.collectionCart-title a {
  font-size: 1.1rem !important;
  font-weight: 500 !important;
  color: var(--hy-ink) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Haravan promotion/coupon app inject h2 — không có class cụ thể
   dùng parent container để scope */
.pageCart-hrvpmo h2,
.order-summary-hrvpmo h2,
.hrv-pmo-discount h2,
.hrv-pmo-coupon h2,
.product-coupon h2,
.cart-coupon h2 {
  font-size: 1rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.04em !important;
  text-transform: none !important;
  color: var(--hy-ink) !important;
  margin-bottom: 0.75rem !important;
}

/* Bắt rộng hơn: mọi h2 trong sidebar cart và order summary */
.wrap-order-summary h2,
.order-summary-block h2,
.sidebarCart-sticky h2 {
  font-size: 1rem !important;
  font-weight: 500 !important;
}

/* ── CART: BODY TEXT ─────────────────────────────────────── */
.summary-total p,
.summary-action p,
.cart-shipping__title,
.txt-title,
.txt-time {
  font-family: var(--hy-font-body) !important;
  font-size: var(--hy-body-size) !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
}

/* Tổng tiền — giá trị nên hơi nổi hơn nhưng không bold */
.summary-total p span {
  font-weight: 500 !important;
  color: var(--hy-puerh) !important;
}

/* ── CART: FREE SHIP BAR TEXT ────────────────────────────── */
.free-ship {
  font-weight: 500 !important;
  font-family: var(--hy-font-body) !important;
}

.cart-shipping__title .price {
  font-weight: 500 !important;
}

/* ── CART: NOTE LABEL ────────────────────────────────────── */
label.note-label {
  font-family: var(--hy-font-body) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--hy-ink-soft) !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  margin-bottom: 0.5rem !important;
  display: block !important;
}

/* ── CART: CHECKOUT BUTTON ───────────────────────────────── */
a.checkout-btn,
#btnCart-checkout {
  font-family: var(--hy-font-body) !important;
  font-weight: 500 !important;
  font-size: 12px !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

/* ══ END CART PAGE FIX ══ */