/* Uniform Ertex typography: one size, white text, bold headings only. */
:root {
  --ertex-text-size: 16px;
  --ertex-text-white: #ffffff;
}

html:root:root:root:root:root body,
html:root:root:root:root:root body :where(
  p,
  a,
  span,
  div,
  li,
  dt,
  dd,
  label,
  input,
  textarea,
  select,
  option,
  button,
  summary,
  figcaption,
  blockquote,
  cite,
  small,
  time,
  address,
  table,
  thead,
  tbody,
  tfoot,
  tr,
  th,
  td,
  caption,
  legend,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6
) {
  color: var(--ertex-text-white) !important;
  font-family: var(--sans, 'Cabin', system-ui, sans-serif) !important;
  font-size: var(--ertex-text-size) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}

html:root:root:root:root:root body :where(h1, h2, h3, h4, h5, h6, th, summary, .tm-q),
html:root:root:root:root:root body :where(h1, h2, h3, h4, h5, h6, th, summary, .tm-q) :where(span, em, strong, b) {
  font-weight: 700 !important;
}

html:root:root:root:root:root body :where(strong, b, em) {
  color: inherit !important;
  font-size: inherit !important;
  font-style: normal !important;
  font-weight: inherit !important;
  letter-spacing: 0 !important;
}

html:root:root:root:root:root body :where(input, textarea, select, option)::placeholder {
  color: var(--ertex-text-white) !important;
  opacity: 1 !important;
}

/* These are icon-only controls; keep their existing visual glyph sizing. */
html:root:root:root:root:root body :where(.mm-close, .close-menu) {
  font-size: 0 !important;
}

html:root:root:root:root:root body .tm-close {
  font-size: 28px !important;
}

/* Keep every visible navigation label at the same site-wide text size. */
html:root:root:root:root:root body #hdr .models-dropdown :where(p, a),
html:root:root:root:root:root body #mobileMenu :where(summary, p, a),
html:root:root:root:root:root body footer .foot-grid :where(h5, p, a) {
  font-size: var(--ertex-text-size) !important;
  letter-spacing: 0 !important;
}

@media (max-width: 700px) {
  :root {
    --ertex-text-size: 16px;
  }

  html:root:root:root:root:root body {
    padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
  }

  html:root:root:root:root:root body #ertexShareButton,
  html:root:root:root:root:root body #ertexWhatsAppButton {
    bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    width: 52px !important;
    min-width: 52px !important;
    height: 52px !important;
    padding: 0 !important;
    border-radius: 26px !important;
  }

  html:root:root:root:root:root body #ertexShareButton {
    right: calc(50% - 56px) !important;
  }

  html:root:root:root:root:root body:not(.ertex-wa-ready) #ertexShareButton {
    right: calc(50% - 26px) !important;
  }

  html:root:root:root:root:root body #ertexWhatsAppButton {
    right: 16px !important;
    left: auto !important;
    bottom: calc(70px + env(safe-area-inset-bottom, 0px)) !important;
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    border-radius: 50% !important;
    transform: none !important;
  }

  html:root:root:root:root:root body :where(#ertexShareButton, #ertexWhatsAppButton) span {
    display: none !important;
  }

  html:root:root:root:root:root body :where(#ertexShareButton, #ertexWhatsAppButton) svg {
    width: 22px !important;
    height: 22px !important;
  }

  html:root:root:root:root:root body #ertexShareToast,
  html:root:root:root:root:root body.ertex-wa-ready #ertexShareToast {
    right: 16px !important;
    bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important;
  }
}
