/**
 * Custodi — Shop, Cart & Checkout CSS
 * Version: v1 (refactored from custodi-shop-v42)
 *
 * Place in: wp-content/themes/Avada-Child-Theme/custodi-shop.css
 *
 * Scope: WooCommerce shop archive, category/tag archives,
 *        cart page, checkout page, thank you page.
 *
 * NOT for: single product pages (custodi-product.css)
 *          solutions pages    (custodi-solutions.css)
 *          brand pages        (custodi-brands.css)
 */

/**
 * Custodi Shop Page Redesign — CSS
 * Version: v40
 *
 * Place in: wp-content/themes/Avada-Child-Theme/custodi-shop.css
 *
 * Styles WooCommerce's native product loop output on:
 *   - /shop/ (main shop page)
 *   - /product-category/* (category archives)
 *   - /product-tag/* (tag archives)
 *   - ?s= product search results
 *
 * Uses Custodi brand tokens from Avada Global Options.
 * Requires: WooCommerce display mode (not Avada postcards)
 */


/* =================================================================
   HEADER — Do NOT touch, let Avada's native header render
   Same approach as cart/checkout pages which work correctly
   ================================================================= */

/* Unset any forced backgrounds so Avada's Theme Options header shows through */
body.post-type-archive-product .fusion-header-wrapper,
body.post-type-archive-product .fusion-header,
body.post-type-archive-product .fusion-logo,
body.post-type-archive-product .fusion-main-menu,
body.post-type-archive-product .fusion-secondary-header,
body.post-type-archive-product .fusion-header-v1,
body.post-type-archive-product .fusion-header-v2,
body.post-type-archive-product .fusion-header-v3,
body.post-type-archive-product .fusion-sticky-header-wrapper,
body.post-type-archive-product .fusion-tb-header,
body.post-type-archive-product .avada-header-top,
body.tax-product_cat .fusion-header-wrapper,
body.tax-product_cat .fusion-header,
body.tax-product_cat .fusion-logo,
body.tax-product_cat .fusion-main-menu,
body.tax-product_cat .fusion-secondary-header,
body.tax-product_cat .fusion-sticky-header-wrapper,
body.tax-product_cat .fusion-tb-header,
body.tax-product_cat .avada-header-top,
body.tax-product_tag .fusion-header-wrapper,
body.tax-product_tag .fusion-header,
body.tax-product_tag .fusion-sticky-header-wrapper,
body.tax-product_tag .fusion-tb-header,
body.tax-product_tag .avada-header-top {
    background-color: unset !important;
    background: unset !important;
}

/* v94m: Header content full-width on shop pages — broader/stronger override.
   Avada uses .fusion-tb-header with .fusion-builder-row inside, plus .fusion-row.
   Target every layer that could constrain width, including the builder rows. */
body.post-type-archive-product .fusion-header > .fusion-row,
body.post-type-archive-product .fusion-tb-header > .fusion-row,
body.post-type-archive-product .fusion-tb-header .fusion-row,
body.post-type-archive-product .fusion-tb-header .fusion-builder-row,
body.post-type-archive-product .fusion-tb-header .fusion-builder-row-inner,
body.post-type-archive-product .fusion-sticky-header-wrapper .fusion-row,
body.post-type-archive-product .fusion-sticky-header-wrapper .fusion-builder-row,
body.tax-product_cat .fusion-header > .fusion-row,
body.tax-product_cat .fusion-tb-header .fusion-row,
body.tax-product_cat .fusion-tb-header .fusion-builder-row,
body.tax-product_cat .fusion-sticky-header-wrapper .fusion-row,
body.tax-product_tag .fusion-header > .fusion-row,
body.tax-product_tag .fusion-tb-header .fusion-row,
body.tax-product_tag .fusion-tb-header .fusion-builder-row,
body.tax-product_tag .fusion-sticky-header-wrapper .fusion-row,
body.tax-solution .fusion-tb-header .fusion-row,
body.tax-solution .fusion-tb-header .fusion-builder-row,
body.tax-use_case .fusion-tb-header .fusion-row,
body.tax-use_case .fusion-tb-header .fusion-builder-row,
body.tax-device_type .fusion-tb-header .fusion-row,
body.tax-device_type .fusion-tb-header .fusion-builder-row {
    max-width: none !important;
    width: 100% !important;
    padding-left: 32px !important;
    padding-right: 32px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

/* Hide description text that leaks from Avada page content */
body.post-type-archive-product .fusion-fullwidth .fusion-builder-row .fusion-text,
body.post-type-archive-product .woocommerce-products-header__description,
body.post-type-archive-product .term-description,
body.post-type-archive-product .page-description {
    display: none !important;
}

/* Hide Uncategorised from sidebar */
#custodiShopSidebar .cat-item a[href*="uncategorised"],
#custodiShopSidebar .cat-item a[href*="uncategorized"] {
    display: none !important;
}


/* =================================================================
   CSS VARIABLES — Custodi Brand Tokens
   ================================================================= */
:root {
    --custodi-blue: #00C4E8;
    --custodi-blue-dark: #0088AA;
    --headings-colour: #3A4045;
    --body-font-color: #3A4045;
    --content-background: #f4f3f1;
    --header-background: #2B3237;
    --border-color: #B8B3AD;
    --cool-light-sand: #EBE9E6;
    --cool-slate: #6B7780;
    --pure-white: #ffffff;
    --cool-teal-success: #5BA8A0;
    --muted-coral-alert: #C4846B;
    --cool-blue-grey: #C2D4DB;
    --font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-mono: 'JetBrains Mono', 'SF Mono', monospace;
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 14px;
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
    --shadow-md: 0 4px 16px rgba(0,0,0,0.08);
}


/* =================================================================
   AVADA OVERRIDES — Break out of Avada's container constraints
   ================================================================= */

/* Force full-width content area — scoped to avoid header */
body.post-type-archive-product #main > .fusion-row,
body.post-type-archive-product #content .fusion-row,
body.tax-product_cat #main > .fusion-row,
body.tax-product_cat #content .fusion-row,
body.tax-product_tag #main > .fusion-row,
body.tax-product_tag #content .fusion-row,
body.archive.woocommerce #main > .fusion-row,
body.archive.woocommerce #content .fusion-row {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

/* Kill Avada's default shop backgrounds — content area only, not header */
body.post-type-archive-product #main .fusion-fullwidth,
body.post-type-archive-product #content .fusion-fullwidth,
body.tax-product_cat #main .fusion-fullwidth,
body.tax-product_cat #content .fusion-fullwidth,
body.tax-product_tag #main .fusion-fullwidth,
body.tax-product_tag #content .fusion-fullwidth,
body.archive.woocommerce #main .fusion-fullwidth,
body.archive.woocommerce #content .fusion-fullwidth {
    background: transparent !important;
    padding: 0 !important;
}

/* Kill Avada column constraints — content area only */
body.post-type-archive-product #main .fusion-layout-column,
body.post-type-archive-product #main .fusion-column-wrapper,
body.tax-product_cat #main .fusion-layout-column,
body.tax-product_cat #main .fusion-column-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
}

/* Override Avada's woocommerce-content-box */
body.post-type-archive-product .woocommerce-content-box,
body.tax-product_cat .woocommerce-content-box,
body.tax-product_tag .woocommerce-content-box {
    background: transparent !important;
    padding: 0 !important;
    border: none !important;
}

/* Kill Avada's product grid styling — we'll handle it */
body.post-type-archive-product .fusion-woocommerce-container,
body.tax-product_cat .fusion-woocommerce-container,
body.tax-product_tag .fusion-woocommerce-container {
    margin: 0 !important;
    padding: 0 !important;
}

/* Hide Avada's injected headings */
body.post-type-archive-product .woocommerce-content-box > h2:not(.custodi-shop-title),
body.tax-product_cat .woocommerce-content-box > h2:not(.custodi-shop-title) {
    display: none !important;
}

/* Kill Avada's page title bar — we have our own */
body.post-type-archive-product .fusion-page-title-bar,
body.tax-product_cat .fusion-page-title-bar,
body.tax-product_tag .fusion-page-title-bar {
    display: none !important;
}

/* v95f: Remove light bar above shop hero.
   Avada's content wrapper leaves top padding/margin that shows as a
   light strip between header and dark hero. Strip on all shop archives. */
body.post-type-archive-product #main,
body.tax-product_cat #main,
body.tax-product_tag #main,
body.tax-solution #main,
body.tax-use_case #main,
body.tax-device_type #main,
body.post-type-archive-product .fusion-content-wrapper,
body.tax-product_cat .fusion-content-wrapper,
body.tax-product_tag .fusion-content-wrapper,
body.post-type-archive-product .fusion-row,
body.tax-product_cat .fusion-row {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

body.post-type-archive-product #content,
body.tax-product_cat #content,
body.tax-product_tag #content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* v95l: Additional targets — the light strip is likely an Avada page
   titlebar wrapper or header offset. Nuke every candidate wrapper
   on shop archive pages. */
body.post-type-archive-product .avada-page-titlebar-wrapper,
body.post-type-archive-product .fusion-page-title-bar-wrapper,
body.post-type-archive-product .fusion-header-wrapper + *,
body.tax-product_cat .avada-page-titlebar-wrapper,
body.tax-product_cat .fusion-page-title-bar-wrapper,
body.tax-product_tag .avada-page-titlebar-wrapper,
body.tax-product_tag .fusion-page-title-bar-wrapper {
    display: none !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
}

body.post-type-archive-product .fusion-header-wrapper,
body.tax-product_cat .fusion-header-wrapper,
body.tax-product_tag .fusion-header-wrapper {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
}

body.post-type-archive-product .fusion-wrapper,
body.post-type-archive-product .fusion-body,
body.tax-product_cat .fusion-wrapper,
body.tax-product_cat .fusion-body,
body.tax-product_tag .fusion-wrapper,
body.tax-product_tag .fusion-body {
    padding-top: 0 !important;
    margin-top: 0 !important;
    background: transparent !important;
}

/* v95m: DevTools confirmed #main has padding-top: 150px on the shop page.
   Body classes aren't the WC standard ones (custom template renders shop),
   so target #main via :has() — kills the top padding only when the shop
   hero / topbar / browse-tabs is present. Bottom padding retained. */
main#main:has(.custodi-shop-hero),
main#main:has(.custodi-shop-topbar),
main#main:has(.custodi-browse-tabs-bar),
main#main:has(.custodi-shop-products) {
    padding-top: 0 !important;
    margin-top: 0 !important;
}


/* =================================================================
   BROWSE TABS — By Device / By Brand / By Solution
   v94k: Sticky on scroll, sits below the Avada header.
   ================================================================= */
