/* IndoSurgicals Mobile Header — Ultra Modern v1.1
 * MOBILE ONLY. Desktop >= 901px is intentionally untouched.
 * Structure preserved: brand + cart / search / Menu + Quick Quote.
 */

@media only screen and (max-width: 900px) {
    /* ---------- Header canvas ---------- */
    html body .header_container.isp-site-header {
        border: 0 !important;
        background:
            radial-gradient(circle at 92% 0%, rgba(35, 190, 173, .075), transparent 28%),
            linear-gradient(180deg, #ffffff 0%, #fbfdfd 100%) !important;
        box-shadow: none !important;
    }

    html body .header_container .isp-header-inner {
        width: min(calc(100% - 28px), var(--isp-chrome-width)) !important;
        min-height: 0 !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-template-areas:
            "brand actions"
            "search search" !important;
        align-items: center !important;
        column-gap: 12px !important;
        row-gap: 11px !important;
        padding: 12px 0 11px !important;
    }

    html body .isp-header-brand,
    html body .isp-header-actions,
    html body .isp-header-search {
        min-width: 0 !important;
    }

    html body .isp-header-brand {
        display: flex !important;
        align-items: center !important;
    }

    html body .header_container .isp-header-logo {
        display: inline-flex !important;
        align-items: center !important;
        max-width: 100% !important;
        -webkit-tap-highlight-color: transparent !important;
    }

    html body .isp-header-logo img {
        width: clamp(154px, 44vw, 182px) !important;
        max-width: 100% !important;
        height: auto !important;
        display: block !important;
    }

    html body .header_container .isp-certification {
        display: none !important;
    }

    /* ---------- Cart: precision circular action ---------- */
    html body .isp-header-actions {
        gap: 0 !important;
    }

    html body .header_container .isp-enquiry-cart {
        position: relative !important;
        width: 47px !important;
        min-width: 47px !important;
        height: 47px !important;
        min-height: 47px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 0 !important;
        padding: 0 !important;
        border: 1px solid rgba(11, 130, 122, .13) !important;
        border-radius: 50% !important;
        background: rgba(239, 249, 247, .90) !important;
        box-shadow:
            0 8px 22px rgba(26, 61, 78, .075),
            inset 0 1px 0 rgba(255, 255, 255, .92) !important;
        transform: none !important;
        -webkit-tap-highlight-color: transparent !important;
        transition: transform .16s ease, box-shadow .16s ease, background-color .16s ease !important;
    }

    html body .header_container .isp-enquiry-cart:hover,
    html body .header_container .isp-enquiry-cart:focus-visible {
        background: #edf9f7 !important;
        box-shadow:
            0 0 0 4px rgba(10, 151, 140, .09),
            0 10px 24px rgba(26, 61, 78, .10) !important;
        outline: 0 !important;
    }

    html body .header_container .isp-enquiry-cart:active {
        transform: scale(.96) !important;
    }

    html body .isp-cart-icon {
        width: 39px !important;
        height: 39px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 50% !important;
        background: linear-gradient(145deg, #0aa59a 0%, #008b84 58%, #007b76 100%) !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, .22),
            0 5px 13px rgba(0, 128, 120, .18) !important;
    }

    html body .isp-cart-icon svg {
        width: 20px !important;
        height: 20px !important;
    }

    html body .isp-cart-copy {
        display: none !important;
    }

    html body .isp-cart-count {
        top: -4px !important;
        right: -5px !important;
        min-width: 20px !important;
        height: 20px !important;
        padding: 0 5px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        transform: none !important;
        border: 2px solid #ffffff !important;
        border-radius: 999px !important;
        background: #183548 !important;
        color: #ffffff !important;
        box-shadow: 0 4px 10px rgba(21, 49, 68, .22) !important;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-size: 10px !important;
        line-height: 16px !important;
        font-weight: 800 !important;
    }

    /* ---------- Search: floating inset command field ---------- */
    html body .isp-header-search {
        width: 100% !important;
    }

    html body .isp-search-form {
        position: relative !important;
        width: 100% !important;
        height: 52px !important;
        min-height: 52px !important;
        display: flex !important;
        align-items: center !important;
        overflow: hidden !important;
        border: 1px solid rgba(39, 86, 105, .08) !important;
        border-radius: 18px !important;
        background: #f2f6f7 !important;
        box-shadow:
            inset 0 1px 2px rgba(29, 61, 78, .025),
            0 7px 20px rgba(29, 61, 78, .055) !important;
        transition: background-color .18s ease, box-shadow .18s ease, border-color .18s ease !important;
    }

    html body .isp-search-form:hover {
        background: #f0f5f6 !important;
    }

    html body .isp-search-form:focus-within {
        border-color: rgba(0, 148, 139, .28) !important;
        background: #ffffff !important;
        box-shadow:
            0 0 0 4px rgba(0, 148, 139, .085),
            0 10px 26px rgba(29, 61, 78, .075) !important;
    }

    html body .isp-search-icon {
        left: 16px !important;
        width: 19px !important;
        height: 19px !important;
        fill: #5f7686 !important;
        opacity: .92 !important;
    }

    html body .header_container .isp-search-form input {
        height: 50px !important;
        min-height: 50px !important;
        flex: 1 1 auto !important;
        min-width: 0 !important;
        padding: 0 9px 0 45px !important;
        border: 0 !important;
        background: transparent !important;
        color: #1d3b4e !important;
        box-shadow: none !important;
        outline: 0 !important;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-size: 16px !important;
        line-height: 50px !important;
        font-weight: 560 !important;
        letter-spacing: -.01em !important;
    }

    html body .header_container .isp-search-form input::placeholder {
        color: #758796 !important;
        opacity: 1 !important;
        font-weight: 500 !important;
    }

    html body .isp-search-form button {
        width: auto !important;
        min-width: 82px !important;
        height: 42px !important;
        min-height: 42px !important;
        flex: 0 0 auto !important;
        margin: 4px !important;
        padding: 0 15px !important;
        border: 0 !important;
        border-radius: 14px !important;
        background: linear-gradient(145deg, #0aa49a 0%, #008b84 58%, #007c76 100%) !important;
        color: #ffffff !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, .19),
            0 5px 12px rgba(0, 126, 119, .17) !important;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-size: 13px !important;
        line-height: 1 !important;
        font-weight: 800 !important;
        letter-spacing: -.01em !important;
        cursor: pointer !important;
        transition: transform .15s ease, box-shadow .15s ease, filter .15s ease !important;
    }

    html body .isp-search-form button:hover,
    html body .isp-search-form button:focus-visible {
        filter: brightness(.985) saturate(1.04) !important;
        box-shadow:
            0 0 0 3px rgba(0, 143, 135, .10),
            0 7px 15px rgba(0, 126, 119, .20) !important;
        outline: 0 !important;
    }

    html body .isp-search-form button:active {
        transform: scale(.97) !important;
    }

    /* ---------- Navigation: floating mobile command dock ---------- */
    html body #menu.isp-site-nav {
        position: sticky !important;
        top: 0 !important;
        z-index: 1000 !important;
        padding: 7px 0 8px !important;
        border: 0 !important;
        background: rgba(255, 255, 255, .90) !important;
        box-shadow: 0 9px 20px rgba(24, 52, 70, .055) !important;
        -webkit-backdrop-filter: blur(14px) saturate(1.12) !important;
        backdrop-filter: blur(14px) saturate(1.12) !important;
    }

    html body #menu .isp-nav-inner {
        width: min(calc(100% - 28px), var(--isp-chrome-width)) !important;
    }

    html body #menu .isp-mobile-nav-row {
        min-height: 54px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 7px !important;
        padding: 5px !important;
        border: 1px solid rgba(255, 255, 255, .08) !important;
        border-radius: 18px !important;
        background:
            radial-gradient(circle at 88% 25%, rgba(34, 191, 174, .16), transparent 30%),
            linear-gradient(145deg, #29495d 0%, #213d50 54%, #1c3547 100%) !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, .08),
            0 9px 24px rgba(25, 52, 69, .16) !important;
    }

    html body #menu .isp-mobile-menu-toggle,
    html body #menu .isp-mobile-quick-quote {
        height: 44px !important;
        min-height: 44px !important;
        margin: 0 !important;
        border: 0 !important;
        border-radius: 14px !important;
        color: #ffffff !important;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-size: 14px !important;
        line-height: 1 !important;
        font-weight: 760 !important;
        letter-spacing: -.01em !important;
        white-space: nowrap !important;
        -webkit-tap-highlight-color: transparent !important;
        transition: transform .15s ease, background-color .15s ease, box-shadow .15s ease !important;
    }

    html body #menu .isp-mobile-menu-toggle {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        justify-content: flex-start !important;
        gap: 10px !important;
        padding: 0 13px !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html body #menu .isp-mobile-menu-toggle:hover,
    html body #menu .isp-mobile-menu-toggle:focus-visible,
    html body #menu.is-menu-open .isp-mobile-menu-toggle {
        background: rgba(255, 255, 255, .08) !important;
        outline: 0 !important;
    }

    html body #menu .isp-mobile-menu-toggle:active {
        transform: scale(.98) !important;
    }

    html body #menu .isp-menu-icon {
        width: 20px !important;
        display: grid !important;
        gap: 4px !important;
    }

    html body #menu .isp-menu-icon span {
        height: 2px !important;
        border-radius: 99px !important;
        background: #ffffff !important;
        opacity: .94 !important;
    }

    html body #menu .isp-mobile-quick-quote {
        flex: 0 0 auto !important;
        min-width: 132px !important;
        justify-content: center !important;
        gap: 8px !important;
        padding: 0 14px !important;
        background: linear-gradient(145deg, #09aa9f 0%, #00968e 55%, #00847e 100%) !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, .18),
            0 6px 15px rgba(0, 125, 118, .24) !important;
    }

    html body #menu .isp-mobile-quick-quote:hover,
    html body #menu .isp-mobile-quick-quote:focus-visible {
        box-shadow:
            0 0 0 3px rgba(54, 221, 204, .13),
            0 8px 17px rgba(0, 125, 118, .28) !important;
        outline: 0 !important;
    }

    html body #menu .isp-mobile-quick-quote:active {
        transform: scale(.975) !important;
    }

    html body #menu .isp-mobile-quick-quote svg {
        width: 18px !important;
        height: 18px !important;
        fill: none !important;
        stroke: currentColor !important;
        stroke-width: 2 !important;
        stroke-linecap: round !important;
        stroke-linejoin: round !important;
    }

    /* ---------- Open menu: floating sheet ---------- */
    html body #menu .isp-primary-navigation {
        padding: 7px 0 2px !important;
    }

    html body #menu .isp-primary-menu {
        padding: 7px !important;
        border: 1px solid rgba(29, 66, 84, .08) !important;
        border-radius: 18px !important;
        background: rgba(255, 255, 255, .985) !important;
        box-shadow: 0 18px 42px rgba(24, 52, 70, .18) !important;
    }

    html body #menu .isp-primary-menu > li {
        border-bottom: 1px solid #edf2f3 !important;
    }

    html body #menu .isp-primary-menu > li:last-child {
        border-bottom: 0 !important;
    }

    html body #menu .isp-primary-menu > li > a,
    html body #menu .isp-products-main-link {
        min-height: 46px !important;
        padding-left: 13px !important;
        padding-right: 13px !important;
        border-radius: 11px !important;
        color: #27475a !important;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-size: 14px !important;
        font-weight: 680 !important;
    }

    html body #menu .isp-primary-menu > li:hover > a,
    html body #menu .isp-primary-menu > li:focus-within > a,
    html body #menu .isp-primary-menu > li.is-active > a,
    html body #menu .isp-products-menu:hover .isp-products-trigger-wrap,
    html body #menu .isp-products-menu:focus-within .isp-products-trigger-wrap,
    html body #menu .isp-products-menu.is-active .isp-products-trigger-wrap {
        background: #f1f8f7 !important;
    }

    html body #menu .isp-products-toggle {
        min-width: 46px !important;
        min-height: 46px !important;
        border-radius: 11px !important;
        color: #31596d !important;
    }

    html body #menu .isp-nav-quote-item a,
    html body #menu .isp-nav-quote {
        color: #ffffff !important;
        background: linear-gradient(145deg, #0aa49a, #008a83) !important;
    }
}

