/* Checkout page mobile overrides - scoped to avoid affecting landing */

@media (max-width: 768px) {
  #checkout-pricing-section {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden;
    box-sizing: border-box;
  }

  #checkout-pricing-section .pricing-container {
    padding: 24px 16px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  #checkout-pricing-section .pricing-main-container {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  #checkout-pricing-section .pricing-details-col {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  #checkout-pricing-section h1 {
    font-size: 50px !important;
    line-height: 1.2 !important;
    margin-bottom: 24px !important;
    word-wrap: break-word;
    overflow-wrap: break-word;
    max-width: 100%;
  }

  #checkout-pricing-section .pricing-card {
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  #checkout-pricing-section .pricing-toggle-container {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  #checkout-pricing-section .pricing-cta-button {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Allow price row and billing text to wrap / stay within width */
  #checkout-pricing-section [id="checkout-price-display"] {
    flex-wrap: wrap !important;
    justify-content: center !important;
    max-width: 100%;
  }

  /* Smaller strikethrough and (CAD/month) so they fit inside the card on mobile */
  #checkout-pricing-section .checkout-price-strikethrough {
    font-size: 16px !important;
  }

  #checkout-pricing-section [id="checkout-price-display"] span:last-child {
    font-size: 14px !important;
  }

  #checkout-pricing-section [id="checkout-trial-info"],
  #checkout-pricing-section .pricing-card p {
    max-width: 100% !important;
    overflow-wrap: break-word;
  }

  #checkout-pricing-section .checkout-testimonial-card {
    max-width: 100% !important;
    margin-left: 16px !important;
    margin-right: 16px !important;
  }

  #checkout-pricing-section .checkout-trust-section {
    padding: 0 16px;
  }
}