/* ALO_109 /shop DatXe sync
   Mục tiêu: trang /shop dùng layout danh sách giống datxe.net/shop, đồng thời chặn CSS ALO V31 làm ảnh/shop card quá to và mất nhịp.
   Scope chỉ áp dụng cho body.wt-shop-directory-body để không ảnh hưởng trang danh mục, trang listing và trang shop detail. */

body.wt-shop-directory-body main.w11-pro-main{
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    display:block!important;
    background:#f4f4f4!important;
}

body.wt-shop-directory-body .wt-shop-directory-page{
    background:#f4f4f4!important;
    padding:10px 0 36px!important;
    margin:0!important;
    color:#111827!important;
}

body.wt-shop-directory-body .wt-shop-directory-page .ctcat-container{
    width:min(1280px,calc(100% - 32px))!important;
    max-width:1280px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding-left:0!important;
    padding-right:0!important;
    box-sizing:border-box!important;
}

body.wt-shop-directory-body .wt-shop-directory-top-ad,
body.wt-shop-directory-body .wt-shop-directory-bottom-ad{
    display:block!important;
    padding:0!important;
    border:0!important;
    border-radius:16px!important;
    overflow:hidden!important;
    background:transparent!important;
    box-shadow:none!important;
    line-height:0!important;
}
body.wt-shop-directory-body .wt-shop-directory-top-ad{margin:0 0 12px!important;}
body.wt-shop-directory-body .wt-shop-directory-bottom-ad{margin:14px 0 0!important;clear:both!important;}

body.wt-shop-directory-body .wt-shop-directory-top-ad .front-banner,
body.wt-shop-directory-body .wt-shop-directory-top-ad .front-banner img,
body.wt-shop-directory-body .wt-shop-directory-top-ad .front-banner-script,
body.wt-shop-directory-body .wt-shop-directory-bottom-ad .front-banner,
body.wt-shop-directory-body .wt-shop-directory-bottom-ad .front-banner img,
body.wt-shop-directory-body .wt-shop-directory-bottom-ad .front-banner-script{
    display:block!important;
    width:100%!important;
    height:135px!important;
    min-height:135px!important;
    object-fit:cover!important;
    border-radius:16px!important;
    overflow:hidden!important;
    background:#eef2f7!important;
}

body.wt-shop-directory-body .wt-shop-directory-head{
    margin-bottom:14px!important;
    background:#fff!important;
    border:1px solid #e5e7eb!important;
    border-radius:16px!important;
    box-shadow:0 8px 24px rgba(15,23,42,.04)!important;
    padding:18px 20px 14px!important;
    box-sizing:border-box!important;
}
body.wt-shop-directory-body .wt-shop-directory-head .ctcat-title-row h1{
    font-size:20px!important;
    line-height:1.35!important;
    font-weight:800!important;
    margin:0 0 8px!important;
    min-height:0!important;
    letter-spacing:0!important;
}
body.wt-shop-directory-body .wt-shop-directory-head .ctcat-title-row p{
    font-size:14px!important;
    line-height:1.6!important;
    color:#4b5563!important;
    margin:0!important;
    max-width:840px!important;
}

body.wt-shop-directory-body .wt-shop-directory-layout{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,calc(100% - 400px)) 380px!important;
    gap:20px!important;
    justify-content:stretch!important;
    align-items:start!important;
    box-sizing:border-box!important;
}
body.wt-shop-directory-body .ctcat-list-col{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    background:#fff!important;
    border:1px solid #ececec!important;
    border-radius:14px!important;
    overflow:hidden!important;
    box-shadow:none!important;
}
body.wt-shop-directory-body .wt-shop-directory-sidebar{
    width:380px!important;
    max-width:380px!important;
    min-width:0!important;
    display:grid!important;
    gap:14px!important;
    position:sticky!important;
    top:88px!important;
}

