/* Vimal Pets & Toys: catalogue layer (cards, filter bar). Load after css/style.css. */
/* ---------- grid: 2 columns on phones, 1 only on very narrow screens ---------- */
.vpw-grid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))!important;gap:22px!important;align-items:stretch!important}
@media(max-width:900px){.vpw-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important}}
@media(max-width:340px){.vpw-grid{grid-template-columns:1fr!important}}

/* ---------- card: image, name, price, badge, button always line up ---------- */
.product-card.vpw-card{display:flex!important;flex-direction:column!important;height:100%;min-width:0;max-width:100%;overflow:hidden}
.vpw-card>a{display:flex!important;flex-direction:column;flex:1 1 auto;min-height:0;color:inherit;text-decoration:none}
.vpw-imgwrap{display:block;position:relative;width:100%;aspect-ratio:4/3;overflow:hidden;background:#eef2f6;flex:0 0 auto}
.vpw-img{display:block;width:100%!important;height:100%!important;object-fit:cover;object-position:center}
.vpw-nophoto .vpw-imgwrap::after{content:"Photo coming soon";position:absolute;left:8px;bottom:8px;background:rgba(15,23,42,.8);color:#fff;font:700 11px/1 Arial,sans-serif;padding:5px 10px;border-radius:20px}
.vpw-name{font-size:clamp(15px,1.5vw,19px)!important;line-height:1.3!important;min-height:2.6em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.vpw-desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.8em;line-height:1.4}
.vpw-price{margin-top:auto!important;font-variant-numeric:tabular-nums;white-space:nowrap}
.vpw-stock{display:inline-block;align-self:flex-start;margin:6px 16px 0;padding:4px 10px;border-radius:20px;font:700 12px/1.2 Arial,sans-serif}
.vpw-s-in{background:#e4f7ec;color:#0b6b3a}
.vpw-s-out{background:#fde8e8;color:#a31616}
.vpw-s-contact{background:#fff2cc;color:#7a5200}
.vpw-btn{display:block;width:calc(100% - 32px);margin:12px 16px 16px!important;cursor:pointer;flex:0 0 auto}
.vpw-btn-price,.vpw-btn-enquire{background:#fff!important;color:#0b5c78!important;border:2px solid #0b9fc4!important}
.vpw-btn-out,.vpw-btn:disabled{background:#d5dae1!important;color:#5c6675!important;border:0!important;cursor:not-allowed;box-shadow:none!important}
@media(max-width:900px){
 .vpw-stock{margin-left:12px;font-size:11px}
 .vpw-btn{width:calc(100% - 24px);margin:10px 12px 12px!important;padding:10px 8px!important;font-size:14px!important}
 .vpw-name{font-size:14px!important}
 .vpw-desc{font-size:12.5px!important}
}

/* ---------- search + filter bar ---------- */
.vpw-bar{box-sizing:border-box;display:grid;grid-template-columns:2fr 1.2fr 1.6fr 1.1fr 1.2fr auto;gap:12px 14px;align-items:end;width:min(1340px,calc(100% - 40px));margin:26px auto 0;padding:18px;background:#fff;color:#14213d;border:1px solid #dfe6ee;border-radius:18px;box-shadow:0 6px 22px rgba(0,0,0,.12);font-family:Arial,sans-serif}
.vpw-f{display:flex;flex-direction:column;gap:5px;min-width:0}
.vpw-f label{font-size:12px;font-weight:700;color:#475569}
.vpw-bar input,.vpw-bar select{box-sizing:border-box;width:100%;height:42px;padding:0 12px;border:1px solid #cbd5e1;border-radius:10px;background:#fff;color:#14213d;font-size:14px}
.vpw-bar input:focus,.vpw-bar select:focus{outline:3px solid #9ddff2;border-color:#0b9fc4}
.vpw-range{display:flex;align-items:center;gap:6px}
.vpw-range span{color:#64748b}
.vpw-clear{height:42px;padding:0 18px;border:2px solid #0b9fc4;border-radius:10px;background:#fff;color:#0b5c78;font-weight:700;cursor:pointer;white-space:nowrap}
.vpw-clear:hover{background:#e8f8fd}
.vpw-count{grid-column:1/-1;margin:2px 0 0;font-size:13px;font-weight:700;color:#475569}
.vpw-empty{box-sizing:border-box;width:min(640px,calc(100% - 40px));margin:34px auto;padding:34px 22px;text-align:center;background:#fff;color:#14213d;border-radius:18px;box-shadow:0 6px 22px rgba(0,0,0,.12)}
.vpw-empty[hidden]{display:none}
.vpw-empty-ico{font-size:40px}
.vpw-empty h3{margin:8px 0;font-size:22px;color:#14213d}
.vpw-empty p{margin:0 0 16px;color:#475569}
@media(max-width:1000px){.vpw-bar{grid-template-columns:1fr 1fr}.vpw-f-q,.vpw-f-price{grid-column:1/-1}.vpw-f-actions{grid-column:1/-1}.vpw-clear{width:100%}}
@media(max-width:480px){.vpw-bar{width:calc(100% - 24px);padding:14px}.vpw-bar{grid-template-columns:1fr 1fr}}
.vpw-render{max-width:1240px;margin:24px auto!important;padding:0!important}

/* ---------- search-results.html has no css/style.css, so give its cards a base look ---------- */
.vpw-render .product-card{background:#fff;border:1px solid #e3e9ef;border-radius:16px;box-shadow:0 5px 18px rgba(0,0,0,.07);text-align:left;color:#14213d}
.vpw-render .product-card h2{margin:12px 14px 4px;font-size:16px;color:#14213d}
.vpw-render .product-card .description{margin:0 14px 8px;font-size:13px;color:#64748b}
.vpw-render .product-card .price{margin:auto 14px 0;font-size:18px;font-weight:700;color:#0b5c78}
.vpw-render .product-card button.vpw-btn-cart{background:#00b4d8;color:#fff;border:0;border-radius:10px;padding:11px;font-weight:700}
.vpw-render .product-card .vpw-stock{margin-left:14px}