/* Gamex modv1 product mobile compact layer v34
   Scope: category/product listing cards only. Desktop layout is untouched. */

@media (max-width: 767.98px) {
    :root {
        --gmx-mobile-nav-space: 92px;
        --gmx-card-bg-mobile: #111827;
        --gmx-card-border-mobile: rgba(148, 163, 184, .18);
        --gmx-card-soft-mobile: rgba(15, 23, 42, .72);
    }

    body.dark,
    body.dark.modern,
    html.dark body {
        --gmx-card-bg-mobile: #111827;
        --gmx-card-border-mobile: rgba(148, 163, 184, .18);
        --gmx-card-soft-mobile: rgba(15, 23, 42, .72);
    }

    body:not(.dark),
    body:not(.dark).modern {
        --gmx-card-bg-mobile: #ffffff;
        --gmx-card-border-mobile: rgba(15, 23, 42, .12);
        --gmx-card-soft-mobile: rgba(248, 250, 252, .92);
    }

    .gmx-product-cards,
    .gmx-product-cards * {
        -webkit-tap-highlight-color: transparent;
        box-sizing: border-box;
    }

    .gmx-product-cards {
        padding-bottom: 12px;
    }

    .gmx-product-cards .gmx-product-items {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .gmx-product-cards .gmx-product-items > [class*="col-"],
    .gmx-product-cards .gmx-product-items > .card-body {
        padding-left: 0 !important;
        padding-right: 0 !important;
        max-width: 100% !important;
    }

    /* Mobile must not inherit desktop hover movement. Phones do enough suffering already. */
    .gmx-product-cards .pl-row:hover,
    .gmx-product-cards .neo-card:hover,
    .gmx-product-cards .neo-card:hover .neo-card__img,
    .gmx-product-cards .lt-game-card:hover,
    .gmx-product-cards .lt-op-btn:hover,
    .gmx-product-cards .lt-badge:hover {
        transform: none !important;
    }

    .gmx-product-cards .pl-row,
    .gmx-product-cards .neo-card,
    .gmx-product-cards .lt-game-card,
    .gmx-product-cards .lt-order-panel {
        transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease !important;
        will-change: auto !important;
    }

    /* VIEW 2: pl-list compact horizontal card. Old mobile CSS was turning it into a tall poster. Cute, but no. */
    .gmx-product-cards.gmx-card-view-2 .pl-list {
        width: 100% !important;
        margin: 0 0 10px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-row {
        display: grid !important;
        grid-template-columns: 74px minmax(0, 1fr) !important;
        align-items: start !important;
        gap: 10px !important;
        min-height: 0 !important;
        padding: 10px !important;
        border-radius: 16px !important;
        background: var(--gmx-card-bg-mobile) !important;
        border-color: var(--gmx-card-border-mobile) !important;
        box-shadow: 0 8px 22px rgba(0, 0, 0, .14) !important;
        overflow: hidden !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-row::before {
        opacity: .55 !important;
        background: radial-gradient(circle at 12% 10%, rgba(249, 115, 22, .13), transparent 45%) !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-thumb {
        width: 74px !important;
        height: 74px !important;
        border-radius: 14px !important;
        grid-row: 1 / span 3;
        background: rgba(2, 6, 23, .34) !important;
        border: 1px solid rgba(148, 163, 184, .14);
    }

    .gmx-product-cards.gmx-card-view-2 .pl-main {
        min-width: 0 !important;
        gap: 5px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-head {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: start !important;
        gap: 8px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-title {
        font-size: 14px !important;
        line-height: 1.22 !important;
        margin: 0 !important;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        color: #f8fafc !important;
    }

    body:not(.dark) .gmx-product-cards.gmx-card-view-2 .pl-title {
        color: #0f172a !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-badge {
        padding: 3px 7px !important;
        font-size: 10px !important;
        line-height: 1.1 !important;
        max-width: 92px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-sub {
        font-size: 12px !important;
        line-height: 1.25 !important;
        margin: 0 !important;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-meta {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 8px !important;
        margin-top: 1px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .gamex-point-content {
        padding: 3px 7px !important;
        font-size: 10px !important;
        line-height: 1.1 !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-price {
        align-items: flex-end !important;
        gap: 0 !important;
        margin-left: auto;
    }

    .gmx-product-cards.gmx-card-view-2 .products-price-old {
        font-size: 10px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .products-price-current {
        font-size: 15px !important;
        line-height: 1.1 !important;
        color: #34d399 !important;
        white-space: nowrap;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-actions {
        grid-column: 1 / -1;
        display: grid !important;
        grid-template-columns: 116px minmax(0, 1fr) !important;
        align-items: center !important;
        gap: 8px !important;
        margin-top: 6px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-qty {
        align-self: auto !important;
        width: 116px !important;
        height: 38px !important;
        padding: 3px !important;
        border-radius: 13px !important;
        background: rgba(2, 6, 23, .35) !important;
        border: 1px solid rgba(148, 163, 184, .18);
    }

    body:not(.dark) .gmx-product-cards.gmx-card-view-2 .pl-qty {
        background: rgba(241, 245, 249, .92) !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-qty-btn,
    .gmx-product-cards.gmx-card-view-2 .gamex-qty-btn {
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        border-radius: 10px !important;
        font-size: 15px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-qty-input,
    .gmx-product-cards.gmx-card-view-2 .gamex-input-quantity {
        width: 36px !important;
        height: 32px !important;
        font-size: 14px !important;
        color: #f8fafc !important;
    }

    body:not(.dark) .gmx-product-cards.gmx-card-view-2 .pl-qty-input,
    body:not(.dark) .gmx-product-cards.gmx-card-view-2 .gamex-input-quantity {
        color: #0f172a !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-buttons {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 6px !important;
        width: 100% !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-buttons .pl-btn {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 38px !important;
        padding: 8px 6px !important;
        border-radius: 13px !important;
        font-size: 11.5px !important;
        line-height: 1.1 !important;
        white-space: normal !important;
        box-shadow: none !important;
        transform: none !important;
    }

    /* VIEW 1: neo-card. Keep it card-like, but make it a two-column compact mobile grid. */
    .gmx-product-cards.gmx-card-view-1 .gmx-product-items {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .gmx-product-cards.gmx-card-view-1 .gmx-product-items > [class*="col-"],
    .gmx-product-cards.gmx-card-view-1 .gmx-product-items > .card-body {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
        margin: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-1 .neo-card {
        height: 100% !important;
        min-height: 0 !important;
        border-radius: 16px !important;
        background: var(--gmx-card-bg-mobile) !important;
        border-color: var(--gmx-card-border-mobile) !important;
        box-shadow: 0 8px 22px rgba(0, 0, 0, .13) !important;
        overflow: hidden !important;
    }

    .gmx-product-cards.gmx-card-view-1 .neo-card__media {
        padding-top: 0 !important;
        aspect-ratio: 1 / .86 !important;
        min-height: 122px !important;
        background: rgba(2, 6, 23, .32) !important;
    }

    .gmx-product-cards.gmx-card-view-1 .neo-card__img-wrap,
    .gmx-product-cards.gmx-card-view-1 .neo-card__media .skeleton-wrapper {
        height: 100% !important;
    }

    .gmx-product-cards.gmx-card-view-1 .neo-card__img {
        position: relative !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: contain !important;
        transform: none !important;
    }

    .gmx-product-cards.gmx-card-view-1 .neo-badge,
    .gmx-product-cards.gmx-card-view-1 .neo-inbasket,
    .gmx-product-cards.gmx-card-view-1 .neo-points {
        padding: 4px 7px !important;
        font-size: 10px !important;
        border-radius: 999px !important;
        max-width: calc(100% - 18px);
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .gmx-product-cards.gmx-card-view-1 .neo-card__content {
        padding: 10px !important;
        gap: 6px !important;
    }

    .gmx-product-cards.gmx-card-view-1 .neo-card__title {
        font-size: 13px !important;
        line-height: 1.2 !important;
        height: 32px !important;
        margin-bottom: 4px !important;
        -webkit-line-clamp: 2 !important;
    }

    .gmx-product-cards.gmx-card-view-1 .neo-tags {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow: hidden !important;
        gap: 4px !important;
        margin: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-1 .neo-tag {
        padding: 3px 6px !important;
        font-size: 9.5px !important;
        line-height: 1 !important;
        max-width: 100%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .gmx-product-cards.gmx-card-view-1 .neo-price {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 0 !important;
        margin: 2px 0 6px !important;
    }

    .gmx-product-cards.gmx-card-view-1 .neo-price__old {
        font-size: 10px !important;
    }

    .gmx-product-cards.gmx-card-view-1 .neo-price__now {
        font-size: 15px !important;
        line-height: 1.1 !important;
        color: #34d399 !important;
        white-space: nowrap;
    }

    .gmx-product-cards.gmx-card-view-1 .neo-controls {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 6px !important;
        margin-top: auto !important;
    }

    .gmx-product-cards.gmx-card-view-1 .gamex-table-item.gamex-quantity,
    .gmx-product-cards.gmx-card-view-1 .neo-cart-btn {
        width: 100% !important;
        flex: none !important;
    }

    .gmx-product-cards.gmx-card-view-1 .gamex-quantity-calc {
        min-height: 36px !important;
        padding: 3px !important;
        border-radius: 12px !important;
        justify-content: space-between !important;
        background: rgba(2, 6, 23, .35) !important;
        border: 1px solid rgba(148, 163, 184, .18) !important;
    }

    body:not(.dark) .gmx-product-cards.gmx-card-view-1 .gamex-quantity-calc {
        background: rgba(241, 245, 249, .92) !important;
    }

    .gmx-product-cards.gmx-card-view-1 .neo-cart-btn {
        height: 38px !important;
        min-height: 38px !important;
        padding: 7px 8px !important;
        border-radius: 12px !important;
        font-size: 11.5px !important;
        line-height: 1.1 !important;
        box-shadow: none !important;
        transform: none !important;
    }

    .gmx-product-cards.gmx-card-view-1 .neo-cart-btn span {
        max-width: 90px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* VIEW 4: selectable product list + order panel. Keep PC untouched, make mobile sheet small and above bottom nav. */
    .gmx-product-cards.gmx-card-view-4 .lt-game-layout {
        display: block !important;
        margin-top: 12px !important;
        padding-bottom: 178px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-game-left,
    .gmx-product-cards.gmx-card-view-4 .lt-game-grid {
        width: 100% !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-game-grid {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-game-card {
        min-height: 72px !important;
        padding: 8px 10px !important;
        border-radius: 15px !important;
        background: var(--gmx-card-bg-mobile) !important;
        border-color: var(--gmx-card-border-mobile) !important;
        box-shadow: 0 8px 22px rgba(0, 0, 0, .12) !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-game-card.active {
        border-color: #f97316 !important;
        box-shadow: inset 3px 0 0 #f97316, 0 0 0 1px rgba(249, 115, 22, .22) !important;
        background: linear-gradient(135deg, rgba(249, 115, 22, .08), rgba(15, 23, 42, .35)) !important;
    }

    body:not(.dark) .gmx-product-cards.gmx-card-view-4 .lt-game-card.active {
        background: linear-gradient(135deg, rgba(249, 115, 22, .09), rgba(255, 255, 255, .96)) !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-gc-media {
        width: 54px !important;
        height: 54px !important;
        margin-right: 10px !important;
        border-radius: 12px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-gc-title {
        font-size: 13px !important;
        line-height: 1.17 !important;
        -webkit-line-clamp: 2 !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-gc-price {
        font-size: 13.5px !important;
        line-height: 1.1 !important;
        margin-top: 2px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .text-infov4 {
        display: inline-flex !important;
        max-width: 100% !important;
        padding: 3px 7px !important;
        font-size: 10.5px !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-badge {
        top: -1px !important;
        right: 10px !important;
        padding: 3px 8px !important;
        font-size: 10px !important;
        box-shadow: none !important;
        animation: none !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-game-right {
        position: fixed !important;
        left: 50% !important;
        right: auto !important;
        bottom: calc(var(--gmx-mobile-nav-space) + env(safe-area-inset-bottom, 0px) + 8px) !important;
        width: min(calc(100vw - 20px), 430px) !important;
        max-width: 430px !important;
        transform: translateX(-50%) !important;
        z-index: 39 !important;
        pointer-events: auto !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-order-panel {
        position: relative !important;
        top: auto !important;
        border-radius: 18px !important;
        overflow: hidden !important;
        max-height: 164px !important;
        background: rgba(15, 23, 42, .96) !important;
        border: 1px solid rgba(148, 163, 184, .22) !important;
        box-shadow: 0 14px 32px rgba(0, 0, 0, .30) !important;
    }

    body:not(.dark) .gmx-product-cards.gmx-card-view-4 .lt-order-panel {
        background: rgba(255, 255, 255, .97) !important;
        border-color: rgba(15, 23, 42, .12) !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-head,
    .gmx-product-cards.gmx-card-view-4 .lt-op-divider,
    .gmx-product-cards.gmx-card-view-4 .lt-op-row.mb-3 .lt-op-label,
    .gmx-product-cards.gmx-card-view-4 .lt-op-bonus {
        display: none !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-body {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-template-areas:
            "product qty"
            "total total"
            "actions actions" !important;
        gap: 8px 10px !important;
        align-items: center !important;
        padding: 10px 12px 12px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-body > .lt-op-row:first-child {
        grid-area: product !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-product {
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        gap: 8px !important;
        min-width: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-product img {
        display: none !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-name {
        font-size: 13px !important;
        line-height: 1.18 !important;
        max-height: 32px !important;
        color: #f8fafc !important;
        overflow: hidden !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
    }

    body:not(.dark) .gmx-product-cards.gmx-card-view-4 .lt-op-name {
        color: #0f172a !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-row.align-center {
        grid-area: qty !important;
        margin: 0 !important;
        justify-self: end !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-qty {
        height: 38px !important;
        padding: 3px !important;
        border-radius: 13px !important;
        background: rgba(2, 6, 23, .45) !important;
        border: 1px solid rgba(148, 163, 184, .18) !important;
    }

    body:not(.dark) .gmx-product-cards.gmx-card-view-4 .lt-op-qty {
        background: rgba(241, 245, 249, .92) !important;
    }

    .gmx-product-cards.gmx-card-view-4 .op-qty-btn {
        width: 32px !important;
        height: 32px !important;
        border-radius: 10px !important;
        box-shadow: none !important;
    }

    .gmx-product-cards.gmx-card-view-4 #opQtyInput {
        width: 34px !important;
        height: 32px !important;
        color: #f8fafc !important;
    }

    body:not(.dark) .gmx-product-cards.gmx-card-view-4 #opQtyInput {
        color: #0f172a !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-total {
        grid-area: total !important;
        display: grid !important;
        grid-template-columns: auto minmax(0, 1fr) !important;
        align-items: center !important;
        gap: 8px !important;
        margin: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-total > span {
        font-size: 12px !important;
        color: #94a3b8 !important;
        text-transform: none !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-total .text-end {
        display: flex !important;
        align-items: baseline !important;
        justify-content: flex-end !important;
        gap: 8px !important;
        min-width: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-4 #opTotalPrice,
    .gmx-product-cards.gmx-card-view-4 .lt-op-total .price {
        font-size: 20px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-total small {
        max-width: 130px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        display: inline-block !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-actions,
    .gmx-product-cards.gmx-card-view-4 .product-action-buttons {
        grid-area: actions !important;
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
        width: 100% !important;
        margin: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-btn {
        min-height: 40px !important;
        padding: 9px 8px !important;
        border-radius: 13px !important;
        font-size: 11.5px !important;
        line-height: 1.1 !important;
        text-transform: none !important;
        box-shadow: none !important;
        transform: none !important;
        white-space: normal !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-btn .icon-wrapper {
        margin-right: 4px !important;
    }

    @supports (padding: max(0px)) {
        .gmx-product-cards.gmx-card-view-4 .lt-game-right {
            bottom: max(86px, calc(var(--gmx-mobile-nav-space) + env(safe-area-inset-bottom) + 8px)) !important;
        }
    }
}

@media (max-width: 380px) {
    .gmx-product-cards.gmx-card-view-1 .gmx-product-items {
        gap: 8px !important;
    }

    .gmx-product-cards.gmx-card-view-1 .neo-card__media {
        min-height: 108px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-row {
        grid-template-columns: 66px minmax(0, 1fr) !important;
        padding: 9px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-thumb {
        width: 66px !important;
        height: 66px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-actions {
        grid-template-columns: 104px minmax(0, 1fr) !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-qty {
        width: 104px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-buttons .pl-btn {
        font-size: 10.5px !important;
        padding-left: 4px !important;
        padding-right: 4px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-total small {
        display: none !important;
    }
}

/* Gamex modv1 product mobile compact layer v35
   Fixes requested: View 4 bottom sheet above nav, View 1 remove extra tags,
   View 2 clean mobile row with image/title top and two action buttons below. */
@media (max-width: 767.98px) {
    :root {
        --gmx-mobile-nav-space: 128px;
    }

    /* VIEW 1 / neo-card: remove the extra marketing chips on mobile. */
    .gmx-product-cards.gmx-card-view-1 .neo-tags,
    .gmx-product-cards.gmx-card-view-1 .neo-tag {
        display: none !important;
    }

    .gmx-product-cards.gmx-card-view-1 .neo-card__title {
        height: auto !important;
        min-height: 34px !important;
        margin-bottom: 2px !important;
    }

    .gmx-product-cards.gmx-card-view-1 .neo-card__content {
        gap: 5px !important;
    }

    /* VIEW 2 / pl-list: proper compact mobile row. Image + title area on top, actions below. */
    .gmx-product-cards.gmx-card-view-2 .pl-row {
        display: grid !important;
        grid-template-columns: 86px minmax(0, 1fr) !important;
        gap: 10px 12px !important;
        padding: 10px !important;
        align-items: start !important;
        min-height: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-thumb {
        grid-column: 1 !important;
        grid-row: 1 !important;
        width: 86px !important;
        height: 96px !important;
        align-self: stretch !important;
        border-radius: 14px !important;
        overflow: hidden !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-thumb img {
        width: 100% !important;
        height: 100% !important;
        object-fit: contain !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-main {
        grid-column: 2 !important;
        grid-row: 1 !important;
        min-width: 0 !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        align-content: start !important;
        gap: 6px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-head {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 6px !important;
        align-items: start !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-title {
        font-size: 14px !important;
        line-height: 1.18 !important;
        max-height: 34px !important;
        margin: 0 !important;
        -webkit-line-clamp: 2 !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-badge {
        max-width: 96px !important;
        padding: 4px 8px !important;
        font-size: 10px !important;
        line-height: 1 !important;
        justify-self: end !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-sub {
        font-size: 12px !important;
        line-height: 1.2 !important;
        -webkit-line-clamp: 1 !important;
        margin: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-meta {
        display: grid !important;
        grid-template-columns: auto minmax(0, 1fr) !important;
        gap: 8px !important;
        align-items: center !important;
        margin: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-price {
        justify-self: end !important;
        align-items: flex-end !important;
        margin: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-2 .products-price-current {
        font-size: 15px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-actions {
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
        display: grid !important;
        grid-template-columns: 124px minmax(0, 1fr) !important;
        grid-template-areas:
            "qty spacer"
            "buttons buttons" !important;
        gap: 8px !important;
        align-items: center !important;
        margin-top: 0 !important;
        padding-top: 2px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-qty {
        grid-area: qty !important;
        width: 124px !important;
        height: 38px !important;
        margin: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-buttons {
        grid-area: buttons !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: 8px !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-buttons .pl-btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 5px !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 42px !important;
        padding: 9px 7px !important;
        border-radius: 14px !important;
        font-size: 12px !important;
        line-height: 1.12 !important;
        white-space: normal !important;
        text-align: center !important;
        overflow: hidden !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-buttons .pl-btn i {
        flex: 0 0 auto !important;
        margin: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-buttons .pl-btn span {
        min-width: 0 !important;
        max-width: 96px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    /* VIEW 4 / modern selectable list: keep sticky order panel usable above bottom nav. */
    .gmx-product-cards.gmx-card-view-4 .lt-game-layout {
        padding-bottom: 300px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-game-right {
        bottom: calc(138px + env(safe-area-inset-bottom, 0px)) !important;
        width: min(calc(100vw - 22px), 420px) !important;
        z-index: 72 !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-order-panel {
        max-height: 138px !important;
        border-radius: 17px !important;
        box-shadow: 0 12px 28px rgba(0, 0, 0, .32) !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-body {
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-template-areas:
            "product qty"
            "total total"
            "actions actions" !important;
        gap: 6px 8px !important;
        padding: 9px 11px 10px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-name {
        font-size: 12.5px !important;
        line-height: 1.14 !important;
        max-height: 30px !important;
        -webkit-line-clamp: 2 !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-qty {
        height: 35px !important;
        border-radius: 12px !important;
        padding: 2px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .op-qty-btn {
        width: 30px !important;
        height: 30px !important;
        border-radius: 9px !important;
    }

    .gmx-product-cards.gmx-card-view-4 #opQtyInput {
        width: 32px !important;
        height: 30px !important;
        font-size: 13px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-total {
        grid-template-columns: auto minmax(0, 1fr) !important;
        gap: 6px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-total > span {
        font-size: 11px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-total .text-end {
        justify-content: flex-end !important;
    }

    .gmx-product-cards.gmx-card-view-4 #opTotalPrice,
    .gmx-product-cards.gmx-card-view-4 .lt-op-total .price {
        font-size: 18px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-total small {
        display: none !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-actions,
    .gmx-product-cards.gmx-card-view-4 .product-action-buttons {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: 8px !important;
        width: 100% !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-btn {
        min-height: 38px !important;
        padding: 8px 6px !important;
        border-radius: 13px !important;
        font-size: 11px !important;
        line-height: 1.08 !important;
        white-space: normal !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-btn .btn-text,
    .gmx-product-cards.gmx-card-view-4 .lt-op-btn span:not(.icon-wrapper) {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
}

@media (max-width: 380px) {
    .gmx-product-cards.gmx-card-view-2 .pl-row {
        grid-template-columns: 76px minmax(0, 1fr) !important;
        gap: 9px !important;
        padding: 9px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-thumb {
        width: 76px !important;
        height: 88px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-title {
        font-size: 13px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .products-price-current {
        font-size: 14px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-actions {
        grid-template-columns: 112px minmax(0, 1fr) !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-qty {
        width: 112px !important;
    }

    .gmx-product-cards.gmx-card-view-2 .pl-buttons .pl-btn {
        font-size: 11px !important;
        min-height: 40px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-game-right {
        bottom: calc(130px + env(safe-area-inset-bottom, 0px)) !important;
        width: min(calc(100vw - 14px), 410px) !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-order-panel {
        max-height: 132px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-body {
        padding: 8px 9px 9px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-btn {
        font-size: 10.5px !important;
        min-height: 36px !important;
    }
}

/* Gamex modv1 product mobile compact layer v36
   Requested: hide category hero on mobile and turn View 4 order panel into a small bottom action bar. */
@media (max-width: 767.98px) {
    .gmx-game-detail-wrapper .gmx-game-hero,
    .gmx-game-detail-wrapper .gmx-game-hero.mobgizle {
        display: none !important;
    }

    .gmx-game-detail-wrapper .cardspec,
    .gmx-game-detail-wrapper .card-body.p-0 {
        margin-top: 0 !important;
    }

    .gmx-game-detail-wrapper .gmx-tabs-nav {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 6px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 8px 0 10px !important;
        padding: 6px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
        border-radius: 16px !important;
    }

    .gmx-game-detail-wrapper .gmx-tabs-nav::-webkit-scrollbar {
        display: none !important;
    }

    .gmx-game-detail-wrapper .gmx-tab-link {
        flex: 0 0 auto !important;
        min-height: 36px !important;
        min-width: max-content !important;
        padding: 0 11px !important;
        border-radius: 12px !important;
        font-size: 11.5px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    .gmx-game-detail-wrapper .gmx-tab-link i {
        font-size: 11px !important;
        margin-right: 5px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-game-layout {
        margin-top: 8px !important;
        padding-bottom: 126px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-game-grid {
        gap: 8px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-game-card {
        min-height: 58px !important;
        padding: 9px 11px !important;
        border-radius: 15px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-gc-title {
        font-size: 12.5px !important;
        line-height: 1.16 !important;
        max-height: 31px !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-gc-price .new {
        font-size: 14px !important;
        line-height: 1 !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-badge {
        display: none !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-game-right,
    body > .lt-game-right.is-portal-fixed {
        position: fixed !important;
        left: 50% !important;
        right: auto !important;
        bottom: calc(82px + env(safe-area-inset-bottom, 0px)) !important;
        width: min(calc(100vw - 18px), 430px) !important;
        max-width: 430px !important;
        transform: translateX(-50%) !important;
        z-index: 1045 !important;
        pointer-events: auto !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-order-panel,
    body > .lt-game-right.is-portal-fixed .lt-order-panel {
        position: relative !important;
        top: auto !important;
        max-height: none !important;
        min-height: 0 !important;
        border-radius: 17px !important;
        overflow: hidden !important;
        background: rgba(15, 23, 42, .97) !important;
        border: 1px solid rgba(148, 163, 184, .24) !important;
        box-shadow: 0 16px 36px rgba(0, 0, 0, .38) !important;
        backdrop-filter: blur(16px) !important;
        -webkit-backdrop-filter: blur(16px) !important;
    }

    body:not(.dark) .gmx-product-cards.gmx-card-view-4 .lt-order-panel,
    body:not(.dark) > .lt-game-right.is-portal-fixed .lt-order-panel {
        background: rgba(255, 255, 255, .97) !important;
        border-color: rgba(15, 23, 42, .14) !important;
        box-shadow: 0 16px 34px rgba(15, 23, 42, .16) !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-head,
    .gmx-product-cards.gmx-card-view-4 .lt-op-divider,
    .gmx-product-cards.gmx-card-view-4 .lt-op-bonus,
    .gmx-product-cards.gmx-card-view-4 .lt-op-row.mb-3 .lt-op-label,
    body > .lt-game-right.is-portal-fixed .lt-op-head,
    body > .lt-game-right.is-portal-fixed .lt-op-divider,
    body > .lt-game-right.is-portal-fixed .lt-op-bonus,
    body > .lt-game-right.is-portal-fixed .lt-op-row.mb-3 .lt-op-label {
        display: none !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-body,
    body > .lt-game-right.is-portal-fixed .lt-op-body {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 150px !important;
        grid-template-areas:
            "product qty"
            "total actions" !important;
        gap: 6px 9px !important;
        align-items: center !important;
        padding: 8px 10px 9px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-body > .lt-op-row:first-child,
    body > .lt-game-right.is-portal-fixed .lt-op-body > .lt-op-row:first-child {
        grid-area: product !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-product,
    body > .lt-game-right.is-portal-fixed .lt-op-product {
        min-width: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        gap: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-product img,
    body > .lt-game-right.is-portal-fixed .lt-op-product img {
        display: none !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-name,
    body > .lt-game-right.is-portal-fixed .lt-op-name {
        max-width: 100% !important;
        max-height: 31px !important;
        color: #f8fafc !important;
        font-size: 12.5px !important;
        font-weight: 800 !important;
        line-height: 1.17 !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }

    body:not(.dark) .gmx-product-cards.gmx-card-view-4 .lt-op-name,
    body:not(.dark) > .lt-game-right.is-portal-fixed .lt-op-name {
        color: #0f172a !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-row.align-center,
    body > .lt-game-right.is-portal-fixed .lt-op-row.align-center {
        grid-area: qty !important;
        justify-self: end !important;
        margin: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-qty,
    body > .lt-game-right.is-portal-fixed .lt-op-qty {
        width: 112px !important;
        height: 34px !important;
        padding: 2px !important;
        border-radius: 12px !important;
        background: rgba(2, 6, 23, .42) !important;
        border: 1px solid rgba(148, 163, 184, .20) !important;
    }

    body:not(.dark) .gmx-product-cards.gmx-card-view-4 .lt-op-qty,
    body:not(.dark) > .lt-game-right.is-portal-fixed .lt-op-qty {
        background: rgba(241, 245, 249, .92) !important;
    }

    .gmx-product-cards.gmx-card-view-4 .op-qty-btn,
    body > .lt-game-right.is-portal-fixed .op-qty-btn {
        width: 29px !important;
        height: 29px !important;
        min-width: 29px !important;
        border-radius: 9px !important;
        box-shadow: none !important;
        font-size: 11px !important;
    }

    .gmx-product-cards.gmx-card-view-4 #opQtyInput,
    body > .lt-game-right.is-portal-fixed #opQtyInput {
        width: 38px !important;
        height: 29px !important;
        color: #f8fafc !important;
        font-size: 13px !important;
        font-weight: 800 !important;
    }

    body:not(.dark) .gmx-product-cards.gmx-card-view-4 #opQtyInput,
    body:not(.dark) > .lt-game-right.is-portal-fixed #opQtyInput {
        color: #0f172a !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-total,
    body > .lt-game-right.is-portal-fixed .lt-op-total {
        grid-area: total !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 0 !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-total > span,
    .gmx-product-cards.gmx-card-view-4 .lt-op-total small,
    body > .lt-game-right.is-portal-fixed .lt-op-total > span,
    body > .lt-game-right.is-portal-fixed .lt-op-total small {
        display: none !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-total .text-end,
    body > .lt-game-right.is-portal-fixed .lt-op-total .text-end {
        display: block !important;
        text-align: left !important;
        min-width: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-4 #opTotalPrice,
    .gmx-product-cards.gmx-card-view-4 .lt-op-total .price,
    body > .lt-game-right.is-portal-fixed #opTotalPrice,
    body > .lt-game-right.is-portal-fixed .lt-op-total .price {
        color: #34d399 !important;
        font-size: 17px !important;
        font-weight: 900 !important;
        line-height: 1 !important;
        white-space: nowrap !important;
        text-shadow: 0 0 18px rgba(52, 211, 153, .14) !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-actions,
    body > .lt-game-right.is-portal-fixed .lt-op-actions {
        grid-area: actions !important;
        width: 100% !important;
        margin: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-4 .product-action-buttons,
    body > .lt-game-right.is-portal-fixed .product-action-buttons {
        display: grid !important;
        grid-template-columns: 42px minmax(0, 1fr) !important;
        gap: 7px !important;
        width: 100% !important;
        margin: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-btn,
    body > .lt-game-right.is-portal-fixed .lt-op-btn {
        min-width: 0 !important;
        min-height: 38px !important;
        height: 38px !important;
        padding: 0 8px !important;
        border-radius: 12px !important;
        font-size: 11.5px !important;
        font-weight: 900 !important;
        line-height: 1 !important;
        white-space: nowrap !important;
        box-shadow: none !important;
        transform: none !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 5px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-btn.cart,
    body > .lt-game-right.is-portal-fixed .lt-op-btn.cart {
        width: 42px !important;
        padding: 0 !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-btn.cart .btn-text,
    .gmx-product-cards.gmx-card-view-4 .lt-op-btn.cart span:not(.icon-wrapper),
    body > .lt-game-right.is-portal-fixed .lt-op-btn.cart .btn-text,
    body > .lt-game-right.is-portal-fixed .lt-op-btn.cart span:not(.icon-wrapper) {
        display: none !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-btn .icon-wrapper,
    body > .lt-game-right.is-portal-fixed .lt-op-btn .icon-wrapper {
        margin: 0 !important;
        width: auto !important;
        min-width: 0 !important;
    }
}

@media (max-width: 380px) {
    body > .lt-game-right.is-portal-fixed,
    .gmx-product-cards.gmx-card-view-4 .lt-game-right {
        bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important;
        width: min(calc(100vw - 12px), 410px) !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-body,
    body > .lt-game-right.is-portal-fixed .lt-op-body {
        grid-template-columns: minmax(0, 1fr) 142px !important;
        gap: 5px 7px !important;
        padding: 7px 8px 8px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-name,
    body > .lt-game-right.is-portal-fixed .lt-op-name {
        font-size: 12px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-qty,
    body > .lt-game-right.is-portal-fixed .lt-op-qty {
        width: 106px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .product-action-buttons,
    body > .lt-game-right.is-portal-fixed .product-action-buttons {
        grid-template-columns: 38px minmax(0, 1fr) !important;
        gap: 6px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-btn.cart,
    body > .lt-game-right.is-portal-fixed .lt-op-btn.cart {
        width: 38px !important;
    }

    .gmx-product-cards.gmx-card-view-4 .lt-op-btn,
    body > .lt-game-right.is-portal-fixed .lt-op-btn {
        height: 36px !important;
        min-height: 36px !important;
        font-size: 11px !important;
    }
}

/* Gamex modv1 desktop category hero compact layer v37
   Requested: make the PC category hero and tab block smaller without changing translate keys. */
@media (min-width: 768px) {
    .gmx-game-detail-wrapper .gmx-game-hero {
        min-height: 0 !important;
        height: clamp(198px, 20vw, 255px) !important;
        border-radius: 19px !important;
        overflow: hidden !important;
    }

    .gmx-game-detail-wrapper .gmx-game-hero .hero-inner {
        min-height: 100% !important;
        height: 100% !important;
        padding: 24px 38px !important;
        gap: 26px !important;
        align-items: center !important;
    }

    .gmx-game-detail-wrapper .gmx-game-hero .hero-icon-box {
        width: 112px !important;
        height: 112px !important;
        min-width: 112px !important;
        border-radius: 18px !important;
    }

    .gmx-game-detail-wrapper .gmx-game-hero .hero-icon-box img {
        max-width: 92% !important;
        max-height: 92% !important;
    }

    .gmx-game-detail-wrapper .gmx-game-hero .hero-text-box {
        max-width: 680px !important;
    }

    .gmx-game-detail-wrapper .gmx-game-hero .hero-title {
        font-size: clamp(25px, 2.15vw, 34px) !important;
        line-height: 1.08 !important;
        margin: 0 0 9px !important;
        letter-spacing: -.02em !important;
    }

    .gmx-game-detail-wrapper .gmx-game-hero .hero-desc {
        max-width: 620px !important;
        font-size: 14px !important;
        line-height: 1.52 !important;
        margin: 0 !important;
    }

    .gmx-game-detail-wrapper .gmx-game-hero .cat-hero__meta {
        margin-top: 12px !important;
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
    }

    .gmx-game-detail-wrapper .gmx-game-hero .cat-hero__meta .stat {
        min-height: 30px !important;
        padding: 5px 10px !important;
        border-radius: 8px !important;
        font-size: 12px !important;
        line-height: 1 !important;
    }

    .gmx-game-detail-wrapper .gmx-tabs-nav.mt-4 {
        margin-top: 10px !important;
    }

    .gmx-game-detail-wrapper .gmx-tabs-nav {
        padding: 7px !important;
        border-radius: 17px !important;
        min-height: 56px !important;
    }

    .gmx-game-detail-wrapper .gmx-tab-link {
        min-height: 42px !important;
        padding: 0 17px !important;
        border-radius: 13px !important;
        font-size: 13.5px !important;
        line-height: 1 !important;
    }

    .gmx-game-detail-wrapper .gmx-tab-link i {
        font-size: 13px !important;
        margin-right: 6px !important;
    }
}

@media (min-width: 1200px) {
    .gmx-game-detail-wrapper .gmx-game-hero {
        height: 232px !important;
    }

    .gmx-game-detail-wrapper .gmx-game-hero .hero-inner {
        padding-left: 40px !important;
        padding-right: 40px !important;
    }
}