body.wt-shop-directory-body .ctcat-tabs{
    height:58px!important;
    border-bottom:1px solid #e5e7eb!important;
    display:flex!important;
    align-items:center!important;
    background:#fff!important;
}
body.wt-shop-directory-body .ctcat-tabs>a{
    height:58px!important;
    padding:0 18px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    color:#111!important;
    text-decoration:none!important;
    font-size:15px!important;
    font-weight:750!important;
    border-bottom:3px solid transparent!important;
    min-height:0!important;
}
body.wt-shop-directory-body .ctcat-tabs>a.active{
    border-bottom-color:#111!important;
    background:#fff!important;
    font-weight:900!important;
}

/* Card danh sách shop: quay về nhịp DatXe, không dùng block V31 220px/auto. */
body.wt-shop-directory-body .wt-shop-directory-list{
    background:#fff!important;
    display:block!important;
}
body.wt-shop-directory-body .wt-shop-directory-list .wt-shop-directory-item,
body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item{
    position:relative!important;
    width:100%!important;
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-columns:172px minmax(0,1fr) 92px!important;
    gap:14px!important;
    align-items:start!important;
    min-height:180px!important;
    padding:14px 16px!important;
    border:0!important;
    border-bottom:1px solid #eeeeee!important;
    border-radius:0!important;
    background:#fff!important;
    box-shadow:none!important;
    transition:.16s ease!important;
}
body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item:hover{
    background:#fffdf2!important;
}

body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__image{
    position:relative!important;
    display:block!important;
    width:172px!important;
    height:152px!important;
    max-width:172px!important;
    max-height:152px!important;
    border-radius:14px!important;
    overflow:hidden!important;
    background:#f1f5f9!important;
    margin:0!important;
}
body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__image img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    display:block!important;
    border-radius:0!important;
}
body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__count{
    position:absolute!important;
    right:6px!important;
    bottom:6px!important;
    background:rgba(0,0,0,.68)!important;
    color:#fff!important;
    border-radius:4px!important;
    padding:3px 6px!important;
    font-size:12px!important;
    line-height:1.2!important;
    font-weight:700!important;
}

body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__body{
    min-width:0!important;
    display:flex!important;
    flex-direction:column!important;
    gap:5px!important;
    padding:1px 0 0!important;
    margin:0!important;
    align-self:stretch!important;
}
body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__title,
body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__title a{
    font-size:17px!important;
    line-height:1.35!important;
    font-weight:800!important;
    margin:0!important;
    color:#111!important;
    text-decoration:none!important;
    min-height:0!important;
    letter-spacing:0!important;
    display:block!important;
    overflow:visible!important;
    -webkit-line-clamp:unset!important;
    -webkit-box-orient:initial!important;
    text-overflow:clip!important;
    word-break:normal!important;
}
body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__title a:hover{
    color:#d97706!important;
}
body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__desc{
    display:block!important;
    font-size:14px!important;
    line-height:1.45!important;
    color:#777!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    min-height:20px!important;
    margin:0!important;
    -webkit-line-clamp:unset!important;
}
body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__price{
    display:block!important;
    font-size:18px!important;
    line-height:1.35!important;
    font-weight:850!important;
    color:#e11d48!important;
    margin:0!important;
}
body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__location{
    display:flex!important;
    align-items:center!important;
    gap:5px!important;
    color:#8a8a8a!important;
    font-size:14px!important;
    line-height:1.35!important;
    margin:0!important;
}
body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__location i{
    color:#b6b6b6!important;
}
body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__seller{
    margin-top:auto!important;
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    color:#333!important;
    font-size:13px!important;
    line-height:1.35!important;
    min-width:0!important;
}
body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__seller small{
    color:#8a8a8a!important;
    font-size:12px!important;
    white-space:nowrap!important;
}
body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__seller-shop{
    color:#d97706!important;
    font-size:13px!important;
    font-weight:900!important;
    text-decoration:none!important;
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}
body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__avatar,
body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__avatar--image{
    flex:0 0 24px!important;
    width:24px!important;
    height:24px!important;
    min-width:24px!important;
    border-radius:50%!important;
    display:grid!important;
    place-items:center!important;
    background:#ffd400!important;
    color:#111!important;
    font-size:12px!important;
    font-weight:900!important;
    overflow:hidden!important;
    box-shadow:none!important;
}
body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__avatar img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    display:block!important;
}