.custodi-browse-tabs-bar {
    background: var(--pure-white);
    border-bottom: 1px solid var(--cool-light-sand);
    margin-bottom: 0;
    padding: 10px 0;           /* v94q: vertical breathing room for the bar */
    position: sticky;
    top: 80px;          /* sits below the sticky/compact header */
    z-index: 100;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    /* v94p: Full-bleed band — background extends full viewport width.
       Inner content (.custodi-browse-tabs-row) stays at 1200px centered. */
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

/* Tabs row — flex container holding tabs on left, search on right */
.custodi-browse-tabs-row {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 20px;
}

.custodi-browse-tabs {
    max-width: 1200px;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    flex: 1;
}
.custodi-browse-tabs::-webkit-scrollbar { display: none; }

.custodi-browse-tab {
    padding: 14px 24px;
    font-size: 13px;
    font-weight: 600;
    color: var(--cool-slate);
    text-decoration: none !important;
    border-bottom: 2px solid transparent;
    transition: all 0.2s;
    white-space: nowrap;
    flex-shrink: 0;
}
.custodi-browse-tab:hover {
    color: var(--headings-colour);
    background: rgba(0,136,170,0.03);
    text-decoration: none !important;
}
.custodi-browse-tab.active {
    color: var(--custodi-blue-dark);
    border-bottom-color: var(--custodi-blue-dark);
}

.custodi-browse-tab .tab-count {
    font-size: 10px;
    background: var(--cool-light-sand);
    color: var(--cool-slate);
    padding: 1px 6px;
    border-radius: 10px;
    margin-left: 6px;
    font-weight: 700;
}
.custodi-browse-tab.active .tab-count {
    background: rgba(0,136,170,0.1);
    color: var(--custodi-blue-dark);
}

/* Disabled tabs — coming soon */
.custodi-browse-tab.disabled {
    color: #B8B3AD;
    cursor: default;
    pointer-events: none;
}
.custodi-browse-tab.disabled:hover {
    background: transparent;
    color: #B8B3AD;
}

/* v94i: Button styling — the dropdown trigger tabs render as <button>
   so we strip the default button look and inherit the .custodi-browse-tab styles */
button.custodi-browse-tab,
button.custodi-tab-trigger {
    background: transparent;
    border: none;
    cursor: pointer;
    font-family: inherit;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
}
button.custodi-browse-tab:focus,
button.custodi-tab-trigger:focus {
    outline: none;
}
button.custodi-browse-tab:focus-visible,
button.custodi-tab-trigger:focus-visible {
    outline: 2px solid var(--custodi-blue-dark);
    outline-offset: -2px;
}

/* Chevron arrow on dropdown triggers */
.custodi-tab-chevron {
    font-size: 9px;
    opacity: 0.6;
    transition: transform 0.2s ease;
    line-height: 1;
}
.custodi-tab-trigger[aria-expanded="true"] .custodi-tab-chevron {
    transform: rotate(180deg);
    opacity: 1;
    color: var(--custodi-blue-dark);
}
.custodi-tab-trigger[aria-expanded="true"] {
    color: var(--custodi-blue-dark);
    background: rgba(0,136,170,0.04);
}


/* =================================================================
   PRODUCT SEARCH — Inline with browse tabs (v94k)
   ================================================================= */

.custodi-shop-search {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    gap: 0;
    position: relative;
}

.custodi-shop-search-input {
    width: 240px;
    height: 38px;
    padding: 0 40px 0 14px;
    border: 1px solid var(--cool-light-sand);
    border-radius: 6px;
    background: #ffffff;
    color: var(--headings-colour);
    font-family: var(--font-body);
    font-size: 13px;
    transition: border-color 0.15s, box-shadow 0.15s;
    align-self: center;
    margin: 0;
    box-sizing: border-box;
}

.custodi-shop-search-input::placeholder {
    color: var(--cool-slate);
    opacity: 0.7;
}

.custodi-shop-search-input:focus {
    outline: none;
    border-color: var(--custodi-blue-dark);
    box-shadow: 0 0 0 3px rgba(0, 136, 170, 0.12);
}

.custodi-shop-search-btn {
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    padding: 0;
    background: transparent;
    border: none;
    color: var(--cool-slate);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    transition: color 0.15s;
}

.custodi-shop-search-btn:hover {
    color: var(--custodi-blue-dark);
}

.custodi-shop-search-btn svg {
    width: 16px;
    height: 16px;
    stroke: currentColor;
    fill: none;
    stroke-width: 2;
}


/* =================================================================
   BROWSE TABS DROPDOWN PANELS (v94i)
   ================================================================= */

.custodi-browse-dropdown {
    background: var(--pure-white);
    border-top: 1px solid var(--cool-light-sand);
    border-bottom: 1px solid var(--cool-light-sand);
    box-shadow: 0 8px 24px rgba(0,0,0,0.06);
    padding: 24px 20px;
    animation: customBrowseDropdownIn 0.18s ease-out;
}

.custodi-browse-dropdown[hidden] {
    display: none !important;
}

@keyframes customBrowseDropdownIn {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

.custodi-browse-dropdown-grid {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 8px;
}

.custodi-browse-dropdown-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 11px 14px;
    background: var(--pure-white);
    border: 1px solid var(--cool-light-sand);
    border-radius: 6px;
    text-decoration: none !important;
    color: var(--headings-colour);
    font-size: 13px;
    font-weight: 500;
    transition: all 0.15s ease;
    line-height: 1.3;
}

.custodi-browse-dropdown-link:hover {
    background: rgba(0,136,170,0.04);
    border-color: var(--custodi-blue-dark);
    color: var(--custodi-blue-dark);
    text-decoration: none !important;
    transform: translateY(-1px);
}

.custodi-browse-dropdown-link.active {
    background: var(--custodi-blue-dark);
    border-color: var(--custodi-blue-dark);
    color: var(--pure-white);
}
.custodi-browse-dropdown-link.active:hover {
    background: var(--header-background);
    border-color: var(--header-background);
}

.custodi-browse-dropdown-link .link-label {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.custodi-browse-dropdown-link .link-count {
    flex-shrink: 0;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 10px;
    background: var(--cool-light-sand);
    color: var(--cool-slate);
    min-width: 22px;
    text-align: center;
}

.custodi-browse-dropdown-link.active .link-count {
    background: rgba(255,255,255,0.2);
    color: var(--pure-white);
}

/* Mobile dropdown — single column, larger tap targets */
@media (max-width: 600px) {
    .custodi-browse-dropdown {
        padding: 14px 10px;
    }
    .custodi-browse-dropdown-grid {
        grid-template-columns: 1fr;
        gap: 6px;
    }
    .custodi-browse-dropdown-link {
        padding: 13px 14px;
        font-size: 14px;
    }
    .custodi-browse-dropdown-link .link-count {
        font-size: 12px;
        padding: 3px 9px;
    }
}


/* =================================================================
   SHOP HERO — Dark hero, sits behind Avada's transparent header
   The ~180px top padding clears the transparent header zone so the H1
   and lead start visibly below it. Dark gradient gives the header text
   the contrast it needs without forcing the header into solid mode.
   ================================================================= */
.custodi-shop-hero,
.custodi-shop-hero-dark {
    /* v94s: layered background — subtle Custodi cyan screen (top layer)
       over the existing dark gradient (bottom layer). The cyan adds a
       faint brand-blue wash to the hero. */
    background:
        linear-gradient(135deg, rgba(0, 196, 232, 0.06) 0%, rgba(0, 196, 232, 0.02) 100%),
        linear-gradient(135deg, #1a2025 0%, #2B3237 50%, #1f2629 100%);
    color: var(--pure-white);
    padding: 140px 0 72px;
    margin-bottom: 0;
    border-bottom: none;
    position: relative;
    overflow: hidden;
    /* v94p: Full-bleed band — extends full viewport width regardless of parent
       container padding (Avada .fusion-row constrains to ~1200px otherwise).
       Inner content (.custodi-shop-hero-inner) stays at 1200px centered. */
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

/* Grid pattern overlay — matches solutions/brand pages aesthetic.
   Two layered linear-gradients form a 24px grid in low-opacity white. */
.custodi-shop-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
    background-size: 24px 24px;
    background-position: -1px -1px;
    pointer-events: none;
    opacity: 0.9;
    z-index: 1;
    mask-image: linear-gradient(135deg, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.3) 70%, transparent 100%);
    -webkit-mask-image: linear-gradient(135deg, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.3) 70%, transparent 100%);
}

/* v94r: subtle emf-waves background image. Same asset as the homepage
   subscribe panel. Sits below the grid pattern and the text content.
   v94u: 30% Y position — anchors the antenna in the upper third of the
   hero. center top buried it at the bottom on short/wide hero shapes. */
.custodi-shop-hero::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image: url('https://custodi.co.nz/wp-content/uploads/2026/04/emf-waves.jpg');
    background-size: cover;
    background-position: center 30%;
    background-repeat: no-repeat;
    opacity: 0.10;
    mix-blend-mode: screen;
    pointer-events: none;
    z-index: 0;
}

.custodi-shop-hero-inner {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 32px;
}

.custodi-shop-hero-text {
    max-width: 720px;
}

/* Eyebrow — Custodi preamble pattern (cyan #00C4E8 on dark, 11px 800 uppercase 2px tracking) */
.custodi-shop-hero-eyebrow {
    font-size: 11px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    color: #00C4E8 !important;
    display: block !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
    line-height: 1 !important;
    font-style: normal !important;
}

/* H1 — matches cft-hero-h1 spec from preamble v6.3 */
.custodi-shop-hero h1 {
    font-size: clamp(36px, 4.5vw, 48px) !important;
    font-weight: 800 !important;
    color: var(--pure-white) !important;
    line-height: 1.1 !important;
    letter-spacing: -0.02em !important;
    margin: 0 0 16px !important;
    padding: 0 !important;
    font-style: normal !important;
}

/* Lead — matches cft-hero-sub spec (mist #C2D4DB, line-height 1.8) */
.custodi-shop-hero .custodi-shop-hero-lead {
    font-size: 17px !important;
    line-height: 1.8 !important;
    color: #C2D4DB !important;
    margin: 0 !important;
    padding: 0 !important;
    max-width: 640px;
    font-weight: 400 !important;
}

.custodi-shop-hero .woocommerce-result-count {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.6);
    margin: 12px 0 0 !important;
    padding: 0 !important;
}


/* =================================================================
   MAIN SHOP LAYOUT — Sidebar + Product Grid
   v94l: increased top padding for breathing room below sticky tabs
   ================================================================= */
.custodi-shop-layout {
    max-width: 1200px;
    margin: 0 auto;
    padding: 48px 20px 60px;
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 32px;
    align-items: start;
}


/* =================================================================
   SORTING DROPDOWN (WooCommerce native)
   ================================================================= */
.woocommerce-ordering {
    margin-bottom: 20px !important;
    display: flex;
    align-items: center;
    gap: 8px;
}

.woocommerce-ordering select.orderby {
    background: var(--cool-light-sand) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: var(--radius-sm) !important;
    padding: 8px 36px 8px 12px !important;
    font-family: var(--font-body) !important;
    font-size: 13px !important;
    color: var(--headings-colour) !important;
    cursor: pointer !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%230088AA' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 10px center !important;
}


/* =================================================================
   MOBILE FILTER TOGGLE
   ================================================================= */
.custodi-filter-toggle {
    display: none;
    width: 100%;
    padding: 12px 16px;
    background: var(--pure-white);
    border: 1px solid var(--cool-light-sand);
    border-radius: var(--radius-sm);
    font-family: var(--font-body);
    font-size: 13px;
    font-weight: 600;
    color: var(--headings-colour);
    cursor: pointer;
    margin-bottom: 16px;
    align-items: center;
    justify-content: center;
    gap: 8px;
}


/* =================================================================
   SIDEBAR — Filter Widgets
   v94q: sticky top offset set to 170px so the BY DEVICE widget
   stays visible below the sticky tabs bar (which now has 10px
   vertical padding for breathing room, total height ~70px,
   sitting at top:80px → ends at y=150 in viewport).
   ================================================================= */
.custodi-shop-sidebar {
    position: sticky;
    top: 170px;
}

/* Each widget becomes a filter section */
.custodi-shop-sidebar .widget {
    background: var(--pure-white);
    border: 1px solid var(--cool-light-sand);
    border-radius: var(--radius-md);
    margin-bottom: 16px;
    overflow: hidden;
}

/* Widget titles */
.custodi-shop-sidebar .widget > h2,
.custodi-shop-sidebar .widget > .widget-title,
.custodi-shop-sidebar .widget > h3,
.custodi-shop-sidebar .widgettitle {
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    color: var(--headings-colour) !important;
    padding: 14px 16px !important;
    margin: 0 !important;
    border-bottom: none !important;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* Widget body — list items */
.custodi-shop-sidebar .widget ul {
    list-style: none !important;
    padding: 0 16px 14px !important;
    margin: 0 !important;
}

.custodi-shop-sidebar .widget ul li {
    padding: 0 !important;
    margin: 0 !important;
}

.custodi-shop-sidebar .widget ul li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 7px 0;
    font-size: 13px;
    color: var(--headings-colour);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.15s;
}

.custodi-shop-sidebar .widget ul li a:hover {
    color: var(--custodi-blue-dark);
}

/* Category counts */
.custodi-shop-sidebar .widget ul li .count,
.custodi-shop-sidebar .widget ul li span.count {
    font-size: 11px;
    color: var(--cool-slate);
    font-weight: 500;
    background: none;
}

/* Current / active category */
.custodi-shop-sidebar .widget ul li.current-cat > a,
.custodi-shop-sidebar .widget ul li.chosen > a,
.custodi-shop-sidebar .widget ul li.current-cat-parent > a {
    color: var(--custodi-blue-dark) !important;
    font-weight: 700 !important;
}

/* Subcategories indented */
.custodi-shop-sidebar .widget ul.children {
    padding-left: 16px !important;
    padding-top: 0 !important;
    padding-bottom: 4px !important;
}

/* WooCommerce layered nav (attribute filters) */
.custodi-shop-sidebar .widget_layered_nav ul li a::before,
.custodi-shop-sidebar .woocommerce-widget-layered-nav ul li a::before {
    content: '';
    width: 16px;
    height: 16px;
    border: 2px solid var(--border-color);
    border-radius: 3px;
    margin-right: 8px;
    flex-shrink: 0;
    display: inline-block;
    vertical-align: middle;
    transition: all 0.15s;
}

.custodi-shop-sidebar .widget_layered_nav ul li.chosen a::before,
.custodi-shop-sidebar .woocommerce-widget-layered-nav ul li.chosen a::before {
    background: var(--custodi-blue-dark);
    border-color: var(--custodi-blue-dark);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 10px;
}

/* Price filter widget */
.custodi-shop-sidebar .widget_price_filter .price_slider_wrapper {
    padding: 0 16px 14px;
}

.custodi-shop-sidebar .widget_price_filter .ui-slider {
    background: var(--cool-light-sand) !important;
    border: none !important;
    height: 4px !important;
    border-radius: 2px !important;
    margin: 12px 0 !important;
}

.custodi-shop-sidebar .widget_price_filter .ui-slider .ui-slider-range {
    background: var(--custodi-blue-dark) !important;
    border-radius: 2px !important;
}

.custodi-shop-sidebar .widget_price_filter .ui-slider .ui-slider-handle {
    width: 18px !important;
    height: 18px !important;
    border-radius: 50% !important;
    background: var(--pure-white) !important;
    border: 2px solid var(--custodi-blue-dark) !important;
    top: -7px !important;
    cursor: grab !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.1) !important;
}

.custodi-shop-sidebar .widget_price_filter .price_slider_amount {
    font-size: 13px !important;
    color: var(--headings-colour) !important;
}

.custodi-shop-sidebar .widget_price_filter .price_slider_amount .price_label {
    font-size: 12px;
    color: var(--cool-slate);
}

.custodi-shop-sidebar .widget_price_filter .price_slider_amount button {
    background: var(--header-background) !important;
    color: var(--pure-white) !important;
    border: none !important;
    border-radius: var(--radius-sm) !important;
    padding: 8px 16px !important;
    font-family: var(--font-body) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    cursor: pointer;
}

/* WooCommerce active filters widget */
.custodi-shop-sidebar .widget_layered_nav_filters ul li {
    display: inline-block;
    margin: 0 6px 6px 0;
}

.custodi-shop-sidebar .widget_layered_nav_filters ul li a {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px 10px;
    background: rgba(0,136,170,0.08);
    color: var(--custodi-blue-dark);
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
}

.custodi-shop-sidebar .widget_layered_nav_filters ul li a:hover {
    background: rgba(0,136,170,0.15);
}


/* =================================================================
   PRODUCT GRID
   ================================================================= */

/* Override WooCommerce / Avada product grid */
ul.products,
.woocommerce ul.products,
body.post-type-archive-product ul.products,
body.tax-product_cat ul.products,
body.tax-product_tag ul.products,
.custodi-shop-products ul.products {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    grid-auto-rows: auto !important;     /* v94: content-driven row heights */
    align-items: start !important;       /* v94: don't stretch cards vertically */
    gap: 20px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    /* Kill Avada's flex override */
    flex-wrap: unset !important;
}

/* Hide any non-product elements that land inside the grid */
ul.products > *:not(li.product),
ul.products > li:not(.product) {
    display: none !important;
    grid-column: none !important;
    grid-row: none !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
}

/* Force first visible product to column 1 */
ul.products li.product:first-of-type {
    grid-column-start: 1 !important;
}

/* Kill Avada's float/flex product layout */
ul.products li.product,
.woocommerce ul.products li.product {
    float: none !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    clear: none !important;
    /* Kill Avada's calculated margins */
    margin-top: 0 !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    margin-bottom: 0 !important;
}

/* =================================================================
   PRODUCT CARD
   ================================================================= */
ul.products li.product,
.woocommerce ul.products li.product {
    background: var(--pure-white) !important;
    border: 1px solid #B8B3AD !important;
    border-radius: var(--radius-lg) !important;
    overflow: hidden !important;
    transition: all 0.25s ease;
    display: flex !important;
    flex-direction: column !important;
    position: relative;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
    align-self: start !important;  /* v94: don't stretch to row height */
    height: auto !important;       /* v94: size to content */
}

ul.products li.product:hover {
    border-color: var(--custodi-blue) !important;
    box-shadow: 0 8px 28px rgba(0,136,170,0.12) !important;
    transform: translateY(-3px);
}

/* Avada's product wrapper — reset everything */
ul.products li.product .fusion-product-wrapper {
    border: none !important;
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;  /* v94: was 100%, caused stretching */
}

/* Image wrapper — constrain to a nice aspect ratio */
ul.products li.product .fusion-clean-product-image-wrapper {
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
    overflow: hidden;
    aspect-ratio: 1;
    background: #ffffff;
    border-bottom: none;
}

