/* =========================================================
   Color Variations Buttons (All breakpoints)
   ========================================================= */

/* ---- モバイル基準（〜1024px） ---- */
.sp-color-block{
  display:flex; flex-direction:column; align-items:flex-start;
  padding:0; gap:16px; width:359px; max-width:100%;
  order:1; align-self:stretch; flex-grow:0;
}
.sp-color-block .sp-color-title{
  width:359px; max-width:100%; height:28px;
  font-family:'M PLUS 1p',sans-serif; font-style:normal;
  font-weight:400; font-size:20px; line-height:140%;
  text-align:justify; color:#2F2B29;
}
.sp-color-buttons{
  display:flex; flex-direction:column; align-items:flex-start;
  padding:0; gap:8px; width:359px; max-width:100%;
}
.sp-color-row{
  display:flex; flex-direction:row; justify-content:center; align-items:center;
  gap:8px; width:359px; max-width:100%; height:40px;
}

.sp-color-btn{
  box-sizing:border-box; display:flex; flex-direction:row; justify-content:center; align-items:center;
  width:calc((359px - 8px)/2); /* 175.5px */
  height:40px; border:1px solid #2F2B29; border-radius:4px; background:#FFF;
  cursor:pointer; user-select:none; outline:none; text-decoration:none; padding:0 24px;
}
.sp-color-btn:focus-visible{ outline:2px solid #2F2B29; outline-offset:2px; }
.sp-color-btn[aria-pressed="true"], .sp-color-btn.is-selected{
  background:#978055; color:#FFF; border-color:#978055;
}
.sp-color-btn .sp-color-label{
  display:inline-block; width:100%; max-width:120px; height:12px;
  font-family:'M PLUS 1p',sans-serif; font-weight:500; font-size:12px; line-height:100%;
  text-align:center; color:#2F2B29; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.sp-color-btn[aria-pressed="true"] .sp-color-label{ color:#FFF; }

/* セレクトを画面外へ退避（SP/PC共通） */
form.variations_form select[name^="attribute_"][data-sp-color-enhanced="1"]{
  position:absolute!important; left:-999em!important;
}

/* ---- PC（1025px〜） ---- */
@media (min-width:1025px){
  .sp-color-block{ gap:16px; width:560px; }
  .sp-color-block .sp-color-title{
    width:560px; height:31px; font-weight:500; font-size:22px; line-height:140%;
  }
  .sp-color-buttons{ gap:20px; width:560px; }
  .sp-color-row{ gap:20px; width:560px; height:52px; }
  .sp-color-btn{ width:270px; height:52px; padding:0; border-radius:4px; }
  .sp-color-btn .sp-color-label{ max-width:160px; height:16px; font-weight:500; font-size:16px; }
}

/* ---- Woo標準の下部出力 非表示（クリア/価格/在庫/商品コード） ---- */
.single-product form.variations_form .reset_variations{ display:none!important; }
.single-product .summary .single_variation .price,
.single-product .summary .single_variation .woocommerce-variation-price,
.single-product .summary .single_variation .woocommerce-variation-availability,
.single-product .summary .product_meta .sku_wrapper{ display:none!important; }

/* 安全網（クリック阻害を避ける） */
.single_add_to_cart_button{ position:relative; z-index:5; }
.sp-color-block, .sp-color-buttons, .sp-color-row{ position:relative; z-index:1; }

/* 1) 上から8px空ける（提示マークアップに合わせてULを直接指定） */
.single-product div.product ul.variable-items-wrapper.color-variable-items-wrapper,
.single-product div.product .variations ul.variable-items-wrapper.color-variable-items-wrapper,
.single-product div.product .summary ul.variable-items-wrapper.color-variable-items-wrapper{
  margin-top:8px !important;
}

/* 2) 画像の下＆さらにその下の薄いグレーボーダーを消す
      ─ Astra等は border/border-bottom/疑似要素/背景グラデ で線を作ることがあるため広めに無効化 ─ */

/* ギャラリー配下の全要素に対して境界線/影/背景線を除去 */
.single-product div.product .woocommerce-product-gallery,
.single-product div.product .woocommerce-product-gallery *{
  border:0 !important;
  box-shadow:none !important;
  background-image:none !important;
}

/* ギャラリー自体＆ラッパーの疑似要素も無効化 */
.single-product div.product .woocommerce-product-gallery::before,
.single-product div.product .woocommerce-product-gallery::after,
.single-product div.product .woocommerce-product-gallery .woocommerce-product-gallery__wrapper::before,
.single-product div.product .woocommerce-product-gallery .woocommerce-product-gallery__wrapper::after{
  content:none !important;
  border:0 !important;
  box-shadow:none !important;
  background:none !important;
}

/* ギャラリー直下の兄弟要素の境界線（多くはここが“1本目”） */
.single-product div.product .woocommerce-product-gallery + *{
  border-top:0 !important;
  border-bottom:0 !important;
  box-shadow:none !important;
  background-image:none !important;
}

/* サマリー（概要）領域のボーダー/疑似線（多くはここが“2本目”） */
.single-product div.product .summary,
.single-product div.product .entry-summary{
  border:0 !important;
  box-shadow:none !important;
  background-image:none !important;
}
.single-product div.product .summary::before,
.single-product div.product .summary::after,
.single-product div.product .entry-summary::before,
.single-product div.product .entry-summary::after{
  content:none !important;
  border:0 !important;
  box-shadow:none !important;
  background:none !important;
}

/* サマリー直下のセパレーター/区切り線 */
.single-product div.product .summary hr,
.single-product div.product .summary .ast-separator,
.single-product div.product .summary .ast-separator::before,
.single-product div.product .summary .ast-separator::after{
  display:none !important;
  border:0 !important;
  box-shadow:none !important;
  background:none !important;
}

/* 価格・メタ周りに付く border-bottom/背景線の保険 */
.single-product div.product .summary .price,
.single-product div.product .summary .product_meta,
.single-product div.product .summary .woocommerce-variation-price,
.single-product div.product .summary .woocommerce-variation-availability,
.single-product div.product .summary .sku_wrapper{
  border:0 !important;
  box-shadow:none !important;
  background-image:none !important;
}

/* テーマが.section, .ast-clearfix 等に線を付ける場合の保険 */
.single-product div.product .summary > *,
.single-product div.product .entry-summary > *{
  border-top:0 !important;
  border-bottom:0 !important;
  background-image:none !important;
  box-shadow:none !important;
}

/* =========================================================
   追加修正：クリアリンクとテーブル境界線の完全非表示
   ========================================================= */

/* クリアリンクを完全に非表示（インラインスタイル上書き） */
.single-product form.variations_form .reset_variations{
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  position: absolute !important;
  left: -9999px !important;
}

/* Variation Swatches プラグインの出力を非表示 */
.single-product div.product ul.variable-items-wrapper.color-variable-items-wrapper,
.single-product div.product ul.wvs-style-squared,
.single-product div.product .variable-items-wrapper[data-attribute_name="attribute_pa_color"]{
  display: none !important;
}

/* テーブル要素の境界線を削除 */
.single-product div.product .variations,
.single-product div.product .variations tr,
.single-product div.product .variations td,
.single-product div.product .variations th,
.single-product div.product .variations td.label,
.single-product div.product .variations td.value{
  border: 0 !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  box-shadow: none !important;
  background-image: none !important;
}

/* テーブル要素の疑似要素も削除 */
.single-product div.product .variations::before,
.single-product div.product .variations::after,
.single-product div.product .variations tr::before,
.single-product div.product .variations tr::after,
.single-product div.product .variations td::before,
.single-product div.product .variations td::after{
  content: none !important;
  border: 0 !important;
  background: none !important;
}

/* カラー属性のラベル（th.label）を非表示 */
.single-product div.product .variations tr th.label,
.single-product div.product .variations tr th.label label{
  display: none !important;
}