/**
 * Fundação tipográfica do Nexo Base Version 3.
 *
 * Este arquivo não contém valores visuais fixos dos presets.
 * Ele consome as CSS Custom Properties geradas pelo módulo PHP.
 *
 * As sobrescritas locais são feitas por variáveis CSS aplicadas
 * diretamente à instância, sem uso de !important.
 */

/* Display. */
.nexo-type-display {
  --nexo-resolved-font-family: var(--nexo-type-display-font-family);

  --nexo-resolved-font-size: var(
    --nexo-local-font-size-desktop,
    var(--nexo-type-display-font-size-desktop)
  );

  --nexo-resolved-font-weight: var(
    --nexo-local-font-weight,
    var(--nexo-type-display-font-weight)
  );

  --nexo-resolved-line-height: var(
    --nexo-local-line-height,
    var(--nexo-type-display-line-height)
  );

  --nexo-resolved-letter-spacing: var(
    --nexo-local-letter-spacing,
    var(--nexo-type-display-letter-spacing)
  );

  --nexo-resolved-text-transform: var(
    --nexo-local-text-transform,
    var(--nexo-type-display-text-transform)
  );
}

/* Heading 1. */
:where(h1), .nexo-type-heading-1 {
  --nexo-resolved-font-family: var(--nexo-type-heading-1-font-family);

  --nexo-resolved-font-size: var(
    --nexo-local-font-size-desktop,
    var(--nexo-type-heading-1-font-size-desktop)
  );

  --nexo-resolved-font-weight: var(
    --nexo-local-font-weight,
    var(--nexo-type-heading-1-font-weight)
  );

  --nexo-resolved-line-height: var(
    --nexo-local-line-height,
    var(--nexo-type-heading-1-line-height)
  );

  --nexo-resolved-letter-spacing: var(
    --nexo-local-letter-spacing,
    var(--nexo-type-heading-1-letter-spacing)
  );

  --nexo-resolved-text-transform: var(
    --nexo-local-text-transform,
    var(--nexo-type-heading-1-text-transform)
  );
}

/* Heading 2. */
:where(h2), .nexo-type-heading-2 {
  --nexo-resolved-font-family: var(--nexo-type-heading-2-font-family);

  --nexo-resolved-font-size: var(
    --nexo-local-font-size-desktop,
    var(--nexo-type-heading-2-font-size-desktop)
  );

  --nexo-resolved-font-weight: var(
    --nexo-local-font-weight,
    var(--nexo-type-heading-2-font-weight)
  );

  --nexo-resolved-line-height: var(
    --nexo-local-line-height,
    var(--nexo-type-heading-2-line-height)
  );

  --nexo-resolved-letter-spacing: var(
    --nexo-local-letter-spacing,
    var(--nexo-type-heading-2-letter-spacing)
  );

  --nexo-resolved-text-transform: var(
    --nexo-local-text-transform,
    var(--nexo-type-heading-2-text-transform)
  );
}

/* Heading 3. */
:where(h3), .nexo-type-heading-3 {
  --nexo-resolved-font-family: var(--nexo-type-heading-3-font-family);

  --nexo-resolved-font-size: var(
    --nexo-local-font-size-desktop,
    var(--nexo-type-heading-3-font-size-desktop)
  );

  --nexo-resolved-font-weight: var(
    --nexo-local-font-weight,
    var(--nexo-type-heading-3-font-weight)
  );

  --nexo-resolved-line-height: var(
    --nexo-local-line-height,
    var(--nexo-type-heading-3-line-height)
  );

  --nexo-resolved-letter-spacing: var(
    --nexo-local-letter-spacing,
    var(--nexo-type-heading-3-letter-spacing)
  );

  --nexo-resolved-text-transform: var(
    --nexo-local-text-transform,
    var(--nexo-type-heading-3-text-transform)
  );
}

/* Heading 4. */
:where(h4), .nexo-type-heading-4 {
  --nexo-resolved-font-family: var(--nexo-type-heading-4-font-family);

  --nexo-resolved-font-size: var(
    --nexo-local-font-size-desktop,
    var(--nexo-type-heading-4-font-size-desktop)
  );

  --nexo-resolved-font-weight: var(
    --nexo-local-font-weight,
    var(--nexo-type-heading-4-font-weight)
  );

  --nexo-resolved-line-height: var(
    --nexo-local-line-height,
    var(--nexo-type-heading-4-line-height)
  );

  --nexo-resolved-letter-spacing: var(
    --nexo-local-letter-spacing,
    var(--nexo-type-heading-4-letter-spacing)
  );

  --nexo-resolved-text-transform: var(
    --nexo-local-text-transform,
    var(--nexo-type-heading-4-text-transform)
  );
}

