/*
 * GSMUnlockUSA Products & Services - Modern Compact Service Rows V1
 * V103.2 / Step 1 runtime layout fix
 *
 * Presentation only:
 * - no ServiceName parsing;
 * - no price/order/search/group logic changes;
 * - same six-column legacy renderer stays authoritative;
 * - applies to server-rendered rows, lazy groups and live search results.
 */

.gsm-products-service-list-v1 .service-search-main .table-service {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border: 1px solid #dde6ed;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    color: #344b5c;
    font-family: Arial, sans-serif;
}

/* ---------------- Header ---------------- */

.gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header {
    height: 34px;
    background: #f5f8fa;
    color: #526a7a;
    font-size: 11px;
    font-weight: 700;
    line-height: 15px;
    text-transform: uppercase;
    letter-spacing: .18px;
}

.gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td {
    padding: 8px 10px !important;
    border-bottom: 1px solid #dfe7ed;
    vertical-align: middle;
}

.gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:first-child img,
.gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:last-child img {
    opacity: .40;
    transform: scale(.88);
}

.gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:last-child:not([colspan]) {
    text-align: center !important;
    font-size: 0;
}

.gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:last-child:not([colspan]):after {
    content: "Order";
    font-size: 11px;
    color: #526a7a;
}

/*
 * Subgroup rows also use .tr-header, but their single cell spans all six
 * columns. Keep them as subgroup titles; never treat them as the column header.
 */
.gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td[colspan="6"] {
    padding: 12px 8px 8px !important;
    border-bottom: 0;
    background: #fff;
    color: #173f61;
    text-align: left !important;
    text-transform: none;
    letter-spacing: 0;
}

.gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td[colspan="6"] .h-type1,
.gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td[colspan="6"] .h-type0 {
    margin: 0 !important;
    font-size: 14px;
    line-height: 20px;
    text-align: left !important;
}

/* Legacy yellow/line image separators are no longer needed inside the modern table. */
.gsm-products-service-list-v1 .service-search-main .table-service > tbody > .line3 {
    height: 0 !important;
    line-height: 0 !important;
}

.gsm-products-service-list-v1 .service-search-main .table-service > tbody > .line3 > td {
    height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    font-size: 0 !important;
    line-height: 0 !important;
}

/* ---------------- Service rows ---------------- */

.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list {
    height: 78px !important;
    background: #fff !important;
    transition: background-color .16s ease, box-shadow .16s ease;
}

.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list.bg1 {
    background: #fbfdfe !important;
}

.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list:hover {
    background: #f5faff !important;
}

.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td {
    padding: 10px 8px !important;
    border-bottom: 1px solid #e7edf2;
    vertical-align: middle !important;
    line-height: 18px;
}

/* Logo / service image */
.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-0 {
    text-align: center !important;
}

.gsm-products-service-list-v1 .service-search-main .table-service .img-unlservice {
    display: block;
    width: auto !important;
    max-width: 54px !important;
    max-height: 54px !important;
    height: auto !important;
    margin: 0 auto;
    object-fit: contain;
}

/* Main service copy */
.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-1 {
    padding-left: 12px !important;
    padding-right: 14px !important;
    text-align: left !important;
    word-break: normal;
    overflow-wrap: break-word;
}

.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-1 > a:first-child {
    color: #173f61 !important;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    text-decoration: none !important;
}

.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-1 > a:first-child:hover {
    color: #0878b5 !important;
    text-decoration: none !important;
}

.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-1 > a.hidden-xs {
    display: inline-block;
    margin-top: 3px;
    color: #60798a !important;
    font-size: 12.5px;
    line-height: 18px;
    text-decoration: none !important;
}

.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-1 > a.hidden-xs span {
    color: #60798a !important;
}

/* Price */
.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-2 {
    color: #075fa5 !important;
    font-size: 15px;
    font-weight: 700;
    text-align: right !important;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

/* Payment type */
.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-3 {
    text-align: center !important;
}

.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-3 h4 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    min-height: 30px;
    margin: 0 !important;
    padding: 0;
    border: 1px solid #dce8df;
    border-radius: 15px;
    background: #f5fbf7;
    font-size: 17px;
    line-height: 28px;
}

