/* =========================================================
   店舗単一ページ（コード版） single-store.php 用スタイル
   Elementorテンプレ675「店舗ページv1」の見た目を再現
   ========================================================= */

.store-single {
	/* ブランドパレット（site-chrome.css :root）を参照して統一 */
	--store-green: var(--mc-green, #6BB730);       /* 基本情報タブ等のアクセント */
	--store-green-dark: var(--mc-green-dark, #559422);
	--store-red: var(--mc-red, #E40110);
	--store-text: var(--mc-ink, #1f1f1f);
	--store-border: var(--mc-line, #e6e6e6);
	color: var(--store-text);
	font-size: 16px;
	line-height: 1.8;
}

.store-container {
	max-width: 1140px;
	margin: 0 auto;
	padding: 0 20px 60px;
}

/* ---- 写真カルーセル（Elementor image-carousel 再現） ---- */
.store-carousel {
	position: relative;
	width: 100%;
	margin-bottom: 30px;
}
.store-carousel__viewport {
	overflow: hidden;
	width: 100%;
}
.store-carousel__track {
	display: flex;
	will-change: transform;
	transition: transform .5s ease;   /* Elementor default speed: 500ms / slide効果 */
}
.store-carousel__slide {
	flex: 0 0 100%;
	margin: 0;
}
.store-carousel__slide img {
	width: 100%;
	height: clamp(220px, 42vw, 520px);
	object-fit: cover;       /* image_stretch=yes 相当（スライド幅いっぱい） */
	display: block;
}

/* 矢印（navigation=both） */
.store-carousel__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: none;
	border-radius: 50%;
	background: rgba(0, 0, 0, .35);
	color: #fff;
	cursor: pointer;
	transition: background .15s;
}
.store-carousel__arrow:hover { background: rgba(0, 0, 0, .6); }
.store-carousel__arrow--prev { left: 14px; }
.store-carousel__arrow--next { right: 14px; }

/* ドット（pagination=bullets） */
.store-carousel__dots {
	display: flex;
	justify-content: center;
	gap: 9px;
	margin-top: 12px;
}
.store-carousel__dot {
	width: 9px;
	height: 9px;
	padding: 0;
	border: none;
	border-radius: 50%;
	background: #c9c9c9;
	cursor: pointer;
	transition: background .15s, transform .15s;
}
.store-carousel__dot:hover { background: #a8a8a8; }
.store-carousel__dot.is-active {
	background: var(--store-green);
	transform: scale(1.15);
}

@media (max-width: 600px) {
	.store-carousel__arrow { width: 36px; height: 36px; }
	.store-carousel__arrow--prev { left: 8px; }
	.store-carousel__arrow--next { right: 8px; }
}

/* ---- 店舗名 ---- */
.store-name {
	text-align: center;
	font-size: clamp(22px, 3vw, 30px);
	font-weight: 700;
	margin: 30px 0 20px;
	letter-spacing: .02em;
}

/* ---- 備考 ---- */
.store-note {
	margin: 0 auto 30px;
	max-width: 880px;
}
.store-note p { margin: 0 0 1em; }

/* ---- タブ ---- */
.store-tabs { margin: 30px 0 40px; }
.store-tabs__nav {
	display: flex;
	gap: 4px;
}
.store-tabs__btn {
	flex: 1 1 auto;
	appearance: none;
	border: none;
	background: #ededed;
	color: #555;
	font-size: 16px;
	font-weight: 700;
	padding: 14px 10px;
	cursor: pointer;
	transition: background .15s, color .15s;
}
.store-tabs__btn:hover { background: #e2e2e2; }
.store-tabs__btn.is-active {
	background: var(--store-green);
	color: #fff;
}
.store-tabs__panels {
	border: 1px solid var(--store-border);
	border-top: none;
	padding: 24px;
}
.store-tabs__panel[hidden] { display: none; }

/* ---- 基本情報リスト ---- */
.store-info-list {
	list-style: none;
	margin: 0 0 24px;
	padding: 0;
}
.store-info-list__item {
	display: flex;
	gap: 16px;
	padding: 14px 4px;
	border-bottom: 1px solid var(--store-border);
}
.store-info-list__item:first-child { border-top: 1px solid var(--store-border); }
.store-info-list__label {
	flex: 0 0 110px;
	font-weight: 700;
	position: relative;
	padding-left: 22px;
}
.store-info-list__label::before {
	content: "";
	position: absolute;
	left: 0; top: .35em;
	width: 12px; height: 12px;
	background: var(--store-green);
	border-radius: 50%;
}
.store-info-list__value { flex: 1 1 auto; white-space: pre-line; }

/* ---- CTA（道順・電話） ---- */
.store-cta {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 4px 0 20px;
}
.store-cta__btn {
	flex: 1 1 240px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 14px 18px;
	border-radius: 999px;
	font-size: 15px;
	font-weight: 700;
	text-decoration: none;
	color: #fff;
	transition: filter .15s, transform .15s;
}
.store-cta__btn:hover { filter: brightness(1.08); transform: translateY(-1px); color: #fff; }
.store-cta__btn--map { background: var(--mc-green); }
.store-cta__btn--tel { background: var(--mc-red); }

/* ---- 地図 ---- */
.store-map { margin-top: 8px; }
.store-map iframe { display: block; width: 100%; }

/* ---- セクション共通（3D / FAQ） ---- */
.store-section { margin: 50px 0; }
.store-section__title {
	text-align: center;
	font-size: clamp(20px, 2.6vw, 26px);
	font-weight: 700;
	margin: 0 0 24px;
}

/* ---- 料金表（コード版カードグリッド mammaciao_render_prices） ---- */
.mc-prices {
	display: grid;
	grid-template-columns: 1fr;   /* 縦並び（PC・スマホ共通で1列） */
	gap: 14px;
}
.mc-price-card {
	--accent: var(--mc-green);
	--accent-soft: var(--mc-green-soft);
	position: relative;
	background: #fff;
	border: 1px solid #ececec;
	border-radius: 14px;
	padding: 16px 20px 18px 24px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .05);
	overflow: hidden;
	transition: transform .2s ease, box-shadow .2s ease;
}
.mc-price-card::before {
	content: "";
	position: absolute;
	left: 0; top: 0; bottom: 0;
	width: 5px;
	background: var(--accent);
}
.mc-price-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 10px 22px rgba(0, 0, 0, .1);
}
/* 洗濯機=緑(水・清潔) / 乾燥機=赤(熱) — ブランド2アクセントで機能を色分け */
.mc-price-card--wash  { --accent: var(--mc-green); --accent-soft: var(--mc-green-soft); }
.mc-price-card--dry   { --accent: var(--mc-red);   --accent-soft: var(--mc-red-soft); }
.mc-price-card--other { --accent: var(--mc-green); --accent-soft: var(--mc-green-soft); }

.mc-price-card__main { min-width: 0; }
.mc-price-card__name {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 6px;
	font-size: 15px;
	font-weight: 700;
	color: #222;
	line-height: 1.3;
}
.mc-price-card__count {
	font-size: 11px;
	font-weight: 700;
	color: #fff;
	background: var(--accent);
	border-radius: 999px;
	padding: 2px 9px;
	white-space: nowrap;
}
.mc-price-card__price {
	font-size: 22px;
	font-weight: 800;
	color: var(--accent);
	line-height: 1.25;
}
.mc-price-card__price p { margin: 0; }
.mc-prices-empty { color: #888; }

/* ---- レスポンシブ ---- */
@media (max-width: 600px) {
	.store-info-list__item { flex-direction: column; gap: 4px; }
	.store-info-list__label { flex-basis: auto; }
	.store-tabs__panels { padding: 16px; }
}