/* =============================================================================
   NGK Integrations — CSS Fixes
   =============================================================================

/* -----------------------------------------------------------------------------
   FIX 6: Competitor A / B search fields — rendered below FE filter widget.
   Styled to match Filter Everything's built-in Part Number search field.
   ----------------------------------------------------------------------------- */
.ngk-comp-search {
    padding: 0 0px 10px;
}

/* -----------------------------------------------------------------------------
   FIX: Hide quantity input inside WPT tables on archive/category pages.
   Only the Add to Cart button is needed — no quantity selector.
   ----------------------------------------------------------------------------- */
.wpt-wrap .quantity,
.wpt-wrap .wpt_qty_field,
.wpt-wrap .wpt_quantity_wrap,
.wpt-wrap input[type="number"].qty,
.wpt-wrap input.qty,
.wpt-wrap .wpt_product_title_item .quantity {
    display: none !important;
}

/* Hide WPT "Add to Cart All Selected" button and select-all checkboxes */
.wpt-wrap .add_to_cart_all_selected,
.wpt-wrap .all_check_header_footer {
    display: none !important;
}

/* Keep the add-to-cart button itself full-width when quantity is hidden */
.wpt-wrap .wpt_product_title_item .single_add_to_cart_button,
.wpt-wrap .wpt_product_title_item .wpt_woo_add_cart_button {
    width: auto !important;
    margin-left: 0 !important;
}

/* -----------------------------------------------------------------------------
   FIX 10 CSS: Hide WooCommerce Add to Cart form inside WPT tables.

   WHY: "Add to Quote" (ELEX) is the primary CTA on category pages. The WC
        add-to-cart form (button, quantity, Blocksy .ct-cart-actions wrapper)
        is unnecessary. PHP hooks remove it on initial page load, but WPT
        AJAX pagination re-renders the full form. CSS catches both cases.
   ----------------------------------------------------------------------------- */
.wpt-wrap .ct-cart-actions,
.wpt-wrap .wpt_woo_add_cart_button,
.wpt-wrap a.add_to_cart_button,
.wpt-wrap .single_add_to_cart_button,
.wpt-wrap .wpt_product_title_item .wpt_woo_add_cart_button,
.wpt-wrap td .wpt_woo_add_cart_button {
    display: none !important;
}

/* -----------------------------------------------------------------------------
   FIX: WPT Pagination — force visible inside Elementor widget wrapper.

   WHY: Elementor wraps WPT in .wpt-elementor-wrapper. Some Elementor theme
        or plugin CSS can set overflow:hidden or hide child pagination divs
        in certain flex/grid containers. Force the pagination block to show.
   ----------------------------------------------------------------------------- */
.wpt-elementor-wrapper .wpt_my_pagination,
.wpt-elementor-wrapper .wpt_pagination_ajax .wpt_my_pagination,
.productTablesWrapper .wpt_my_pagination,
.wpt-wrap .wpt_my_pagination {
    display: block !important;
    visibility: visible !important;
    overflow: visible !important;
}

/* Ensure the outer wrapper doesn't clip the pagination */
.wpt-elementor-wrapper,
.wpt-elementor-wrapper .wpt-wrap,
.productTablesWrapper {
    overflow: visible !important;
}

/* -----------------------------------------------------------------------------
   FIX: Pagination links — ensure they are clickable and have pointer cursor.
   ----------------------------------------------------------------------------- */
.wpt-wrap .wpt_my_pagination a,
.wpt-wrap .wpt_my_pagination span {
    display: inline-block !important;
    cursor: pointer !important;
    pointer-events: auto !important;
}

/* -----------------------------------------------------------------------------
   FIX: Filter Everything loader overlay — ensure it covers the table, not
        just the old (non-existent) .productTablesWrapper element.
        Now that WPT emits .productTablesWrapper on its own wrapper, the
        loader should position correctly, but add a fallback.
   ----------------------------------------------------------------------------- */
.wpt-wrap.productTablesWrapper {
    position: relative; /* allows FE's absolute-positioned loader to anchor here */
}


