/* Loaded after the page styles so mobile rules also apply to reference layouts. */
.uv-payment-badge-icon {
  display: block;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
}

@media (max-width: 760px) {
  body.uv-site .uv-section.uv-commerce-cta { padding-block: 28px 36px; }
  body.uv-site .uv-commerce-card {
    gap: 18px;
    padding: 24px 20px;
    border-radius: 24px;
    box-shadow: 0 16px 36px rgba(6, 38, 99, .16);
  }
  body.uv-site .uv-commerce-card .uv-kicker { font-size: 11px; }
  body.uv-site .uv-commerce-cta .uv-commerce-card h2 {
    margin: 10px 0 0;
    font-size: 26px;
    line-height: 1.2;
  }
  body.uv-site .uv-commerce-card p { margin: 12px 0; font-size: 14px; line-height: 1.6; }
  body.uv-site .uv-commerce-card .uv-payment-badges { gap: 8px; margin-top: 14px; }
  body.uv-site .uv-commerce-card .uv-payment-badges > span { padding: 6px 10px; }
  body.uv-site .uv-commerce-card .uv-payment-badges small { width: 100%; line-height: 1.5; }
  body.uv-site .uv-commerce-action {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 16px;
    min-width: 0;
  }
  body.uv-site .uv-commerce-action > a { display: inline-flex; align-items: center; min-height: 44px; }
  body.uv-site .uv-commerce-action .uv-button { padding-inline: 18px; font-size: 14px; }
}

@media (max-width: 1120px) {
  body.uv-site .uv-header .uv-primary-nav {
    max-height: calc(100vh - 86px);
    max-height: calc(100dvh - 86px - env(safe-area-inset-bottom, 0px));
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  body.uv-site main :where(input, select, textarea):not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]):not(.uv-auth-code-input) {
    font-size: 16px !important;
  }

  body.uv-site :where(.uv-auth-form-panel, .uv-account-page-wrap, .uv-resource-copy, .uv-price-card, .uv-support-content) {
    min-width: 0;
  }

  body.uv-site .uv-license-v2-dialog {
    max-height: calc(100dvh - 32px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
    overscroll-behavior: contain;
  }
}

@media (max-width: 980px) {
  /* The purchase page has two plans; both need a full grid cell on tablets. */
  body[data-uversa-reference-page] .uv-reference-comprar .uv-price-card:last-child {
    grid-column: auto;
    max-width: none;
    justify-self: stretch;
  }

  body[data-uversa-reference-page] .uv-resource-copy p,
  body[data-uversa-reference-page] .uv-resource-copy .uv-resource-lead,
  body[data-uversa-reference-page] .uv-resource-responsibility p {
    font-size: 16px;
    line-height: 1.7;
  }

  body[data-uversa-reference-page] .uv-resource-points li,
  body[data-uversa-reference-page] .uv-resource-screenshot figcaption {
    font-size: 13px;
  }

  body[data-uversa-reference-page] .uv-reference-comprar .uv-price-card-copy p {
    min-height: 0;
    font-size: 16px;
    line-height: 1.6;
  }

  /* Keep notes in document flow when descriptions wrap or text is enlarged. */
  body[data-uversa-reference-page] .uv-reference-comprar .uv-price-note {
    position: static;
    margin-top: 14px;
    font-size: 14px;
    line-height: 1.6;
  }

  body[data-uversa-reference-page] .uv-reference-comprar .uv-price-list {
    margin-top: 20px;
  }

  body[data-uversa-reference-page] .uv-reference-comprar .uv-price-list li,
  body[data-uversa-reference-page] .uv-reference-comprar .uv-payment-option p,
  body[data-uversa-reference-page] .uv-reference-comprar .uv-payment-security,
  body[data-uversa-reference-page] .uv-reference-comprar .uv-payment-privacy {
    font-size: 14px;
    line-height: 1.6;
  }

  body[data-uversa-reference-page] .uv-auth-heading p,
  body[data-uversa-reference-page] .uv-auth-form label,
  body[data-uversa-reference-page] .uv-auth-terms,
  body[data-uversa-reference-page] .uv-auth-a3-hint,
  body[data-uversa-reference-page] .uv-recaptcha-status {
    font-size: 14px;
    line-height: 1.6;
  }

  body.uv-site :is(.uv-auth-password-toggle, .uv-auth-back, .uv-auth-password-actions a, .uv-support-nav a, .uv-account-secondary-button, .uv-license-v2-dialog header > button) {
    min-height: 44px;
    min-width: 44px;
  }

  body.uv-site :where(.uv-footer, .uv-security-footer) a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    max-width: 100%;
    overflow-wrap: anywhere;
  }
}

@media (max-width: 620px) {
  body.uv-site .uv-hero h1,
  body.uv-site .uv-section h2 {
    font-size: clamp(28px, 8vw, 38px);
    overflow-wrap: break-word;
  }

  body.uv-site .uv-hero-actions > .uv-button {
    width: 100%;
    justify-content: center;
  }

  body.uv-site .uv-section { padding-block: 56px; }
  body.uv-site .uv-license-v2-dialog.is-wide { width: calc(100% - 20px); }
}

@media (max-width: 600px) {
  /* WooCommerce adds its block styles after the theme's header styles. */
  body[data-uversa-reference-page] table.wc-block-cart-items .wc-block-cart-item__image {
    grid-area: 1 / 1 / 3 / 2 !important;
  }

  body[data-uversa-reference-page] table.wc-block-cart-items .wc-block-cart-item__product {
    grid-area: 1 / 2 / 2 / 3 !important;
  }

  body[data-uversa-reference-page] table.wc-block-cart-items .wc-block-cart-item__total {
    grid-area: 2 / 2 / 3 / 3 !important;
    text-align: left;
  }
}

/* Short landscape screens must keep the form and menu reachable by scrolling. */
@media (max-width: 980px) and (max-height: 500px) {
  body[data-uversa-reference-page] .uv-auth-form-panel { padding-block: 24px; }
  body[data-uversa-reference-page] .uv-auth-mobile-brand { margin-bottom: 20px; }
}