/* Heading 5. */
:where(h5), .nexo-type-heading-5 {
  --nexo-resolved-font-family: var(--nexo-type-heading-5-font-family);

  --nexo-resolved-font-size: var(
    --nexo-local-font-size-desktop,
    var(--nexo-type-heading-5-font-size-desktop)
  );

  --nexo-resolved-font-weight: var(
    --nexo-local-font-weight,
    var(--nexo-type-heading-5-font-weight)
  );

  --nexo-resolved-line-height: var(
    --nexo-local-line-height,
    var(--nexo-type-heading-5-line-height)
  );

  --nexo-resolved-letter-spacing: var(
    --nexo-local-letter-spacing,
    var(--nexo-type-heading-5-letter-spacing)
  );

  --nexo-resolved-text-transform: var(
    --nexo-local-text-transform,
    var(--nexo-type-heading-5-text-transform)
  );
}

/* Heading 6. */
:where(h6), .nexo-type-heading-6 {
  --nexo-resolved-font-family: var(--nexo-type-heading-6-font-family);

  --nexo-resolved-font-size: var(
    --nexo-local-font-size-desktop,
    var(--nexo-type-heading-6-font-size-desktop)
  );

  --nexo-resolved-font-weight: var(
    --nexo-local-font-weight,
    var(--nexo-type-heading-6-font-weight)
  );

  --nexo-resolved-line-height: var(
    --nexo-local-line-height,
    var(--nexo-type-heading-6-line-height)
  );

  --nexo-resolved-letter-spacing: var(
    --nexo-local-letter-spacing,
    var(--nexo-type-heading-6-letter-spacing)
  );

  --nexo-resolved-text-transform: var(
    --nexo-local-text-transform,
    var(--nexo-type-heading-6-text-transform)
  );
}

/* Body. */
:where(body), .nexo-type-body {
  --nexo-resolved-font-family: var(--nexo-type-body-font-family);

  --nexo-resolved-font-size: var(
    --nexo-local-font-size-desktop,
    var(--nexo-type-body-font-size-desktop)
  );

  --nexo-resolved-font-weight: var(
    --nexo-local-font-weight,
    var(--nexo-type-body-font-weight)
  );

  --nexo-resolved-line-height: var(
    --nexo-local-line-height,
    var(--nexo-type-body-line-height)
  );

  --nexo-resolved-letter-spacing: var(
    --nexo-local-letter-spacing,
    var(--nexo-type-body-letter-spacing)
  );

  --nexo-resolved-text-transform: var(
    --nexo-local-text-transform,
    var(--nexo-type-body-text-transform)
  );
}

/* Body Large. */
.nexo-type-body-large {
  --nexo-resolved-font-family: var(--nexo-type-body-large-font-family);

  --nexo-resolved-font-size: var(
    --nexo-local-font-size-desktop,
    var(--nexo-type-body-large-font-size-desktop)
  );

  --nexo-resolved-font-weight: var(
    --nexo-local-font-weight,
    var(--nexo-type-body-large-font-weight)
  );

  --nexo-resolved-line-height: var(
    --nexo-local-line-height,
    var(--nexo-type-body-large-line-height)
  );

  --nexo-resolved-letter-spacing: var(
    --nexo-local-letter-spacing,
    var(--nexo-type-body-large-letter-spacing)
  );

  --nexo-resolved-text-transform: var(
    --nexo-local-text-transform,
    var(--nexo-type-body-large-text-transform)
  );
}

/* Body Small. */
.nexo-type-body-small {
  --nexo-resolved-font-family: var(--nexo-type-body-small-font-family);

  --nexo-resolved-font-size: var(
    --nexo-local-font-size-desktop,
    var(--nexo-type-body-small-font-size-desktop)
  );

  --nexo-resolved-font-weight: var(
    --nexo-local-font-weight,
    var(--nexo-type-body-small-font-weight)
  );

  --nexo-resolved-line-height: var(
    --nexo-local-line-height,
    var(--nexo-type-body-small-line-height)
  );

  --nexo-resolved-letter-spacing: var(
    --nexo-local-letter-spacing,
    var(--nexo-type-body-small-letter-spacing)
  );

  --nexo-resolved-text-transform: var(
    --nexo-local-text-transform,
    var(--nexo-type-body-small-text-transform)
  );
}

/* Button. */
:where(
  button,
  input[type="button"],
  input[type="submit"],
  input[type="reset"]
),
.nexo-type-button {
  --nexo-resolved-font-family: var(--nexo-type-button-font-family);

  --nexo-resolved-font-size: var(
    --nexo-local-font-size-desktop,
    var(--nexo-type-button-font-size-desktop)
  );

  --nexo-resolved-font-weight: var(
    --nexo-local-font-weight,
    var(--nexo-type-button-font-weight)
  );

  --nexo-resolved-line-height: var(
    --nexo-local-line-height,
    var(--nexo-type-button-line-height)
  );

  --nexo-resolved-letter-spacing: var(
    --nexo-local-letter-spacing,
    var(--nexo-type-button-letter-spacing)
  );

  --nexo-resolved-text-transform: var(
    --nexo-local-text-transform,
    var(--nexo-type-button-text-transform)
  );
}

