/* Small, checkout-scoped fixes for the WooCommerce order summary and hero. */
@layer hg-readable-type {
  body.hg-checkout-page-active {
    --hg-checkout-crumb-nav-height: 72px;
  }

  body.hg-checkout-page-active .hg-cart-hero {
    overflow: visible !important;
  }

  body.hg-checkout-page-active .hg-cart-breadcrumb {
    position: sticky !important;
    top: calc(
      var(--hg-checkout-crumb-nav-height, 72px)
      + var(--wp-admin--admin-bar--height, 0px)
      + 4px
    ) !important;
    z-index: 100 !important;
    align-self: start !important;
    padding: 2px 4px !important;
    border-radius: 4px !important;
    background: #fffdf8 !important;
  }

  body.hg-checkout-page-active .wc-block-components-order-summary-item__quantity {
    display: inline-grid !important;
    place-items: center !important;
    box-sizing: border-box !important;
    min-width: 28px !important;
    min-height: 28px !important;
    padding: 0 6px !important;
    border-radius: 999px !important;
    background: #203d32 !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    font-family: "Baloo 2", sans-serif !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-align: center !important;
    white-space: nowrap !important;
  }

  body.hg-checkout-page-active .wc-block-components-order-summary-item__quantity * {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    font-family: "Baloo 2", sans-serif !important;
    font-size: 16px !important;
    line-height: 1 !important;
  }

  body.hg-checkout-page-active :is(
    .wc-block-components-order-summary-item__individual-price,
    .wc-block-components-order-summary-item__total-price
  ) {
    font-family: "Baloo 2", sans-serif !important;
    font-size: 16px !important;
    line-height: 1.35 !important;
  }

  body.hg-checkout-page-active .wc-block-components-totals-footer-item :is(
    .wc-block-components-totals-item__label,
    .wc-block-components-totals-item__value,
    .wc-block-formatted-money-amount
  ) {
    font-family: "Baloo 2", sans-serif !important;
    font-size: 18px !important;
  }

  @media (max-width: 780px) {
    body.hg-checkout-page-active .hg-cart-breadcrumb {
      display: flex !important;
      flex-wrap: wrap !important;
      align-items: center !important;
      gap: 4px 8px !important;
      margin: 0 0 8px !important;
    }
  }

  @media (max-width: 1100px) {
    body.hg-checkout-page-active {
      --hg-checkout-crumb-nav-height: 64px;
    }
  }

  @media (max-width: 768px) {
    body.hg-checkout-page-active .wc-block-checkout.is-large .wc-block-components-sidebar > .wp-block-woocommerce-checkout-order-summary-block {
      display: block !important;
    }
  }
}