/* ============================================================
   Vogueer 商品ページ ダークトンマナ — vg-product.css
   LP（Vogueer LP テーマ）とデザイン言語を統一する上書きCSS。
   :is(body[data-page-type="product"],body[data-page-type="cart"]) スコープのため他ページに影響しない。
   layout/theme.html から全ページ読み込み（実効は商品ページのみ）。
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700;900&family=Shippori+Mincho+B1:wght@600;700;800&family=Oswald:wght@500;600;700&display=swap');

/* ---- カラースキーム変数を丸ごとダークに上書き（RGB三つ組形式）----
   テーマは rgb(var(--color-*)) で塗るため、変数を差し替えるのが最も確実 */
:is(body[data-page-type="product"],body[data-page-type="cart"]),
:is(body[data-page-type="product"],body[data-page-type="cart"]) [class*="color-scheme"]{
  --color-page-background: 10,10,13;
  --color-background: 10,10,13;
  --color-card-background: 20,21,27;
  --color-image-background: 17,18,23;
  --color-image-loading-background: 17,18,23;
  --color-media-background: 17,18,23;
  --color-text: 223,224,232;
  --color-light-text: 151,153,164;
  --color-entry-line: 62,64,78;
  --color-button-background: 90,134,255;
  --color-button-text: 6,18,31;
  --color-button-secondary-background: 24,25,32;
  --color-button-secondary-border: 120,124,140;
  --color-button-secondary-text: 238,240,255;
  --color-tag-background: 30,32,40;
  --color-tag-text: 199,200,210;
  --color-shadow: 0,0,0;
}
/* スキーム背景を塗る代表ラッパーの直接上書き（保険） */
:is(body[data-page-type="product"],body[data-page-type="cart"]) .product-detail-wrapper,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .product-detail,
:is(body[data-page-type="product"],body[data-page-type="cart"]) theme-product-detail,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .section-recommended-product-wrapper{
  background:#0a0a0d !important;
}
:is(body[data-page-type="product"],body[data-page-type="cart"]) .footer{
  background:#060608 !important;
}
:is(body[data-page-type="product"],body[data-page-type="cart"]) .media-gallery__placeholder{
  background:#14151b !important;
}

/* ---- ページ全体 ---- */
:is(body[data-page-type="product"],body[data-page-type="cart"]){
  background:#0a0a0d !important;
  color:#c7c8d2 !important;
  font-family:'Noto Sans JP',system-ui,sans-serif;
}
:is(body[data-page-type="product"],body[data-page-type="cart"]) main,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .section{
  background:transparent !important;
  color:#c7c8d2;
}

/* ---- ヘッダー / アナウンスバー / フッターもダークに ---- */
:is(body[data-page-type="product"],body[data-page-type="cart"]) [id^="shopline-section-sections--header-group"],
:is(body[data-page-type="product"],body[data-page-type="cart"]) [id^="shopline-section-sections--header-group"] header,
:is(body[data-page-type="product"],body[data-page-type="cart"]) [id^="shopline-section-sections--header-group"] > div,
:is(body[data-page-type="product"],body[data-page-type="cart"]) [id^="shopline-section-sections--footer-group"],
:is(body[data-page-type="product"],body[data-page-type="cart"]) [id^="shopline-section-sections--footer-group"] footer{
  background:#060608 !important;
  color:#f4f4f6 !important;
}
:is(body[data-page-type="product"],body[data-page-type="cart"]) [id^="shopline-section-sections--header-group"] a,
:is(body[data-page-type="product"],body[data-page-type="cart"]) [id^="shopline-section-sections--header-group"] span,
:is(body[data-page-type="product"],body[data-page-type="cart"]) [id^="shopline-section-sections--header-group"] svg,
:is(body[data-page-type="product"],body[data-page-type="cart"]) [id^="shopline-section-sections--footer-group"] a,
:is(body[data-page-type="product"],body[data-page-type="cart"]) [id^="shopline-section-sections--footer-group"] p,
:is(body[data-page-type="product"],body[data-page-type="cart"]) [id^="shopline-section-sections--footer-group"] span{
  color:#dfe0e8 !important;
  fill:#dfe0e8 !important;
}

/* ---- 見出し（商品名）: LPと同じ明朝体 ---- */
:is(body[data-page-type="product"],body[data-page-type="cart"]) h1,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .product-detail__form h1,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .title1,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .title2{
  font-family:'Shippori Mincho B1',serif !important;
  font-weight:800 !important;
  color:#f4f4f6 !important;
  letter-spacing:.02em;
}
:is(body[data-page-type="product"],body[data-page-type="cart"]) h2,
:is(body[data-page-type="product"],body[data-page-type="cart"]) h3{
  color:#f4f4f6 !important;
}

/* ---- 価格: LPの数字書体 ---- */
:is(body[data-page-type="product"],body[data-page-type="cart"]) .product-detail__price,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .product-detail__price *{
  font-family:'Oswald',sans-serif !important;
  color:#8fe8ff !important;
  font-weight:700;
}

/* ---- 本文・説明 ---- */
:is(body[data-page-type="product"],body[data-page-type="cart"]) .rte,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .rte *,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .product-detail__description,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .body3,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .body4,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .body6{
  color:#c7c8d2 !important;
}
:is(body[data-page-type="product"],body[data-page-type="cart"]) .variant-picker__group-label,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .title-font-bold{
  color:#f4f4f6 !important;
}