ul.products li.product .fusion-clean-product-image-wrapper a {
    display: block;
    width: 100%;
    height: 100%;
}

/* Avada nests: .fusion-clean-product-image-wrapper > div.fusion-image-wrapper > img */
ul.products li.product .fusion-clean-product-image-wrapper .fusion-image-wrapper {
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
}

ul.products li.product .fusion-clean-product-image-wrapper img {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    display: block !important;
    margin: 0 !important;
    padding: 5% !important;
    box-sizing: border-box !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    position: relative !important;
    top: unset !important;
    left: unset !important;
}

/* === Hover overlay — simple View Product link === */
ul.products li.product .fusion-rollover {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: rgba(43, 50, 55, 0.7) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, visibility 0.25s ease !important;
    z-index: 3 !important;
    pointer-events: none !important;
}

ul.products li.product:hover .fusion-rollover,
ul.products li.product .fusion-product-wrapper:hover .fusion-rollover {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

/* Hide ALL native Avada rollover content */
ul.products li.product .fusion-rollover .fusion-rollover-content,
ul.products li.product .fusion-rollover .fusion-product-buttons,
ul.products li.product .fusion-rollover .cart-loading,
ul.products li.product .fusion-rollover .view-cart {
    display: none !important;
}

/* Our injected View Product link on rollover */
ul.products li.product .fusion-rollover .custodi-rollover-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    font-family: var(--font-body) !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: all 0.15s !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: none !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 4 !important;
    white-space: nowrap !important;
}

ul.products li.product .fusion-rollover .custodi-rollover-link::after {
    content: " →";
    display: inline;
}

ul.products li.product .fusion-rollover .custodi-rollover-link:hover {
    opacity: 0.85 !important;
    color: #ffffff !important;
}

ul.products li.product .fusion-rollover .custodi-rollover-link .custodi-rollover-arrow {
    transition: transform 0.15s;
    display: inline-block;
}

ul.products li.product .fusion-rollover .custodi-rollover-link:hover .custodi-rollover-arrow {
    transform: translateX(4px);
}

/* Card action links container — Quick View left, Add to Cart right */
.custodi-card-links {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin-top: 10px !important;
}

/* Shared text link style for both actions */
.custodi-card-links a {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-family: var(--font-body) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #0088AA !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: all 0.15s !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: none !important;
    white-space: nowrap !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    line-height: 1.4 !important;
}

.custodi-card-links a::after {
    content: "→";
    transition: transform 0.15s;
}

.custodi-card-links a:hover {
    color: #2B3237 !important;
}

.custodi-card-links a:hover::after {
    transform: translateX(3px);
}

/* Add to Cart link — bolder, right-aligned via order */
.custodi-card-links a.custodi-add-to-cart,
.custodi-card-links a.add_to_cart_button,
.custodi-card-links a.custodi-enquire-trigger {
    font-weight: 800 !important;
    order: 2 !important;
    color: #2B3237 !important;
}

.custodi-card-links a.custodi-add-to-cart:hover,
.custodi-card-links a.add_to_cart_button:hover,
.custodi-card-links a.custodi-enquire-trigger:hover {
    color: #0088AA !important;
}

/* POA "Get a Quote" CTA — Custodi dark blue by default, cyan on hover */
.custodi-card-links a.custodi-enquire-trigger {
    color: #0088AA !important;
}
.custodi-card-links a.custodi-enquire-trigger:hover {
    color: #00C4E8 !important;
}

/* Quick View — stays left via order */
.custodi-card-links .custodi-quick-view {
    order: 1 !important;
}

/* Sold Out text in card links */
.custodi-card-links .custodi-card-links-oos {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #C4846B !important;
    order: 2 !important;
}

/* Hide Avada's original button containers (we inject our own) */
ul.products li.product > .fusion-product-wrapper > .fusion-product-content .fusion-product-buttons,
ul.products li.product .product-details + .fusion-product-buttons {
    display: none !important;
}

/* Hide WooCommerce's "View cart" link that appears after AJAX add */
ul.products li.product .added_to_cart,
ul.products li.product a.added_to_cart,
.custodi-card-links .added_to_cart,
.custodi-card-links a.added_to_cart {
    display: none !important;
}

/* Sale badge */
ul.products li.product .onsale,
ul.products li.product span.onsale {
    position: absolute !important;
    top: 12px !important;
    left: 12px !important;
    right: auto !important;
    z-index: 2 !important;
    background: var(--muted-coral-alert) !important;
    color: var(--pure-white) !important;
    padding: 4px 10px !important;
    border-radius: 4px !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    line-height: 1.4 !important;
    min-height: 0 !important;
    min-width: 0 !important;
    margin: 0 !important;
}

/* Product content area — Avada uses .fusion-product-content > .product-details */
ul.products li.product .fusion-product-content {
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    flex: 0 0 auto !important;  /* v94: was flex:1, caused stretching */
    background: #D2CEC8 !important;
}

ul.products li.product .product-details {
    padding: 14px 20px 18px !important;
    display: flex !important;
    flex-direction: column !important;
    flex: 0 0 auto !important;  /* v94: was flex:1, caused stretching */
    background: #D2CEC8 !important;
}

