/*
 * TalatYai — public typography scale.
 * Loaded after the legacy and component styles so typography has one final,
 * component-scoped source of truth. Layout dimensions are intentionally absent.
 */

/* Base and language fonts already used by the public theme. */
html body.sp-site-page {
  --ty-base-font: 14px;
  font-family: var(--ty-font, "Roboto Local", "Noto Sans Thai", Arial, Tahoma, sans-serif) !important;
  font-size: 14px !important;
  line-height: 1.5;
}
html:lang(th) body.sp-site-page {
  --ty-base-font: 15px;
  --ty-font: "Noto Sans Thai", "Roboto Local", Arial, Tahoma, sans-serif;
  font-size: 15px !important;
}
html body.sp-site-page :is(input, select, textarea, button) {
  font-family: var(--ty-font, "Roboto Local", "Noto Sans Thai", Arial, Tahoma, sans-serif) !important;
}

/* General copy: 14px; secondary copy: 13px. */
html body.sp-site-page main.sp-site-surface :is(p, li, label, dt, dd) {
  font-size: 14px !important;
  line-height: 1.5;
}
html body.sp-site-page main.sp-site-surface :is(small, .small, .muted, .help, .hint, .note, .description-secondary, .sp-social-notice) {
  font-size: 13px !important;
  line-height: 1.45;
}

/* Semantic headings. */
html body.sp-site-page main.sp-site-surface h1 {font-size: 24px !important; line-height: 1.3 !important;}
html body.sp-site-page main.sp-site-surface h2 {font-size: 20px !important; line-height: 1.35 !important;}
html body.sp-site-page main.sp-site-surface h3 {font-size: 17px !important; line-height: 1.4 !important;}
html body.sp-site-page main.sp-site-surface h4 {font-size: 15px !important; line-height: 1.4 !important;}

/* Forms and custom selects. */
html body.sp-site-page main.sp-site-surface :is(label, legend, .sp-deposit-field-label, .sp-shop-field > span) {
  font-size: 14px !important;
}
html body.sp-site-page main.sp-site-surface :is(input[type="text"], input[type="search"], input[type="number"], input[type="email"], input[type="password"], input[type="tel"], input[type="url"], select, textarea, .sp-modern-select-trigger, .sp-modern-select-option) {
  font-size: 14px !important;
  line-height: 1.4 !important;
}
html body.sp-site-page main.sp-site-surface :is(input, textarea)::placeholder {
  font-size: 13px !important;
}
html body.sp-site-page :is(main.sp-site-surface, .ui-dialog, [role="dialog"]) :is(button, .button, input[type="button"], input[type="submit"], input[type="reset"]) {
  font-size: 14px !important;
  line-height: 1.4 !important;
}
html body.sp-site-page main.sp-site-surface :is(.form-help, .form-hint, .field-help, .sp-billing-help, .sp-login-sub, .credits-security) {
  font-size: 13px !important;
}

/* Tables and invoice lists. */
html body.sp-site-page main.sp-site-surface :is(th, [role="columnheader"], .sp-invoice-row--head > div) {
  font-size: 13px !important;
}
html body.sp-site-page main.sp-site-surface :is(td, [role="cell"], .sp-invoice-row > div) {
  font-size: 14px !important;
}

/* Header, account navigation and dropdowns. */
html body.sp-site-page header.header :is(.sp-header-deposit, .header-links .menu > a, .sp-header-quick-links a, .sp-category-strip a, .sp-category-navigation a) {
  font-size: 14px !important;
  line-height: 1.35 !important;
}
html body.sp-site-page header.header :is(.sp-header-login, .header-links .menu > a.connexion, .sp-header-recent-searches strong) {
  font-size: 13px !important;
}
html body.sp-site-page header.header :is(.sp-header-search input[type="search"], .sp-header-suggestion-link, .sp-header-title-search label, .sp-header-search-menu a, .sp-header-quick-searches span) {
  font-size: 14px !important;
}
html body.sp-site-page .dashboard-menu > ul > li > a {
  font-size: 14px !important;
  line-height: 1.4 !important;
}
html body.sp-site-page :is(.sp-mobile-nav-primary a, .sp-mobile-nav-primary button, .sp-mobile-nav-information summary, .sp-mobile-navigation a, .sp-mobile-navigation button) {
  font-size: 14px !important;
  line-height: 1.4 !important;
}
html body.sp-site-page .sp-mobile-favorites-count {font-size: 12px !important;}