/* -----------------------------------------------------------------------------
   FIX 9: ELEX Request a Quote — hide product images.

   Quote list page: ShowImage returns '' when product_image=false (option updated),
   but the .elex-raq-icon wrapper div still renders and takes space via Bootstrap
   ratio classes. Collapse it entirely.

   Popup widget: mini_quote_contents.js renders <img> unconditionally — no
   setting controls it. Hide via CSS.
   ----------------------------------------------------------------------------- */

/* Quote list page */
#elex_quote_list_page_div .elex-raq-icon {
    display: none !important;
}

/* -----------------------------------------------------------------------------
   FIX 9d: Quote list page — disable product title links.

   WHY: ELEX renders product titles as <a href="{permalink}"> on the quote
        list page (/add-to-quote-product-list/). Business requirement: users
        should stay on the quote list, not navigate away to product pages.
        Disable via CSS so ELEX's React code is untouched.
   ----------------------------------------------------------------------------- */
#elex_quote_list_page_div .col-md-5 a,
#elex_quote_list_page_div .col-xl-5 a {
    pointer-events: none !important;
    cursor: default !important;
    color: inherit !important;
    text-decoration: none !important;
}

/* Mini-quote popup (hover dropdown on floating widget) */
.elex-raq-view-quote-dropdown .elex-raq-icon {
    display: none !important;
}

/* Widen the popup so product names have room once images are hidden */
.elex-rqst-quote-front-wrap .elex-raq-view-quote-dropdown-btn .elex-raq-view-quote-dropdown {
    width: 280px !important;
}
.elex-rqst-quote-front-wrap .elex-raq-view-quote-dropdown-btn:hover .elex-raq-view-quote-dropdown {
    width: 220px !important;
}
#elex-rqst-float-minicart-icon.elex-rqst-mini-qote-list-wrap {
bottom: 10px !important;
right: 88px !important;
}

.miniquote-content > div {
  display: flex;
  width: 190px;
  justify-content: space-between;
}
.elex-rqst-quote-front-wrap .miniquote-content .remove_product{
top: -5px;
}

/* Ensure product title is visible in mini-quote popup (image is hidden) */
.elex-raq-view-quote-dropdown .miniquote-content {
    padding-left: 25px !important; /* space for the absolute-positioned delete icon */
}
.elex-raq-view-quote-dropdown .miniquote-content h6 {
    margin: 0 !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
    white-space: normal !important;
    word-break: break-word !important;
    display: block !important;
    visibility: visible !important;
    color: #333 !important;
}
.elex-raq-view-quote-dropdown .miniquote-content h6 small {
    font-size: inherit !important;
    display: inline !important;
    visibility: visible !important;
    color: inherit !important;
}
.elex-raq-view-quote-dropdown .miniquote-content .raq-fxs {
    font-size: 12px !important;
    color: #666 !important;
}

/* -----------------------------------------------------------------------------
   FIX 17: Catalog column action buttons — View PDF, Add to Quote, View Quote
   List as consistent pill buttons (client spec). Stacked vertically in the
   product-title cell: View PDF on top, ELEX buttons below.

   View PDF is injected directly into .wpt_product_title (NOT inside ELEX's
   toggle-able container), so it remains visible after Add to Quote click.
   ----------------------------------------------------------------------------- */

/* Neutralise ELEX's wrappers: .add_view_quote_btn ships with Bootstrap
   .d-flex.justify-content-center which centers the Add to Quote button.
   Flatten to plain block + left-aligned so it matches View PDF's layout.
   Same for the .w-100 / <a> wrappers around View Quote List. */
.wpt-wrap .wpt_product_title .add_view_quote_btn,
.wpt-wrap .wpt_product_title .elex-rqst-quote-front-wrap .w-100,
.wpt-wrap .wpt_product_title .elex-rqst-quote-front-wrap .w-100 > a {
    display: block !important;
    width: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 0 !important;
    justify-content: flex-start !important;
    text-align: left !important;
    text-decoration: none !important;
}

/* Common pill style — identical padding, height, and font on all three.
   !important wins over Bootstrap's .btn-sm / .btn-primary / .my-2 / .rounded-2,
   WooCommerce's .button, WordPress's .wp-element-button, and ELEX's inline
   style="background-color:…". appearance:none kills browser native button
   chrome so <button> and <a> render at the same intrinsic size. */
