.xq-recommend-product-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
}

.xq-recommend-product-card{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:14px;
    min-width:0;
    min-height:96px;
    padding:12px 14px;
    border:1px solid #dfe5ea;
    border-radius:6px;
    background:#fff;
    color:#1f2937;
    box-shadow:none;
    transition:box-shadow .2s ease,border-color .2s ease,transform .2s ease;
}

.xq-recommend-product-card:hover{
    text-decoration:none;
    color:#1f2937;
    border-color:#d8e5ea;
    box-shadow:0 10px 24px rgba(15,23,42,.08);
    transform:translateY(-1px);
}

.xq-recommend-product-card__media{
    flex:0 0 var(--xq-product-thumb-pc-width, 110px);
    width:var(--xq-product-thumb-pc-width, 110px);
    max-width:var(--xq-product-thumb-pc-width, 110px);
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    aspect-ratio:533 / 300;
    border-radius:8px;
    overflow:hidden;
    background:#f8f9fa;
}

.xq-recommend-product-card__img{
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:center center;
    border-radius:8px;
    background:#f8f9fa;
}

@supports not (aspect-ratio: 533 / 300){
    .xq-recommend-product-card__media{
        height:0;
        padding-top:56.29%;
    }

    .xq-recommend-product-card__img{
        position:absolute;
        left:0;
        top:0;
        width:100%;
        height:100%;
    }
}

.xq-recommend-product-card__body{
    flex:1 1 auto;
    width:auto;
    max-width:calc(100% - var(--xq-product-thumb-pc-width, 110px) - 14px);
    min-width:0;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    text-align:left;
    gap:8px;
}

.xq-recommend-product-card__title{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
    font-size:15px;
    font-weight:700;
    line-height:1.4;
    color:#1f2937;
    word-break:break-word;
}

.xq-recommend-product-card__badges{
    display:flex;
    align-items:center;
    gap:6px;
    min-width:0;
    flex-wrap:nowrap;
    overflow:hidden;
}

.xq-recommend-badge-slot{
    min-width:0;
    flex:0 1 auto;
}

.xq-recommend-badge-slot--type{ flex-basis:72px; }
.xq-recommend-badge-slot--price{ flex-basis:76px; }
.xq-recommend-badge-slot--stock{ flex-basis:84px; }
.xq-recommend-badge-slot--promo{ flex-basis:58px; }

.xq-recommend-badge{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    min-width:0;
    height:24px;
    padding:0 6px;
    border-radius:4px;
    color:#fff;
    font-size:12px;
    font-weight:600;
    line-height:1;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    box-sizing:border-box;
}

.xq-recommend-badge--auto{ background:#34c38f; }
.xq-recommend-badge--manual{ background:#f59e0b; }
.xq-recommend-badge--price{ background:#ff6b6b; }
.xq-recommend-badge--stock{ background:#3b82f6; }
.xq-recommend-badge--stock-empty{ background:#94a3b8; }
.xq-recommend-badge--promo{ background:#f4b400; }
.xq-recommend-badge--placeholder{ visibility:hidden; }

.xq-buy-related-grid,
.article-product-grid{
    margin-top:2px;
}

@media (max-width: 991.98px){
    .xq-recommend-product-grid{
        grid-template-columns:1fr;
    }
}

@media (max-width: 767.98px){
    .xq-recommend-product-grid{
        gap:10px;
    }

    .xq-recommend-product-card{
        gap:12px;
        min-height:88px;
        padding:11px 12px;
        justify-content:flex-start;
    }

    .xq-recommend-product-card__media{
        flex-basis:var(--xq-product-thumb-mobile-width, 96px);
        width:var(--xq-product-thumb-mobile-width, 96px);
        max-width:var(--xq-product-thumb-mobile-width, 96px);
    }

    .xq-recommend-product-card__img{
        width:100%;
        height:100%;
    }

    .xq-recommend-product-card__body{
        flex:1 1 auto;
        width:auto;
        max-width:calc(100% - var(--xq-product-thumb-mobile-width, 96px) - 12px);
        gap:7px;
    }

    .xq-recommend-product-card__title{
        font-size:14px;
    }

    .xq-recommend-product-card__badges{
        gap:5px;
    }

    .xq-recommend-badge{
        height:23px;
        padding:0 5px;
        font-size:11px;
    }

    .xq-recommend-badge-slot--type{ flex-basis:66px; }
    .xq-recommend-badge-slot--price{ flex-basis:70px; }
    .xq-recommend-badge-slot--stock{ flex-basis:78px; }
    .xq-recommend-badge-slot--promo{ flex-basis:54px; }
}