/* ============================================================
   家边の漁港 — 修复样式
   Applied globally via batch insert on all pages
   ============================================================ */

/* P0: touch-action 缩放修复 — 覆盖所有可交互元素 */
body, button, a, img, .icon, [class*="icon"],
input, select, textarea, label, [role="button"],
.tab-item, .nav-item, .card, [onclick] {
  touch-action: manipulation;
  -ms-touch-action: manipulation;
}

/* P1: 售罄态样式 */
.sold-out-overlay {
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  border-radius: inherit;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}
.sold-out-badge {
  background: #ef4444;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  padding: 6px 18px;
  border-radius: 20px;
  letter-spacing: 2px;
  box-shadow: 0 2px 12px rgba(239,68,68,0.4);
  transform: rotate(-8deg);
}
.sold-out-label {
  color: #ef4444;
  font-size: 12px;
  font-weight: 600;
  border: 1px solid #ef4444;
  padding: 1px 8px;
  border-radius: 4px;
  display: inline-block;
  line-height: 1.4;
}
.sold-out-btn {
  opacity: 0.5;
  pointer-events: none;
  filter: grayscale(0.8);
  cursor: not-allowed !important;
}

/* check icon + text sold-out style */
.item-sold-out {
  opacity: 0.5;
  text-decoration: line-through;
}

/* ===== Tailwind v4 未生成的透明度变体（手动补） ===== */
.bg-gold-400\/40 { background-color: rgba(251,191,36,0.4); }
.bg-gold-500\/10 { background-color: rgba(245,158,11,0.1); }
.bg-gold-500\/15 { background-color: rgba(245,158,11,0.15); }
.bg-gold-500\/20 { background-color: rgba(245,158,11,0.2); }
.bg-gold-500\/8  { background-color: rgba(245,158,11,0.08); }
.border-gold-400\/20 { border-color: rgba(251,191,36,0.2); }
.border-gold-400\/30 { border-color: rgba(251,191,36,0.3); }
.border-gold-400\/40 { border-color: rgba(251,191,36,0.4); }
.border-gold-500\/15 { border-color: rgba(245,158,11,0.15); }
.border-gold-500\/20 { border-color: rgba(245,158,11,0.2); }
.border-gold-500\/25 { border-color: rgba(245,158,11,0.25); }
.border-gold-500\/30 { border-color: rgba(245,158,11,0.3); }
.border-white\/6  { border-color: rgba(255,255,255,0.06); }
.border-white\/8  { border-color: rgba(255,255,255,0.08); }
.bg-oc-800\/60 { background-color: rgba(13,26,48,0.6); }
.bg-oc-950\/95 { background-color: rgba(6,14,30,0.95); }
.text-white\/88 { color: rgba(255,255,255,0.88); }
.bg-white\/88 { background-color: rgba(255,255,255,0.88); }

/* ===== UI Designer: 自定义商品卡片尺寸 ===== */
.pcd { width: 210px !important; }
.pcd .pi { aspect-ratio: 4/3 !important; }
.pcd-name { font-size: 13px !important; }
.pcd-price { font-size: 18px !important; }
/* 限时抢购卡片保持原始宽度 */
#flash-products .pcd { width: 150px !important; }
/* 本周畅销/小雪推荐 - grid布局自适应 */
#bestseller-list .pcd, #xiaoxue-rec .pcd { width: auto !important; }
#bestseller-list .pi, #xiaoxue-rec .pi { aspect-ratio: 4/3 !important; }
#bestseller-list .pcd-name { font-size: 13px !important; }
#bestseller-list .pcd-price { font-size: 16px !important; }
#xiaoxue-rec .pcd-name { font-size: 13px !important; }
#xiaoxue-rec .pcd-price { font-size: 16px !important; }
#gift-products .pcd { width: 150px !important; }
#gift-products .pi { aspect-ratio: 4/3 !important; }
#gift-products .pcd-name { font-size: 13px !important; }
#gift-products .pcd-price { font-size: 18px !important; }

/* ===== UI Designer 2026-05-18: 小雪对话框聊天文字放大 ===== */
#chatMsgs .text-sm {
  font-size: 15px !important;
  line-height: 1.6 !important;
}