body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__shop-btn{
    position:static!important;
    right:auto!important;
    top:auto!important;
    transform:none!important;
    align-self:center!important;
    justify-self:end!important;
    width:auto!important;
    min-width:72px!important;
    height:30px!important;
    min-height:30px!important;
    padding:0 10px!important;
    margin:0!important;
    border:0!important;
    border-radius:999px!important;
    background:#ffd400!important;
    color:#111!important;
    text-decoration:none!important;
    font-size:12px!important;
    line-height:30px!important;
    font-weight:900!important;
    white-space:nowrap!important;
    box-shadow:none!important;
}
body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__shop-btn:hover{
    background:#ffcf00!important;
    color:#111!important;
}

body.wt-shop-directory-body .wt-shop-directory-inline-ad{
    display:block!important;
    margin:0!important;
    padding:12px 16px!important;
    border:0!important;
    border-bottom:1px solid #eef2f7!important;
    background:#fff!important;
    box-shadow:none!important;
    line-height:0!important;
}
body.wt-shop-directory-body .wt-shop-directory-inline-ad .front-banner,
body.wt-shop-directory-body .wt-shop-directory-inline-ad .front-banner img,
body.wt-shop-directory-body .wt-shop-directory-inline-ad .front-banner-script{
    display:block!important;
    width:100%!important;
    height:120px!important;
    min-height:120px!important;
    object-fit:cover!important;
    border-radius:14px!important;
    overflow:hidden!important;
    background:#eef2f7!important;
}

body.wt-shop-directory-body .wt-shop-directory-sidebar-ad{
    padding:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    border-radius:16px!important;
    overflow:hidden!important;
    line-height:0!important;
}
body.wt-shop-directory-body .wt-shop-directory-sidebar-ad .front-banner,
body.wt-shop-directory-body .wt-shop-directory-sidebar-ad .front-banner img,
body.wt-shop-directory-body .wt-shop-directory-sidebar-ad .front-banner-script{
    display:block!important;
    width:100%!important;
    border-radius:16px!important;
    overflow:hidden!important;
    background:#eef2f7!important;
}

body.wt-shop-directory-body .wt-shop-directory-categories{
    padding:18px!important;
    border-radius:18px!important;
    box-shadow:0 12px 34px rgba(15,23,42,.06)!important;
    border:1px solid #eef2f7!important;
    background:#fff!important;
}
body.wt-shop-directory-body .wt-shop-directory-categories h2{
    font-size:18px!important;
    line-height:1.35!important;
    margin:0 0 14px!important;
    padding-bottom:12px!important;
    border-bottom:1px solid #eef2f7!important;
}
body.wt-shop-directory-body .wt-shop-directory-categories .ctcat-side-link{
    min-height:46px!important;
    border-radius:13px!important;
    padding:11px 14px!important;
    margin-bottom:6px!important;
    border:1px solid transparent!important;
    background:#fff!important;
    transition:.18s ease!important;
    justify-content:flex-start!important;
}
body.wt-shop-directory-body .wt-shop-directory-categories .ctcat-side-link span{
    font-size:14px!important;
    font-weight:800!important;
    color:#0f172a!important;
}
body.wt-shop-directory-body .wt-shop-directory-categories .ctcat-side-link:hover{
    background:#f8fafc!important;
    border-color:#e2e8f0!important;
    transform:translateX(2px)!important;
}
body.wt-shop-directory-body .wt-shop-directory-categories .ctcat-side-link.active{
    background:#fff7cc!important;
    color:#111827!important;
    border-color:#facc15!important;
    box-shadow:inset 4px 0 0 #facc15!important;
    transform:none!important;
}

body.wt-shop-directory-body .ctcat-pagination{
    display:flex!important;
    justify-content:center!important;
    padding:18px!important;
    background:#fff!important;
}