/* Caption. */
:where(figcaption), .nexo-type-caption {
  --nexo-resolved-font-family: var(--nexo-type-caption-font-family);

  --nexo-resolved-font-size: var(
    --nexo-local-font-size-desktop,
    var(--nexo-type-caption-font-size-desktop)
  );

  --nexo-resolved-font-weight: var(
    --nexo-local-font-weight,
    var(--nexo-type-caption-font-weight)
  );

  --nexo-resolved-line-height: var(
    --nexo-local-line-height,
    var(--nexo-type-caption-line-height)
  );

  --nexo-resolved-letter-spacing: var(
    --nexo-local-letter-spacing,
    var(--nexo-type-caption-letter-spacing)
  );

  --nexo-resolved-text-transform: var(
    --nexo-local-text-transform,
    var(--nexo-type-caption-text-transform)
  );
}

/**
 * Aplicação única das propriedades resolvidas.
 */
:where(
  body,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  figcaption,
  button,
  input[type="button"],
  input[type="submit"],
  input[type="reset"],
  .nexo-type-display,
  .nexo-type-heading-1,
  .nexo-type-heading-2,
  .nexo-type-heading-3,
  .nexo-type-heading-4,
  .nexo-type-heading-5,
  .nexo-type-heading-6,
  .nexo-type-body-large,
  .nexo-type-body,
  .nexo-type-body-small,
  .nexo-type-button,
  .nexo-type-caption
) {
  font-family: var(
    --nexo-local-font-family,
    var(--nexo-resolved-font-family, inherit)
  );

  font-size: var(--nexo-resolved-font-size, inherit);

  font-weight: var(--nexo-resolved-font-weight, inherit);

  line-height: var(--nexo-resolved-line-height, normal);

  letter-spacing: var(--nexo-resolved-letter-spacing, normal);

  text-transform: var(--nexo-resolved-text-transform, none);
}

/**
 * Tablet.
 */
@media (max-width: 1024px) {
  .nexo-type-display {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-tablet,
      var(--nexo-type-display-font-size-tablet)
    );
  }

  :where(h1), .nexo-type-heading-1 {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-tablet,
      var(--nexo-type-heading-1-font-size-tablet)
    );
  }

  :where(h2), .nexo-type-heading-2 {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-tablet,
      var(--nexo-type-heading-2-font-size-tablet)
    );
  }

  :where(h3), .nexo-type-heading-3 {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-tablet,
      var(--nexo-type-heading-3-font-size-tablet)
    );
  }

  :where(h4), .nexo-type-heading-4 {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-tablet,
      var(--nexo-type-heading-4-font-size-tablet)
    );
  }

  :where(h5), .nexo-type-heading-5 {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-tablet,
      var(--nexo-type-heading-5-font-size-tablet)
    );
  }

  :where(h6), .nexo-type-heading-6 {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-tablet,
      var(--nexo-type-heading-6-font-size-tablet)
    );
  }

  :where(body), .nexo-type-body {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-tablet,
      var(--nexo-type-body-font-size-tablet)
    );
  }

  .nexo-type-body-large {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-tablet,
      var(--nexo-type-body-large-font-size-tablet)
    );
  }

  .nexo-type-body-small {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-tablet,
      var(--nexo-type-body-small-font-size-tablet)
    );
  }

  :where(
    button,
    input[type="button"],
    input[type="submit"],
    input[type="reset"]
  ),
  .nexo-type-button {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-tablet,
      var(--nexo-type-button-font-size-tablet)
    );
  }

  :where(figcaption), .nexo-type-caption {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-tablet,
      var(--nexo-type-caption-font-size-tablet)
    );
  }
}

/**
 * Mobile.
 */
@media (max-width: 767px) {
  .nexo-type-display {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-mobile,
      var(--nexo-type-display-font-size-mobile)
    );
  }

  :where(h1), .nexo-type-heading-1 {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-mobile,
      var(--nexo-type-heading-1-font-size-mobile)
    );
  }

  :where(h2), .nexo-type-heading-2 {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-mobile,
      var(--nexo-type-heading-2-font-size-mobile)
    );
  }

  :where(h3), .nexo-type-heading-3 {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-mobile,
      var(--nexo-type-heading-3-font-size-mobile)
    );
  }

  :where(h4), .nexo-type-heading-4 {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-mobile,
      var(--nexo-type-heading-4-font-size-mobile)
    );
  }

  :where(h5), .nexo-type-heading-5 {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-mobile,
      var(--nexo-type-heading-5-font-size-mobile)
    );
  }

  :where(h6), .nexo-type-heading-6 {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-mobile,
      var(--nexo-type-heading-6-font-size-mobile)
    );
  }

  :where(body), .nexo-type-body {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-mobile,
      var(--nexo-type-body-font-size-mobile)
    );
  }

  .nexo-type-body-large {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-mobile,
      var(--nexo-type-body-large-font-size-mobile)
    );
  }

  .nexo-type-body-small {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-mobile,
      var(--nexo-type-body-small-font-size-mobile)
    );
  }

  :where(
    button,
    input[type="button"],
    input[type="submit"],
    input[type="reset"]
  ),
  .nexo-type-button {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-mobile,
      var(--nexo-type-button-font-size-mobile)
    );
  }

  :where(figcaption), .nexo-type-caption {
    --nexo-resolved-font-size: var(
      --nexo-local-font-size-mobile,
      var(--nexo-type-caption-font-size-mobile)
    );
  }
}