/* Delivery time */
.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-4 {
    text-align: right !important;
    white-space: nowrap;
}

.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-4 a {
    text-decoration: none !important;
}

.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-4 span {
    display: inline-block;
    padding: 4px 8px;
    border: 1px solid #cfe1ed;
    border-radius: 11px;
    background: #f4f9fc;
    color: #315f7d !important;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
    white-space: nowrap;
}

/* ---------------- Explicit Order CTA ---------------- */

.gsm-products-service-list-v1 .service-search-main .gsm-order-action-cell,
.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child {
    text-align: center !important;
    white-space: nowrap;
}

.gsm-products-service-list-v1 .service-search-main .gsm-direct-order-cart,
.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 72px !important;
    height: 32px;
    min-height: 32px !important;
    padding: 0 12px !important;
    border: 1px solid #0b78b7;
    border-radius: 6px !important;
    background: #0878b5 !important;
    color: #fff !important;
    box-shadow: 0 1px 2px rgba(20, 61, 87, .10);
    font-size: 12px;
    font-weight: 700;
    line-height: 30px;
    text-decoration: none !important;
    transition:
        background-color .16s ease,
        border-color .16s ease,
        box-shadow .16s ease,
        transform .16s ease;
}

.gsm-products-service-list-v1 .service-search-main .gsm-direct-order-cart:hover,
.gsm-products-service-list-v1 .service-search-main .gsm-direct-order-cart:focus,
.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a:hover,
.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a:focus {
    border-color: #08679d;
    background: #086da5 !important;
    color: #fff !important;
    box-shadow: 0 3px 8px rgba(23, 83, 119, .18);
    transform: translateY(-1px);
    outline: none;
}

.gsm-products-service-list-v1 .service-search-main .gsm-direct-order-cart .img-cart,
.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a .img-cart {
    display: none !important;
}

/*
 * Desktop CTA must not depend on MutationObserver timing. The existing anchor
 * remains the click target; CSS supplies the visible label immediately.
 */
.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a {
    font-size: 0 !important;
}

.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a:after {
    content: "Order";
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    line-height: 30px;
}

.gsm-products-service-list-v1 .service-search-main .gsm-order-action-label-v1 {
    display: none !important;
}

/* ---------------- Desktop column rhythm ---------------- */