/* Footer: 13px copy, compact 15px section titles. */
html body.sp-site-page footer.footer :is(p, a, li, small, .sp-footer-copyright, .sp-footer-legal) {
  font-size: 13px !important;
  line-height: 1.5 !important;
}
html body.sp-site-page footer.footer .sp-footer-links h2 {font-size: 15px !important; line-height: 1.4 !important;}
html body.sp-site-page footer.footer .sp-footer-tagline {font-size: 13px !important;}

/* Listing cards: title 15, description/meta 13, price 17, date/badges 12. */
html body.sp-site-page main.sp-site-surface :is(.sp-premium-title, .sp-ad-card-title, .title-listing) {
  font-size: 15px !important;
  line-height: 1.35 !important;
}
html body.sp-site-page main.sp-site-surface :is(.sp-premium-preview, .sp-ad-card-description, .description-listing) {
  font-size: 13px !important;
  line-height: 1.45 !important;
}
html body.sp-site-page main.sp-site-surface :is(.sp-premium-price, .sp-ad-card-price, .price-listing) {
  font-size: 17px !important;
  line-height: 1.3 !important;
}
html body.sp-site-page main.sp-site-surface :is(.sp-premium-location, .sp-ad-card-meta, .localisation-listing) {
  font-size: 13px !important;
  line-height: 1.4 !important;
}
html body.sp-site-page main.sp-site-surface :is(.sp-ad-card-seller, .sp-ad-card-seller strong, .sp-ad-card-seller small, .sp-premium-seller, .sp-premium-seller-name) {
  font-size: 13px !important;
  line-height: 1.4 !important;
}
html body.sp-site-page main.sp-site-surface :is(.sp-ad-card-specs dt, .sp-ad-card-specs dd, .sp-premium-meta) {
  font-size: 13px !important;
  line-height: 1.4 !important;
}
html body.sp-site-page main.sp-site-surface :is(.sp-ad-card-date, .deposit-date) {font-size: 12px !important;}
html body.sp-site-page main.sp-site-surface :is(.sp-ad-card-badges > span, .sp-ad-card-featured, .sp-listing-seen, .sp-premium-pro-badge, .sp-premium-featured-label) {
  font-size: 12px !important;
  line-height: 1.3 !important;
}

/* Home page headings, category labels and editorial copy. */
body.sp-home-page .index-container :is(.sp-home-hero-copy h1, .sp-home-featured-categories h1) {font-size: 24px !important;}
body.sp-home-page .index-container :is(.sp-home-latest-heading h2, .sp-home-section-heading h2, .sp-home-featured-categories h2, .sp-home-categories h2) {font-size: 20px !important;}
body.sp-home-page .index-container :is(.sp-home-hero-copy p, .sp-home-intro, .sp-home-hero-richtext, .seo p) {font-size: 14px !important;}
body.sp-home-page :is(.sp-home-category-card > span, .sp-home-featured-category > span, .sp-home-category-shortcut-link, .sp-home-category-name) {font-size: 14px !important;}
body.sp-home-page :is(.sp-home-latest-all, .sp-home-section-heading > a, .sp-home-category-all-link, .sp-home-latest-filters a) {font-size: 14px !important;}
body.sp-home-page .sp-home-category-mega-group h3 {font-size: 17px !important;}
body.sp-home-page .sp-home-category-mega-group :is(li a, .sp-home-category-mega-all) {font-size: 14px !important;}
body.sp-home-page .sp-home-trust strong {font-size: 14px !important;}
body.sp-home-page .sp-home-trust span {font-size: 13px !important;}

