/* Modern, generous typography scale across all customer-facing pages. */
:root {
  --dx-type-body: 18px;
  --dx-type-ui: 15.5px;
  --dx-type-small: 14.5px;
  --dx-type-card: 16.5px;
  --dx-type-price: 21px;
  --dx-type-h1: clamp(32px, 3.4vw, 46px);
  --dx-type-h2: clamp(26px, 2.6vw, 34px);
  --dx-type-h3: 23px;
  --dx-type-h4: 20px;
  --dx-type-h5: 18px;
  --dx-type-h6: 16px;
}

html,
html body.dx-store {
  overflow-x: clip !important;
}

html body.dx-store {
  font-size: var(--dx-type-body) !important;
  line-height: 1.7;
  color: #1e293b;
}

html body.dx-store :is(h1, h2, h3, h4, h5, h6) {
  font-family: inherit !important;
  font-weight: 700;
  line-height: 1.25 !important;
  text-transform: none !important;
  color: #0f172a;
}

html body.dx-store h1 { font-size: var(--dx-type-h1) !important; }
html body.dx-store h2 { font-size: var(--dx-type-h2) !important; }
html body.dx-store h3 { font-size: var(--dx-type-h3) !important; }
html body.dx-store h4 { font-size: var(--dx-type-h4) !important; }
html body.dx-store h5 { font-size: var(--dx-type-h5) !important; }
html body.dx-store h6 { font-size: var(--dx-type-h6) !important; }

html body.dx-store p {
  font-size: var(--dx-type-body) !important;
  line-height: 1.7 !important;
}

html body.dx-store :is(.font-xs, .font-xxs, .font-small, .font-sm, .font-xxxs, .font-smallest, .font-12, .font-13, .text-small, .text-xs, .small, small) {
  font-size: var(--dx-type-small) !important;
  line-height: 1.5 !important;
}

html body.dx-store :is(input, select, textarea, button, .btn, label, .form-label, .form-control, .form-check-label) {
  font-size: var(--dx-type-ui) !important;
  line-height: 1.5;
}

html body.dx-store :is(.btn, .pc-btn-cart, .pc-btn-buy, .dx-filter-trigger, .submit-button) {
  font-size: var(--dx-type-ui) !important;
  font-weight: 600;
  min-height: 44px;
}

html body.dx-store :is(.breadcrumb, .breadcrumb-item, .entry-meta, .dx-editorial-meta, .dx-story-meta, .dx-meta-left, .dx-countdown-label, .sold-text, .product-meta-shopee, .rating_num, .dx-product-story time, .dx-story-related time) {
  font-size: var(--dx-type-small) !important;
  line-height: 1.5 !important;
}

html body.dx-store :is(.dx-eyebrow, .dx-category-count small) {
  font-size: 13px !important;
  line-height: 1.4 !important;
  letter-spacing: .08em;
}

html body.dx-store :is(.dx-section-heading > a, .dx-collection-jump, .dx-collection-nav > a, .dx-news-topics > a, .dx-sort-pills > a, .dx-sort-label, .dx-sort-more > summary, .dx-sort-more > div > a, .dx-editorial-read, .dx-search-links a, .dx-menu-utility a, .dx-filter-actions > a) {
  font-size: var(--dx-type-ui) !important;
  line-height: 1.5 !important;
}

/* Product Card - modern, confident, readable */
html body.dx-store .product-cart-wrap .product-content-wrap :is(h2, h3, h6) {
  font-size: var(--dx-type-card) !important;
  line-height: 1.4 !important;
  font-weight: 600 !important;
  min-height: 2.8em;
  margin: 0 0 8px !important;
}
html body.dx-store .product-cart-wrap .product-content-wrap :is(h2, h3, h6) a {
  font-size: inherit !important;
  line-height: inherit !important;
  color: #0f172a !important;
}
html body.dx-store .product-cart-wrap .product-price > span:not(.old-price) {
  font-size: var(--dx-type-price) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}
html body.dx-store .product-cart-wrap .product-price .old-price {
  font-size: var(--dx-type-small) !important;
}
html body.dx-store .product-cart-wrap .product-meta-shopee {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 10px;
  font-size: 13px !important;
}
html body.dx-store .product-cart-wrap .rating-stars {
  font-size: 14px !important;
}
html body.dx-store :is(.shopee-badge-mall, .shopee-badge-favorite, .shopee-discount-ribbon span) {
  font-size: 13px !important;
  line-height: 1.2 !important;
}

/* Editorial & Category tiles */
html body.dx-store .dx-editorial-card h2 {
  font-size: 22px !important;
  line-height: 1.35 !important;
}
html body.dx-store .dx-editorial-feature h2 {
  font-size: clamp(26px, 2.8vw, 36px) !important;
}
html body.dx-store :is(.dx-editorial-card p, .dx-product-story p) {
  font-size: 16px !important;
  line-height: 1.65 !important;
}
html body.dx-store .dx-category-tile > span:last-child {
  font-size: 17px !important;
  font-weight: 600;
  line-height: 1.35;
}

/* Footer Typography */
html body.dx-store .dx-corp-footer :is(p, li, a, .dx-brand-desc, .dx-trust-desc, .dx-legal-links, .dx-brand-sub) {
  font-size: 15px !important;
  line-height: 1.6 !important;
}
html body.dx-store .dx-corp-footer :is(h4, h5, h6, .dx-trust-title) {
  font-size: 17px !important;
  font-weight: 700;
  line-height: 1.4 !important;
}
html body.dx-store .dx-hotline-banner a {
  font-size: 24px !important;
}

/* Article Reading scale - generous 18px font, clear line-height, modern editorial */
html body.dx-store :is(.ck-content, .shopee-product-description, .product-description) {
  font-size: 18px !important;
  line-height: 1.85 !important;
  color: #1e293b;
}
html body.dx-store :is(.ck-content, .shopee-product-description) :is(p, li) {
  font-size: 18px !important;
  line-height: 1.85 !important;
}
html body.dx-store :is(.ck-content, .shopee-product-description) :is(td, th) {
  font-size: 15px !important;
  line-height: 1.6 !important;
}
html body.dx-store :is(.ck-content, .shopee-product-description) :is(p, li) :is(span, b, strong, em, a) {
  font-size: inherit !important;
  line-height: inherit !important;
}
html body.dx-store :is(.ck-content, .shopee-product-description) h2 {
  font-size: 26px !important;
  font-weight: 700 !important;
  margin: 1.8em 0 .65em !important;
  color: #0f172a !important;
}
html body.dx-store :is(.ck-content, .shopee-product-description) h3 {
  font-size: 21px !important;
  font-weight: 700 !important;
  margin: 1.5em 0 .55em !important;
  color: #0f172a !important;
}
html body.dx-store :is(.ck-content, .shopee-product-description) h4 {
  font-size: 18px !important;
  font-weight: 700 !important;
  margin: 1.3em 0 .5em !important;
  color: #0f172a !important;
}

/* Navigation */
@media(min-width: 1200px) {
  html body.dx-store .dx-inline-nav a {
    font-size: 16px !important;
    line-height: 1.4 !important;
    font-weight: 600;
  }
}
@media(max-width: 767px) {
  :root {
    --dx-type-body: 16px;
    --dx-type-ui: 15px;
    --dx-type-small: 13px;
    --dx-type-card: 15px;
    --dx-type-price: 18px;
    --dx-type-h1: 26px;
    --dx-type-h2: 22px;
    --dx-type-h3: 19px;
  }
}