@media only screen and (max-width: 430px) {
    html body .header_container .isp-header-inner,
    html body #menu .isp-nav-inner {
        width: calc(100% - 20px) !important;
    }

    html body .header_container .isp-header-inner {
        row-gap: 10px !important;
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    html body .isp-header-logo img {
        width: clamp(146px, 45vw, 168px) !important;
    }

    html body .header_container .isp-enquiry-cart {
        width: 45px !important;
        min-width: 45px !important;
        height: 45px !important;
        min-height: 45px !important;
    }

    html body .isp-cart-icon {
        width: 37px !important;
        height: 37px !important;
    }

    html body .isp-search-form {
        height: 50px !important;
        min-height: 50px !important;
        border-radius: 17px !important;
    }

    html body .header_container .isp-search-form input {
        height: 48px !important;
        min-height: 48px !important;
        line-height: 48px !important;
    }

    html body .isp-search-form button {
        min-width: 76px !important;
        height: 40px !important;
        min-height: 40px !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
        border-radius: 13px !important;
    }

    html body #menu.isp-site-nav {
        padding-top: 6px !important;
        padding-bottom: 7px !important;
    }

    html body #menu .isp-mobile-nav-row {
        min-height: 52px !important;
        border-radius: 17px !important;
    }

    html body #menu .isp-mobile-menu-toggle,
    html body #menu .isp-mobile-quick-quote {
        height: 42px !important;
        min-height: 42px !important;
        font-size: 13.5px !important;
        border-radius: 13px !important;
    }

    html body #menu .isp-mobile-menu-toggle {
        padding-left: 12px !important;
        padding-right: 8px !important;
    }

    html body #menu .isp-mobile-quick-quote {
        min-width: 124px !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}