/* Brand tag (injected via PHP hook) — hidden until clean product shots */
ul.products li.product .custodi-product-brand {
    font-family: var(--font-mono);
    font-size: 10px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 6px;
    display: none;  /* Re-enable when switching to plain product images */
}
.custodi-product-brand.brand-mission-darkness { color: var(--custodi-blue-dark); }
.custodi-product-brand.brand-offgrid { color: var(--cool-teal-success); }
.custodi-product-brand.brand-belkasoft { color: #6B7FC4; }
.custodi-product-brand.brand-detego { color: var(--muted-coral-alert); }
.custodi-product-brand.brand-minno { color: #D4A054; }
.custodi-product-brand.brand-ibrain { color: #8B5CF6; }

/* Product title — MUST override Avada's cyan link color */
ul.products li.product h2,
ul.products li.product h3,
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product .product-title,
ul.products li.product .fusion-product-content h2,
ul.products li.product .fusion-product-content h3,
ul.products li.product .product-details h2,
ul.products li.product .product-details h3 {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #2B3237 !important;
    line-height: 1.4 !important;
    margin: 0 0 6px !important;
    padding: 0 !important;
    text-align: left !important;
    /* Lock to exactly 2 lines */
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    min-height: calc(2 * 14px * 1.4) !important; /* 2 lines × font-size × line-height */
}

/* Title links — dark charcoal, not cyan */
ul.products li.product a,
ul.products li.product .product-details a,
ul.products li.product .fusion-product-content a {
    color: #2B3237 !important;
    text-decoration: none !important;
}
ul.products li.product a:hover,
ul.products li.product .product-details a:hover {
    color: #0088AA !important;
}

/* Use case pills (injected via PHP) */
ul.products li.product .custodi-use-cases {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}
.custodi-use-pill {
    font-size: 9px;
    padding: 2px 7px;
    border-radius: 3px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.custodi-use-pill.forensic { background: rgba(43,50,55,0.08); color: var(--headings-colour); }
.custodi-use-pill.corporate { background: rgba(0,136,170,0.08); color: var(--custodi-blue-dark); }
.custodi-use-pill.personal { background: rgba(91,168,160,0.08); color: var(--cool-teal-success); }
.custodi-use-pill.education { background: rgba(107,127,196,0.08); color: #6B7FC4; }

/* Price — amber, bold */
ul.products li.product .price,
ul.products li.product span.price,
ul.products li.product .fusion-product-content .price {
    font-size: 22px !important;
    font-weight: 800 !important;
    color: #0088AA !important;
    letter-spacing: -0.3px !important;
    margin-top: auto !important;
    margin-bottom: 0 !important;
    padding-top: 10px !important;
    padding-bottom: 0 !important;
    border-top: 1px solid #bfbab4 !important;
    display: flex !important;
    align-items: baseline !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
    text-align: left !important;
}

/* Price amounts inside links should also be teal */
ul.products li.product .price .woocommerce-Price-amount,
ul.products li.product .price .amount {
    color: #0088AA !important;
}

ul.products li.product .price del {
    font-size: 13px !important;
    font-weight: 400 !important;
    color: var(--border-color) !important;
    text-decoration: line-through !important;
    margin-right: 6px !important;
}
ul.products li.product .price del .woocommerce-Price-amount {
    color: var(--border-color) !important;
}

ul.products li.product .price ins {
    text-decoration: none !important;
    font-weight: 800 !important;
}

/* GST note injected below price — now inline beside price */
ul.products li.product .custodi-gst-label {
    display: inline;
    font-size: 11px;
    font-weight: 500;
    color: #5a6068;
    margin: 0;
    letter-spacing: 0;
}

/* POA label for products without a price */
ul.products li.product .custodi-poa {
    font-size: 22px !important;
    font-weight: 800 !important;
    color: #0088AA !important;
    letter-spacing: -0.3px !important;
}

/* Stock status badges — prominent, sits above action links */
ul.products li.product .custodi-stock-status {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.3px;
    margin-top: 6px;
}

ul.products li.product .custodi-stock-status.in-stock {
    color: #22c55e;
}

ul.products li.product .custodi-stock-status.in-stock::before {
    content: "●";
    font-size: 9px;
}

ul.products li.product .custodi-stock-status.out-of-stock {
    color: #ef4444;
}

ul.products li.product .custodi-stock-status.out-of-stock::before {
    content: "●";
    font-size: 9px;
}

ul.products li.product .custodi-stock-status.on-backorder {
    color: #D4A054;
}

ul.products li.product .custodi-stock-status.on-backorder::before {
    content: "●";
    font-size: 9px;
}

/* Star ratings */
ul.products li.product .star-rating {
    font-size: 11px !important;
    margin: 4px 0 0 !important;
    color: #0088AA !important;
}


/* =================================================================
   ENQUIRY MODAL
   ================================================================= */

/* =================================================================
   QUICK VIEW MODAL — Avada's product quick view popup
   ================================================================= */

/* Modal container */
.fusion-woocommerce-quick-view-container,
.fusion-quick-view-container {
    font-family: var(--font-body) !important;
}

/* Product title — dark, smaller */
.fusion-woocommerce-quick-view-container .product_title,
.fusion-woocommerce-quick-view-container h1,
.fusion-woocommerce-quick-view-container h2,
.fusion-quick-view-container .product_title {
    color: #2B3237 !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    margin-bottom: 8px !important;
}

/* Price in quick view */
.fusion-woocommerce-quick-view-container .price,
.fusion-quick-view-container .price {
    color: #0088AA !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    margin-bottom: 12px !important;
}

.fusion-woocommerce-quick-view-container .price del {
    color: #B8B3AD !important;
    font-size: 16px !important;
}

/* Single separator line, subtle */
.fusion-woocommerce-quick-view-container hr,
.fusion-woocommerce-quick-view-container .woocommerce-product-details__short-description::before,
.fusion-quick-view-container hr {
    border: none !important;
    border-top: 1px solid #EBE9E6 !important;
    margin: 16px 0 !important;
}

/* Remove double separators */
.fusion-woocommerce-quick-view-container .summary > hr + hr,
.fusion-woocommerce-quick-view-container .product-border {
    display: none !important;
}

/* Description text */
.fusion-woocommerce-quick-view-container .woocommerce-product-details__short-description,
.fusion-woocommerce-quick-view-container .woocommerce-product-details__short-description p,
.fusion-quick-view-container .woocommerce-product-details__short-description p {
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: #3A4045 !important;
    margin-bottom: 12px !important;
}

/* Stock status */
.fusion-woocommerce-quick-view-container .stock,
.fusion-quick-view-container .stock {
    font-size: 13px !important;
    font-weight: 700 !important;
    margin-bottom: 16px !important;
}

.fusion-woocommerce-quick-view-container .stock.in-stock {
    color: #5BA8A0 !important;
}

.fusion-woocommerce-quick-view-container .stock.out-of-stock {
    color: #C4846B !important;
}

/* Quantity input */
.fusion-woocommerce-quick-view-container .quantity,
.fusion-quick-view-container .quantity {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0 !important;
    margin-right: 12px !important;
}

.fusion-woocommerce-quick-view-container .quantity .minus,
.fusion-woocommerce-quick-view-container .quantity .plus,
.fusion-woocommerce-quick-view-container .quantity .qty-minus,
.fusion-woocommerce-quick-view-container .quantity .qty-plus {
    background: #EBE9E6 !important;
    color: #2B3237 !important;
    border: none !important;
    width: 36px !important;
    height: 36px !important;
    font-size: 16px !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.fusion-woocommerce-quick-view-container .quantity input.qty {
    width: 50px !important;
    height: 36px !important;
    text-align: center !important;
    border: 1px solid #EBE9E6 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #2B3237 !important;
}

/* Add to Cart button */
.fusion-woocommerce-quick-view-container .single_add_to_cart_button,
.fusion-woocommerce-quick-view-container button.button,
.fusion-quick-view-container .single_add_to_cart_button {
    background: #0088AA !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 12px 28px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    cursor: pointer !important;
    transition: background 0.15s !important;
}

.fusion-woocommerce-quick-view-container .single_add_to_cart_button:hover {
    background: #2B3237 !important;
}

/* View Details link */
.fusion-woocommerce-quick-view-container .fusion-quick-view-details-link,
.fusion-woocommerce-quick-view-container a[class*="view-details"],
.fusion-quick-view-container .fusion-quick-view-details-link {
    display: block !important;
    text-align: center !important;
    margin-top: 16px !important;
    padding: 12px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: #2B3237 !important;
    text-decoration: none !important;
    border-top: 1px solid #EBE9E6 !important;
}

.fusion-woocommerce-quick-view-container .fusion-quick-view-details-link:hover {
    color: #0088AA !important;
}

/* Meta info (SKU, categories, tags) */
.fusion-woocommerce-quick-view-container .product_meta,
.fusion-quick-view-container .product_meta {
    font-size: 12px !important;
    color: #6B7780 !important;
    margin-top: 12px !important;
}

.fusion-woocommerce-quick-view-container .product_meta a {
    color: #0088AA !important;
    text-decoration: none !important;
}

/* Close button */
.fusion-woocommerce-quick-view-container .fusion-quick-view-close,
.ilightbox-close {
    color: #6B7780 !important;
}

/* Image area in quick view */
.fusion-woocommerce-quick-view-container .woocommerce-product-gallery,
.fusion-woocommerce-quick-view-container .images {
    background: #ffffff !important;
}

/* Navigation dots */
.fusion-woocommerce-quick-view-container .flex-control-nav li a {
    background: #B8B3AD !important;
}

.fusion-woocommerce-quick-view-container .flex-control-nav li a.flex-active {
    background: #0088AA !important;
}


/* =================================================================
   MINI CART NOTIFICATION — Slides in after adding to cart
   ================================================================= */
.custodi-cart-toast {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 100000;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 12px 40px rgba(0,0,0,0.18);
    padding: 24px 28px;
    max-width: 360px;
    width: 90%;
    transform: translateX(120%);
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    border-left: 4px solid #5BA8A0;
}

.custodi-cart-toast.active {
    transform: translateX(0);
}

.custodi-cart-toast-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
}

.custodi-cart-toast-icon {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #5BA8A0;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
}

.custodi-cart-toast-title {
    font-size: 15px;
    font-weight: 700;
    color: #2B3237;
}

.custodi-cart-toast-product {
    font-size: 13px;
    color: #6B7780;
    margin-bottom: 16px;
    line-height: 1.4;
}

.custodi-cart-toast-actions {
    display: flex;
    gap: 10px;
}

.custodi-cart-toast-actions a {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-radius: 6px;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
}

.custodi-cart-toast-checkout {
    background: #0088AA;
    color: #ffffff !important;
    border: none;
}

.custodi-cart-toast-checkout:hover {
    background: #2B3237;
}

.custodi-cart-toast-continue {
    background: transparent;
    color: #2B3237 !important;
    border: 2px solid #B8B3AD;
}

.custodi-cart-toast-continue:hover {
    border-color: #2B3237;
}

.custodi-cart-toast-close {
    position: absolute;
    top: 10px;
    right: 14px;
    background: none;
    border: none;
    font-size: 20px;
    color: #B8B3AD;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

.custodi-cart-toast-close:hover {
    color: #2B3237;
}


/* =================================================================
   ENQUIRY MODAL (continued)
   ================================================================= */
.custodi-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(43, 50, 55, 0.6);
    z-index: 100050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.custodi-modal {
    background: #ffffff;
    border-radius: 12px;
    max-width: 480px;
    width: 100%;
    padding: 36px;
    position: relative;
    box-shadow: 0 20px 60px rgba(0,0,0,0.2);
    max-height: 90vh;
    overflow-y: auto;
}

.custodi-modal-close {
    position: absolute;
    top: 14px;
    right: 18px;
    background: none;
    border: none;
    font-size: 28px;
    color: #6B7780;
    cursor: pointer;
    line-height: 1;
    padding: 0;
    transition: color 0.15s;
}

.custodi-modal-close:hover {
    color: #2B3237;
}

.custodi-modal-title {
    font-size: 22px;
    font-weight: 800;
    color: #2B3237;
    margin: 0 0 4px;
}

.custodi-modal-product-name {
    font-size: 14px;
    font-weight: 600;
    color: #0088AA;
    margin: 0 0 24px;
}

.custodi-form-row {
    margin-bottom: 16px;
}

.custodi-form-row label {
    display: block;
    font-size: 12px;
    font-weight: 700;
    color: #2B3237;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 6px;
}

.custodi-form-row label .optional {
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    color: #6B7780;
}

.custodi-form-row input,
.custodi-form-row textarea {
    width: 100%;
    padding: 10px 14px;
    border: 1.5px solid #B8B3AD;
    border-radius: 6px;
    font-size: 14px;
    font-family: var(--font-body);
    color: #2B3237;
    background: #ffffff;
    transition: border-color 0.15s;
    box-sizing: border-box;
}

.custodi-form-row input:focus,
.custodi-form-row textarea:focus {
    outline: none;
    border-color: #0088AA;
}

.custodi-form-row input::placeholder,
.custodi-form-row textarea::placeholder {
    color: #B8B3AD;
}

/* Modal form input overrides — Avada global input styling was winning
   specificity via input[type="text"] selectors and painting the fields
   with the site cyan (#00C4E8) background. Force white background,
   grey border, dark text inside the enquiry modal. */
.custodi-modal .custodi-form-row input[type="text"],
.custodi-modal .custodi-form-row input[type="email"],
.custodi-modal .custodi-form-row input[type="tel"],
.custodi-modal .custodi-form-row input[type="number"],
.custodi-modal .custodi-form-row textarea {
    width: 100% !important;
    padding: 10px 14px !important;
    border: 1.5px solid #B8B3AD !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    color: #2B3237 !important;
    font-size: 14px !important;
    box-sizing: border-box !important;
    box-shadow: none !important;
}

.custodi-modal .custodi-form-row input[type="text"]:focus,
.custodi-modal .custodi-form-row input[type="email"]:focus,
.custodi-modal .custodi-form-row input[type="tel"]:focus,
.custodi-modal .custodi-form-row input[type="number"]:focus,
.custodi-modal .custodi-form-row textarea:focus {
    border-color: #0088AA !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(0, 136, 170, 0.15) !important;
}

.custodi-modal .custodi-form-row input::placeholder,
.custodi-modal .custodi-form-row textarea::placeholder {
    color: #B8B3AD !important;
    opacity: 1 !important;
}

.custodi-enquiry-submit {
    display: block;
    width: 100%;
    padding: 13px 24px;
    background: #0088AA;
    color: #ffffff;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    cursor: pointer;
    transition: background 0.15s;
    margin-top: 8px;
}

.custodi-enquiry-submit:hover {
    background: #2B3237;
}

.custodi-enquiry-submit:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Direct-contact line under Send Enquiry.
   Warm secondary route for procurement buyers who prefer voice/email
   over form. Sits beneath the primary CTA behind a subtle divider so
   the form remains visually dominant. */
.custodi-enquiry-direct {
    margin: 14px 0 0 !important;
    padding-top: 14px !important;
    border-top: 1px solid #EBE9E6 !important;
    font-size: 13px !important;
    color: #6B7780 !important;
    text-align: center !important;
    line-height: 1.5 !important;
}

.custodi-enquiry-direct strong {
    color: #2B3237 !important;
    font-weight: 700 !important;
    margin-right: 6px !important;
}

.custodi-enquiry-direct a {
    color: #0088AA !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    border-bottom: 1px solid rgba(0, 136, 170, 0.25) !important;
    padding-bottom: 1px !important;
    transition: color 0.15s ease, border-color 0.15s ease !important;
}

.custodi-enquiry-direct a:hover {
    color: #00C4E8 !important;
    border-bottom-color: #00C4E8 !important;
}

.custodi-enquiry-direct-sep {
    color: #B8B3AD !important;
    margin: 0 4px !important;
}

.custodi-enquiry-success {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 20px 0;
}

.custodi-success-icon {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #5BA8A0;
    color: #ffffff;
    font-size: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
}

.custodi-enquiry-success h4 {
    font-size: 18px;
    font-weight: 800;
    color: #2B3237;
    margin: 0 0 8px;
}

.custodi-enquiry-success p {
    font-size: 14px;
    color: #6B7780;
    margin: 0;
}

/* Hide Afterpay / Square placement widgets in grid */
ul.products li.product square-placement,
ul.products li.product [class*="afterpay"],
ul.products li.product [class*="square-placement"],
ul.products li.product [data-show-interest-free] {
    display: none !important;
}


/* =================================================================
   PAGINATION
   ================================================================= */
.woocommerce-pagination,
nav.woocommerce-pagination {
    margin-top: 40px !important;
    padding-top: 24px !important;
    border-top: 1px solid var(--cool-light-sand) !important;
    text-align: center !important;
}

.woocommerce-pagination ul {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
}

.woocommerce-pagination ul li {
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.woocommerce-pagination ul li a,
.woocommerce-pagination ul li span {
    min-width: 40px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: var(--radius-sm) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--headings-colour) !important;
    text-decoration: none !important;
    transition: all 0.15s !important;
    border: none !important;
    background: transparent !important;
}

.woocommerce-pagination ul li a:hover {
    background: var(--cool-light-sand) !important;
}

.woocommerce-pagination ul li span.current {
    background: var(--custodi-blue-dark) !important;
    color: var(--pure-white) !important;
}


/* =================================================================
   RESULT COUNT & ORDERING BAR
   ================================================================= */
html body .custodi-shop-topbar,
html body.woocommerce-page .custodi-shop-topbar,
html body.post-type-archive-product .custodi-shop-topbar {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    margin-bottom: 20px !important;
    gap: 12px !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    min-height: 40px !important;
}

html body .custodi-shop-topbar .custodi-shop-ordering,
html body .custodi-shop-topbar form.custodi-shop-ordering,
html body .custodi-shop-topbar form.woocommerce-ordering {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 !important;
    float: none !important;
    visibility: visible !important;
    opacity: 1 !important;
}

html body .custodi-shop-topbar select.orderby,
html body .custodi-shop-topbar .woocommerce-ordering select.orderby {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #2B3237 !important;
    background: #FFFFFF !important;
    border: 1px solid #D8D4CE !important;
    border-radius: 6px !important;
    padding: 8px 32px 8px 12px !important;
    cursor: pointer !important;
    max-width: 100% !important;
    min-width: 200px !important;
    height: auto !important;
    line-height: 1.4 !important;
}

.custodi-shop-topbar .woocommerce-result-count {
    font-size: 13px;
    color: var(--cool-slate);
    margin: 0 !important;
    padding: 0 !important;
}

/* v94w: Hide WC's native result-count and ordering. They sit above the products
   grid in the products column and push the grid down ~50-60px relative to the
   sidebar's first widget, breaking top alignment between the two columns.
   The "58" count badge on All Products tab is the user-facing equivalent of
   result count; sort is handled server-side (priced products first per v94t). */
.woocommerce-page .woocommerce-result-count,
.woocommerce-page .woocommerce-ordering,
body.post-type-archive-product .woocommerce-result-count,
body.post-type-archive-product .woocommerce-ordering,
body.tax-product_cat .woocommerce-result-count,
body.tax-product_cat .woocommerce-ordering,
body.tax-product_tag .woocommerce-result-count,
body.tax-product_tag .woocommerce-ordering,
body.tax-solution .woocommerce-result-count,
body.tax-solution .woocommerce-ordering,
body.tax-use_case .woocommerce-result-count,
body.tax-use_case .woocommerce-ordering,
body.tax-device_type .woocommerce-result-count,
body.tax-device_type .woocommerce-ordering {
    display: none !important;
}

/* Hide the default WooCommerce result count and ordering that sits above the grid */
.woocommerce-page .woocommerce-result-count:not(.custodi-shop-topbar .woocommerce-result-count),
.woocommerce-page .woocommerce-ordering:not(.custodi-shop-topbar .woocommerce-ordering) {
    /* Leave visible — they sit in our topbar */
}

/* v95: Restore visibility for the ordering dropdown when it sits inside
   our custom .custodi-shop-topbar wrapper. Higher specificity than the
   hide rules above so it wins the cascade. */
body.woocommerce-page .custodi-shop-topbar .woocommerce-ordering,
body.post-type-archive-product .custodi-shop-topbar .woocommerce-ordering,
body.tax-product_cat .custodi-shop-topbar .woocommerce-ordering,
body.tax-product_tag .custodi-shop-topbar .woocommerce-ordering,
body.tax-solution .custodi-shop-topbar .woocommerce-ordering,
body.tax-use_case .custodi-shop-topbar .woocommerce-ordering,
body.tax-device_type .custodi-shop-topbar .woocommerce-ordering {
    display: block !important;
    margin: 0 !important;
    float: none !important;
}

body.woocommerce-page .custodi-shop-topbar .woocommerce-ordering select.orderby,
body.post-type-archive-product .custodi-shop-topbar .woocommerce-ordering select.orderby {
    font-family: 'Inter', sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #2B3237 !important;
    background: #FFFFFF !important;
    border: 1px solid #D8D4CE !important;
    border-radius: 6px !important;
    padding: 8px 32px 8px 12px !important;
    cursor: pointer !important;
    max-width: 100% !important;
}

body.woocommerce-page .custodi-shop-topbar .woocommerce-ordering select.orderby:hover {
    border-color: #0088AA !important;
}

.custodi-shop-topbar-spacer {
    flex: 1 1 auto !important;
}

.custodi-shop-ordering {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 !important;
    float: none !important;
}

.custodi-shop-ordering-label {
    font-family: 'Inter', sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    color: #6B7780 !important;
    white-space: nowrap !important;
}


/* =================================================================
   RESPONSIVE
   v94: stricter breakpoints — 2 columns from 1024px down, never 3 on phones
   v94d: selector lists match base rule for specificity parity
   ================================================================= */
@media (max-width: 1024px) {
    ul.products,
    .woocommerce ul.products,
    body.post-type-archive-product ul.products,
    body.tax-product_cat ul.products,
    body.tax-product_tag ul.products,
    .custodi-shop-products ul.products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 16px !important;
    }
}

@media (max-width: 900px) {
    .custodi-shop-layout {
        grid-template-columns: 1fr !important;
        padding: 20px !important;
    }

    .custodi-shop-sidebar {
        position: fixed !important;
        top: 0 !important;
        left: -320px !important;
        width: 300px !important;
        height: 100vh !important;
        background: var(--content-background) !important;
        z-index: 10000 !important;
        overflow-y: auto !important;
        padding: 20px !important;
        transition: left 0.3s ease !important;
        box-shadow: 4px 0 24px rgba(0,0,0,0.15) !important;
    }
    .custodi-shop-sidebar.open {
        left: 0 !important;
    }

    /* v94d: filter toggle with html body specificity, sticky and prominent */
    html body .custodi-filter-toggle,
    html body button.custodi-filter-toggle {
        display: flex !important;
        position: sticky !important;
        top: 60px !important;
        z-index: 50 !important;
        background: var(--pure-white) !important;
        border: 1px solid var(--cool-light-sand) !important;
        border-radius: 6px !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
        margin: 12px 10px 14px !important;
        padding: 12px 16px !important;
        font-weight: 700 !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        width: calc(100% - 20px) !important;
        font-size: 13px !important;
        color: var(--headings-colour) !important;
        cursor: pointer !important;
    }
    html body .custodi-filter-toggle::before {
        content: '⚙' !important;
        font-size: 14px !important;
    }
    /* v94g: chevron-down indicates expandable */
    html body .custodi-filter-toggle::after {
        content: '▼' !important;
        font-size: 9px !important;
        margin-left: auto !important;
        opacity: 0.55 !important;
        transition: transform 0.2s ease !important;
    }
    html body .custodi-filter-toggle.open::after,
    html body .custodi-filter-toggle[aria-expanded="true"]::after {
        transform: rotate(180deg) !important;
    }

    .custodi-shop-hero-inner {
        flex-direction: column;
        align-items: flex-start;
    }

    .custodi-sidebar-close {
        display: block !important;
        width: 100%;
        padding: 12px;
        background: var(--header-background);
        color: var(--pure-white);
        border: none;
        border-radius: var(--radius-sm);
        font-family: var(--font-body);
        font-size: 13px;
        font-weight: 600;
        cursor: pointer;
        margin-bottom: 16px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .custodi-sidebar-overlay {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(43,50,55,0.4);
        z-index: 9999;
    }
    .custodi-sidebar-overlay.active {
        display: block;
    }
}

@media (min-width: 901px) {
    .custodi-sidebar-close {
        display: none !important;
    }
    .custodi-sidebar-overlay {
        display: none !important;
    }
}

/* v94g: PHONE — SINGLE COLUMN LAYOUT
   Narrow Avada wrapper padding (#main 30px + .fusion-row 20px were eating
   100px of viewport). Single card per row. Hide Quick View on mobile
   (tap card to view product). Primary CTA only. Bigger title and price
   since each card has the full viewport width to work with. */

@media (max-width: 600px) {

    /* === AVADA WRAPPER PADDING OVERRIDE ===
       v94z: zeroed entirely. Cards reach screen edges; visual breathing room
       comes from the 6px grid gap between cards, not from outer padding. */
    html body main#main.clearfix,
    html body #main.clearfix,
    html body main#main,
    html body #main {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    html body #main .fusion-row,
    html body main#main .fusion-row {
        padding-left: 0 !important;
        padding-right: 0 !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    html body .custodi-shop-layout,
    html body div.custodi-shop-layout {
        padding: 8px 0 32px !important;
        gap: 0 !important;
    }

    html body .custodi-shop-products {
        padding: 0 !important;
    }

    /* === TWO COLUMN GRID — v94w: padding 0 + 6px gap for max card width.
       Cards now reach screen edges with just 6px between them. === */
    ul.products,
    .woocommerce ul.products,
    body.post-type-archive-product ul.products,
    body.tax-product_cat ul.products,
    body.tax-product_tag ul.products,
    .custodi-shop-products ul.products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 6px !important;
        padding: 0 !important;
    }

    html body ul.products li.product,
    html body .woocommerce ul.products li.product {
        max-width: 100% !important;
        width: 100% !important;
        margin: 0 !important;                  /* v94x: kill WC default margin */
        align-self: stretch !important;        /* v94x: equal heights within row */
        height: auto !important;
        display: flex !important;
        flex-direction: column !important;
    }

    /* === WRAPPER FILLS THE STRETCHED LI — v94y ===
       The site-wide rule sets .fusion-product-wrapper { height: auto } which is
       fine for desktop. On mobile, li.product stretches via grid + align-self
       and we need the wrapper to fill that stretched height so the CTA's
       margin-top: auto actually pushes the button to the card bottom.
       Without this, the wrapper sat at content height and the CTA stopped
       short, leaving empty card space below it. Pairs with Avada Options →
       WooCommerce → Equal Heights = YES (recommended but not required). */
    html body ul.products li.product .fusion-product-wrapper {
        flex: 1 1 auto !important;
        min-height: 100% !important;
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
    }

    /* === IMAGE — v94x: strict 1:1 with explicit dimensions === */
    html body ul.products li.product .fusion-clean-product-image-wrapper {
        aspect-ratio: 1 / 1 !important;
        width: 100% !important;
        max-height: 240px !important;
        display: block !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
        flex: 0 0 auto !important;             /* v94x: don't stretch image */
    }

    html body ul.products li.product .fusion-clean-product-image-wrapper a,
    html body ul.products li.product .fusion-clean-product-image-wrapper .fusion-image-wrapper {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        box-sizing: border-box !important;
    }

    html body ul.products li.product .fusion-clean-product-image-wrapper img {
        width: 100% !important;
        height: 100% !important;
        object-fit: contain !important;        /* v94x: preserve image ratio inside fixed wrapper */
        padding: 8% !important;
        box-sizing: border-box !important;
    }

    /* === CARD CONTENT — v94aa: side padding 4→3 to give price/title more room
       at sub-360px viewports (real phones with high DPR report narrow CSS widths).
       Content fills card height, CTA pushed to bottom via margin-top: auto. === */
    html body ul.products li.product .fusion-product-content,
    html body ul.products li.product .product-details {
        padding: 5px 3px 0 !important;
        display: flex !important;
        flex-direction: column !important;
        flex: 1 1 auto !important;             /* v94x: fill card height */
    }

    /* Brand pill (when shown) */
    html body ul.products li.product .custodi-product-brand {
        font-size: 9px !important;
        letter-spacing: 1px !important;
        margin-bottom: 4px !important;
    }

    /* Title — v94ac: locked to exactly 2 lines so 1-line titles take the
       same vertical space as 2-line titles. This makes the divider, price,
       stock and CTA all line up across the row regardless of title length.
       3-line titles get clipped: manually shorten those product names. */
    html body ul.products li.product .fusion-product-content h2,
    html body ul.products li.product .fusion-product-content h3,
    html body ul.products li.product .product-details h2,
    html body ul.products li.product .product-details h3,
    html body ul.products li.product .woocommerce-loop-product__title,
    html body ul.products li.product h2,
    html body ul.products li.product h3 {
        font-size: 12.5px !important;
        line-height: 1.4 !important;
        margin: 0 0 6px !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        overflow: hidden !important;
        min-height: 2.8em !important;          /* 2 lines × 1.4 line-height */
        word-break: break-word !important;
    }

    /* v94h: Card description — ACF field 'card_description', 15-25 words */
    html body ul.products li.product .custodi-card-description {
        display: -webkit-box !important;
        -webkit-line-clamp: 3 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        font-size: 13px !important;
        line-height: 1.5 !important;
        color: var(--cool-slate) !important;
        margin: 0 0 10px !important;
        font-weight: 400 !important;
    }

    /* Hide the older excerpt class on mobile if it exists */
    html body ul.products li.product .custodi-product-excerpt {
        display: none !important;
    }

    /* Price — v94ab: 13px (down from 14) for sub-360px CSS viewports.
       Still visually prominent as the hero element on the card. */
    html body ul.products li.product .price,
    html body ul.products li.product span.price {
        font-size: 13px !important;
        line-height: 1.2 !important;
        overflow: visible !important;
        white-space: normal !important;
        margin-bottom: 2px !important;
    }
    html body ul.products li.product .price del {
        font-size: 10px !important;
    }
    html body ul.products li.product .price .amount,
    html body ul.products li.product .price .woocommerce-Price-amount {
        white-space: nowrap !important;
    }

    /* POA — same prominence as price */
    html body ul.products li.product .custodi-poa {
        font-size: 13px !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
    }

    /* GST label — v94aa: 9px (down from 10) and tighter gap (3→2px) to keep
       price + "incl GST" on one line at sub-360px CSS viewports. */
    html body ul.products li.product .custodi-gst-label {
        display: inline-block !important;
        font-size: 9px !important;
        margin-top: 0 !important;
        margin-left: 2px !important;
    }

    /* Stock status — v94z: 5px bottom margin sets minimum gap before CTA.
       Plays nicely with CTA's margin-top: auto (auto distributes remaining
       space; this enforces the minimum). */
    html body ul.products li.product .custodi-stock-status {
        font-size: 11px !important;
        margin-top: 4px !important;
        margin-bottom: 5px !important;
        white-space: nowrap !important;
    }

    /* === CTA — Flush bottom + full card width + pushed to bottom (v94z).
       margin-top: auto pushes button to bottom of card regardless of content above.
       Negative side margins (-10px) escape the 4px content padding with 6px
       extra bleed so the button visibly reaches the card edge even with
       border + sub-pixel rendering on hi-DPI screens. The card's overflow:hidden
       + matching border-radius clips the excess into a clean edge. === */
    html body ul.products li.product .custodi-card-links {
        display: flex !important;
        flex-direction: row !important;
        align-items: stretch !important;
        gap: 0 !important;
        margin: auto -10px 0 -10px !important;
        width: calc(100% + 20px) !important;
        padding: 0 !important;
    }

    /* Hide Quick View on mobile — redundant with tap-to-view-product */
    html body ul.products li.product .custodi-card-links .custodi-quick-view {
        display: none !important;
    }

    /* Primary CTA button — flush bottom, no top radius, match card bottom radius */
    html body ul.products li.product .custodi-card-links a,
    html body ul.products li.product .custodi-card-links a.custodi-add-to-cart,
    html body ul.products li.product .custodi-card-links a.custodi-enquire-trigger,
    html body ul.products li.product .custodi-card-links a.add_to_cart_button {
        display: flex !important;
        flex: 1 1 100% !important;
        width: 100% !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;
        padding: 13px 10px !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        background: var(--header-background) !important;
        color: #ffffff !important;
        border: none !important;
        border-radius: 0 0 8px 8px !important;
        text-transform: uppercase !important;
        letter-spacing: 0.6px !important;
        white-space: normal !important;
        order: initial !important;
        text-align: center !important;
        cursor: pointer !important;
        transition: background 0.2s, transform 0.1s !important;
    }

    html body ul.products li.product .custodi-card-links a::after {
        content: '→' !important;
        display: inline-block !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        margin: 0 !important;
        transform: none !important;
    }

    html body ul.products li.product .custodi-card-links a:hover,
    html body ul.products li.product .custodi-card-links a:active {
        background: var(--custodi-blue-dark) !important;
        color: #ffffff !important;
    }

    /* Sold Out — coral pill, full width, no arrow */
    html body ul.products li.product .custodi-card-links .custodi-card-links-oos {
        display: flex !important;
        flex: 1 1 100% !important;
        width: 100% !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 13px 16px !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        color: #C4846B !important;
        background: rgba(196, 132, 107, 0.1) !important;
        border: 1px solid rgba(196, 132, 107, 0.3) !important;
        border-radius: 6px !important;
        text-transform: uppercase !important;
        letter-spacing: 0.8px !important;
        text-align: center !important;
        margin-top: 0 !important;
        box-sizing: border-box !important;
    }

    /* === BROWSE TABS — v94w: 100vw full-bleed on the tabs container itself.
       Previous versions relied on cascade from full-bleed bar, but somewhere
       in the parent chain (Avada .fusion-row max-width or similar) was still
       constraining the tabs grid. Forcing 100vw width directly with the
       calc margin trick makes the tabs row escape any parent constraint.
       v94x: sticky top bumped to 80px so tabs don't clip behind mobile header. */
    html body .custodi-browse-tabs-bar {
        width: 100vw !important;
        max-width: 100vw !important;
        margin-left: calc(50% - 50vw) !important;
        margin-right: calc(50% - 50vw) !important;
        padding: 0 !important;
        top: 80px !important;
    }
    html body .custodi-browse-tabs-row {
        flex-direction: column !important;
        padding: 0 !important;
        gap: 0 !important;
        align-items: stretch !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        justify-content: flex-start !important;
    }
    html body .custodi-browse-tabs {
        display: grid !important;
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
        /* Force grid container to 100vw using full-bleed technique —
           same trick as the bar, applied at this level too in case any
           parent narrows the row before reaching the tabs. */
        width: 100vw !important;
        max-width: 100vw !important;
        margin-left: calc(50% - 50vw) !important;
        margin-right: calc(50% - 50vw) !important;
        gap: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        border-right: none !important;
        border-bottom: 1px solid var(--cool-light-sand) !important;
        box-sizing: border-box !important;
    }
    html body .custodi-browse-tab {
        grid-column: span 2 !important;
        min-width: 0 !important;
        padding: 12px 6px !important;
        font-size: 12px !important;
        text-align: center !important;
        justify-content: center !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        letter-spacing: 0.2px !important;
    }
    html body .custodi-browse-tab:nth-child(4),
    html body .custodi-browse-tab:nth-child(5) {
        grid-column: span 3 !important;
    }
    html body .custodi-browse-tab .tab-count {
        font-size: 9px !important;
        padding: 1px 4px !important;
        margin-left: 3px !important;
    }

    /* Search bar: also use 100vw to match tabs and escape any parent margin */
    html body .custodi-shop-search {
        display: flex !important;
        width: 100vw !important;
        max-width: 100vw !important;
        margin-left: calc(50% - 50vw) !important;
        margin-right: calc(50% - 50vw) !important;
        padding: 0 !important;
        background: var(--pure-white) !important;
        box-sizing: border-box !important;
        border-top: 1px solid var(--cool-light-sand) !important;
    }

    /* Search input fields */
    html body .custodi-shop-search-input {
        width: 100% !important;
        height: 44px !important;
        font-size: 14px !important;
        border-left: none !important;
        border-right: none !important;
        border-radius: 0 !important;
        padding-left: 14px !important;
        padding-right: 44px !important;
    }
    html body .custodi-shop-search-btn {
        right: 14px !important;
    }
}


/* =================================================================
   OUT-OF-STOCK BADGE — Corner pill, not centered overlay (v94)
   ================================================================= */
ul.products li.product .outofstock,
ul.products li.product span.outofstock,
ul.products li.product .out-of-stock-overlay {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    left: auto !important;
    bottom: auto !important;
    transform: none !important;
    background: rgba(196, 132, 107, 0.95) !important;
    color: #ffffff !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    z-index: 5 !important;
    line-height: 1.2 !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15) !important;
}

@media (max-width: 600px) {
    ul.products li.product .outofstock,
    ul.products li.product span.outofstock,
    ul.products li.product .out-of-stock-overlay {
        top: 6px !important;
        right: 6px !important;
        font-size: 9px !important;
        padding: 3px 6px !important;
    }
}


/* =================================================================
   SIDEBAR REINFORCEMENTS — JS-injected sidebar
   Ensures styles apply to dynamically generated sidebar
   ================================================================= */

/* Kill ALL list bullets/arrows in sidebar */
#custodiShopSidebar ul,
#custodiShopSidebar ul li,
#custodiShopSidebar .widget ul,
#custodiShopSidebar .widget ul li {
    list-style: none !important;
    list-style-type: none !important;
    margin-left: 0 !important;
}

/* Category items get checkbox-style indicators */
#custodiShopSidebar .widget_product_categories ul li > a::before {
    content: '';
    width: 16px;
    height: 16px;
    min-width: 16px;
    border: 2px solid #B8B3AD;
    border-radius: 3px;
    margin-right: 10px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s;
    vertical-align: middle;
    position: relative;
    top: 0;
    box-sizing: border-box;
}

/* Active / current category — filled checkbox */
#custodiShopSidebar .widget_product_categories ul li.current-cat > a::before {
    background: var(--custodi-blue-dark);
    border-color: var(--custodi-blue-dark);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 10px;
}

/* Active category text turns blue */
#custodiShopSidebar .widget_product_categories ul li.current-cat > a {
    color: var(--custodi-blue-dark) !important;
    font-weight: 700 !important;
}

