/* =========================================================
   手機底部列 + 年齡確認 — <960px 固定底部三鍵（≥960px 隱藏）；年齡確認全螢幕遮罩（z-index 200）
   body 底部 padding 在 kd-pages.css（body.kd-pages-has-mobile-bar）
   依賴：kd-pages.css
   ========================================================= */

.kd-pages-scope.kd-pages-scope.kd-pages-mobile-bar {
	position: static;
}

/* 底部固定列 */
.kd-pages-scope.kd-pages-scope .kd-pages-mobile-bar__bar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 80;
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(0, 1fr);
	gap: 8px;
	padding: 8px 8px calc(8px + env(safe-area-inset-bottom, 0px));
	background: var(--kd-white);
	border-top: 1px solid var(--kd-line-strong);
	box-shadow: 0 -6px 18px rgba(43, 36, 48, .08);
}

.kd-pages-scope.kd-pages-scope .kd-pages-mobile-bar__btn {
	display: block;
	padding: 12px 4px;
	border-radius: var(--kd-radius-card);
	color: var(--kd-white);
	font-size: 14px;
	font-weight: 900;
	text-align: center;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.kd-pages-scope.kd-pages-scope .kd-pages-mobile-bar__btn:hover {
	color: var(--kd-white);
	filter: brightness(1.06);
}

.kd-pages-scope.kd-pages-scope .kd-pages-mobile-bar__btn--line {
	background: var(--kd-line-green);
}

.kd-pages-scope.kd-pages-scope .kd-pages-mobile-bar__btn--book {
	background: var(--kd-pink);
}

.kd-pages-scope.kd-pages-scope .kd-pages-mobile-bar__btn--tel {
	background: var(--kd-dark);
}

/* 年齡確認 */
.kd-pages-scope.kd-pages-scope .kd-pages-mobile-bar__gate {
	position: fixed;
	inset: 0;
	z-index: 200;
	display: grid;
	place-items: center;
	padding: 20px;
	background: rgba(31, 24, 30, .72); /* 設計稿遮罩色 */
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}

.kd-pages-scope.kd-pages-scope .kd-pages-mobile-bar__gate-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	width: 100%;
	max-width: 420px;
	padding: 32px 28px;
	background: var(--kd-white);
	border-radius: var(--kd-radius-block);
	text-align: center;
	color: var(--kd-dark);
}

.kd-pages-scope.kd-pages-scope .kd-pages-mobile-bar__gate-logo {
	height: 48px;
	width: auto;
}

.kd-pages-scope.kd-pages-scope .kd-pages-mobile-bar__gate-title {
	font-size: 22px;
	font-weight: 900;
	color: var(--kd-dark);
}

.kd-pages-scope.kd-pages-scope .kd-pages-mobile-bar__gate-text {
	font-size: 14.5px;
	line-height: 1.9;
	color: var(--kd-text);
}

.kd-pages-scope.kd-pages-scope .kd-pages-mobile-bar__gate-actions {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px;
	width: 100%;
}

.kd-pages-scope.kd-pages-scope .kd-pages-mobile-bar__yes {
	padding: 14px;
	border-radius: var(--kd-radius-card);
	background: var(--kd-pink);
	color: var(--kd-white);
	font-size: 15.5px;
	font-weight: 900;
}

.kd-pages-scope.kd-pages-scope .kd-pages-mobile-bar__yes:hover {
	filter: brightness(1.06);
}

.kd-pages-scope.kd-pages-scope .kd-pages-mobile-bar__no {
	display: block;
	padding: 13px;
	border: 1.5px solid rgba(43, 36, 48, .2); /* 設計稿「否」框線 */
	border-radius: var(--kd-radius-card);
	color: var(--kd-text);
	font-size: 15.5px;
	font-weight: 700;
}

.kd-pages-scope.kd-pages-scope .kd-pages-mobile-bar__no:hover {
	border-color: var(--kd-pink);
	color: var(--kd-pink);
}

@media (min-width: 960px) {
	.kd-pages-scope.kd-pages-scope .kd-pages-mobile-bar__bar {
		display: none;
	}
}

/* 第三方浮動鈕讓位：手機底部列存在時（body.kd-pages-has-mobile-bar，JS 加），把 Chatway 聊天鈕與 WoodMart 回頂端鈕推到底部列上方。
   只動聊天「按鈕」（.chatway--trigger-container，Chatway 用行內 style 定位所以要 !important）；對話框本身不動，
   手機上打開是全螢幕，動了會被推出畫面（0.4.7 的問題）。64px = 底部列高度，+16px 間距。 */
@media (max-width: 959.98px) {
	body.kd-pages-has-mobile-bar .chatway--trigger-container,
	body.kd-pages-has-mobile-bar .scrollToTop {
		bottom: calc(64px + 16px + env(safe-area-inset-bottom, 0px)) !important;
	}
}