/* YCW Portal RC11 (2026-10-09)
   Mobile product category side gutters only. Desktop/tablet unchanged.
   Preserve the dynamic catalogue grid, products, prices, and order controls. */
@media (max-width: 767px) {
  #order-ycw-of.ycw-products-page {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-inline: 16px !important;
  }

  /* Bootstrap's negative row margins must not cancel the new gutters. */
  #order-ycw-of.ycw-products-page > .row {
    margin-inline: 0 !important;
  }

  #order-ycw-of.ycw-products-page > .row > .cart-body {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding-inline: 0 !important;
    margin-inline: 0 !important;
  }

  #order-ycw-of.ycw-products-page .ycw-responsive-catalog,
  #order-ycw-of.ycw-products-page .ycw-responsive-catalog > .row.row-eq-height {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-inline: 0 !important;
  }
}

/* RC18 mobile checkout and cart review side gutters.
   Keep WHMCS form behaviour, internal Bootstrap grids and desktop layout intact.
   The RC3 rule #order-ycw-of > .row > .cart-body removes inner padding: 
   gutters therefore belong on the outer orderform, not .cart-body. */
@media (max-width: 767px) {
  #order-ycw-of.ycw-checkout-page,
  #order-ycw-of.ycw-cart-review-page {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding-inline: 16px !important;
  }

  /* Legacy WHMCS header styles float h1 left; clear it so the account
     panel cannot squeeze into a narrow strip beside the title. */
  #order-ycw-of.ycw-checkout-page .header-lined h1,
  #order-ycw-of.ycw-cart-review-page .header-lined h1 {
    float: none !important;
  }

  /* Neutralise only the outer Bootstrap row's negative gutters. */
  #order-ycw-of.ycw-checkout-page > .row,
  #order-ycw-of.ycw-cart-review-page > .row {
    margin-inline: 0 !important;
  }

  #order-ycw-of.ycw-checkout-page > .row > .cart-body,
  #order-ycw-of.ycw-cart-review-page > .row > .cart-body {
    box-sizing: border-box !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-inline: 0 !important;
    padding-inline: 0 !important;
  }

  /* The basket review adds a second direct Bootstrap row. */
  #order-ycw-of.ycw-cart-review-page > .row > .cart-body > .row {
    margin-inline: 0 !important;
  }
  #order-ycw-of.ycw-cart-review-page .secondary-cart-body {
    box-sizing: border-box !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding-inline: 0 !important;
  }
  #order-ycw-of.ycw-cart-review-page .secondary-cart-sidebar {
    box-sizing: border-box !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  #order-ycw-of.ycw-checkout-page #frmCheckout,
  #order-ycw-of.ycw-checkout-page .ycw-checkout-payment-layout,
  #order-ycw-of.ycw-checkout-page .ycw-checkout-summary-card {
    max-width: 100%;
    min-width: 0;
  }
}

/* RC19 mobile configure-domains gutters (cart.php?a=confdomains).
   Scope to this single WHMCS order step; leave checkout, product pages
   and all native domain form controls and actions intact. */
@media (max-width: 767px) {
  #order-ycw-of.ycw-domain-config-page {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding-inline: 16px !important;
  }

  #order-ycw-of.ycw-domain-config-page > .row {
    margin-inline: 0 !important;
  }

  #order-ycw-of.ycw-domain-config-page > .row > .cart-body {
    box-sizing: border-box !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-inline: 0 !important;
    padding-inline: 0 !important;
  }

  /* WHMCS legacy h1 uses float:left, which can force the intro beside it. */
  #order-ycw-of.ycw-domain-config-page .header-lined h1 {
    float: none !important;
  }

  /* Keep inner Bootstrap rows within the outer mobile gutters. */
  #order-ycw-of.ycw-domain-config-page #frmConfigureDomains {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }
  #order-ycw-of.ycw-domain-config-page #frmConfigureDomains > .row,
  #order-ycw-of.ycw-domain-config-page #frmConfigureDomains > .form-group.row {
    margin-inline: 0 !important;
  }
  #order-ycw-of.ycw-domain-config-page #frmConfigureDomains .wdes-product-heading-options {
    overflow-wrap: anywhere;
  }
  #order-ycw-of.ycw-domain-config-page #frmConfigureDomains .field,
  #order-ycw-of.ycw-domain-config-page #frmConfigureDomains .form-control {
    box-sizing: border-box;
    max-width: 100%;
    min-width: 0;
  }
}