/*
 * Final storefront typography foundation.
 *
 * Keep icon and symbol families component-owned. This file targets only the
 * general text cascade and the Porto variables that feed it.
 */

:root {
  --porto-body-ff: var(--storefront-font-ui, "Montserrat", Arial, sans-serif);
  --porto-body-fs: var(--storefront-type-body-size, 13px);
  --porto-body-fw: var(--storefront-type-body-weight, 400);
  --porto-body-lh: var(--storefront-type-body-line-height, 22px);
  --porto-body-color: var(--storefront-color-ink, #232323);
  --porto-heading-color: var(--storefront-color-ink, #232323);
}

body {
  color: var(--storefront-color-ink, #232323);
  font-family: var(--storefront-font-ui, "Montserrat", Arial, sans-serif);
  font-size: var(--storefront-type-body-size, 13px);
  font-weight: var(--storefront-type-body-weight, 400);
  line-height: var(--storefront-type-body-line-height, 22px);
  letter-spacing: .02em;
}

:where(h1, h2, h3, h4, h5, h6) {
  color: var(--storefront-color-ink, #232323);
  font-family: var(--storefront-font-heading, "Montserrat", Arial, sans-serif);
}

:where(button, input, select, textarea):not(:where(
  .storefront-back-in-stock__form [id^="omnisend-embedded-v2-"] *,
  .storefront-back-in-stock__form form[id^="omnisend-form-"][id$="-submit-form"],
  .storefront-back-in-stock__form form[id^="omnisend-form-"][id$="-submit-form"] *,
  #footer .site-footer .footer-newsletter [id^="omnisend-embedded-"] *,
  #footer .site-footer .footer-newsletter form[id^="omnisend-form-"][id$="-submit-form"],
  #footer .site-footer .footer-newsletter form[id^="omnisend-form-"][id$="-submit-form"] *
)),
.tooltip,
.popover,
.page-header-8 li a {
  font-family: var(--storefront-font-ui, "Montserrat", Arial, sans-serif);
}