/*
 * 商品ページ 仕上げ（2026-09-24）: NEXT v3 テンプレの上に重ねるだけ。構造・文言・JS は触らない。
 * 読み込みは mu-plugins/systre-product-polish.php（?polish=1 か option systre_product_polish=on のとき）。
 * 外す: option を off に戻す（このファイルが無くても元の見た目のまま）。
 */
.stl-product[data-stl-variant="next"] {
	--pp-ink: #1e1810;
	--pp-sub: #6b6560;
	--pp-line: #ebe7e3;
	--pp-orange: #ff6a2b;
	--pp-orange-2: #ff5722;
	--pp-card-shadow: 0 1px 2px rgba(30, 24, 16, .04), 0 8px 28px rgba(30, 24, 16, .07);
	--pp-radius: 16px;
}

/* ---------- 1. ファーストビュー: 購入カード ---------- */
/* 内側の黒い影（inset）→ 浮いたカード */
.stl-product[data-stl-variant="next"] .elementor-element-985f6cc > .elementor-element-populated {
	box-shadow: var(--pp-card-shadow) !important;
	border: 1px solid var(--pp-line);
	border-radius: 20px;
}
/* 商品名: 黒帯は残し、影と下線を軽く */
.stl-product[data-stl-variant="next"] .elementor-element-cdc0d78 > .elementor-widget-container {
	border-radius: 12px !important;
	box-shadow: none !important;
	border-bottom-width: 3px !important;
}
.stl-product[data-stl-variant="next"] .elementor-element-cdc0d78 .elementor-heading-title {
	letter-spacing: 1px !important;
	line-height: 1.3;
}
/* 商品名直下の太い区切り線は説明文との間で二重になるので消す */
.stl-product[data-stl-variant="next"] .elementor-element-e54ca1c {
	display: none;
}
.stl-product[data-stl-variant="next"] .elementor-element-f717978 p {
	color: #3a3430;
	line-height: 1.85;
	margin-top: 18px;
}

/* 価格ボタン: グレーの立体ボタン → 選べるカード（同じ幅で 2 列） */
/* 2 列固定。「?」は自分の行へ（auto 列に置くと 3 本目以降のボタンがその列に入り幅が崩れた・4 種の商品で実測） */
.stl-product[data-stl-variant="next"] .elementor-element-9721203 {
	container-type: inline-size;
}
.stl-product[data-stl-variant="next"] .mt4-version-switch {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px !important;
	margin-bottom: 16px !important;
	align-items: stretch !important;
}
/* 購入カードが細いとき（タブレット幅で約 220px）はボタン名が折れるので 1 列に */
@container (max-width: 300px) {
	.stl-product[data-stl-variant="next"] .mt4-version-switch {
		grid-template-columns: minmax(0, 1fr);
	}
}
.stl-product[data-stl-variant="next"] .mt4-cart-button {
	background: #fff !important;
	border: 1.5px solid var(--pp-line) !important;
	border-radius: 14px !important;
	padding: 14px 16px !important;
	letter-spacing: .02em !important;
	text-align: left;
	box-shadow: 0 1px 2px rgba(30, 24, 16, .05) !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-start !important;
	justify-content: center !important;
	gap: 2px;
	min-height: 64px;
	transform: none !important;
}
.stl-product[data-stl-variant="next"] .mt4-cart-button::after {
	display: none;
}
.stl-product[data-stl-variant="next"] .mt4-cart-button:hover,
.stl-product[data-stl-variant="next"] .mt4-cart-button:focus-visible {
	border-color: var(--pp-orange) !important;
	box-shadow: 0 0 0 3px rgba(255, 106, 43, .14) !important;
	outline: none;
}
.stl-product[data-stl-variant="next"] .mt4-cart-label {
	font-size: 13px !important;
	font-weight: 600 !important;
	color: var(--pp-sub) !important;
	letter-spacing: .04em;
}
.stl-product[data-stl-variant="next"] .mt4-cart-price {
	font-size: 20px !important;
	font-weight: 800 !important;
	color: var(--pp-ink) !important;
	margin-top: 0 !important;
	letter-spacing: 0;
	font-variant-numeric: tabular-nums;
}
.stl-product[data-stl-variant="next"] .mt4-version-help {
	grid-column: 1 / -1;
	justify-self: start;
	align-self: center !important;
}
.stl-product[data-stl-variant="next"] .mt4-cart-label,
.stl-product[data-stl-variant="next"] .mt4-cart-price {
	max-width: 100%;
	overflow-wrap: anywhere;
}