/* Parent of active category also highlighted */
#custodiShopSidebar .widget_product_categories ul li.current-cat-parent > a {
    color: var(--custodi-blue-dark) !important;
    font-weight: 600 !important;
}
#custodiShopSidebar .widget_product_categories ul li.current-cat-parent > a::before {
    border-color: var(--custodi-blue-dark);
}

/* Hover state */
#custodiShopSidebar .widget_product_categories ul li > a:hover::before {
    border-color: var(--custodi-blue-dark);
}

/* Category link layout — push count to right */
#custodiShopSidebar .widget_product_categories ul li a {
    display: flex !important;
    align-items: center !important;
    padding: 7px 0 !important;
    font-size: 13px !important;
    color: var(--headings-colour) !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    transition: color 0.15s !important;
    line-height: 1.4 !important;
}
#custodiShopSidebar .widget_product_categories ul li a:hover {
    color: var(--custodi-blue-dark) !important;
}

/* Count pushed to right */
#custodiShopSidebar .widget_product_categories ul li a .count {
    margin-left: auto !important;
    font-size: 11px !important;
    color: var(--cool-slate) !important;
    font-weight: 500 !important;
    padding-left: 8px !important;
}

/* Children (subcategories) indentation */
#custodiShopSidebar .widget_product_categories ul.children {
    padding-left: 26px !important;
    padding-top: 0 !important;
    padding-bottom: 4px !important;
    padding-right: 0 !important;
}