@media (min-width:992px) and (max-width:1199.98px){
    body.wt-shop-directory-body .wt-shop-directory-layout{
        grid-template-columns:minmax(0,calc(100% - 356px)) 340px!important;
        gap:16px!important;
    }
    body.wt-shop-directory-body .wt-shop-directory-sidebar{
        width:340px!important;
        max-width:340px!important;
    }
    body.wt-shop-directory-body .wt-shop-directory-list .wt-shop-directory-item,
    body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item{
        grid-template-columns:150px minmax(0,1fr) 78px!important;
    }
    body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__image{
        width:150px!important;
        height:132px!important;
        max-width:150px!important;
        max-height:132px!important;
    }
}

@media (max-width:991.98px){
    body.wt-shop-directory-body .wt-shop-directory-page{
        padding:8px 0 28px!important;
    }
    body.wt-shop-directory-body .wt-shop-directory-page .ctcat-container{
        width:100%!important;
        max-width:100%!important;
        padding:0 10px!important;
    }
    body.wt-shop-directory-body .wt-shop-directory-top-ad,
    body.wt-shop-directory-body .wt-shop-directory-bottom-ad{
        border-radius:14px!important;
    }
    body.wt-shop-directory-body .wt-shop-directory-top-ad .front-banner,
    body.wt-shop-directory-body .wt-shop-directory-top-ad .front-banner img,
    body.wt-shop-directory-body .wt-shop-directory-top-ad .front-banner-script,
    body.wt-shop-directory-body .wt-shop-directory-bottom-ad .front-banner,
    body.wt-shop-directory-body .wt-shop-directory-bottom-ad .front-banner img,
    body.wt-shop-directory-body .wt-shop-directory-bottom-ad .front-banner-script{
        height:110px!important;
        min-height:110px!important;
        border-radius:14px!important;
    }
    body.wt-shop-directory-body .wt-shop-directory-head{
        border-radius:14px!important;
        margin-left:0!important;
        margin-right:0!important;
    }
    body.wt-shop-directory-body .wt-shop-directory-layout{
        display:block!important;
    }
    body.wt-shop-directory-body .ctcat-list-col{
        margin-left:0!important;
        margin-right:0!important;
        border-radius:14px!important;
        overflow:hidden!important;
    }
    body.wt-shop-directory-body .wt-shop-directory-sidebar{
        display:none!important;
    }
    body.wt-shop-directory-body .wt-shop-directory-list .wt-shop-directory-item,
    body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item{
        grid-template-columns:132px minmax(0,1fr) 78px!important;
        min-height:154px!important;
        gap:10px!important;
        padding:12px 10px!important;
    }
    body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__image{
        width:132px!important;
        height:132px!important;
        max-width:132px!important;
        max-height:132px!important;
        border-radius:14px!important;
    }
    body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__title,
    body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__title a{
        font-size:15px!important;
        line-height:1.32!important;
        display:-webkit-box!important;
        -webkit-line-clamp:2!important;
        -webkit-box-orient:vertical!important;
        overflow:hidden!important;
    }
    body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__desc{
        display:none!important;
    }
    body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__price{
        font-size:16px!important;
    }
    body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__shop-btn{
        min-width:68px!important;
        height:28px!important;
        min-height:28px!important;
        padding:0 8px!important;
        font-size:11px!important;
        line-height:28px!important;
        align-self:center!important;
        justify-self:end!important;
    }
}

@media (max-width:520px){
    body.wt-shop-directory-body .wt-shop-directory-list .wt-shop-directory-item,
    body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item{
        grid-template-columns:124px minmax(0,1fr) 68px!important;
        min-height:148px!important;
        gap:8px!important;
    }
    body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__image{
        width:124px!important;
        height:124px!important;
        max-width:124px!important;
        max-height:124px!important;
        border-radius:13px!important;
    }
    body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__seller small{
        display:none!important;
    }
    body.wt-shop-directory-body .wt-shop-directory-list .ctcat-item__shop-btn{
        min-width:62px!important;
        padding:0 7px!important;
        font-size:10.5px!important;
    }
}
