/* ShopperMarket View Models Add-On (GP compatible) */

/* ===== Menu (Wirecutter style) ===== */
.smvm-menu{width:100%;max-width:1200px;margin:0 auto 18px auto;padding:0 12px;}
.smvm-menu-title{display:block;text-align:center;font-weight:800;font-size:20px;color:#111;margin:8px 0 12px 0;letter-spacing:-0.2px;}
.smvm-menu-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:16px;padding:10px 12px;box-shadow:0 10px 22px rgba(0,0,0,.06);}
.smvm-menu-links{display:flex;flex-wrap:wrap;gap:16px;align-items:center;}
.smvm-menu-link{color:#111;text-decoration:none;font-weight:650;font-size:14px;opacity:.92;}
.smvm-menu-link:hover{opacity:1;text-decoration:underline;text-decoration-thickness:2px;}
.smvm-menu-search{margin-left:auto;}
.smvm-search{width:220px;max-width:70vw;border:1px solid rgba(0,0,0,.12);border-radius:999px;padding:10px 12px;font-size:14px;outline:none;}
.smvm-search:focus{border-color:rgba(0,0,0,.25);}

.smvm-menu-sticky{position:sticky;top:0;z-index:999;}

/* Injected under GP header */
.smvm-gp-hook{margin:14px 0 10px;}

/* ===== Card enhancements (CSS-only skin) ===== */
.smvm-wrap{width:100%;}

/* Ensure grid exists even if theme CSS is missing */
.sm-grid-container{display:grid;gap:18px;align-items:stretch;}

.sm-grid-card{position:relative;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:18px;overflow:hidden;box-shadow:0 10px 24px rgba(0,0,0,.06);transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;}
.sm-grid-card:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(0,0,0,.10);border-color:rgba(0,0,0,.12);}

.sm-grid-card img{width:100%;aspect-ratio:4/3;height:auto;object-fit:contain;background:#f7f7f8;display:block;padding:10px;}

.sm-card-body-short{padding:14px 14px 16px 14px;}

.sm-card-title{font-size:18px;line-height:1.15;margin:0 0 8px 0;letter-spacing:-0.2px;}
.sm-card-title a{color:#111;text-decoration:none;}
.sm-card-title a:hover{text-decoration:underline;text-decoration-thickness:2px;}

.sm-card-excerpt, .sm-card-body-short p{color:rgba(0,0,0,.70);font-size:14px;line-height:1.35;margin:0 0 12px 0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}

/* CTA row injected */
.smvm-cta-row{display:flex;gap:10px;margin-top:10px;}
.smvm-btn{display:inline-flex;align-items:center;justify-content:center;width:100%;padding:12px 14px;border-radius:12px;font-weight:800;font-size:14px;text-decoration:none;border:0;cursor:pointer;transition:transform .12s ease, box-shadow .12s ease, opacity .12s ease;}
.smvm-btn-primary{background:#111;color:#fff !important;box-shadow:0 10px 18px rgba(0,0,0,.18);}
.smvm-btn-primary:hover{transform:translateY(-1px);box-shadow:0 14px 26px rgba(0,0,0,.22);}
.smvm-btn-secondary{background:#fff;color:#111 !important;border:1px solid rgba(0,0,0,.15);}
.smvm-btn-secondary:hover{transform:translateY(-1px);}

/* Heart button */
.smvm-like{position:absolute !important;top:12px !important;right:12px !important;z-index:9999 !important;width:38px !important;height:38px !important;border-radius:999px !important;background:rgba(255,255,255,.95) !important;border:1px solid rgba(0,0,0,.10) !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;cursor:pointer !important;box-shadow:0 10px 20px rgba(0,0,0,.10) !important;}
.smvm-like:hover{transform:scale(1.03);}
.smvm-like svg{width:18px !important;height:18px !important;fill:var(--smvm-heart-off) !important;transition:fill .2s ease, opacity .2s ease;opacity:1;}
.smvm-like.active svg{fill:var(--smvm-heart-color) !important;opacity:1;}

/* Wishlist / History */
.smvm-saved-wrap{max-width:1200px;margin:0 auto;padding:0 12px;}
.smvm-saved-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0 12px;}
.smvm-saved-title{margin:0;font-size:20px;letter-spacing:-0.2px;}
.smvm-saved-btn{border:1px solid rgba(0,0,0,.12);background:#fff;border-radius:999px;padding:10px 12px;font-weight:700;cursor:pointer;}
.smvm-saved-btn:hover{border-color:rgba(0,0,0,.22);}

/* Modal */
.smvm-modal{position:fixed;inset:0;display:block;z-index:100000;}
.smvm-modal[aria-hidden="true"]{display:none;}
.smvm-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55);}
.smvm-modal-panel{position:relative;max-width:860px;margin:6vh auto;background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.25);}
.smvm-modal-close{position:absolute;top:10px;right:12px;border:0;background:transparent;font-size:28px;line-height:1;cursor:pointer;z-index:2;}
.smvm-modal-content{padding:16px;}

.smvm-qv{display:grid;grid-template-columns:1fr;gap:14px;}
.smvm-qv-media img{width:100%;height:auto;display:block;border-radius:12px;}
.smvm-qv-title{margin:0;font-size:22px;letter-spacing:-0.3px;}
.smvm-qv-excerpt{margin:8px 0 0;color:rgba(0,0,0,.72);}
.smvm-qv-actions{display:flex;gap:10px;margin-top:12px;}

@media (min-width: 860px){
  .smvm-qv{grid-template-columns:1.1fr 0.9fr;align-items:start;}
}

@media (max-width: 1024px){
  .sm-grid-container{grid-template-columns:repeat(2,1fr) !important;}
}
@media (max-width: 640px){
  .sm-grid-container{grid-template-columns:repeat(1,1fr) !important;}
  .smvm-search{width:100%;}
}