.wpt-wrap .wpt_product_title .ngk-pdf-link,
.wpt-wrap .wpt_product_title button.add_to_quote,
.wpt-wrap .wpt_product_title button.elex-raq-view-quote-list-open-btn {
    appearance: none !important;
    -webkit-appearance: none !important;
    display: inline-block !important;
    width: 118px !important;
    min-width: 118px !important;
    max-width: 118px !important;
    height: 26px !important;
    min-height: 26px !important;
    max-height: 26px !important;
    padding: 4px 9px !important;
    margin: 2px 0 !important;
    border-radius: 16px !important;
    border: 1px solid transparent !important;
    outline: none !important;
    font-family: Arial, sans-serif !important;
    font-weight: 700 !important;
    font-size: 11px !important;
    line-height: 18px !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    text-transform: capitalize !important;
    box-sizing: border-box !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    box-shadow: none !important;
    text-decoration: none !important;
    background-image: none !important;
    background-repeat: no-repeat !important;
    transition: background-color 0.15s, color 0.15s;
}

/* View PDF — light blue */
.wpt-wrap .wpt_product_title .ngk-pdf-link {
    background-color: #366EFE1F !important;
    color: #366EFE !important;
}
.wpt-wrap .wpt_product_title .ngk-pdf-link:hover,
.wpt-wrap .wpt_product_title .ngk-pdf-link:focus {
    background-color: #366EFE !important;
    color: #fff !important;
}

/* Add to Quote + View Quote List — light teal */
.wpt-wrap .wpt_product_title button.add_to_quote,
.wpt-wrap .wpt_product_title button.elex-raq-view-quote-list-open-btn {
    background-color: #0075C21F !important;
    color: #0075C2 !important;
}
.wpt-wrap .wpt_product_title button.add_to_quote:hover,
.wpt-wrap .wpt_product_title button.add_to_quote:focus,
.wpt-wrap .wpt_product_title button.elex-raq-view-quote-list-open-btn:hover,
.wpt-wrap .wpt_product_title button.elex-raq-view-quote-list-open-btn:focus {
    background-color: #0075C2 !important;
    color: #fff !important;
}

/* -----------------------------------------------------------------------------
   FIX 12: Force Select2 filter dropdowns to always open downward.

   WHY: Select2 flips the dropdown above the field when it thinks there
        isn't enough space below.  The upward popup overlaps other fields
        and spills outside the filter widget container.  Force downward
        and let the scroll container handle overflow.
   ----------------------------------------------------------------------------- */
.wpc-filters-main-wrap .select2-container--open .select2-dropdown--above {
    top: 100% !important;
    bottom: auto !important;
}
.wpc-filters-main-wrap .select2-container--above .select2-selection {
    border-radius: 4px 4px 0 0 !important;
}
.wpc-filters-scroll-container {
    overflow: visible !important;
}

/* -----------------------------------------------------------------------------
   FIX 11: Hide "Reset all" chip — redundant with the Reset button below filters.
   ----------------------------------------------------------------------------- */
.wpc-filter-chips-list .wpc-chip-reset-all {
    display: none !important;
}

/* -----------------------------------------------------------------------------
   FIX 25: Remove WPT column sort arrows + click-to-sort on all product tables.
   WPT renders sort arrows via ::before/::after pseudo-elements on .wpt-th-tag
   inside a .wpt_column_sort wrapper, and binds a click handler to the same
   selector. Hiding the pseudo-elements alone would still leave the column
   header clickable (changing data-sort_type, applying this_column_sorted),
   which would silently re-sort the table after our FIX 23/24 ORDER BY runs.
   We hide the icons AND disable pointer events to keep the visual + behavior
   consistent across every category and shortcode-rendered WPT table.
   ----------------------------------------------------------------------------- */
div.wpt_column_sort #wpt_table.wpt-table-tag.wpt_product_table > .wpt-thead-tag > .wpt-tr-tag > .wpt-th-tag::before,
div.wpt_column_sort #wpt_table.wpt-table-tag.wpt_product_table > .wpt-thead-tag > .wpt-tr-tag > .wpt-th-tag::after {
    content: none !important;
    display: none !important;
}
div.wpt_column_sort #wpt_table.wpt-table-tag.wpt_product_table > .wpt-thead-tag > .wpt-tr-tag > .wpt-th-tag {
    cursor: default !important;
    pointer-events: none !important;
}