@media only screen and (max-width: 350px) {
    html body .isp-header-logo img {
        width: 136px !important;
    }

    html body .header_container .isp-enquiry-cart {
        width: 43px !important;
        min-width: 43px !important;
        height: 43px !important;
        min-height: 43px !important;
    }

    html body .isp-cart-icon {
        width: 35px !important;
        height: 35px !important;
    }

    html body .isp-search-form button {
        min-width: 68px !important;
        padding-left: 9px !important;
        padding-right: 9px !important;
        font-size: 12px !important;
    }

    html body #menu .isp-mobile-menu-toggle {
        padding-left: 10px !important;
        gap: 8px !important;
        font-size: 13px !important;
    }

    html body #menu .isp-mobile-quick-quote {
        min-width: 116px !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        gap: 7px !important;
        font-size: 13px !important;
    }
}

@media only screen and (max-width: 900px) and (prefers-reduced-motion: reduce) {
    html body .header_container .isp-enquiry-cart,
    html body .isp-search-form,
    html body .isp-search-form button,
    html body #menu .isp-mobile-menu-toggle,
    html body #menu .isp-mobile-quick-quote {
        transition: none !important;
    }
}

/* ========================================================================== 
   IndoSurgicals Mobile Header — Ultra Modern v1.2 refinement layer
   Screenshot-led refinement: lighter command dock + compact icon search action.
   MOBILE ONLY. Desktop >= 901px remains intentionally untouched.
   ========================================================================== */
@media only screen and (max-width: 900px) {
    /* Make the entire chrome feel lighter and more intentional. */
    html body .header_container .isp-header-inner {
        width: min(calc(100% - 24px), var(--isp-chrome-width)) !important;
        row-gap: 9px !important;
        padding-top: 10px !important;
        padding-bottom: 9px !important;
    }

    html body .isp-header-logo img {
        width: clamp(150px, 42vw, 176px) !important;
    }

    /* Cart: reduce the ring/bubble effect and make it a crisp action chip. */
    html body .header_container .isp-enquiry-cart {
        width: 44px !important;
        min-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
        border-color: rgba(8, 137, 128, .10) !important;
        background: rgba(255, 255, 255, .86) !important;
        box-shadow:
            0 7px 18px rgba(27, 59, 76, .08),
            inset 0 0 0 1px rgba(10, 155, 145, .045) !important;
    }

    html body .isp-cart-icon {
        width: 38px !important;
        height: 38px !important;
        background: linear-gradient(145deg, #08a69b 0%, #008d86 58%, #007d78 100%) !important;
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.24),
            0 4px 11px rgba(0, 126, 119, .17) !important;
    }

    html body .isp-cart-count {
        top: -3px !important;
        right: -4px !important;
        min-width: 18px !important;
        height: 18px !important;
        padding: 0 4px !important;
        border-width: 2px !important;
        font-size: 9px !important;
        line-height: 14px !important;
        box-shadow: 0 3px 8px rgba(21, 49, 68, .20) !important;
    }

    /* Search: neutral premium surface + circular submit action. */
    html body .isp-search-form {
        height: 49px !important;
        min-height: 49px !important;
        border-radius: 16px !important;
        border-color: rgba(37, 78, 99, .075) !important;
        background: rgba(244, 248, 249, .94) !important;
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.92),
            0 6px 18px rgba(29, 61, 78, .045) !important;
    }

    html body .isp-search-icon {
        left: 15px !important;
        width: 18px !important;
        height: 18px !important;
        fill: #607888 !important;
    }

    html body .header_container .isp-search-form input {
        height: 47px !important;
        min-height: 47px !important;
        line-height: 47px !important;
        padding-left: 43px !important;
        padding-right: 7px !important;
        font-size: 16px !important;
        font-weight: 520 !important;
    }

    html body .header_container .isp-search-form input::placeholder {
        color: #738595 !important;
        font-weight: 470 !important;
    }

    html body .isp-search-form button {
        position: relative !important;
        width: 41px !important;
        min-width: 41px !important;
        height: 41px !important;
        min-height: 41px !important;
        flex: 0 0 41px !important;
        margin: 4px 4px 4px 2px !important;
        padding: 0 !important;
        border-radius: 13px !important;
        font-size: 0 !important;
        color: transparent !important;
        overflow: hidden !important;
        background: linear-gradient(145deg, #08a89d 0%, #008f87 56%, #007e78 100%) !important;
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.22),
            0 4px 11px rgba(0, 126, 119, .16) !important;
    }

    /* CSS-only magnifier keeps markup/functions untouched. */
    html body .isp-search-form button::before {
        content: "" !important;
        position: absolute !important;
        left: 13px !important;
        top: 11px !important;
        width: 11px !important;
        height: 11px !important;
        border: 2px solid #fff !important;
        border-radius: 50% !important;
        box-sizing: border-box !important;
    }

    html body .isp-search-form button::after {
        content: "" !important;
        position: absolute !important;
        left: 24px !important;
        top: 24px !important;
        width: 7px !important;
        height: 2px !important;
        border-radius: 2px !important;
        background: #fff !important;
        transform: rotate(45deg) !important;
        transform-origin: left center !important;
    }

    /* Navigation: replace the heavy dark capsule with a floating glass command dock. */
    html body #menu.isp-site-nav {
        padding: 4px 0 8px !important;
        background: rgba(255, 255, 255, .82) !important;
        box-shadow: none !important;
        -webkit-backdrop-filter: blur(16px) saturate(1.15) !important;
        backdrop-filter: blur(16px) saturate(1.15) !important;
    }

    html body #menu .isp-nav-inner {
        width: min(calc(100% - 24px), var(--isp-chrome-width)) !important;
    }

    html body #menu .isp-mobile-nav-row {
        min-height: 50px !important;
        gap: 6px !important;
        padding: 4px !important;
        border: 1px solid rgba(34, 74, 94, .09) !important;
        border-radius: 16px !important;
        background: rgba(255, 255, 255, .94) !important;
        box-shadow:
            0 10px 26px rgba(24, 52, 70, .10),
            inset 0 1px 0 rgba(255, 255, 255, 1) !important;
    }

    html body #menu .isp-mobile-menu-toggle,
    html body #menu .isp-mobile-quick-quote {
        height: 42px !important;
        min-height: 42px !important;
        border-radius: 12px !important;
        font-size: 13.5px !important;
        font-weight: 720 !important;
    }

    html body #menu .isp-mobile-menu-toggle {
        flex: 1 1 auto !important;
        padding: 0 12px !important;
        color: #28485b !important;
        background: transparent !important;
    }

    html body #menu .isp-mobile-menu-toggle:hover,
    html body #menu .isp-mobile-menu-toggle:focus-visible,
    html body #menu.is-menu-open .isp-mobile-menu-toggle {
        color: #173b4f !important;
        background: #f2f7f8 !important;
    }

    html body #menu .isp-menu-icon {
        width: 19px !important;
        gap: 4px !important;
    }

    html body #menu .isp-menu-icon span {
        height: 2px !important;
        background: #2c5367 !important;
    }

    html body #menu .isp-mobile-quick-quote {
        min-width: 126px !important;
        padding: 0 13px !important;
        color: #fff !important;
        background: linear-gradient(145deg, #0aaca1 0%, #00958d 54%, #00837d 100%) !important;
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.20),
            0 5px 13px rgba(0, 126, 119, .18) !important;
    }

    html body #menu .isp-mobile-quick-quote svg {
        width: 17px !important;
        height: 17px !important;
    }

    /* Open menu becomes one continuous floating sheet beneath the light dock. */
    html body #menu .isp-primary-navigation {
        padding-top: 6px !important;
    }

    html body #menu .isp-primary-menu {
        border-radius: 16px !important;
        border-color: rgba(29, 66, 84, .07) !important;
        box-shadow: 0 16px 36px rgba(24, 52, 70, .15) !important;
    }
}