@media (min-width: 768px) {
    /*
     * Do NOT use table-layout:fixed here.
     *
     * Some service groups start with a subgroup title row:
     *     <tr class='tr-header'><td colspan='6'>...</td></tr>
     * With fixed layout the browser derives column geometry from that first
     * colspan row and the actual service-name column collapses to ~1/6 width.
     *
     * Auto layout + explicit percentage hints preserves the intended wide
     * service-description column while keeping Price/Type/Delivery/Order compact.
     */
    .gsm-products-service-list-v1 .service-search-main .table-service {
        table-layout: auto !important;
    }

    /* Apply the same column rhythm to both the real header and data rows. */
    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:nth-child(1):not([colspan]),
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:nth-child(1) {
        width: 7% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:nth-child(2):not([colspan]),
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:nth-child(2) {
        width: 56% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:nth-child(3):not([colspan]),
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:nth-child(3) {
        width: 8% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:nth-child(4):not([colspan]),
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:nth-child(4) {
        width: 7% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:nth-child(5):not([colspan]),
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:nth-child(5) {
        width: 13% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:nth-child(6):not([colspan]),
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:nth-child(6) {
        width: 9% !important;
    }
}

/* ---------------- Mobile: preserve the existing compact six-column contract ---------------- */

@media (max-width: 767px) {
    .gsm-products-service-list-v1 .service-search-main .table-service {
        border-radius: 6px;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list {
        height: 76px !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td {
        padding-top: 7px !important;
        padding-bottom: 7px !important;
        padding-left: 3px !important;
        padding-right: 3px !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-1 {
        padding-left: 5px !important;
        padding-right: 4px !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-1 > a:first-child {
        font-size: 11.5px;
        line-height: 16px;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-2 {
        font-size: 11.5px;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-4 span {
        padding: 2px 3px;
        border: 0;
        border-radius: 0;
        background: transparent;
        font-size: 10px;
        line-height: 13px;
        white-space: normal;
    }

    /*
     * Keep the familiar compact cart icon on mobile. The explicit "Order"
     * label is desktop/tablet only so the six-column layout does not get wider.
     */
    .gsm-products-service-list-v1 .service-search-main .gsm-direct-order-cart,
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a {
        min-width: 28px !important;
        width: 28px;
        height: 28px;
        min-height: 28px !important;
        padding: 2px !important;
        border-color: #d6e4ee;
        background: #f6fafc !important;
        box-shadow: none;
    }

    .gsm-products-service-list-v1 .service-search-main .gsm-direct-order-cart .img-cart,
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a .img-cart {
        display: inline-block !important;
        width: 20px;
        min-width: 20px;
        height: auto;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a {
        font-size: 0 !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a:after {
        content: none !important;
    }

    .gsm-products-service-list-v1 .service-search-main .gsm-order-action-label-v1 {
        display: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list,
    .gsm-products-service-list-v1 .service-search-main .gsm-direct-order-cart,
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a {
        transition: none !important;
    }

    .gsm-products-service-list-v1 .service-search-main .gsm-direct-order-cart:hover,
    .gsm-products-service-list-v1 .service-search-main .gsm-direct-order-cart:focus,
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a:hover,
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a:focus {
        transform: none !important;
    }
}


/* ========================================================================
 * V104 - CLEAN COMPACT LIST
 * ------------------------------------------------------------------------
 * Runtime review showed the V103.3 -> V103.5 numeric changes were too subtle
 * to materially change the page. V104 intentionally makes the hierarchy
 * simpler and lighter while preserving ALL existing renderer/data/routes.
 *
 * Desktop visual rules:
 * - match the site's legacy 12px body scale;
 * - service title 12.5px, secondary description 11px;
 * - shorter 60px target row;
 * - smaller logo;
 * - no heavy payment pill;
 * - delivery becomes plain metadata instead of another badge;
 * - repeated Order CTA becomes a quiet outline button, filled only on hover;
 * - description is one muted line on desktop;
 * - almost-white rows, no strong zebra striping.
 * ======================================================================== */

@media (min-width: 768px) {
    .gsm-products-service-list-v1 .service-search-main .table-service {
        table-layout: auto !important;
        font-size: 12px !important;
        border-color: #e3e9ee !important;
        border-radius: 6px !important;
    }

    /* Compact subgroup row. */
    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td[colspan="6"] {
        padding: 8px 8px 5px calc(6% + 8px) !important;
        background: #fff !important;
        border-bottom: 0 !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td[colspan="6"] .h-type1,
    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td[colspan="6"] .h-type0 {
        margin: 0 !important;
        color: #24516f !important;
        font-size: 12.5px !important;
        font-weight: 600 !important;
        line-height: 17px !important;
    }

    /* Real column header: quiet guide, not a second title band. */
    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header {
        height: 27px !important;
        background: #fafcfd !important;
        color: #6f8391 !important;
        font-size: 10px !important;
        font-weight: 600 !important;
        line-height: 13px !important;
        letter-spacing: .12px !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:not([colspan]) {
        padding: 6px 6px !important;
        border-top: 1px solid #edf1f4 !important;
        border-bottom: 1px solid #e7edf1 !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:nth-child(2):not([colspan]) {
        padding-left: 8px !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:first-child:not([colspan]) img,
    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:last-child:not([colspan]) img {
        display: none !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:last-child:not([colspan]):after {
        content: "ORDER";
        color: #6f8391 !important;
        font-size: 10px !important;
        font-weight: 600 !important;
        line-height: 13px !important;
    }

    /* Final compact column rhythm: 6 + 58 + 8 + 5 + 13 + 10 = 100. */
    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:nth-child(1):not([colspan]),
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:nth-child(1) {
        width: 6% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:nth-child(2):not([colspan]),
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:nth-child(2) {
        width: 58% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:nth-child(3):not([colspan]),
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:nth-child(3) {
        width: 8% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:nth-child(4):not([colspan]),
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:nth-child(4) {
        width: 5% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:nth-child(5):not([colspan]),
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:nth-child(5) {
        width: 13% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td:nth-child(6):not([colspan]),
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:nth-child(6) {
        width: 10% !important;
    }

    /* Row surface: compact and calm. */
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list,
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list.bg0,
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list.bg1 {
        height: 60px !important;
        background: #fff !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list:hover {
        background: #f8fbfd !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td {
        padding: 6px 6px !important;
        border-bottom: 1px solid #edf1f4 !important;
        vertical-align: middle !important;
        line-height: 15px !important;
    }

    /* Logo */
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-0 {
        text-align: center !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .img-unlservice {
        display: block;
        width: auto !important;
        max-width: 40px !important;
        max-height: 40px !important;
        height: auto !important;
        margin: 0 auto;
        object-fit: contain;
    }

    /* Service text */
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-1 {
        padding-left: 8px !important;
        padding-right: 10px !important;
        text-align: left !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-1 > a:first-of-type {
        color: #214e6c !important;
        font-size: 12.5px !important;
        font-weight: 600 !important;
        line-height: 17px !important;
        text-decoration: none !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-1 > a:first-of-type:hover {
        color: #0878b5 !important;
    }

    /* Keep HOT useful but visually small. */
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-1 > a:first-of-type > img {
        width: auto !important;
        max-width: 27px !important;
        max-height: 12px !important;
        vertical-align: -1px;
    }

    /*
     * The description often repeats the service title. Keep it available and
     * clickable, but make it one quiet line rather than a competing second title.
     */
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-1 > a.hidden-xs {
        display: block !important;
        margin-top: 1px !important;
        overflow: hidden;
        color: #8093a0 !important;
        font-size: 11px !important;
        font-weight: 400 !important;
        line-height: 15px !important;
        text-decoration: none !important;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-1 > a.hidden-xs span {
        color: #8093a0 !important;
        font-size: inherit !important;
        font-weight: inherit !important;
    }

    /* Price */
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-2 {
        color: #086fae !important;
        font-size: 12.5px !important;
        font-weight: 700 !important;
        line-height: 17px !important;
        text-align: right !important;
        white-space: nowrap;
        font-variant-numeric: tabular-nums;
    }

    /*
     * Type is useful metadata, but the previous circular badge made every row
     * visually busy. Keep the icon only.
     */
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:nth-child(4) {
        text-align: center !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:nth-child(4) h4 {
        display: inline !important;
        min-width: 0 !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        font-size: 12px !important;
        line-height: 15px !important;
    }

    /* Delivery is plain metadata, not another badge/button. */
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-4 {
        text-align: center !important;
        white-space: nowrap;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-4 span {
        display: inline !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: #527387 !important;
        font-size: 11px !important;
        font-weight: 600 !important;
        line-height: 15px !important;
        white-space: nowrap;
    }

    /*
     * Repeated bright blue filled buttons create too much visual noise.
     * Use a clean outline action; fill it only on hover/focus.
     */
    .gsm-products-service-list-v1 .service-search-main .gsm-order-action-cell,
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child {
        text-align: center !important;
        white-space: nowrap;
    }

    .gsm-products-service-list-v1 .service-search-main .gsm-direct-order-cart,
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        min-width: 64px !important;
        height: 26px !important;
        min-height: 26px !important;
        padding: 0 9px !important;
        border: 1px solid #1595d3 !important;
        border-radius: 5px !important;
        background: #fff !important;
        color: #0878b5 !important;
        box-shadow: none !important;
        font-size: 0 !important;
        font-weight: 600 !important;
        line-height: 24px !important;
        text-decoration: none !important;
        transform: none !important;
    }

    .gsm-products-service-list-v1 .service-search-main .gsm-direct-order-cart:hover,
    .gsm-products-service-list-v1 .service-search-main .gsm-direct-order-cart:focus,
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a:hover,
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a:focus {
        background: #1595d3 !important;
        color: #fff !important;
        border-color: #1595d3 !important;
        box-shadow: none !important;
        outline: none !important;
        transform: none !important;
    }

    .gsm-products-service-list-v1 .service-search-main .gsm-direct-order-cart .img-cart,
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a .img-cart,
    .gsm-products-service-list-v1 .service-search-main .gsm-order-action-label-v1 {
        display: none !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a:after {
        content: "Order";
        color: inherit;
        font-size: 11px !important;
        font-weight: 600 !important;
        line-height: 24px !important;
    }
}

/* Mobile stays on the proven compact cart-icon contract. */
@media (max-width: 767px) {
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a:after {
        content: none !important;
    }
}


/* ========================================================================
 * V105 - Deterministic Fixed Column Geometry
 * ------------------------------------------------------------------------
 * Runtime fix for the wide-horizontal overflow shown on Products & Services.
 *
 * Root cause:
 * A subgroup title can be the first row:
 *     <tr class="tr-header"><td colspan="6">...</td></tr>
 * With table-layout:auto, long nowrap description text can expand the table.
 * With table-layout:fixed but WITHOUT COLGROUP, that first colspan row can
 * produce incorrect/equal-ish column geometry.
 *
 * V105 solves BOTH:
 * - JS injects a six-column COLGROUP;
 * - desktop uses table-layout:fixed + width/max-width:100%;
 * - long Service/Description text is constrained inside the Service column.
 * ======================================================================== */

@media (min-width: 768px) {
    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        table-layout: fixed !important;
        box-sizing: border-box !important;
    }

    /* COLGROUP is the authoritative desktop column contract. */
    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    col.gsm-service-col-logo-v105 {
        width: 6% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    col.gsm-service-col-main-v105 {
        width: 58% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    col.gsm-service-col-price-v105 {
        width: 8% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    col.gsm-service-col-type-v105 {
        width: 5% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    col.gsm-service-col-delivery-v105 {
        width: 13% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    col.gsm-service-col-order-v105 {
        width: 10% !important;
    }

    /*
     * Old TD widths are now hints only. COLGROUP wins, but clearing min-width
     * / max-width prevents legacy CSS from forcing the table wider.
     */
    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    > tbody > tr > td {
        min-width: 0 !important;
        max-width: none !important;
        box-sizing: border-box !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    .col-style-1 {
        min-width: 0 !important;
        overflow: hidden !important;
    }

    /*
     * Service title may use up to the available 58% column and wrap naturally.
     * It must never expand the table.
     */
    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    .col-style-1 > a:first-of-type {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        overflow-wrap: break-word !important;
        word-break: normal !important;
    }

    /*
     * Description remains a single clean line and is clipped INSIDE the
     * Service cell. nowrap no longer contributes intrinsic width to the table.
     */
    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    .col-style-1 > a.hidden-xs {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    /* Keep the right-side metadata cluster compact and stable. */
    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    .col-style-2,
    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    .col-style-3,
    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    .col-style-4,
    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    .gsm-order-action-cell {
        overflow: hidden !important;
        text-overflow: ellipsis;
        white-space: nowrap !important;
    }

    /*
     * Subgroup title spans the whole table by design. Give its content the
     * same visual start as the Service column, but it no longer participates
     * in width calculation because COLGROUP owns that geometry.
     */
    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    > tbody > .tr-header > td[colspan="6"] {
        padding-left: calc(6% + 8px) !important;
        padding-right: 10px !important;
        overflow: hidden !important;
    }

    /* The table must never paint outside the Products content pane. */
    .gsm-products-service-list-v1 .service-search-main .divContentR {
        max-width: 100% !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }
}

/*
 * Mobile keeps the existing proven auto-layout behavior. The COLGROUP remains
 * harmless because its widths are defined only inside the desktop media query.
 */
@media (max-width: 767px) {
    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105 {
        width: 100% !important;
        max-width: 100% !important;
        table-layout: auto !important;
    }
}


/* ========================================================================
 * V106 - Lighter Service Name + Mobile Grid Gutter
 * ------------------------------------------------------------------------
 * Runtime polish on top of the proven V105 column geometry.
 *
 * Goals:
 * - reduce Service Name visual weight from 600 -> 500;
 * - keep all desktop V105 geometry unchanged;
 * - on mobile, use the existing V105 COLGROUP to control all 6 columns;
 * - reduce left/right empty space inside the service grid without pushing
 *   the table outside the Group panel;
 * - keep Product/Search/Order business behavior unchanged.
 * ======================================================================== */

/* Service Name: keep it primary, but less heavy. */
.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-1 > a:first-of-type,
.gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-1 > a:first-child {
    font-weight: 500 !important;
}

@media (max-width: 767px) {
    /*
     * The V105 COLGROUP already exists on initial, lazy and search tables.
     * Use it on mobile too so browser auto-layout cannot reserve oversized
     * blank space at the first/last columns.
     *
     * 8 + 51 + 9 + 6 + 16 + 10 = 100
     */
    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        table-layout: fixed !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    col.gsm-service-col-logo-v105 {
        width: 8% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    col.gsm-service-col-main-v105 {
        width: 51% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    col.gsm-service-col-price-v105 {
        width: 9% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    col.gsm-service-col-type-v105 {
        width: 6% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    col.gsm-service-col-delivery-v105 {
        width: 16% !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service.gsm-service-table-v105
    col.gsm-service-col-order-v105 {
        width: 10% !important;
    }

    /* Reduce the 5px legacy padding on both sides of browse/search grids. */
    .gsm-products-service-list-v1 .service-search-main .divContentR,
    .gsm-products-service-list-v1 #divcontent.gsm-products-mobile-first-subgroup-v718 .divContentR,
    .gsm-products-service-list-v1 .service-search-live-results .divContentR {
        padding-left: 1px !important;
        padding-right: 1px !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td {
        padding-left: 2px !important;
        padding-right: 2px !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-1 {
        padding-left: 4px !important;
        padding-right: 3px !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    /* Keep mobile title readable while removing the heavy/bold feel. */
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-1 > a:first-of-type,
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-1 > a:first-child {
        color: #2b536f !important;
        font-size: 11.5px !important;
        font-weight: 500 !important;
        line-height: 16px !important;
        overflow-wrap: break-word !important;
        word-break: normal !important;
    }

    /* The smaller logo column is now deterministic; size the image to match. */
    .gsm-products-service-list-v1 .service-search-main .table-service .img-unlservice,
    .gsm-products-service-list-v1 #divcontent.gsm-products-mobile-first-subgroup-v718 .img-unlservice {
        max-width: 34px !important;
        max-height: 34px !important;
        width: auto !important;
        height: auto !important;
    }

    /* Compact metadata so the Service column gets the useful width. */
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-2 {
        font-size: 11px !important;
        line-height: 14px !important;
        text-align: center !important;
        white-space: nowrap !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-3 h4 {
        margin: 0 !important;
        font-size: 13px !important;
        line-height: 15px !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-4 {
        text-align: center !important;
    }

    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list .col-style-4 span {
        padding-left: 1px !important;
        padding-right: 1px !important;
        font-size: 10px !important;
        line-height: 13px !important;
        white-space: normal !important;
    }

    /* Cart remains icon-only and uses almost the full 10% action column. */
    .gsm-products-service-list-v1 .service-search-main .gsm-direct-order-cart,
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a {
        width: 26px !important;
        min-width: 26px !important;
        height: 26px !important;
        min-height: 26px !important;
        padding: 1px !important;
        margin: 0 auto !important;
    }

    .gsm-products-service-list-v1 .service-search-main .gsm-direct-order-cart .img-cart,
    .gsm-products-service-list-v1 .service-search-main .table-service .tr-detail-list > td:last-child > a .img-cart {
        width: 19px !important;
        min-width: 19px !important;
        height: auto !important;
    }

    /* Align subgroup title with the tighter mobile content edge. */
    .gsm-products-service-list-v1 .service-search-main .table-service > tbody > .tr-header > td[colspan="6"] {
        padding-left: 8px !important;
        padding-right: 5px !important;
    }
}