/* Subcategory checkboxes slightly smaller */
#custodiShopSidebar .widget_product_categories ul.children li > a::before {
    width: 13px;
    height: 13px;
}

/* Brand items also get checkboxes */
#custodiShopSidebar .widget_brand_nav ul li a::before {
    content: '';
    width: 16px;
    height: 16px;
    min-width: 16px;
    border: 2px solid #B8B3AD;
    border-radius: 3px;
    margin-right: 10px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s;
    vertical-align: middle;
    box-sizing: border-box;
}
#custodiShopSidebar .widget_brand_nav ul li a {
    display: flex !important;
    align-items: center !important;
}
#custodiShopSidebar .widget_brand_nav ul li a:hover::before {
    border-color: #0088AA;
}

/* Price filter form styling */
#custodiShopSidebar .widget_price_filter form input[type="number"],
#custodiShopSidebar .widget_price_filter form input[type="text"] {
    background: var(--cool-light-sand) !important;
    font-family: var(--font-body) !important;
}
#custodiShopSidebar .widget_price_filter form input:focus {
    border-color: var(--custodi-blue-dark) !important;
    outline: none !important;
}

/* Ensure widget padding */
#custodiShopSidebar .widget {
    background: var(--pure-white) !important;
    border: 1px solid var(--cool-light-sand) !important;
    border-radius: var(--radius-md) !important;
    margin-bottom: 16px !important;
    overflow: hidden !important;
}

#custodiShopSidebar .widgettitle {
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    color: var(--headings-colour) !important;
    padding: 14px 16px !important;
    margin: 0 !important;
    border-bottom: none !important;
    font-family: var(--font-body) !important;
}

#custodiShopSidebar .widget > ul {
    padding: 0 16px 14px !important;
    margin: 0 !important;
}

/* =================================================================
   v94m — SIDEBAR CLEANUP + CARD DESCRIPTION DEPRECATION
   The card_description ACF approach was layered on to compensate for
   Quick View not working on mobile. v94m drops that complexity:
   desktop keeps WC's short description, mobile cards stay clean
   (tap card to view full product), card_description hides everywhere.
   ================================================================= */

/* Card description: hidden everywhere now. Field stays in WP for future use. */
html body ul.products li.product .custodi-card-description {
    display: none !important;
}

/* Hide the legacy product_categories widget from the shop sidebar.
   The device/brand/solution/use-case taxonomies cover the same need
   via the top tabs and the BY DEVICE sidebar widget. */
html body #custodiShopSidebar .widget_product_categories {
    display: none !important;
}

/* === MOBILE: hide ALL descriptions on cards (v94m simplification) ===
   Desktop keeps WC short description. Mobile cards stay clean:
   image, title, price, CTA only. Tap card to view full product. */