/* Search toolbar, drawer and filter popup. */
html body.sp-site-page .search-results-container .listing-infos.sp-listing-summary h1 {font-size: 24px !important;}
html body.sp-site-page :is(.sp-listing-summary-tab, .sp-listing-summary-save, .sp-listing-summary-filter, .sp-location-trigger, .sp-listing-summary-sort select, .sp-toolbar-sort-panel .sp-modern-select-option) {
  font-size: 14px !important;
}
html body.sp-site-page .sp-filter-drawer {font-size: 14px !important;}
html body.sp-site-page .sp-filter-drawer-heading h2 {font-size: 18px !important;}
html body.sp-site-page .sp-filter-drawer :is(label, li, legend, input, select, button, .sp-modern-select-trigger, .sp-modern-select-option, .sp-filter-category-trigger, .sp-filter-flow-row) {
  font-size: 14px !important;
}
html body.sp-site-page aside.ty-filter-modal,
html body.sp-site-page aside.ty-filter-modal .ty-popup-form {font-size: 14px !important;}
html body.sp-site-page .ty-filter-modal .ty-modal-heading h2 {font-size: 18px !important; line-height: 1.35 !important;}
html body.sp-site-page .ty-filter-modal :is(h3, legend, .ty-fold > summary) {font-size: 17px !important; line-height: 1.4 !important;}
html body.sp-site-page .ty-filter-modal :is(.ty-field, .ty-check, input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]), select, .ty-select-button, .ty-select-option, .ty-modal-actions button, .ty-popup-status) {
  font-size: 14px !important;
  line-height: 1.4 !important;
}
html body.sp-site-page .ty-filter-modal :is(.ty-muted, small, .ty-fold > summary > span, .ty-select-empty) {font-size: 13px !important;}
html body.sp-site-page .ty-filter-modal .ty-modal-heading button {font-size: 24px !important; line-height: 1 !important;}

/* Ad details, seller information and characteristics. */
html body.sp-site-page .ad-page-container :is(.title-ad, h1) {font-size: 16px !important;}
html body.sp-site-page .ad-page-container .price {font-size: 17px !important; line-height: 1.3 !important;}
html body.sp-site-page .ad-page-container :is(.description, .text, .ad-description) {font-size: 14px !important; line-height: 1.55 !important;}
html body.sp-site-page .ad-page-container :is(.sp-ad-seller-bar, .sp-ad-seller-name, .sp-ad-seller-score, .sp-ad-seller-count, .name-contact, .contact p) {font-size: 13px !important;}
html body.sp-site-page .ad-page-container :is(.options, .options li, .caracteristics, .characteristics, dl, dt, dd) {font-size: 13px !important;}
html body.sp-site-page details.ad-page-bloc-infos > summary.title {font-size: 17px !important; line-height: 1.4 !important;}
html body.sp-site-page .sp-ad-sharing .share :is(a, button) {font-size: 14px !important;}
html body.sp-site-page .sp-ad-similar > h2.icon-similar {font-size: 20px !important;}

/* Account, shop, professional, credits and checkout pages. */
html body.sp-site-page :is(.sp-saved-search-title, .sp-history-heading h1, .sp-shop-profile-summary h1, .sp-invoice-heading h1, .sp-deposit-page > h1, .forms.sp-shop-editor .sp-shop-editor-heading h1) {font-size: 24px !important;}
html body.sp-site-page :is(.sp-shop-profile-summary p, .sp-shop-about-card .description, .sp-deposit-intro, .sp-saved-search-row p) {font-size: 14px !important;}
html body.sp-site-page :is(.sp-shop-profile-summary span, .sp-shop-upload-copy span, .sp-shop-comment-meta, .sp-shop-comment-card p.comment-pseudo, .sp-shop-comment-card p.sp-shop-comment-text, .sp-shop-reviews-popup time) {font-size: 13px !important;}
html body.sp-site-page :is(.sp-deposit-steps li, .sp-deposit-steps li span, .sp-deposit-page .sp-modern-select-trigger, .sp-deposit-page .sp-category-column > h3) {font-size: 14px !important;}
html body.sp-site-page :is(.sp-visual-options-header h2, .sp-shop-visibility-popup .sp-visual-options-header h2) {font-size: 20px !important;}
html body.sp-site-page .sp-visual-option-card-head h3 {font-size: 17px !important;}
html body.sp-site-page :is(.sp-visual-option-card-head p, .sp-visual-option-duration, .sp-visual-options-total span, .sp-cart-component) {font-size: 13px !important;}
html body.sp-site-page .sp-visual-options-total strong {font-size: 17px !important;}
html body.sp-site-page .sp-pro-page h1 {font-size: 24px !important;}
html body.sp-site-page .sp-pro-page h2 {font-size: 20px !important;}
html body.sp-site-page .sp-pro-page h3 {font-size: 17px !important;}
html body.sp-site-page .sp-pro-page :is(p, li) {font-size: 14px !important;}
html body.sp-site-page .sp-pro-page .sp-pro-price {font-size: 17px !important;}
html body.sp-site-page .credits-heading h1 {font-size: 24px !important;}
html body.sp-site-page .credits-heading h3 {font-size: 17px !important;}
html body.sp-site-page .credits-heading p {font-size: 13px !important;}
html body.sp-site-page .credits-summary h2 {font-size: 20px !important;}
html body.sp-site-page :is(.credits-bonus, .credits-summary-label, .credits-security) {font-size: 13px !important;}
html body.sp-site-page .credits-summary-note {font-size: 12px !important;}
html body.sp-site-page :is(.credits-amount, .credits-summary-value) {font-size: 17px !important;}
html body.sp-site-page .credits-submit {font-size: 14px !important;}
html body.sp-site-page .sp-checkout-page :is(.sp-cart-head, .sp-cart-component, .sp-billing-help, .sp-payment-step, .sp-checkout-secure, .sp-cart-footer .ref, .payment-gtc label, .sp-method-copy small, .billing-resume) {font-size: 14px !important;}
html body.sp-site-page .sp-checkout-page .sp-method-copy strong {font-size: 15px !important;}
html body.sp-site-page .sp-checkout-page .sp-checkout-progress li {font-size: 13px !important;}