/* 仕様表: 行の高さが 44px 固定で、長い値（特記事項など）が上の行に重なっていた（元からの不具合） */
.stl-product[data-stl-variant="next"] .ea-info-v2 .info-row {
	height: auto !important;
	min-height: 44px;
	align-items: stretch !important;
}
.stl-product[data-stl-variant="next"] .ea-info-v2 .info-label,
.stl-product[data-stl-variant="next"] .ea-info-v2 .info-value {
	display: flex;
	align-items: center;
	height: auto !important;
	margin: 0 !important;
}
/* カートへ進む: 青の単発ボタン → ブランド色の全幅ボタン（style 属性を上書き） */
.stl-product[data-stl-variant="next"] .mt4-go-to-cart {
	margin-top: 0 !important;
}
.stl-product[data-stl-variant="next"] .go-to-cart-btn {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 100%;
	box-sizing: border-box;
	min-height: 52px;
	padding: 14px 24px !important;
	background: linear-gradient(135deg, var(--pp-orange), var(--pp-orange-2)) !important;
	border-radius: 14px !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	letter-spacing: .04em;
	box-shadow: 0 6px 18px rgba(255, 87, 34, .28) !important;
	transition: filter .2s ease, box-shadow .2s ease;
}
.stl-product[data-stl-variant="next"] .go-to-cart-btn:hover {
	filter: brightness(1.05);
	box-shadow: 0 8px 22px rgba(255, 87, 34, .34) !important;
	transform: none !important;
}
body.single-product #cart-toast {
	background: #1e1810 !important;
	border-radius: 12px !important;
}

/* 出品者: 楕円に潰れたアイコンを円に */
.stl-product[data-stl-variant="next"] .wcfmmp_sold_by_container_advanced img {
	width: 56px !important;
	height: 56px !important;
	min-width: 56px;
	max-width: none !important;
	flex: 0 0 56px;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 50% !important;
}

/* ---------- 2. フォワードテスト枠: 二重の inset 影 → 1 枚のカード ---------- */
.stl-product[data-stl-variant="next"] .elementor-element-20c68fa,
.stl-product[data-stl-variant="next"] .elementor-element-ae564a3 > .elementor-element-populated {
	box-shadow: none !important;
}
.stl-product[data-stl-variant="next"] .elementor-element-20c68fa {
	background: transparent !important;
}
.stl-product[data-stl-variant="next"] .elementor-element-ae564a3 > .elementor-element-populated {
	border: 1px solid var(--pp-line);
	border-radius: var(--pp-radius);
	box-shadow: var(--pp-card-shadow) !important;
}
.stl-product[data-stl-variant="next"] .elementor-element-a66e845 .elementor-heading-title {
	font-size: 24px !important;
	font-weight: 700 !important;
	letter-spacing: .04em;
	color: var(--pp-ink) !important;
}

/* 見出しの大きさを揃える（29.75px / 24px / 13px が混在していた） */
.stl-product[data-stl-variant="next"] .cg2-chart-col > h3,
.stl-product[data-stl-variant="next"] .radar-chart-section h3,
.stl-product[data-stl-variant="next"] .calendar-title,
.stl-product[data-stl-variant="next"] .ea2-history-title,
.stl-product[data-stl-variant="next"] .ea2-openpos-title {
	font-size: 17px !important;
	font-weight: 700 !important;
	letter-spacing: .02em !important;
	color: var(--pp-ink) !important;
	line-height: 1.4 !important;
}

/* オープンポジション表: 右寄せの数値列に見出しを合わせる（見出しだけ左で列がずれて見えた） */
.stl-product[data-stl-variant="next"] .ea2-openpos-table th.ea2-op-num {
	text-align: right;
}

/* 数字は等幅で桁を揃える */
.stl-product[data-stl-variant="next"] .ea2-openpos-table td,
.stl-product[data-stl-variant="next"] .ea2-history-table td {
	font-variant-numeric: tabular-nums;
}