@media (max-width: 600px) {
    /* === MOBILE FULL-BLEED — v94w (expanded from v94o) ===
       Avada has multiple container classes that can add side padding:
       #main, .fusion-row, .fusion-builder-row, .fusion-builder-column,
       .fusion-page-wrap, .fusion-fullwidth, #content, #primary, .woocommerce-page.
       Zero them all out on mobile so cards truly reach screen edges. */
    body.post-type-archive-product #main,
    body.post-type-archive-product main#main,
    body.post-type-archive-product #content,
    body.post-type-archive-product #primary,
    body.post-type-archive-product .fusion-page-wrap,
    body.post-type-archive-product .woocommerce-page,
    body.tax-product_cat #main,
    body.tax-product_cat main#main,
    body.tax-product_cat #content,
    body.tax-product_cat #primary,
    body.tax-product_cat .fusion-page-wrap,
    body.tax-product_cat .woocommerce-page,
    body.tax-product_tag #main,
    body.tax-product_tag main#main,
    body.tax-product_tag #content,
    body.tax-product_tag #primary,
    body.tax-product_tag .fusion-page-wrap,
    body.tax-product_tag .woocommerce-page,
    body.tax-solution #main,
    body.tax-solution main#main,
    body.tax-solution #content,
    body.tax-solution #primary,
    body.tax-solution .fusion-page-wrap,
    body.tax-solution .woocommerce-page,
    body.tax-use_case #main,
    body.tax-use_case main#main,
    body.tax-use_case #content,
    body.tax-use_case #primary,
    body.tax-use_case .fusion-page-wrap,
    body.tax-use_case .woocommerce-page,
    body.tax-device_type #main,
    body.tax-device_type main#main,
    body.tax-device_type #content,
    body.tax-device_type #primary,
    body.tax-device_type .fusion-page-wrap,
    body.tax-device_type .woocommerce-page {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    body.post-type-archive-product #main .fusion-row,
    body.post-type-archive-product .fusion-builder-row,
    body.post-type-archive-product .fusion-builder-row-inner,
    body.post-type-archive-product .fusion-builder-column,
    body.post-type-archive-product .fusion-builder-column-inner,
    body.post-type-archive-product .fusion-builder-container,
    body.post-type-archive-product .fusion-fullwidth,
    body.tax-product_cat #main .fusion-row,
    body.tax-product_cat .fusion-builder-row,
    body.tax-product_cat .fusion-builder-row-inner,
    body.tax-product_cat .fusion-builder-column,
    body.tax-product_cat .fusion-builder-column-inner,
    body.tax-product_cat .fusion-builder-container,
    body.tax-product_cat .fusion-fullwidth,
    body.tax-product_tag #main .fusion-row,
    body.tax-product_tag .fusion-builder-row,
    body.tax-product_tag .fusion-builder-row-inner,
    body.tax-product_tag .fusion-builder-column,
    body.tax-product_tag .fusion-builder-column-inner,
    body.tax-product_tag .fusion-builder-container,
    body.tax-product_tag .fusion-fullwidth,
    body.tax-solution #main .fusion-row,
    body.tax-solution .fusion-builder-row,
    body.tax-solution .fusion-builder-column,
    body.tax-use_case #main .fusion-row,
    body.tax-use_case .fusion-builder-row,
    body.tax-use_case .fusion-builder-column,
    body.tax-device_type #main .fusion-row,
    body.tax-device_type .fusion-builder-row,
    body.tax-device_type .fusion-builder-column {
        padding-left: 0 !important;
        padding-right: 0 !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }

    /* Layout container: zero padding on mobile so cards reach screen edges (v94w).
       Even 4px was leaving visible margin per Andrew's screenshots. */
    html body .custodi-shop-layout {
        padding: 0 !important;
    }

    html body ul.products li.product .woocommerce-loop-product__excerpt,
    html body ul.products li.product .fusion-loop-excerpt,
    html body ul.products li.product .product-details-short-description,
    html body ul.products li.product .custodi-card-description,
    html body ul.products li.product .custodi-product-excerpt {
        display: none !important;
    }

    /* Hero on mobile (v94q): zero side padding, reduced top padding.
       Mobile header is ~90px, so 100px top clearance is enough.
       H1 and lead sit flush left at the screen edge with 16px text inset.
       Eyebrow matches preamble (cyan, uppercase, 2px tracking). */
    html body .custodi-shop-hero,
    html body .custodi-shop-hero-dark {
        padding: 100px 0 36px !important;
    }
    html body .custodi-shop-hero-inner {
        padding: 0 !important;
        max-width: 100% !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 4px !important;
    }
    html body .custodi-shop-hero-eyebrow {
        padding: 0 16px !important;
        margin-bottom: 10px !important;
        font-size: 10px !important;
    }
    html body .custodi-shop-hero h1 {
        font-size: 30px !important;
        margin-bottom: 10px !important;
        padding: 0 16px !important;
    }
    html body .custodi-shop-hero .custodi-shop-hero-lead {
        font-size: 14px !important;
        line-height: 1.7 !important;
        padding: 0 16px !important;
    }
}

/* === Tablet hero — between mobile and desktop === */
@media (max-width: 1024px) and (min-width: 601px) {
    html body .custodi-shop-hero,
    html body .custodi-shop-hero-dark {
        padding: 160px 0 44px !important;
    }
    html body .custodi-shop-hero h1 {
        font-size: 34px !important;
    }
    html body .custodi-shop-hero .custodi-shop-hero-lead {
        font-size: 15px !important;
    }
}

/* =========================================================================
   CUSTODI SHOP  ·  PRODUCT CARD CORNER BADGES  ·  v1.0  ·  CSS
   11 Jun 2026

   Append to the bottom of custodi-shop.css (or paste into the
   "PRODUCT CARD" section, lines 967-1430).
   ========================================================================= */


/* ============================================================
   PRODUCT CARD CORNER BADGES — v1
   Featured / Best Seller (top-left, mutually exclusive)
   On Sale (top-right)
   ============================================================ */

/* Wrapper sits absolute across the top of the card, flex layout
   pushes left badge to the left and right badge to the right. */
.custodi-card-badges {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    display: flex;
    padding: 12px;
    pointer-events: none;
    z-index: 5;
}

/* Sale badge gets margin-left:auto so it pushes to the right
   even when no left-side badge is present. */
.custodi-card-badge--sale {
    margin-left: auto;
}

/* Badge base */
.custodi-card-badge {
    display: inline-block;
    padding: 5px 11px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    color: #ffffff;
    border-radius: 3px;
    line-height: 1.2;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    pointer-events: auto;
}

/* Featured — Custodi cyan */
.custodi-card-badge--featured {
    background: #00C4E8;
}

/* Best Seller — slate. Procurement-friendly, not flashy. */
.custodi-card-badge--bestseller {
    background: #2B3237;
}

/* Sale — Custodi coral */
.custodi-card-badge--sale {
    background: #C4846B;
}

/* Make sure the product card has positioning context so the
   absolute badges land inside the card, not the page. */
.products li.product {
    position: relative;
}

/* Mobile: slightly tighter padding, smaller badges */
@media (max-width: 640px) {
    .custodi-card-badges {
        padding: 8px;
    }
    .custodi-card-badge {
        padding: 4px 9px;
        font-size: 9px;
        letter-spacing: 1px;
    }
}


/* =========================================================================
   SHOP FACETED FILTERING - v1 (16 Jun 2026)
   Multi-select brand facet, real checkbox styled to match the legacy
   fake-checkbox look. Pairs with section 20d in functions.php.
   ========================================================================= */

.custodi-shop-sidebar .custodi-facet-label {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    padding: 7px 0;
    font-size: 14px;
    color: var(--custodi-charcoal, #2B3237);
    line-height: 1.3;
    user-select: none;
    transition: color 0.15s;
}
.custodi-shop-sidebar .custodi-facet-label:hover {
    color: var(--custodi-blue-dark, #0088AA);
}

.custodi-shop-sidebar .custodi-facet-label input[type="checkbox"] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.custodi-shop-sidebar .custodi-facet-checkmark {
    width: 16px;
    height: 16px;
    min-width: 16px;
    border: 2px solid #B8B3AD;
    border-radius: 3px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s;
    background: #fff;
    position: relative;
    box-sizing: border-box;
}
.custodi-shop-sidebar .custodi-facet-label:hover .custodi-facet-checkmark {
    border-color: var(--custodi-blue-dark, #0088AA);
}

.custodi-shop-sidebar .custodi-facet-label input[type="checkbox"]:checked + .custodi-facet-checkmark {
    background: var(--custodi-blue-dark, #0088AA);
    border-color: var(--custodi-blue-dark, #0088AA);
}
.custodi-shop-sidebar .custodi-facet-label input[type="checkbox"]:checked + .custodi-facet-checkmark::after {
    content: '';
    position: absolute;
    left: 3px;
    top: -1px;
    width: 5px;
    height: 10px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.custodi-shop-sidebar .custodi-facet-label input[type="checkbox"]:focus-visible + .custodi-facet-checkmark {
    outline: 2px solid var(--custodi-blue-dark, #0088AA);
    outline-offset: 2px;
}

.custodi-shop-sidebar .custodi-facet-name {
    flex: 1;
    font-weight: 500;
}
.custodi-shop-sidebar .custodi-facet-label .count {
    color: var(--custodi-slate, #6B7780);
    font-size: 13px;
    font-weight: 400;
    flex-shrink: 0;
}

.custodi-shop-sidebar .widget_brand_facet ul {
    list-style: none;
    margin: 0;
    padding: 0 16px 14px;
}
.custodi-shop-sidebar .widget_brand_facet ul li {
    padding: 0;
    margin: 0;
}
.custodi-shop-sidebar .widget_brand_facet ul li a::before {
    display: none;
}

.custodi-shop-products {
    transition: opacity 0.18s ease;
}

.custodi-no-results {
    padding: 40px 24px;
    text-align: center;
    font-size: 15px;
    color: var(--custodi-slate, #6B7780);
    background: var(--cool-light-sand, #EBE9E6);
    border-radius: 8px;
    margin: 24px 0;
}
.custodi-no-results a {
    color: var(--custodi-blue-dark, #0088AA);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.custodi-no-results a:hover {
    color: var(--custodi-charcoal, #2B3237);
}


/* =========================================================================
   SHOP FACETED FILTERING  ·  v1  (16 Jun 2026)
   Multi-select brand facet — real checkbox styled to match the legacy
   fake-checkbox look. Pairs with section 20d in functions.php.
   ========================================================================= */

.custodi-shop-sidebar .custodi-facet-label {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    padding: 7px 0;
    font-size: 14px;
    color: var(--custodi-charcoal, #2B3237);
    line-height: 1.3;
    user-select: none;
    transition: color 0.15s;
}
.custodi-shop-sidebar .custodi-facet-label:hover {
    color: var(--custodi-blue-dark, #0088AA);
}

.custodi-shop-sidebar .custodi-facet-label input[type="checkbox"] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.custodi-shop-sidebar .custodi-facet-checkmark {
    width: 16px;
    height: 16px;
    min-width: 16px;
    border: 2px solid #B8B3AD;
    border-radius: 3px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s;
    background: #fff;
    position: relative;
    box-sizing: border-box;
}
.custodi-shop-sidebar .custodi-facet-label:hover .custodi-facet-checkmark {
    border-color: var(--custodi-blue-dark, #0088AA);
}

.custodi-shop-sidebar .custodi-facet-label input[type="checkbox"]:checked + .custodi-facet-checkmark {
    background: var(--custodi-blue-dark, #0088AA);
    border-color: var(--custodi-blue-dark, #0088AA);
}
.custodi-shop-sidebar .custodi-facet-label input[type="checkbox"]:checked + .custodi-facet-checkmark::after {
    content: '';
    position: absolute;
    left: 3px;
    top: -1px;
    width: 5px;
    height: 10px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.custodi-shop-sidebar .custodi-facet-label input[type="checkbox"]:focus-visible + .custodi-facet-checkmark {
    outline: 2px solid var(--custodi-blue-dark, #0088AA);
    outline-offset: 2px;
}

.custodi-shop-sidebar .custodi-facet-name {
    flex: 1;
    font-weight: 500;
}
.custodi-shop-sidebar .custodi-facet-label .count {
    color: var(--custodi-slate, #6B7780);
    font-size: 13px;
    font-weight: 400;
    flex-shrink: 0;
}

.custodi-shop-sidebar .widget_brand_facet ul {
    list-style: none;
    margin: 0;
    padding: 0 16px 14px;
}
.custodi-shop-sidebar .widget_brand_facet ul li {
    padding: 0;
    margin: 0;
}
.custodi-shop-sidebar .widget_brand_facet ul li a::before {
    display: none;
}

.custodi-shop-products {
    transition: opacity 0.18s ease;
}

.custodi-no-results {
    padding: 40px 24px;
    text-align: center;
    font-size: 15px;
    color: var(--custodi-slate, #6B7780);
    background: var(--cool-light-sand, #EBE9E6);
    border-radius: 8px;
    margin: 24px 0;
}
.custodi-no-results a {
    color: var(--custodi-blue-dark, #0088AA);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.custodi-no-results a:hover {
    color: var(--custodi-charcoal, #2B3237);
}


/* =========================================================================
   SHOP FACETED FILTERING  ·  v1  (16 Jun 2026)
   Multi-select brand facet — real checkbox styled to match the legacy
   fake-checkbox look. Pairs with section 20d in functions.php.
   ========================================================================= */

.custodi-shop-sidebar .custodi-facet-label {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    padding: 7px 0;
    font-size: 14px;
    color: var(--custodi-charcoal, #2B3237);
    line-height: 1.3;
    user-select: none;
    transition: color 0.15s;
}
.custodi-shop-sidebar .custodi-facet-label:hover {
    color: var(--custodi-blue-dark, #0088AA);
}

/* Hide native checkbox visually, keep it accessible. */
.custodi-shop-sidebar .custodi-facet-label input[type="checkbox"] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

/* Visible checkmark — matches the legacy 16px fake-checkbox dimensions. */
.custodi-shop-sidebar .custodi-facet-checkmark {
    width: 16px;
    height: 16px;
    min-width: 16px;
    border: 2px solid #B8B3AD;
    border-radius: 3px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s;
    background: #fff;
    position: relative;
    box-sizing: border-box;
}
.custodi-shop-sidebar .custodi-facet-label:hover .custodi-facet-checkmark {
    border-color: var(--custodi-blue-dark, #0088AA);
}

/* Checked — filled cyan with white tick. */
.custodi-shop-sidebar .custodi-facet-label input[type="checkbox"]:checked + .custodi-facet-checkmark {
    background: var(--custodi-blue-dark, #0088AA);
    border-color: var(--custodi-blue-dark, #0088AA);
}
.custodi-shop-sidebar .custodi-facet-label input[type="checkbox"]:checked + .custodi-facet-checkmark::after {
    content: '';
    position: absolute;
    left: 3px;
    top: -1px;
    width: 5px;
    height: 10px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* Keyboard focus indicator on the checkmark surrogate. */
.custodi-shop-sidebar .custodi-facet-label input[type="checkbox"]:focus-visible + .custodi-facet-checkmark {
    outline: 2px solid var(--custodi-blue-dark, #0088AA);
    outline-offset: 2px;
}

.custodi-shop-sidebar .custodi-facet-name {
    flex: 1;
    font-weight: 500;
}
.custodi-shop-sidebar .custodi-facet-label .count {
    color: var(--custodi-slate, #6B7780);
    font-size: 13px;
    font-weight: 400;
    flex-shrink: 0;
}

/* Override legacy <a>::before fake-checkbox on the new facet variant. */
.custodi-shop-sidebar .widget_brand_facet ul {
    list-style: none;
    margin: 0;
    padding: 0 16px 14px;
}
.custodi-shop-sidebar .widget_brand_facet ul li {
    padding: 0;
    margin: 0;
}
.custodi-shop-sidebar .widget_brand_facet ul li a::before {
    display: none;
}

/* AJAX refresh fade. */
.custodi-shop-products {
    transition: opacity 0.18s ease;
}

/* No-results message when filters return zero products. */
.custodi-no-results {
    padding: 40px 24px;
    text-align: center;
    font-size: 15px;
    color: var(--custodi-slate, #6B7780);
    background: var(--cool-light-sand, #EBE9E6);
    border-radius: 8px;
    margin: 24px 0;
}
.custodi-no-results a {
    color: var(--custodi-blue-dark, #0088AA);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.custodi-no-results a:hover {
    color: var(--custodi-charcoal, #2B3237);
}

/* =========================================================================
   ACTIVE-FILTER CHIP STRIP - v1  (16 Jun 2026)
   Appears above the product grid once any sidebar filter is applied.
   Each chip is a removable pill. "Clear all" surfaces once 2+ chips are
   active. Re-rendered after every Apply Filters by section 20d's JS.
   ========================================================================= */

.custodi-shop-products .custodi-filter-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    padding: 14px 0 18px;
    margin-bottom: 8px;
    border-bottom: 1px solid var(--cool-light-sand, #EBE9E6);
}

.custodi-shop-products .custodi-filter-chips__label {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: var(--custodi-slate, #6B7780);
    margin-right: 4px;
}

/* Chip - rounded pill with text + remove icon. Cyan-tinted so it reads
   as an active state. */
.custodi-shop-products .custodi-filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 6px 6px 12px;
    background: rgba(0, 196, 232, 0.10);
    border: 1px solid rgba(0, 196, 232, 0.35);
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    color: var(--custodi-charcoal, #2B3237);
    cursor: pointer;
    font-family: inherit;
    line-height: 1.3;
    transition: background 0.15s, border-color 0.15s;
}
.custodi-shop-products .custodi-filter-chip:hover {
    background: rgba(0, 196, 232, 0.18);
    border-color: var(--custodi-blue-dark, #0088AA);
}

.custodi-shop-products .custodi-filter-chip__text {
    white-space: nowrap;
}

/* The X close indicator inside each chip. */
.custodi-shop-products .custodi-filter-chip__remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(43, 50, 55, 0.08);
    color: var(--custodi-slate, #6B7780);
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    transition: background 0.15s, color 0.15s;
}
.custodi-shop-products .custodi-filter-chip:hover .custodi-filter-chip__remove {
    background: var(--custodi-blue-dark, #0088AA);
    color: #ffffff;
}

/* "Clear all" - subtle link styling, sits at the end of the strip. */
.custodi-shop-products .custodi-filter-chips__clear-all {
    margin-left: 8px;
    padding: 6px 10px;
    background: none;
    border: none;
    color: var(--custodi-slate, #6B7780);
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    cursor: pointer;
    font-family: inherit;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: rgba(107, 119, 128, 0.4);
    transition: color 0.15s, text-decoration-color 0.15s;
}
.custodi-shop-products .custodi-filter-chips__clear-all:hover {
    color: var(--custodi-charcoal, #2B3237);
    text-decoration-color: var(--custodi-charcoal, #2B3237);
}

/* Mobile: tighten padding, allow horizontal scroll if many chips. */
@media (max-width: 640px) {
    .custodi-shop-products .custodi-filter-chips {
        padding: 12px 0 14px;
        gap: 6px;
    }
    .custodi-shop-products .custodi-filter-chip {
        font-size: 12px;
        padding: 5px 5px 5px 10px;
    }
    .custodi-shop-products .custodi-filter-chip__remove {
        width: 16px;
        height: 16px;
        font-size: 14px;
    }
}


/* =========================================================================
   MOBILE FILTER DRAWER POLISH - v1  (16 Jun 2026)
   - Wider drawer (min(420px, 100vw)) instead of 300px
   - Corner X close button (replaces text button at top)
   - Filter toggle: clean icon + label + count badge for active filters
   - Drawer closes after Apply (handled in section 20d JS)
   ========================================================================= */

@media (max-width: 900px) {

    /* WIDER DRAWER - feels closer to full-screen on phones, caps at 420px on
       larger tablets so it doesn't dominate. Slides in from the LEFT. */
    .custodi-shop-sidebar {
        width: min(420px, 100vw) !important;
        left: calc(-1 * min(420px, 100vw)) !important;
        padding: 16px 16px 0 !important;
        box-shadow: 0 0 32px rgba(0, 0, 0, 0.35) !important;
    }
    .custodi-shop-sidebar.open {
        left: 0 !important;
    }

    /* FILTER TOGGLE BUTTON - sticky at top of grid, cleaner SVG icon,
       "Filters" label, count badge appears when filters are active. */
    html body .custodi-filter-toggle,
    html body button.custodi-filter-toggle {
        display: inline-flex !important;
        position: sticky !important;
        top: 60px !important;
        z-index: 50 !important;
        background: var(--pure-white, #ffffff) !important;
        border: 1px solid var(--cool-light-sand, #EBE9E6) !important;
        border-radius: 8px !important;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
        margin: 12px 10px 14px !important;
        padding: 12px 16px !important;
        font-weight: 700 !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 10px !important;
        width: auto !important;
        min-width: 140px !important;
        font-size: 13px !important;
        color: var(--headings-colour, #2B3237) !important;
        cursor: pointer !important;
        text-transform: none !important;
        letter-spacing: 0 !important;
    }
    /* Remove the legacy ::before/::after pseudo-elements. */
    html body .custodi-filter-toggle::before,
    html body .custodi-filter-toggle::after {
        content: none !important;
        display: none !important;
    }
    html body .custodi-filter-toggle--active {
        border-color: var(--custodi-blue-dark, #0088AA) !important;
        color: var(--custodi-blue-dark, #0088AA) !important;
    }

    /* Count badge inside the toggle button. Cyan pill with white number. */
    .custodi-filter-toggle__count {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 20px;
        height: 20px;
        padding: 0 6px;
        background: var(--custodi-blue-dark, #0088AA);
        color: #ffffff;
        font-size: 11px;
        font-weight: 700;
        border-radius: 999px;
        line-height: 1;
        margin-left: 2px;
    }
    .custodi-filter-toggle__count[hidden] { display: none !important; }
    .custodi-filter-toggle__label { line-height: 1; }

    /* CLOSE X - top-right of drawer, replaces the old text button. */
    .custodi-sidebar-close {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: absolute !important;
        top: 12px !important;
        right: 12px !important;
        width: 38px !important;
        height: 38px !important;
        padding: 0 !important;
        background: rgba(43, 50, 55, 0.06) !important;
        border: 1px solid var(--cool-light-sand, #EBE9E6) !important;
        border-radius: 8px !important;
        color: var(--custodi-slate, #6B7780) !important;
        cursor: pointer !important;
        margin: 0 !important;
        z-index: 10 !important;
        transition: background 0.15s, color 0.15s !important;
    }
    .custodi-sidebar-close:hover {
        background: rgba(43, 50, 55, 0.12) !important;
        color: var(--custodi-charcoal, #2B3237) !important;
    }
    .custodi-sidebar-close svg { display: block; }

    /* Add top padding to sidebar so the first widget doesn't sit under the X. */
    .custodi-shop-sidebar { padding-top: 62px !important; }

    /* Sticky Apply/Clear footer - reinforce inside the drawer so it stays at
       viewport bottom while user scrolls long facet lists. */
    .custodi-shop-sidebar .custodi-facet-footer {
        margin-left: -16px !important;
        margin-right: -16px !important;
        margin-bottom: 0 !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    /* Tighten the chip strip on mobile so it doesn't push the grid down. */
    .custodi-shop-products .custodi-filter-chips {
        padding: 10px 0 12px;
        gap: 6px;
    }
}


/* =========================================================================
   MOBILE FIXES  (16 Jun 2026)
   - Hide the inline FiboSearch icon on phones (header search icon is the
     universal entry point; the inline one was cramping the browse tabs row).
   - Re-force Sale badge bright red on mobile, where a media-query rule was
     overriding the polish CSS color.
   ========================================================================= */

@media (max-width: 900px) {
    /* Inline FiboSearch in browse-tabs row - redundant on mobile. */
    .custodi-shop-search,
    body .custodi-shop-search {
        display: none !important;
    }
}

/* Bright red Sale badge - higher specificity to win on mobile breakpoints. */
html body ul.products li.product .custodi-card-badge--sale,
html body .products li.product .custodi-card-badge--sale {
    background: #DC2626 !important;
    color: #ffffff !important;
}

/* =========================================================================
   CUSTODI SHOP - FACET STYLING v2  (16 Jun 2026)
   Phase 3 additions: Availability radios, Featured In pills, Apply/Clear
   sticky footer, pending-state highlight on Apply button.

   APPEND THIS to custodi-shop.css below the v1 facet CSS block.
   ========================================================================= */


/* ============================================================
   RADIO FACET (Availability)
   Reuses .custodi-facet-label structure from v1, adds the
   --radio modifier for the round radiomark instead of square
   checkmark.
============================================================ */
.custodi-shop-sidebar .custodi-facet-label--radio input[type="radio"] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.custodi-shop-sidebar .custodi-facet-radiomark {
    width: 16px;
    height: 16px;
    min-width: 16px;
    border: 2px solid #B8B3AD;
    border-radius: 50%;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s;
    background: #fff;
    position: relative;
    box-sizing: border-box;
}

.custodi-shop-sidebar .custodi-facet-label--radio:hover .custodi-facet-radiomark {
    border-color: var(--custodi-blue-dark, #0088AA);
}

.custodi-shop-sidebar .custodi-facet-label--radio input[type="radio"]:checked + .custodi-facet-radiomark {
    border-color: var(--custodi-blue-dark, #0088AA);
}

.custodi-shop-sidebar .custodi-facet-label--radio input[type="radio"]:checked + .custodi-facet-radiomark::after {
    content: '';
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--custodi-blue-dark, #0088AA);
}

.custodi-shop-sidebar .custodi-facet-label--radio input[type="radio"]:focus-visible + .custodi-facet-radiomark {
    outline: 2px solid var(--custodi-blue-dark, #0088AA);
    outline-offset: 2px;
}


/* ============================================================
   PILL FACET (Featured In)
   Pills wrap into rows. Selected = filled cyan. Hover = cyan border.
============================================================ */
.custodi-shop-sidebar .custodi-facet-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 4px 16px 16px;
}

.custodi-shop-sidebar .custodi-facet-pill {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    user-select: none;
    position: relative;
}

.custodi-shop-sidebar .custodi-facet-pill input[type="checkbox"] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.custodi-shop-sidebar .custodi-facet-pill-text {
    display: inline-block;
    padding: 7px 14px;
    border-radius: 999px;
    background: #fff;
    border: 1.5px solid #B8B3AD;
    font-size: 12px;
    font-weight: 600;
    color: var(--custodi-charcoal, #2B3237);
    letter-spacing: 0.2px;
    line-height: 1.3;
    transition: all 0.15s;
    box-sizing: border-box;
    white-space: nowrap;
}

.custodi-shop-sidebar .custodi-facet-pill:hover .custodi-facet-pill-text {
    border-color: var(--custodi-blue-dark, #0088AA);
    color: var(--custodi-blue-dark, #0088AA);
}

.custodi-shop-sidebar .custodi-facet-pill input[type="checkbox"]:checked + .custodi-facet-pill-text {
    background: var(--custodi-blue-dark, #0088AA);
    border-color: var(--custodi-blue-dark, #0088AA);
    color: #fff;
}

.custodi-shop-sidebar .custodi-facet-pill input[type="checkbox"]:focus-visible + .custodi-facet-pill-text {
    outline: 2px solid var(--custodi-blue-dark, #0088AA);
    outline-offset: 2px;
}


/* ============================================================
   APPLY / CLEAR FOOTER
   Sticky to the bottom of the sidebar viewport. Apply has a
   "pending" state that activates when the user has unsaved
   changes (boxes ticked / radio changed / price input touched).
============================================================ */
.custodi-shop-sidebar .custodi-facet-footer {
    position: sticky;
    bottom: 0;
    background: #fff;
    padding: 14px 16px;
    margin: 16px -16px 0;
    border-top: 1px solid #E5E1DC;
    display: flex;
    flex-direction: column;
    gap: 8px;
    z-index: 5;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.04);
}

.custodi-shop-sidebar .custodi-facet-apply {
    width: 100%;
    padding: 11px 16px;
    background: #2B3237;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    cursor: pointer;
    font-family: inherit;
    transition: background 0.18s, transform 0.12s, box-shadow 0.18s;
}

.custodi-shop-sidebar .custodi-facet-apply:hover {
    background: var(--custodi-blue-dark, #0088AA);
}

/* Pending state - user has made changes that haven't been applied yet.
   Cyan-tinted to draw the eye toward Apply. */
.custodi-shop-sidebar .custodi-facet-apply--pending {
    background: var(--custodi-blue-dark, #0088AA);
    box-shadow: 0 0 0 3px rgba(0, 196, 232, 0.18), 0 4px 14px rgba(0, 136, 170, 0.25);
}

.custodi-shop-sidebar .custodi-facet-apply--pending:hover {
    background: #0099BB;
}

.custodi-shop-sidebar .custodi-facet-apply:focus-visible {
    outline: 2px solid var(--custodi-blue-dark, #0088AA);
    outline-offset: 2px;
}

.custodi-shop-sidebar .custodi-facet-clear {
    width: 100%;
    padding: 8px 16px;
    background: none;
    color: var(--custodi-slate, #6B7780);
    border: none;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    cursor: pointer;
    font-family: inherit;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: rgba(107, 119, 128, 0.4);
    transition: color 0.18s, text-decoration-color 0.18s;
}

.custodi-shop-sidebar .custodi-facet-clear:hover {
    color: var(--custodi-charcoal, #2B3237);
    text-decoration-color: var(--custodi-charcoal, #2B3237);
}


/* ============================================================
   WIDGET CONTAINER ADJUSTMENTS for new widget classes
============================================================ */
.custodi-shop-sidebar .widget_availability_facet_box ul,
.custodi-shop-sidebar .widget_featured_in_facet_box,
.custodi-shop-sidebar .widget_device_facet_box ul,
.custodi-shop-sidebar .widget_solution_facet_box ul,
.custodi-shop-sidebar .widget_use_case_facet_box ul {
    list-style: none;
    margin: 0;
    padding: 0 16px 14px;
}

.custodi-shop-sidebar .widget_availability_facet_box ul li,
.custodi-shop-sidebar .widget_device_facet_box ul li,
.custodi-shop-sidebar .widget_solution_facet_box ul li,
.custodi-shop-sidebar .widget_use_case_facet_box ul li {
    padding: 0;
    margin: 0;
}

/* Disable legacy fake-checkbox treatment on these new widget classes. */
.custodi-shop-sidebar .widget_availability_facet_box ul li a::before,
.custodi-shop-sidebar .widget_device_facet_box ul li a::before,
.custodi-shop-sidebar .widget_solution_facet_box ul li a::before,
.custodi-shop-sidebar .widget_use_case_facet_box ul li a::before {
    display: none;
}

/* =========================================================================
   CUSTODI SHOP - POLISH v1  (16 Jun 2026)
   Card badge color refresh + was-price visibility + removal of Avada/WC
   duplicate bottom widgets (Sort by + Show N Products).

   APPEND THIS to custodi-shop.css below the v2 facet CSS block.
   ========================================================================= */


/* ============================================================
   CARD BADGE COLOR REFRESH
   - Sale: brighter red, stronger urgency signal
   - Best Seller: green, procurement-friendly, signals trust
   - Featured: stays Custodi cyan (no change)
============================================================ */

/* Sale - bright red. Overrides the coral from earlier. */
ul.products li.product .custodi-card-badge--sale,
.products li.product .custodi-card-badge--sale,
.custodi-card-badge--sale {
    background: #DC2626 !important;
}

/* Best Seller - green with white text. Procurement signal. */
ul.products li.product .custodi-card-badge--bestseller,
.products li.product .custodi-card-badge--bestseller,
.custodi-card-badge--bestseller {
    background: #16A34A !important;
    color: #ffffff !important;
}


/* ============================================================
   WAS-PRICE VISIBILITY
   Strikethrough original price was rendering near-invisible
   (--border-color is the page divider grey). Bumped to slate
   so the discount delta is legible without competing with the
   active sale price.
============================================================ */
ul.products li.product .price del,
ul.products li.product .price del .woocommerce-Price-amount,
.fusion-woocommerce-quick-view-container .price del,
.fusion-woocommerce-quick-view-container .price del .woocommerce-Price-amount {
    color: #555555 !important;
    font-weight: 500 !important;
}


/* ============================================================
   REMOVE DUPLICATE BOTTOM WIDGETS
   Avada / WC render a second sort dropdown, result count, and
   per-page selector after the product grid. Section 20 already
   moves the canonical ordering / count to the top. Hide the
   bottom duplicates - pagination is the only thing the buyer
   should see beneath the cards.
============================================================ */

/* Avada renders a duplicate sort + per-page widget block beneath
   the product grid. Verified wrapper class via Inspect Element:
   div.catalog-ordering.fusion-clearfix. Contains:
     - .orderby-order-container (Sort by Default Order dropdown)
     - .sort-count.order-dropdown (Show N Products dropdown)
   Pagination is the only thing the buyer should see below the cards. */
div.catalog-ordering,
div.catalog-ordering.fusion-clearfix,
.fusion-clearfix.catalog-ordering {
    display: none !important;
}


/* ============================================================
   REMOVE DEFAULT WOOCOMMERCE SALE FLASH
   WC outputs a "Sale!" badge in the top-left of every sale product.
   On Featured products the FEATURED corner badge covers it, but on
   non-Featured sale products both show. Hide the WC default so only
   the custom .custodi-card-badge--sale (top-right, bright red) appears.
============================================================ */
ul.products li.product .onsale,
.products li.product .onsale,
li.product > .onsale,
li.product span.onsale {
    display: none !important;
}


/* =========================================================================
   MOBILE DRAWER + PRICE FIXES  (16 Jun 2026)
   - Apply/Clear footer pinned to viewport bottom when drawer is open
     (sticky was flickering on iOS/Android scroll)
   - Filters toggle button: full width on mobile
   - Inline FiboSearch hide: higher specificity
   - Sale prices stay on one line (was wrapping for 3-digit prices)
   ========================================================================= */

/* ---- Inline FiboSearch hide on mobile - bumped specificity ---- */
@media (max-width: 900px) {
    html body .custodi-shop-search,
    html body .custodi-shop-search.custodi-shop-search {
        display: none !important;
    }
}

/* ---- Filters toggle: full width on mobile ---- */
@media (max-width: 900px) {
    html body .custodi-filter-toggle,
    html body button.custodi-filter-toggle {
        width: calc(100% - 20px) !important;
        min-width: 0 !important;
        margin: 12px 10px 14px !important;
        justify-content: center !important;
    }
    /* Re-balance internal alignment - icon left, label centered, count right */
    html body .custodi-filter-toggle {
        gap: 10px !important;
    }
    html body .custodi-filter-toggle .custodi-filter-toggle__label {
        flex: 1;
        text-align: center;
    }
}

/* ---- Apply/Clear footer pinned to viewport bottom in mobile drawer ---- */
@media (max-width: 900px) {
    .custodi-shop-sidebar.open .custodi-facet-footer,
    body .custodi-shop-sidebar.open .custodi-facet-footer {
        position: fixed !important;
        left: 0 !important;
        right: auto !important;
        bottom: 0 !important;
        width: min(420px, 100vw) !important;
        margin: 0 !important;
        padding: 14px 16px !important;
        z-index: 10001 !important;
        background: #ffffff !important;
        border-top: 1px solid #E5E1DC !important;
        box-shadow: 0 -6px 18px rgba(0, 0, 0, 0.08) !important;
    }
    /* Give the scroll area room so content doesn't hide under the fixed footer.
       Apply / Clear stack is ~96px tall (44px button + 30px clear + 22px padding) */
    .custodi-shop-sidebar.open {
        padding-bottom: 110px !important;
    }
}

/* ---- Sale price - keep old + new on a single line, even at 3+ digits ---- */
ul.products li.product .price,
.products li.product .price {
    display: inline-flex !important;
    align-items: baseline !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
    white-space: nowrap !important;
}
ul.products li.product .price del,
ul.products li.product .price ins,
.products li.product .price del,
.products li.product .price ins {
    display: inline-block !important;
    margin: 0 !important;
}
ul.products li.product .price del .woocommerce-Price-amount,
ul.products li.product .price ins .woocommerce-Price-amount {
    white-space: nowrap !important;
}


/* ---- Sale price single-line - higher specificity to beat the existing
        .fusion-product-content .price rule. Forces inline-flex with nowrap
        on the price container and inline-block on del/ins so both prices
        sit side-by-side even for 3-digit values like $119.00. ---- */
ul.products li.product .fusion-product-content .price,
ul.products li.product .fusion-product-content span.price,
ul.products li.product .product-details .price,
ul.products li.product span.price,
ul.products li.product .price {
    display: inline-flex !important;
    flex-wrap: nowrap !important;
    align-items: baseline !important;
    gap: 6px !important;
    white-space: nowrap !important;
}
ul.products li.product .fusion-product-content .price del,
ul.products li.product .fusion-product-content .price ins,
ul.products li.product .product-details .price del,
ul.products li.product .product-details .price ins,
ul.products li.product .price del,
ul.products li.product .price ins {
    display: inline-block !important;
    margin: 0 !important;
    line-height: 1.2 !important;
}
/* Hide the screen-reader-text "Original price was:" / "Current price is:" -
   it was injecting between del and ins, contributing to the wrap. */
ul.products li.product .price .screen-reader-text {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
}


/* ---- POA stock status "Available to Order" - orange to honestly signal
        "not held, fulfilled to order" and stand out from In Stock green ---- */
ul.products li.product .custodi-stock-status.available-to-order,
.products li.product .custodi-stock-status.available-to-order {
    color: #f97316 !important;
}
ul.products li.product .custodi-stock-status.available-to-order::before,
.products li.product .custodi-stock-status.available-to-order::before {
    background: #f97316 !important;
}

/* POA sub-label "Quote on request" inherits .custodi-gst-label styling so it
   matches the visual weight of "incl. GST" beneath regular prices. Slight
   color shift to charcoal so it reads as a quote prompt, not pricing detail. */
ul.products li.product .custodi-poa-sublabel,
.products li.product .custodi-poa-sublabel {
    color: #6B7780 !important;
    font-style: italic !important;
}


/* ---- Available to Order bullet dot - orange to match text ---- */
ul.products li.product .custodi-stock-status.available-to-order::before,
.products li.product .custodi-stock-status.available-to-order::before {
    content: "●" !important;
    font-size: 9px !important;
    background: transparent !important;
    color: #f97316 !important;
    display: inline !important;
}

/* ---- POA: inherit size from .price wrapper so they always match.
        Higher specificity (.fusion-product-content) to beat the
        existing .price font-size: 22px rule's cascade. ---- */
ul.products li.product .price .custodi-poa,
ul.products li.product .fusion-product-content .price .custodi-poa,
ul.products li.product span.price .custodi-poa {
    font-size: inherit !important;
    line-height: inherit !important;
    font-weight: 800 !important;
    color: #0088AA !important;
}


/* ============================================================
   SHOP CARD STOCK + SKU ROW
   The stock badge (In Stock) and SKU code sit on one row,
   stock left, SKU right. Wrapper opened/closed via PHP hooks
   at priorities 14 and 21 on woocommerce_after_shop_loop_item_title
   (see functions.php). SKU font matches the In Stock label.
   ============================================================ */
.custodi-card-stock-sku-row {
    display: flex !important;
    justify-content: space-between !important;
    align-items: baseline !important;
    gap: 12px !important;
    padding: 6px 0 4px !important;
}
ul.products li.product .custodi-card-sku,
.custodi-card-sku {
    font-size: 12px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    letter-spacing: 0.3px !important;
    color: #2B3237 !important;
    text-align: right !important;
    padding: 0 !important;
    margin: 0 !important;
}