/* ---- バリアント選択ピル ---- */
:is(body[data-page-type="product"],body[data-page-type="cart"]) .variant-picker__button{
  background:rgba(255,255,255,.04) !important;
  border:1px solid rgba(255,255,255,.22) !important;
  color:#eef0ff !important;
  border-radius:10px !important;
  transition:border-color .2s,color .2s;
}
:is(body[data-page-type="product"],body[data-page-type="cart"]) .variant-picker__button:hover{
  border-color:#8fe8ff !important;
  color:#fff !important;
}
:is(body[data-page-type="product"],body[data-page-type="cart"]) .variant-picker__button[aria-checked="true"],
:is(body[data-page-type="product"],body[data-page-type="cart"]) .variant-picker__button--selected,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .variant-picker__button.selected,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .variant-picker__button.active{
  border-color:#8fe8ff !important;
  color:#06121f !important;
  background:linear-gradient(120deg,#8fe8ff,#5a86ff) !important;
  font-weight:700;
}

/* ---- 数量セレクタ / セレクトボックス / 入力欄 ---- */
:is(body[data-page-type="product"],body[data-page-type="cart"]) .product-detail__quantity-selector,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .quantity-selector,
:is(body[data-page-type="product"],body[data-page-type="cart"]) select,
:is(body[data-page-type="product"],body[data-page-type="cart"]) input[type="number"],
:is(body[data-page-type="product"],body[data-page-type="cart"]) input[type="text"]{
  background:rgba(255,255,255,.04) !important;
  border-color:rgba(255,255,255,.22) !important;
  color:#eef0ff !important;
}
:is(body[data-page-type="product"],body[data-page-type="cart"]) .theme-select__arrow{filter:invert(1)}

/* ---- 購入ボタン: LPのグラデーションCTA ---- */
:is(body[data-page-type="product"],body[data-page-type="cart"]) .button--fill,
:is(body[data-page-type="product"],body[data-page-type="cart"]) button[name="add"],
:is(body[data-page-type="product"],body[data-page-type="cart"]) .product-detail__buy-buttons .button:not(.button--link){
  background:linear-gradient(120deg,#8fe8ff,#5a86ff) !important;
  color:#06121f !important;
  border:0 !important;
  border-radius:12px !important;
  font-weight:900 !important;
  box-shadow:0 14px 40px rgba(90,134,255,.35);
  transition:filter .25s,transform .25s;
}
:is(body[data-page-type="product"],body[data-page-type="cart"]) .button--fill:hover,
:is(body[data-page-type="product"],body[data-page-type="cart"]) button[name="add"]:hover{
  filter:brightness(1.06);
  transform:translateY(-2px);
}
:is(body[data-page-type="product"],body[data-page-type="cart"]) .button--secondary{
  background:rgba(255,255,255,.05) !important;
  color:#eef0ff !important;
  border:1px solid rgba(255,255,255,.24) !important;
  border-radius:12px !important;
}
:is(body[data-page-type="product"],body[data-page-type="cart"]) .button--secondary:hover{
  border-color:#8fe8ff !important;
  color:#fff !important;
}

/* ---- 商品画像まわり ---- */
:is(body[data-page-type="product"],body[data-page-type="cart"]) .product-detail__media,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .product-media,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .swiper{
  border-radius:16px;
  overflow:hidden;
}

/* ---- 区切り線・枠線をダーク基調に ---- */
:is(body[data-page-type="product"],body[data-page-type="cart"]) hr,
:is(body[data-page-type="product"],body[data-page-type="cart"]) .divider,
:is(body[data-page-type="product"],body[data-page-type="cart"]) [class*="dividing"]{
  border-color:rgba(255,255,255,.1) !important;
  background:rgba(255,255,255,.1) !important;
}

/* ---- おすすめ商品セクション ---- */
:is(body[data-page-type="product"],body[data-page-type="cart"]) [id*="recommended-product"]{
  background:#08080a !important;
}
:is(body[data-page-type="product"],body[data-page-type="cart"]) [id*="recommended-product"] .title2,
:is(body[data-page-type="product"],body[data-page-type="cart"]) [id*="recommended-product"] h2{
  font-family:'Shippori Mincho B1',serif !important;
  color:#f4f4f6 !important;
}

/* ============================================================
   カートページ: 商品詳細ページへのリンクを無効化
   （単品LP運用のため商品詳細ページには誘導しない）
   ============================================================ */
body[data-page-type="cart"] a[href*="/products/"]{
  pointer-events:none !important;
  cursor:default !important;
  text-decoration:none !important;
}

/* カートページ: 商品名リンクを白に（既定はくすんだリンク色になるため） */
body[data-page-type="cart"] a[href*="/products/"],
body[data-page-type="cart"] a[href*="/products/"] *{
  color:#f4f4f6 !important;
}

/* ボタン外周の矩形ライン（テーマ .button::after の角丸なし1px box-shadow）を削除 */
:is(body[data-page-type="product"],body[data-page-type="cart"]) .button::after{
  content:none !important;
  box-shadow:none !important;
}