.catalog-zb{
width:100%;
box-sizing:border-box;
}
.catalog-zb-toolbar{
display:flex;
gap:12px;
align-items:center;
justify-content:space-between;
flex-wrap:wrap;
margin:0 0 16px 0;
}
.catalog-zb-toolbar input,
.catalog-zb-toolbar select,
.catalog-zb-toolbar button{
height:44px;
border:1px solid #ddd8cb;
border-radius:12px;
background:#fff;
padding:0 14px;
font-size:14px;
color:#3c3c34;
box-sizing:border-box;
outline:none;
}
.catalog-zb-toolbar input{
flex:1;
min-width:260px;
}
.catalog-zb-toolbar select{
min-width:220px;
}
.catalog-zb-toolbar button{
cursor:pointer;
}
.catalog-zb-meta{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
margin:0 0 20px 0;
font-size:14px;
color:#6d6d63;
}
.catalog-zb-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:24px;
}
.catalog-card{
background:#fff;
border:1px solid #ddd8cb;
border-radius:18px;
padding:16px;
box-sizing:border-box;
display:flex;
flex-direction:column;
min-height:420px;
}
.catalog-card-image{
display:flex;
align-items:center;
justify-content:center;
height:180px;
border-radius:14px;
background:#faf8f4;
overflow:hidden;
margin:0 0 14px 0;
text-decoration:none;
}
.catalog-card-image img{
width:100%;
height:100%;
object-fit:contain;
display:block;
}
.catalog-card-brand{
font-size:13px;
color:#7a766d;
margin:0 0 8px 0;
}
.catalog-card-title{
font-size:17px;
font-weight:600;
color:#2f2f2a;
text-decoration:none;
margin:0 0 8px 0;
display:block;
}
.catalog-card-desc{
font-size:13px;
color:#6d6d63;
margin:0 0 16px 0;
}
.catalog-card-bottom{
margin-top:auto;
display:flex;
align-items:flex-end;
justify-content:space-between;
gap:12px;
}
.catalog-card-price{
font-size:24px;
font-weight:700;
color:#2f2f2a;
}
.catalog-card-oldprice{
font-size:14px;
color:#9b988f;
text-decoration:line-through;
min-height:18px;
}
.catalog-card-badges{
display:flex;
flex-wrap:wrap;
gap:8px;
margin:0 0 14px 0;
}
.catalog-card-badge{
display:inline-flex;
align-items:center;
justify-content:center;
padding:6px 10px;
border-radius:999px;
background:#eef4e8;
color:#5b7d48;
font-size:12px;
font-weight:600;
line-height:1;
}
.catalog-card-badge.sale{
background:#bc4a4a;
color:#fff;
}
.catalog-card-actions{
display:flex;
gap:10px;
flex-wrap:wrap;
}
.catalog-btn{
display:inline-flex;
align-items:center;
justify-content:center;
height:40px;
padding:0 14px;
border-radius:10px;
text-decoration:none;
font-size:14px;
font-weight:500;
box-sizing:border-box;
}
.catalog-btn-main{
background:#7aa05f;
color:#fff;
}
.catalog-btn-alt{
background:#fff;
border:1px solid #ddd8cb;
color:#3c3c34;
}
.catalog-empty{
grid-column:1 / -1;
background:#fff;
border:1px solid #ddd8cb;
border-radius:18px;
padding:28px;
color:#6d6d63;
}
.js-filter-btn{
cursor:pointer;
transition:all .2s ease;
}
.js-filter-btn.is-active{
background-color:#7aa05f !important;
border-color:#7aa05f !important;
color:#fff !important;
}
.js-filter-btn.is-active *{
color:#fff !important;
}
@media screen and (max-width:980px){
.catalog-zb-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
}
}
@media screen and (max-width:640px){
.catalog-zb-toolbar{
flex-direction:column;
align-items:stretch;
}
.catalog-zb-toolbar input,
.catalog-zb-toolbar select,
.catalog-zb-toolbar button{
width:100%;
min-width:100%;
}
.catalog-zb-grid{
grid-template-columns:1fr;
}
.catalog-card-bottom{
flex-direction:column;
align-items:flex-start;
}
}
</style>