/* ---------- 3. 下半分 ---------- */
/* 区切りのグレーのグラデ帯（高さ 70px）→ 余白だけ */
.stl-product[data-stl-variant="next"] .elementor-element-367703b {
	background: none !important;
	min-height: 0;
	max-height: 24px;
	overflow: hidden;
}
/* フォワード枠とタブ枠の間が 80px 以上空いていた */
.stl-product[data-stl-variant="next"] .woocommerce-tabs {
	margin-top: 8px !important;
	padding-top: 16px !important;
}
/* タブ: 左に寄った箱 → 中央のセグメント */
.stl-product[data-stl-variant="next"] .woocommerce-tabs ul.tabs {
	display: flex !important;
	justify-content: center;
	flex-wrap: wrap;
	gap: 6px;
	padding: 6px !important;
	margin: 0 auto 8px !important;
	width: fit-content;
	max-width: 100%;
	background: #f4f2f0 !important;
	border: 0 !important;
	border-radius: 999px;
}
.stl-product[data-stl-variant="next"] .woocommerce-tabs ul.tabs::before,
.stl-product[data-stl-variant="next"] .woocommerce-tabs ul.tabs li::before,
.stl-product[data-stl-variant="next"] .woocommerce-tabs ul.tabs li::after {
	display: none !important;
}
.stl-product[data-stl-variant="next"] .woocommerce-tabs ul.tabs li {
	width: auto !important;
	max-width: none !important;
	flex: 0 0 auto;
	white-space: nowrap;
	margin: 0 !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: transparent !important;
	box-shadow: none !important;
}
.stl-product[data-stl-variant="next"] .woocommerce-tabs ul.tabs li a {
	display: block;
	padding: 10px 22px !important;
	border-radius: 999px;
	font-size: 15px !important;
	font-weight: 600 !important;
	color: var(--pp-sub) !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
}
.stl-product[data-stl-variant="next"] .woocommerce-tabs ul.tabs li.active a {
	background: #fff !important;
	color: var(--pp-ink) !important;
	box-shadow: 0 1px 3px rgba(30, 24, 16, .12) !important;
}

/* よくある質問: 見出しだけ細字だったので他の見出しとそろえる */
.stl-product[data-stl-variant="next"] .systre-product-faq h2 {
	font-weight: 700 !important;
	color: var(--pp-ink) !important;
}

/* お問い合わせ案内: グレーの箱と縦棒 1 本 → 左に色の帯を持つ白いカード */
.stl-product[data-stl-variant="next"] .contact-section {
	background: none !important;
	border: 0 !important;
	box-shadow: none !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}
.stl-product[data-stl-variant="next"] .contact-section .contact-content {
	background: #fff !important;
	border: 1px solid var(--pp-line) !important;
	border-left: 4px solid var(--pp-orange) !important;
	border-radius: 12px !important;
	box-shadow: none !important;
}
.stl-product[data-stl-variant="next"] .contact-section .contact-content::before,
.stl-product[data-stl-variant="next"] .contact-section .accent-line {
	display: none !important;
}
.stl-product[data-stl-variant="next"] .contact-section .contact-text {
	font-weight: 700;
	color: var(--pp-ink);
}

/* 斜線の区切り → 細い 1 本線 */
.stl-product[data-stl-variant="next"] .elementor-element-905a1f9 .elementor-divider-separator {
	background: none !important;
	border-top: 1px solid var(--pp-line) !important;
	height: 0 !important;
	-webkit-mask: none !important;
	mask: none !important;
}

/* 人気の商品: 星をブランド色に */
.stl-product[data-stl-variant="next"] .widget_top_rated_products .star-rating span::before {
	color: #f5a524 !important;
}

/* ---------- 4. スマホ ---------- */
@media (max-width: 767px) {
	.stl-product[data-stl-variant="next"] .elementor-element-985f6cc > .elementor-element-populated {
		border-radius: 16px;
	}
	.stl-product[data-stl-variant="next"] .mt4-cart-button {
		display: flex !important;
		padding: 12px 14px !important;
	}
	.stl-product[data-stl-variant="next"] .mt4-cart-price {
		font-size: 18px !important;
	}
	.stl-product[data-stl-variant="next"] .woocommerce-tabs ul.tabs {
		border-radius: 14px;
		width: 100%;
	}
	.stl-product[data-stl-variant="next"] .woocommerce-tabs ul.tabs li {
		flex: 1 1 calc(50% - 6px);
		text-align: center;
	}
	.stl-product[data-stl-variant="next"] .woocommerce-tabs ul.tabs li a {
		padding: 10px 8px !important;
		font-size: 14px !important;
		border-radius: 10px;
	}
}