/*
  Maido Stage 5T - Front-end font match
  Purpose: make all public/front-end pages use the same font system as the landing page.
  Upload path: assets/css/maido-stage5t-font-match.css
*/

:root {
  /* Landing page display/menu stack currently used by the home hero, menu and section headings. */
  --maido-stage5t-display-font: Impact, Haettenschweiler, "Arial Narrow", "Roboto Condensed", Arial, Helvetica, sans-serif;

  /* Landing page clean text stack used for body copy, forms, product names and footer copy. */
  --maido-stage5t-body-font: "Avenir Next", "Helvetica Neue", Arial, Helvetica, sans-serif;

  /* Keep all older stage variables aligned so existing CSS keeps working. */
  --font-body: var(--maido-stage5t-body-font);
  --font-display: var(--maido-stage5t-display-font);
  --font-menu: var(--maido-stage5t-display-font);
  --font-hero: var(--maido-stage5t-display-font);

  --maido-menu-font: var(--maido-stage5t-display-font);
  --maido-stage3h-font-condensed: var(--maido-stage5t-display-font);
  --maido-stage3i-font-condensed: var(--maido-stage5t-display-font);
  --maido-stage3i-font-clean: var(--maido-stage5t-body-font);
  --maido-stage3j-font-condensed: var(--maido-stage5t-display-font);
  --maido-stage3j-font-clean: var(--maido-stage5t-body-font);
  --maido-3k-font-condensed: var(--maido-stage5t-display-font);
  --maido-3k-font-clean: var(--maido-stage5t-body-font);
  --maido-3n-font-condensed: var(--maido-stage5t-display-font);
  --maido-3o-font-menu: var(--maido-stage5t-display-font);
  --maido-3o-font-hero: var(--maido-stage5t-display-font);
  --maido-3p-font-menu: var(--maido-stage5t-display-font);
  --maido-3p-font-hero: var(--maido-stage5t-display-font);
  --maido-3q-menu-font: var(--maido-stage5t-display-font);
  --maido-3q-hero-font: var(--maido-stage5t-display-font);
  --maido-3r-menu-font: var(--maido-stage5t-display-font);
  --maido-3r-dropdown-font: var(--maido-stage5t-body-font);
  --maido-stage3w-menu-font: var(--maido-stage5t-display-font);
  --maido-stage3w-hero-font: var(--maido-stage5t-display-font);
  --maido-stage4i-menu-font: var(--maido-stage5t-display-font);
  --maido-stage4i-copy-font: var(--maido-stage5t-body-font);
  --maido-stage4i-hero-title-font: var(--maido-stage5t-display-font);
  --maido-stage4o-menu-font: var(--maido-stage5t-display-font);
  --maido-menu-font-family: var(--maido-stage5t-display-font);
  --maido-4t-menu-font: var(--maido-stage5t-display-font);
  --maido-5o-menu-font: var(--maido-stage5t-display-font);
}

html body {
  font-family: var(--maido-stage5t-body-font) !important;
}

/* Clean landing-page text font for normal copy, forms, tables, product cards and footer content. */
html body :is(#maidoStage5tFontBoost, p, li, dt, dd, label, small, strong, em, input, textarea, select, table, th, td, .content, .intro, .muted, .notice, .price, .contact-card, .form-card, .product-info, .product-enquiry-summary, .spec-list, .chips, .site-footer, .footer-grid, .footer-bottom, .maido-stage3k-footer, .maido-mini-cart-drawer, .maido-mini-cart-drawer *, .maido-order-card, .maido-order-details, .maido-order-totals, .maido-quote-public-page, .maido-quote-public-page *, .maido-stage3k-search-page, .maido-stage3k-search-page *) {
  font-family: var(--maido-stage5t-body-font) !important;
}

/* Landing-style display font for hero titles, major headings, menu and section headings. */
html body :is(#maidoStage5tFontBoost, h1, h2, .landing-hero h1, .landing-hero__title, .landing-hero__eyebrow, .page-hero h1, .maido-stage4i-inner-hero__title, .maido-stage4i-inner-hero__kicker, .section__heading h2, .section .eyebrow, .eyebrow, .maido-home-banner h2, .maido-home-banner__eyebrow, .maido-popular-mods__head h2, #maido-popular-mods-title, .maido-stage4k-product-section__head h2, .product-info h1, .login-card h1, .account-card h1, .maido-order-card h2, .maido-order-card__heading h2, .maido-mini-cart__header h2, .maido-mini-cart-empty h3) {
  font-family: var(--maido-stage5t-display-font) !important;
}

/* Header, dropdown and drawer menu text should match the landing page menu. */
html body :is(#maidoStage5tFontBoost, .main-nav, .main-nav *, .nav-link, .nav-link > span:first-child, .dropdown-menu a, .site-header .main-nav .maido-stage3k-category-link, .site-header .main-nav .maido-stage3k-view-all, .site-header .main-nav .maido-stage3k-view-all span, .maido-stage3k-menu-panel a, .maido-stage3k-menu-panel .maido-stage3k-category-link, .maido-stage3k-view-all, .maido-menu-panel a, .maido-menu-panel button, .maido-recursive-menu a, .maido-recursive-menu button, .maido-mobile-drawer a, .maido-mobile-drawer button, .maido-mobile-menu a, .maido-mobile-menu button) {
  font-family: var(--maido-stage5t-display-font) !important;
}

/* Landing product/card names use the clean text stack, so keep cards consistent across all pages. */
html body :is(#maidoStage5tFontBoost, .product-card h3, .product-card h3 a, .category-card h3, .category-card h3 a, .maido-popular-mods__body h3, .maido-popular-mods__body h3 a, .maido-stage4k-card__body h3, .maido-stage4k-card__body h3 a, .maido-stage4l-card .maido-stage4k-card__body h3, .maido-order-item__body h3, .maido-order-item__body h3 a, .maido-mini-cart-item__body h3, .maido-mini-cart-item__body h3 a, .maido-stage4k-card__price, .maido-popular-mods__price, .maido-stage4k-card__stock, .maido-stage4l-view-more, .btn, .button) {
  font-family: var(--maido-stage5t-body-font) !important;
}

/* Counters/arrows/icons stay clean and readable while the actual words use the matched fonts above. */
html body :is(#maidoStage5tFontBoost, .maido-stage3s-cart-count, .cart-count, .maido-mini-cart__count, .maido-stage3k-child-arrow, .nav-caret, .footer-payments span, .maido-stage3k-payments span, .gallery__zoom-hint) {
  font-family: Arial, Helvetica, sans-serif !important;
}