/* 宠梦工坊 · 周边商城占位页增量样式 (CC-SHOP 20260919B)
   复用 pd.css 暗色变量 · 零内联（CSP 最严） · JS 仅外链 shop.js */
.sh-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.sh-item {
  background: var(--card2);
  border: 1px solid var(--line);
  border-radius: 14px; padding: 18px 16px;
  display: flex; flex-direction: column; gap: 8px;
}
.sh-item-hot { border-color: var(--acc); }
.sh-item h3 { font-size: 16px; color: var(--txt); margin: 0; }
.sh-desc { font-size: 13px; color: var(--sub); line-height: 1.7; flex: 1; }
.sh-price { font-size: 22px; font-weight: 800; color: var(--acc); margin: 4px 0 0; }
.sh-price small { font-size: 13px; font-weight: 400; color: var(--sub); }

/* 预约表单（XT-PDSHOP 20260919B） */
.sh-reserve { display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0 6px; }
.sh-input {
  flex: 1 1 200px; min-width: 0;
  background: var(--card2); color: var(--txt);
  border: 1px solid var(--line); border-radius: 10px;
  padding: 11px 14px; font-size: 14px; outline: none;
}
.sh-input:focus { border-color: var(--acc); }
.sh-input::placeholder { color: var(--sub); }
.sh-msg { min-height: 20px; font-size: 13px; color: var(--sub); margin: 4px 0 10px; }
.sh-msg-ok { color: var(--acc); }
.sh-msg-err { color: #d97b7b; }

@media (max-width: 640px) {
  .sh-grid { grid-template-columns: 1fr; }
  .sh-reserve { flex-direction: column; }
  .sh-input { flex-basis: auto; }
}

/* XT-PDSHOP 20260921B：首发预订订金二维码 */
.sh-qr { margin-top: 14px; }
.sh-qr img, .sh-qr canvas {
  width: 220px; height: 220px;
  background: #ffffff;
  padding: 8px;
  border-radius: 12px;
}