/* assets/shop.css — WP-style shop (v1) */
:root{--bg:#f8fafc; --text:#111827; --muted:#6b7280; --border:#e5e7eb; --brand:#111827}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial}
a{color:var(--text)}
input,select,button{padding:8px;border:1px solid var(--border);border-radius:8px;background:#fff}
button{cursor:pointer}
.shop-wrap{display:grid;grid-template-columns:260px 1fr;gap:16px;margin:20px auto;max-width:1200px;padding:0 12px}
@media(max-width:900px){.shop-wrap{grid-template-columns:1fr}.shop-sidebar{order:2}.shop-main{order:1}}
.sidebar-box{background:#fff;border:1px solid var(--border);border-radius:12px;padding:12px;margin-bottom:12px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:900px){.grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.grid{grid-template-columns:1fr}}
.card{background:#fff;border:1px solid var(--border);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
.card img{display:block;width:100%;height:auto;background:#fff}
.thumb{background:#f3f4f6;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;color:#9ca3af;font-size:12px}
.card-body{padding:12px}
.price{font-weight:600;margin:6px 0}
.btn{display:inline-block;padding:8px 10px;border:1px solid var(--border);border-radius:8px;text-decoration:none;background:#fff}
.btn-primary{background:var(--brand);color:#fff;border-color:var(--brand)}
.pill{display:inline-flex;align-items:center;border:1px solid var(--border);border-radius:999px;padding:4px 8px;font-size:12px;color:#374151}
.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;gap:8px;flex-wrap:wrap}
.pagination{display:flex;gap:6px;justify-content:flex-end;margin-top:12px}
.pagination a,.pagination span{padding:6px 10px;border:1px solid var(--border);border-radius:8px;text-decoration:none;color:var(--text)}
.pagination .active{background:var(--brand);color:#fff;border-color:var(--brand)}
