/*
 |--------------------------------------------------------------------------
 | ALO V31 - Frontend Listing/Shop Trust Cleanup Sau Seed Scale
 |--------------------------------------------------------------------------
 | Mục tiêu: sau V29 seed 220 shop + 440 listing và V30 crawl/cache,
 | khóa lại hiển thị card shop/listing để dữ liệu scale không làm vỡ layout,
 | tiêu đề dài không tràn, ảnh fallback ổn, CTA rõ, mobile gọn.
 */

:root{
    --alo-v31-card-radius:18px;
    --alo-v31-soft-border:#e5e7eb;
    --alo-v31-text:#0f172a;
    --alo-v31-muted:#64748b;
    --alo-v31-bg:#f8fafc;
    --alo-v31-shadow:0 14px 38px rgba(15,23,42,.07);
}

/* Card nền chung: shop directory + listing grid */
.ctcat-list .ctcat-item,
.wt-shop-directory-list .wt-shop-directory-item,
.dtx-card,
.w11-shop-grid-pro .w11-shop-pro{
    border:1px solid var(--alo-v31-soft-border)!important;
    border-radius:var(--alo-v31-card-radius)!important;
    background:#fff!important;
    box-shadow:0 8px 24px rgba(15,23,42,.045)!important;
    overflow:hidden!important;
    transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease!important;
}

.ctcat-list .ctcat-item:hover,
.wt-shop-directory-list .wt-shop-directory-item:hover,
.dtx-card:hover,
.w11-shop-grid-pro .w11-shop-pro:hover{
    transform:translateY(-2px)!important;
    box-shadow:var(--alo-v31-shadow)!important;
    border-color:color-mix(in srgb, var(--alo-ui-link-color, #ef4444) 28%, #e5e7eb)!important;
}

/* Ảnh không méo, card đồng chiều cao hơn khi seed nhiều tỉnh/danh mục */
.ctcat-item__image,
.dtx-card__image,
.w11-shop-pro > img{
    background:linear-gradient(135deg,#f8fafc,#eef2ff)!important;
    overflow:hidden!important;
}

.ctcat-item__image img,
.dtx-card__image img,
.w11-shop-pro > img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    display:block!important;
}

.ctcat-list .ctcat-item__image{min-height:168px!important;aspect-ratio:4/3!important;}
.dtx-card__image{aspect-ratio:4/3!important;}
.w11-shop-grid-pro .w11-shop-pro > img{aspect-ratio:1/1!important;}

/* Khóa tiêu đề dài của dữ liệu seed */
.ctcat-item__title,
.ctcat-item__title a,
.dtx-card__title,
.dtx-card__title a,
.w11-shop-pro strong{
    color:var(--alo-v31-text)!important;
    font-weight:900!important;
    line-height:1.24!important;
    overflow:hidden!important;
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    text-overflow:ellipsis!important;
    word-break:break-word!important;
}

.ctcat-item__title,
.ctcat-item__title a{font-size:20px!important;-webkit-line-clamp:2!important;min-height:50px!important;}
.dtx-card__title,
.dtx-card__title a{font-size:18px!important;-webkit-line-clamp:2!important;min-height:45px!important;}
.w11-shop-pro strong{font-size:16px!important;-webkit-line-clamp:2!important;min-height:40px!important;}

.ctcat-item__desc,
.w11-shop-pro small,
.dtx-card__meta,
.ctcat-item__location,
.ctcat-item__seller{
    color:var(--alo-v31-muted)!important;
    line-height:1.45!important;
}

.ctcat-item__desc,
.w11-shop-pro small{
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
    overflow:hidden!important;
}

/* Shop directory: nút Xem Shop không bị rơi khỏi card */
.wt-shop-directory-list .wt-shop-directory-item{
    position:relative!important;
    display:grid!important;
    grid-template-columns:220px minmax(0,1fr) auto!important;
    align-items:stretch!important;
    gap:0!important;
    padding:0!important;
}

.wt-shop-directory-list .ctcat-item__body{padding:18px!important;min-width:0!important;}
.wt-shop-directory-list .ctcat-item__shop-btn{
    align-self:center!important;
    margin:18px!important;
    white-space:nowrap!important;
    border-radius:999px!important;
    min-height:42px!important;
    padding:10px 18px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    font-weight:900!important;
    box-shadow:0 10px 24px color-mix(in srgb, var(--alo-ui-cta-button-bg, #facc15) 22%, transparent)!important;
}

.ctcat-item__seller-shop,
.ctcat-item__shop-cta,
.dtx-card__shop-corner,
.w11-shop-pro em{
    font-weight:900!important;
}

.ctcat-item__avatar,
.ctcat-item__avatar--image{
    flex:0 0 34px!important;
    width:34px!important;
    height:34px!important;
    border-radius:999px!important;
    overflow:hidden!important;
    background:var(--alo-ui-link-color, #ef4444)!important;
    color:#fff!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    font-weight:900!important;
}

.ctcat-item__avatar img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important;}

/* Listing card CTA rõ ràng, giảm rối sau scale */
.dtx-card__conversion,
.ctcat-item__conversion{
    margin-top:12px!important;
}
.dtx-card__conversion a,
.ctcat-item__conversion a{
    min-height:40px!important;
    border-radius:12px!important;
    font-weight:900!important;
}

/* Homepage shop grid sau khi số shop tăng */
.w11-shop-grid-pro{
    gap:16px!important;
}
.w11-shop-grid-pro .w11-shop-pro{
    min-width:0!important;
    text-decoration:none!important;
    padding:12px!important;
}
.w11-shop-grid-pro .w11-shop-pro span{min-width:0!important;}
.w11-shop-grid-pro .w11-shop-pro em{
    margin-top:8px!important;
    display:inline-flex!important;
    width:max-content!important;
    max-width:100%!important;
    border-radius:999px!important;
    padding:5px 10px!important;
    background:#f8fafc!important;
    color:var(--alo-v31-muted)!important;
    border:1px solid #eef2f7!important;
    font-style:normal!important;
}

/* Pagination gọn, không sát footer */
.ctcat-pagination{
    margin:22px 0 8px!important;
}
.ctcat-pagination nav,
.ctcat-pagination .pagination{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:6px!important;
    justify-content:center!important;
}

@media(max-width:991px){
    .wt-shop-directory-list .wt-shop-directory-item{
        grid-template-columns:150px minmax(0,1fr)!important;
    }
    .wt-shop-directory-list .ctcat-item__shop-btn{
        grid-column:1 / -1!important;
        margin:0 14px 14px!important;
        width:auto!important;
    }
    .ctcat-list .ctcat-item__image{min-height:145px!important;}
}

@media(max-width:575px){
    .ctcat-list .ctcat-item,
    .wt-shop-directory-list .wt-shop-directory-item{
        display:block!important;
        border-radius:16px!important;
    }
    .ctcat-list .ctcat-item__image,
    .wt-shop-directory-list .ctcat-item__image,
    .dtx-card__image{
        width:100%!important;
        min-height:0!important;
        aspect-ratio:16/10!important;
    }
    .ctcat-item__title,
    .ctcat-item__title a{font-size:18px!important;min-height:auto!important;}
    .dtx-card__title,
    .dtx-card__title a{font-size:17px!important;min-height:auto!important;}
    .wt-shop-directory-list .ctcat-item__body{padding:14px!important;}
    .wt-shop-directory-list .ctcat-item__shop-btn{margin:0 14px 14px!important;width:calc(100% - 28px)!important;}
    .w11-shop-grid-pro{gap:12px!important;}
}