/* コンテナ（中央寄せ） */
#shop-cards-embed{display:flex;flex-wrap:wrap;gap:16px;justify-content:center}
#shop-cards-embed a{text-decoration:none;color:inherit}

/* 共通カード */
#shop-cards-embed .xpcard{
  position:relative;display:inline-block;overflow:hidden;border-radius:10px;
  background:#000;border:2px solid var(--brand, #999);width:240px;aspect-ratio:1/1;vertical-align:top
}
#shop-cards-embed .xpcard img{width:100%;height:100%;object-fit:cover;display:block}

/* 下部キャプション */
#shop-cards-embed .xpcard .xp-caption{
  position:absolute;inset:auto 0 0 0;padding:10px 12px 12px;color:#fff;
  background:linear-gradient(to top, rgba(0,0,0,.78), rgba(0,0,0,0));z-index:2
}
#shop-cards-embed .xpcard .xp-row{display:flex;align-items:center;gap:8px}
#shop-cards-embed .xpcard .xp-title{
  font-size:.95rem;font-weight:600;line-height:1.3;display:-webkit-box;
  -webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden
}
#shop-cards-embed .xpcard .xp-price{
  margin-left:auto;font-weight:700;white-space:nowrap;color:#ffe27a;
  text-shadow:0 1px 2px rgba(0,0,0,.35)
}

/* 左上のブランドバッジ */
#shop-cards-embed .xpcard .xp-badge{
  position:absolute;top:10px;left:10px;padding:4px 8px;border-radius:6px;
  font-size:.75rem;font-weight:700;letter-spacing:.03em;color:#fff;background:var(--brand,#666);z-index:3
}

/* なめらかな小さめトランジション */
#shop-cards-embed .xpcard{
  transition: transform .12s ease, box-shadow .18s ease, border-color .18s ease;
}
#shop-cards-embed .xpcard:hover{
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(0,0,0,.08);
  border-color: color-mix(in oklab, var(--brand, #999) 80%, white);
}


/* ブランド別トークン */
#shop-cards-embed .brand--booth{--brand:#ff6b6b}
#shop-cards-embed .brand--pictspace{--brand:#ff8c1a}
#shop-cards-embed .brand--unifans{--brand:#7c4dff}


/* URLなし（グレー・非販売） */
#shop-cards-embed .xpcard.is-disabled{
  filter:grayscale(100%);opacity:.75;border-color:#bbb;cursor:not-allowed;pointer-events:none
}
/* 小画面対応 */
@media (max-width:480px){
  #shop-cards-embed .xpcard{width:45vw}
  #shop-cards-embed{gap:12px}
}
/* スマホ：2列グリッドで自動サイズ（幅ぴったり） */
@media (max-width: 600px) {
  #shop-cards-embed{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr)); /* 2列 */
    gap: 12px;                                       /* 列間 */
    justify-content: center;
  }
  #shop-cards-embed .xpcard{
    width: 100%;       /* 列幅にフィット */
    aspect-ratio: 1/1; /* 正方形を維持 */
  }
}

/* 既存のCSSはそのまま */

/* ===== Editor UX: ブロック選択を最優先に ===== */
.block-editor-block-list__block[data-type="xw/product-cards"] .xw-pc-preview,
.editor-styles-wrapper .wp-block-xw-product-cards .xw-pc-preview {
  pointer-events: none !important;
}

/* ホバーで薄いアウトライン（つかみやすく） */
.block-editor-block-list__block[data-type="xw/product-cards"]:hover {
  outline: 1px dashed var(--wp-admin-theme-color, #007cba);
  outline-offset: 2px;
}