/* Popups, reviews, promotion and jQuery UI dialogs. */
html body.sp-site-page :is(.ui-dialog, .sp-shop-reviews-popup, .sp-promotion-popup) {font-size: 14px !important;}
html body.sp-site-page :is(.ui-dialog-title, .sp-shop-reviews-popup h2, .sp-promotion-popup h2) {font-size: 18px !important; line-height: 1.35 !important;}
html body.sp-site-page :is(.ui-dialog-content, .sp-shop-reviews-popup p, .sp-promotion-popup p) {font-size: 14px !important; line-height: 1.5 !important;}
html body.sp-site-page :is(.ui-dialog-buttonpane button, .sp-shop-reviews-popup button, .sp-promotion-popup button) {font-size: 14px !important;}

/* Internal messaging and floating conversation window. */
html body.sp-site-page .messaging {font-size: 14px !important;}
html body.sp-site-page .messaging .livechat-header h1 {font-size: 24px !important;}
html body.sp-site-page .messaging :is(.conversation-message, .conversation-recipient, .conversation-message-send textarea, button) {font-size: 14px !important;}
html body.sp-site-page .messaging :is(.conversation-message-footer, time, small) {font-size: 12px !important;}
html body.sp-site-page .messaging-conversation-container.chat:not(.mini) {font-size: 14px !important;}

/* Thai requires a slightly larger reading size without changing hierarchy. */
html:lang(th) body.sp-site-page main.sp-site-surface :is(p, li, label, dt, dd, input, select, textarea, button, .button, .sp-modern-select-trigger, .sp-modern-select-option),
html:lang(th) body.sp-site-page :is(header.header a, .dashboard-menu a, footer.footer p, footer.footer a, footer.footer li, .ty-filter-modal .ty-field, .ty-filter-modal .ty-check, .ty-filter-modal input, .ty-filter-modal select, .ty-filter-modal button) {
  font-size: 15px !important;
}
html:lang(th) body.sp-site-page main.sp-site-surface :is(.sp-premium-title, .sp-ad-card-title, .title-listing) {font-size: 16px !important;}
html:lang(th) body.sp-site-page main.sp-site-surface :is(.sp-premium-price, .sp-ad-card-price, .price-listing) {font-size: 17px !important;}
html:lang(th) body.sp-site-page main.sp-site-surface :is(.sp-premium-preview, .sp-premium-location, .sp-ad-card-meta, .sp-ad-card-seller, .sp-ad-card-seller strong, .sp-ad-card-seller small, .sp-ad-card-specs dt, .sp-ad-card-specs dd) {font-size: 14px !important;}
html:lang(th) body.sp-site-page main.sp-site-surface :is(.sp-ad-card-date, .deposit-date, .sp-ad-card-badges > span, .sp-ad-card-featured, .sp-listing-seen, .sp-premium-pro-badge) {font-size: 12px !important;}
html:lang(th) body.sp-site-page :is(small, .small, .muted, .help, .hint, .note) {font-size: 14px !important;}

/* Mobile keeps the same scale; long labels may wrap naturally. */
@media (max-width: 700px) {
  html body.sp-site-page :is(.sp-mobile-navigation, .sp-filter-drawer, .ty-filter-modal, main.sp-site-surface) :is(a, button, label, p, li, td, th) {
    overflow-wrap: anywhere;
  }
}