@media only screen and (max-width: 430px) {
    html body .header_container .isp-header-inner,
    html body #menu .isp-nav-inner {
        width: calc(100% - 18px) !important;
    }

    html body .header_container .isp-header-inner {
        padding-top: 9px !important;
        padding-bottom: 8px !important;
        row-gap: 8px !important;
    }

    html body .isp-header-logo img {
        width: clamp(144px, 44vw, 165px) !important;
    }

    html body .isp-search-form {
        height: 48px !important;
        min-height: 48px !important;
    }

    html body .header_container .isp-search-form input {
        height: 46px !important;
        min-height: 46px !important;
        line-height: 46px !important;
        padding-right: 5px !important;
    }

    html body .isp-search-form button {
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        flex-basis: 40px !important;
    }

    html body #menu.isp-site-nav {
        padding-top: 3px !important;
        padding-bottom: 7px !important;
    }

    html body #menu .isp-mobile-nav-row {
        min-height: 49px !important;
        border-radius: 15px !important;
    }

    html body #menu .isp-mobile-menu-toggle,
    html body #menu .isp-mobile-quick-quote {
        height: 41px !important;
        min-height: 41px !important;
        border-radius: 11px !important;
        font-size: 13px !important;
    }

    html body #menu .isp-mobile-quick-quote {
        min-width: 120px !important;
        padding-left: 11px !important;
        padding-right: 11px !important;
    }
}

@media only screen and (max-width: 350px) {
    html body .isp-header-logo img {
        width: 136px !important;
    }

    html body #menu .isp-mobile-menu-toggle {
        padding-left: 10px !important;
        padding-right: 7px !important;
    }

    html body #menu .isp-mobile-quick-quote {
        min-width: 112px !important;
        padding-left: 9px !important;
        padding-right: 9px !important;
        gap: 6px !important;
        font-size: 12.5px !important;
    }
}

/* ========================================================================== 
   IndoSurgicals Mobile Refinement Patch 1.7
   Header order + surface colour correction
   Requested mobile order: Brand/Cart -> Menu/Quick Quote -> Search.
   Search = pure white. Menu command bar = previous search surface (#f4f8f9).
   MOBILE ONLY. Desktop >= 901px remains intentionally untouched.
   ========================================================================== */
@media only screen and (max-width: 900px) {
    /* Search is physically moved into .isp-nav-inner by menu.php on mobile.
       Collapse the now-empty search row in the header so Brand + Cart remain
       a compact first row with no artificial second-grid-row gap. */
    html.isp-mobile-search-under-menu body .header_container .isp-header-inner {
        grid-template-areas: "brand actions" !important;
        grid-template-rows: auto !important;
        row-gap: 0 !important;
        padding-bottom: 9px !important;
    }

    /* Keep the mobile navigation shell light and neutral. */
    html body #menu.isp-site-nav {
        padding-top: 5px !important;
        padding-bottom: 10px !important;
        background: rgba(255, 255, 255, .94) !important;
        box-shadow: none !important;
    }

    /* Requested colour: use the former search-field surface on the menu bar. */
    html body #menu .isp-mobile-nav-row {
        background: #f4f8f9 !important;
        border-color: rgba(37, 78, 99, .075) !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, .96),
            0 6px 18px rgba(29, 61, 78, .045) !important;
    }

    html body #menu .isp-mobile-menu-toggle:hover,
    html body #menu .isp-mobile-menu-toggle:focus-visible,
    html body #menu.is-menu-open .isp-mobile-menu-toggle {
        background: rgba(255, 255, 255, .72) !important;
    }

    /* Search now sits directly below the Menu / Quick Quote row. */
    html body #menu .isp-header-search {
        width: 100% !important;
        min-width: 0 !important;
        margin: 8px 0 0 !important;
        padding: 0 !important;
    }

    /* Requested colour: clear, un-tinted white search field. */
    html body #menu .isp-search-form {
        width: 100% !important;
        height: 49px !important;
        min-height: 49px !important;
        overflow: hidden !important;
        border: 1px solid rgba(37, 78, 99, .11) !important;
        border-radius: 16px !important;
        background: #ffffff !important;
        box-shadow:
            0 5px 16px rgba(29, 61, 78, .045),
            inset 0 1px 0 #ffffff !important;
    }

    html body #menu .isp-search-form:hover,
    html body #menu .isp-search-form:focus-within {
        background: #ffffff !important;
    }

    html body #menu .isp-search-form:focus-within {
        border-color: rgba(0, 148, 139, .28) !important;
        box-shadow:
            0 0 0 4px rgba(0, 148, 139, .075),
            0 8px 22px rgba(29, 61, 78, .065) !important;
    }

    /* Re-declare the input rules because the search form is no longer a child
       of .header_container after the mobile DOM move. */
    html body #menu .isp-search-form input {
        height: 47px !important;
        min-height: 47px !important;
        flex: 1 1 auto !important;
        min-width: 0 !important;
        padding: 0 7px 0 43px !important;
        border: 0 !important;
        background: transparent !important;
        color: #1d3b4e !important;
        box-shadow: none !important;
        outline: 0 !important;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-size: 16px !important;
        line-height: 47px !important;
        font-weight: 520 !important;
        letter-spacing: -.01em !important;
    }

    html body #menu .isp-search-form input::placeholder {
        color: #738595 !important;
        opacity: 1 !important;
        font-weight: 470 !important;
    }

    /* When the menu is opened, navigation follows the Search bar naturally. */
    html body #menu .isp-primary-navigation {
        padding-top: 7px !important;
    }
}

@media only screen and (max-width: 430px) {
    html.isp-mobile-search-under-menu body .header_container .isp-header-inner {
        padding-bottom: 8px !important;
    }

    html body #menu.isp-site-nav {
        padding-top: 4px !important;
        padding-bottom: 9px !important;
    }

    html body #menu .isp-header-search {
        margin-top: 7px !important;
    }

    html body #menu .isp-search-form {
        height: 48px !important;
        min-height: 48px !important;
        border-radius: 15px !important;
    }

    html body #menu .isp-search-form input {
        height: 46px !important;
        min-height: 46px !important;
        line-height: 46px !important;
    }
}

