/* Thai Charm — Typography chuyên nghiệp (toàn site) */

:root {
  --type-display-xl: clamp(2rem, 4.5vw, 2.75rem);
  --type-display-lg: clamp(1.625rem, 3.2vw, 2.125rem);
  --type-display-md: clamp(1.375rem, 2.4vw, 1.625rem);
  --type-display-sm: 1.25rem;
  --type-body-lg: 1.0625rem;
  --type-body: 1rem;
  --type-body-sm: 0.875rem;
  --type-caption: 0.8125rem;
  --type-micro: 0.6875rem;
  --type-leading-tight: 1.2;
  --type-leading: 1.6;
  --type-leading-loose: 1.75;
  --type-tracking-tight: -0.025em;
  --type-tracking: -0.011em;
  --type-tracking-wide: 0.06em;
  --type-tracking-caps: 0.12em;
}

/* ── Base ── */
body.tca-page,
body.store-page,
body.dash-page,
body.auth-page,
body.landing-page,
body.track-page,
body.checkout-page,
body.cm-page {
  font-family: var(--font-body);
  font-size: var(--type-body);
  font-weight: 400;
  line-height: var(--type-leading);
  letter-spacing: var(--type-tracking);
  font-feature-settings: "kern" 1, "liga" 1;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ── Headings ── */
body.tca-page h1,
body.tca-page h2,
body.tca-page h3,
body.tca-page h4,
body.tca-page h5,
body.tca-page h6,
body.tca-page .dash-title,
body.tca-page .auth-title,
body.tca-page .le-hero h1,
body.tca-page .store-hero h1,
body.tca-page .track-hero h1,
body.tca-page .cm-nav__title,
body.tca-page .pd-title,
body.tca-page .co-title {
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: var(--type-tracking-tight);
  line-height: var(--type-leading-tight);
  color: var(--text-primary);
}

body.tca-page h1 { font-size: var(--type-display-xl); }
body.tca-page h2 { font-size: var(--type-display-lg); }
body.tca-page h3 { font-size: var(--type-display-md); }
body.tca-page h4,
body.tca-page h5 { font-size: var(--type-display-sm); }

/* ── Body copy ── */
body.tca-page p,
body.tca-page .lead,
body.tca-page .subtitle,
body.tca-page .auth-subtitle {
  font-size: var(--type-body);
  line-height: var(--type-leading);
  color: var(--text-secondary);
}

body.tca-page .lead,
body.tca-page .subtitle {
  font-size: var(--type-body-lg);
  line-height: var(--type-leading-loose);
  max-width: 42em;
}

/* ── Labels / eyebrow ── */
body.tca-page .eyebrow,
body.tca-page [class*="eyebrow"],
body.tca-page [class*="__eyebrow"],
body.tca-page [class*="__label"]:not(label),
body.tca-page .stat-label,
body.tca-page .form-label,
body.tca-page label:not(.checkbox-label):not(.radio-label) {
  font-size: var(--type-caption);
  font-weight: 500;
  letter-spacing: var(--type-tracking-wide);
  color: var(--text-muted);
  line-height: 1.4;
}

body.tca-page .eyebrow,
body.tca-page [class*="eyebrow"],
body.tca-page [class*="__eyebrow"] {
  font-size: var(--type-micro);
  font-weight: 600;
  letter-spacing: var(--type-tracking-caps);
  text-transform: uppercase;
  color: var(--rl-gold-deep);
}

/* ── Navigation ── */
body.tca-page .store-nav__link,
body.tca-page .le-nav a,
body.tca-page .dock-item,
body.tca-page .store-dock__item,
body.tca-page .cm-bottom-nav a,
body.tca-page .dash-bottom-nav a {
  font-size: var(--type-body-sm);
  font-weight: 500;
  letter-spacing: 0.01em;
}

/* ── Buttons ── */
body.tca-page .btn,
body.tca-page button[type="submit"],
body.tca-page .auth-submit,
body.tca-page .co-submit {
  font-family: var(--font-body);
  font-size: var(--type-body-sm);
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* ── Prices & numbers ── */
body.tca-page .price,
body.tca-page [class*="price"],
body.tca-page [class*="amount"],
body.tca-page .balance-amount,
body.tca-page .balance-amount-inline,
body.tca-page .stat-value,
body.tca-page .co-total,
body.tca-page .track-total {
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
  letter-spacing: -0.02em;
}

body.tca-page .price,
body.tca-page [class*="price--lg"],
body.tca-page .balance-amount-inline {
  font-weight: 600;
  color: var(--text-primary);
}

/* ── Links ── */
body.tca-page a:not(.btn):not(.rl-btn):not(.rb-btn):not(.store-nav__link):not(.dock-item) {
  font-weight: 500;
  text-underline-offset: 0.18em;
  text-decoration-thickness: 1px;
  transition: color 0.2s ease, text-decoration-color 0.2s ease;
}

body.tca-page a:not(.btn):hover {
  text-decoration: underline;
  text-decoration-color: rgba(166, 124, 26, 0.45);
}

/* ── Forms ── */
body.tca-page input,
body.tca-page select,
body.tca-page textarea {
  font-family: var(--font-body);
  font-size: var(--type-body);
  font-weight: 400;
  line-height: 1.5;
}

body.tca-page input::placeholder,
body.tca-page textarea::placeholder {
  font-weight: 400;
  color: var(--text-placeholder);
}

/* ── Tables ── */
body.tca-page table th {
  font-size: var(--type-caption);
  font-weight: 600;
  letter-spacing: var(--type-tracking-wide);
  text-transform: uppercase;
}

body.tca-page table td {
  font-size: var(--type-body-sm);
}

/* ── Cards title ── */
body.tca-page .product-card h3,
body.tca-page .shop-card h3,
body.tca-page .mo-card h3,
body.tca-page .order-card h3 {
  font-family: var(--font-body);
  font-size: var(--type-body);
  font-weight: 600;
  letter-spacing: var(--type-tracking);
  line-height: 1.35;
}

/* ── Muted helper text ── */
body.tca-page .text-muted,
body.tca-page [class*="__muted"],
body.tca-page [class*="-muted"],
body.tca-page .hint,
body.tca-page small {
  font-size: var(--type-caption);
  line-height: 1.5;
  color: var(--text-muted);
}

/* ── Strong emphasis (không quá đậm) ── */
body.tca-page strong,
body.tca-page b {
  font-weight: 600;
  color: var(--text-primary);
}