/*
 * Ecommerce Pause (lead-gen) styling. Scoped to the .ecommerce-paused body
 * class, which is only present while the pause is enabled, so these rules are
 * inert otherwise.
 */

/* Remove product price everywhere (product view, category list, search). */
.ecommerce-paused .price-box,
.ecommerce-paused .product-info-main .price-box,
.ecommerce-paused .product-info-price .price-box,
.ecommerce-paused .product-item .price-box,
.ecommerce-paused .old-price,
.ecommerce-paused .special-price,
.ecommerce-paused .price-container {
    display: none !important;
}

/*
 * Hide the Epicor stock/availability line. It renders as
 * <p class="availability in-stock|out-of-stock">, whereas the Request-Quote
 * message is a <div class="availability"> (kept), so scoping to p.availability
 * removes the stock line without touching the message.
 */
.ecommerce-paused p.availability {
    display: none !important;
}

/*
 * Single-product pages: hide the qty field and the add-to-cart button.
 *
 * Epicor's "Disable Functionality" config removes price and the stock line for
 * these customer types but does NOT remove the cart controls here, so the Qty
 * input and "Add to Cart" button stayed visible on normal (non-table) product
 * pages. Ordering was already impossible (cart/checkout redirect to the
 * homepage), but the controls were misleading.
 *
 * Target .field.qty and .actions INSIDE .box-tocart rather than .box-tocart
 * itself: the Request-a-Quote message is a <div class="availability"> that
 * lives inside .box-tocart, so hiding the whole container would remove the
 * message along with the button.
 */
.ecommerce-paused .box-tocart .field.qty,
.ecommerce-paused .box-tocart .actions {
    display: none !important;
}

/*
 * Table-view (series) products render add-to-cart + qty through a "qop" path
 * that doesn't honor the native cart disable: per-row .field.qty.box-tocart
 * cells and a bulk #add_all_to_basket_header button. Hide them. The triple
 * class .field.qty.box-tocart is table-specific, so single-product pages
 * (which use .box-tocart alone) are unaffected.
 */
.ecommerce-paused .field.qty.box-tocart,
.ecommerce-paused .bulk-all-add,
.ecommerce-paused .btn-qop,
.ecommerce-paused #link-add-to-cart,
.ecommerce-paused .link-add-to-cart,
.ecommerce-paused .kbmax-addtocart {
    display: none !important;
}

/*
 * Request-Quote message copy: grey body text, keeping the inline-blue
 * "Request a Quote" span. No !important, so the span's inline color wins.
 * The message is a <div class="availability"> (the stock line above is a
 * <p class="availability">, hidden), so this only styles the message.
 */
/*
 * No padding-top here. It used to be 15px to separate the message from the
 * add-to-cart button above it, but the qty field and button are now hidden
 * (see the .box-tocart rule above), so that padding became dead space sitting
 * directly under the Product Code line. Removing it puts the message on the
 * same rhythm as the other stacked lines (gap 21px -> 6px).
 */
.ecommerce-paused .add-to-box .availability,
.ecommerce-paused .add-to-box .availability p {
    color: #666666;
    font-weight: normal;
}
/* "Request a Quote" stays bold and matches the Product Code blue (#00aeef).
   !important overrides the inline color on the span. */
.ecommerce-paused .add-to-box .availability strong {
    font-weight: 700;
}
.ecommerce-paused .add-to-box .availability strong span,
.ecommerce-paused .add-to-box .availability span {
    color: #00aeef !important;
}

/*
 * Logo sized to match the CMS site header (www.industrialspec.com), which is a
 * separate codebase. Aaron's "max-width 140px" is applied there to the <a>
 * wrapper, which is border-box with padding-left:10px, so the CMS image itself
 * renders at 130px (measured: 130 x 74.5). Mirror that structure here: cap the
 * container at 140px and the image at 130px, so both headers match exactly.
 * Capping the image at 140px instead made the shop logo ~7.7% larger than CMS.
 *
 * The logo is a flex container fixed at 175px with the tagline (.header-text)
 * beside it; shrinking only the img leaves the container wide and the tagline
 * overlaps. So shrink the container too, letting the tagline reflow.
 */
@media (min-width: 769px), print {
    .ecommerce-paused .header .logo {
        width: auto;
        max-width: 140px;
    }
    .ecommerce-paused .header .logo img {
        max-width: 130px !important;
        height: auto;
    }
}

/*
 * Cart icon removed: the header search reserved 65px of right margin for the
 * cart. Drop that margin so the search fills the gap on the right. Matches the
 * theme's own desktop breakpoint. Extra .ecommerce-paused specificity wins
 * without !important.
 */
@media (min-width: 769px), print {
    .ecommerce-paused .header .header-data-wrapper .block-search {
        margin-right: -5px;
    }
}