/* ========================================================================== 
   IndoSurgicals Mobile Refinement Patch 1.8
   Reference-style mobile header inspired by the supplied EO Matters example.
   MOBILE ONLY. Desktop >= 901px remains intentionally untouched.
   ========================================================================== */
@media only screen and (max-width: 900px) {
    /* ---- Slim utility strip ---- */
    html body .header_container.isp-site-header {
        border: 0 !important;
        background: #ffffff !important;
        box-shadow: none !important;
    }

    html body .isp-mobile-utility-bar {
        min-height: 34px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 10px !important;
        padding: 0 16px !important;
        background: linear-gradient(90deg, #0a2948 0%, #0d3154 100%) !important;
        color: #ffffff !important;
    }

    html body .isp-mobile-utility-copy {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-size: 10.5px !important;
        line-height: 1 !important;
        font-weight: 720 !important;
        letter-spacing: .025em !important;
        opacity: .96 !important;
    }

    html body .isp-mobile-utility-actions {
        flex: 0 0 auto !important;
        display: flex !important;
        align-items: center !important;
        gap: 3px !important;
    }

    /* Quick Quote becomes a compact utility icon. */
    html.isp-mobile-reference-header body .isp-mobile-utility-actions .isp-mobile-quick-quote {
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        min-height: 34px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: #ffffff !important;
        box-shadow: none !important;
    }

    html.isp-mobile-reference-header body .isp-mobile-utility-actions .isp-mobile-quick-quote span {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        padding: 0 !important;
        margin: -1px !important;
        overflow: hidden !important;
        clip: rect(0, 0, 0, 0) !important;
        white-space: nowrap !important;
        border: 0 !important;
    }

    html.isp-mobile-reference-header body .isp-mobile-utility-actions .isp-mobile-quick-quote svg {
        width: 19px !important;
        height: 19px !important;
        stroke: currentColor !important;
        stroke-width: 2 !important;
    }

    /* Cart also becomes a compact top-strip action. */
    html.isp-mobile-reference-header body .isp-mobile-utility-actions .isp-enquiry-cart {
        position: relative !important;
        width: 36px !important;
        min-width: 36px !important;
        height: 34px !important;
        min-height: 34px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html.isp-mobile-reference-header body .isp-mobile-utility-actions .isp-cart-icon {
        width: 34px !important;
        height: 34px !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html.isp-mobile-reference-header body .isp-mobile-utility-actions .isp-cart-icon svg {
        width: 20px !important;
        height: 20px !important;
        fill: #ffffff !important;
    }

    html.isp-mobile-reference-header body .isp-mobile-utility-actions .isp-cart-copy {
        display: none !important;
    }

    html.isp-mobile-reference-header body .isp-mobile-utility-actions .isp-cart-count {
        top: 1px !important;
        right: -1px !important;
        min-width: 16px !important;
        height: 16px !important;
        padding: 0 4px !important;
        border: 1.5px solid #0c2d4e !important;
        border-radius: 999px !important;
        background: #ffffff !important;
        color: #0b2b4b !important;
        box-shadow: none !important;
        font-size: 9px !important;
        line-height: 13px !important;
        font-weight: 800 !important;
    }

    /* ---- Main white brand row: logo left, hamburger right ---- */
    html body .header_container .isp-header-inner {
        width: 100% !important;
        min-height: 0 !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-template-areas:
            "brand mobilemenu"
            "search search" !important;
        column-gap: 14px !important;
        row-gap: 10px !important;
        padding: 13px 17px 12px !important;
        background: #ffffff !important;
        border-bottom: 1px solid rgba(29, 65, 84, .085) !important;
    }

    html body .isp-header-brand { grid-area: brand !important; }
    html body .isp-mobile-menu-slot {
        grid-area: mobilemenu !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
    }
    html body .isp-header-search { grid-area: search !important; }

    html body .isp-header-logo img {
        width: clamp(190px, 55vw, 238px) !important;
        max-width: 100% !important;
        height: auto !important;
    }

    /* Header actions become empty on mobile after cart relocation. */
    html.isp-mobile-reference-header body .isp-header-actions {
        display: none !important;
    }

    /* Hamburger in the brand row: no pill, no text. */
    html.isp-mobile-reference-header body .isp-mobile-menu-slot .isp-mobile-menu-toggle {
        width: 48px !important;
        min-width: 48px !important;
        height: 48px !important;
        min-height: 48px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 10px !important;
        background: transparent !important;
        color: #0b2b4b !important;
        box-shadow: none !important;
    }

    html.isp-mobile-reference-header body .isp-mobile-menu-slot .isp-mobile-menu-toggle > span:last-child {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        margin: -1px !important;
        overflow: hidden !important;
        clip: rect(0, 0, 0, 0) !important;
        white-space: nowrap !important;
    }

    html.isp-mobile-reference-header body .isp-mobile-menu-slot .isp-menu-icon {
        width: 29px !important;
        display: grid !important;
        gap: 5px !important;
    }

    html.isp-mobile-reference-header body .isp-mobile-menu-slot .isp-menu-icon span {
        width: 100% !important;
        height: 3px !important;
        border-radius: 99px !important;
        background: #0b2b4b !important;
        opacity: 1 !important;
        transition: transform .18s ease, opacity .18s ease !important;
    }

    html.isp-mobile-reference-header body #menu.is-menu-open ~ * { }

    html.isp-mobile-reference-header body .isp-mobile-menu-slot .isp-mobile-menu-toggle:hover,
    html.isp-mobile-reference-header body .isp-mobile-menu-slot .isp-mobile-menu-toggle:focus-visible {
        background: #f2f6f8 !important;
        outline: none !important;
    }

    /* ---- Search: clean white, quiet border, below brand/menu row ---- */
    html.isp-mobile-reference-header body .header_container .isp-header-search {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form {
        width: 100% !important;
        height: 48px !important;
        min-height: 48px !important;
        overflow: hidden !important;
        border: 1px solid #dce5e9 !important;
        border-radius: 13px !important;
        background: #ffffff !important;
        box-shadow: none !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form:hover,
    html.isp-mobile-reference-header body .header_container .isp-search-form:focus-within {
        background: #ffffff !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form:focus-within {
        border-color: rgba(0, 148, 139, .42) !important;
        box-shadow: 0 0 0 3px rgba(0, 148, 139, .07) !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-icon {
        left: 15px !important;
        width: 18px !important;
        height: 18px !important;
        fill: #657c8b !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form input {
        height: 46px !important;
        min-height: 46px !important;
        padding: 0 7px 0 43px !important;
        background: transparent !important;
        color: #1e3b4e !important;
        font-size: 16px !important;
        line-height: 46px !important;
        font-weight: 500 !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form input::placeholder {
        color: #718391 !important;
        opacity: 1 !important;
        font-weight: 460 !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button {
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
        min-height: 42px !important;
        flex: 0 0 42px !important;
        margin: 2px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 11px !important;
        background: #00958d !important;
        color: transparent !important;
        font-size: 0 !important;
        box-shadow: none !important;
        position: relative !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button::before,
    html.isp-mobile-reference-header body .header_container .isp-search-form button::after {
        content: "" !important;
        position: absolute !important;
        display: block !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button::before {
        width: 13px !important;
        height: 13px !important;
        left: 12px !important;
        top: 10px !important;
        border: 2.5px solid #ffffff !important;
        border-radius: 50% !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button::after {
        width: 9px !important;
        height: 2.5px !important;
        left: 24px !important;
        top: 26px !important;
        border-radius: 99px !important;
        background: #ffffff !important;
        transform: rotate(45deg) !important;
        transform-origin: left center !important;
    }

    /* ---- Navigation: no permanent capsule; only the opened sheet remains ---- */
    html body #menu.isp-site-nav {
        position: relative !important;
        top: auto !important;
        z-index: 1000 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }

    html body #menu .isp-nav-inner {
        width: 100% !important;
    }

    html.isp-mobile-reference-header body #menu .isp-mobile-nav-row {
        display: none !important;
    }

    html body #menu .isp-primary-navigation {
        width: 100% !important;
        padding: 0 16px 10px !important;
        background: #ffffff !important;
    }

    html body #menu .isp-primary-menu {
        margin: 0 !important;
        border: 1px solid rgba(29, 65, 84, .10) !important;
        border-radius: 14px !important;
        background: #ffffff !important;
        box-shadow: 0 14px 34px rgba(20, 47, 65, .13) !important;
    }
}

@media only screen and (max-width: 430px) {
    html body .isp-mobile-utility-bar {
        min-height: 32px !important;
        padding-left: 13px !important;
        padding-right: 11px !important;
    }

    html body .isp-mobile-utility-copy {
        font-size: 10px !important;
    }

    html body .header_container .isp-header-inner {
        row-gap: 9px !important;
        padding: 11px 13px 11px !important;
    }

    html body .isp-header-logo img {
        width: clamp(176px, 57vw, 218px) !important;
    }

    html.isp-mobile-reference-header body .isp-mobile-menu-slot .isp-mobile-menu-toggle {
        width: 44px !important;
        min-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
    }

    html.isp-mobile-reference-header body .isp-mobile-menu-slot .isp-menu-icon {
        width: 27px !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form {
        height: 46px !important;
        min-height: 46px !important;
        border-radius: 12px !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form input {
        height: 44px !important;
        min-height: 44px !important;
        line-height: 44px !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button {
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        flex-basis: 40px !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button::before {
        left: 11px !important;
        top: 9px !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button::after {
        left: 23px !important;
        top: 25px !important;
    }
}

@media only screen and (max-width: 350px) {
    html body .isp-mobile-utility-copy {
        max-width: 205px !important;
        font-size: 9.5px !important;
    }

    html body .isp-header-logo img {
        width: 166px !important;
    }
}

@media only screen and (min-width: 901px) {
    html body .isp-mobile-utility-bar,
    html body .isp-mobile-menu-slot {
        display: none !important;
    }
}

/* ========================================================================== 
   IndoSurgicals Mobile Refinement Patch 1.9
   Search Action Precision Refinement
   MOBILE ONLY — desktop >= 901px remains untouched.
   ========================================================================== */
@media only screen and (max-width: 900px) {
    /* A smaller circular submit action reads as an icon, not a second input. */
    html.isp-mobile-reference-header body .header_container .isp-search-form button {
        width: 38px !important;
        min-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        flex: 0 0 38px !important;
        margin: 4px 5px 4px 2px !important;
        border: 1px solid rgba(0, 119, 112, .08) !important;
        border-radius: 50% !important;
        background: linear-gradient(145deg, #08a39a 0%, #008f88 62%, #007f79 100%) !important;
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.22),
            0 4px 10px rgba(0, 132, 124, .16) !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button::before {
        width: 12px !important;
        height: 12px !important;
        left: 10px !important;
        top: 9px !important;
        border-width: 2px !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button::after {
        width: 7px !important;
        height: 2px !important;
        left: 21px !important;
        top: 23px !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button:hover,
    html.isp-mobile-reference-header body .header_container .isp-search-form button:focus-visible {
        transform: none !important;
        filter: none !important;
        background: linear-gradient(145deg, #079a92 0%, #00857f 100%) !important;
        box-shadow:
            0 0 0 3px rgba(0, 149, 141, .09),
            0 5px 12px rgba(0, 132, 124, .18) !important;
        outline: 0 !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button:active {
        transform: scale(.95) !important;
    }
}

@media only screen and (max-width: 350px) {
    html.isp-mobile-reference-header body .header_container .isp-search-form button {
        width: 36px !important;
        min-width: 36px !important;
        height: 36px !important;
        min-height: 36px !important;
        flex-basis: 36px !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button::before {
        left: 9px !important;
        top: 8px !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button::after {
        left: 20px !important;
        top: 22px !important;
    }
}


/* ========================================================================== 
   IndoSurgicals Mobile Refinement Patch 2.2
   Compact labelled "Get Quick Quote" action in the mobile utility strip.
   MOBILE ONLY. Desktop >= 901px remains untouched.
   ========================================================================== */
@media only screen and (max-width: 900px) {
    html.isp-mobile-reference-header body .isp-mobile-utility-actions .isp-mobile-quick-quote {
        width: auto !important;
        min-width: 0 !important;
        height: 28px !important;
        min-height: 28px !important;
        padding: 0 8px !important;
        gap: 5px !important;
        border: 1px solid rgba(255, 255, 255, .24) !important;
        border-radius: 7px !important;
        background: rgba(255, 255, 255, .075) !important;
        color: #ffffff !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05) !important;
        white-space: nowrap !important;
    }

    html.isp-mobile-reference-header body .isp-mobile-utility-actions .isp-mobile-quick-quote span {
        position: static !important;
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        clip: auto !important;
        clip-path: none !important;
        white-space: nowrap !important;
        border: 0 !important;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-size: 11.25px !important;
        line-height: 1 !important;
        font-weight: 650 !important;
        letter-spacing: .005em !important;
    }

    html.isp-mobile-reference-header body .isp-mobile-utility-actions .isp-mobile-quick-quote svg {
        width: 14px !important;
        height: 14px !important;
        flex: 0 0 14px !important;
        stroke-width: 1.9 !important;
    }

    html.isp-mobile-reference-header body .isp-mobile-utility-actions .isp-mobile-quick-quote:hover,
    html.isp-mobile-reference-header body .isp-mobile-utility-actions .isp-mobile-quick-quote:focus-visible {
        background: rgba(255, 255, 255, .14) !important;
        border-color: rgba(255, 255, 255, .38) !important;
        box-shadow: 0 0 0 2px rgba(255, 255, 255, .10) !important;
        outline: 0 !important;
    }

    html.isp-mobile-reference-header body .isp-mobile-utility-actions .isp-mobile-quick-quote:active {
        transform: scale(.98) !important;
    }
}

@media only screen and (max-width: 430px) {
    html.isp-mobile-reference-header body .isp-mobile-utility-actions .isp-mobile-quick-quote {
        height: 27px !important;
        min-height: 27px !important;
        padding-left: 7px !important;
        padding-right: 7px !important;
        gap: 4px !important;
    }

    html.isp-mobile-reference-header body .isp-mobile-utility-actions .isp-mobile-quick-quote span {
        font-size: 10.5px !important;
    }

    html.isp-mobile-reference-header body .isp-mobile-utility-actions .isp-mobile-quick-quote svg {
        width: 13px !important;
        height: 13px !important;
        flex-basis: 13px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html.isp-mobile-reference-header body .isp-mobile-utility-actions .isp-mobile-quick-quote {
        transition: none !important;
    }
}

/* ========================================================================== 
   IndoSurgicals Mobile Refinement Patch 2.7
   Tablet / Mobile Header Boundary Correction
   The legacy desktop top contact/store bar was still visible from 641–900px
   while the reference mobile utility header was also active. Keep exactly
   one header system at each breakpoint.
   MOBILE/TABLET ONLY — desktop >= 901px remains untouched.
   ========================================================================== */
@media only screen and (max-width: 900px) {
    html body .top_bar_container.isp-topbar {
        display: none !important;
    }
}

/* ========================================================================== 
   IndoSurgicals Mobile Refinement Patch 2.8
   Enquiry Cart — show only when it contains items.
   MOBILE/TABLET ONLY. Desktop >= 901px remains untouched.
   ========================================================================== */
@media only screen and (max-width: 900px) {
    html.isp-mobile-reference-header body .isp-enquiry-cart.isp-cart-is-empty {
        display: none !important;
    }
}

/* ========================================================================== 
   IndoSurgicals Mobile Refinement Patch 2.9
   Enquiry-route aware utility strip + MedDeal online-purchase link.
   MOBILE/TABLET ONLY. Desktop >= 901px remains untouched.
   ========================================================================== */
@media only screen and (max-width: 900px) {
    html body .isp-mobile-utility-bar {
        min-height: 38px !important;
        gap: 8px !important;
        padding: 0 12px 0 14px !important;
    }

    html body .isp-mobile-utility-copy {
        flex: 1 1 auto !important;
        min-width: 64px !important;
        max-width: none !important;
        font-size: 10.5px !important;
    }

    html body .isp-mobile-utility-actions {
        flex: 0 0 auto !important;
        min-width: 0 !important;
        gap: 5px !important;
    }

    /* Always-visible online purchase route. */
    html body .isp-mobile-online-store {
        height: 28px !important;
        min-height: 28px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 4px !important;
        padding: 0 8px !important;
        border: 0 !important;
        border-radius: 7px !important;
        background: transparent !important;
        color: rgba(255, 255, 255, .92) !important;
        text-decoration: none !important;
        white-space: nowrap !important;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-size: 10.75px !important;
        line-height: 1 !important;
        font-weight: 560 !important;
        letter-spacing: .005em !important;
        transition: background-color .16s ease, color .16s ease !important;
    }

    html body .isp-mobile-online-store svg {
        width: 12px !important;
        height: 12px !important;
        flex: 0 0 12px !important;
        fill: currentColor !important;
        opacity: .82 !important;
    }

    html body .isp-mobile-online-store:hover,
    html body .isp-mobile-online-store:focus-visible {
        background: rgba(255, 255, 255, .10) !important;
        color: #ffffff !important;
        outline: 0 !important;
    }

    /* Empty cart = Quick Quote route. The cart remains hidden by Patch 2.8. */
    html.isp-mobile-reference-header:not(.isp-mobile-cart-has-items) body .isp-mobile-utility-actions .isp-mobile-quick-quote {
        display: inline-flex !important;
    }

    /* Once products are selected, the enquiry cart becomes the primary route. */
    html.isp-mobile-reference-header.isp-mobile-cart-has-items body .isp-mobile-utility-actions .isp-mobile-quick-quote {
        display: none !important;
    }

    html.isp-mobile-reference-header.isp-mobile-cart-has-items body .isp-mobile-utility-actions .isp-enquiry-cart {
        width: auto !important;
        min-width: 0 !important;
        height: 28px !important;
        min-height: 28px !important;
        padding: 0 7px !important;
        gap: 5px !important;
        border: 1px solid rgba(255, 255, 255, .26) !important;
        border-radius: 7px !important;
        background: rgba(255, 255, 255, .09) !important;
        color: #ffffff !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05) !important;
        text-decoration: none !important;
    }

    html.isp-mobile-reference-header.isp-mobile-cart-has-items body .isp-mobile-utility-actions .isp-cart-icon {
        width: 16px !important;
        height: 16px !important;
        flex: 0 0 16px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html.isp-mobile-reference-header.isp-mobile-cart-has-items body .isp-mobile-utility-actions .isp-cart-icon svg {
        width: 16px !important;
        height: 16px !important;
        fill: currentColor !important;
    }

    html.isp-mobile-reference-header.isp-mobile-cart-has-items body .isp-mobile-utility-actions .isp-cart-copy {
        display: inline-flex !important;
        align-items: center !important;
        min-width: 0 !important;
    }

    html.isp-mobile-reference-header.isp-mobile-cart-has-items body .isp-mobile-utility-actions .isp-cart-copy small {
        display: none !important;
    }

    html.isp-mobile-reference-header.isp-mobile-cart-has-items body .isp-mobile-utility-actions .isp-cart-copy strong {
        display: inline !important;
        color: #ffffff !important;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
        font-size: 11.25px !important;
        line-height: 1 !important;
        font-weight: 650 !important;
        letter-spacing: .003em !important;
        white-space: nowrap !important;
    }

    html.isp-mobile-reference-header.isp-mobile-cart-has-items body .isp-mobile-utility-actions .isp-cart-count {
        position: static !important;
        min-width: 19px !important;
        height: 18px !important;
        padding: 0 5px !important;
        margin: 0 0 0 1px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border: 0 !important;
        border-radius: 999px !important;
        background: #ffffff !important;
        color: #0b2b4b !important;
        box-shadow: none !important;
        font-size: 9.5px !important;
        line-height: 18px !important;
        font-weight: 750 !important;
    }

    html.isp-mobile-reference-header.isp-mobile-cart-has-items body .isp-mobile-utility-actions .isp-enquiry-cart:hover,
    html.isp-mobile-reference-header.isp-mobile-cart-has-items body .isp-mobile-utility-actions .isp-enquiry-cart:focus-visible {
        background: rgba(255, 255, 255, .15) !important;
        border-color: rgba(255, 255, 255, .40) !important;
        outline: 0 !important;
    }
}

@media only screen and (max-width: 430px) {
    html body .isp-mobile-utility-bar {
        padding-left: 10px !important;
        padding-right: 9px !important;
        gap: 5px !important;
    }

    html body .isp-mobile-utility-copy {
        font-size: 9.75px !important;
    }

    html body .isp-mobile-utility-actions {
        gap: 3px !important;
    }

    html body .isp-mobile-online-store {
        height: 27px !important;
        min-height: 27px !important;
        padding-left: 6px !important;
        padding-right: 6px !important;
        font-size: 10px !important;
    }

    html.isp-mobile-reference-header.isp-mobile-cart-has-items body .isp-mobile-utility-actions .isp-enquiry-cart {
        height: 27px !important;
        min-height: 27px !important;
        padding-left: 6px !important;
        padding-right: 6px !important;
        gap: 4px !important;
    }

    html.isp-mobile-reference-header.isp-mobile-cart-has-items body .isp-mobile-utility-actions .isp-cart-copy strong {
        font-size: 10.5px !important;
    }
}

@media only screen and (max-width: 360px) {
    /* On the narrowest devices reserve the strip for actionable routes. */
    html body .isp-mobile-utility-copy {
        display: none !important;
    }

    html body .isp-mobile-utility-actions {
        width: 100% !important;
        justify-content: space-between !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body .isp-mobile-online-store {
        transition: none !important;
    }
}

/* ========================================================================== 
   IndoSurgicals Mobile Refinement Patch 2.18
   Search Button — Flat Soft-Green Reference Treatment
   MOBILE/TABLET ONLY. Desktop >= 901px remains untouched.
   ========================================================================== */
@media only screen and (max-width: 900px) {
    html.isp-mobile-reference-header body .header_container .isp-search-form button {
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        min-height: 34px !important;
        flex: 0 0 34px !important;
        margin: 6px 8px 6px 3px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 50% !important;
        background: #6fa87b !important;
        color: transparent !important;
        box-shadow: none !important;
        filter: none !important;
        transform: none !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button::before {
        width: 11px !important;
        height: 11px !important;
        left: 8px !important;
        top: 7px !important;
        border: 2px solid #ffffff !important;
        border-radius: 50% !important;
        background: transparent !important;
        box-sizing: content-box !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button::after {
        width: 7px !important;
        height: 2px !important;
        left: 19px !important;
        top: 21px !important;
        border-radius: 999px !important;
        background: #ffffff !important;
        transform: rotate(45deg) !important;
        transform-origin: left center !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button:hover,
    html.isp-mobile-reference-header body .header_container .isp-search-form button:focus-visible {
        background: #669f72 !important;
        box-shadow: 0 0 0 3px rgba(111, 168, 123, .14) !important;
        filter: none !important;
        transform: none !important;
        outline: 0 !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button:active {
        background: #62996e !important;
        transform: scale(.96) !important;
    }
}

@media only screen and (max-width: 350px) {
    html.isp-mobile-reference-header body .header_container .isp-search-form button {
        width: 32px !important;
        min-width: 32px !important;
        height: 32px !important;
        min-height: 32px !important;
        flex-basis: 32px !important;
        margin-right: 7px !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button::before {
        width: 10px !important;
        height: 10px !important;
        left: 8px !important;
        top: 7px !important;
        border-width: 2px !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button::after {
        width: 6px !important;
        left: 18px !important;
        top: 20px !important;
    }
}

/* ========================================================================== 
   IndoSurgicals Mobile Refinement Patch 2.19
   Search Button — Restore Original Teal, Refine Lens Only
   MOBILE/TABLET ONLY. Desktop >= 901px remains untouched.
   ========================================================================== */
@media only screen and (max-width: 900px) {
    /* Restore the pre-2.18 button treatment exactly; only the lens geometry changes below. */
    html.isp-mobile-reference-header body .header_container .isp-search-form button {
        width: 38px !important;
        min-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        flex: 0 0 38px !important;
        margin: 4px 5px 4px 2px !important;
        padding: 0 !important;
        border: 1px solid rgba(0, 119, 112, .08) !important;
        border-radius: 50% !important;
        background: linear-gradient(145deg, #08a39a 0%, #008f88 62%, #007f79 100%) !important;
        color: transparent !important;
        box-shadow:
            inset 0 1px 0 rgba(255,255,255,.22),
            0 4px 10px rgba(0, 132, 124, .16) !important;
        filter: none !important;
        transform: none !important;
    }

    /* Cleaner, optically centred magnifier. */
    html.isp-mobile-reference-header body .header_container .isp-search-form button::before {
        width: 11px !important;
        height: 11px !important;
        left: 10px !important;
        top: 9px !important;
        border: 2px solid #ffffff !important;
        border-radius: 50% !important;
        background: transparent !important;
        box-sizing: content-box !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button::after {
        width: 7px !important;
        height: 2px !important;
        left: 21px !important;
        top: 22px !important;
        border-radius: 999px !important;
        background: #ffffff !important;
        transform: rotate(45deg) !important;
        transform-origin: left center !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button:hover,
    html.isp-mobile-reference-header body .header_container .isp-search-form button:focus-visible {
        background: linear-gradient(145deg, #079a92 0%, #00857f 100%) !important;
        box-shadow:
            0 0 0 3px rgba(0, 149, 141, .09),
            0 5px 12px rgba(0, 132, 124, .18) !important;
        filter: none !important;
        transform: none !important;
        outline: 0 !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button:active {
        background: linear-gradient(145deg, #079a92 0%, #00857f 100%) !important;
        transform: scale(.95) !important;
    }
}

@media only screen and (max-width: 350px) {
    html.isp-mobile-reference-header body .header_container .isp-search-form button {
        width: 36px !important;
        min-width: 36px !important;
        height: 36px !important;
        min-height: 36px !important;
        flex-basis: 36px !important;
        margin: 4px 5px 4px 2px !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button::before {
        width: 10px !important;
        height: 10px !important;
        left: 9px !important;
        top: 8px !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button::after {
        width: 6px !important;
        left: 19px !important;
        top: 21px !important;
    }
}

/* ========================================================================== 
   IndoSurgicals Mobile Refinement Patch 2.20
   Search Lens — Vector Precision Fix
   Keeps Patch 2.19 button colour/size/treatment exactly; replaces the
   two-piece CSS magnifier with one vector SVG so browser zoom and HiDPI
   scaling cannot expose the ring/handle join.
   MOBILE/TABLET ONLY. Desktop >= 901px remains untouched.
   ========================================================================== */
@media only screen and (max-width: 900px) {
    html.isp-mobile-reference-header body .header_container .isp-search-form button::before {
        content: "" !important;
        position: absolute !important;
        display: block !important;
        width: 22px !important;
        height: 22px !important;
        left: 50% !important;
        top: 50% !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-sizing: border-box !important;
        background-color: transparent !important;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10.25' cy='10.25' r='6.25'/%3E%3Cpath d='M14.85 14.85L20 20'/%3E%3C/svg%3E") !important;
        background-repeat: no-repeat !important;
        background-position: center !important;
        background-size: 22px 22px !important;
        transform: translate(-50%, -50%) !important;
        transform-origin: center !important;
        -webkit-font-smoothing: antialiased !important;
        pointer-events: none !important;
    }

    html.isp-mobile-reference-header body .header_container .isp-search-form button::after {
        content: none !important;
        display: none !important;
        width: 0 !important;
        height: 0 !important;
        border: 0 !important;
        background: none !important;
        transform: none !important;
    }
}

@media only screen and (max-width: 350px) {
    html.isp-mobile-reference-header body .header_container .isp-search-form button::before {
        width: 21px !important;
        height: 21px !important;
        background-size: 21px 21px !important;
    }
}