/* ===== 表單區塊（報名/登記表）專用樣式 ===== */
/* 採用 xlead 視覺：--bs-primary #F0762F、outline 框、sim-radio、門票 mask、數量步進器 */
/* 寬度：方塊標準，表單與輸入在容器內填滿可用寬度 */
.form-block-preview-inner,#reg-form{
	padding:  1rem;
}

body > .position-fixed.top-0.end-0.m-3.px-3.py-2.bg-danger.text-white.rounded-2 {
	left: 50% !important;
	right: auto !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	transform: translateX(-50%) !important;
}

body:has(.offcanvas.show) > .position-fixed.top-0.end-0.m-3.px-3.py-2.bg-danger.text-white.rounded-2,
body:has(.offcanvas.showing) > .position-fixed.top-0.end-0.m-3.px-3.py-2.bg-danger.text-white.rounded-2 {
	display: none !important;
}

body > .offcanvas.show,
body > .offcanvas.showing,
body > .offcanvas.hiding,
#products-info,
#products-info.offcanvas,
#offcanvasRight {
	z-index: 16000220 !important;
}

.offcanvas-backdrop,
.offcanvas-backdrop.show {
	z-index: 16000210 !important;
}

body:has(.offcanvas.show) :is(.x-pg-floating-nav-cart, .x-pg-floating-actions, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div),
body:has(.offcanvas.showing) :is(.x-pg-floating-nav-cart, .x-pg-floating-actions, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div),
body:has(.offcanvas.hiding) :is(.x-pg-floating-nav-cart, .x-pg-floating-actions, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div),
body.x-pg-sales-product-modal-open :is(.x-pg-floating-nav-cart, .x-pg-floating-actions, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div),
body:has(#products-info.show) :is(.x-pg-floating-nav-cart, .x-pg-floating-actions, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div),
body:has(#products-info.showing) :is(.x-pg-floating-nav-cart, .x-pg-floating-actions, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div),
body:has(#products-info.hiding) :is(.x-pg-floating-nav-cart, .x-pg-floating-actions, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div),
body:has(#products-info.active) :is(.x-pg-floating-nav-cart, .x-pg-floating-actions, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div),
body:has(#products-info[aria-modal="true"]) :is(.x-pg-floating-nav-cart, .x-pg-floating-actions, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div),
body:has(#products-info[aria-hidden="false"]) :is(.x-pg-floating-nav-cart, .x-pg-floating-actions, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div),
body:has(#products-info[style*="visibility: visible"]) :is(.x-pg-floating-nav-cart, .x-pg-floating-actions, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div),
body:has(#products-info[style*="visibility:visible"]) :is(.x-pg-floating-nav-cart, .x-pg-floating-actions, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div),
body:has(#products-info[style*="display:block"]) :is(.x-pg-floating-nav-cart, .x-pg-floating-actions, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div),
body:has(#products-info[style*="display: block"]) :is(.x-pg-floating-nav-cart, .x-pg-floating-actions, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div) {
	z-index: 1 !important;
	pointer-events: none !important;
	opacity: 0 !important;
	visibility: hidden !important;
	display: none !important;
}

body:has(.offcanvas.show) :is(.x-pg-floating-nav-cart, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div) *,
body:has(.offcanvas.showing) :is(.x-pg-floating-nav-cart, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div) *,
body:has(.offcanvas.hiding) :is(.x-pg-floating-nav-cart, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div) *,
body.x-pg-sales-product-modal-open :is(.x-pg-floating-nav-cart, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div) *,
body:has(#products-info.show) :is(.x-pg-floating-nav-cart, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div) *,
body:has(#products-info.showing) :is(.x-pg-floating-nav-cart, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div) *,
body:has(#products-info.hiding) :is(.x-pg-floating-nav-cart, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div) *,
body:has(#products-info.active) :is(.x-pg-floating-nav-cart, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div) *,
body:has(#products-info[aria-modal="true"]) :is(.x-pg-floating-nav-cart, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div) *,
body:has(#products-info[aria-hidden="false"]) :is(.x-pg-floating-nav-cart, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div) *,
body:has(#products-info[style*="visibility: visible"]) :is(.x-pg-floating-nav-cart, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div) *,
body:has(#products-info[style*="visibility:visible"]) :is(.x-pg-floating-nav-cart, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div) *,
body:has(#products-info[style*="display:block"]) :is(.x-pg-floating-nav-cart, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div) *,
body:has(#products-info[style*="display: block"]) :is(.x-pg-floating-nav-cart, #right-buttons-div, #fixed-register-btn, #fixed-right-side-div) * {
	z-index: 1 !important;
	pointer-events: none !important;
}

div:where(.swal2-container),
.swal2-container {
	z-index: 16000230 !important;
}

div:where(.swal2-container).swal2-center.swal2-backdrop-show {
	background: rgba(15, 23, 42, 0.42) !important;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	padding: 20px !important;
}

div:where(.swal2-container).swal2-center .swal2-popup:not(.swal2-toast) {
	width: min(420px, calc(100vw - 40px)) !important;
	padding: 28px 28px 24px !important;
	border: 1px solid rgba(15, 23, 42, 0.08) !important;
	border-radius: 20px !important;
	background: #fff !important;
	box-shadow:
		0 24px 80px rgba(15, 23, 42, 0.22),
		0 10px 30px rgba(15, 23, 42, 0.12),
		0 1px 0 rgba(255, 255, 255, 0.8) inset !important;
	color: #0f172a !important;
}

div:where(.swal2-container).swal2-center .swal2-icon {
	width: 56px !important;
	height: 56px !important;
	margin: 0 auto 18px !important;
	border-width: 0 !important;
	background: #eff6ff !important;
	box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.12) inset !important;
}

div:where(.swal2-container).swal2-center .swal2-icon.swal2-question {
	color: #2563eb !important;
}

div:where(.swal2-container).swal2-center .swal2-icon .swal2-icon-content {
	font-size: 34px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
}

div:where(.swal2-container).swal2-center .swal2-title {
	padding: 0 !important;
	margin: 0 !important;
	color: #0f172a !important;
	font-size: 20px !important;
	font-weight: 700 !important;
	letter-spacing: 0 !important;
	line-height: 1.35 !important;
}

div:where(.swal2-container).swal2-center .swal2-html-container {
	margin: 10px 0 0 !important;
	padding: 0 !important;
	color: #64748b !important;
	font-size: 15px !important;
	font-weight: 500 !important;
	line-height: 1.6 !important;
	text-align: center !important;
}

div:where(.swal2-container).swal2-center .swal2-actions {
	display: flex !important;
	flex-wrap: wrap !important;
	justify-content: center !important;
	gap: 12px !important;
	width: 100% !important;
	margin: 24px 0 0 !important;
}

div:where(.swal2-container).swal2-center .swal2-actions .btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-width: 128px !important;
	min-height: 44px !important;
	margin: 0 !important;
	padding: 10px 18px !important;
	border-radius: 12px !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	letter-spacing: 0 !important;
	box-shadow: none !important;
	transition: transform 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease, border-color 0.16s ease !important;
}

div:where(.swal2-container).swal2-center .swal2-actions .btn:hover {
	transform: translateY(-1px);
}

div:where(.swal2-container).swal2-center .swal2-actions .btn-danger,
div:where(.swal2-container).swal2-center .swal2-actions .swal2-confirm {
	border-color: #ef4444 !important;
	background: #ef4444 !important;
	color: #fff !important;
	box-shadow: 0 10px 22px rgba(239, 68, 68, 0.22) !important;
}

div:where(.swal2-container).swal2-center .swal2-actions .btn-danger:hover,
div:where(.swal2-container).swal2-center .swal2-actions .swal2-confirm:hover {
	border-color: #dc2626 !important;
	background: #dc2626 !important;
	box-shadow: 0 12px 26px rgba(220, 38, 38, 0.24) !important;
}

div:where(.swal2-container).swal2-center .swal2-actions .btn-link,
div:where(.swal2-container).swal2-center .swal2-actions .swal2-cancel {
	border: 1px solid rgba(15, 23, 42, 0.12) !important;
	background: #fff !important;
	color: #475569 !important;
	text-decoration: none !important;
}

div:where(.swal2-container).swal2-center .swal2-actions .btn-link:hover,
div:where(.swal2-container).swal2-center .swal2-actions .swal2-cancel:hover {
	border-color: rgba(15, 23, 42, 0.18) !important;
	background: #f8fafc !important;
	color: #0f172a !important;
}

div:where(.swal2-container).swal2-center .swal2-actions .btn:focus,
div:where(.swal2-container).swal2-center .swal2-actions .btn:focus-visible {
	outline: none !important;
	box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.18) !important;
}

@media (max-width: 420px) {
	div:where(.swal2-container).swal2-center .swal2-popup:not(.swal2-toast) {
		padding: 24px 18px 18px !important;
		border-radius: 18px !important;
	}

	div:where(.swal2-container).swal2-center .swal2-actions {
		gap: 10px !important;
	}

	div:where(.swal2-container).swal2-center .swal2-actions .btn {
		flex: 1 1 130px !important;
		min-width: 0 !important;
	}
}

.x-pg-row-form-block {
	--form-block-primary-rgb: 240, 118, 47;
	--bs-primary: var(--x-pg-primary, var(--bs-primary, #F0762F));
	--bs-primary-rgb: var(--bs-primary-rgb, var(--form-block-primary-rgb));
	--bs-primary-light: var(--bs-primary-light, #fff4eedc);
	--x-pg-booking-accent: var(--bs-primary, #F0762F);
	--x-pg-booking-accent-rgb: var(--bs-primary-rgb, var(--form-block-primary-rgb));
	--x-pg-booking-accent-soft: color-mix(in srgb, var(--x-pg-booking-accent) 10%, #ffffff);
	--bs-input-group-addon-color: #5E6278;
	--bs-input-group-addon-bg: #f5f8fa;
	--bs-input-group-addon-border-color: #dee2e6;
	--bs-form-select-color: #5E6278;
	--bs-form-select-bg: #ffffff;
	--bs-form-select-indicator-color: #7E8299;
	--bs-form-select-indicator: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%237E8299' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
	--bs-form-select-border-color: #dee2e6;
	--bs-form-select-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
	--bs-form-select-focus-border-color: #B5B5C3;
	--bs-form-select-focus-box-shadow: 0 0 0 0.25rem rgba(84, 99, 165, 0.25);
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	background: #fff;
	min-height: 0;
	padding: 0 1rem;
}

.form-card {
	width: 100%;
	max-width: 960px;
	
	border-radius: 16px;
	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.06), 0 10px 20px -4px rgba(0, 0, 0, 0.08);
	border: 1px solid rgba(226, 232, 240, 0.9);
	overflow: hidden;
	background: #fff;
	box-sizing: border-box;
}

.form_bg {
	background: #fff;
	width: 100%;
}

.form_size {
	padding: 32px 32px 40px;
	width: 100%;
	box-sizing: border-box;
}

.x-pg-row-form-block #form,
.x-pg-row-form-block form#reg-form {
	width: 100%;
	display: block;
}

/* 表單內隱藏：原生 input、tab 切換用元素（from xlead） */
.x-pg-row-form-block .label_box input,
.x-pg-row-form-block .js-step .quest_list.tab-on,
.x-pg-row-form-block input[type="radio"].tab-input,
.x-pg-row-form-block input[type="checkbox"]+.hero_header,
.x-pg-row-form-block input[type="checkbox"].tab-input,
.x-pg-row-form-block input[type="checkbox"]#survey-toolbar+.survey-toolbar,
.x-pg-row-form-block input[type="checkbox"]#survey-entrance:checked~.form {
	display: none;
}
.x-pg-row-form-block .no-select-overlay,
.form_box .no-select-overlay {
	display: none !important;
}
.x-pg-row-form-block .survey .quest_list.tab-on:target,
.x-pg-row-form-block .js-step.js-step-active .quest_list.tab-on {
	display: flex;
}
/* ----- .quest_list 相關（from xlead） ----- */
.x-pg-row-form-block input[type="radio"]:checked+.quest_list {
	display: flex;
}
.x-pg-row-form-block .quest_list {
	flex-wrap: wrap;
}
.x-pg-row-form-block .survey .quest_list {
	display: flex;
	flex-direction: column;
	gap: .5rem;
}
.x-pg-row-form-block .offcanvas-body .quest_list {
	padding-bottom: 63px;
}
.x-pg-row-form-block .quest_list .friend-inputs-container:last-of-type {
	margin-bottom: 0;
}

/* ----- survey-toolbar / form-progress / form-btn（from xlead） ----- */
.x-pg-row-form-block input[type="checkbox"]#survey-toolbar:checked+.survey-toolbar {
	display: flex;
}
.x-pg-row-form-block .survey-toolbar {
	width: 100%;
	padding: 10px;
	text-align: center;
	border-top: 1px dashed #d8d8d8;
}
.x-pg-row-form-block .survey .survey-toolbar {
	border-top: 0;
}
.x-pg-row-form-block .form-progress .progress {
	height: 4px;
	background-color: #fff !important;
	border-radius: 999px;
}
.x-pg-row-form-block .form-progress #progress-bar,
.x-pg-row-form-block .form-progress .progress-bar {
	background-color: var(--form-btn-bg, #D4601D) !important;
	border-radius: inherit;
}
.x-pg-row-form-block #nextButton {
	margin-left: auto;
}
/* 頁面模擬（編輯器預覽）專用：送出鈕無外框、橘色 #D4601D */
.form-block-preview-inner #nextButton {
	border: none;
	background-color: #D4601D;
}
.x-pg-row-form-block .ver-iframe .survey-toolbar,
.x-pg-row-form-block .ver-iframe .button_area {
	position: sticky;
	bottom: 0;
	left: 0;
	width: 100%;
	background-color: #f5f8fa;
	z-index: 5;
}
.x-pg-row-form-block .ver-iframe .survey-toolbar {
	background-color: #fff;
}
.x-pg-row-form-block .fz12 {
	font-size: 12px !important;
}
#form-inputs .button_area .btn.form-btn,
#form-inputs .button_area .btn.btn-primary.form-btn,
#form-inputs .button_area .btn.btn-danger.form-btn {
	background: var(--form-btn-bg, #D4601D) !important;
	border-color: var(--form-btn-bg, #D4601D) !important;
	box-shadow: 0 4px 10px rgba(15, 23, 42, 0.08) !important;
	color: var(--form-btn-color, #fff) !important;
}
#form-inputs .button_area .btn.form-btn .indicator-label,
#form-inputs .button_area .btn.form-btn .indicator-progress {
	color: inherit !important;
}
#form-inputs .button_area .btn.form-btn:hover:not(:disabled):not(.disabled),
#form-inputs .button_area .btn.form-btn:focus:not(:disabled):not(.disabled):not(.btn-active),
#form-inputs .button_area .btn.btn-primary.form-btn:hover:not(:disabled):not(.disabled),
#form-inputs .button_area .btn.btn-primary.form-btn:focus:not(:disabled):not(.disabled):not(.btn-active),
#form-inputs .button_area .btn.btn-danger.form-btn:hover:not(:disabled):not(.disabled),
#form-inputs .button_area .btn.btn-danger.form-btn:focus:not(:disabled):not(.disabled):not(.btn-active) {
	background: var(--form-btn-bg-hover, #D4601D) !important;
	border-color: var(--form-btn-bg-hover, #D4601D) !important;
	box-shadow: 0 6px 14px rgba(15, 23, 42, 0.1) !important;
	color: var(--form-btn-hover-color, #fff) !important;
}
#form-inputs .button_area .btn.form-btn:focus:not(:focus-visible):not(.btn-active) {
	background: var(--form-btn-bg, #D4601D) !important;
	border-color: var(--form-btn-bg, #D4601D) !important;
	box-shadow: 0 4px 10px rgba(15, 23, 42, 0.08) !important;
	color: var(--form-btn-color, #fff) !important;
}
#form-inputs .button_area .btn.form-btn:disabled,
#form-inputs .button_area .btn.form-btn.disabled {
	box-shadow: none !important;
}
.x-pg-row-form-block .form_box .btn.btn-primary.form-btn,
.x-pg-row-form-block .form_box .btn.btn-danger.form-btn {
	background-color: var(--form-btn-bg, #D4601D) !important;
	color: var(--form-btn-color, #fff) !important;
}
.x-pg-row-form-block .form_box .btn.btn-primary.form-btn:hover:not(.btn-active),
.x-pg-row-form-block .form_box .btn.btn-primary.form-btn:focus:not(.btn-active),
.x-pg-row-form-block .form_box .btn.btn-danger.form-btn:hover:not(.btn-active),
.x-pg-row-form-block .form_box .btn.btn-danger.form-btn:focus:not(.btn-active) {
	background-color: var(--form-btn-bg-hover, #D4601D) !important;
	color: var(--form-btn-hover-color, #fff) !important;
}
.x-pg-row-form-block .form_box .btn.btn-primary.form-btn:focus:not(:focus-visible):not(.btn-active),
.x-pg-row-form-block .form_box .btn.btn-danger.form-btn:focus:not(:focus-visible):not(.btn-active) {
	background-color: var(--form-btn-bg, #D4601D) !important;
	color: var(--form-btn-color, #fff) !important;
	filter: brightness(100%);
}
@media (hover: none) and (pointer: coarse) {
	.x-pg-row-form-block .form_box .btn.btn-primary.form-btn:focus:not(.btn-active),
	.x-pg-row-form-block .form_box .btn.btn-danger.form-btn:focus:not(.btn-active) {
		background-color: var(--form-btn-bg, #D4601D) !important;
		color: var(--form-btn-color, #fff) !important;
		filter: brightness(100%) !important;
		outline: none !important;
		box-shadow: none !important;
	}
}
.x-pg-row-form-block .form_box .btn.btn-primary.form-btn,
.x-pg-row-form-block .form_box .btn.btn-danger.form-btn {
	-webkit-tap-highlight-color: transparent;
}
.x-pg-row-form-block .form_box .btn.btn-secondary.form-btn {
	background-color: var(--form-btn-secondary-bg, #7C829B) !important;
	color: var(--form-btn-secondary-color, #fff) !important;
	-webkit-tap-highlight-color: transparent;
}
.x-pg-row-form-block .form_box .btn.btn-secondary.form-btn:hover:not(.btn-active),
.x-pg-row-form-block .form_box .btn.btn-secondary.form-btn:focus:not(.btn-active) {
	background-color: var(--form-btn-secondary-bg-hover, #979EBD) !important;
	color: #fff !important;
}
.x-pg-row-form-block .form_box .btn.btn-secondary.form-btn:focus:not(:focus-visible):not(.btn-active) {
	background-color: var(--form-btn-secondary-bg, #7C829B) !important;
	color: var(--form-btn-secondary-color, #fff) !important;
	filter: brightness(100%);
}
@media (hover: none) and (pointer: coarse) {
	.x-pg-row-form-block .form_box .btn.btn-secondary.form-btn:focus:not(.btn-active) {
		background-color: var(--form-btn-secondary-bg, #7C829B) !important;
		color: var(--form-btn-secondary-color, #fff) !important;
		filter: brightness(100%) !important;
		outline: none !important;
		box-shadow: none !important;
	}
}
.x-pg-row-form-block .survey-toolbar .text-gray-700 {
	color: var(--bs-text-gray-700, #5E6278);
}

/* ----- .x-radio / .x-checkbox 模擬選鈕（from xlead） ----- */
.x-pg-row-form-block .x-radio,
.x-pg-row-form-block .x-checkbox {
	width: 16px;
	height: 16px;
	margin-left: 2px;
	margin-right: 2px;
	border: 1px solid #979797;
	background-color: #fff;
	border-radius: 50%;
	flex-shrink: 0;
}
.x-pg-row-form-block .x-checkbox {
	border-radius: 4px;
}
.x-pg-row-form-block .label_box input[type="radio"]:checked+label,
.x-pg-row-form-block .label_box input[type="checkbox"]:checked+label,
.x-pg-row-form-block .selected-list li {
	outline: 1px solid var(--bs-danger);
	background-color: #f9f4e5;
	font-weight: 700;
}
.x-pg-row-form-block .label_box input[type="radio"]:checked+label .x-radio {
	border: 1px solid var(--bs-primary);
	width: 20px;
	height: 20px;
	margin-right: 0;
	margin-left: 0;
	position: relative;
}
.x-pg-row-form-block .label_box input[type="checkbox"]:checked+label .x-checkbox,
.x-pg-row-form-block .selected-list li .x-checkbox {
	width: 20px;
	height: 20px;
	margin-right: 0;
	margin-left: 0;
	background: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 15.586L6.707 12.293L5.293 13.707L10 18.414L19.707 8.70697L18.293 7.29297L10 15.586Z' fill='white'/%3E%3C/svg%3E") center/contain no-repeat;
	background-color: var(--bs-primary);
	border: 1px solid var(--bs-primary);
}
/* xlead radio 選中時內圈圓點（::before，與 xlead 一致） */
.x-pg-row-form-block .form_box .form-check-input:checked[type=radio]::before,
.x-pg-row-form-block .label_box input[type="radio"]:checked+label .x-radio::before {
	content: '';
	z-index: 1;
	position: absolute;
	width: 65%;
	height: 65%;
	border-radius: 50%;
	background-color: var(--bs-primary, #e57738);
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.x-pg-row-form-block .form_box .form-check-input:checked[type=radio]::before,
.x-pg-row-form-block .label_box input[type="radio"]:checked+label .x-radio::before {
	animation: radioCheck 0.3s forwards;
}
@keyframes radioCheck {
	from { opacity: 0; transform: translate(-50%, -50%) scale(0); }
	to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}
.x-pg-row-form-block .form_box .form-check-input:checked[type=radio] {
	background-color: var(--bs-white, #fff);
	border-color: var(--bs-danger);
	position: relative;
}
.x-pg-row-form-block .form_box .form-check-input:checked {
	background-color: var(--bs-primary, #e57738);
	border-color: var(--bs-primary, #e57738);
}

@media (max-width: 768px) {
	.form-card {
		margin: 24px 16px;
	}
	.form_size {
		padding: 20px 16px 24px;
	}
	.x-pg-row-form-block #hook-sessions .session_choice .option div.opt_line {
		gap: 8px;
	}
}

@media (max-width: 576px) {
	.form_size {
		padding: 16px 0px 20px;
	}
}

.x-pg-preview-frame.tablet .form_size,
.x-pg-preview-frame.mobile .form_size {
	padding: 16px 8px 20px;
}
.x-pg-preview-frame.mobile .x-pg-row,
.x-pg-preview-frame.mobile .x-pg-row-form-block {
	padding-left: 0;
	padding-right: 0;
}

/* ----- 場次選擇區 (Session)：主題色・科技巨頭級卡片 UI ----- */
.x-pg-row-form-block #hook-sessions,
#hook-sessions {
	width: 100%;
	display: block;
	margin-bottom: 24px;
	box-sizing: border-box;
}

#hook-sessions > span.mb-2,
#hook-sessions > .fs-7.text-muted {
	display: block;
	font-size: 0.8125rem;
	font-weight: 500;
	color: #6b7280;
	margin-bottom: 12px;
	letter-spacing: 0.01em;
}

/* 場次區：xlead 樣式 */
.x-pg-row-form-block #hook-sessions .col-12.session.mb-5,
#hook-sessions .col-12.session.mb-5 {
	margin-bottom: 1rem !important;
}

.x-pg-row-form-block #hook-sessions .session_choice {
	display: flex;
	flex-direction: column;
	width: 100%;
	border: none;
	padding: 8px 0;
	border-radius: .625rem;
	margin: 0;
}
.label_box label, .selected-list li {
    padding: .75rem;
    outline: 1px dashed #979797;
    background-color: #fff;
    border-radius: 8px;
    cursor: pointer;
}

#hook-sessions .session_choice label {
	display: block;
	margin-bottom: 8px;
	cursor: pointer;
}

#hook-sessions .session_choice label:last-of-type {
	margin-bottom: 0;
}

.x-pg-row-form-block #hook-sessions .session_choice:not(.ticket) .option {
	display: block;
	outline: 1px solid #e3e3e3;
	border-radius: 6px;
	padding: .35rem .5rem;
	margin: .35rem auto;
	background: #fff;
	box-sizing: border-box;
	transition: background 0.2s ease, outline-color 0.2s ease;
}

.x-pg-row-form-block #hook-sessions .session_choice:not(.ticket) .option:hover {
	background-color: rgba(var(--bs-primary-rgb), 0.1);
	cursor: pointer;
}

.x-pg-row-form-block #hook-sessions input[type='radio']:checked + .option {
	outline: 2px solid var(--bs-primary, #F0762F);
	background-color: rgba(var(--bs-primary-rgb), 0.1);
}

.x-pg-row-form-block #hook-sessions .session_choice .option div.opt_line,
.x-pg-row-form-block #hook-sessions .label_choice .option div.opt_line {
	display: flex;
	flex-direction: row;
	align-items: center;
	width: 100%;
}

.x-pg-row-form-block #hook-sessions .session_choice .option .opt_line .session-top {
	width: 100%;
	padding-bottom: 2px;
	margin-bottom: 2px;
	flex-wrap: wrap;
	align-items: center;
}

.x-pg-row-form-block #hook-sessions .session_choice .option .opt_line .session-bottom {
	display: flex;
}

.x-pg-row-form-block #hook-sessions .session_choice .option .opt_line .session-top:has(.session_name:empty) {
	display: none !important;
}

.x-pg-row-form-block #hook-sessions .sim-radio {
	width: 20px;
	height: 20px;
	border: 1px solid #e3e3e3;
	border-radius: 50%;
	background: #fff;
	flex-shrink: 0;
	position: relative;
}

.x-pg-row-form-block #hook-sessions .sim-radio::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 8px;
	height: 8px;
	border-radius: 999px;
	background: transparent;
	transform: translate(-50%, -50%);
}

.x-pg-row-form-block #hook-sessions input[type='radio']:checked + .option .sim-radio {
	border: 4px solid #fff;
	background-color: var(--bs-primary, #F0762F);
	outline: 1px solid var(--bs-primary, #F0762F);
}

.x-pg-row-form-block #hook-sessions input[type='radio']:checked + .option .sim-radio::after {
	background: transparent;
	width: 0;
	height: 0;
}

#hook-sessions input[type='radio'] {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.x-pg-row-form-block #hook-sessions .session_choice .option .opt_line div.session_time {
	width: 100%;
}

.x-pg-row-form-block #hook-sessions .session_choice {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.x-pg-row-form-block #hook-sessions .session_choice .option {
	padding: .35rem .5rem;
	outline: 1px solid #e3e3e3;
	border-radius: 6px;
	margin: .35rem auto;
}

.x-pg-row-form-block #hook-sessions .session_choice .option div.opt_line {
	display: flex;
	flex-direction: row;
	align-items: center;
	width: 100%;
}

.x-pg-row-form-block #hook-sessions .session_choice .option .opt_line .session-top {
	width: 100%;
	padding-bottom: 2px;
	margin-bottom: 2px;
	flex-wrap: wrap;
	align-items: center;
}

.x-pg-row-form-block #hook-sessions .session_choice .option .opt_line .session-bottom {
	display: flex;
}

.x-pg-row-form-block #hook-sessions .option.full,
.x-pg-row-form-block #hook-sessions .session_choice input[type='radio']:checked + .option.full {
	background-color: rgba(238, 238, 238, 0.452);
	cursor: not-allowed;
	outline: 1px solid #ddd;
}

.x-pg-row-form-block #hook-sessions .session_time,
.x-pg-row-form-block #hook-sessions .session_time span,
.x-pg-row-form-block #hook-sessions .date-start span {
	font-size: 13px;
	font-weight: 500;
	line-height: 1.35;
	color: #6b7280;
}

.x-pg-row-form-block #hook-sessions .session_time .date-time {
	color: #a5643d;
}

.x-pg-row-form-block #hook-sessions input[type='radio']:checked + .option .session_time span,
.x-pg-row-form-block #hook-sessions input[type='radio']:checked + .option .date-start span {
	color: #000;
	font-weight: 600;
}

#hook-sessions .session-bottom p {
	color: #9ca3af;
	font-size: 0.75rem;
	line-height: 1.3;
	margin: 0;
}

/* xlead 對應：session_name、session_time 內層、separator、session_hint（場次區完整結構） */
.x-pg-row-form-block #hook-sessions .session_choice .option .opt_line .session_name,
#hook-sessions .session_choice .option .opt_line .session_name {
	display: flex;
	align-items: center;
	font-weight: normal;
	color: #3f4254;
	font-size: 13px;
	min-width: fit-content;
	flex-grow: 1;
	margin-right: 1rem;
}
.x-pg-row-form-block #hook-sessions .session_choice .option .opt_line .session_name span,
#hook-sessions .session_choice .option .opt_line .session_name span {
	font-size: 13px;
}
.x-pg-row-form-block #hook-sessions input[type='radio']:checked + .option:not(.full) .session_name,
#hook-sessions input[type='radio']:checked + .option:not(.full) .session_name {
	font-weight: 600;
	color: #000 !important;
}
.x-pg-row-form-block #hook-sessions .session_choice .option .opt_line div.session_time div,
#hook-sessions .session_choice .option .opt_line div.session_time div {
	display: flex;
	flex-direction: row;
	gap:8px;
	align-items: center;
	color:  #52433a;
	position: relative;
}
.x-pg-row-form-block #hook-sessions .session_choice .option .opt_line .session_time.session-period-display,
#hook-sessions .session_choice .option .opt_line .session_time.session-period-display {
	display: flex;
	flex-direction: column;
	min-width: 0;
}
.x-pg-row-form-block #hook-sessions .session_choice .option .opt_line .session_time span,
#hook-sessions .session_choice .option .opt_line .session_time span {
	font-weight: normal;
}
.x-pg-row-form-block #hook-sessions .separator.separator-dashed.border-gray-300.my-1,
#hook-sessions .separator.separator-dashed.border-gray-300.my-1 {
	border: 0;
	border-top: 1px dashed var(--bs-gray-300, #dee2e6);
	margin-top: 0.25rem;
	margin-bottom: 0.25rem;
	width: 100%;
	display: block;
}

/* 場次底部完全沒有文字時，一併隱藏分隔線與空的 bottom 區塊 */
#hook-sessions:has(.session-bottom:has(p:empty):has(.session_hint:empty)) .separator.separator-dashed.border-gray-300.my-1 {
	display: none;
}
.opt_line:has(.session-bottom > p:empty):has(.session-bottom > .session_hint:empty) > .flex-grow-1 > .separator.separator-dashed.border-gray-300.my-1 {
	display: none;
}
.opt_line.no-session-bottom-content > .flex-grow-1 > .separator.separator-dashed.border-gray-300.my-1 {
	display: none;
}
  
/* 當 session-bottom 內 p 與 session_hint 都無內容時隱藏分隔線 */
/* 不再使用 :has 來隱藏分隔線，改由 JS 決定是否輸出 separator */
.x-pg-row-form-block #hook-sessions .session-bottom .session_hint,
#hook-sessions .session-bottom .session_hint {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 4px;
}
.x-pg-row-form-block #hook-sessions .session_hint.under,
#hook-sessions .session_hint.under {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}
.x-pg-row-form-block #hook-sessions .session_hint.under p,
.x-pg-row-form-block #hook-sessions .session_hint.under .text-gray-500,
#hook-sessions .session_hint.under p,
#hook-sessions .session_hint.under .text-gray-500 {
	font-size: 0.75rem;
	color: #6b7280;
	margin: 0;
	font-weight: normal;
}
.x-pg-row-form-block #hook-sessions .option .opt_line p,
#hook-sessions .option .opt_line p {
	margin-bottom: 0;
	margin-top: 0;
	display: inline-block;
	color: #9ca3af;
}
.x-pg-row-form-block #hook-sessions .option.full:hover,
#hook-sessions .option.full:hover {
	background-color: rgba(238, 238, 238, 0.452);
	outline: 1px solid #ddd;
	cursor: not-allowed;
}

/* ----- Hook Offer Items：沿用 xlead option / sim-radio 樣式 ----- */

.x-pg-row-form-block #hook-booking-items label {
	display: block;
	height: 100%;
	margin-bottom: 0;
	cursor: pointer;
}
.x-pg-row-form-block #hook-booking-items label:last-of-type {
	margin-bottom: 0;
}
.x-pg-row-form-block #hook-booking-items .session_choice {
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0;
}
.x-pg-row-form-block #hook-booking-items input[type='radio'] {
	display: block !important;
	position: absolute;
	opacity: 0;
	pointer-events: none;
}
.x-pg-row-form-block #hook-booking-items .option {
	display: flex;
	align-items: center;
	height: 100%;
	min-height: 42px;
	padding: .35rem .5rem;
	outline: 1px solid #e3e3e3;
	border-radius: 6px;
	margin: 0;
	background: #fff;
	box-sizing: border-box;
	transition: background 0.2s ease, outline-color 0.2s ease;
}
.x-pg-row-form-block #hook-booking-items .option:hover {
	background-color: rgba(var(--x-pg-booking-accent-rgb, var(--bs-primary-rgb, 240, 118, 47)), 0.1);
	background: var(--x-pg-booking-accent-soft, rgba(var(--x-pg-booking-accent-rgb, var(--bs-primary-rgb, 240, 118, 47)), 0.1));
	cursor: pointer;
}
.x-pg-row-form-block #hook-booking-items input[type='radio']:checked + .option {
	outline: 2px solid var(--x-pg-booking-accent, var(--bs-primary, #F0762F));
	background-color: rgba(var(--x-pg-booking-accent-rgb, var(--bs-primary-rgb, 240, 118, 47)), 0.1);
	background: var(--x-pg-booking-accent-soft, rgba(var(--x-pg-booking-accent-rgb, var(--bs-primary-rgb, 240, 118, 47)), 0.1));
}
.x-pg-row-form-block #hook-booking-items .option .opt_line {
	display: flex;
	flex-direction: row;
	align-items: center;
	width: 100%;
}
.x-pg-row-form-block #hook-booking-items .option .opt_line .session-top {
	width: 100%;
	padding-bottom: 0;
	margin-bottom: 0;
	flex-wrap: wrap;
	align-items: center;
}
.x-pg-row-form-block #hook-booking-items .option .opt_line .session_name {
	display: flex;
	align-items: center;
	font-weight: normal;
	color: #3f4254;
	font-size: 13px;
	min-width: 0;
}
.x-pg-row-form-block #hook-booking-items .option .opt_line .session_name span {
	font-size: 13px;
	font-weight: inherit;
	color: inherit;
	margin-bottom: 0;
}
.x-pg-row-form-block #hook-booking-items input[type='radio']:checked + .option:not(.full) .session_name {
	font-weight: 600;
	color: #000 !important;
}
.x-pg-row-form-block #hook-booking-items .sim-radio {
	width: 20px;
	height: 20px;
	border: 1px solid #e3e3e3;
	border-radius: 50%;
	background-color: #fff;
	flex-shrink: 0;
}
.x-pg-row-form-block #hook-booking-items input:checked + .option:not(.full) .sim-radio {
	border: 4px solid #fff;
	background-color: var(--x-pg-booking-accent, var(--bs-primary, rgb(240, 118, 47)));
	outline: 1px solid var(--x-pg-booking-accent, var(--bs-primary, rgb(240, 118, 47)));
}
.x-pg-row-form-block #hook-offer-items label {
	display: block;
	margin-bottom: 8px;
	cursor: pointer;
}
.x-pg-row-form-block #hook-gifts label {
	display: block;
	margin-bottom: 8px;
	cursor: pointer;
}
.x-pg-row-form-block #hook-offer-items label:last-of-type {
	margin-bottom: 0;
}
.x-pg-row-form-block #hook-gifts label:last-of-type {
	margin-bottom: 0;
}
.x-pg-row-form-block #hook-offer-items input[type='radio'] {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}
.x-pg-row-form-block #hook-gifts input[type='radio'] {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}
/* 正式頁 runtime bundle 會在選品區最外層額外插入 Bootstrap px-4，
 * 但 editor 模擬 HTML 沒有這層內距，會造成正式頁比模擬再向內縮。
 * 只清掉 selection root 的第一層水平 padding，不影響內部卡片排版。 */
.x-pg-row-form-block #hook-sessions > .px-4,
.x-pg-row-form-block #hook-sessions > [class*=" px-4"],
.x-pg-row-form-block #hook-booking-items > .px-4,
.x-pg-row-form-block #hook-booking-items > [class*=" px-4"],
.x-pg-row-form-block #hook-offer-items > .px-4,
.x-pg-row-form-block #hook-offer-items > [class*=" px-4"],
.x-pg-row-form-block #hook-gifts > .px-4,
.x-pg-row-form-block #hook-gifts > [class*=" px-4"] {
	padding-left: 0 !important;
	padding-right: 0 !important;
}
.x-pg-row-form-block #hook-offer-items .option {
	display: block;
	padding: .35rem .5rem;
	outline: 1px solid #e3e3e3;
	border-radius: 6px;
	margin: .35rem auto;
	background: #fff;
	box-sizing: border-box;
	transition: background 0.2s ease, outline-color 0.2s ease;
}
.x-pg-row-form-block #hook-gifts .option {
	display: block;
	padding: .35rem .5rem;
	outline: 1px solid #e3e3e3;
	border-radius: 6px;
	margin: .35rem auto;
	background: #fff;
	box-sizing: border-box;
	transition: background 0.2s ease, outline-color 0.2s ease;
}
.x-pg-row-form-block #hook-offer-items .option:hover {
	background-color: rgba(var(--bs-primary-rgb), 0.1);
	cursor: pointer;
}
.x-pg-row-form-block #hook-gifts .option:hover {
	background-color: rgba(var(--bs-primary-rgb), 0.1);
	cursor: pointer;
}
.x-pg-row-form-block #hook-offer-items input[type='radio']:checked + .option {
	outline: 2px solid var(--bs-primary, #F0762F);
	background-color: rgba(var(--bs-primary-rgb), 0.1);
}
.x-pg-row-form-block #hook-gifts input[type='radio']:checked + .option {
	outline: 2px solid var(--bs-primary, #F0762F);
	background-color: rgba(var(--bs-primary-rgb), 0.1);
}
.x-pg-row-form-block #hook-offer-items .option .opt_line {
	display: flex;
	flex-direction: row;
	align-items: center;
	width: 100%;
}
.x-pg-row-form-block #hook-gifts .option .opt_line {
	display: flex;
	flex-direction: row;
	align-items: center;
	width: 100%;
}
.x-pg-row-form-block #hook-offer-items .option .opt_line .session-top {
	width: 100%;
	padding-bottom: 2px;
	margin-bottom: 2px;
	flex-wrap: wrap;
	align-items: center;
}
.x-pg-row-form-block #hook-gifts .option .opt_line .session-top {
	width: 100%;
	padding-bottom: 2px;
	margin-bottom: 2px;
	flex-wrap: wrap;
	align-items: center;
}
.x-pg-row-form-block #hook-offer-items .option .opt_line .session_name {
	display: flex;
	align-items: center;
	font-weight: normal;
	color: #3f4254;
	font-size: 13px;
	min-width: 0;
}
.x-pg-row-form-block #hook-gifts .option .opt_line .session_name {
	display: flex;
	align-items: center;
	font-weight: normal;
	color: #3f4254;
	font-size: 13px;
	min-width: 0;
}
.x-pg-row-form-block #hook-offer-items .option .opt_line .session_name span {
	font-size: 13px;
	font-weight: inherit;
	color: inherit;
	margin-bottom: 0;
}
.x-pg-row-form-block #hook-gifts .option .opt_line .session_name span {
	font-size: 13px;
	font-weight: inherit;
	color: inherit;
	margin-bottom: 0;
}
.x-pg-row-form-block #hook-offer-items input[type='radio']:checked + .option:not(.full) .session_name {
	font-weight: 600;
	color: #000 !important;
}
.x-pg-row-form-block #hook-gifts input[type='radio']:checked + .option:not(.full) .session_name {
	font-weight: 600;
	color: #000 !important;
}
.x-pg-row-form-block #hook-offer-items .option .opt_line .seesion_desc {
	margin-top: 2px;
	line-height: 1.4;
}
.x-pg-row-form-block #hook-gifts .option .opt_line .seesion_desc {
	margin-top: 2px;
	line-height: 1.4;
}
.x-pg-row-form-block #hook-offer-items .sim-radio {
	width: 20px;
	height: 20px;
	border: 1px solid #e3e3e3;
	border-radius: 50%;
	background-color: #fff;
	flex-shrink: 0;
}
.x-pg-row-form-block #hook-gifts .sim-radio {
	width: 20px;
	height: 20px;
	border: 1px solid #e3e3e3;
	border-radius: 50%;
	background-color: #fff;
	flex-shrink: 0;
}
.x-pg-row-form-block #hook-offer-items input:checked + .option:not(.full) .sim-radio {
	border: 4px solid #fff;
	background-color: var(--bs-primary, rgb(240, 118, 47));
	outline: 1px solid var(--bs-primary, rgb(240, 118, 47));
}
.x-pg-row-form-block #hook-gifts input:checked + .option:not(.full) .sim-radio {
	border: 4px solid #fff;
	background-color: var(--bs-primary, rgb(240, 118, 47));
	outline: 1px solid var(--bs-primary, rgb(240, 118, 47));
}
.x-pg-row-form-block #hook-offer-items .option.full,
.x-pg-row-form-block #hook-offer-items input[type='radio']:checked + .option.full {
	position: relative;
	background-color: rgba(238, 238, 238, 0.452);
	cursor: not-allowed;
	outline: 1px solid #ddd;
}
.x-pg-row-form-block #hook-gifts .option.full,
.x-pg-row-form-block #hook-gifts input[type='radio']:checked + .option.full {
	position: relative;
	background-color: rgba(238, 238, 238, 0.452);
	cursor: not-allowed;
	outline: 1px solid #ddd;
}
.x-pg-row-form-block #hook-offer-items .option.full:hover {
	background-color: rgba(238, 238, 238, 0.452);
	outline: 1px solid #ddd;
	cursor: not-allowed;
}
.x-pg-row-form-block #hook-gifts .option.full:hover {
	background-color: rgba(238, 238, 238, 0.452);
	outline: 1px solid #ddd;
	cursor: not-allowed;
}

/* 場次與門票區之間：虛線分隔（xlead 風格） */
.x-pg-row-form-block #hook-sessions .session.mb-5 + div.d-flex {
	border-top: 1px dashed #e3e3e3;
	padding-top: 16px;
	margin-top: 16px;
}

/* ----- 門票 (Ticket)：標題與幣別同一行、白底列、橘紅價、灰按鈕步進 ----- */
.x-pg-row-form-block #hook-sessions .d-flex.align-items-center.mb-3 {
	flex-wrap: nowrap;
}

.x-pg-row-form-block #hook-sessions .d-flex.mb-3 .fs-7.text-muted,
.x-pg-row-form-block #hook-sessions .d-flex.mb-3 span.text-muted {
	font-size: 0.8125rem;
	font-weight: 500;
	color: #374151;
	white-space: nowrap;
	flex-shrink: 0;
}

.x-pg-row-form-block #hook-sessions .d-flex.mb-3 .select.form-group {
	position: relative;
	width: auto;
	flex-shrink: 0;
}

.x-pg-row-form-block #hook-sessions .d-flex.mb-3 .select.form-group::before {
	content: '';
	position: absolute;
	left: 10px;
	top: 50%;
	transform: translateY(-50%);
	width: 16px;
	height: 16px;
	background-color: var(--bs-form-select-indicator-color, #7E8299);
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 16V4M7 4L3 8M7 4L11 8'/%3E%3Cpath d='M17 8v12M17 20l4-4M17 20l-4-4'/%3E%3C/svg%3E");
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 16V4M7 4L3 8M7 4L11 8'/%3E%3Cpath d='M17 8v12M17 20l4-4M17 20l-4-4'/%3E%3C/svg%3E");
	-webkit-mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	pointer-events: none;
}

.x-pg-row-form-block #hook-sessions .d-flex.mb-3 .form-select.form-select-sm {
	width: auto;
	min-width: 4.5em;
	padding-left: 2rem;
	border-radius: 8px;
	border: 1px solid var(--bs-form-select-border-color, #dee2e6);
	background-color: #fff;
	background-image: var(--bs-form-select-indicator);
	background-repeat: no-repeat;
	background-position: right 0.75rem center;
	background-size: 16px 12px;
	padding-right: 2rem;
	font-size: 0.8125rem;
	color: #374151;
	min-height: 32px;
	appearance: none;
}

/* 結構：.ticket-display > fieldset.session_choice.ticket.pc-only + fieldset.tabet_phone-only + div.mt-3.mb-5（總金額） */
.x-pg-row-form-block .ticket-display,
.ticket-display {
	width: 100%;
	box-sizing: border-box;
	border: none;
	background: transparent;
	padding: 0 !important;
	
	flex-direction: column;
	align-items: stretch;
	flex-wrap: nowrap;
}

.x-pg-row-form-block .ticket-display > .session_choice.ticket.pc-only,
.x-pg-row-form-block .ticket-display > fieldset:first-of-type {
	width: 100%;
	max-width: 100%;
}

.x-pg-row-form-block .ticket-display > .mt-3.mb-5.px-2.w-100,
.x-pg-row-form-block .ticket-display > div.mt-3.mb-5 {
	width: 100%;
	flex: 0 0 auto;
}
.ticket-display > .mt-3.mb-5.px-2.w-100{
	padding: 0 !important;
	margin-top: 16px !important;
	margin-bottom: 24px !important;
}
.quest>.form-group>div {
	margin-bottom: 6px;
}

/* 生日等日期選單：固定寬度、自訂下拉箭頭（深色可見） */
.x-pg-row-form-block .quest .form-select-sm.w-date,
.x-pg-row-form-block .quest select.form-select.w-date,
.x-pg-row-form-block .quest .form-group.select .form-select-sm.w-date,
.x-pg-row-form-block .quest .form-group.select select.w-date {
	width: auto !important;
	min-width: 80px;
	box-sizing: border-box;
	-webkit-appearance: none;
	appearance: none;
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%235E6278' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-position: right 0.5rem center;
	background-size: 14px 10px;
	padding-right: 1.75rem;
}
.x-pg-row-form-block .quest .d-flex.align-items-center.flex-wrap.gap-2 {
	align-items: flex-end;
}
.x-pg-row-form-block .quest .d-flex.align-items-center .pb-3 {
	margin-bottom: 0;
	font-size: 0.9375rem;
	color: #6b7280;
	line-height: 2.25;
}

.x-pg-row-form-block .session_choice.ticket.pc-only {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	gap: 1rem;
	align-items: stretch;
	width: 100%;
	border: none;
	margin: 0;
	padding: 0;
}

.x-pg-row-form-block .session_choice.ticket.pc-only .ticket-row {
	width: 100%;
	padding: 0 ;
	margin: 0;
}

.ticket-row {
	width: 100%;
	margin-bottom: 0;
	box-sizing: border-box;
}

/* 門票列：與 xlead 一致（outline 1px #e3e3e3、border-radius 6px、padding .35rem .5rem） */
.x-pg-row-form-block .session_choice.ticket .option {
	position: relative;
	margin: 0;
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
	padding: .35rem .5rem;
	outline: 1px solid #e3e3e3;
	border-radius: 6px;
	background: #fff;
	transition: background 0.15s ease, outline 0.15s ease;
}

.ticket-row .option > .flex-grow-1 {
	min-width: 0;
}

.x-pg-row-form-block .ticket-row .product_count {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: 0.5rem !important;
	min-width: 0;
	flex-shrink: 0;
}

.x-pg-row-form-block .ticket-row .option:hover {
	background-color: rgba(var(--bs-primary-rgb), 0.05);
}

.x-pg-row-form-block .ticket_name {
	display: flex;
	align-items: center;
}

.x-pg-row-form-block .ticket-row .ticket_name::before {
	content: '';
	display: inline-block;
	width: 20px;
	height: 20px;
	flex-shrink: 0;
	background-color: var(--bs-primary);
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2Z'%3E%3C/path%3E%3Cpath d='M13 5v2'%3E%3C/path%3E%3Cpath d='M13 17v2'%3E%3C/path%3E%3Cpath d='M13 11v2'%3E%3C/path%3E%3C/svg%3E");
	mask-size: contain;
	mask-repeat: no-repeat;
	mask-position: center;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2Z'%3E%3C/path%3E%3Cpath d='M13 5v2'%3E%3C/path%3E%3Cpath d='M13 17v2'%3E%3C/path%3E%3Cpath d='M13 11v2'%3E%3C/path%3E%3C/svg%3E");
	-webkit-mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	margin-right: 8px;
	vertical-align: middle;
}

.ticket_name span {
	font-size: 0.9375rem;
	font-weight: 600;
	text-transform: capitalize;
	letter-spacing: 0.02em;
	color: #111827;
}

.ticket_price .text-muted,
.ticket_price .fz12 {
	font-size: 0.75rem;
	color: #9ca3af;
}


.x-pg-row-form-block .option .ticket_price span {
	display: inline;
}

.x-pg-row-form-block .option .product_count span {
	font-size: inherit;
	color: inherit;
}

.x-pg-row-form-block .session_choice.ticket .option.selected {
	border-left: 15px solid var(--bs-primary);
	outline-offset: -1px;
}

/* 參考 xlead：若 ticket-row 內有 .sim-checkbox.checked，整列視為選取狀態 */
.x-pg-row-form-block .session_choice.ticket .ticket-row:has(.sim-checkbox.checked) .option,
.x-pg-row-form-block .session_choice .option.selected {
	border-left: 15px solid var(--bs-primary);
}

.x-pg-row-form-block .ticket_price span.text-danger {
	font-weight: 700;
	font-size: 1rem;
	color: var(--bs-primary, #F0762F);
}

/* 數量步進器：與 xlead 一致（2894-3014）三格獨立框 */
.x-pg-row-form-block .product_count .count,
.x-pg-row-form-block .count {
	display: flex;
	align-items: stretch;
	gap: 4px;
	border: none;
	background: transparent;
	padding: 0;
}

.x-pg-row-form-block .count .minus,
.x-pg-row-form-block .count .plus {
	background: #f2f2f2;
	border: 1px solid #ddd;
	border-radius: 4px;
	display: inline-flex;
	text-align: center;
	padding: 6px 1rem;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	font-weight: bold;
	color: #333;
	vertical-align: middle;
	transition: background 0.15s ease, border-radius 0.15s ease;
}

.x-pg-row-form-block .session_choice.ticket.pc-only .minus,
.x-pg-row-form-block .session_choice.ticket.pc-only .plus {
	width: 30px;
	padding: 0.25rem 0.5rem;
	line-height: 1;
	font-family: initial;
}

.x-pg-row-form-block .session_choice.ticket.pc-only .minus {
	line-height: 1.2;
}

.x-pg-row-form-block .count .minus:hover,
.x-pg-row-form-block .count .plus:hover {
	cursor: pointer;
	background-color: #f0f0f0;
	border-radius: 3px;
}

.x-pg-row-form-block .count .border {
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 4px !important;
	background: #fff;
	border: 1px solid #ddd !important;
	padding: 0 8px;
	min-width: 32px;
}

.x-pg-row-form-block .count .qty {
	text-align: center;
	font-variant-numeric: tabular-nums;
	font-weight: 600;
	font-size: 0.9375rem;
	color: #111827;
	min-width: 20px;
}

/* 總金額區：xlead 風格，主色橘 */
.x-pg-row-form-block .bg-light.rounded.p-3.d-flex {
	background: #F8F8F8 !important;
	border-radius: 10px !important;
	border: none;
	padding: 14px 16px !important;
}

.x-pg-row-form-block .bg-light.rounded.p-3.d-flex .text-muted.small {
	font-size: 0.75rem;
	color: #888;
}

.x-pg-row-form-block #subtotal {
	font-variant-numeric: tabular-nums;
	font-weight: 700;
	color: var(--bs-primary, #F0762F);
}

.x-pg-row-form-block #total-people {
	font-variant-numeric: tabular-nums;
	font-weight: 700;
	color: var(--bs-primary, #F0762F);
}

.x-pg-row-form-block .pc-only,
.x-pg-row-form-block .session_choice.ticket.pc-only {
	display: flex !important;
}

.x-pg-row-form-block .tabet_phone-only,
.x-pg-row-form-block .session_choice.ticket.tabet_phone-only {
	display: none !important;
}

/* 頁面模擬：依 .x-pg-preview-frame 的 .tablet / .mobile class 切換（與 viewport 無關） */
.x-pg-preview-frame.tablet .x-pg-row-form-block .pc-only,
.x-pg-preview-frame.tablet .x-pg-row-form-block .session_choice.ticket.pc-only,
.x-pg-preview-frame.mobile .x-pg-row-form-block .pc-only,
.x-pg-preview-frame.mobile .x-pg-row-form-block .session_choice.ticket.pc-only {
	display: none !important;
}
.x-pg-preview-frame.tablet .x-pg-row-form-block .tabet_phone-only,
.x-pg-preview-frame.tablet .x-pg-row-form-block .session_choice.ticket.tabet_phone-only,
.x-pg-preview-frame.mobile .x-pg-row-form-block .tabet_phone-only,
.x-pg-preview-frame.mobile .x-pg-row-form-block .session_choice.ticket.tabet_phone-only {
	display: flex !important;
	flex-direction: column;
	gap: 1rem;
	width: 100%;
}
.x-pg-preview-frame.tablet .x-pg-row-form-block .session_choice.ticket.tabet_phone-only .ticket-row,
.x-pg-preview-frame.mobile .x-pg-row-form-block .session_choice.ticket.tabet_phone-only .ticket-row {
	width: 100%;
	padding: 0 0.5rem;
}
.x-pg-preview-frame.tablet .x-pg-row-form-block .session_choice.ticket.tabet_phone-only .option,
.x-pg-preview-frame.mobile .x-pg-row-form-block .session_choice.ticket.tabet_phone-only .option {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 100%;
	box-sizing: border-box;
	padding: .35rem .5rem;
	outline: 1px solid #e3e3e3;
	border-radius: 6px;
	background: #fff;
}
.x-pg-preview-frame.tablet .x-pg-row-form-block .session_choice.ticket.tabet_phone-only .option:hover,
.x-pg-preview-frame.mobile .x-pg-row-form-block .session_choice.ticket.tabet_phone-only .option:hover {
	background-color: rgba(var(--bs-primary-rgb), 0.05);
}
.x-pg-preview-frame.tablet .x-pg-row-form-block .session_choice.ticket.tabet_phone-only .separator.separator-dashed,
.x-pg-preview-frame.mobile .x-pg-row-form-block .session_choice.ticket.tabet_phone-only .separator.separator-dashed {
	flex-basis: 100%;
	width: 100%;
	height: 0;
	margin: 0.25rem 0;
	border: none;
	border-top: 1px dashed #ddd;
}
.x-pg-preview-frame.tablet .x-pg-row-form-block .session_choice.ticket.tabet_phone-only .product_count,
.x-pg-preview-frame.mobile .x-pg-row-form-block .session_choice.ticket.tabet_phone-only .product_count {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
	width: 100%;
	min-width: 0;
}
.x-pg-preview-frame.tablet .x-pg-row-form-block .session_choice.ticket.tabet_phone-only .count .border,
.x-pg-preview-frame.mobile .x-pg-row-form-block .session_choice.ticket.tabet_phone-only .count .border {
	min-width: 40px;
}
.x-pg-preview-frame.tablet .x-pg-row-form-block #hook-sessions .session_choice .option div.opt_line,
.x-pg-preview-frame.mobile .x-pg-row-form-block #hook-sessions .session_choice .option div.opt_line {
	gap: 8px;
}

/* 切換為平板/手機版時不顯示「手機/平板版」提示 */
.x-pg-preview-frame.tablet .x-pg-row-form-block .form-block-preview-inner::before,
.x-pg-preview-frame.mobile .x-pg-row-form-block .form-block-preview-inner::before {
	content: none;
	display: none;
}

/* 與 xlead 一致：max-width 1024px 時也切換（真實窄螢幕 / 縮放視窗） */
@media screen and (max-width: 1024px) {
	.x-pg-row-form-block .pc-only,
	.x-pg-row-form-block .session_choice.ticket.pc-only {
		display: none !important;
	}
	.x-pg-row-form-block .tabet_phone-only,
	.x-pg-row-form-block .session_choice.ticket.tabet_phone-only {
		display: flex !important;
		flex-direction: column;
		gap: 1rem;
		width: 100%;
	}
	.x-pg-row-form-block .session_choice.ticket.tabet_phone-only .ticket-row {
		width: 100%;
		padding: 0 0.5rem;
	}
	.x-pg-row-form-block .session_choice.ticket.tabet_phone-only .option {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		width: 100%;
		box-sizing: border-box;
		padding: .35rem .5rem;
		outline: 1px solid #e3e3e3;
		border-radius: 6px;
		background: #fff;
	}
	.x-pg-row-form-block .session_choice.ticket.tabet_phone-only .option:hover {
		background-color: rgba(var(--bs-primary-rgb), 0.05);
	}
	.x-pg-row-form-block .session_choice.ticket.tabet_phone-only .separator.separator-dashed {
		flex-basis: 100%;
		width: 100%;
		height: 0;
		margin: 0.25rem 0;
		border: none;
		border-top: 1px dashed #ddd;
	}
	.x-pg-row-form-block .session_choice.ticket.tabet_phone-only .product_count {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
		gap: 0.5rem;
		width: 100%;
		min-width: 0;
	}
	.x-pg-row-form-block .session_choice.ticket.tabet_phone-only .count .border {
		min-width: 40px;
	}
}

@media (max-width: 576px) {
	.x-pg-row,
	.x-pg-row-form-block {
		padding-left: 0;
		padding-right: 0;
	}
	.x-pg-row-form-block .session_choice .option {
		padding: .75rem 1rem;
	}
	.x-pg-row-form-block .session_choice.ticket label {
		min-width: calc(50% - 1rem);
	}
	.x-pg-row-form-block .ticket-row .ticket_price {
		flex-direction: column;
		align-items: flex-start !important;
	}
	.x-pg-row-form-block .session_choice .option div.opt_line {
		flex-wrap: wrap;
		gap: 8px;
	}
	.x-pg-row-form-block .session_choice .option .opt_line div.session_time {
		width: 100%;
	}
}

@media (max-width: 393px) {
	.x-pg-row-form-block .session_choice .option div.opt_line {
		flex-wrap: wrap;
	}
	.x-pg-row-form-block .session_choice .option {
		padding: .5rem;
	}
}

/* ----- 表單欄位與題目樣式（方塊標準寬度・科技巨頭級 UI） ----- */
.x-pg-row-form-block .quest_list {
	margin-top: 40px;
	width: 100%;
	display: block;
}
.x-pg-row-form-block .quest_list:first-child {
	margin-top: 0;
}
.x-pg-row-form-block .quest {
	padding: 14px 0 18px;
	border-bottom: 1px dashed rgba(148, 163, 184, 0.35);
	width: 100%;
	display: block;
	box-sizing: border-box;
}

.x-pg-row-form-block .quest:last-child {
	border-bottom: none;
	padding-bottom: 0;
}
.x-pg-row-form-block .quest.attention {
	padding: .5rem;
	outline: 2px solid var(--bs-danger, #dc3545);
	border-radius: .625rem;
}

/* Badge 圓形共通（題號等） */
.x-pg-row-form-block .quest .badge-circle.badge,
.x-pg-row-form-block .quest > .badge-circle {
	height: fit-content;
	border-radius: 50%;
	font-weight: 600;
	font-size: 0.75rem;
	line-height: 1;
	width: 22px;
	height: 22px;
	flex-shrink: 0;
	padding: 0;
	min-width: unset;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.x-pg-row-form-block .quest .badge-circle.badge-light-dark.badge,
.x-pg-row-form-block .quest > .badge-circle.badge-light-dark {
	background-color: #e5e7eb;
	color: #374151;
}
.x-pg-row-form-block .quest .badge-circle.badge-dark.badge,
.x-pg-row-form-block .quest > .badge-circle.badge-dark,
.x-pg-row-form-block .badge-dark.badge-circle {
	background-color: #1f2937;
	color: #fff;
}
.x-pg-row-form-block .quest .badge-circle.badge-primary.badge,
.x-pg-row-form-block .quest > .badge-circle.badge-primary,
.x-pg-row-form-block .badge-primary.badge-circle {
	background-color: var(--bs-primary);
	color: #fff;
}
.x-pg-row-form-block .quest .badge-circle.badge-secondary.badge,
.x-pg-row-form-block .quest > .badge-circle.badge-secondary,
.x-pg-row-form-block .badge-secondary.badge-circle {
	background-color: #6b7280;
	color: #fff;
}
.x-pg-row-form-block .quest .badge-circle.badge-success.badge,
.x-pg-row-form-block .quest > .badge-circle.badge-success,
.x-pg-row-form-block .badge-success.badge-circle {
	background-color: #059669;
	color: #fff;
}
.x-pg-row-form-block .quest .badge-circle.badge-danger.badge,
.x-pg-row-form-block .quest > .badge-circle.badge-danger,
.x-pg-row-form-block .badge-danger.badge-circle {
	background-color: var(--bs-danger, #dc2626);
	color: #fff;
}
.x-pg-row-form-block .quest .badge-circle.badge-warning.badge,
.x-pg-row-form-block .quest > .badge-circle.badge-warning,
.x-pg-row-form-block .badge-warning.badge-circle {
	background-color: #d97706;
	color: #fff;
}
.x-pg-row-form-block .quest .badge-circle.badge-info.badge,
.x-pg-row-form-block .quest > .badge-circle.badge-info,
.x-pg-row-form-block .badge-info.badge-circle {
	background-color: #0284c7;
	color: #fff;
}
.x-pg-row-form-block .quest .badge-circle.badge-light.badge,
.x-pg-row-form-block .quest > .badge-circle.badge-light,
.x-pg-row-form-block .badge-light.badge-circle {
	background-color: #f3f4f6;
	color: #374151;
}
/* 一般 badge 顏色（非圓形） */
.x-pg-row-form-block .badge-dark {
	background-color: #1f2937;
	color: #fff;
	padding: .2em .5em;
}
.x-pg-row-form-block .badge-primary {
	background-color: var(--bs-primary);
	color: #fff;
}
.x-pg-row-form-block .badge-secondary {
	background-color: #6b7280;
	color: #fff;
}
.x-pg-row-form-block .badge-success {
	background-color: #059669;
	color: #fff;
}
.x-pg-row-form-block .badge-danger {
	background-color: var(--bs-danger, #dc2626);
	color: #fff;
}
.x-pg-row-form-block .badge-warning {
	background-color: #d97706;
	color: #fff;
}
.x-pg-row-form-block .badge-info {
	background-color: #0284c7;
	color: #fff;
}
.x-pg-row-form-block .badge-light {
	background-color: #f3f4f6;
	color: #374151;
}
.x-pg-row-form-block .badge-light-dark {
	background-color: #e5e7eb;
	color: #374151;
}

/* 題目標題：深灰粗體，必填星號 */
.x-pg-row-form-block .quest .fw-bolder.fs-5 {
	font-size: 0.9375rem;
	font-weight: 700;
	letter-spacing: 0.01em;
	color: #374151;
	margin-bottom: 6px;
	line-height: 1.4;
	display: inline-flex;
}

.x-pg-row-form-block .form-group.required .fw-bolder.fs-5::after {
	content: ' *';
	color: #dc2626;
	font-weight: 700;
	margin-left: 2px;
}

.x-pg-row-form-block .quest .xt_area {
	color: #6b7280;
	font-size: 0.8125rem;
	line-height: 1.4;
}

/* xt_area：與 xlead 一致（11058-11132、1804、3940、3945、4518、7015） */
.x-pg-row-form-block .xt_area {
	width: 100%;
}
.x-pg-row-form-block .form_box .xt_area,
.x-pg-row-form-block .merge-form .xt_area {
	border-radius: 8px;
	margin-bottom: .75rem;
}
.x-pg-row-form-block .merge-form span.xt_area {
	margin-bottom: 0;
}
.x-pg-row-form-block .xt_area.te-plain {
	padding: 0;
	margin-bottom: .75rem;
	background-color: transparent;
}
.x-pg-row-form-block .xt_area.te-title {
	background-color: #eeeeee;
	padding: .5rem 1rem;
	position: relative;
	font-weight: 600;
	color: #5d5b5b;
	font-size: 1.1rem;
}
.x-pg-row-form-block .xt_area.te-title::before {
	content: '';
	height: 12px;
	width: 4px;
	display: inline-block;
	background-color: #bbb;
	border-radius: 8px;
	position: absolute;
	left: 6px;
	top: 50%;
	transform: translateY(-50%);
}
.x-pg-row-form-block .xt_area.te-quote {
	display: flex;
	align-items: center;
	gap: 1rem;
	background-color: transparent;
	border-bottom: 1px solid #e5e7eb;
	border-radius: 0px;
	position: static;
	height: initial;
	padding: 1rem 1.25rem;
	color: #5d5b5b;
}
.x-pg-row-form-block .xt_area.te-quote::before {
	content: "";
	flex: 0 0 auto;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background-color: #cbd5e1;
	background-image: url('https://xleadfunnel.oss-cn-hongkong.aliyuncs.com/dev/panel/img/catalog/member/bxs-quote-left.svg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 20px 20px;
}
.x-pg-row-form-block .form_box .xt_area.te-box,
.x-pg-row-form-block .merge-form .xt_area.te-box {
	background-color: transparent;
	border: 1px solid #e3e3e3;
	padding: 1.25rem;
}

/* ----- .guide 相關（from xlead） ----- */
.x-pg-row-form-block p.guide {
	width: 100%;
	
	padding: 8px 12px;
	background-color: #e8eef4;
	color: #334155;
	font-weight: 700;
	border-radius: 6px;
	margin-bottom: .5rem;
	display: flex;
	gap: 1rem;
	align-items: center;
}
.x-pg-row-form-block span.guide {
	font-size: 14px;
	text-align: left;
}
.x-pg-row-form-block .merge-form .guide,
.x-pg-row-form-block .form-box .guide {
	border-bottom: 2px dashed #cbd5e1;
	border-radius: 0;
	background-color: transparent;
	color: #1e293b;
	z-index: 2;
	position: relative;
	font-size: 1.35rem;
	font-weight: 700;
	padding: 6px 12px 10px 20px;
	margin-bottom: 1rem;
}
.x-pg-row-form-block .merge-form .guide::before,
.x-pg-row-form-block .form-box .guide::before {
	content: "";
	position: absolute;
	left: 4px;
	top: 50%;
	transform: translateY(-50%);
	width: 8px;
	height: 1.1em;
	background-color: #334155;
	border-radius: 999px;
}
.x-pg-row-form-block p.guide + .section_desc {
	margin-top: -2.5rem;
	margin-bottom: .75rem;
	padding: 2rem 1rem .5rem;
	background-color: transparent;
}

.x-pg-row-form-block .te-title ~ .quest,
.x-pg-row-form-block p.guide + .xt_area.section_desc ~ .quest,
.x-pg-row-form-block p.guide ~ .quest {
	margin-left: 8px;
}
.x-pg-row-form-block .required .xt_area p::after,
.x-pg-row-form-block .required label .xt_area p::after {
	content: none;
}
.x-pg-row-form-block .info_box .xt_area span {
	font-size: inherit;
	color: initial;
}
.x-pg-row-form-block .xt_area.form-check-label span,
.x-pg-row-form-block .xt_area.form-check-label {
	margin-bottom: 0 !important;
}
.x-pg-row-form-block .checkbox .xt_area span {
	display: inline;
}
.x-pg-row-form-block .info.desc .context.xt_area span {
	width: 100%;
	margin-right: 0;
	font-size: inherit;
	color: inherit;
}

.x-pg-row-form-block .form-group {
	width: 100%;
	display: block;
	box-sizing: border-box;
}

/* 手機欄：國碼＋輸入一體化 */
.x-pg-row-form-block .form-group .input-group {
	width: 100%;
	display: flex;

	box-sizing: border-box;
	border-radius: 10px;
	border: 1px solid #e5e7eb;
	background: #fff;
	overflow: hidden;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.x-pg-row-form-block .form-group .input-group:focus-within {
	border-color: var(--bs-primary);
	box-shadow: 0 0 0 3px rgba(var(--bs-primary-rgb), 0.12);
}

/* 國碼選擇器：自訂成「數值＋小箭頭」單行框（非原生 select 外觀） */
.x-pg-row-form-block .form-group .input-group .form-select,
.x-pg-row-form-block .form-group .input-group select.form-select,
.x-pg-row-form-block .form-group .input-group #country-code {
	flex: 0 0 auto;
	min-width: 5rem;
	border: none;
	border-right: 1px solid #e5e7eb;
	border-radius: 0;
	padding: 10px 32px 10px 12px;
	font-size: 0.9375rem;
	color: var(--bs-form-select-color, #5E6278);
	background: var(--bs-input-group-addon-bg, #f5f8fa) url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%237E8299'%3e%3cpath d='m2 5 6 6 6-6'/%3e%3c/svg%3e") no-repeat right 10px center;
	background-size: 12px;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
}
.x-pg-row-form-block .form-group .input-group #country-code {
	flex: 0 1 100px;
	background-color: #fff;
	
}
.x-pg-row-form-block .form-group .input-group #country-code+input.form-control {
	border-left:1px solid #e5e7eb !important;
	min-width: 0%;
	width: 1%;
}
.x-pg-row-form-block .form-group .input-group #country-code+input.form-control~.invalid-feedback{
	margin-top: 0;
}
.x-pg-row-form-block .form-group .input-group .form-select:focus,
.x-pg-row-form-block .form-group .input-group select.form-select:focus {
	outline: none;
}

.x-pg-row-form-block .form-group .input-group .form-control {
	flex: 1 1 auto;
	min-width: 0;
	border: none;
	border-radius: 0;
	padding: 10px 12px;
	font-size: 0.9375rem;
	color: #111827;
	background: #fff;
	position: relative;
}

.x-pg-row-form-block .form-group .input-group .form-control::placeholder {
	color: #9ca3af;
}
.x-pg-event-intro-meta-row p{
	margin-bottom: 0;
	font-size: 0.9375rem;
	color: var(--x-pg-row-text, var(--x-pg-text, #1e293b));
}


/* 手機：國碼＋電話 input-group（依 xlead .phone / .manual 複製） */
@media screen and (max-width: 576px) {
	.x-pg-row-form-block .form-group .input-group {
		display: flex;
		flex-wrap: wrap;
	}
	.x-pg-row-form-block .form-group .input-group .form-select,
	.x-pg-row-form-block .form-group .input-group select.form-select,
	.x-pg-row-form-block .form-group .input-group #country-code {
		width: 30%;
		min-width: 5rem;
		border-top-right-radius: 0;
		border-bottom-right-radius: 0;
		border-right: 1px solid transparent;
		box-shadow: var(--bs-form-select-box-shadow);
	}
	.x-pg-row-form-block .form-group .input-group .form-select:focus,
	.x-pg-row-form-block .form-group .input-group select.form-select:focus {
		border-right: 1px solid #5E6278;
	}
	.x-pg-row-form-block .form-group .input-group .form-select:focus ~ .form-control,
	.x-pg-row-form-block .form-group .input-group select.form-select:focus ~ .form-control {
		border-left: 0;
	}
	.x-pg-row-form-block .form-group .input-group .form-control,
	.x-pg-row-form-block .form-group .input-group #mobile {
		width: 70%;
		border-top-left-radius: 0;
		border-bottom-left-radius: 0;
	}
}
.x-pg-preview-frame.mobile .x-pg-row-form-block .form-group .input-group {
	display: flex;
	flex-wrap: wrap;
}
.x-pg-preview-frame.mobile .x-pg-row-form-block .form-group .input-group .form-select,
.x-pg-preview-frame.mobile .x-pg-row-form-block .form-group .input-group select.form-select {
	width: 30%;
	min-width: 5rem;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	border-right: 1px solid transparent;
}
.x-pg-preview-frame.mobile .x-pg-row-form-block .form-group .input-group .form-control {
	width: 70%;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}
/* FormValidation 手機：避免 icon 容器破壞版面（依 xlead .reset-fv-mobile） */
.x-pg-row-form-block .form-group.input-group.fv-plugins-icon-container,
.x-pg-row-form-block .form-group.has-validation.fv-plugins-icon-container {
	position: relative;
}
@media screen and (max-width: 576px) {
	.x-pg-row-form-block .form-group.input-group.fv-plugins-icon-container .fv-plugins-message-container,
	.x-pg-row-form-block .form-group.has-validation.fv-plugins-icon-container .fv-plugins-message-container {
		position: absolute;
		left: 0;
	}
}
/* FormValidation：reset-fv-mobile（來自 xlead） */
.reset-fv-mobile.fv-plugins-icon-container {
	position: static;
}
.reset-fv-mobile.fv-plugins-icon-container .fv-plugins-message-container {
	position: absolute;
	left: 0;
}
/* FormValidation：下一步前靜音 notEmpty、只顯示 callback（來自 xlead） */
#form-inputs.quiet-mode .fv-plugins-message-container [data-validator="notEmpty"] {
	display: none !important;
}
#form-inputs .fv-plugins-message-container [data-validator="callback"] {
	display: block;
}

/* 一般輸入框：簡潔邊框・圓角・充足內距 */
.x-pg-row-form-block .form-group input.form-control,
.x-pg-row-form-block .form-group input.form-control-sm,
.x-pg-row-form-block .form-group select.form-select {
	width: 100%;
	display: block;
	box-sizing: border-box;
	border-radius: 10px;
	border: 1px solid #e5e7eb;
	padding: 10px 12px;
	font-size: 0.9375rem;
	color: #111827;
	background: #fff;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

/* 一般 select 下拉箭頭（與日期選單同款） */
.x-pg-row-form-block .form-group select.form-select {
	-webkit-appearance: none;
	appearance: none;
	background-color: #fff;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%235E6278' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-position: right 0.6rem center;
	background-size: 14px 10px;
	padding-right: 2.25rem;
}

.x-pg-row-form-block .form-group input.form-control::placeholder,
.x-pg-row-form-block .form-group input.form-control-sm::placeholder {
	color: #9ca3af;
}

.x-pg-row-form-block .form-group input.form-control:focus,
.x-pg-row-form-block .form-group input.form-control-sm:focus,
.x-pg-row-form-block .form-group select.form-select:focus {
	outline: none;
	border-color: var(--bs-primary);
	box-shadow: 0 0 0 3px rgba(var(--bs-primary-rgb), 0.12);
}

/* react-datepicker：與表單欄位同款（科技巨頭級） */
.x-pg-row-form-block .react-datepicker-wrapper {
	width: 100%;
	display: block;
}
.x-pg-row-form-block .react-datepicker__input-container.react-datepicker__view-calendar-icon {
	display: flex;
	align-items: center;
	width: 100%;
	box-sizing: border-box;
	border: 1px solid #e5e7eb;
	border-radius: 10px;
	background: #fff;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.x-pg-row-form-block .react-datepicker__input-container.react-datepicker__view-calendar-icon:focus-within {
	outline: none;
	border-color: var(--bs-primary);
	box-shadow: 0 0 0 3px rgba(var(--bs-primary-rgb), 0.12);
}
.x-pg-row-form-block .react-datepicker__input-container .react-datepicker__calendar-icon {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	margin-left: 12px;
	color: #5E6278;
	pointer-events: none;
}
.x-pg-row-form-block .react-datepicker__input-container input.form-control,
.x-pg-row-form-block .react-datepicker__input-container input.form-control-sm {
	flex: 1;
	min-width: 0;
	border: none !important;
	background: transparent !important;
	padding: 10px 12px !important;
	font-size: 0.9375rem !important;
	color: #111827 !important;
	box-shadow: none !important;
}
.x-pg-row-form-block .react-datepicker__input-container input.form-control::placeholder,
.x-pg-row-form-block .react-datepicker__input-container input.form-control-sm::placeholder {
	color: #9ca3af;
}

.x-pg-row-form-block .form_box {
	width: 100%;
	box-sizing: border-box;
	background-color: #f5f8fa;
    padding: 1rem ;
    border-radius: 12px;
    font-size: 1rem;
    position: relative;
}

/* RWD：窄螢幕收窄容器左右內距（含編輯器手機/平板模擬） */
@media screen and (max-width: 1024px) {
	.x-pg-row-form-block .form_box {
		padding-left: .5rem;
		padding-right: .5rem;
	}
	.form-block-preview-inner,
	#reg-form {
		padding: .5rem;
	}
}
.x-pg-preview-frame.tablet .x-pg-row-form-block .form_box,
.x-pg-preview-frame.mobile .x-pg-row-form-block .form_box {
	padding-left: .5rem;
	padding-right: .5rem;
}
.x-pg-preview-frame.tablet .form-block-preview-inner,
.x-pg-preview-frame.mobile .form-block-preview-inner,
.x-pg-preview-frame.tablet #reg-form,
.x-pg-preview-frame.mobile #reg-form {
	padding: .5rem;
}

/* 單選題：每選項獨立白底・虛線框・圓角 */
.x-pg-row-form-block .label_box.label-full {
	margin-top: 8px;
	border: none;
	border-radius: 0;
	padding: 0;
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 8px;
	box-sizing: border-box;
	background: transparent;
}
.x-pg-row-form-block .label_box.label-full label {
	width: 100%;
}

/* label-50：兩欄並排（from xlead） */
.x-pg-row-form-block .label_box.label-50 {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 8px;
}
.x-pg-row-form-block .label_box.label-50 label {
	width: calc(50% - 4px);
}
.x-pg-row-form-block .booking-select .label_box.label-50 label,
.x-pg-row-form-block .select-list.label_box.label-50 li,
.x-pg-row-form-block .selected-list.label_box.label-50 li {
	width: calc(50% - 8px);
}
.x-pg-row-form-block .select-list.label_box.label-50 li label,
.x-pg-row-form-block .selected-list.label_box.label-50 li label {
	width: 100%;
}

.x-pg-row-form-block .label_box .form-check-label {
	width: 100%;
	cursor: pointer;
	display: block;
	
	padding: 12px 14px;
	outline: 1px dashed #d1d5db;
	outline-offset: -1px;
	border: none;
	border-radius: 10px;
	background: #fff;
	transition: outline-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

.x-pg-row-form-block .label_box .form-check-label:last-child {
	margin-bottom: 0;
}

.x-pg-row-form-block .label_box .form-check-label:hover {
	background-color: rgba(var(--bs-primary-rgb), 0.3);
	outline: 1px solid var(--bs-primary);
	outline-offset: -1px;
}

.x-pg-row-form-block .label_box input.form-check-input:checked + label.form-check-label {
	outline: 1px solid var(--bs-primary);
	outline-offset: -1px;
	background: var(--bs-primary-light);
}

.x-pg-row-form-block .booking-select .label_box label[for^="booking-cat-"],
.x-pg-row-form-block .label_box label[for^="booking-cat-"] {
	--x-booking-option-accent: var(--x-pg-booking-accent, var(--bs-primary, #F0762F));
	--x-booking-option-accent-rgb: var(--x-pg-booking-accent-rgb, var(--bs-primary-rgb, 240, 118, 47));
	--x-booking-option-accent-soft: var(--x-pg-booking-accent-soft, color-mix(in srgb, var(--x-booking-option-accent) 10%, #ffffff));
}

.x-pg-row-form-block .booking-select .label_box label[for^="booking-cat-"]:hover,
.x-pg-row-form-block .label_box label[for^="booking-cat-"]:hover {
	background-color: rgba(var(--x-booking-option-accent-rgb), 0.1);
	background: var(--x-booking-option-accent-soft);
	outline-color: var(--x-booking-option-accent);
}

.x-pg-row-form-block .booking-select .label_box input[type="radio"]:checked + label[for^="booking-cat-"],
.x-pg-row-form-block .label_box input[type="radio"]:checked + label[for^="booking-cat-"] {
	outline-color: var(--x-booking-option-accent);
	background-color: rgba(var(--x-booking-option-accent-rgb), 0.1);
	background: var(--x-booking-option-accent-soft);
	font-weight: 700;
}

.x-pg-row-form-block .booking-select .label_box input[type="radio"]:checked + label[for^="booking-cat-"] .x-radio,
.x-pg-row-form-block .label_box input[type="radio"]:checked + label[for^="booking-cat-"] .x-radio {
	border-color: var(--x-booking-option-accent);
}

.x-pg-row-form-block .booking-select .label_box input[type="radio"]:checked + label[for^="booking-cat-"] .x-radio::before,
.x-pg-row-form-block .label_box input[type="radio"]:checked + label[for^="booking-cat-"] .x-radio::before {
	background-color: var(--x-booking-option-accent);
}

/* 「其他」選項 (id 結尾 -other)：來自 xlead.css */
.x-pg-row-form-block input:checked[id$="-other"] {
	margin-top: 8px !important;
}
.x-pg-row-form-block .label_box [id$="-other"]+.form-check-label .ans,
.x-pg-row-form-block .label_box [id$="-other"]:checked+label .ans,
.x-pg-row-form-block label[for="option-other"]>.opt .ans {
	flex-grow: 1;
	line-height: 1;
}
.x-pg-row-form-block label[for="option-other"]>.opt {
	align-items: start;
}
.x-pg-row-form-block [id$="-other"].has-other+.form-check-label {
	display: flex;
	gap: 4px;
	align-items: center;
	flex-wrap: wrap;
}
.x-pg-row-form-block .label_box [id$="-other"]:checked+.form-check-label input,
.x-pg-row-form-block .label_box [id$="-other"]:checked+label input {
	display: block;
}
.x-pg-row-form-block [id$="-other"].has-other+.form-check-label .other-option-div .form-control,
.x-pg-row-form-block .label_box [id$="-other"]:checked+.form-check-label input,
.x-pg-row-form-block .label_box [id$="-other"]:checked+label input {
	border: 0px !important;
	border-bottom: 1px solid var(--bs-gray-500) !important;
	margin-bottom: 0 !important;
	background-color: initial;
	border-radius: 0;
	padding: 2px;
}
.x-pg-row-form-block .other-option-div {
	flex-grow: 1;
}
.x-pg-row-form-block .other-option-div .fv-plugins-message-container {
	position: absolute;
}

/* 下拉勾選 (.r_nolink)：點我選擇用主題色、下方 label_box 有內容時上方留白 */
.x-pg-row-form-block .r_nolink > .d-flex.border-bottom-dashed.pb-3 > p.mb-0.d-flex {
	color: var(--bs-primary);
}
.x-pg-row-form-block .r_nolink > .d-flex.border-bottom-dashed.pb-3 > p.mb-0.d-flex:hover {
	opacity: 0.9;
}
.x-pg-row-form-block .r_nolink > .label_box.label-modal:not(:empty) {
	margin-top: 0.75rem;
}

.modal-dialog-scrollable .modal-body {
	overflow-y: auto;
	max-height: calc(100vh - 210px);
}

/* quest-drop-modal：z-index 高於 x-pg-main-nav (1050) */
.quest-drop-modal {
	z-index: 9999 !important;
	position: fixed;
}

/* 純 CSS：modal 打開時把「裝著 modal 的區塊」整塊提到 nav 上面（:has 偵測 #cb-modal.show） */
body:has(.quest-drop-modal.show) .x-pg-layout-container {
	z-index: 10000 !important;
	position: relative;
}

.quest-drop-modal::before {
	content: '';
	z-index: -1;
	position: fixed;
	left: 0;
	top: 0;
	width: 100vw;
	height: 100vh;
	background-color: #000;
	opacity: 0.5;
	transition: opacity 0.15s linear;
}

/* Dropzone 上傳區：巨頭風格・虛線框・主題色・細陰影 */
.x-pg-row-form-block .dropzone {
	border: 2px dashed var(--bs-form-select-border-color, #e5e7eb);
	border-radius: 14px;
	padding: 2rem 1.5rem;
	text-align: center;
	background: linear-gradient(180deg, #fafbfc 0%, #f5f6f8 100%);
	cursor: pointer;
	transition: border-color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease;
	min-height: 160px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}
.x-pg-row-form-block .dropzone:hover {
	border-color: rgba(var(--bs-primary-rgb), 0.5);
	background: linear-gradient(180deg, rgba(var(--bs-primary-rgb), 0.06) 0%, rgba(var(--bs-primary-rgb), 0.02) 100%);
	box-shadow: 0 0 0 1px rgba(var(--bs-primary-rgb), 0.12), 0 2px 8px rgba(0, 0, 0, 0.06);
}
.x-pg-row-form-block .dropzone.dragover {
	border-color: var(--bs-primary);
	border-style: solid;
	background: rgba(var(--bs-primary-rgb), 0.08);
	box-shadow: 0 0 0 2px rgba(var(--bs-primary-rgb), 0.2), 0 4px 12px rgba(0, 0, 0, 0.08);
	transform: scale(1.005);
}
.x-pg-row-form-block .dropzone.has-preview {
	position: relative;
	padding: 1rem;
	min-height: 0;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}
.x-pg-row-form-block .dropzone .dropzone-preview-wrap {
	display: inline-block;
	width: 100%;
	max-width: 120px !important;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	transition: box-shadow 0.2s ease;
}
.x-pg-row-form-block .dropzone .dropzone-preview-wrap img {
	display: block;
	width: 100%;
	max-width: 120px !important;
	height: auto;
}
.x-pg-row-form-block .dropzone .dropzone-preview-wrap:hover {
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
}
.x-pg-row-form-block .dropzone .dropzone-delete-btn {
	position: absolute;
	top: 8px;
	right: 8px;
	z-index: 1;
	width: 28px;
	height: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	color: inherit;
	border: none;
	border-radius: 50%;
	cursor: pointer;
	opacity: 0.9;
	transition: background 0.2s ease, opacity 0.2s ease, transform 0.2s ease;
}
.x-pg-row-form-block .dropzone .dropzone-delete-btn:hover {
	background: #fff;
	opacity: 1;
	transform: scale(1.08);
}
.x-pg-row-form-block .dropzone .dz-message {
	flex-wrap: nowrap;
	word-break: break-word;
	gap: 0.75rem;
	justify-content: flex-start;
	align-items: center;
	display: flex;
}
.x-pg-row-form-block .dropzone .dz-message-text {
	min-width: 0;
	flex: 1 1 auto;
	color: #64748b;
	font-size: 0.9375rem;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: 0.01em;
}
.x-pg-row-form-block .dropzone .dz-message i,
.x-pg-row-form-block .dropzone .dz-message .bi {
	font-size: 1.75rem;
	color: #94a3b8;
	opacity: 0.9;
}
.x-pg-row-form-block .dropzone:hover .dz-message i,
.x-pg-row-form-block .dropzone:hover .dz-message .bi,
.x-pg-row-form-block .dropzone.dragover .dz-message i,
.x-pg-row-form-block .dropzone.dragover .dz-message .bi {
	color: var(--bs-primary);
	opacity: 1;
}

.x-pg-row-form-block .label_box .opt {
	align-items: center;
	gap: 12px;
}

.x-pg-row-form-block .label_box .x-radio {
	width: 18px;
	height: 18px;
	border-radius: 999px;
	border: 2px solid #d1d5db;
	background: #fff;
	flex-shrink: 0;
	position: relative;
	transition: border-color 0.2s ease, background 0.2s ease;
	pointer-events: none;
}

.x-pg-row-form-block .label_box input.form-check-input {
	position: absolute;
	opacity: 0;
}

.x-pg-row-form-block .label_box input.form-check-input:checked + label .x-radio {
	border-color: var(--bs-primary);
	background: #fff;
}

.x-pg-row-form-block .label_box .ans p {
	color: #111827;
	font-size: 0.9375rem;
	font-weight: 500;
	margin: 0;
	line-height: 1.4;
}

.x-pg-row-form-block .form-group .invalid-feedback {
	font-size: 0.8125rem;
	margin-top: 6px;
	color: #dc2626;
	display: block;
}

.x-pg-row-form-block .form-group input.mb-3,
.x-pg-row-form-block .form-group input.form-control-sm.mb-3 {
	margin-bottom: 0.75rem;
}

.x-pg-row-form-block .invalid-feedback {
	font-size: 0.8125rem;
	margin-top: 6px;
	color: #dc2626;
}

/* ----- 投票分類列表 ----- */
.x-pg-row-form-block.votepage .vote_step {
	--vote-border: #e2e8f0;
	--vote-ink: #111827;
	--vote-muted: #64748b;
	--vote-accent: var(--x-pg-vote-accent, var(--bs-primary, #f97316));
	--vote-accent-soft: color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #f97316)) 8%, #ffffff);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0 0 12px;
	padding: 0;
	background: transparent;
}

.x-pg-row-form-block.votepage .vote_step > .d-inline-block {
	flex: 0 1 auto;
	max-width: 100%;
	margin-right: 0 !important;
}

.x-pg-row-form-block.votepage .vote_step .cat-btn {
	position: relative;
	display: flex;
	align-items: center;
	width: auto;
	min-width: 138px;
	max-width: 260px;
	min-height: 44px;
	padding: 7px 10px 7px 12px;
	border: 1px solid var(--vote-border);
	border-radius: 6px;
	background: #ffffff;
	color: var(--vote-ink);
	text-align: left;
	box-shadow: none;
	overflow: hidden;
	transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}

.x-pg-row-form-block.votepage .vote_step .cat-btn::before {
	content: "";
	position: absolute;
	inset: 8px auto 8px 0;
	width: 3px;
	border-radius: 0 6px 6px 0;
	background: #cbd5e1;
}

.x-pg-row-form-block.votepage .vote_step .cat-btn:hover,
.x-pg-row-form-block.votepage .vote_step .cat-btn:focus {
	border-color: var(--x-pg-vote-accent, var(--bs-primary, #fdba74));
	background: #ffffff;
	box-shadow: 0 6px 14px rgba(15, 23, 42, 0.08);
	transform: translateY(-1px);
}

.x-pg-row-form-block.votepage .vote_step .cat-btn > .w-100 {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 10px;
	min-width: 0;
}

.x-pg-row-form-block.votepage .vote_step .cat-btn .text-start,
.x-pg-row-form-block.votepage .vote_step .cat-btn .text-center {
	min-width: 0;
	text-align: left !important;
}

.x-pg-row-form-block.votepage .vote_step .cat-btn .text-start {
	flex: 1 1 auto;
}

.x-pg-row-form-block.votepage .vote_step .cat-btn .text-center {
	flex: 0 0 auto;
}

.x-pg-row-form-block.votepage .vote_step .cat-btn .fw-bolder {
	display: flex;
	align-items: center;
	gap: 7px;
	color: inherit;
	font-size: 0.9375rem;
	font-weight: 700 !important;
	line-height: 1.25;
	letter-spacing: 0;
	white-space: normal;
}

.x-pg-row-form-block.votepage .vote_step .badge-circle {
	display: inline-grid;
	place-items: center;
	flex: 0 0 auto;
	width: 24px;
	height: 24px;
	padding: 0;
	border: 1px solid color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #f97316)) 30%, #ffffff);
	border-radius: 999px;
	background: var(--vote-accent-soft) !important;
	color: var(--x-pg-vote-accent, var(--bs-primary, #c2410c)) !important;
	font-size: 0.8125rem;
	font-weight: 700;
}

.x-pg-row-form-block.votepage .vote_step .vote_state {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: fit-content;
	max-width: 100%;
	min-height: 22px;
	padding: 3px 8px;
	border: 1px solid #e2e8f0;
	border-radius: 999px;
	background: #ffffff !important;
	color: var(--vote-muted) !important;
	font-size: 0.75rem;
	font-weight: 600;
	line-height: 1.2;
	white-space: normal;
}

.x-pg-row-form-block.votepage .vote_step .cat-btn.btn-vote {
	border-color: var(--x-pg-vote-accent, var(--bs-primary, #0f172a));
	background: var(--x-pg-vote-accent, var(--bs-primary, #0f172a));
	color: #ffffff;
	box-shadow: none;
}

.x-pg-row-form-block.votepage .vote_step .cat-btn.btn-vote::before {
	background: var(--vote-accent);
}

.x-pg-row-form-block.votepage .vote_step .cat-btn.btn-vote .badge-circle {
	border-color: rgba(255, 255, 255, 0.28);
	background: #ffffff !important;
	color: #0f172a !important;
}

.x-pg-row-form-block.votepage .vote_step .cat-btn.btn-vote .vote_state {
	border-color: rgba(255, 255, 255, 0.24);
	background: rgba(255, 255, 255, 0.14) !important;
	color: #ffffff !important;
}

.x-pg-row-form-block.votepage .vote_step .cat-btn.btn-outline-a {
	background: #ffffff;
}

.x-pg-row-form-block.votepage .vote_step .cat-btn.btn-outline-a::before {
	background: color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #fdba74)) 55%, #ffffff);
	opacity: 0.75;
}

/* ----- 投票項目列表 ----- */
.x-pg-row-form-block.votepage #vote-choice-div {
	--vote-border: #e2e8f0;
	--vote-ink: #111827;
	--vote-muted: #64748b;
	--vote-accent: var(--x-pg-vote-accent, var(--bs-primary, #f97316));
	--vote-accent-soft: color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #f97316)) 8%, #ffffff);
	--vote-success: color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #15803d)) 75%, #000000);
	--vote-card-title-lines: 2;
	--vote-card-desc-lines: 3;
	margin-top: 24px;
	padding: 20px;
	border: 1px solid var(--vote-border);
	border-radius: 8px;
	background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
	box-shadow: 0 16px 38px rgba(15, 23, 42, 0.08);
}

.x-pg-row-form-block.votepage #vote-choice-div .title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin: 0 0 18px;
	color: var(--vote-ink);
	font-size: 1.25rem;
	font-weight: 800;
	line-height: 1.35;
	letter-spacing: 0;
}

.x-pg-row-form-block.votepage #vote-choice-div .title > span {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	flex: 0 0 auto;
	max-width: 62%;
	padding: 7px 12px;
	border: 1px solid color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #f97316)) 30%, #ffffff);
	border-radius: 999px;
	background: var(--vote-accent-soft);
	color: var(--x-pg-vote-accent, var(--bs-primary, #c2410c));
	font-size: 0.875rem;
	font-weight: 700;
	line-height: 1.2;
	white-space: normal;
}

.x-pg-row-form-block.votepage #vote-choice-div .cur-cat-seq-display {
	display: inline-grid;
	place-items: center;
	min-width: 22px;
	height: 22px;
	padding: 0 6px;
	border-radius: 999px;
	background: var(--vote-accent);
	color: #ffffff;
	font-size: 0.8125rem;
}

.x-pg-row-form-block.votepage #vote-choice-div #items-div {
	row-gap: 18px;
}

.x-pg-row-form-block.votepage #vote-choice-div #items-div > .col {
	display: flex;
}

.x-pg-row-form-block.votepage #vote-choice-div .card {
	width: 100%;
	border: 1px solid var(--vote-border);
	border-radius: 8px;
	overflow: hidden;
	background: #ffffff;
	box-shadow: 0 8px 22px rgba(15, 23, 42, 0.07);
	transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.x-pg-row-form-block.votepage #vote-choice-div .card:hover {
	transform: translateY(-2px);
	border-color: var(--x-pg-vote-accent, var(--bs-primary, #fdba74));
	box-shadow: 0 16px 32px rgba(15, 23, 42, 0.11);
}

.x-pg-row-form-block.votepage #vote-choice-div .num {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 7px 14px 6px;
	color: var(--vote-muted);
	font-size: 0.78rem;
	font-weight: 700;
}

.x-pg-row-form-block.votepage #vote-choice-div .num span:last-child {
	color: var(--vote-ink);
	font-size: 0.9rem;
}

.x-pg-row-form-block.votepage #vote-choice-div .num .bullet {
	width: 4px;
	height: 18px;
	border-radius: 999px;
}

.x-pg-row-form-block.votepage #vote-choice-div .bg-primary {
	min-height: 30px;
	background: #0f172a !important;
	color: #ffffff;
	font-weight: 600;
}

.x-pg-row-form-block.votepage #vote-choice-div .bg-primary i,
.x-pg-row-form-block.votepage #vote-choice-div .bg-primary .bi,
.x-pg-row-form-block.votepage #vote-choice-div .bg-primary svg {
	color: #fdba74;
	font-size: 0.85rem;
	width: 14px;
	height: 14px;
}

.x-pg-row-form-block.votepage #vote-choice-div .bg-primary .fs-6 {
	font-size: 0.82rem !important;
	line-height: 1.25;
}

.x-pg-row-form-block.votepage #vote-choice-div .pic {
	flex: 0 0 auto;
	width: 100%;
	aspect-ratio: 16 / 10;
	border-radius: 0 !important;
	background: #f1f5f9;
	overflow: hidden;
}

.x-pg-row-form-block.votepage #vote-choice-div .pic img,
.x-pg-row-form-block.votepage #vote-choice-div .pic .card-img-top,
.x-pg-row-form-block.votepage #vote-choice-div .pic .imgfit {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0 !important;
	border-top-left-radius: 0 !important;
	border-top-right-radius: 0 !important;
	display: block;
}

.x-pg-row-form-block.votepage #vote-choice-div .card-body {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-height: 0;
	padding: 12px 14px;
}

.x-pg-row-form-block.votepage #vote-choice-div .card-title {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var(--vote-card-title-lines);
	margin: 0;
	color: var(--vote-ink);
	font-size: 1.05rem;
	line-height: 1.35;
	letter-spacing: 0;
}

.x-pg-row-form-block.votepage #vote-choice-div .card-text {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var(--vote-card-desc-lines);
	max-height: calc(1.65em * var(--vote-card-desc-lines));
	margin: 0;
	color: var(--vote-muted);
	font-size: 0.9375rem;
	line-height: 1.65;
}

.x-pg-row-form-block.votepage #vote-choice-div .vote_me {
	align-items: center;
	margin: auto 0 0;
	padding: 10px 12px;
	border-top: 1px solid #eef2f7;
	background: #f8fafc;
	row-gap: 8px;
}

.x-pg-row-form-block.votepage #vote-choice-div .vote_me .btn {
	min-height: 40px;
	border-radius: 8px;
	font-size: 0.9375rem;
	font-weight: 700;
	letter-spacing: 0;
}

.x-pg-row-form-block.votepage #vote-choice-div .item-detail-btn {
	border-color: #cbd5e1;
	background: #ffffff;
	color: #334155;
}

.x-pg-row-form-block.votepage #vote-choice-div .vote-btn {
	border-color: var(--vote-accent);
	background: var(--vote-accent);
	color: #ffffff;
	box-shadow: 0 8px 18px color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #f97316)) 24%, transparent);
}

.x-pg-row-form-block.votepage #vote-choice-div .vote-btn.btn-success {
	border-color: var(--vote-success);
	background: var(--vote-success);
	box-shadow: 0 8px 18px color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #15803d)) 30%, transparent);
}

.x-pg-row-form-block.votepage #vote-choice-div .vote_me .btn:disabled {
	opacity: 1;
}

.x-pg-row-form-block.votepage #vote-choice-div .vote_stat {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	margin: 0;
	padding: 0 4px;
	color: var(--vote-muted);
	font-size: 0.8125rem;
	line-height: 1.4;
	text-align: center;
}

.x-pg-row-form-block.votepage #vote-choice-div .vote_stat span {
	display: inline-flex;
	align-items: center;
	max-width: 100%;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: #64748b;
	font-weight: 700;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

@media (max-width: 767.98px) {
	.x-pg-row-form-block.votepage .vote_step {
		flex-wrap: nowrap;
		gap: 8px;
		margin-bottom: 12px;
		padding: 0 0 2px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
	}

	.x-pg-row-form-block.votepage .vote_step > .d-inline-block {
		flex: 0 0 auto;
		max-width: none;
		scroll-snap-align: start;
	}

	.x-pg-row-form-block.votepage .vote_step .cat-btn {
		min-height: 44px;
	}

	.x-pg-row-form-block.votepage #vote-choice-div {
		padding: 14px;
	}

	.x-pg-row-form-block.votepage #vote-choice-div .title {
		align-items: flex-start;
		flex-direction: column;
		font-size: 1.125rem;
	}

	.x-pg-row-form-block.votepage #vote-choice-div .title > span {
		max-width: 100%;
	}

	.x-pg-row-form-block.votepage #vote-choice-div .card > .d-flex.flex-sm-row {
		flex-direction: row !important;
		align-items: stretch;
		gap: 0;
	}

	.x-pg-row-form-block.votepage #vote-choice-div .card > .d-flex.flex-sm-row .pic {
		flex: 0 0 40%;
		width: 40%;
		aspect-ratio: auto;
		min-height: 100%;
	}

	.x-pg-row-form-block.votepage #vote-choice-div .card > .d-flex.flex-sm-row .card-body {
		flex: 1 1 auto;
		min-width: 0;
	}

		.x-pg-row-form-block.votepage #vote-choice-div .vote_me {
			padding: 10px;
		}
	}

.x-pg-preview-frame.mobile .x-pg-row-form-block.votepage .vote_step {
	flex-wrap: nowrap;
	gap: 8px;
	margin-bottom: 12px;
	padding: 0 0 2px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
}

.x-pg-preview-frame.mobile .x-pg-row-form-block.votepage .vote_step > .d-inline-block {
	flex: 0 0 auto;
	max-width: none;
	scroll-snap-align: start;
}

.x-pg-preview-frame.mobile .x-pg-row-form-block.votepage .vote_step .cat-btn {
	min-height: 44px;
}

.x-pg-preview-frame.mobile .x-pg-row-form-block.votepage #vote-choice-div {
	padding: 14px;
}

.x-pg-preview-frame.mobile .x-pg-row-form-block.votepage #vote-choice-div .title {
	align-items: flex-start;
	flex-direction: column;
	font-size: 1.125rem;
}

.x-pg-preview-frame.mobile .x-pg-row-form-block.votepage #vote-choice-div .title > span {
	max-width: 100%;
}

.x-pg-preview-frame.mobile .x-pg-row-form-block.votepage #vote-choice-div .card > .d-flex.flex-sm-row {
	flex-direction: row !important;
	align-items: stretch;
	gap: 0;
}

.x-pg-preview-frame.mobile .x-pg-row-form-block.votepage #vote-choice-div .card > .d-flex.flex-sm-row .pic {
	flex: 0 0 40%;
	width: 40%;
	aspect-ratio: auto;
	min-height: 100%;
}

.x-pg-preview-frame.mobile .x-pg-row-form-block.votepage #vote-choice-div .card > .d-flex.flex-sm-row .card-body {
	flex: 1 1 auto;
	min-width: 0;
}

.x-pg-preview-frame.mobile .x-pg-row-form-block.votepage #vote-choice-div .vote_me {
	padding: 10px;
}

/* ----- 我選擇的名單 ----- */
.x-pg-row-form-block.votepage #voted-div {
	margin-top: 24px;
	padding: 18px 0 0;
	background: #ffffff;
}

.x-pg-row-form-block.votepage #voted-div .vote_choice > .title {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 16px !important;
	color: #111827;
	font-size: 1.25rem;
	font-weight: 800;
	line-height: 1.35;
	letter-spacing: 0;
}

.x-pg-row-form-block.votepage #voted-div .vote_icon {
	width: 28px;
	height: 28px;
	flex: 0 0 auto;
	object-fit: contain;
}

.x-pg-row-form-block.votepage #voted-div .voted > .row {
	row-gap: 16px;
}

.x-pg-row-form-block.votepage #voted-div .voted-cat-div {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.x-pg-row-form-block.votepage #voted-div .vote_choice_title {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	width: fit-content;
	color: #111827;
	font-size: 0.9375rem;
	font-weight: 800;
	line-height: 1.25;
}

.x-pg-row-form-block.votepage #voted-div .vote_choice_title .badge-circle {
	display: inline-grid;
	place-items: center;
	width: 26px;
	height: 26px;
	padding: 0;
	border: 1px solid #e2e8f0;
	border-radius: 999px;
	background: #ffffff !important;
	color: #64748b !important;
	font-size: 0.8125rem;
	font-weight: 800;
}

.x-pg-row-form-block.votepage #voted-div .voted_reminder {
	display: flex;
	align-items: center;
	gap: 14px;
	min-height: 116px;
	margin: 0 !important;
	padding: 14px;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	background: #ffffff;
	box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
}

.x-pg-row-form-block.votepage #voted-div .voted_reminder .pic {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 86px;
	width: 86px;
	height: 86px;
	padding: 18px;
	border-radius: 8px;
	background: #f8fafc;
}

.x-pg-row-form-block.votepage #voted-div .voted_reminder .pic img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
}

.x-pg-row-form-block.votepage #voted-div .voted_reminder .text {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 10px;
	min-width: 0;
}

.x-pg-row-form-block.votepage #voted-div .voted_reminder .text p {
	margin: 0;
	color: #334155;
	font-size: 0.9375rem;
	font-weight: 700;
	line-height: 1.45;
}

.x-pg-row-form-block.votepage #voted-div .voted_reminder .cat-btn {
	width: fit-content;
	min-width: 112px;
	min-height: 38px;
	padding: 8px 14px;
	border: 0;
	border-radius: 8px;
	background: var(--x-pg-vote-accent, var(--bs-primary, #f97316));
	color: #ffffff;
	font-size: 0.875rem;
	font-weight: 700;
	line-height: 1.2;
	box-shadow: 0 8px 18px color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #f97316)) 24%, transparent);
}

.x-pg-row-form-block.votepage #voted-div .voted_reminder .cat-btn:hover,
.x-pg-row-form-block.votepage #voted-div .voted_reminder .cat-btn:focus {
	background: var(--x-pg-vote-accent, var(--bs-primary, #ea580c)); filter: brightness(0.92);
	color: #ffffff;
}

@media (max-width: 767.98px) {
	.x-pg-row-form-block.votepage #voted-div .vote_choice > .title {
		font-size: 1.125rem;
	}

	.x-pg-row-form-block.votepage #voted-div .voted_reminder {
		min-height: 104px;
		padding: 12px;
	}

	.x-pg-row-form-block.votepage #voted-div .voted_reminder .pic {
		flex-basis: 72px;
		width: 72px;
		height: 72px;
		padding: 14px;
	}
}

.x-pg-preview-frame.mobile .x-pg-row-form-block.votepage #voted-div .vote_choice > .title {
	font-size: 1.125rem;
}

.x-pg-preview-frame.mobile .x-pg-row-form-block.votepage #voted-div .voted_reminder {
	min-height: 104px;
	padding: 12px;
}

	.x-pg-preview-frame.mobile .x-pg-row-form-block.votepage #voted-div .voted_reminder .pic {
		flex-basis: 72px;
		width: 72px;
		height: 72px;
		padding: 14px;
	}

	/* 外層淺色容器，包住「標題（寫在 merge 之前）」與各組別卡片。
	   色系變數由 PreviewFormBlock 以 inline style 注入，預設回退到頁面主題色 --x-pg-primary。 */
	.x-pg-row-form-block.votepage .x-pg-voted-list {
		display: block;
		width: 100%;
		margin-top: 40px;
		margin-bottom: 32px;
		padding: 20px;
		border-radius: 16px;
		background: #f4f7fb;
	}

	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] {
		display: block;
		width: 100%;
	}

	/* 標題列：圖示 + 「我選擇的名單」+ 下方分隔線 */
	.x-pg-row-form-block.votepage .x-pg-voted-list .voted-list-head {
		display: flex;
		align-items: center;
		gap: 16px;
		margin-bottom: 18px;
		padding-bottom: 16px;
		border-bottom: 1px solid #e3e9f2;
	}

	.x-pg-row-form-block.votepage .x-pg-voted-list .voted-list-head-icon {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		flex: 0 0 auto;
		width: 56px;
		height: 56px;
		padding: 0;
		border-right: 1px solid #dbe4f0;
		color: var(--x-pg-vote-accent, var(--x-pg-primary, #2f6fed));
	}

	.x-pg-row-form-block.votepage .x-pg-voted-list .voted-list-head-icon svg {
		width: 100%;
		height: 100%;
	}

	.x-pg-row-form-block.votepage .x-pg-voted-list .voted-list-head-title {
		margin: 0;
		color: var(--x-pg-vote-accent, var(--x-pg-primary, #2f6fed));
		font-size: 1.6rem;
		font-weight: 800;
		line-height: 1.2;
	}

	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted > .row {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: flex-start;
		gap: 16px;
		margin-right: 0;
		margin-left: 0;
	}

	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted-cat-div {
		display: flex;
		flex: 1 1 260px;
		max-width: 360px;
		flex-direction: column;
		gap: 10px;
		padding-right: 0;
		padding-left: 0;
	}

	/* 組別小卡：淺藍底，內含圓形序號徽章 + 組別名稱 */
	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .vote_choice_title {
		display: flex;
		align-items: center;
		gap: 12px;
		width: 100%;
		padding: 12px 16px;
		border-radius: 12px;
		background: var(--x-pg-vote-soft-strong, #e3edfd);
		color: var(--x-pg-vote-accent, var(--x-pg-primary, #2f6fed));
		font-size: 1rem;
		font-weight: 800;
		line-height: 1.25;
	}

	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .vote_choice_title .badge-circle {
		display: inline-grid;
		place-items: center;
		flex: 0 0 auto;
		width: 32px;
		height: 32px;
		padding: 0;
		border: 0;
		border-radius: 999px;
		background: #ffffff !important;
		color: var(--x-pg-vote-accent, var(--x-pg-primary, #2f6fed)) !important;
		font-size: 0.95rem;
		font-weight: 800;
	}

	/* 組別卡片：主題色淺底，內含白底票券圖 + 文字 + 按鈕 */
	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted_reminder {
		display: flex;
		align-items: center;
		flex-wrap: nowrap;
		gap: 14px;
		min-height: 0;
		margin: 0 !important;
		padding: 14px;
		border: 0;
		border-radius: 14px;
		background: var(--x-pg-vote-soft, #eaf1fd);
	}

	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted_reminder .pic {
		display: flex;
		align-items: center;
		justify-content: center;
		flex: 0 0 84px;
		width: 84px;
		height: 84px;
		padding: 16px;
		border-radius: 12px;
		background: #ffffff;
	}

	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted_reminder .pic img {
		width: 100%;
		height: 100%;
		object-fit: contain;
		display: block;
	}

	/* 文字與按鈕改為直向堆疊 */
	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted_reminder .text {
		display: flex;
		align-items: flex-start;
		justify-content: center;
		flex: 1 1 auto;
		flex-direction: column;
		gap: 14px;
		min-width: 0;
	}

	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted_reminder .text p {
		width: 100%;
		min-width: 0;
		margin: 0;
		color: var(--x-pg-vote-accent, var(--x-pg-primary, #2f6fed));
		font-size: 0.95rem;
		font-weight: 800;
		line-height: 1.35;
	}

	/* 「前往投票」按鈕：使用者可在投票表單自選的按鈕顏色，預設為頁面主題色 */
	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted_reminder .cat-btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		flex: 0 0 auto;
		width: 100% !important;
		min-height: 42px;
		padding: 9px 16px;
		border: 0;
		border-radius: 8px;
		background: var(--x-pg-vote-accent, var(--x-pg-primary, #2f6fed));
		color: #ffffff;
		font-size: 1rem;
		font-weight: 800;
		line-height: 1.2;
		transition: filter 0.15s ease;
	}

	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted_reminder .cat-btn > span {
		display: block;
		line-height: 1.2;
	}

	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted_reminder .cat-btn:hover,
	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted_reminder .cat-btn:focus {
		filter: brightness(0.92);
		color: #ffffff;
	}

	/* 已選名單項目沿用相同卡片外觀 */
	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted_item {
		display: flex;
		align-items: center;
		flex-wrap: nowrap;
		gap: 14px;
		min-height: 0;
		margin: 0 !important;
		padding: 14px;
		border: 0;
		border-radius: 14px;
		background: var(--x-pg-vote-soft, #eaf1fd);
	}

	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted_item .pic {
		flex: 0 0 84px;
		width: 84px;
		height: 84px;
		padding: 12px;
		border-radius: 12px;
		background: #ffffff;
	}

	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted_item .pic img {
		position: static;
		width: 100%;
		height: 100%;
		object-fit: contain;
		display: block;
	}

	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted_item .text {
		display: flex;
		align-items: flex-start;
		justify-content: center;
		flex: 1 1 auto;
		flex-direction: column;
		gap: 6px;
		min-width: 0;
		padding: 0;
	}

	.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted_item .text p {
		width: 100%;
		min-width: 0;
		margin: 0;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	/* 投票頁基本資料表單前的提示標題：圖示 + 「請輸入基本資料完成投票」 */
	.x-pg-row-form-block.votepage .x-pg-vote-form-intro {
		display: flex;
		align-items: center;
		gap: 14px;
		width: 100%;
		margin-bottom: 18px;
		padding: 16px 18px;
		border-radius: 14px;
		background: var(--x-pg-vote-soft, #eaf1fd);
	}

	.x-pg-row-form-block.votepage .x-pg-vote-form-intro-icon {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		flex: 0 0 48px;
		width: 48px;
		height: 48px;
		padding: 9px;
		border-radius: 12px;
		background: #ffffff;
	}

	.x-pg-row-form-block.votepage .x-pg-vote-form-intro-icon img {
		width: 100%;
		height: 100%;
		object-fit: contain;
		display: block;
	}

	.x-pg-row-form-block.votepage .x-pg-vote-form-intro-title {
		margin: 0;
		color: var(--x-pg-vote-accent, var(--x-pg-primary, #2f6fed));
		font-size: 1.15rem;
		font-weight: 800;
		line-height: 1.3;
	}

	@media (max-width: 767.98px) {
		.x-pg-row-form-block.votepage .x-pg-voted-list {
			padding: 14px;
		}

		.x-pg-row-form-block.votepage .x-pg-vote-form-intro {
			padding: 14px;
		}

		.x-pg-row-form-block.votepage .x-pg-vote-form-intro-title {
			font-size: 1.05rem;
		}

		.x-pg-row-form-block.votepage .x-pg-voted-list .voted-list-head-title {
			font-size: 1.3rem;
		}

		.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted-cat-div {
			flex-basis: 100%;
		}

		.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted_reminder,
		.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted_item {
			align-items: stretch;
			gap: 12px;
			padding: 14px;
		}

		.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted_reminder .pic,
		.x-pg-row-form-block.votepage [data-merge="my_voted_items"] .voted_item .pic {
			flex-basis: 84px;
			width: 84px;
			height: 84px;
			padding: 14px;
		}
	}

	/* Live voting pages receive server-rendered merge partials whose wrappers differ from
	   the editor mock HTML. Keep the published page aligned with the preview styling. */
	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] {
		--vote-border: #e2e8f0;
		--vote-ink: #111827;
		--vote-muted: #64748b;
		--vote-accent: var(--x-pg-vote-accent, var(--bs-primary, #f97316));
		--vote-accent-soft: color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #f97316)) 8%, #ffffff);
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 8px;
		margin: 0;
		padding: 0;
		background: transparent;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] > .d-inline-block {
		flex: 0 1 auto;
		max-width: 100%;
		margin-right: 0 !important;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] .cat-btn {
		position: relative;
		display: flex;
		align-items: center;
		width: auto;
		min-width: 138px;
		max-width: 260px;
		min-height: 44px;
		padding: 7px 10px 7px 12px;
		border: 1px solid var(--vote-border);
		border-radius: 6px;
		background: #ffffff;
		color: var(--vote-ink);
		text-align: left;
		box-shadow: none;
		overflow: hidden;
		transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease, background 0.16s ease;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] .cat-btn::before {
		content: "";
		position: absolute;
		inset: 8px auto 8px 0;
		width: 3px;
		border-radius: 0 6px 6px 0;
		background: #cbd5e1;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] .cat-btn:hover,
	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] .cat-btn:focus {
		border-color: var(--x-pg-vote-accent, var(--bs-primary, #fdba74));
		background: #ffffff;
		box-shadow: 0 6px 14px rgba(15, 23, 42, 0.08);
		transform: translateY(-1px);
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] .cat-btn > .w-100 {
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 10px;
		min-width: 0;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] .cat-btn .text-start,
	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] .cat-btn .text-center {
		min-width: 0;
		text-align: left !important;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] .cat-btn .text-start {
		flex: 1 1 auto;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] .cat-btn .text-center {
		flex: 0 0 auto;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] .cat-btn .fw-bolder {
		display: flex;
		align-items: center;
		gap: 7px;
		color: inherit;
		font-size: 0.9375rem;
		font-weight: 700 !important;
		line-height: 1.25;
		letter-spacing: 0;
		white-space: normal;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] .badge-circle {
		display: inline-grid;
		place-items: center;
		flex: 0 0 auto;
		width: 24px;
		height: 24px;
		padding: 0;
		border: 1px solid color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #f97316)) 30%, #ffffff);
		border-radius: 999px;
		background: var(--vote-accent-soft) !important;
		color: var(--x-pg-vote-accent, var(--bs-primary, #c2410c)) !important;
		font-size: 0.8125rem;
		font-weight: 700;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] .vote_state {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: fit-content;
		max-width: 100%;
		min-height: 22px;
		padding: 3px 8px;
		border: 1px solid #e2e8f0;
		border-radius: 999px;
		background: #ffffff !important;
		color: var(--vote-muted) !important;
		font-size: 0.75rem;
		font-weight: 600;
		line-height: 1.2;
		white-space: normal;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] .cat-btn.btn-vote {
		border-color: var(--x-pg-vote-accent, var(--bs-primary, #0f172a));
		background: var(--x-pg-vote-accent, var(--bs-primary, #0f172a));
		color: #ffffff;
		box-shadow: none;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] .cat-btn.btn-vote::before {
		background: var(--vote-accent);
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] .cat-btn.btn-vote .badge-circle {
		border-color: rgba(255, 255, 255, 0.28);
		background: #ffffff !important;
		color: #0f172a !important;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] .cat-btn.btn-vote .vote_state {
		border-color: rgba(255, 255, 255, 0.24);
		background: rgba(255, 255, 255, 0.14) !important;
		color: #ffffff !important;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] .cat-btn.btn-outline-a {
		background: #ffffff;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] .cat-btn.btn-outline-a::before {
		background: color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #fdba74)) 55%, #ffffff);
		opacity: 0.75;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] {
		--vote-border: #e2e8f0;
		--vote-ink: #111827;
		--vote-muted: #64748b;
		--vote-accent: var(--x-pg-vote-accent, var(--bs-primary, #f97316));
		--vote-accent-soft: color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #f97316)) 8%, #ffffff);
		--vote-success: color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #15803d)) 75%, #000000);
		--vote-card-title-lines: 2;
		--vote-card-desc-lines: 3;
		display: block;
		width: 100%;
		margin-top: 16px;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .vote_type {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-wrap: wrap;
		gap: 10px;
		margin: 0 0 18px;
		color: var(--vote-ink);
		font-size: 1.25rem;
		font-weight: 800;
		line-height: 1.4;
		letter-spacing: 0;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .vote_type .badge-circle {
		display: inline-grid;
		place-items: center;
		min-width: 28px;
		height: 28px;
		padding: 0 9px;
		border: 1px solid var(--x-pg-vote-accent, var(--bs-primary, #f97316));
		border-radius: 999px;
		background: var(--x-pg-vote-accent, var(--bs-primary, #f97316)) !important;
		color: #ffffff !important;
		font-size: 0.9rem;
		font-weight: 800;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] #items-div {
		row-gap: 14px;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] #items-div > .col {
		display: flex;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .card {
		width: 100%;
		height: 100%;
		border: 1px solid #e2e8f0;
		border-radius: 8px;
		overflow: hidden;
		background: #ffffff;
		box-shadow: 0 6px 16px rgba(15, 23, 42, 0.05);
		transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .card:hover {
		transform: translateY(-2px);
		border-color: var(--x-pg-vote-accent, var(--bs-primary, #fdba74));
		box-shadow: 0 12px 26px rgba(15, 23, 42, 0.08);
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .num {
		display: flex;
		align-items: center;
		gap: 6px;
		padding: 7px 16px 6px;
		background: var(--x-pg-vote-accent, #0f172a);
		color: #ffffff;
		font-size: 0.78rem;
		font-weight: 800;
		line-height: 1.2;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .num span:last-child {
		color: #ffffff;
		font-size: 0.9rem;
		font-weight: 900;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .num .bullet {
		width: 5px;
		height: 20px;
		border-radius: 999px;
		background: #ffffff !important;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .bg-primary {
		min-height: 30px;
		padding-left: 16px !important;
		padding-right: 16px !important;
		background: #0f172a !important;
		color: #ffffff;
		font-weight: 800;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .bg-primary svg,
	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .bg-primary i,
	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .bg-primary .bi {
		color: #fdba74;
		fill: currentColor;
		font-size: 0.85rem;
		width: 14px;
		height: 14px;
		flex: 0 0 auto;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .bg-primary .fs-6 {
		font-size: 0.82rem !important;
		line-height: 1.25;
		font-weight: 800;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .pic {
		flex: 0 0 auto;
		width: 100%;
		aspect-ratio: 16 / 9.5;
		border-radius: 0 !important;
		background: #f1f5f9;
		overflow: hidden;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .pic img,
	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .pic .card-img-top,
	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .pic .imgfit {
		width: 100%;
		height: 100%;
		object-fit: cover;
		border-radius: 0 !important;
		border-top-left-radius: 0 !important;
		border-top-right-radius: 0 !important;
		display: block;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .card-body {
		display: flex;
		flex-direction: column;
		gap: 7px;
		min-height: 0;
		padding: 13px 16px;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .card-title {
		display: -webkit-box;
		overflow: hidden;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: var(--vote-card-title-lines);
		margin: 0;
		color: var(--vote-ink);
		font-size: 1.1rem;
		line-height: 1.35;
		letter-spacing: 0;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .card-text {
		display: -webkit-box;
		overflow: hidden;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: var(--vote-card-desc-lines);
		max-height: calc(1.6em * var(--vote-card-desc-lines));
		margin: 0;
		color: var(--vote-muted);
		font-size: 0.95rem;
		line-height: 1.6;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .vote_me {
		align-items: center;
		margin: auto 0 0;
		padding: 11px 14px;
		border-top: 1px solid #eef2f7;
		background: #f8fafc;
		row-gap: 8px;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .vote_me .btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
		min-height: 40px;
		padding: 8px 12px;
		border-radius: 8px;
		font-size: 0.95rem;
		font-weight: 800;
		letter-spacing: 0;
		line-height: 1.2;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .item-detail-btn {
		border-color: #cbd5e1;
		background: #ffffff;
		color: #334155;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .vote-btn {
		border-color: var(--vote-accent);
		background: var(--vote-accent);
		color: #ffffff;
		box-shadow: 0 10px 20px color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #f97316)) 16%, transparent);
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .vote-btn img {
		display: block;
		flex: 0 0 18px;
		width: 18px;
		height: 18px;
		margin: 0 !important;
		object-fit: contain;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .vote-btn.btn-success {
		border-color: var(--vote-success);
		background: var(--vote-success);
		box-shadow: 0 8px 18px color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #15803d)) 30%, transparent);
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .vote_me .btn:disabled {
		opacity: 1;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .vote_stat {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		margin: 0;
		padding: 0 4px;
		color: var(--vote-muted);
		font-size: 0.8125rem;
		line-height: 1.4;
		text-align: center;
	}

	.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .vote_stat span {
		display: inline-flex;
		align-items: center;
		max-width: 100%;
		padding: 0;
		border: 0;
		border-radius: 0;
		background: transparent;
		color: #64748b;
		font-weight: 700;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	@media (max-width: 767.98px) {
		.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] {
			flex-wrap: nowrap;
			gap: 8px;
			padding: 0 0 2px;
			overflow-x: auto;
			scroll-snap-type: x mandatory;
			-webkit-overflow-scrolling: touch;
		}

		.x-pg-row-form-block.votepage [data-merge="hook_voting_cat_list"] > .d-inline-block {
			flex: 0 0 auto;
			max-width: none;
			scroll-snap-align: start;
		}

		.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] {
			padding: 14px;
		}

		.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .vote_type {
			align-items: flex-start;
			font-size: 1.25rem;
			text-align: left;
		}

		.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .card > .d-flex.flex-sm-row {
			flex-direction: row !important;
			align-items: stretch;
			gap: 0;
		}

		.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .card > .d-flex.flex-sm-row .pic {
			flex: 0 0 40%;
			width: 40%;
			aspect-ratio: auto;
			min-height: 100%;
		}

		.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .card > .d-flex.flex-sm-row .card-body {
			flex: 1 1 auto;
			min-width: 0;
		}

		.x-pg-row-form-block.votepage [data-merge="hook_voting_item_list"] .vote_me {
				padding: 10px;
			}
		}

	/* ----- 投票項目詳情 Modal ----- */
	.x-pg-row-form-block.votepage .modal-dialog {
		width: min(92vw, 760px);
		min-width: 0;
		max-width: 760px;
		margin-right: auto;
		margin-left: auto;
	}

	.x-pg-row-form-block.votepage .modal-content {
		max-height: calc(100vh - 48px);
		border: 1px solid #dbe4ef;
		border-radius: 8px;
		overflow: hidden;
		box-shadow: 0 24px 70px rgba(15, 23, 42, 0.28);
	}

	.x-pg-row-form-block.votepage .modal-header {
		align-items: flex-start;
		padding: 18px 24px;
		border-bottom-color: #e5e7eb;
	}

	.x-pg-row-form-block.votepage .modal-title {
		min-width: 0;
		color: #1f2937;
		line-height: 1.25;
	}

	.x-pg-row-form-block.votepage .modal-title .item-title-display {
		display: -webkit-box;
		overflow: hidden;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		font-size: clamp(1.25rem, 2.4vw, 1.65rem);
		font-weight: 800;
		letter-spacing: 0;
	}

	.x-pg-row-form-block.votepage .modal-body {
		max-height: calc(100vh - 220px);
		padding: 20px 24px;
		overflow-y: auto;
	}

	.x-pg-row-form-block.votepage .modal-body .pic {
		position: relative;
		width: 100%;
		max-width: none;
		margin: 0 0 16px;
		border-radius: 0;
		background: transparent;
	}

	/* 用 flex 直排，讓指示點(DOM 上在圖片前面)排到圖片下方 */
	.x-pg-row-form-block.votepage .modal-body .pic .carousel {
		display: flex;
		flex-direction: column;
		padding-bottom: 0;
	}

	.x-pg-row-form-block.votepage .modal-body .pic .carousel-inner {
		order: 1;
		aspect-ratio: 16 / 9;
		border-radius: 8px;
		background: #f1f5f9;
		overflow: hidden;
	}

	.x-pg-row-form-block.votepage .modal-body .pic .carousel-item {
		height: 100%;
		aspect-ratio: 16 / 9;
		padding-bottom: 0;
	}

	/* 輪播指示點移到圖片下方，避免蓋住圖片 */
	.x-pg-row-form-block.votepage .modal-body .pic .carousel-indicators {
		order: 2;
		position: static;
		z-index: auto;
		justify-content: center;
		margin: 10px 0 0;
		padding: 0;
	}

	.x-pg-row-form-block.votepage .modal-body .pic .carousel-indicators [data-bs-target],
	.x-pg-row-form-block.votepage .modal-body .pic .carousel-indicators button {
		box-sizing: border-box;
		width: 26px;
		height: 4px;
		margin: 0 4px;
		border: 0;
		border-top: 0;
		border-bottom: 0;
		border-radius: 999px;
		background-color: #cbd5e1;
		opacity: 1;
		transition: background-color 0.15s ease;
	}

	.x-pg-row-form-block.votepage .modal-body .pic .carousel-indicators .active {
		background-color: #64748b;
	}

	/* 只有一張圖時，單顆指示點沒意義，隱藏 */
	.x-pg-row-form-block.votepage .modal-body .pic .carousel-indicators button:only-child {
		display: none;
	}

	/* 左右箭頭只對齊圖片區域，不延伸到下方指示點 */
	.x-pg-row-form-block.votepage .modal-body .pic .carousel-control-prev,
	.x-pg-row-form-block.votepage .modal-body .pic .carousel-control-next {
		top: 0;
		bottom: 14px;
		height: auto;
	}

	.x-pg-row-form-block.votepage .modal-body .pic img,
	.x-pg-row-form-block.votepage .modal-body .pic .carousel-item img {
		position: static;
		width: 100%;
		height: 100%;
		object-fit: cover;
		display: block;
	}

	.x-pg-row-form-block.votepage .modal-body .text {
		color: #334155;
		font-size: 1rem;
		line-height: 1.6;
	}

	.x-pg-row-form-block.votepage .modal-footer {
		gap: 12px;
		padding: 14px 24px 18px;
		border-top-color: #e5e7eb;
	}

	.x-pg-row-form-block.votepage .modal-footer > span {
		display: inline-flex;
		margin: 0;
	}

	.x-pg-row-form-block.votepage .modal-footer .btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
		min-height: 44px;
		padding: 9px 20px;
		border-radius: 8px;
		font-size: 0.95rem;
		font-weight: 800;
		line-height: 1.2;
	}

	/* 關閉：淡色外框按鈕 */
	.x-pg-row-form-block.votepage .modal-footer .btn-secondary {
		border: 1px solid #cbd5e1;
		background: #ffffff;
		color: #334155;
	}

	.x-pg-row-form-block.votepage .modal-footer .btn-secondary:hover,
	.x-pg-row-form-block.votepage .modal-footer .btn-secondary:focus {
		border-color: #94a3b8;
		background: #f1f5f9;
		color: #1f2937;
	}

	/* 投我一票：與卡片一致的橘色主色 */
	.x-pg-row-form-block.votepage .modal-footer .vote-btn,
	.x-pg-row-form-block.votepage .modal-footer #detail-vote-btn {
		border-color: var(--x-pg-vote-accent, var(--bs-primary, #f97316));
		background: var(--x-pg-vote-accent, var(--bs-primary, #f97316));
		color: #ffffff;
		box-shadow: 0 10px 20px color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #f97316)) 22%, transparent);
	}

	.x-pg-row-form-block.votepage .modal-footer .vote-btn:hover,
	.x-pg-row-form-block.votepage .modal-footer .vote-btn:focus,
	.x-pg-row-form-block.votepage .modal-footer #detail-vote-btn:hover,
	.x-pg-row-form-block.votepage .modal-footer #detail-vote-btn:focus {
		border-color: var(--x-pg-vote-accent, var(--bs-primary, #ea580c));
		background: var(--x-pg-vote-accent, var(--bs-primary, #ea580c)); filter: brightness(0.92);
		color: #ffffff;
	}

	.x-pg-row-form-block.votepage .modal-footer .vote-btn.btn-success,
	.x-pg-row-form-block.votepage .modal-footer #detail-vote-btn.btn-success {
		border-color: color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #15803d)) 75%, #000000);
		background: color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #15803d)) 75%, #000000);
		box-shadow: 0 8px 18px color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #15803d)) 30%, transparent);
	}

	.x-pg-row-form-block.votepage .modal-footer .vote-btn img {
		flex: 0 0 18px;
		width: 18px;
		height: 18px;
		margin: 0 !important;
		object-fit: contain;
	}

	@media (max-width: 767.98px) {
		.x-pg-row-form-block.votepage .modal-dialog {
			width: calc(100vw - 24px);
			margin-top: 12px;
			margin-bottom: 12px;
		}

		.x-pg-row-form-block.votepage .modal-header {
			padding: 14px 16px;
		}

		.x-pg-row-form-block.votepage .modal-body {
			max-height: calc(100vh - 190px);
			padding: 14px 16px;
		}

		.x-pg-row-form-block.votepage .modal-footer {
			padding: 12px 16px 14px;
		}
	}

	/* ===== 線上頁面投票詳情 Modal =====
	   線上 #desc-modal 掛在 body.votepage 底下、不在 .x-pg-row-form-block 內，
	   上方那組 .x-pg-row-form-block.votepage .modal-* 規則對線上無效，
	   故此處改用 #desc-modal 作用域(只鎖定投票詳情 modal，不影響其他 modal)。 */

	/* 輪播：用 flex 直排把指示點移到圖片下方，不蓋圖 */
	#desc-modal .carousel {
		display: flex;
		flex-direction: column;
	}

	#desc-modal .carousel-inner {
		order: 1;
		border-radius: 8px;
		overflow: hidden;
	}

	#desc-modal .carousel-indicators {
		order: 2;
		position: static;
		z-index: auto;
		justify-content: center;
		margin: 10px 0 0;
		padding: 0;
	}

	#desc-modal .carousel-indicators [data-bs-target],
	#desc-modal .carousel-indicators button {
		box-sizing: border-box;
		width: 26px;
		height: 4px;
		margin: 0 4px;
		border: 0;
		border-top: 0;
		border-bottom: 0;
		border-radius: 999px;
		background-color: #cbd5e1;
		opacity: 1;
		transition: background-color 0.15s ease;
	}

	#desc-modal .carousel-indicators .active {
		background-color: #64748b;
	}

	/* 只有一張圖時，單顆指示點沒意義，隱藏 */
	#desc-modal .carousel-indicators button:only-child {
		display: none;
	}

	/* 左右箭頭只對齊圖片區域，不延伸到下方指示點 */
	#desc-modal .carousel-control-prev,
	#desc-modal .carousel-control-next {
		top: 0;
		bottom: 14px;
		height: auto;
	}

	/* 底部按鈕 */
	#desc-modal .modal-footer .btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
		min-height: 44px;
		padding: 9px 20px;
		border-radius: 8px;
		font-size: 0.95rem;
		font-weight: 800;
		line-height: 1.2;
	}

	/* 關閉：淡色外框按鈕 */
	#desc-modal .modal-footer .btn-secondary {
		border: 1px solid #cbd5e1;
		background: #ffffff;
		color: #334155;
	}

	#desc-modal .modal-footer .btn-secondary:hover,
	#desc-modal .modal-footer .btn-secondary:focus {
		border-color: #94a3b8;
		background: #f1f5f9;
		color: #1f2937;
	}

	/* 投我一票：與卡片一致的橘色主色 */
	#desc-modal .modal-footer .vote-btn,
	#desc-modal .modal-footer #detail-vote-btn {
		border-color: var(--x-pg-vote-accent, var(--bs-primary, #f97316));
		background: var(--x-pg-vote-accent, var(--bs-primary, #f97316));
		color: #ffffff;
		box-shadow: 0 10px 20px color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #f97316)) 22%, transparent);
	}

	#desc-modal .modal-footer .vote-btn:hover,
	#desc-modal .modal-footer .vote-btn:focus,
	#desc-modal .modal-footer #detail-vote-btn:hover,
	#desc-modal .modal-footer #detail-vote-btn:focus {
		border-color: var(--x-pg-vote-accent, var(--bs-primary, #ea580c));
		background: var(--x-pg-vote-accent, var(--bs-primary, #ea580c)); filter: brightness(0.92);
		color: #ffffff;
	}

	#desc-modal .modal-footer .vote-btn.btn-success,
	#desc-modal .modal-footer #detail-vote-btn.btn-success {
		border-color: color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #15803d)) 75%, #000000);
		background: color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #15803d)) 75%, #000000);
		box-shadow: 0 8px 18px color-mix(in srgb, var(--x-pg-vote-accent, var(--bs-primary, #15803d)) 30%, transparent);
	}

	#desc-modal .modal-footer .vote-btn img {
		flex: 0 0 18px;
		width: 18px;
		height: 18px;
		margin: 0 !important;
		object-fit: contain;
	}

	/* ----- 送出按鈕與底部區域 ----- */
	.x-pg-row-form-block .button_area {
		margin-top: 28px;
	text-align: center;
}

.x-pg-row-form-block #submit-btn {
	border-radius: 999px;
	padding: 12px 16px;
	font-size: 1rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	background: linear-gradient(90deg, #f97316, #ef4444);
	border: none;
	color: #ffffff;
	box-shadow: 0 10px 24px rgba(239, 68, 68, 0.35);
	transition: transform 0.13s ease, box-shadow 0.13s ease, opacity 0.13s ease;
}

.x-pg-x-container.x-pg-container-medium .x-pg-row-form-block #submit-btn {
	width: 100%;
	max-width: 420px;
}

.x-pg-row-form-block .survey-toolbar #submit-btn {
	border-radius: var(--bs-btn-border-radius);
	padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
	font-size: var(--bs-btn-font-size);
	font-weight: var(--bs-btn-font-weight);
	letter-spacing: 0;
	background-color: var(--form-btn-bg, var(--bs-btn-bg));
	background-image: none;
	border: var(--bs-btn-border-width) solid var(--form-btn-bg, var(--bs-btn-border-color));
	color: var(--form-btn-color, var(--bs-btn-color));
	box-shadow: none;
	transform: none;
	transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, opacity .15s ease-in-out;
}

.x-pg-row-form-block #submit-btn:hover:not(:disabled) {
	transform: translateY(-1px);
	box-shadow: 0 14px 30px rgba(239, 68, 68, 0.4);
}

.x-pg-row-form-block .survey-toolbar #submit-btn:hover:not(:disabled),
.x-pg-row-form-block .survey-toolbar #submit-btn:focus:not(:disabled) {
	background-color: var(--form-btn-bg-hover, var(--bs-btn-hover-bg));
	border-color: var(--form-btn-bg-hover, var(--bs-btn-hover-border-color));
	color: var(--form-btn-hover-color, var(--bs-btn-hover-color));
	box-shadow: none;
	transform: none;
}

.x-pg-row-form-block #submit-btn:disabled {
	opacity: 0.6;
	box-shadow: none;
	cursor: not-allowed;
}

.x-pg-row-form-block .survey-toolbar #submit-btn:disabled {
	background-color: var(--form-btn-bg, var(--bs-btn-disabled-bg));
	border-color: var(--form-btn-bg, var(--bs-btn-disabled-border-color));
	color: var(--form-btn-color, var(--bs-btn-disabled-color));
}

/* 表單區塊編輯入口：按鈕 + 抽屜圖示（編輯器側邊） */
.x-pg-form-block.x-pg-form-block-edit-entry {
	display: flex;
	align-items: center;
	gap: 8px;
}
.x-pg-form-block.x-pg-form-block-edit-entry .x-pg-drawer-trigger {
	font-size: 1.25rem;
	color: var(--bs-primary, #0d6efd);
}
.x-pg-form-block.x-pg-form-block-edit-entry .x-pg-drawer-trigger:hover {
	color: var(--bs-primary, #0d6efd);
	opacity: 0.85;
}

.x-pg-event-details-divider {
	border: 0;
	border-top: 1px dashed var(--bs-secondary, #6c757d);
	margin: 0.75rem 0;
}

/* ----- sub-quest-box / sub-quest__title / label_box.label-matrix (from xlead) ----- */
.sub-quest-box {
	display: block;
	width: 100%;
	overflow: visible;
}
.x-pg-row-form-block:has(.score-level),
.x-pg-row-form-block .form-block-preview-inner:has(.score-level),
.x-pg-row-form-block .form-block-preview-session:has(.score-level),
.x-pg-row-form-block .form-card:has(.score-level),
.x-pg-row-form-block .form_box:has(.score-level),
.x-pg-row-form-block .mock-form-inner:has(.score-level),
.x-pg-row-form-block .quest_list:has(.score-level),
.x-pg-row-form-block .quest:has(.score-level),
.x-pg-row-form-block .form-group:has(.score-level),
.x-pg-row-form-block .sub-quest-box:has(.score-level) {
	overflow: visible !important;
}
/* 成品頁（body.is-wrapper）的 #bioPreviewContent.x-pg-page-scroll 是 overflow:auto，
   但在成品頁它沒有固定高度、實際不捲動（捲的是 window）。這個「不捲卻 overflow:auto」的容器
   會成為 .score-level 的最近捲動祖先，攔截 sticky 吸附，導致矩陣表頭永遠黏不住。
   只在含矩陣表頭時讓它回歸 window 捲動。編輯器預覽 body 為 .x-pg-app-body（無 .is-wrapper）且
   該容器有固定高度本來就該捲，故不受影響。 */
body.is-wrapper .x-pg-page-scroll:has(.score-level) {
	overflow: visible !important;
}
.quest:has(.label-matrix) .fv-plugins-message-container.invalid-feedback~.fv-plugins-message-container.invalid-feedback {
	display: none;
}
.score-level {
	display: grid;
	grid-template-columns: 200px minmax(0, 1fr);
	width: 100%;
	margin-left: 0 !important;
	padding: 0;
	position: -webkit-sticky !important;
	position: sticky !important;
	top: 52px;
	align-self: start;
	z-index: 4;
	background-color: #e5e5e5;
	border-bottom: 1px solid #cbd5e1;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	overflow: hidden;
}
html:has(#countdown-container) .score-level,
html:has(#countdown.countdown_banner) .score-level {
	top: calc(var(--x-pg-navbar-block-height, 52px) + var(--countdown-container-height, 52px));
}
.score-level .score-level__empty,
.score-level .score-level__scales {
	display: block;
	min-width: 0;
}
.score-level .score-level__empty,
.score-level .score-level__scales {
	background-color: #e5e5e5;
}
.score-level .score-level__empty {
	padding: 0 !important;
}
.score-level .score-level__scales {
	padding-top: .5rem;
	padding-bottom: .5rem;
}
/* 緊接表頭的第一列 sub-quest：去掉上方左右圓角，與 score-level 無縫相連 */
.score-level + .sub-quest {
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}
.score-level .score-level__scales > .d-flex,
.sub-quest .label_box.label-matrix > .d-flex {
	display: grid !important;
	grid-auto-flow: column;
	grid-auto-columns: minmax(0, 1fr);
	align-items: center;
	gap: 8px !important;
	padding: 0 !important;
}
.score-level .score-level__scales > .d-flex > .col,
.label_box.label-matrix > .d-flex > label {
	width: auto;
	min-width: 0;
	padding-left: .5rem !important;
	padding-right: .5rem !important;
}
.score-level .score-level__scales > .d-flex > .col {
	word-break: normal;
	overflow-wrap: anywhere;
	line-height: 1.35;
}
.sub-quest .sub-quest__title {
	padding: .5rem !important;
}
.score-level .score-level__scales .text-gray-700 {
	color: #4b5563 !important;
	font-weight: 700;
}
.sub-quest__title {
	display: flex;
	align-items: center;
	width: 200px;
	min-width: 0;
}
.label_box.label-matrix {
	display: block;
	min-width: 0;
}
.label_box.label-matrix label {
	flex-grow: 1;
	outline: 0px;
	background-color: transparent;
	cursor: pointer;
	pointer-events: auto;
}
.label_box.label-matrix label .d-flex.gap-3 {
	justify-content: center;
	width: 100%;
	gap: 0 !important;
}
.label_box.label-matrix input[type="radio"]:checked+label {
	outline: 0px;
	background-color: transparent;
}
.label_box.label-matrix label .x-radio {
	margin-right: auto;
	margin-left: auto;
	width: 18px;
	height: 18px;
	border: 1px solid var(--bs-gray-500);
	position: relative;
	pointer-events: none;
}
.label_box.label-matrix input[type="radio"]:checked+label {
	font-weight: normal;
}
.label_box.label-matrix input[type="radio"]:checked+label .x-radio {
	border: 1px solid var(--bs-primary);
	width: 18px;
	height: 18px;
}

.label_box.label-matrix input[type="radio"]:checked+label .x-radio::before,
.x-pg-row-form-block .label_box.label-matrix input[type="radio"]:checked+label .x-radio::before {
	content: '';
	z-index: 1;
	position: absolute;
	width: 65%;
	height: 65%;
	border-radius: 50%;
	background-color: var(--bs-primary, #e57738);
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
/* 桌面（圓鈕模式）：隱藏選項內的文字/圖片佔位，讓 .x-radio 在欄位內真正水平置中，與上方表頭刻度對齊 */
@media screen and (min-width: 1200px) {
	.label_box.label-matrix label .ans {
		display: none;
	}
}
.sub-quest {
	display: grid;
	grid-template-columns: 200px minmax(0, 1fr);
	width: 100%;
	background-color: #ededed;
	padding: 0;
	gap: 8px;
	align-items: center;
	border-radius: 8px;
	margin-bottom: 4px;
}
.sub-quest.form-group {
	display: grid;
}
@media screen and (max-width: 1199.98px) {
	.sub-quest {
		flex-wrap: wrap;
	}
	.sub-quest span {
		width: 100%;
		display: block;
		margin-bottom: .5rem;
	}
	/* 平板/手機：隱藏模擬的 radio 圓鈕，只顯示虛線框＋文字 */
	.label_box.label-matrix .x-radio,
	.x-pg-row-form-block .sub-quest-box .label_box.label-matrix .x-radio,
	.score-level .score-level__scales {
		display: none !important;
	}
	.score-level {
		display: none;
	}
	/* 表頭隱藏後，第一列 sub-quest 還原上方圓角 */
	.score-level + .sub-quest {
		border-top-left-radius: 8px;
		border-top-right-radius: 8px;
	}
	.sub-quest {
		display: flex;
		flex-direction: column;
	}
	.label_box.label-matrix {
		display: flex;
		width: 100%;
		flex-wrap: wrap;
		gap: 4px;
		padding: 0 8px 8px;
	}
	/* 手機：選項層改單欄整列堆疊，避免被壓成一字寬直向斷行 */
	.sub-quest .label_box.label-matrix > .d-flex {
		grid-auto-flow: row;
		grid-template-columns: 1fr;
		grid-auto-columns: auto;
	}
	.label_box.label-matrix label {
		flex-grow: 1;
		outline: 1px dashed #979797;
		background-color: #fff;
		width: 100%;
	}
	.label_box.label-matrix label .d-flex.gap-3 {
		justify-content: start;
		width: 100%;
		gap: 0 !important;
	}
	.label_box.label-matrix input[type="radio"]:checked+label {
		outline: 1px solid var(--bs-danger);
		background-color: #f9f4e5;
		font-weight: 700;
	}
	.sub-quest__title {
		width: 100%;
	}
}

/* ===== 感謝頁區塊（thankYouBlock）— 主題色 + 可調方塊樣式 ===== */
.x-pg-row-thank-you {
	overflow: hidden;
	border: 1px solid rgba(0, 0, 0, 0.06);
	--x-pg-thank-you-primary: #667eea;
	--x-pg-thank-you-primary-strong: #4f46e5;
	--x-pg-thank-you-primary-soft: rgb(241, 248, 254);
	--x-pg-thank-you-primary-text: #ffffff;
	--x-pg-thank-you-body-bg: transparent;
}
.x-pg-thank-you-header {
	--x-pg-row-title: var(--x-pg-thank-you-header-title, #1e293b);
	--x-pg-row-text: var(--x-pg-thank-you-header-text, #1e293b);
	--x-pg-row-text-muted: var(--x-pg-thank-you-header-text-muted, #64748b);
	--x-pg-text: var(--x-pg-thank-you-header-text, #1e293b);
	--x-pg-text-muted: var(--x-pg-thank-you-header-text-muted, #64748b);
	background-color: var(--x-pg-thank-you-primary-soft, rgb(241, 248, 254));
	padding: 2rem 1.5rem 1.5rem;
	border-radius: 8px;
}
.x-pg-thank-you-body {
	background-color: var(--x-pg-thank-you-body-bg, transparent);
	padding: 1rem 1.5rem 1.5rem;
}
.x-pg-thank-you-footer {
	background-color: var(--x-pg-thank-you-primary-soft, rgb(241, 248, 254));
	padding: 1rem 1.5rem 1.25rem;
	border-radius: 8px;
	text-align: center;
}
.x-pg-row-thank-you.x-pg-row-no-radius .x-pg-thank-you-header,
.x-pg-row-thank-you.x-pg-row-no-radius .x-pg-thank-you-footer {
	border-radius: 0;
}
.x-pg-thank-you-footer-text {
	margin: 0;
	font-size: 0.9375rem;
	color: var(--x-pg-row-text-muted, var(--text-muted, #888888));
	line-height: 1.5;
}
.x-pg-thank-you-block-header {
	--x-pg-thank-you-check-color: var(--x-pg-thank-you-primary, #2563eb);
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
	padding: 0;
}
.x-pg-thank-you-preview-focus-area {
	position: relative;
	width: 100%;
	border-radius: 8px;
}
.x-pg-preview-content-wrapper .x-pg-thank-you-preview-focus-area[data-editor-preview-section="true"]:hover,
.x-pg-preview-content-wrapper .x-pg-thank-you-preview-focus-area[data-editor-preview-section="true"].x-pg-preview-boundary-active,
.x-pg-preview-content-wrapper .x-pg-thank-you-preview-focus-area[data-editor-preview-section="true"].x-pg-preview-highlight {
	outline: 1px solid rgba(34, 197, 94, 0.45);
	box-shadow: none;
}
.x-pg-preview-content-wrapper .x-pg-thank-you-preview-focus-area[data-editor-preview-section="true"]:hover::before,
.x-pg-preview-content-wrapper .x-pg-thank-you-preview-focus-area[data-editor-preview-section="true"].x-pg-preview-boundary-active::before,
.x-pg-preview-content-wrapper .x-pg-thank-you-preview-focus-area[data-editor-preview-section="true"].x-pg-preview-highlight::before {
	background: rgba(22, 163, 74, 0.92);
}
.x-pg-thank-you-block .x-pg-thank-you-title {
	font-size: 1.5rem;
	font-weight: 700;
	letter-spacing: -0.02em;
	line-height: 1.35;
	color: var(--x-pg-row-title, var(--x-pg-text, #1e293b));
	margin-bottom: 0.5rem;
}
.x-pg-thank-you-block .x-pg-thank-you-message {
	line-height: 1.6;
	font-size: 0.9375rem;
	color: var(--x-pg-row-text, var(--x-pg-text, #334155));
}
.x-pg-thank-you-block .x-pg-thank-you-message.x-pg-page-description,
.x-pg-thank-you-email-text.x-pg-page-description {
	padding-top: 0;
	padding-bottom: 0;
}
.x-pg-thank-you-block .x-pg-thank-you-message > :first-child,
.x-pg-thank-you-email-text > :first-child {
	margin-top: 0;
}
.x-pg-thank-you-block .x-pg-thank-you-message > :last-child,
.x-pg-thank-you-email-text > :last-child {
	margin-bottom: 0;
}
.x-pg-thank-you-block .x-pg-thank-you-secondary {
	line-height: 1.5;
	font-size: 0.9375rem;
	color: var(--x-pg-row-text-muted, var(--text-muted, #888888));
	margin-bottom: 0;
}
.x-pg-thank-you-align-left .x-pg-thank-you-title,
.x-pg-thank-you-align-left .x-pg-thank-you-message,
.x-pg-thank-you-align-left .x-pg-thank-you-secondary,
.x-pg-thank-you-align-left .x-pg-thank-you-footer-text {
	text-align: left;
}
.x-pg-thank-you-align-center .x-pg-thank-you-title,
.x-pg-thank-you-align-center .x-pg-thank-you-message,
.x-pg-thank-you-align-center .x-pg-thank-you-secondary,
.x-pg-thank-you-align-center .x-pg-thank-you-footer-text {
	text-align: center;
}
.x-pg-row-thank-you [data-show-if][hidden],
.x-pg-row-thank-you [data-show-unless][hidden] {
	display: none !important;
}
.x-pg-row-thank-you [data-show-if="survey_scoring_report"]:has([data-x-pg-result-score][data-x-pg-placeholder="true"]),
.x-pg-row-thank-you [data-show-if="survey_categorization_report"]:has([data-x-pg-result-category][data-x-pg-placeholder="true"]) {
	display: none !important;
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) {
	border: 0;
	/* 得分版固定用專屬漸層背景；!important 用來壓過元件在 row 上寫的行內 background（自訂方塊底色），
	   否則行內樣式會贏過此規則，導致漸層消失、白色標題印在白底上看不見。 */
	background:
		radial-gradient(circle at 18% 19%, rgba(255, 255, 255, 0.42) 0 1px, transparent 2px),
		radial-gradient(circle at 32% 12%, rgba(255, 255, 255, 0.7) 0 2px, transparent 3px),
		radial-gradient(circle at 64% 14%, rgba(255, 255, 255, 0.58) 0 2px, transparent 3px),
		radial-gradient(circle at 86% 21%, rgba(255, 255, 255, 0.48) 0 2px, transparent 3px),
		radial-gradient(circle at 50% 11%, rgba(255, 255, 255, 0.22), transparent 18%),
		linear-gradient(135deg,
			color-mix(in srgb, var(--x-pg-thank-you-primary, #2f7cf6) 90%, #ffffff) 0%,
			var(--x-pg-thank-you-primary, #2f7cf6) 48%,
			color-mix(in srgb, var(--x-pg-thank-you-primary, #2f7cf6) 88%, #000000) 100%) !important;
	box-shadow: 0 16px 36px color-mix(in srgb, var(--x-pg-thank-you-primary, #2563eb) 20%, transparent);
	padding: clamp(1.75rem, 4vw, 3rem) clamp(1rem, 3vw, 2rem) 2rem;
}
/* 得分版白卡／內容區固定用深色文字，覆蓋 row 行內的 --x-pg-row-* 對比色變數
   （那些變數是依方塊底色算的，套到白卡上可能變白字而看不見）。 */
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]),
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-body {
	--x-pg-row-title: #0f172a;
	--x-pg-row-text: #334155;
	--x-pg-row-text-muted: #64748b;
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-header {
	position: relative;
	overflow: hidden;
	background: transparent;
	padding: 0;
	border-radius: 0;
	box-shadow: none;
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-header::before {
	content: "";
	position: absolute;
	inset: -1.5rem -0.5rem auto;
	height: 210px;
	/* 散落的小紙花（短斜段）＋亮點；集中在頂部與兩側，避開中央標題區，取代原本過大的斜條 */
	background-image:
		linear-gradient(50deg, transparent 41%, #ffd166 41% 59%, transparent 59%),
		linear-gradient(125deg, transparent 42%, #ff8fb1 42% 58%, transparent 58%),
		linear-gradient(80deg, transparent 43%, #8ab4ff 43% 57%, transparent 57%),
		linear-gradient(150deg, transparent 42%, #5fd0a6 42% 58%, transparent 58%),
		linear-gradient(35deg, transparent 43%, #c4a6f5 43% 57%, transparent 57%),
		linear-gradient(100deg, transparent 43%, #ff9e7a 43% 57%, transparent 57%),
		linear-gradient(62deg, transparent 43%, #ffd166 43% 57%, transparent 57%),
		linear-gradient(135deg, transparent 43%, #8ab4ff 43% 57%, transparent 57%),
		linear-gradient(72deg, transparent 43%, #ff8fb1 43% 57%, transparent 57%),
		linear-gradient(118deg, transparent 43%, #5fd0a6 43% 57%, transparent 57%),
		radial-gradient(circle, rgba(255, 255, 255, 0.9) 0 2px, transparent 3px),
		radial-gradient(circle, rgba(255, 255, 255, 0.8) 0 2px, transparent 3px),
		radial-gradient(circle, rgba(255, 255, 255, 0.7) 0 2px, transparent 3px);
	background-repeat: no-repeat;
	background-size:
		30px 30px, 28px 28px, 26px 26px, 30px 30px, 26px 26px, 28px 28px,
		24px 24px, 26px 26px, 24px 24px, 28px 28px, 10px 10px, 9px 9px, 8px 8px;
	background-position:
		8% 24%, 16% 52%, 22% 16%, 84% 20%, 90% 48%, 95% 26%,
		30% 10%, 70% 10%, 82% 64%, 12% 70%, 40% 12%, 60% 14%, 50% 40%;
	opacity: 0.9;
	pointer-events: none;
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-block-header,
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-preview-focus-area {
	position: relative;
	z-index: 1;
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-block-header {
	display: flex;
	flex-direction: column;
	align-items: center;
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-block-header::before {
	content: "測驗完成！";
	display: block;
	order: 2;
	margin: 0.15rem auto 0;
	color: #ffffff;
	font-size: clamp(1.2rem, 2.6vw, 1.7rem);
	font-weight: 800;
	line-height: 1.2;
	text-align: center;
	text-shadow: 0 4px 24px rgba(30, 64, 175, 0.28);
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-block-header::after {
	content: "恭喜你完成測驗，以下是你的專屬結果";
	display: block;
	order: 3;
	margin: 0.6rem auto 1.6rem;
	color: #ffffff;
	font-size: clamp(0.8rem, 1.6vw, 0.95rem);
	font-weight: 600;
	line-height: 1.5;
	text-align: center;
	text-shadow: 0 2px 18px rgba(30, 64, 175, 0.28);
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-check {
	order: 1;
	width: 72px;
	height: 72px;
	margin-bottom: 1.15rem;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.96);
	color: var(--x-pg-thank-you-primary, #2563eb);
	box-shadow: 0 6px 16px color-mix(in srgb, var(--x-pg-thank-you-primary, #2563eb) 26%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-check-svg {
	width: 40px;
	height: 40px;
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-check-circle,
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-check-path {
	animation: none;
	stroke-dashoffset: 0;
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-preview-focus-area[data-preview-field="content"] {
	order: 4;
}
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message {
	text-align: left;
}
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) {
	max-width: 900px;
	margin-left: auto;
	margin-right: auto;
	padding: clamp(1.6rem, 4vw, 2.75rem) clamp(1.4rem, 4vw, 3.4rem);
	/* 只圓上緣，下緣切平，與下方 body 白卡無縫接成同一張卡 */
	border-radius: 24px 24px 0 0;
	background: rgba(255, 255, 255, 0.98);
	box-shadow: 0 30px 70px rgba(31, 41, 55, 0.24);
}
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message {
	position: relative;
	max-width: 760px;
	margin-left: auto;
	margin-right: auto;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	font-size: 1rem;
	line-height: 1.78;
	/* 得分版內容是結構化 <p>/<h3> HTML；關掉 .x-pg-page-description 的 pre-line，
	   否則段落間原始碼換行會被額外渲染成空行、疊加在段落 margin 上造成過大間距 */
	white-space: normal;
}
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"])::after {
	content: "";
	display: block;
	height: 1px;
	max-width: 100%;
	margin: 1.8rem auto 0;
	background: rgba(203, 213, 225, 0.75);
}
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message > p:first-child {
	display: block;
	margin: 0 auto 1.75rem;
	padding: 0;
	border-radius: 0;
	background: transparent;
	color: var(--x-pg-row-text-muted, #64748b);
	box-shadow: none;
	font-size: 0.78rem;
	font-weight: 700;
	line-height: 1.45;
	letter-spacing: 0.08em;
	text-align: center;
}
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message > p:first-child:has([data-x-pg-result-score][data-x-pg-placeholder="true"], [data-x-pg-result-category][data-x-pg-placeholder="true"]) {
	display: none;
}
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message > p:first-child :is([data-x-pg-result-score], [data-x-pg-result-category]):not([data-x-pg-placeholder="true"]) {
	display: inline-block;
	margin-top: 0.4rem;
	padding-bottom: 0.3rem;
	color: var(--x-pg-row-title, #0f172a);
	font-size: clamp(1.6rem, 3.2vw, 2.4rem);
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: 0;
	/* 以主題色虛線底線做視覺區隔（字色維持深色以確保各主題下都清楚可讀） */
	border-bottom: 2px dashed var(--x-pg-thank-you-primary, #2563eb);
}
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) :is([data-x-pg-result-score], [data-x-pg-result-category], [data-x-pg-result-explanation])[data-x-pg-placeholder="true"] {
	display: none;
}
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message [data-x-pg-result-explanation] {
	max-width: 720px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
}
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message > p:nth-child(2):empty,
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message > p:nth-child(2):has([data-x-pg-result-explanation]:empty),
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message > p:nth-child(2):has([data-x-pg-result-explanation][data-x-pg-placeholder="true"]),
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message > div[data-x-pg-result-explanation]:empty,
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message > div[data-x-pg-result-explanation][data-x-pg-placeholder="true"] {
	display: none;
}
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message h3 {
	margin: 2.2rem 0 0.9rem;
	padding-left: 1.05rem;
	border-left: 0;
	color: var(--x-pg-row-title, #1e293b);
	font-size: clamp(1.25rem, 2.4vw, 1.65rem);
	font-weight: 800;
	line-height: 1.25;
	position: relative;
}
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message h3::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.18em;
	width: 5px;
	height: 1.15em;
	border-radius: 999px;
	background: linear-gradient(180deg, var(--x-pg-thank-you-primary, #377cf6), var(--x-pg-thank-you-primary-strong, #875cf6));
}
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message h3:first-of-type {
	margin-top: 2rem;
}
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message strong {
	color: var(--x-pg-row-title, #1e293b);
	font-weight: 800;
}
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message > p {
	margin: 0.72rem 0;
	color: var(--x-pg-row-text, #334155);
}
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message [data-x-pg-result-explanation] p {
	margin: 0.72rem 0;
	color: var(--x-pg-row-text, #334155);
	text-align: left;
}
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message > p:has(> strong:only-child) {
	margin-top: 1rem;
	padding: 0;
	border-radius: 0;
	background: transparent;
	color: var(--x-pg-row-title, #1e293b);
	font-size: 1rem;
}
.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message [data-x-pg-result-explanation] p:has(> strong:only-child) {
	margin: 0.25rem 0 1.45rem;
	color: var(--x-pg-row-title, #1e293b);
	font-size: 1.12rem;
	line-height: 1.55;
	text-align: center;
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-body {
	max-width: 900px;
	margin: -1.25rem auto 0;
	padding: 0 clamp(1.4rem, 4vw, 3.4rem) clamp(1.6rem, 4vw, 2.6rem);
	border-radius: 0 0 24px 24px;
	background: rgba(255, 255, 255, 0.98);
	box-shadow: 0 30px 70px rgba(31, 41, 55, 0.2);
	display: flex;
	flex-direction: column;
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-body [data-preview-field="emailHint"] {
	order: 2;
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-email-hint {
	max-width: 760px;
	margin-left: auto;
	margin-right: auto;
	padding: 1.35rem 0 0;
	border-radius: 0;
	background: transparent;
	justify-content: center;
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-email-icon-wrap {
	width: 44px;
	height: 44px;
	background: color-mix(in srgb, var(--x-pg-thank-you-primary, #2563eb) 12%, #ffffff);
	border: 1px solid color-mix(in srgb, var(--x-pg-thank-you-primary, #2563eb) 32%, #ffffff);
	padding: 0.55rem;
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-email-text {
	flex: initial;
	color: var(--x-pg-row-text, #334155);
	font-size: 0.92rem;
	line-height: 1.45;
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-separator {
	display: none;
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-buttons {
	order: 1;
	max-width: 640px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 1.8rem;
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-buttons .btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	min-height: 54px;
	border-radius: 12px;
	font-weight: 700;
	font-size: 1rem;
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-buttons .btn-primary {
	background: var(--x-pg-thank-you-primary, #2563eb);
	border-color: var(--x-pg-thank-you-primary, #2563eb);
	color: var(--x-pg-thank-you-primary-text, #ffffff);
	box-shadow: none;
}
.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-buttons .btn-outline-primary {
	background: rgba(255, 255, 255, 0.9);
	border-color: var(--x-pg-thank-you-primary, #2563eb);
	color: var(--x-pg-thank-you-primary, #2563eb);
}
.x-pg-thank-you-align-right .x-pg-thank-you-title,
.x-pg-thank-you-align-right .x-pg-thank-you-message,
.x-pg-thank-you-align-right .x-pg-thank-you-secondary,
.x-pg-thank-you-align-right .x-pg-thank-you-footer-text {
	text-align: right;
}
.x-pg-thank-you-check {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 1.25rem;
	color: var(--x-pg-thank-you-check-color, #2563eb);
}
.x-pg-thank-you-check-svg {
	width: 56px;
	height: 56px;
}
.x-pg-thank-you-check-circle {
	stroke-dasharray: 188;
	stroke-dashoffset: 188;
	animation: x-pg-thank-you-circle 3s ease-in-out infinite;
}
.x-pg-thank-you-check-path {
	stroke-dasharray: 50;
	stroke-dashoffset: 50;
	animation: x-pg-thank-you-path 3s ease-in-out infinite;
}
@keyframes x-pg-thank-you-circle {
	0% { stroke-dashoffset: 188; }
	16.67% { stroke-dashoffset: 0; }
	83.33% { stroke-dashoffset: 0; }
	100% { stroke-dashoffset: 188; }
}
@keyframes x-pg-thank-you-path {
	0% { stroke-dashoffset: 50; }
	13.33% { stroke-dashoffset: 50; }
	25% { stroke-dashoffset: 0; }
	83.33% { stroke-dashoffset: 0; }
	100% { stroke-dashoffset: 50; }
}
.x-pg-thank-you-email-hint {
	display: flex;
	align-items: center;
	gap: 1rem;
	text-align: left;
	padding: 0;
	margin: 0;
	max-width: 100%;
	justify-content: flex-start;
}
.x-pg-thank-you-email-icon-wrap {
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	border-radius: 50%;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	background: transparent;
}
.x-pg-thank-you-email-icon {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.x-pg-thank-you-email-text {
	flex: 1;
	font-size: 0.875rem;
	line-height: 1.5;
	color: var(--x-pg-row-text, #475569);
	min-width: 0;
}
.x-pg-thank-you-align-left .x-pg-thank-you-email-hint {
	margin-left: 0;
	margin-right: auto;
	justify-content: flex-start;
}
.x-pg-thank-you-align-center .x-pg-thank-you-email-hint {
	margin-left: 0;
	margin-right: auto;
	justify-content: flex-start;
}
.x-pg-thank-you-align-right .x-pg-thank-you-email-hint {
	margin-left: 0;
	margin-right: auto;
	justify-content: flex-start;
}
.x-pg-thank-you-email-note {
	color: rgb(218, 98, 0);
	font-weight: 700;
}
.x-pg-thank-you-separator {
	height: 0;
	border-top: 1px dashed rgba(148, 163, 184, 0.45);
	margin: 1rem 0;
}
/* 問卷得分版（HookSurveys）：編輯器預覽切換鈕（僅編輯器顯示，不輸出） */
.x-pg-thank-you-grade-switch {
	display: flex;
	justify-content: center;
	gap: 0.5rem;
	margin-bottom: 0.75rem;
}
.x-pg-thank-you-grade-switch .btn {
	padding: 0.2rem 0.85rem;
	border-radius: 999px;
	font-size: 0.8125rem;
}
/* 得分版內容（編輯器示意 + 發佈輸出共用） */
.x-pg-thank-you-grade-cta {
	margin-top: 2rem;
	text-align: center;
}
.x-pg-thank-you-grade-cta-btn {
	min-height: 48px;
	padding: 0.65rem 2rem;
	font-weight: 700;
	border-radius: 10px;
	background: var(--x-pg-thank-you-primary, #2563eb);
	border-color: var(--x-pg-thank-you-primary, #2563eb);
	color: var(--x-pg-thank-you-primary-text, #ffffff);
	box-shadow: 0 5px 14px color-mix(in srgb, var(--x-pg-thank-you-primary, #2563eb) 30%, transparent);
}
.x-pg-thank-you-grade-cta-btn:hover,
.x-pg-thank-you-grade-cta-btn:focus {
	background: color-mix(in srgb, var(--x-pg-thank-you-primary, #2563eb) 90%, #000000);
	border-color: color-mix(in srgb, var(--x-pg-thank-you-primary, #2563eb) 90%, #000000);
	color: var(--x-pg-thank-you-primary-text, #ffffff);
	box-shadow: 0 7px 18px color-mix(in srgb, var(--x-pg-thank-you-primary, #2563eb) 32%, transparent);
}

@media (max-width: 768px) {
	.x-pg-thank-you-header {
		padding: 1.5rem 1rem 1.2rem;
	}
	.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-header {
		padding: 1rem;
		border-radius: 14px;
	}
	.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message {
		max-width: 100%;
		padding: 1.15rem;
		border-radius: 14px;
		font-size: 0.92rem;
		line-height: 1.68;
	}
	.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message > p:first-child {
		margin-bottom: 1.35rem;
		font-size: 0.72rem;
	}
	.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message > p:first-child :is([data-x-pg-result-score], [data-x-pg-result-category]):not([data-x-pg-placeholder="true"]) {
		font-size: clamp(1.35rem, 6.5vw, 1.9rem);
	}
	.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message h3 {
		font-size: 1.12rem;
	}
	.x-pg-row-thank-you :is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]) .x-pg-thank-you-message [data-x-pg-result-explanation] {
		max-width: 100%;
	}
	.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-body {
		padding: 1rem 1rem 1.5rem;
	}
	.x-pg-row-thank-you:has(:is([data-show-if="survey_scoring_report"], [data-show-if="survey_categorization_report"]):not([hidden])) .x-pg-thank-you-email-hint {
		padding: 0.9rem;
		border-radius: 12px;
	}
}
.x-pg-thank-you-grade-hint {
	margin-top: 0.75rem;
	font-size: 0.75rem;
	color: #94a3b8;
	text-align: center;
}
.x-pg-thank-you-buttons {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.75rem;
	align-items: center;
}
/* 方塊尺寸為中等/全滿時，按鈕區維持標準尺寸（800px 容器扣除 body 內距）的寬度並置中，不隨容器一起變寬 */
.x-pg-x-container.x-pg-container-medium .x-pg-thank-you-buttons,
.x-pg-x-container.x-pg-container-full .x-pg-thank-you-buttons {
	max-width: calc(800px - 3rem);
	margin-left: auto;
	margin-right: auto;
}
.x-pg-thank-you-buttons .btn {
	min-height: 44px;
	padding: 0.5rem 1.25rem;
	font-weight: 500;
	border-radius: 8px;
	flex: 1;
	min-width: 120px;
	max-width: 100%;
}
.x-pg-thank-you-buttons .btn-primary {
	background-color: var(--x-pg-thank-you-primary, #2563eb);
	border-color: var(--x-pg-thank-you-primary, #2563eb);
	color: var(--x-pg-thank-you-primary-text, #ffffff);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}
.x-pg-thank-you-buttons .btn-primary:hover,
.x-pg-thank-you-buttons .btn-primary:focus {
	background-color: color-mix(in srgb, var(--x-pg-thank-you-primary, #2563eb) 90%, #000000);
	border-color: color-mix(in srgb, var(--x-pg-thank-you-primary, #2563eb) 90%, #000000);
	color: var(--x-pg-thank-you-primary-text, #ffffff);
}
.x-pg-thank-you-buttons .btn-outline-primary {
	border-color: var(--x-pg-thank-you-primary, #2563eb);
	color: var(--x-pg-thank-you-primary, #2563eb);
}
.x-pg-thank-you-buttons .btn-outline-primary:hover {
	background-color: var(--x-pg-thank-you-primary, #2563eb);
	border-color: var(--x-pg-thank-you-primary, #2563eb);
	color: var(--x-pg-thank-you-primary-text, #ffffff);
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}
.x-pg-share-modal {
	z-index: 1060;
}
.x-pg-share-modal .modal-backdrop {
	z-index: 1055;
}
.x-pg-share-modal .modal-dialog {
	z-index: 1061;
}

/* ----- gmap 地圖區（from xlead） ----- */
.x-pg-row .gmap,
.x-pg-row #g-map.gmap {
	padding: 0rem 2rem;
	min-height: 300px;
}
.x-pg-row .map_info,
.x-pg-row .address_highlight {
	background-color: #cacaca15;
	padding: 1.5rem 1rem;
	border-radius: 6px;
}
.x-pg-row .address_highlight {
	background-color: rgba(255, 255, 255, 0.603);
	padding: 1rem;
	margin-bottom: 1rem;
	border-left: 4px solid #e57738;
	border-radius: 0 6px 6px 0;
}
.x-pg-row .map_info > div:not(.address_highlight) {
	padding: 1rem;
	background-color: rgba(255, 255, 255, 0.103);
}

/* 活動詳情區：活動設定「開啟編輯」按鈕進場閃爍 2 秒 */
@keyframes x-pg-session-drawer-flash {
	0%, 100% {
		box-shadow: 0 0 0 0 rgba(var(--bs-primary-rgb, 240, 118, 47), 0);
	}
	50% {
		box-shadow: 0 0 0 4px rgba(var(--bs-primary-rgb, 240, 118, 47), 0.5);
	}
}
.x-pg-session-drawer-btn-flash {
	animation: x-pg-session-drawer-flash 1s ease-in-out 2;
}

/* 開啟編輯 Modal（活動簡介／活動條款）：偏上顯示 */
.modal.terms-edit-modal {
	display: flex;
	align-items: flex-start;
	padding-top: 8vh;
}
.modal.terms-edit-modal .modal-dialog {
	margin-top: 0;
	max-height: calc(90vh - 8vh);
}
.modal.terms-edit-modal .modal-content {
	max-height: 100%;
	display: flex;
	flex-direction: column;
}
.modal.terms-edit-modal .modal-body {
	overflow-y: auto;
}

/* ----- booking / datepicker（從 booking.css 併回） ----- */
.flatpickr-calendar.open {
	z-index: 16000163;
}

.booking .hor .main-pic {
	height: calc(100vh - 52px);
	position: relative;
	border-radius: 0 0 120px 0;
	overflow: hidden;
}

.booking-select {
	flex-grow: 1;
	padding: 4px 8px;
	border-right: 1px solid #f5f5f5;
}

.booking-select.booking-cal {
	max-width: 220px;
}

.x-pg-row-form-block #venue-date-select-div,
.merge-form #venue-date-select-div,
.offcanvas-body #venue-date-select-div {
	display: flex !important;
	flex-direction: row !important;
	align-items: flex-end;
	gap: 14px;
	flex-wrap: nowrap;
	width: 100%;
}

.x-pg-row-form-block #venue-date-select-div > .booking-select,
.merge-form #venue-date-select-div > .booking-select,
.offcanvas-body #venue-date-select-div > .booking-select {
	position: relative;
	flex: 1 1 0;
	min-width: 0;
	padding: 0;
	border-right: 0;
}

.x-pg-row-form-block #venue-date-select-div > .booking-select.booking-cal,
.merge-form #venue-date-select-div > .booking-select.booking-cal,
.offcanvas-body #venue-date-select-div > .booking-select.booking-cal {
	max-width: none;
	flex: 1 1 0;
}

.x-pg-row-form-block #venue-date-select-div > .booking-select.booking-time,
.merge-form #venue-date-select-div > .booking-select.booking-time,
.offcanvas-body #venue-date-select-div > .booking-select.booking-time {
	flex: 1 1 0;
}

.x-pg-row-form-block #venue-date-select-div > .booking-select.booking-cal::after,
.merge-form #venue-date-select-div > .booking-select.booking-cal::after,
.offcanvas-body #venue-date-select-div > .booking-select.booking-cal::after {
	content: "";
	position: absolute;
	top: 0;
	right: -7px;
	width: 1px;
	height: 100%;
	background: #e5e7eb;
	pointer-events: none;
	z-index: 2;
}

.booking-select:last-child {
	border: 0;
}

.booking-select:first-child {
	padding-left: 0;
}

/* 預約表單的小標題（請選擇／日期／時段）統一：較小字、同色，較美觀。
   涵蓋已發佈頁（server 帶入的 hook_booking_items 標題與本編輯器輸出的日期/時段）
   及編輯器預覽（頁面模擬）。 */
.x-pg-row-form-block [data-merge="hook_booking_items"] > p,
.merge-form [data-merge="hook_booking_items"] > p,
.offcanvas-body [data-merge="hook_booking_items"] > p,
#hook-booking-items > span,
.booking-select > span {
	font-size: 15px !important;
	line-height: 1.4;
	font-weight: 400;
	color: #6c757d !important;
}

/* 「請選擇…」標題下方留白 */
.x-pg-row-form-block [data-merge="hook_booking_items"] > p,
.merge-form [data-merge="hook_booking_items"] > p,
.offcanvas-body [data-merge="hook_booking_items"] > p,
#hook-booking-items > span {
	margin-bottom: 0.75rem !important;
}

.booking-type-box label {
	font-size: 13px;
	color: var(--bs-gray-500, #A1A5B7);
	outline: 1px solid var(--bs-gray-500, #A1A5B7);
	padding: 2px 6px;
	border-radius: 4px;
	margin-right: 4px;
}

.booking-type-box input[type="radio"]:checked+label {
	color: var(--bs-danger, #F0762F);
	outline-color: var(--bs-danger, #F0762F);
	font-weight: 600;
}

input[type="radio"].stop-booking {
	cursor: not-allowed;
	pointer-events: none;
}

input[type="radio"].stop-booking+label,
input[type="radio"].stop-booking+label:hover {
	background-color: #f5f5f5;
	cursor: not-allowed;
	outline: 1px dashed #979797;
}

input[type="radio"].stop-booking+label p {
	color: #979797;
}

#venue-date-select-div,
#professional-date-select-div,
.booking input[type="radio"],
input[type="radio"].booking-step+.booking-step-content,
.booking .quest .label_box input[type="radio"] {
	display: none;
}

.booking .quest input[type="radio"] {
	display: initial;
}

input[type="radio"]:checked.booking-step+.booking-step-content,
.booking-step-content #time-date-select-div {
	display: block;
}

.booking-step-content {
	margin-bottom: 16px;
}

.booking-step-content #time-date-select-div #time-date-select {
	position: relative;
	z-index: 1;
	flex: 1 1 auto;
	width: 1%;
	min-width: 0;
	border: 0;
	background: transparent;
	padding: 8px 12px;
}

.x-pg-row-form-block .booking-select.booking-cal .input-group,
.merge-form .booking-select.booking-cal .input-group,
.offcanvas-body .booking-select.booking-cal .input-group {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	min-height: 40px;
}

.x-pg-row-form-block .booking-select.booking-cal .input-group .btn,
.merge-form .booking-select.booking-cal .input-group .btn,
.offcanvas-body .booking-select.booking-cal .input-group .btn {
	order: -1;
	flex: 0 0 44px;
	width: 44px;
	min-width: 44px;
	border: 0;
	border-right: 1px solid #e5e7eb;
	border-radius: 0;
	background: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
}

.x-pg-row-form-block .booking-select.booking-cal .input-group .form-control,
.merge-form .booking-select.booking-cal .input-group .form-control,
.offcanvas-body .booking-select.booking-cal .input-group .form-control {
	padding-left: 12px;
	padding-right: 12px;
	min-height: 40px;
}

.booking-type-box input[type="radio"]#booking-select-mode-time:checked+label~#time-date-select-div,
.booking-type-box input[type="radio"]#booking-select-mode-venue:checked+label~#venue-date-select-div,
.booking-type-box input[type="radio"]#booking-select-mode-professional:checked+label~#professional-date-select-div {
	display: flex;
}

.hor .booking-select,
.hor #time-date-select-div .booking-select:nth-child(2) {
	border: 0;
}

.hor #time-date-select-div .booking-select:last-of-type,
.hor #venue-date-select-div .booking-select:first-of-type {
	width: 100%;
	padding-left: 0;
}

.hor #venue-date-select-div .booking-select:nth-child(2) {
	padding-left: 0;
}

.bookingstep {
	background-color: var(--bs-light, #F5F5F5);
	padding: 8px 12px;
	border-radius: 12px;
	flex-grow: 1;
	cursor: pointer;
	color: var(--bs-gray-600, #7E8299);
}

.bookingstep .badge {
	background-color: var(--bs-gray-600, #7E8299);
	color: #fff;
}

.bookingstep.now {
	background-color: var(--bs-danger, #F0762F);
	color: #fff;
}

.bookingstep.now .badge {
	color: #D4601D;
	background-color: #fff;
}

.booking-toolbar {
	display: flex;
	width: 100%;
	border-top: 1px solid var(--bs-light, #F5F5F5);
	padding-top: 8px;
}

.inline-calendar {
	height: 0;
	padding: 0;
	margin: 0;
	border: 0;
	position: absolute;
	top: -500px;
}

.inline-calendar+.flatpickr-calendar.inline,
#time-date-select-div+.flatpickr-calendar.inline {
	top: 0;
	margin-bottom: 12px;
	border: 0;
	box-shadow: none;
	width: 100% !important;
	background-color: var(--bs-gray-100, #f5f8fa);
}

.inline-calendar+.flatpickr-calendar .flatpickr-innerContainer,
#time-date-select-div+.flatpickr-calendar .flatpickr-innerContainer {
	border-top: 1px solid var(--bs-gray-300, #dee2e6);
	padding-top: 4px;
}

.inline-calendar+.flatpickr-calendar .flatpickr-current-month,
#time-date-select-div+.flatpickr-calendar .flatpickr-current-month {
	padding-top: 0;
}

.label_box#timeslots {
	overflow-y: scroll;
	max-height: 320px;
	padding: 1rem;
}

.x-pg-row-form-block .booking-select #timeslots,
.merge-form .booking-select #timeslots,
.offcanvas-body .booking-select #timeslots {
	position: relative;
	display: block;
	width: 100%;
	box-sizing: border-box;
	border-radius: 10px;
	border: 1px solid #e5e7eb;
	background: #fff;
	overflow: hidden;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.x-pg-row-form-block .booking-select #timeslots::after,
.merge-form .booking-select #timeslots::after,
.offcanvas-body .booking-select #timeslots::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 16px;
	width: 10px;
	height: 10px;
	border-right: 2px solid #64748b;
	border-bottom: 2px solid #64748b;
	transform: translateY(-65%) rotate(45deg);
	pointer-events: none;
	opacity: 0.9;
}

.x-pg-row-form-block .booking-select #timeslots:focus-within,
.merge-form .booking-select #timeslots:focus-within,
.offcanvas-body .booking-select #timeslots:focus-within {
	border-color: var(--bs-primary);
	box-shadow: 0 0 0 3px rgba(var(--bs-primary-rgb), 0.12);
}

.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover {
	color: rgba(57, 57, 57, 0.2);
}

.flatpickr-day:not(.flatpickr-disabled):not(.prevMonthDay):not(.nextMonthDay):not(.selected):not(.startRange):not(.endRange):not(.inRange),
.flatpickr-day.today:not(.flatpickr-disabled):not(.prevMonthDay):not(.nextMonthDay):not(.selected):not(.startRange):not(.endRange):not(.inRange),
.flatpickr-day:hover:not(.flatpickr-disabled):not(.prevMonthDay):not(.nextMonthDay):not(.selected):not(.startRange):not(.endRange):not(.inRange),
.flatpickr-day:focus:not(.flatpickr-disabled):not(.prevMonthDay):not(.nextMonthDay):not(.selected):not(.startRange):not(.endRange):not(.inRange),
.flatpickr-day.today:hover:not(.flatpickr-disabled):not(.prevMonthDay):not(.nextMonthDay):not(.selected):not(.startRange):not(.endRange):not(.inRange),
.flatpickr-day.today:focus:not(.flatpickr-disabled):not(.prevMonthDay):not(.nextMonthDay):not(.selected):not(.startRange):not(.endRange):not(.inRange) {
	color: #1d4ed8 !important;
	font-weight: 600;
}

.flatpickr-day.prevMonthDay:not(.flatpickr-disabled):not(.selected):not(.startRange):not(.endRange):not(.inRange),
.flatpickr-day.nextMonthDay:not(.flatpickr-disabled):not(.selected):not(.startRange):not(.endRange):not(.inRange),
.flatpickr-day.prevMonthDay.today:not(.flatpickr-disabled):not(.selected):not(.startRange):not(.endRange):not(.inRange),
.flatpickr-day.nextMonthDay.today:not(.flatpickr-disabled):not(.selected):not(.startRange):not(.endRange):not(.inRange),
.flatpickr-day.prevMonthDay:hover:not(.flatpickr-disabled):not(.selected):not(.startRange):not(.endRange):not(.inRange),
.flatpickr-day.nextMonthDay:hover:not(.flatpickr-disabled):not(.selected):not(.startRange):not(.endRange):not(.inRange),
.flatpickr-day.prevMonthDay:focus:not(.flatpickr-disabled):not(.selected):not(.startRange):not(.endRange):not(.inRange),
.flatpickr-day.nextMonthDay:focus:not(.flatpickr-disabled):not(.selected):not(.startRange):not(.endRange):not(.inRange),
.flatpickr-day.prevMonthDay.today:hover:not(.flatpickr-disabled):not(.selected):not(.startRange):not(.endRange):not(.inRange),
.flatpickr-day.nextMonthDay.today:hover:not(.flatpickr-disabled):not(.selected):not(.startRange):not(.endRange):not(.inRange),
.flatpickr-day.prevMonthDay.today:focus:not(.flatpickr-disabled):not(.selected):not(.startRange):not(.endRange):not(.inRange),
.flatpickr-day.nextMonthDay.today:focus:not(.flatpickr-disabled):not(.selected):not(.startRange):not(.endRange):not(.inRange) {
	color: #93c5fd !important;
	font-weight: 500;
}

.booking .flatpickr-day.selected,
.booking .flatpickr-day.startRange,
.booking .flatpickr-day.endRange,
.booking .flatpickr-day.selected.inRange,
.booking .flatpickr-day.startRange.inRange,
.booking .flatpickr-day.endRange.inRange,
.booking .flatpickr-day.selected:focus,
.booking .flatpickr-day.startRange:focus,
.booking .flatpickr-day.endRange:focus,
.booking .flatpickr-day.selected:hover,
.booking .flatpickr-day.startRange:hover,
.booking .flatpickr-day.endRange:hover,
.booking .flatpickr-day.selected.prevMonthDay,
.booking .flatpickr-day.startRange.prevMonthDay,
.booking .flatpickr-day.endRange.prevMonthDay,
.booking .flatpickr-day.selected.nextMonthDay,
.booking .flatpickr-day.startRange.nextMonthDay,
.booking .flatpickr-day.endRange.nextMonthDay {
	background-color: var(--bs-danger, #F0762F);
	border-color: var(--bs-danger, #F0762F);
}

.booking-select #time-date-select {
	background-color: #fff;
	min-height: 40px;
}

.booking-select.booking-cal .form-label.small.text-muted.mb-2.d-block {
	display: flex !important;
	align-items: center;
	
}
.booking-select.booking-cal .input-group.flex-grow-1.input-group-sm {
	padding-top: 0;
	padding-bottom: 0;
}
.x-pg-row-form-block .booking-select #timeslots select,
.offcanvas-body .booking-select #timeslots select,
.merge-form .booking-select #timeslots select {
	width: 100%;
	min-height: 40px;
	padding: 10px 40px 10px 12px;
	border: none;
	border-radius: 0;
	background: transparent;
	color: #0f172a;
	font-size: 0.9375rem;
	font-weight: 400;
	line-height: 1.5;
	-webkit-appearance: none;
	appearance: none;
	outline: none;
	cursor: pointer;
	box-shadow: none;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.x-pg-row-form-block .booking-select #timeslots select:hover,
.offcanvas-body .booking-select #timeslots select:hover,
.merge-form .booking-select #timeslots select:hover {
	background: transparent;
}

.x-pg-row-form-block .booking-select #timeslots select:focus,
.x-pg-row-form-block .booking-select #timeslots select:focus-visible,
.offcanvas-body .booking-select #timeslots select:focus,
.offcanvas-body .booking-select #timeslots select:focus-visible,
.merge-form .booking-select #timeslots select:focus,
.merge-form .booking-select #timeslots select:focus-visible {
	box-shadow: none;
}

.x-pg-row-form-block .booking-select #timeslots select:disabled,
.offcanvas-body .booking-select #timeslots select:disabled,
.merge-form .booking-select #timeslots select:disabled {
	background: #f8fafc;
	color: #94a3b8;
	cursor: not-allowed;
	box-shadow: none;
}

.merge-form .booking-select #time-date-select {
	border-color: var(--bs-gray-200, #e9ecef);
}

@media screen and (max-width: 767.98px) {
	.booking .hor.hero_form {
		min-height: calc(70vh - 52px);
		border-radius: 0 0 1rem 1rem;
	}

	.booking .hor .main-pic {
		height: calc(50vh - 52px);
		position: relative;
		border-radius: 0;
		overflow: hidden;
	}

	.booking .hor .md-center {
		max-width: 80% !important;
		margin: 0 auto;
	}

	.label_box#timeslots {
		overflow-y: auto;
		max-height: initial;
	}
}

@media screen and (max-width: 991.98px) {
	#venue-date-select-div,
	.x-pg-row-form-block #venue-date-select-div,
	.merge-form #venue-date-select-div,
	.offcanvas-body #venue-date-select-div {
		flex-wrap: wrap;
		gap: 12px;
	}

	.booking-select {
		width: 100%;
		border-right: 0;
		padding-left: 0;
	}

	.booking-select.booking-cal,
	.booking-select.booking-time {
		max-width: 50%;
	}

	.merge-form .booking-select.booking-cal,
	.merge-form .booking-select.booking-time {
		max-width: 100%;
	}

		.x-pg-row-form-block #venue-date-select-div > .booking-select.booking-cal,
		.merge-form #venue-date-select-div > .booking-select.booking-cal,
		.offcanvas-body #venue-date-select-div > .booking-select.booking-cal {
			border-right: 0;
		}

		.x-pg-row-form-block #venue-date-select-div > .booking-select.booking-cal::after,
		.merge-form #venue-date-select-div > .booking-select.booking-cal::after,
		.offcanvas-body #venue-date-select-div > .booking-select.booking-cal::after {
			display: none;
		}
	}

@media screen and (max-width: 767.98px) {
	#venue-date-select-div,
	.x-pg-row-form-block #venue-date-select-div,
	.merge-form #venue-date-select-div,
	.offcanvas-body #venue-date-select-div {
		flex-direction: column !important;
		align-items: stretch;
	}

	.x-pg-row-form-block #venue-date-select-div > .booking-select.booking-cal,
	.x-pg-row-form-block #venue-date-select-div > .booking-select.booking-time,
	.merge-form #venue-date-select-div > .booking-select.booking-cal,
	.merge-form #venue-date-select-div > .booking-select.booking-time,
	.offcanvas-body #venue-date-select-div > .booking-select.booking-cal,
	.offcanvas-body #venue-date-select-div > .booking-select.booking-time {
		max-width: 100%;
		width: 100%;
		flex: 1 1 100%;
	}
}

/* 商品詳情：搬入 xlead.css 中 shopping 開頭的樣式 */
.shopping p {
	margin-bottom: 0;
}

.shopping .prd_pic {
	width: 100%;
	height: 100%;
	position: relative;
}

.shopping .prd_pic img {
	width: 100%;
	object-fit: contain;
	height: 100%;
	position: absolute;
}

.shopping .spec {
	border-radius: 12px;
	background-color: #F5F5F5;
	padding: 16px;
	gap: 12px;
}

.shopping .text p {
	font-size: 14px;
}

.shopping_count {
	width: 60px;
}

.shopping .button_area {
	display: flex;
}

.shopping .button_gap {
	display: block;
}

.shopping .button_gap button {
	width: 100%;
}

.shopping_area {
	border-radius: 6px;
	padding: 16px;
	background-color: #fff;
	margin-bottom: 16px;
}

.shopping_fee_note {
	padding: 6px 0;
	border-bottom: 1px solid #f7e0e0;
}

.shopping_area .option {
	outline: 2px solid #E4E6EF;
	background-color: #fff;
	padding: .85rem 1rem;
	text-align: center;
	border-radius: 6px;
	cursor: pointer;
	color: #000;
}

.shopping_area label {
	min-width: 80px;
}

/* 商品區塊：搬入 xlead.css 中 prd_box / sales_product_images / sales_qty_form 會用到的樣式 */
.x-pg-row-form-block .merge-source {
	display: none !important;
}

.x-pg-row-form-block .noshow_real {
	display: block !important;
}

.x-pg-row-form-block .noshow_editor {
	display: none !important;
}

.x-pg-row-form-block .borr12 {
	border-radius: 12px;
}

.x-pg-row-form-block .fz12 {
	font-size: 12px !important;
}

.x-pg-row-form-block .w-22px {
	width: 22px !important;
}

.x-pg-row-form-block .gap1r {
	gap: 1rem;
}

.gap1r {
	gap: .75rem;
}

.x-pg-row-form-block .top-n-10px {
	top: -10px;
}

.x-pg-row-form-block .pc-sticky {
	position: sticky;
	top: 10px;
}

.x-pg-row-form-block .tabet_phone-only {
	display: none !important;
}

.x-pg-row-form-block .prd_desc_text.pc-only,
.x-pg-row-form-block .moreinfo_box.pc-only {
	display: block !important;
}

.x-pg-row-form-block .button_area.pc-only {
	display: flex !important;
}

.x-pg-row-form-block .slick-prev,
.x-pg-row-form-block .slick-next,
.x-pg-row-form-block .slick-arrow.slick-prev,
.x-pg-row-form-block .slick-arrow.slick-next {
	height: 100%;
	width: 30px;
	background-color: transparent;
	z-index: 99;
}

.x-pg-row-form-block .slick-prev:hover,
.x-pg-row-form-block .slick-next:hover,
.x-pg-row-form-block .slick-prev:focus,
.x-pg-row-form-block .slick-next:focus,
.x-pg-row-form-block .slick-arrow.slick-prev:hover,
.x-pg-row-form-block .slick-arrow.slick-next:hover,
.x-pg-row-form-block .slick-arrow.slick-prev:focus,
.x-pg-row-form-block .slick-arrow.slick-next:focus {
	background-color: #979797ee;
}

.x-pg-row-form-block .slick-prev,
.x-pg-row-form-block .slick-arrow.slick-prev {
	left: 0;
	border-top-left-radius: 6px;
	border-bottom-left-radius: 6px;
}

.x-pg-row-form-block .slick-next,
.x-pg-row-form-block .slick-arrow.slick-next {
	right: 0;
	border-top-right-radius: 6px;
	border-bottom-right-radius: 6px;
}

.x-pg-row-form-block .slider-nav .slick-current,
.x-pg-row-form-block .addon-slider-nav .slick-current {
	border-bottom: 3px solid #d0d0d0ee;
}

.x-pg-row-form-block .slick-arrow::before {
	display: none;
}

.x-pg-row-form-block .slick-slider div,
.x-pg-row-form-block .slick-list div {
	position: relative;
}

.x-pg-row-form-block .slick-slider {
	overflow: hidden;
	border-radius: .625rem;
}

.x-pg-row-form-block .slick-slider.slider {
	padding: 0;
	background-color: none;
	overflow: initial;
	z-index: inherit !important;
}

.x-pg-row-form-block .slider-nav img,
.x-pg-row-form-block .addon-slider-nav img {
	position: absolute;
}

.x-pg-row-form-block .slick-slide div div {
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: 66.6667%;
	overflow: hidden;
}

.x-pg-row-form-block .slider div {
	cursor: pointer;
}

.x-pg-row-form-block .prd_pic {
	width: 100%;
	height: 100%;
	position: relative;
}

.x-pg-row-form-block .prd_pic img {
	width: 100%;
	object-fit: contain;
	height: 100%;
	position: absolute;
}

.x-pg-row-form-block .prd_box,
.x-pg-row-form-block.prd_box {
	justify-content: stretch;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

.x-pg-row-form-block .prd_desc p {
	margin-bottom: 0;
}

.x-pg-row-form-block .moreinfo_box {
	border-top: 1px solid #e7e7e7;
	margin-top: 10px;
}

.x-pg-row-form-block .moreinfo_box>div {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	font-size: 12px !important;
	border-color: #e7e7e7;
	border-width: 1px;
	border-style: solid;
	border-top: 0px;
	border-left: 0;
	border-right: 0;
	gap: 16px;
}

.x-pg-row-form-block .moreinfo_box .infolist {
	width: 82%;
	flex-grow: 1;
	min-width: 0;
}

.x-pg-row-form-block .moreinfo_box .infolist ul::before {
	display: none;
}

.x-pg-row-form-block .moreinfo_box ul {
	width: 100%;
	margin-bottom: 0 !important;
	padding-left: 0;
	color: #3F4254;
}

.x-pg-row-form-block .moreinfo_box .pay ul,
.x-pg-row-form-block .pay .infolist ul {
	flex-wrap: nowrap !important;
	overflow-x: auto;
}

.x-pg-row-form-block .moreinfo_box li {
	list-style: none;
	margin-bottom: 6px;
	flex: 0 0 auto;
}

.x-pg-row-form-block .moreinfo_box li:last-child {
	margin-bottom: 0;
}

.x-pg-row-form-block .shipping_fee,
.x-pg-row-form-block .pay,
.x-pg-row-form-block .shipping_area {
	padding-top: 16px;
	padding-bottom: 16px;
}

.x-pg-row-form-block .infolist span,
.x-pg-row-form-block .prd_highlight span {
	margin-right: 8px;
}

.x-pg-row-form-block .moreinfo_box>div:last-child {
	border-width: 0PX;
}

.x-pg-row-form-block .prd_highlight {
	font-size: 12px;
	font-weight: 700;
	color: #D4601D;
	width: 100%;
}

.x-pg-row-form-block .js_del::after {
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 50%;
	left: 0;
	background-color: #e57738;
}

.x-pg-row-form-block .pricespan.js_del::after,
.x-pg-row-form-block .prd_price .js_del::after {
	background-color: #bbb;
}

.x-pg-row-form-block #discounted-price-div p,
.x-pg-row-form-block .discounted-price-div p {
	display: inline-flex;
	gap: 4px;
	flex-wrap: wrap;
	align-items: end;
}

.x-pg-row-form-block #discounted-price-div .pricespan,
.x-pg-row-form-block .discounted-price-div .pricespan {
	line-height: 1.75rem;
}

.x-pg-row-form-block .prd_price {
	background-color: #fff;
}

.x-pg-row-form-block .prd_price div {
	min-width: 60px;
	padding-right: 1rem;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
}

.x-pg-row-form-block .prd_price p:not(.fs-3) {
	font-size: 1.1rem;
}

.x-pg-row-form-block .prd_price div span:not(.pricespan) {
	color: #777;
	font-size: 1rem;
}

.x-pg-row-form-block .prd_price div p:not(.fw-bolder) {
	color: #bbb;
}

.x-pg-row-form-block .prd_price div:not(:first-child) {
	border-left: 1px solid rgb(224, 224, 224);
}

.x-pg-row-form-block .product_count,
.x-pg-row-form-block .u_price,
.x-pg-row-form-block .product_spec {
	display: flex;
	flex-wrap: nowrap;
	padding: 16px;
	padding-left: 0;
	gap: 16px;
	border-bottom: 1px solid #e7e7e7;
	align-items: baseline;
}

.x-pg-row-form-block .product_count .form-select {
	max-width: 240px;
	padding-top: .5rem;
	padding-bottom: 0.5rem;
}

.x-pg-row-form-block .product_spec .flex-grow-1,
.x-pg-row-form-block .product_count .flex-grow-1,
.x-pg-row-form-block .u_price>div {
	min-width: 0;
}

.x-pg-row-form-block .product_spec .form-select {
	width: auto;
	max-width: 100%;
}

.x-pg-row-form-block .product_count .count {
	display: flex;
	align-items: stretch;
	gap: 4px;
}

.x-pg-row-form-block .product_spec p,
.x-pg-row-form-block .product_count p,
.x-pg-row-form-block .u_price p:not(.u_price_final) {
	font-size: 12px;
	color: #979797;
	margin-bottom: 0 !important;
}

.x-pg-row-form-block .product_count .d-inline-flex {
	gap: 8px;
}

.x-pg-row-form-block .u_price_final {
	font-size: 22px;
	color: #e57738;
	font-weight: 900;
	font-family: "Arial Black";
	display: inline-flex;
	align-items: center;
}

.x-pg-row-form-block .action_title,
.x-pg-row-form-block .moreinfo_title {
	max-width: 18%;
	min-width: 72px;
	flex: 0 0 72px;
	width: 14%;
	color: #979797;
	font-size: 12px;
}

.x-pg-row-form-block .count span {
	cursor: pointer;
}

.x-pg-row-form-block .minus,
.x-pg-row-form-block .plus {
	background: #f2f2f2;
	border-radius: 4px;
	border: 1px solid #ddd;
	display: inline-flex;
	text-align: center;
	padding: 6px 1rem;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	font-weight: bold;
	vertical-align: middle;
}

.x-pg-row-form-block .count input[type=number] {
	width: 60px;
	text-align: center;
	font-size: 1rem;
	border: 1px solid #ddd;
	border-radius: 4px;
	display: inline-block;
	vertical-align: middle;
	-moz-appearance: textfield;
}

.x-pg-row-form-block .count input[type=number]::-webkit-inner-spin-button,
.x-pg-row-form-block .count input[type=number]::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.x-pg-row-form-block .plus:hover,
.x-pg-row-form-block .minus:hover {
	cursor: pointer;
	background-color: #f0f0f0;
	border-radius: 3px;
}

.x-pg-row-form-block .button_area {
	display: flex;
	justify-content: center;
	margin-top: 28px;
	text-align: center;
}

.x-pg-row-form-block .button_area>span {
	display: block;
	width: 100%;
}

.x-pg-row-form-block .button_gap {
	display: block;
}

.x-pg-row-form-block .button_gap button {
	width: 100%;
}

.x-pg-row-form-block .slider-for,
.x-pg-row-form-block .addon-slider-for {
	margin-bottom: 16px;
}

.x-pg-row-form-block .slider-nav div,
.x-pg-row-form-block .addon-slider-nav div {
	width: 100%;
	height: 100%;
}

.x-pg-row-form-block .slider-nav img,
.x-pg-row-form-block .addon-slider-nav img {
	object-fit: contain;
	object-position: center;
	text-align: center;
	width: 100%;
	padding: 1rem;
	height: 100%;
}

.x-pg-preview-frame.tablet .x-pg-row-form-block .pc-only,
.x-pg-preview-frame.mobile .x-pg-row-form-block .pc-only {
	display: none !important;
}

.x-pg-preview-frame.tablet .x-pg-row-form-block .tabet_phone-only,
.x-pg-preview-frame.mobile .x-pg-row-form-block .tabet_phone-only {
	display: flex !important;
}

.x-pg-preview-frame.tablet .x-pg-row-form-block .prd_desc_text.tabet_phone-only,
.x-pg-preview-frame.mobile .x-pg-row-form-block .prd_desc_text.tabet_phone-only {
	flex-direction: row;
	flex-wrap: wrap;
	gap: 0;
	width: 100%;
}

.x-pg-preview-frame.tablet .x-pg-row-form-block .moreinfo_box.tabet_phone-only,
.x-pg-preview-frame.mobile .x-pg-row-form-block .moreinfo_box.tabet_phone-only {
	flex-direction: column;
	gap: 0;
	width: 100%;
}

@media screen and (max-width: 1024px) {
	.x-pg-row-form-block .pc-sticky {
		position: initial;
		top: initial;
	}

	.x-pg-row-form-block .tabet_phone-only {
		display: flex !important;
	}

	.x-pg-row-form-block .pc-only {
		display: none !important;
	}

	.x-pg-row-form-block .prd_first {
		margin-bottom: 1rem;
	}
}

@media screen and (max-width: 576px) {
	.x-pg-row-form-block .slider_box {
		width: 100%;
		max-width: calc(100vw - 38px);
		margin-left: auto;
		margin-right: auto;
	}

	.x-pg-row-form-block .product_count .form-select {
		width: 100%;
		min-width: 240px;
	}

	.x-pg-row-form-block .prd_price p:not(.fs-3) {
		font-size: .8rem;
	}

	.x-pg-row-form-block .product_count,
	.x-pg-row-form-block .u_price,
	.x-pg-row-form-block .shipping_fee,
	.x-pg-row-form-block .pay,
	.x-pg-row-form-block .shipping_area {
		padding-top: 12px;
		padding-bottom: 12px;
	}

	.x-pg-row-form-block .infolist li {
		margin-bottom: 0;
	}
}

/* ─────────────────────────────────────────────
   蝦皮 / momo 風格：拳頭商品購物頁視覺強化
   套用於 SalesProductDetailBlock（.x-pg-sales-product-box）
   保留既有 slick 輪播與購買流程，僅做 CSS 視覺調整
   主色：#ee4d2d（蝦皮橘紅）
   ───────────────────────────────────────────── */

/* === prd_box：PC 兩欄並排不換行（.prd_box 與 .x-pg-sales-product-box 在同一 element） === */
.x-pg-sales-product-box.prd_box,
.x-pg-sales-product-box .prd_box {
	display: flex !important;
	flex-direction: row;
	flex-wrap: nowrap;
	width: 100%;
}

/* One page sales 桌機版從 1024px 以上開始走雙欄，避免 1025-1199px 等不到 Bootstrap xl 而把 slider 撐滿。 */
@media screen and (min-width: 1024.01px) {
	.x-pg-sales-product-box.prd_box,
	.x-pg-sales-product-box .prd_box {
		--x-pg-sales-product-column-gap: clamp(24px, 2.5vw, 40px);
		column-gap: var(--x-pg-sales-product-column-gap);
	}

	.x-pg-sales-product-box.prd_box > .prd_first,
	.x-pg-sales-product-box.prd_box > .prd_desc,
	.x-pg-sales-product-box .prd_box > .prd_first,
	.x-pg-sales-product-box .prd_box > .prd_desc {
		flex: 0 0 calc((100% - var(--x-pg-sales-product-column-gap)) / 2) !important;
		width: calc((100% - var(--x-pg-sales-product-column-gap)) / 2) !important;
		max-width: calc((100% - var(--x-pg-sales-product-column-gap)) / 2) !important;
		min-width: 0;
		box-sizing: border-box;
	}

	.x-pg-sales-product-box.prd_box > .prd_first,
	.x-pg-sales-product-box .prd_box > .prd_first {
		padding-right: 0 !important;
	}

	.x-pg-sales-product-box.prd_box > .prd_desc,
	.x-pg-sales-product-box .prd_box > .prd_desc {
		padding-left: 0 !important;
	}

	.x-pg-sales-product-box .prd_first > .noshow_editor,
	.x-pg-sales-product-box .slider_box,
	.x-pg-sales-product-box .slider_box .slider-for {
		max-width: 100%;
		min-width: 0;
	}
}

/* 平板 / 手機（<=1024px）：允許換行，左右欄堆疊 */
@media screen and (max-width: 1024px) {
	.x-pg-sales-product-box.prd_box,
	.x-pg-sales-product-box .prd_box {
		flex-wrap: wrap;
	}
}

/* === 左右兩欄間距 === */
.x-pg-sales-product-box .prd_first {
	padding-right: 1.5rem;
}

.x-pg-sales-product-box .prd_desc {
	padding-left: 1.5rem;
}

/* === 左：主圖（商品輪播比例盒 + 白底細邊框） === */
.x-pg-sales-product-box .slider_box .slider-for {
	background-color: #ffffff;
	border: 1px solid #f0f0f0;
	border-radius: 2px;
	overflow: hidden;
	margin-bottom: 16px;
}

.x-pg-sales-product-box .slider-for .slick-slide > div {
	position: relative;
	width: 100%;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	padding-bottom: 0;
}

.x-pg-sales-product-box .slider-for .slick-slide > div > div {
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: 66.6667%;
	overflow: hidden;
}

.x-pg-sales-product-box .slider-for .slick-slide > div:has(> img:only-child) {
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: 66.6667%;
	overflow: hidden;
}

.x-pg-sales-product-box .slider-for .slick-slide:has(> img:only-child) {
	position: relative;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	padding-bottom: 0;
	overflow: hidden;
}

.x-pg-sales-product-box .slider-for img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
}

/* 編輯器 placeholder：對齊商品輪播比例並貼齊主圖外觀 */
.x-pg-sales-product-box .x-pg-sales-product-image-placeholder {
	aspect-ratio: 3 / 2;
	min-height: 0;
	border-radius: 0;
	background: #f8f9fb;
}

/* === 左：縮圖列（橫排比例圖 + 紅框 active） === */
.x-pg-sales-product-box .slider_box .slider-nav {
	margin-top: 0;
	overflow: hidden;
}

.x-pg-sales-product-box .slider_box:has(.slider-nav[data-x-pg-thumb-count="1"]),
#products-info .slider_box:has(.thumb-slider[data-x-pg-thumb-count="1"]),
#products-info .slider_box:has(.slider-nav[data-x-pg-thumb-count="1"]),
#product-modal .slider_box:has(.thumb-slider[data-x-pg-thumb-count="1"]),
#product-modal .slider_box:has(.slider-nav[data-x-pg-thumb-count="1"]),
#product-modal .slider-container:has(.thumb-slider[data-x-pg-thumb-count="1"]),
#product-modal .slider-container:has(.slider-nav[data-x-pg-thumb-count="1"]),
.slider-container .slider_box:has(.thumb-slider[data-x-pg-thumb-count="1"]),
.slider-container .slider_box:has(.slider-nav[data-x-pg-thumb-count="1"]) {
	display: block !important;
	grid-template-columns: minmax(0, 1fr) !important;
	gap: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
}

.x-pg-sales-product-box .slider_box:has(.slider-nav .slick-slide[data-slick-index="0"]:not(.slick-cloned):has(img)):not(:has(.slider-nav .slick-slide[data-slick-index="1"]:not(.slick-cloned):has(img))),
#products-info .slider_box:has(.thumb-slider .slick-slide[data-slick-index="0"]:not(.slick-cloned):has(img)):not(:has(.thumb-slider .slick-slide[data-slick-index="1"]:not(.slick-cloned):has(img))),
#products-info .slider_box:has(.slider-nav .slick-slide[data-slick-index="0"]:not(.slick-cloned):has(img)):not(:has(.slider-nav .slick-slide[data-slick-index="1"]:not(.slick-cloned):has(img))),
.slider-container:has(.main-slider .slick-slide[data-slick-index="0"]:not(.slick-cloned):has(img)):not(:has(.main-slider .slick-slide[data-slick-index="1"]:not(.slick-cloned):has(img))) .slider_box,
.slider-container:has(.slider-for .slick-slide[data-slick-index="0"]:not(.slick-cloned):has(img)):not(:has(.slider-for .slick-slide[data-slick-index="1"]:not(.slick-cloned):has(img))) .slider_box,
.slider-container:has(.main-slider .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.main-slider .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .slider_box,
.slider-container:has(.slider-for .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.slider-for .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .slider_box {
	display: block !important;
	grid-template-columns: minmax(0, 1fr) !important;
	gap: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
}

.x-pg-sales-product-box .slider-nav[data-x-pg-thumb-count="1"],
#products-info .thumb-slider[data-x-pg-thumb-count="1"],
#products-info .slider-nav[data-x-pg-thumb-count="1"],
#product-modal .thumb-slider[data-x-pg-thumb-count="1"],
#product-modal .slider-nav[data-x-pg-thumb-count="1"],
.slider-container .thumb-slider[data-x-pg-thumb-count="1"],
.slider-container .slider-nav[data-x-pg-thumb-count="1"] {
	display: none !important;
}

.slider_box:has(> .thumb-slider[data-x-pg-thumb-count="1"]) > .main-slider,
.slider_box:has(> .slider-nav[data-x-pg-thumb-count="1"]) > .main-slider,
.slider_box:has(> .thumb-slider[data-x-pg-thumb-count="1"]) > .slider-for,
.slider_box:has(> .slider-nav[data-x-pg-thumb-count="1"]) > .slider-for,
.slider-container:has(.main-slider .slick-slide[data-slick-index="0"]:not(.slick-cloned):has(img)):not(:has(.main-slider .slick-slide[data-slick-index="1"]:not(.slick-cloned):has(img))) .main-slider,
.slider-container:has(.slider-for .slick-slide[data-slick-index="0"]:not(.slick-cloned):has(img)):not(:has(.slider-for .slick-slide[data-slick-index="1"]:not(.slick-cloned):has(img))) .slider-for,
.slider-container:has(.main-slider .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.main-slider .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .main-slider,
.slider-container:has(.slider-for .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.slider-for .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .slider-for {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	padding-right: 0 !important;
	margin-right: 0 !important;
}

.slider-container:has(.main-slider .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.main-slider .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .main-slider :is(.slick-slider, .slick-list, .slick-track, .slick-slide, .slide-item, .slide-content),
.slider-container:has(.slider-for .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.slider-for .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .slider-for :is(.slick-slider, .slick-list, .slick-track, .slick-slide, .slide-item, .slide-content) {
	width: 100% !important;
	max-width: 100% !important;
}

.slider-container:has(.main-slider .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.main-slider .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .main-slider .slick-track,
.slider-container:has(.slider-for .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.slider-for .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .slider-for .slick-track {
	transform: translate3d(0, 0, 0) !important;
}

.slider-container.x-pg-single-main-image,
.slider-container .slider_box.x-pg-single-main-image,
.slider_box.x-pg-single-main-image,
#product-modal .slider-container.x-pg-single-main-image,
#product-modal .slider-container .slider_box.x-pg-single-main-image,
#products-info .slider-container.x-pg-single-main-image,
#products-info .slider-container .slider_box.x-pg-single-main-image,
.x-pg-sales-product-box .slider_box.x-pg-single-main-image {
	display: block !important;
	grid-template-columns: minmax(0, 1fr) !important;
	gap: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
}

.slider-container.x-pg-single-main-image .main-slider,
.slider-container.x-pg-single-main-image .slider-for,
.slider-container .slider_box.x-pg-single-main-image .main-slider,
.slider-container .slider_box.x-pg-single-main-image .slider-for,
.slider_box.x-pg-single-main-image > .main-slider,
.slider_box.x-pg-single-main-image > .slider-for {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	padding-right: 0 !important;
	margin-right: 0 !important;
}

.slider-container.x-pg-single-main-image .main-slider .slick-list,
.slider-container.x-pg-single-main-image .main-slider .slick-track,
.slider-container.x-pg-single-main-image .main-slider .slick-slide,
.slider-container.x-pg-single-main-image .slider-for .slick-list,
.slider-container.x-pg-single-main-image .slider-for .slick-track,
.slider-container.x-pg-single-main-image .slider-for .slick-slide,
.slider-container .slider_box.x-pg-single-main-image .main-slider .slick-list,
.slider-container .slider_box.x-pg-single-main-image .main-slider .slick-track,
.slider-container .slider_box.x-pg-single-main-image .main-slider .slick-slide,
.slider-container .slider_box.x-pg-single-main-image .slider-for .slick-list,
.slider-container .slider_box.x-pg-single-main-image .slider-for .slick-track,
.slider-container .slider_box.x-pg-single-main-image .slider-for .slick-slide {
	width: 100% !important;
	max-width: 100% !important;
}

.slider-container.x-pg-single-main-image .thumb-slider,
.slider-container.x-pg-single-main-image .slider-nav,
.slider-container .slider_box.x-pg-single-main-image .thumb-slider,
.slider-container .slider_box.x-pg-single-main-image .slider-nav,
.slider_box.x-pg-single-main-image > .thumb-slider,
.slider_box.x-pg-single-main-image > .slider-nav {
	display: none !important;
}

.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="0"]:not(.slick-cloned):has(img)):not(:has(.slick-slide[data-slick-index="1"]:not(.slick-cloned):has(img))),
#products-info .thumb-slider:has(.slick-slide[data-slick-index="0"]:not(.slick-cloned):has(img)):not(:has(.slick-slide[data-slick-index="1"]:not(.slick-cloned):has(img))),
#products-info .slider-nav:has(.slick-slide[data-slick-index="0"]:not(.slick-cloned):has(img)):not(:has(.slick-slide[data-slick-index="1"]:not(.slick-cloned):has(img))),
.slider-container:has(.main-slider .slick-slide[data-slick-index="0"]:not(.slick-cloned):has(img)):not(:has(.main-slider .slick-slide[data-slick-index="1"]:not(.slick-cloned):has(img))) .thumb-slider,
.slider-container:has(.main-slider .slick-slide[data-slick-index="0"]:not(.slick-cloned):has(img)):not(:has(.main-slider .slick-slide[data-slick-index="1"]:not(.slick-cloned):has(img))) .slider-nav,
.slider-container:has(.slider-for .slick-slide[data-slick-index="0"]:not(.slick-cloned):has(img)):not(:has(.slider-for .slick-slide[data-slick-index="1"]:not(.slick-cloned):has(img))) .thumb-slider,
.slider-container:has(.slider-for .slick-slide[data-slick-index="0"]:not(.slick-cloned):has(img)):not(:has(.slider-for .slick-slide[data-slick-index="1"]:not(.slick-cloned):has(img))) .slider-nav,
.slider-container:has(.main-slider .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.main-slider .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .thumb-slider,
.slider-container:has(.main-slider .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.main-slider .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .slider-nav,
.slider-container:has(.slider-for .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.slider-for .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .thumb-slider,
.slider-container:has(.slider-for .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.slider-for .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .slider-nav {
	display: none !important;
}

.x-pg-sales-product-box .slider-nav .slick-prev,
.x-pg-sales-product-box .slider-nav .slick-next,
.x-pg-sales-product-box .slider-nav .slick-arrow.slick-prev,
.x-pg-sales-product-box .slider-nav .slick-arrow.slick-next {
	top: 0;
	width: 30px;
	height: 100%;
	transform: none;
	border: 0;
	background-color: transparent;
	color: #5f6672;
	z-index: 20;
	display: flex !important;
	align-items: center;
	justify-content: center;
	font-size: 0;
	padding: 0;
	transition: color .15s ease;
}

.x-pg-sales-product-box .slider-nav .slick-prev:hover,
.x-pg-sales-product-box .slider-nav .slick-next:hover,
.x-pg-sales-product-box .slider-nav .slick-prev:focus,
.x-pg-sales-product-box .slider-nav .slick-next:focus,
.x-pg-sales-product-box .slider-nav .slick-arrow.slick-prev:hover,
.x-pg-sales-product-box .slider-nav .slick-arrow.slick-next:hover,
.x-pg-sales-product-box .slider-nav .slick-arrow.slick-prev:focus,
.x-pg-sales-product-box .slider-nav .slick-arrow.slick-next:focus {
	background-color: transparent;
	color: #424956;
	outline: none;
}

.x-pg-sales-product-box .slider-nav .slick-prev,
.x-pg-sales-product-box .slider-nav .slick-arrow.slick-prev {
	left: 0;
	border-top-left-radius: 2px;
	border-bottom-left-radius: 2px;
}

.x-pg-sales-product-box .slider-nav .slick-next,
.x-pg-sales-product-box .slider-nav .slick-arrow.slick-next {
	right: 0;
	border-top-right-radius: 2px;
	border-bottom-right-radius: 2px;
}

.x-pg-sales-product-box .slider-nav .slick-arrow::before {
	content: "";
	position: absolute;
	top: 50%;
	display: block;
	width: 24px;
	height: 100%;
	border-radius: 2px;
	background-color: rgba(229, 231, 235, .85);
	transform: translateY(-50%);
	transition: background-color .15s ease;
	opacity: 1;
}

.x-pg-sales-product-box .slider-nav .slick-prev::before,
.x-pg-sales-product-box .slider-nav .slick-arrow.slick-prev::before {
	left: 0;
}

.x-pg-sales-product-box .slider-nav .slick-next::before,
.x-pg-sales-product-box .slider-nav .slick-arrow.slick-next::before {
	right: 0;
}

.x-pg-sales-product-box .slider-nav .slick-arrow:hover::before,
.x-pg-sales-product-box .slider-nav .slick-arrow:focus::before {
	background-color: rgba(209, 213, 219, .95);
}

.x-pg-sales-product-box .slider-nav .slick-arrow::after {
	content: "";
	width: 9px;
	height: 9px;
	border: solid currentColor;
	border-width: 0 2px 2px 0;
}

.x-pg-sales-product-box .slider-nav .slick-prev::after,
.x-pg-sales-product-box .slider-nav .slick-arrow.slick-prev::after {
	transform: rotate(135deg);
}

.x-pg-sales-product-box .slider-nav .slick-next::after,
.x-pg-sales-product-box .slider-nav .slick-arrow.slick-next::after {
	transform: rotate(-45deg);
}

.x-pg-sales-product-box .slider-nav .slick-disabled {
	opacity: .35;
	cursor: default;
}

.x-pg-sales-product-box .slider-nav .slick-list {
	margin: 0 -4px;
}

.x-pg-sales-product-box .slider-nav .slick-track {
	counter-reset: x-pg-sales-thumb;
}

.x-pg-sales-product-box .slider-nav .slick-slide {
	padding: 0 4px;
	position: relative;
}

.x-pg-sales-product-box .slider-nav .slick-slide:not(.slick-cloned) {
	counter-increment: x-pg-sales-thumb;
}

.x-pg-sales-product-box .slider-nav .slick-slide > div {
	border: 1px solid #eceff3;
	border-radius: 4px;
	overflow: hidden;
	cursor: pointer;
	transition: border-color .15s ease, box-shadow .15s ease;
	background: #fff;
	position: relative;
	aspect-ratio: 3 / 2;
	display: flex !important;
	align-items: center;
	justify-content: center;
}

.x-pg-sales-product-box .slider-nav .slick-slide:has(> img:only-child) {
	aspect-ratio: 3 / 2;
	cursor: pointer;
}

.x-pg-sales-product-box .slider-nav .slick-slide:has(> img:only-child) > img {
	border: 0;
	border-radius: 0;
	background: #fff;
}

.x-pg-sales-product-box .slider-nav .slick-slide:has(> img:only-child)::before {
	content: "";
	position: absolute;
	top: 0;
	right: 4px;
	bottom: 0;
	left: 4px;
	z-index: 4;
	border: 1px solid #eceff3;
	border-radius: 4px;
	box-sizing: border-box;
	pointer-events: none;
	transition: border-color .15s ease, box-shadow .15s ease;
}

.x-pg-sales-product-box .slider-nav .slick-slide[data-x-pg-thumb-number] > div::after,
.x-pg-sales-product-box .slider-nav .slick-slide:not([data-x-pg-thumb-number]):not(.slick-cloned) > div::after,
.x-pg-sales-product-box .slider-nav .slick-slide[data-slick-index]:not([data-x-pg-thumb-number]) > div::after,
.x-pg-sales-product-box .slider-nav .slick-slide[data-x-pg-thumb-number]:has(> img:only-child)::after,
.x-pg-sales-product-box .slider-nav .slick-slide:not([data-x-pg-thumb-number]):not(.slick-cloned):has(> img:only-child)::after,
.x-pg-sales-product-box .slider-nav .slick-slide[data-slick-index]:not([data-x-pg-thumb-number]):has(> img:only-child)::after {
	position: absolute;
	top: 1px;
	left: 4px;
	z-index: 3;
	width: 26px;
	height: 26px;
	padding: 2px 0 0 4px;
	background: linear-gradient(135deg, #cbd5e1 0 50%, transparent 50% 100%);
	color: #202435;
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
	text-align: left;
	pointer-events: none;
}

.x-pg-sales-product-box .slider-nav .slick-slide[data-x-pg-thumb-number] > div::after {
	content: attr(data-x-pg-thumb-number);
}

.x-pg-sales-product-box .slider-nav .slick-slide:not([data-x-pg-thumb-number]):not(.slick-cloned) > div::after {
	content: counter(x-pg-sales-thumb);
}

.x-pg-sales-product-box .slider-nav .slick-slide[data-x-pg-thumb-number]:has(> img:only-child)::after {
	content: attr(data-x-pg-thumb-number);
}

.x-pg-sales-product-box .slider-nav .slick-slide:not([data-x-pg-thumb-number]):not(.slick-cloned):has(> img:only-child)::after {
	content: counter(x-pg-sales-thumb);
}

.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-10"], [data-slick-index="0"], [data-slick-index="10"], [data-slick-index="20"]):not([data-x-pg-thumb-number]) > div::after,
.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-10"], [data-slick-index="0"], [data-slick-index="10"], [data-slick-index="20"]):not([data-x-pg-thumb-number]):has(> img:only-child)::after {
	content: "1" !important;
}

.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-9"], [data-slick-index="1"], [data-slick-index="11"], [data-slick-index="21"]):not([data-x-pg-thumb-number]) > div::after,
.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-9"], [data-slick-index="1"], [data-slick-index="11"], [data-slick-index="21"]):not([data-x-pg-thumb-number]):has(> img:only-child)::after {
	content: "2" !important;
}

.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-8"], [data-slick-index="2"], [data-slick-index="12"], [data-slick-index="22"]):not([data-x-pg-thumb-number]) > div::after,
.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-8"], [data-slick-index="2"], [data-slick-index="12"], [data-slick-index="22"]):not([data-x-pg-thumb-number]):has(> img:only-child)::after {
	content: "3" !important;
}

.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-7"], [data-slick-index="3"], [data-slick-index="13"], [data-slick-index="23"]):not([data-x-pg-thumb-number]) > div::after,
.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-7"], [data-slick-index="3"], [data-slick-index="13"], [data-slick-index="23"]):not([data-x-pg-thumb-number]):has(> img:only-child)::after {
	content: "4" !important;
}

.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-6"], [data-slick-index="4"], [data-slick-index="14"], [data-slick-index="24"]):not([data-x-pg-thumb-number]) > div::after,
.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-6"], [data-slick-index="4"], [data-slick-index="14"], [data-slick-index="24"]):not([data-x-pg-thumb-number]):has(> img:only-child)::after {
	content: "5" !important;
}

.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-5"], [data-slick-index="5"], [data-slick-index="15"], [data-slick-index="25"]):not([data-x-pg-thumb-number]) > div::after,
.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-5"], [data-slick-index="5"], [data-slick-index="15"], [data-slick-index="25"]):not([data-x-pg-thumb-number]):has(> img:only-child)::after {
	content: "6" !important;
}

.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-4"], [data-slick-index="6"], [data-slick-index="16"], [data-slick-index="26"]):not([data-x-pg-thumb-number]) > div::after,
.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-4"], [data-slick-index="6"], [data-slick-index="16"], [data-slick-index="26"]):not([data-x-pg-thumb-number]):has(> img:only-child)::after {
	content: "7" !important;
}

.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-3"], [data-slick-index="7"], [data-slick-index="17"], [data-slick-index="27"]):not([data-x-pg-thumb-number]) > div::after,
.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-3"], [data-slick-index="7"], [data-slick-index="17"], [data-slick-index="27"]):not([data-x-pg-thumb-number]):has(> img:only-child)::after {
	content: "8" !important;
}

.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-2"], [data-slick-index="8"], [data-slick-index="18"], [data-slick-index="28"]):not([data-x-pg-thumb-number]) > div::after,
.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-2"], [data-slick-index="8"], [data-slick-index="18"], [data-slick-index="28"]):not([data-x-pg-thumb-number]):has(> img:only-child)::after {
	content: "9" !important;
}

.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-1"], [data-slick-index="9"], [data-slick-index="19"], [data-slick-index="29"]):not([data-x-pg-thumb-number]) > div::after,
.x-pg-sales-product-box .slider-nav:has(.slick-slide[data-slick-index="9"]:not(.slick-cloned)):not(:has(.slick-slide[data-slick-index="10"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-1"], [data-slick-index="9"], [data-slick-index="19"], [data-slick-index="29"]):not([data-x-pg-thumb-number]):has(> img:only-child)::after {
	content: "10" !important;
}

.x-pg-sales-product-box .slider-nav .slick-slide:hover > div,
.x-pg-sales-product-box .slider-nav .slick-slide:has(> img:only-child):hover::before {
	border-color: var(--x-pg-quick-cta, #ee4d2d);
}

.x-pg-sales-product-box .slider-nav .slick-current {
	border-bottom: 0;
}

.x-pg-sales-product-box .slider-nav .slick-current > div,
.x-pg-sales-product-box .slider-nav .slick-center > div,
.x-pg-sales-product-box .slider-nav .slick-current:has(> img:only-child)::before,
.x-pg-sales-product-box .slider-nav .slick-center:has(> img:only-child)::before {
	border: 2px solid var(--x-pg-quick-cta, #ee4d2d);
}

.x-pg-sales-product-box .slider-nav .slick-slide > div {
	padding-bottom: 0;
}

.x-pg-sales-product-box .slider-nav .slick-slide > div > div {
	position: relative;
	width: 100%;
	height: 100% !important;
	padding-bottom: 0;
	overflow: hidden;
	display: flex !important;
	align-items: center;
	justify-content: center;
}

.x-pg-sales-product-box .slider-nav img {
	position: static;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	padding: .5rem;
	box-sizing: border-box;
}

/* 編輯器縮圖 placeholder：比例圖 + 中央數字 */
.x-pg-sales-product-box .x-pg-sales-thumb {
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	margin-right: 0;
	border-radius: 0;
	background: #f8f9fb;
	color: #8a94a6;
}

/* 平板：主圖 + 右側垂直縮圖軌道，避免主圖滿版後過高。手機維持下方橫向縮圖。 */
@media screen and (min-width: 768px) and (max-width: 1024px) {
	.x-pg-sales-product-box .slider_box,
	#products-info .slider_box {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) clamp(68px, 10vw, 92px);
		gap: 12px;
		align-items: stretch;
		max-width: min(100%, 760px);
		margin-left: auto;
		margin-right: auto;
		container-type: inline-size;
		--x-pg-quick-slider-thumb-width: clamp(68px, 10vw, 92px);
		--x-pg-quick-slider-gap: 12px;
		--x-pg-quick-slider-track-height: clamp(180px, calc((100cqw - var(--x-pg-quick-slider-thumb-width) - var(--x-pg-quick-slider-gap)) * 2 / 3), 520px);
	}

	/* 單張圖（slider_box 沒有 slider-nav / thumb-slider 子節點）：取消 grid 預留軌道 */
	.x-pg-sales-product-box .slider_box:not(:has(> .slider-nav)):not(:has(> .thumb-slider)),
	#products-info .slider_box:not(:has(> .slider-nav)):not(:has(> .thumb-slider)) {
		display: block !important;
	}

	.x-pg-sales-product-box .slider_box .slider-for,
	#products-info .main-slider {
		width: auto !important;
		min-width: 0;
		padding-right: 0 !important;
		margin-bottom: 0;
	}

	.x-pg-sales-product-box .slider-for .slick-slide > div,
	.x-pg-sales-product-box .slider-for .slick-slide > div > div,
	.x-pg-sales-product-box .slider-for .slick-slide > div:has(> img:only-child),
	.x-pg-sales-product-box .slider-for .slick-slide:has(> img:only-child) {
		height: clamp(360px, 58vw, 520px);
		aspect-ratio: auto;
		padding-bottom: 0 !important;
	}
	/* #products-info 改用 aspect-ratio 3:2，不再固定高度 */

	.x-pg-sales-product-box .slider_box .slider-nav,
	#products-info .thumb-slider,
	#products-info .slider-nav {
		display: grid !important;
		grid-template-rows: 32px minmax(0, 1fr) 32px !important;
		grid-template-columns: minmax(64px, 1fr) !important;
		gap: 6px !important;
		width: auto !important;
		min-width: 64px !important;
		height: clamp(360px, 58vw, 520px);
		margin-top: 0;
		overflow: hidden;
	}

	.x-pg-sales-product-box .slider-nav .slick-list,
	#products-info .thumb-slider .slick-list,
	#products-info .slider-nav .slick-list {
		height: 100% !important;
		margin: 0 !important;
		overflow-x: hidden !important;
		overflow-y: auto !important;
		scrollbar-width: thin;
		min-height: 0;
	}

	.x-pg-sales-product-box .slider-nav .slick-track,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-track {
		display: flex !important;
		flex-direction: column;
		justify-content: flex-start !important;
		gap: 8px;
		width: 100% !important;
		height: auto !important;
		transform: none !important;
	}

	.x-pg-sales-product-box .slider-nav .slick-slide,
	#products-info .thumb-slider .slick-slide,
	#products-info .slider-nav .slick-slide {
		width: 100% !important;
		height: auto !important;
		padding: 0 !important;
	}

	.x-pg-sales-product-box .slider-nav .slick-slide.slick-cloned {
		display: none !important;
	}

	.x-pg-sales-product-box .slider-nav .slick-slide > div,
	#products-info .thumb-slider .slick-slide > div,
	#products-info .slider-nav .slick-slide > div {
		width: 100%;
		aspect-ratio: 1 / 1;
	}

	.x-pg-sales-product-box .slider-nav .slick-arrow,
	#products-info .thumb-slider .slick-arrow,
	#products-info .slider-nav .slick-arrow {
		position: static !important;
		display: flex !important;
		width: 100% !important;
		height: 32px !important;
		min-height: 32px;
		transform: none !important;
		border-radius: 2px;
		background-color: transparent !important;
		align-items: center;
		justify-content: center;
		padding: 0;
	}

	.x-pg-sales-product-box .slider-nav .slick-prev::after,
	#products-info .thumb-slider .slick-prev::after,
	#products-info .slider-nav .slick-prev::after {
		transform: rotate(-135deg);
	}

	.x-pg-sales-product-box .slider-nav .slick-next::after,
	#products-info .thumb-slider .slick-next::after,
	#products-info .slider-nav .slick-next::after {
		transform: rotate(45deg);
	}
}

/* 最後修正：平板垂直縮圖軌道固定寬度與上下箭頭 */
@media screen and (min-width: 768px) and (max-width: 1024px) {
	#products-info .thumb-slider,
	#products-info .slider-nav,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav {
		display: grid !important;
		grid-template-rows: 32px minmax(0, 1fr) 32px !important;
		grid-template-columns: minmax(64px, 1fr) !important;
		gap: 6px !important;
		min-width: 64px !important;
	}

	#products-info .thumb-slider .slick-prev,
	#products-info .slider-nav .slick-prev,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-prev,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-prev {
		grid-row: 1 !important;
		grid-column: 1 !important;
	}

	#products-info .thumb-slider .slick-list,
	#products-info .slider-nav .slick-list,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-list,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-list {
		grid-row: 2 !important;
		grid-column: 1 !important;
		width: 100% !important;
		min-width: 64px !important;
		max-width: none !important;
		height: 100% !important;
		min-height: 0 !important;
		padding: 0 !important;
		overflow-x: hidden !important;
		overflow-y: auto !important;
	}

	#products-info .thumb-slider .slick-next,
	#products-info .slider-nav .slick-next,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-next,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-next {
		grid-row: 3 !important;
		grid-column: 1 !important;
	}

	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-track,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-track {
		width: 100% !important;
		min-width: 64px !important;
		display: flex !important;
		flex-direction: column !important;
		justify-content: flex-start !important;
		gap: 8px !important;
		transform: none !important;
		left: 0 !important;
		top: 0 !important;
	}

	#products-info .thumb-slider .slick-slide,
	#products-info .slider-nav .slick-slide,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-slide,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-slide {
		float: none !important;
		display: block !important;
		width: 100% !important;
		min-width: 64px !important;
		height: auto !important;
		opacity: 1 !important;
	}

	#products-info .thumb-slider .slick-slide > div,
	#products-info .slider-nav .slick-slide > div,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-slide > div,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-slide > div {
		width: 100% !important;
		min-width: 64px !important;
		height: auto !important;
		aspect-ratio: 1 / 1 !important;
		box-sizing: border-box;
	}

	#products-info .thumb-slider .slick-slide > div > div,
	#products-info .slider-nav .slick-slide > div > div,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-slide > div > div,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-slide > div > div {
		width: 100% !important;
		height: 100% !important;
		min-width: 64px !important;
		padding-bottom: 0 !important;
	}

	#products-info .thumb-slider .slick-arrow,
	#products-info .slider-nav .slick-arrow,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-arrow,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-arrow {
		position: static !important;
		display: flex !important;
		width: 100% !important;
		min-width: 64px !important;
		height: 32px !important;
		min-height: 32px !important;
		transform: none !important;
		align-items: center !important;
		justify-content: center !important;
	}

	#products-info .thumb-slider .slick-arrow::before,
	#products-info .slider-nav .slick-arrow::before,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-arrow::before,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-arrow::before {
		display: none !important;
	}

	#products-info .thumb-slider .slick-arrow::after,
	#products-info .slider-nav .slick-arrow::after,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-arrow::after,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-arrow::after {
		content: "" !important;
		width: 0 !important;
		height: 0 !important;
		border-left: 7px solid transparent !important;
		border-right: 7px solid transparent !important;
		border-top: 0 !important;
		border-bottom: 8px solid #5f6672 !important;
		transform: none !important;
	}

	#products-info .thumb-slider .slick-next::after,
	#products-info .slider-nav .slick-next::after,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-next::after,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-next::after {
		border-top: 8px solid #5f6672 !important;
		border-bottom: 0 !important;
	}
}

/* EOF：商品詳情 tabet_phone-only 只在桌機隱藏，平板/手機必須顯示 */
@media screen and (max-width: 1024px) {
	.x-pg-sales-product-box .tabet_phone-only,
	.x-pg-sales-product-box .tabet_phone-only.d-none {
		display: flex !important;
	}

	.x-pg-sales-product-box .pc-only:not(.button_area) {
		display: none !important;
	}
}

@media screen and (min-width: 1024.01px) {
	.x-pg-sales-product-box .tabet_phone-only {
		display: none !important;
	}
}

/* 商品詳情 RWD：tabet_phone-only 是平板/手機顯示，桌機才隱藏 */
@media screen and (max-width: 1024px) {
	.x-pg-sales-product-box .tabet_phone-only,
	.x-pg-sales-product-box .tabet_phone-only.d-none {
		display: flex !important;
	}

	.x-pg-sales-product-box .pc-only:not(.button_area) {
		display: none !important;
	}
}

@media screen and (min-width: 1024.01px) {
	.x-pg-sales-product-box .tabet_phone-only {
		display: none !important;
	}
}

/* 最終覆蓋：平板垂直縮圖軌道修正，避免 slick inline width 造成縮圖 0 寬 */
@media screen and (min-width: 768px) and (max-width: 1024px) {
	#products-info .thumb-slider,
	#products-info .slider-nav,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav {
		display: grid !important;
		grid-template-rows: 32px minmax(0, 1fr) 32px;
		grid-template-columns: minmax(64px, 1fr);
		gap: 6px;
		min-width: 64px;
	}

	#products-info .thumb-slider .slick-prev,
	#products-info .slider-nav .slick-prev,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-prev,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-prev {
		grid-row: 1;
		grid-column: 1;
	}

	#products-info .thumb-slider .slick-list,
	#products-info .slider-nav .slick-list,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-list,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-list {
		grid-row: 2;
		grid-column: 1;
		width: 100% !important;
		min-width: 64px !important;
		max-width: none !important;
		height: 100% !important;
		min-height: 0 !important;
		padding: 0 !important;
		overflow-x: hidden !important;
		overflow-y: auto !important;
	}

	#products-info .thumb-slider .slick-next,
	#products-info .slider-nav .slick-next,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-next,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-next {
		grid-row: 3;
		grid-column: 1;
	}

	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-track,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-track {
		width: 100% !important;
		min-width: 64px !important;
		display: flex !important;
		flex-direction: column !important;
		gap: 8px;
		transform: none !important;
		left: 0 !important;
		top: 0 !important;
	}

	#products-info .thumb-slider .slick-slide,
	#products-info .slider-nav .slick-slide,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-slide,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-slide {
		float: none !important;
		display: block !important;
		width: 100% !important;
		min-width: 64px !important;
		height: auto !important;
		opacity: 1 !important;
	}

	#products-info .thumb-slider .slick-slide > div,
	#products-info .slider-nav .slick-slide > div,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-slide > div,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-slide > div {
		width: 100% !important;
		min-width: 64px !important;
		height: auto !important;
		aspect-ratio: 1 / 1;
		box-sizing: border-box;
	}

	#products-info .thumb-slider .slick-slide > div > div,
	#products-info .slider-nav .slick-slide > div > div,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-slide > div > div,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-slide > div > div {
		width: 100% !important;
		height: 100% !important;
		min-width: 64px !important;
		padding-bottom: 0 !important;
	}

	#products-info .thumb-slider .slick-arrow,
	#products-info .slider-nav .slick-arrow,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-arrow,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-arrow {
		position: static !important;
		display: flex !important;
		width: 100% !important;
		min-width: 64px !important;
		height: 32px !important;
		min-height: 32px;
		transform: none !important;
		align-items: center;
		justify-content: center;
	}

	#products-info .thumb-slider .slick-arrow::before,
	#products-info .slider-nav .slick-arrow::before,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-arrow::before,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-arrow::before {
		display: none !important;
	}

	#products-info .thumb-slider .slick-arrow::after,
	#products-info .slider-nav .slick-arrow::after,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-arrow::after,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-arrow::after {
		content: "" !important;
		width: 0 !important;
		height: 0 !important;
		border-left: 7px solid transparent !important;
		border-right: 7px solid transparent !important;
		border-top: 0 !important;
		border-bottom: 8px solid #5f6672 !important;
		transform: none !important;
	}

	#products-info .thumb-slider .slick-next::after,
	#products-info .slider-nav .slick-next::after,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-next::after,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-next::after {
		border-top: 8px solid #5f6672 !important;
		border-bottom: 0 !important;
	}
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider_box,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider_box {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 76px;
	gap: 12px;
	align-items: stretch;
	max-width: min(100%, 760px);
	margin-left: auto;
	margin-right: auto;
}

/* 預覽 tablet 單張圖（slider_box 沒有 slider-nav / thumb-slider 子節點）：取消 grid 預留軌道 */
.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider_box:not(:has(> .slider-nav)):not(:has(> .thumb-slider)),
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider_box:not(:has(> .slider-nav)):not(:has(> .thumb-slider)) {
	display: block !important;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider_box .slider-for,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider_box .slider-for {
	min-width: 0;
	margin-bottom: 0;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-for .slick-slide > div > div,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-for .slick-slide > div > div,
.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-for .slick-slide > div,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-for .slick-slide > div,
.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-for .slick-slide > div:has(> img:only-child),
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-for .slick-slide > div:has(> img:only-child),
.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-for .slick-slide:has(> img:only-child),
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-for .slick-slide:has(> img:only-child) {
	height: 430px;
	aspect-ratio: auto;
	padding-bottom: 0 !important;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider_box .slider-nav,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider_box .slider-nav {
	display: grid !important;
	grid-template-rows: 32px minmax(0, 1fr) 32px;
	gap: 6px;
	height: 430px;
	margin-top: 0;
	overflow: hidden;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-list,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-list {
	height: 100% !important;
	margin: 0 !important;
	overflow-x: hidden !important;
	overflow-y: auto !important;
	scrollbar-width: thin;
	min-height: 0;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-track,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-track {
	display: flex !important;
	flex-direction: column;
	gap: 8px;
	width: 100% !important;
	height: auto !important;
	transform: none !important;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-slide,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-slide {
	width: 100% !important;
	height: auto !important;
	padding: 0 !important;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-slide.slick-cloned,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-slide.slick-cloned {
	display: none !important;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-slide > div,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-slide > div {
	width: 100%;
	aspect-ratio: 1 / 1;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-arrow,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-arrow {
	position: static !important;
	display: flex !important;
	width: 100% !important;
	height: 32px !important;
	min-height: 32px;
	transform: none !important;
	border-radius: 2px;
	background-color: #e7e7e7ee;
	align-items: center;
	justify-content: center;
	padding: 0;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-arrow::before,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-arrow::before {
	display: none !important;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-arrow::after,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-arrow::after {
	content: "" !important;
	width: 0 !important;
	height: 0 !important;
	border-left: 7px solid transparent !important;
	border-right: 7px solid transparent !important;
	border-top: 0 !important;
	border-bottom: 8px solid #5f6672 !important;
	transform: none !important;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-prev::after,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-prev::after {
	border-top: 0 !important;
	border-bottom: 8px solid #5f6672 !important;
	transform: none !important;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-next::after,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-next::after {
	border-top: 8px solid #5f6672 !important;
	border-bottom: 0 !important;
	transform: none !important;
}

/* === 左：販售地區 / 付款方式（細緻 inline 列） === */
.x-pg-sales-product-box .moreinfo_box.pc-only,
.x-pg-sales-product-box .prd_first > .shipping_area {
	border-top: 1px solid #f0f0f0;
	margin-top: 20px;
	padding: 0;
}

.x-pg-sales-product-box .moreinfo_box.pc-only > div,
.x-pg-sales-product-box .prd_first > .shipping_area,
.x-pg-sales-product-box .prd_first > .pay,
.x-pg-sales-product-box .prd_desc > .shipping_area,
.x-pg-sales-product-box .prd_desc > .pay {
	padding: 12px 0;
	border-bottom: 1px dashed #f0f0f0;
	gap: 12px;
	display: flex;
	align-items: center;
}

.x-pg-sales-product-box .moreinfo_box.pc-only > div:last-child,
.x-pg-sales-product-box .prd_first > .pay,
.x-pg-sales-product-box .prd_desc > .pay {
	border-bottom: 0;
}

.x-pg-sales-product-box .prd_desc > .shipping_area,
.x-pg-sales-product-box .prd_desc > .pay {
	display: none;
}

.x-pg-sales-product-box .moreinfo_box .moreinfo_title,
.x-pg-sales-product-box .shipping_area .moreinfo_title,
.x-pg-sales-product-box .pay .moreinfo_title {
	color: #757575;
	font-size: 13px;
	font-weight: 400;
	flex: 0 0 92px;
	max-width: 92px;
	min-width: 92px;
	margin-bottom: 0;
}

.x-pg-sales-product-box .moreinfo_box .infolist,
.x-pg-sales-product-box .shipping_area .infolist,
.x-pg-sales-product-box .pay .infolist {
	color: #222;
	font-size: 13px;
	flex: 1 1 auto;
	min-width: 0;
}

.x-pg-sales-product-box .moreinfo_box .infolist ul,
.x-pg-sales-product-box .shipping_area .infolist ul,
.x-pg-sales-product-box .pay .infolist ul {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 14px;
	padding-left: 0;
	margin-bottom: 0;
}

.x-pg-sales-product-box .pay .infolist ul {
	flex-wrap: nowrap;
	overflow-x: auto;
}

.x-pg-sales-product-box .moreinfo_box .infolist li,
.x-pg-sales-product-box .shipping_area .infolist li,
.x-pg-sales-product-box .pay .infolist li {
	margin-bottom: 0;
	list-style: none;
	flex: 0 0 auto;
}

@media screen and (max-width: 1024px) {
	.x-pg-sales-product-box .prd_first > .shipping_area,
	.x-pg-sales-product-box .prd_first > .pay {
		display: none;
	}

	.x-pg-sales-product-box .prd_desc > .shipping_area,
	.x-pg-sales-product-box .prd_desc > .pay {
		display: flex;
	}
}

/* === 右：商品標籤 + 名稱 === */
.x-pg-sales-product-box .prd_desc .prd_highlight {
	display: flex;
	align-items: center;
	gap: 6px;
	margin: 0 0 10px;
	font-size: 12px;
}

.x-pg-sales-product-box .prd_desc .prd_highlight .badge {
	font-size: 12px;
	font-weight: 500;
	padding: 4px 8px;
	border-radius: 2px;
}

.x-pg-sales-product-box .prd_desc .product_name {
	font-size: 1.5rem;
	font-weight: 700;
	color: #222;
	line-height: 1.45;
	margin: 0 0 16px;
}

/* === 右：價格區（巨頭同款：紅色漸層卡片 + 醒目最終價） === */
.x-pg-sales-product-box .prd_desc .basic_sales {
	background: linear-gradient(135deg, #fff5f3 0%, #ffe9e3 100%) !important;
	border: 1px solid #fbd5cb;
	border-radius: 12px !important;
	padding: 14px 22px 12px !important;
	margin: 18px 0 12px;
	box-shadow: 0 2px 8px rgba(238, 77, 45, 0.06);
}

.x-pg-sales-product-box .prd_desc .basic_sales > h3 {
	background: linear-gradient(135deg, #ff5b3c 0%, #ee4d2d 100%) !important;
	color: #fff !important;
	font-size: 12px !important;
	font-weight: 700;
	letter-spacing: 0.5px;
	padding: 5px 12px !important;
	top: -13px !important;
	left: 16px;
	border-radius: 4px !important;
	box-shadow: 0 3px 8px rgba(238, 77, 45, 0.28) !important;
}

.x-pg-sales-product-box .prd_desc .basic_sales > h3 i,
.x-pg-sales-product-box .prd_desc .basic_sales > h3 svg {
	width: 11px;
	height: 11px;
	font-size: 11px;
	margin-right: 4px;
	vertical-align: -1px;
}

.x-pg-sales-product-box .prd_desc .prd_price {
	background-color: transparent !important;
	padding: 0 !important;
	margin: 8px 0 0 !important;
	align-items: flex-start;
	gap: 10px 0;
	border-radius: 0 !important;
	display: flex !important;
	flex-wrap: nowrap;
	justify-content: flex-start !important;
	overflow: hidden;
}

.x-pg-sales-product-box .prd_desc .prd_price > div {
	flex: 0 0 auto !important;
	padding: 0 14px !important;
	border-left: 0 !important;
	min-width: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	gap: 2px;
	white-space: nowrap;
}

.x-pg-sales-product-box .prd_desc .prd_price > div:first-child {
	padding-left: 0 !important;
}

/* 原價 / 特價：小字 + 灰色 + 刪除線（直式排列，標題在上、價格在下） */
.x-pg-sales-product-box .prd_desc .prd_price > div:not(:last-child) {
	flex: 0 0 auto;
	border-right: 1px dashed #f3c0b3;
}

.x-pg-sales-product-box .prd_desc .prd_price > div:not(:last-child) > span {
	color: #9a9a9a !important;
	font-size: 11px !important;
	letter-spacing: 0.3px;
}

.x-pg-sales-product-box .prd_desc .prd_price > div:not(:last-child) p {
	font-size: 14px !important;
	color: #9a9a9a !important;
	margin: 0;
	line-height: 1.2;
}

.x-pg-sales-product-box .prd_desc .prd_price > div:not(:last-child) p span {
	color: #9a9a9a !important;
	text-decoration: line-through;
	text-decoration-color: #c4544c;
	text-decoration-thickness: 1px;
}

.x-pg-sales-product-box .prd_desc .prd_price > div:not(:last-child) .js_del::after {
	display: none;
}

/* 砍價後（最終價）：緊鄰特價、橘紅大字、貨幣前綴 */
.x-pg-sales-product-box .prd_desc .prd_price > div:last-child,
.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div,
.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div {
	flex: 1 1 auto !important;
	flex-direction: column;
	align-items: flex-start;
	gap: 0;
	padding: 0 0 0 18px !important;
	min-width: 0;
	overflow: hidden;
}

.x-pg-sales-product-box .prd_desc .prd_price > div:last-child > span,
.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div > span,
.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div > span {
	color: #757575 !important;
	font-size: 11px !important;
	letter-spacing: 0.3px;
}

.x-pg-sales-product-box .prd_desc .prd_price > div:last-child p.fw-bolder,
.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div p.fw-bolder,
.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div p.fw-bolder {
	color: #ee4d2d !important;
	margin: 0;
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
	line-height: 1.05;
	flex-wrap: wrap;
	row-gap: 4px;
	max-width: 100%;
}

.x-pg-sales-product-box .prd_desc .prd_price > div:last-child p.fw-bolder .pricespan.discounted-price-display,
.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div p.fw-bolder .pricespan.discounted-price-display,
.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div p.fw-bolder .pricespan.discounted-price-display {
	color: #ee4d2d !important;
	font-size: 1.875rem !important;
	font-weight: 900;
	letter-spacing: -0.5px;
	line-height: 1;
}

.x-pg-sales-product-box .prd_desc .prd_price > div:last-child p.fw-bolder .pricespan.discounted-price-display::before,
.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div p.fw-bolder .pricespan.discounted-price-display::before,
.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div p.fw-bolder .pricespan.discounted-price-display::before {
	content: "$";
	font-size: 0.55em;
	font-weight: 700;
	margin-right: 2px;
	vertical-align: 0.25em;
	color: #ee4d2d;
}

.x-pg-sales-product-box .prd_desc .prd_price > div:last-child > small.price-diff-pill,
.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div > small.price-diff-pill,
.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div > small.price-diff-pill,
.x-pg-sales-product-box .prd_desc .prd_price > div:last-child p.fw-bolder small,
.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div p.fw-bolder small,
.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div p.fw-bolder small {
	color: #c84327 !important;
	background: #ffe2da;
	font-size: 11px !important;
	font-weight: 600;
	padding: 2px 8px;
	border-radius: 999px;
	white-space: nowrap;
	margin-left: 0 !important;
	padding-left: 8px !important;
	display: inline-block;
	align-self: flex-start;
	width: fit-content;
	max-width: 100%;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	margin-top: 4px;
}

.x-pg-sales-product-box .prd_desc .prd_price > div:last-child > small.price-diff-pill .pricespan.price-diff-display,
.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div > small.price-diff-pill .pricespan.price-diff-display,
.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div > small.price-diff-pill .pricespan.price-diff-display,
.x-pg-sales-product-box .prd_desc .prd_price > div:last-child p.fw-bolder small .pricespan.price-diff-display,
.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div p.fw-bolder small .pricespan.price-diff-display,
.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div p.fw-bolder small .pricespan.price-diff-display {
	color: #c84327 !important;
	font-weight: 700;
	font-size: 11px !important;
}

/* === 規則 A：三欄 label 強制頂部對齊（覆寫上方 justify-content: center） === */
.x-pg-sales-product-box .prd_desc .prd_price > div {
	justify-content: flex-start !important;
}

/* === 規則 B：砍價後金額 + 省下 pill 自動換行，個別元素不被擠壓 === */
.x-pg-sales-product-box .prd_desc .prd_price > div:last-child p.fw-bolder,
.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div p.fw-bolder,
.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div p.fw-bolder {
	column-gap: 6px;
}

.x-pg-sales-product-box .prd_desc .prd_price > div:last-child p.fw-bolder .pricespan.discounted-price-display,
.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div p.fw-bolder .pricespan.discounted-price-display,
.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div p.fw-bolder .pricespan.discounted-price-display {
	flex: 0 0 auto;
	white-space: nowrap;
}

.x-pg-sales-product-box .prd_desc .prd_price > div:last-child p.fw-bolder small,
.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div p.fw-bolder small,
.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div p.fw-bolder small {
	flex: 0 0 auto;
}

/* === 規則 D：原價／特價為空字串時，連同 div 與 dashed 分隔線整個隱藏 === */
.x-pg-sales-product-box .prd_desc .prd_price > div:has(.original-price-display:empty),
.x-pg-sales-product-box .prd_desc .prd_price > div:has(.special-price-display:empty) {
	display: none !important;
}

/* === 規則 E：移至檔尾「最終最終覆蓋」段統一處理 baseline 兩列 grid 與 stack-all 兜底 === */

/* === 右：規格 / 數量 / 下單單價（清爽列） === */
.x-pg-sales-product-box .prd_desc_action .product_spec,
.x-pg-sales-product-box .prd_desc_action .product_count,
.x-pg-sales-product-box .prd_desc_action .u_price,
.x-pg-sales-product-box .prd_desc .product_spec,
.x-pg-sales-product-box .prd_desc .product_count,
.x-pg-sales-product-box .prd_desc .u_price {
	border-bottom: 1px solid #f5f5f5;
	padding: 14px 0;
	gap: 16px;
	align-items: center;
	display: flex;
	flex-wrap: nowrap;
}

.x-pg-sales-product-box .prd_desc_action .action_title,
.x-pg-sales-product-box .prd_desc .action_title {
	color: #757575;
	font-size: 13px;
	font-weight: 400;
	flex: 0 0 80px;
	max-width: 80px;
	min-width: 80px;
	margin-bottom: 0;
}

.x-pg-sales-product-box .prd_desc_action .product_spec .form-select,
.x-pg-sales-product-box .prd_desc .product_spec .form-select {
	border-radius: var(--x-pg-radius-sm, 8px);
	border-color: #e7e7e7;
	font-size: 14px;
	padding: 8px 28px 8px 12px;
}

/* 數量加減：併合白底圓角 */
.x-pg-sales-product-box .prd_desc_action .count,
.x-pg-sales-product-box .prd_desc .count {
	border: 1px solid #e7e7e7;
	border-radius: var(--x-pg-radius-sm, 8px);
	display: inline-flex !important;
	gap: 0 !important;
	overflow: hidden;
	background: #fff;
}

.x-pg-sales-product-box .prd_desc_action .count .minus,
.x-pg-sales-product-box .prd_desc_action .count .plus,
.x-pg-sales-product-box .prd_desc .count .minus,
.x-pg-sales-product-box .prd_desc .count .plus {
	border: 0 !important;
	background: #fff !important;
	border-radius: 0 !important;
	padding: 6px 14px !important;
	color: #555;
	font-size: 16px;
}

.x-pg-sales-product-box .prd_desc_action .count .minus:hover,
.x-pg-sales-product-box .prd_desc_action .count .plus:hover,
.x-pg-sales-product-box .prd_desc .count .minus:hover,
.x-pg-sales-product-box .prd_desc .count .plus:hover {
	background-color: #fafafa !important;
}

.x-pg-sales-product-box .prd_desc_action .count input[type=number],
.x-pg-sales-product-box .prd_desc .count input[type=number] {
	border: 0 !important;
	border-left: 1px solid #e7e7e7 !important;
	border-right: 1px solid #e7e7e7 !important;
	border-radius: 0 !important;
	width: 56px !important;
	height: auto;
}

/* 下單單價：幣值小字 + 數字大字（巨頭同款） */
.x-pg-sales-product-box .prd_desc_action .u_price_final,
.x-pg-sales-product-box .prd_desc .u_price_final {
	font-family: inherit !important;
	color: #ee4d2d !important;
	font-size: 0.8125rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.3px;
	display: inline-flex;
	align-items: center;
	gap: 3px;
	line-height: 1;
}

.x-pg-sales-product-box .prd_desc_action .u_price_final .final-price-display,
.x-pg-sales-product-box .prd_desc .u_price_final .final-price-display {
	font-size: 1.75rem !important;
	font-weight: 900 !important;
	letter-spacing: -0.5px;
	line-height: 1;
	color: #ee4d2d !important;
}

/* === 右：按鈕（加入購物車 + 前往結帳，蝦皮配色） === */
.x-pg-sales-product-box .prd_desc_action .button_area,
.x-pg-sales-product-box .prd_desc .button_area {
	gap: 12px;
	margin-top: 24px;
	display: flex !important;
	flex-wrap: nowrap;
}

.x-pg-sales-product-box .prd_desc_action .button_area .button_gap,
.x-pg-sales-product-box .prd_desc .button_area .button_gap {
	flex: 1;
	min-width: 0;
}

.x-pg-sales-product-box .prd_desc_action .button_area .button_gap .btn,
.x-pg-sales-product-box .prd_desc .button_area .button_gap .btn {
	width: 100%;
	font-weight: 500;
	font-size: 15px;
	border-radius: var(--x-pg-radius-sm, 8px);
}

.x-pg-sales-product-box .prd_desc_action .button_area .indicator-label,
.x-pg-sales-product-box .prd_desc .button_area .indicator-label {
	display: inline-flex;
	align-items: center;
}

.x-pg-sales-product-box .prd_desc_action .button_area .indicator-progress,
.x-pg-sales-product-box .prd_desc .button_area .indicator-progress {
	display: none !important;
	align-items: center;
}

.x-pg-sales-product-box .prd_desc_action .button_area .btn[data-kt-indicator="on"] .indicator-label,
.x-pg-sales-product-box .prd_desc .button_area .btn[data-kt-indicator="on"] .indicator-label {
	display: none !important;
}

.x-pg-sales-product-box .prd_desc_action .button_area .btn[data-kt-indicator="on"] .indicator-progress,
.x-pg-sales-product-box .prd_desc .button_area .btn[data-kt-indicator="on"] .indicator-progress {
	display: inline-flex !important;
}

.x-pg-sales-product-box .prd_desc_action .button_area .add-to-cart-btn,
.x-pg-sales-product-box .prd_desc_action .button_area .btn-secondary.add-to-cart-btn,
.x-pg-sales-product-box .prd_desc .button_area .add-to-cart-btn,
.x-pg-sales-product-box .prd_desc .button_area .btn-secondary.add-to-cart-btn {
	background-color: color-mix(in srgb, var(--x-pg-sales-cta-color, #ee4d2d) 8%, #ffffff) !important;
	color: var(--x-pg-sales-cta-color, #ee4d2d) !important;
	border: 1px solid var(--x-pg-sales-cta-color, #ee4d2d) !important;
}

.x-pg-sales-product-box .prd_desc_action .button_area .add-to-cart-btn:hover:not(:disabled),
.x-pg-sales-product-box .prd_desc .button_area .add-to-cart-btn:hover:not(:disabled) {
	background-color: color-mix(in srgb, var(--x-pg-sales-cta-color, #ee4d2d) 18%, #ffffff) !important;
}

.x-pg-sales-product-box .prd_desc_action .button_area .checkout-btn,
.x-pg-sales-product-box .prd_desc_action .button_area .btn-danger.checkout-btn,
.x-pg-sales-product-box .prd_desc .button_area .checkout-btn,
.x-pg-sales-product-box .prd_desc .button_area .btn-danger.checkout-btn {
	background-color: var(--x-pg-sales-cta-color, #ee4d2d) !important;
	border-color: var(--x-pg-sales-cta-color, #ee4d2d) !important;
	color: #fff !important;
}

.x-pg-sales-product-box .prd_desc_action .button_area .checkout-btn:hover:not(:disabled),
.x-pg-sales-product-box .prd_desc .button_area .checkout-btn:hover:not(:disabled) {
	background-color: color-mix(in srgb, var(--x-pg-sales-cta-color, #ee4d2d) 85%, #000000) !important;
	border-color: color-mix(in srgb, var(--x-pg-sales-cta-color, #ee4d2d) 85%, #000000) !important;
}

/* 加購商品：加入購物車（btn-primary）共用 CTA 主色 */
.x-pg-sales-content-row {
	padding: 1.5rem;
}

.x-pg-sales-section-title {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding-bottom: 0.75rem;
	margin-bottom: 1rem;
	border-bottom: 3px solid var(--x-pg-primary, #667eea);
}

.x-pg-sales-section-title i {
	color: var(--x-pg-primary, #667eea);
	font-size: 1.25rem;
}

.x-pg-sales-section-title h3 {
	margin: 0;
	font-size: 1.35rem;
	font-weight: 700;
	letter-spacing: 0;
}

.x-pg-sales-content-row .card__item-prd-action .btn-primary,
.x-pg-sales-content-row [data-sales-merge="sales_addon_products"] .card__item-prd-action .btn-primary {
	background-color: var(--x-pg-sales-cta-color, #ee4d2d) !important;
	border-color: var(--x-pg-sales-cta-color, #ee4d2d) !important;
	color: #fff !important;
}

.x-pg-sales-content-row .card__item-prd-action .btn-primary:hover:not(:disabled),
.x-pg-sales-content-row [data-sales-merge="sales_addon_products"] .card__item-prd-action .btn-primary:hover:not(:disabled) {
	background-color: color-mix(in srgb, var(--x-pg-sales-cta-color, #ee4d2d) 85%, #000000) !important;
	border-color: color-mix(in srgb, var(--x-pg-sales-cta-color, #ee4d2d) 85%, #000000) !important;
}

/* 加購商品：商品速覽（btn-outline-primary）外觀比照「商品詳情 加入購物車」的 outline 樣式（淺底 + CTA 色框/字） */
.x-pg-sales-content-row .card__item-prd-action .btn-outline-primary,
.x-pg-sales-content-row [data-sales-merge="sales_addon_products"] .card__item-prd-action .btn-outline-primary {
	background-color: color-mix(in srgb, var(--x-pg-sales-cta-color, #ee4d2d) 8%, #ffffff) !important;
	color: var(--x-pg-sales-cta-color, #ee4d2d) !important;
	border: 1px solid var(--x-pg-sales-cta-color, #ee4d2d) !important;
}

.x-pg-sales-content-row .card__item-prd-action .btn-outline-primary:hover:not(:disabled),
.x-pg-sales-content-row [data-sales-merge="sales_addon_products"] .card__item-prd-action .btn-outline-primary:hover:not(:disabled) {
	background-color: color-mix(in srgb, var(--x-pg-sales-cta-color, #ee4d2d) 18%, #ffffff) !important;
}

	/* 加購商品標題：可自訂 icon、文字與分隔線顏色。 */
	.x-pg-sales-content-row .x-pg-sales-section-title {
		border-bottom-color: var(--x-pg-sales-addon-divider-color, var(--x-pg-primary, #667eea)) !important;
	}

	.x-pg-sales-content-row .x-pg-sales-section-title,
	.x-pg-sales-content-row [data-sales-merge="sales_addon_products"] {
		width: 100%;
		max-width: 920px;
		margin-right: auto;
		margin-left: auto;
	}

	.x-pg-sales-content-row .x-pg-sales-section-title i {
		color: var(--x-pg-sales-addon-icon-color, var(--x-pg-primary, #667eea)) !important;
	}

	.x-pg-sales-content-row .x-pg-sales-section-title h3 {
		color: var(--x-pg-sales-addon-title-color, inherit) !important;
	}

	/* === RWD：平板 / 手機 === */
@media screen and (max-width: 1024px) {
	.x-pg-sales-content-row {
		padding: 1rem;
	}

	.x-pg-sales-product-box {
		padding-bottom: calc(88px + env(safe-area-inset-bottom)) !important;
	}

	.x-pg-sales-product-box .prd_desc_action .button_area.pc-only,
	.x-pg-sales-product-box .prd_desc .button_area.pc-only {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 1040;
		display: flex !important;
		flex-wrap: nowrap;
		gap: 10px;
		width: 100%;
		margin: 0;
		padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
		background: rgba(255, 255, 255, .96);
		border-top: 1px solid rgba(226, 232, 240, .95);
		box-shadow: 0 -8px 24px rgba(15, 23, 42, .12);
		backdrop-filter: blur(10px);
		box-sizing: border-box;
	}

	.x-pg-sales-product-box .prd_desc_action .button_area.pc-only .button_gap,
	.x-pg-sales-product-box .prd_desc .button_area.pc-only .button_gap {
		flex: 1 1 0;
		width: auto !important;
		max-width: none;
		padding: 0;
	}

	.x-pg-sales-product-box .prd_desc_action .button_area.pc-only .button_gap > span,
	.x-pg-sales-product-box .prd_desc .button_area.pc-only .button_gap > span {
		display: block;
		width: 100%;
	}

	.x-pg-sales-product-box .prd_desc_action .button_area.pc-only .btn,
	.x-pg-sales-product-box .prd_desc .button_area.pc-only .btn {
		min-height: 48px;
		padding-top: .75rem !important;
		padding-bottom: .75rem !important;
	}

	#bioPreviewContent:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-floating-actions,
	.x-pg-page-scroll:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-floating-actions {
		bottom: calc(88px + .75rem + env(safe-area-inset-bottom));
	}

	body:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-copyright-row,
	#bioPreviewContent:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-copyright-row,
	.x-pg-page-scroll:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-copyright-row {
		padding-bottom: calc(88px + .5rem + env(safe-area-inset-bottom)) !important;
	}

	body:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-footer-section:last-child .x-pg-footer,
	#bioPreviewContent:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-footer-section:last-child .x-pg-footer,
	.x-pg-page-scroll:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-footer-section:last-child .x-pg-footer {
		padding-bottom: calc(88px + env(safe-area-inset-bottom)) !important;
	}

}

@media screen and (max-width: 1024px) {
	.x-pg-sales-product-box .prd_first,
	.x-pg-sales-product-box .prd_desc {
		padding-left: 0;
		padding-right: 0;
	}

	.x-pg-sales-product-box .prd_desc .product_name {
		font-size: 1.25rem;
	}

	.x-pg-sales-product-box .prd_desc .prd_price > div:last-child p.fw-bolder .pricespan.discounted-price-display,
	.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div p.fw-bolder .pricespan.discounted-price-display,
	.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div p.fw-bolder .pricespan.discounted-price-display {
		font-size: 1.75rem !important;
	}

	.x-pg-sales-product-box .prd_desc_action .u_price_final,
	.x-pg-sales-product-box .prd_desc .u_price_final {
		font-size: 0.75rem !important;
	}

	.x-pg-sales-product-box .prd_desc_action .u_price_final .final-price-display,
	.x-pg-sales-product-box .prd_desc .u_price_final .final-price-display {
		font-size: 1.5rem !important;
	}
}

/* 平板以下：baseline 仍嘗試維持同一行（縮距縮字），但 JS 套上 stack class 後讓 grid/column 接管 */
@media (max-width: 768px) {
	.x-pg-sales-product-box .prd_desc .basic_sales {
		padding: 14px 14px 10px !important;
	}

	/* baseline 已是 grid 兩列，此處不再 force flex-wrap nowrap */

	.x-pg-sales-product-box .prd_desc .prd_price > div {
		padding: 0 8px !important;
	}

	.x-pg-sales-product-box .prd_desc .prd_price > div:first-child {
		padding-left: 0 !important;
	}

	.x-pg-sales-product-box .prd_desc .prd_price > div:last-child,
	.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div,
	.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div {
		flex: 1 1 auto !important;
		padding: 0 0 0 10px !important;
		margin-top: 0;
		border-top: 0;
	}

	.x-pg-sales-product-box .prd_desc .prd_price > div:not(:last-child) > span,
	.x-pg-sales-product-box .prd_desc .prd_price > div:last-child > span,
	.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div > span,
	.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div > span {
		font-size: 10px !important;
	}

	.x-pg-sales-product-box .prd_desc .prd_price > div:not(:last-child) p {
		font-size: 12px !important;
	}

	.x-pg-sales-product-box .prd_desc .prd_price > div:last-child p.fw-bolder,
	.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div p.fw-bolder,
	.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div p.fw-bolder {
		gap: 4px;
		flex-wrap: wrap !important;
	}

	.x-pg-sales-product-box .prd_desc .prd_price > div:last-child p.fw-bolder .pricespan.discounted-price-display,
	.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div p.fw-bolder .pricespan.discounted-price-display,
	.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div p.fw-bolder .pricespan.discounted-price-display {
		font-size: 1.45rem !important;
	}
}

/* 手機（≤575px）：原價/特價也對齊更緊湊 */
@media (max-width: 575.98px) {
	.x-pg-sales-product-box .prd_desc .basic_sales {
		padding: 12px 10px 10px !important;
	}

	.x-pg-sales-product-box .prd_desc .prd_price {
		gap: 0 !important;
	}

	.x-pg-sales-product-box .prd_desc .prd_price > div {
		padding: 0 6px !important;
	}

	.x-pg-sales-product-box .prd_desc .prd_price > div:last-child,
	.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div,
	.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div {
		padding-left: 8px !important;
	}

	.x-pg-sales-product-box .prd_desc .prd_price > div:last-child p.fw-bolder .pricespan.discounted-price-display,
	.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div p.fw-bolder .pricespan.discounted-price-display,
	.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div p.fw-bolder .pricespan.discounted-price-display {
		font-size: 1.35rem !important;
	}

	.x-pg-sales-product-box .prd_desc .prd_price > div:last-child p.fw-bolder small,
	.x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div p.fw-bolder small,
	.x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div p.fw-bolder small {
		font-size: 10px !important;
		padding: 1px 5px !important;
	}
}

/* === noshow_real / noshow_editor：編輯器 ↔ 輸出 切換 === */
/* 預設（輸出 / 生產環境）：noshow_real 隱藏、noshow_editor 顯示 */
.x-pg-sales-product-box .noshow_real {
	display: none !important;
}

.x-pg-sales-product-box .noshow_editor {
	display: block !important;
}

/* 編輯器預覽（.x-pg-preview-frame 只存在於編輯器）：倒過來 */
.x-pg-preview-frame .x-pg-sales-product-box .noshow_real {
	display: block !important;
}

.x-pg-preview-frame .x-pg-sales-product-box .noshow_editor {
	display: none !important;
}

/* === 模擬示意 hint：套用 countdown-preview-hint 的 pill 樣式 === */
/* 用 .x-pg-sales-preview-hint 為共通鉤子（拳頭商品 + 加購商品兩處 hint
   都同時掛了 countdown-preview-hint 與 x-pg-sales-preview-hint）。
   原 pill 樣式被祖先選擇器限定，這裡用 compound 選擇器一次命中兩處。 */
.countdown-preview-hint.x-pg-sales-preview-hint {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 2px 8px;
	border-radius: 999px;
	font-size: 11px;
	line-height: 1.2;
	background: rgba(0, 0, 0, 0.25);
	color: #fff;
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
	cursor: default;
}

.countdown-preview-hint.x-pg-sales-preview-hint i {
	font-size: 13px;
	opacity: 0.9;
}

.countdown-preview-hint.x-pg-sales-preview-hint span {
	white-space: nowrap;
}

/* === 加購商品（sales-addon-products）模擬示意樣式 === */
/* 從 xlead.css 複製：用於拳頭商品 (one_page_sales) 頁面在編輯器預覽中
   呈現 #sales-addon-products 區塊。實際輸出時由正式加購商品元件載入，
   此處僅為編輯器預覽階段的模擬示意。 */

.pic_67 {
	width: 100%;
	height: 0;
	padding-bottom: 66.6667%;
	overflow: hidden;
	position: relative;
}

.pic_67 img {
	object-fit: cover;
	object-position: top;
	max-width: 100%;
	width: 100%;
	height: 100%;
	position: absolute;
}

.imgcontain {
	object-fit: contain !important;
	width: 100% !important;
	height: 100% !important;
}

.ellipsis {
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	white-space: normal;
	overflow: hidden;
}

.ellipsis1 {
	-webkit-line-clamp: 1;
}

.ellipsis2 {
	-webkit-line-clamp: 2 !important;
}

.addon_buying[data-mode="ON"] {
	display: flex;
}

/* === Bootstrap badge-outline 變體（xlead.css 有，編輯器預覽沒載入需補上） === */
.badge-outline.badge.bg-secondary {
	background-color: white !important;
}

.badge.badge-outline.badge-outline-light {
	color: var(--bs-gray-700);
	border: 1px solid var(--bs-gray-500);
}

/* === 加購商品卡片內：價格列 / 規格列（card__item-prd-title 子元素） === */
.card__item-prd-title__price {
	margin-top: 4px;
}

.card__item-prd-title__price p {
	margin-bottom: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 2px 0;
}

.card__item-prd-title__spec {
	margin-top: 6px;
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
}

.card__item-prd-title__spec .badge {
	font-size: 11px;
	font-weight: 500;
	padding: 3px 8px;
	border-radius: 4px;
}

/* === 商品標籤（prd_highlight + badge-light-danger）=== */
/* xlead.css 有 .prd_highlight 但少了 .badge-light-danger（Metronic 風格 utility）；
   編輯器預覽未引入 Metronic CSS，所以單獨補上，避免標籤看不到。 */
.prd_highlight {
	font-size: 12px;
	font-weight: 700;
	color: #D4601D;
	width: 100%;
}

.prd_highlight span {
	margin-right: 8px;
}

.badge.badge-light-danger {
	color: #f1416c;
	background-color: #fff5f8;
}

/* === 拳頭商品（prd_box）— 預覽切換手機/平板時換行、顯示對應元素 === */
/* 預覽切換是用 .x-pg-preview-frame 加 .tablet / .mobile class 模擬，
   實際 viewport 仍是桌機，所以 Bootstrap 的 col-xl-6 / .pc-only / .tabet_phone-only
   原生 media query 不會觸發；這裡用 .x-pg-preview-frame.tablet/.mobile 為前綴複寫。 */

/* 桌機預覽（無 .tablet/.mobile）：依 xlead 規則，pc-only 顯示、tabet_phone-only 隱藏。
   form_block.css 沒載入 xlead.css，這裡補上 .x-pg-sales-product-box 範圍內的預設值。 */
.x-pg-sales-product-box .tabet_phone-only {
	display: none !important;
}

/* 手機/平板預覽：強制 .prd_box 換行（覆寫上面 flex-wrap:nowrap）。
   原本 @media (max-width:1024px) 才開放 wrap，但編輯器 viewport 永遠是桌機，
   media query 不會觸發 — 所以改用 .x-pg-preview-frame.tablet/.mobile 條件改成 wrap。 */
.x-pg-preview-frame.tablet .x-pg-sales-product-box.prd_box,
.x-pg-preview-frame.tablet .x-pg-sales-product-box .prd_box,
.x-pg-preview-frame.mobile .x-pg-sales-product-box.prd_box,
.x-pg-preview-frame.mobile .x-pg-sales-product-box .prd_box {
	flex-wrap: wrap !important;
}

/* 兩個 .col-xl-6 改成 100%（蓋過 Bootstrap @media (min-width:1200px) .col-xl-6 { width:50% }） */
.x-pg-preview-frame.tablet .x-pg-sales-product-box > .col-xl-6,
.x-pg-preview-frame.mobile .x-pg-sales-product-box > .col-xl-6,
.x-pg-preview-frame.tablet .prd_box > .col-xl-6,
.x-pg-preview-frame.mobile .prd_box > .col-xl-6 {
	flex: 0 0 100% !important;
	width: 100% !important;
	max-width: 100% !important;
}

/* 平板/手機預覽：拿掉 .px-xl-5 在 xl viewport 的 3rem 左右 padding（避免 stack 後過擠），
   改由 .x-pg-sales-product-box 給整塊一個比較舒服的左右 padding（1rem 各邊） */
.x-pg-preview-frame.tablet .x-pg-sales-product-box > .col-xl-6.px-xl-5,
.x-pg-preview-frame.mobile .x-pg-sales-product-box > .col-xl-6.px-xl-5 {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box,
.x-pg-preview-frame.mobile .x-pg-sales-product-box {
	padding-left: 1rem !important;
	padding-right: 1rem !important;
}

.x-pg-preview-frame.tablet .x-pg-sales-content-row,
.x-pg-preview-frame.mobile .x-pg-sales-content-row {
	padding: 1rem;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .prd_first,
.x-pg-preview-frame.mobile .x-pg-sales-product-box .prd_first {
	margin-bottom: 1rem;
}

/* 手機/平板預覽：pc-only 隱藏 / tabet_phone-only 顯示 */
.x-pg-preview-frame.tablet .x-pg-sales-product-box .pc-only,
.x-pg-preview-frame.mobile .x-pg-sales-product-box .pc-only {
	display: none !important;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box,
.x-pg-preview-frame.mobile .x-pg-sales-product-box {
	padding-bottom: 88px !important;
}

.x-pg-preview-frame.tablet:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-copyright-row,
.x-pg-preview-frame.mobile:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-copyright-row {
	padding-bottom: calc(88px + .5rem) !important;
}

.x-pg-preview-frame.tablet:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-footer-section:last-child .x-pg-footer,
.x-pg-preview-frame.mobile:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-footer-section:last-child .x-pg-footer {
	padding-bottom: 88px !important;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .button_area.pc-only,
.x-pg-preview-frame.mobile .x-pg-sales-product-box .button_area.pc-only {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1040;
	display: flex !important;
	flex-wrap: nowrap;
	gap: 10px;
	width: 100%;
	margin: 0;
	padding: 10px 12px;
	background: rgba(255, 255, 255, .96);
	border-top: 1px solid rgba(226, 232, 240, .95);
	box-shadow: 0 -8px 24px rgba(15, 23, 42, .12);
	backdrop-filter: blur(10px);
	box-sizing: border-box;
}

.x-pg-preview-frame.tablet:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-floating-actions,
.x-pg-preview-frame.mobile:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-floating-actions {
	bottom: 5.75rem;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .button_area.pc-only .button_gap,
.x-pg-preview-frame.mobile .x-pg-sales-product-box .button_area.pc-only .button_gap {
	flex: 1 1 0;
	width: auto !important;
	max-width: none;
	padding: 0;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .button_area.pc-only .button_gap > span,
.x-pg-preview-frame.mobile .x-pg-sales-product-box .button_area.pc-only .button_gap > span {
	display: block;
	width: 100%;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .button_area.pc-only .btn,
.x-pg-preview-frame.mobile .x-pg-sales-product-box .button_area.pc-only .btn {
	min-height: 48px;
	padding-top: .75rem !important;
	padding-bottom: .75rem !important;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .tabet_phone-only,
.x-pg-preview-frame.mobile .x-pg-sales-product-box .tabet_phone-only {
	display: flex !important;
}

/* 手機/平板預覽：moreinfo_box 內 .shipping_area / .pay 改成 flex 橫向，
   讓「販售地區/支援付款方式」(.moreinfo_title) 與右側值 (.infolist) 同一行不換行。 */
.x-pg-preview-frame.tablet .x-pg-sales-product-box .moreinfo_box.tabet_phone-only > div,
.x-pg-preview-frame.mobile .x-pg-sales-product-box .moreinfo_box.tabet_phone-only > div {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	gap: 12px;
	padding: 12px 0;
	border-bottom: 1px dashed #f0f0f0;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .moreinfo_box.tabet_phone-only > div:last-child,
.x-pg-preview-frame.mobile .x-pg-sales-product-box .moreinfo_box.tabet_phone-only > div:last-child {
	border-bottom: 0;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .moreinfo_box.tabet_phone-only .moreinfo_title,
.x-pg-preview-frame.mobile .x-pg-sales-product-box .moreinfo_box.tabet_phone-only .moreinfo_title {
	flex: 0 0 92px;
	max-width: 92px;
	min-width: 92px;
	white-space: nowrap;
	margin-bottom: 0;
}

.x-pg-preview-frame.tablet .x-pg-sales-product-box .moreinfo_box.tabet_phone-only .infolist,
.x-pg-preview-frame.mobile .x-pg-sales-product-box .moreinfo_box.tabet_phone-only .infolist {
	flex: 1 1 auto;
	min-width: 0;
}

/* 平板/手機預覽：價格列維持同一行（對應實際 RWD） */
/* baseline 已是 grid 兩列，預覽 frame 不再 force flex-wrap nowrap */

.x-pg-preview-frame.tablet .x-pg-sales-product-box .prd_desc .prd_price > div:last-child,
.x-pg-preview-frame.tablet .x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div,
.x-pg-preview-frame.tablet .x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .prd_desc .prd_price > div:last-child,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div,
.x-pg-preview-frame.mobile .x-pg-sales-product-box .prd_desc .prd_price > div:last-child,
.x-pg-preview-frame.mobile .x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div,
.x-pg-preview-frame.mobile .x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div,
.x-pg-preview-frame.size-mobile .x-pg-sales-product-box .prd_desc .prd_price > div:last-child,
.x-pg-preview-frame.size-mobile .x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div,
.x-pg-preview-frame.size-mobile .x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div {
	flex: 1 1 auto !important;
	align-items: flex-start;
	padding: 0 0 0 10px !important;
	margin-top: 0;
	border-top: 0;
}

/* 平板預覽：最終價字級對應 @media max-width:1024px 的縮減 */
.x-pg-preview-frame.tablet .x-pg-sales-product-box .prd_desc .prd_price > div:last-child p.fw-bolder .pricespan.discounted-price-display,
.x-pg-preview-frame.tablet .x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div p.fw-bolder .pricespan.discounted-price-display,
.x-pg-preview-frame.tablet .x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div p.fw-bolder .pricespan.discounted-price-display,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .prd_desc .prd_price > div:last-child p.fw-bolder .pricespan.discounted-price-display,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div p.fw-bolder .pricespan.discounted-price-display,
.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div p.fw-bolder .pricespan.discounted-price-display {
	font-size: 1.45rem !important;
}

.x-pg-preview-frame.mobile .x-pg-sales-product-box .prd_desc .prd_price > div:last-child p.fw-bolder .pricespan.discounted-price-display,
.x-pg-preview-frame.mobile .x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div p.fw-bolder .pricespan.discounted-price-display,
.x-pg-preview-frame.mobile .x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div p.fw-bolder .pricespan.discounted-price-display,
.x-pg-preview-frame.size-mobile .x-pg-sales-product-box .prd_desc .prd_price > div:last-child p.fw-bolder .pricespan.discounted-price-display,
.x-pg-preview-frame.size-mobile .x-pg-sales-product-box .prd_desc .prd_price #discounted-price-div p.fw-bolder .pricespan.discounted-price-display,
.x-pg-preview-frame.size-mobile .x-pg-sales-product-box .prd_desc .prd_price .discounted-price-div p.fw-bolder .pricespan.discounted-price-display {
	font-size: 1.35rem !important;
}

/* 加購商品 grid 在手機預覽改單欄 */
.x-pg-preview-frame.mobile .x-pg-sales-addon-grid {
	grid-template-columns: 1fr;
}

/* === 拳頭商品 / 小賣場 navbar 右上購物車按鈕 === */
.x-pg-preview-navbar {
	position: relative;
}

.x-pg-preview-navbar .x-pg-nav-cart-area {
	position: absolute;
	top: 50%;
	right: 1rem;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	width: auto;
	max-width: none;
	padding: 0;
	margin: 0;
	z-index: 2;
}

.x-pg-preview-navbar .x-pg-nav-cart-btn {
	position: relative;
	display: block;
	width: 35px;
	height: 35px;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: #fff;
	line-height: 1;
	transition: filter 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.x-pg-preview-navbar .x-pg-nav-cart-btn:hover {
	color: #fff;
	filter: brightness(.94);
	transform: translateY(-1px);
}

.x-pg-preview-navbar .x-pg-nav-cart-btn .symbol,
.x-pg-preview-navbar .x-pg-nav-cart-btn .symbol-35px {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 35px;
	height: 35px;
	flex-shrink: 0;
}

.x-pg-preview-navbar .x-pg-nav-cart-btn .symbol-circle {
	border-radius: 50%;
}

.x-pg-preview-navbar .x-pg-nav-cart-btn .symbol-label {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	border-radius: inherit;
	background: var(--x-pg-nav-cart-color, var(--x-pg-sales-cta-color, #ee4d2d)) !important;
}

.x-pg-preview-navbar .x-pg-nav-cart-btn svg {
	flex-shrink: 0;
}

.x-pg-preview-navbar .x-pg-nav-cart-btn .addhint {
	position: absolute;
	top: -10px;
	right: -10px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background-color: var(--x-pg-nav-cart-count-color, #a72109);
	font-size: 12px;
	font-weight: 300;
	line-height: 1;
	text-align: center;
}

.x-pg-preview-navbar .x-pg-nav-cart-btn i {
	color: #fff;
	font-size: 18px;
	line-height: 1;
}

.x-pg-floating-nav-cart {
	position: fixed !important;
	top: auto !important;
	right: 1.5rem !important;
	bottom: calc(1.5rem + env(safe-area-inset-bottom)) !important;
	left: auto !important;
	inset-inline-start: auto !important;
	inset-inline-end: 1.5rem !important;
	z-index: 1055;
	display: block !important;
	width: 54px;
	height: 54px;
	margin: 0 !important;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(8px) scale(.96);
	transition: opacity .18s ease, visibility .18s ease, transform .18s ease;
}

.x-pg-floating-nav-cart.is-visible {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateY(0) scale(1);
}

.x-pg-floating-nav-cart .x-pg-nav-cart-btn,
.x-pg-preview-navbar .x-pg-floating-nav-cart .x-pg-nav-cart-btn {
	position: relative;
	display: block;
	width: 54px;
	height: 54px;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: #fff;
	line-height: 1;
	box-shadow: 0 14px 32px color-mix(in srgb, var(--x-pg-nav-cart-color, var(--x-pg-sales-cta-color, #ee4d2d)) 34%, transparent);
}

.x-pg-floating-nav-cart .x-pg-nav-cart-btn .symbol,
.x-pg-floating-nav-cart .x-pg-nav-cart-btn .symbol-35px,
.x-pg-preview-navbar .x-pg-floating-nav-cart .x-pg-nav-cart-btn .symbol,
.x-pg-preview-navbar .x-pg-floating-nav-cart .x-pg-nav-cart-btn .symbol-35px {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 54px;
	height: 54px;
	flex-shrink: 0;
}

.x-pg-floating-nav-cart .x-pg-nav-cart-btn .symbol-circle {
	border-radius: 50%;
}

.x-pg-floating-nav-cart .x-pg-nav-cart-btn .symbol-label {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	border-radius: inherit;
	background: var(--x-pg-nav-cart-color, var(--x-pg-sales-cta-color, #ee4d2d)) !important;
}

.x-pg-floating-nav-cart .x-pg-nav-cart-btn svg,
.x-pg-floating-nav-cart .x-pg-nav-cart-btn i,
.x-pg-preview-navbar .x-pg-floating-nav-cart .x-pg-nav-cart-btn svg,
.x-pg-preview-navbar .x-pg-floating-nav-cart .x-pg-nav-cart-btn i {
	width: 24px;
	height: 24px;
	font-size: 24px;
}

.x-pg-floating-nav-cart .x-pg-nav-cart-btn .addhint,
.x-pg-preview-navbar .x-pg-floating-nav-cart .x-pg-nav-cart-btn .addhint {
	position: absolute;
	top: -7px;
	right: -7px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background-color: var(--x-pg-nav-cart-count-color, #a72109);
	font-weight: 700;
	font-size: 12px;
	line-height: 1;
}

body:has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions,
#bioPreviewContent:has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions,
.x-pg-page-scroll:has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions {
	right: 1.5rem;
	bottom: calc(1.5rem + 54px + .75rem + env(safe-area-inset-bottom));
}

@media screen and (max-width: 1024px) {
	body:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-floating-nav-cart,
	#bioPreviewContent:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-floating-nav-cart,
	.x-pg-page-scroll:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-floating-nav-cart {
		bottom: calc(88px + .75rem + env(safe-area-inset-bottom)) !important;
	}

	body:has(.x-pg-sales-product-box .button_area.pc-only):has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions,
	#bioPreviewContent:has(.x-pg-sales-product-box .button_area.pc-only):has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions,
	.x-pg-page-scroll:has(.x-pg-sales-product-box .button_area.pc-only):has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions {
		bottom: calc(88px + .75rem + 54px + .75rem + env(safe-area-inset-bottom));
	}
}

@media screen and (max-width: 1024px) {
	.x-pg-floating-nav-cart {
		right: 1rem !important;
		bottom: calc(1rem + env(safe-area-inset-bottom)) !important;
		left: auto !important;
		inset-inline-end: 1rem !important;
	}

	body:has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions,
	#bioPreviewContent:has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions,
	.x-pg-page-scroll:has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions {
		right: 1rem;
		bottom: calc(1rem + 54px + .5rem + env(safe-area-inset-bottom));
	}
}

@media screen and (max-width: 768px) {
	.x-pg-floating-nav-cart {
		right: .75rem !important;
		bottom: calc(.75rem + env(safe-area-inset-bottom)) !important;
		left: auto !important;
		inset-inline-end: .75rem !important;
	}

	.x-pg-floating-nav-cart .x-pg-nav-cart-btn,
	.x-pg-floating-nav-cart .x-pg-nav-cart-btn .symbol,
	.x-pg-floating-nav-cart .x-pg-nav-cart-btn .symbol-35px,
	.x-pg-preview-navbar .x-pg-floating-nav-cart .x-pg-nav-cart-btn,
	.x-pg-preview-navbar .x-pg-floating-nav-cart .x-pg-nav-cart-btn .symbol,
	.x-pg-preview-navbar .x-pg-floating-nav-cart .x-pg-nav-cart-btn .symbol-35px {
		width: 50px;
		height: 50px;
	}

	body:has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions,
	#bioPreviewContent:has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions,
	.x-pg-page-scroll:has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions {
		right: .75rem;
		bottom: calc(.75rem + 50px + .4rem + env(safe-area-inset-bottom));
	}
}

.x-pg-preview-frame.tablet .x-pg-floating-nav-cart,
.x-pg-preview-frame.size-tablet .x-pg-floating-nav-cart {
	right: 1rem !important;
	bottom: 1rem !important;
	left: auto !important;
	inset-inline-end: 1rem !important;
}

.x-pg-preview-frame.mobile .x-pg-floating-nav-cart,
.x-pg-preview-frame.size-mobile .x-pg-floating-nav-cart {
	right: .75rem !important;
	bottom: .75rem !important;
	left: auto !important;
	inset-inline-end: .75rem !important;
}

.x-pg-preview-frame.tablet:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-floating-nav-cart,
.x-pg-preview-frame.size-tablet:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-floating-nav-cart,
.x-pg-preview-frame.mobile:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-floating-nav-cart,
.x-pg-preview-frame.size-mobile:has(.x-pg-sales-product-box .button_area.pc-only) .x-pg-floating-nav-cart {
	bottom: 5.75rem !important;
}

.x-pg-preview-frame.tablet:has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions,
.x-pg-preview-frame.size-tablet:has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions {
	right: 1rem;
	bottom: calc(1rem + 54px + .5rem);
}

.x-pg-preview-frame.mobile:has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions,
.x-pg-preview-frame.size-mobile:has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions {
	right: .75rem;
	bottom: calc(.75rem + 50px + .4rem);
}

.x-pg-preview-frame.tablet:has(.x-pg-sales-product-box .button_area.pc-only):has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions,
.x-pg-preview-frame.size-tablet:has(.x-pg-sales-product-box .button_area.pc-only):has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions,
.x-pg-preview-frame.mobile:has(.x-pg-sales-product-box .button_area.pc-only):has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions,
.x-pg-preview-frame.size-mobile:has(.x-pg-sales-product-box .button_area.pc-only):has(.x-pg-floating-nav-cart.is-visible) .x-pg-floating-actions {
	bottom: calc(5.75rem + 54px + .5rem);
}

/* === 商品速覽 offcanvas：從 xlead.css 搬入 products-info 會用到的樣式 === */
#products-info {
	z-index: 16000162;
}

#products-info.mw-500px {
	max-width: 500px !important;
}

#products-info .btn-close {
	--bs-btn-close-bg: url("data:image/svg+xml,%3csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M2 3.10683H6.3151V21.8932H2V3.10683ZM8.63019 14.0655H18.5689L13.5995 20.7863L15.2363 23L23 12.5L15.2363 2L13.5995 4.21366L18.5689 10.9345H8.63019V14.0655Z' fill='black'/%3e%3c/svg%3e");
	width: 24px;
	height: 24px;
	padding: 0;
	border-radius: 0;
	background-size: 12px;
}

#products-info .modal-header,
#products-info .modal-footer {
	padding: .65rem 1.75rem;
}

#products-info .modal-body {
	padding-top: 1rem;
	padding-bottom: 1rem;
}

#products-info .borr12 {
	border-radius: 12px;
}

#products-info .fz12 {
	font-size: 12px !important;
}

#products-info .text-fade {
	color: #c9c9c9 !important;
}

#products-info .top-n-10px {
	top: -10px;
}

#products-info .w-40px {
	width: 40px !important;
}

#products-info .flex-center {
	align-items: center;
	justify-content: center;
}

#products-info .symbol {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	position: relative;
}

#products-info .symbol.symbol-35px,
#products-info .symbol-35px {
	width: 35px;
	height: 35px;
}

#products-info .symbol-circle {
	border-radius: 50%;
}

#products-info .symbol-label {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: inherit;
	position: relative;
}

#products-info .symbol-label svg {
	flex-shrink: 0;
}

#products-info #fixed-register-btn {
	border: 0;
	background: transparent;
	line-height: 1;
	position: relative;
}

#products-info .addhint {
	background-color: #a72109;
	right: -10px;
	top: -10px;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	font-weight: 300;
	display: flex;
	align-items: center;
	justify-content: center;
}

#products-info .shopping p {
	margin-bottom: 0;
}

#products-info .prd_box {
	justify-content: stretch;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

#products-info .slick-slider div,
#products-info .slick-list div {
	position: relative;
}

#products-info .slick-slider {
	overflow: hidden;
	border-radius: .625rem;
}

#products-info .slick-slide div div {
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: 66.6667%;
	overflow: hidden;
}

#products-info .slider div {
	cursor: pointer;
}

#products-info .slick-prev,
#products-info .slick-next,
#products-info .slick-arrow.slick-prev,
#products-info .slick-arrow.slick-next {
	height: 100%;
	width: 30px;
	background-color: #e7e7e7ee;
	z-index: 99;
}

#products-info .slick-slider.slick-vertical {
	height: 100%;
}

#products-info .slick-prev:hover,
#products-info .slick-next:hover,
#products-info .slick-prev:focus,
#products-info .slick-next:focus,
#products-info .slick-arrow.slick-prev:hover,
#products-info .slick-arrow.slick-next:hover,
#products-info .slick-arrow.slick-prev:focus,
#products-info .slick-arrow.slick-next:focus {
	background-color: #979797ee;
}

#products-info .slick-prev,
#products-info .slick-arrow.slick-prev {
	left: 0;
	border-top-left-radius: 6px;
	border-bottom-left-radius: 6px;
}

#products-info .slick-next,
#products-info .slick-arrow.slick-next {
	right: 0;
	border-top-right-radius: 6px;
	border-bottom-right-radius: 6px;
}

#products-info .slide-item {
	border: 1px solid #ececec;
	border-radius: 4px;
}

#products-info .slick-arrow::before {
	display: none;
}

#products-info .slide-content img,
#products-info .thumb-content img {
	height: 100%;
	width: 100%;
	object-fit: contain;
}

/* 抽屜內主圖 + 縮圖：grid 兩欄等高，主圖 aspect-ratio 3:2，縮圖自動 stretch 對齊 */
#products-info .slider_box {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 72px;
	gap: 8px;
	align-items: stretch;
}

#products-info .main-slider {
	width: 100% !important;
	min-width: 0;
	padding-right: 0;
}

#products-info .main-slider .slick-list {
	position: relative;
	aspect-ratio: 3 / 2 !important;
	height: auto !important;
	min-height: 0 !important;
	max-height: none !important;
	overflow: hidden !important;
}

/* 偽 fade + 上下滑入動畫：強制所有 slide 疊在 list 內，active 帶垂直滑入 */
#products-info .main-slider .slick-track {
	width: 100% !important;
	height: 100% !important;
	transform: none !important;
	display: block !important;
	min-height: 0 !important;
}

#products-info .main-slider .slick-slide {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	height: 100% !important;
	opacity: 0;
	transform: translateY(-28px);
	transition: opacity 0.32s ease, transform 0.32s ease;
	pointer-events: none;
	z-index: 1;
}

#products-info .main-slider .slick-slide.slick-active,
#products-info .main-slider .slick-slide.slick-current {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
	z-index: 2;
}

#products-info .main-slider .slick-slide > div,
#products-info .main-slider .slick-slide > div > div,
#products-info .main-slider .slide-item,
#products-info .main-slider .slide-content {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;
	max-height: none !important;
}

#products-info .main-slider .slide-content {
	position: relative !important;
}

#products-info .main-slider .slide-content img {
	display: block !important;
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	height: 100% !important;
	max-width: 100% !important;
	max-height: 100% !important;
	object-fit: contain !important;
}

#products-info .sale-info .basic_sales.p-5,
#products-info .basic_sales.p-5,
#products-info .sale-info .basic_sales,
#products-info .basic_sales {
	padding: 14px 18px 12px !important;
}

#products-info .sale-info .basic_sales {
	border-top: 1px dashed #ccc;
	border-bottom: 1px dashed #ccc;
	border-radius: 0 !important;
}

#products-info .sale-info h3 {
	margin-top: -15px !important;
}

#products-info .sale-info h3+p {
	margin-top: 2rem !important;
}

#products-info .js_del::after {
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 50%;
	left: 0;
	background-color: #e57738;
}

#products-info .pricespan.js_del::after,
#products-info .prd_price .js_del::after {
	background-color: #bbb;
}

#products-info .prd_price {
	background-color: #fff;
}

#products-info .prd_price div {
	min-width: 60px;
	padding-right: 1rem;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
}

#products-info .prd_price p:not(.fs-3) {
	font-size: 1.1rem;
}

#products-info .prd_price div span:not(.pricespan) {
	color: #777;
	font-size: 1rem;
}

#products-info .prd_price div p:not(.fw-bolder) {
	color: #bbb;
}

#products-info .prd_price div:not(:first-child) {
	border-left: 1px solid rgb(224, 224, 224);
}

#products-info .product_count,
#products-info .u_price,
#products-info .product_spec {
	display: flex;
	padding: 16px;
	padding-left: 0;
	gap: 16px;
	border-bottom: 1px solid #e7e7e7;
	align-items: baseline;
}

#products-info .product_count .form-select {
	max-width: 240px;
	padding-top: .5rem;
	padding-bottom: 0.5rem;
}

#products-info .product_count .count {
	display: flex;
	align-items: stretch;
	gap: 4px;
}

#products-info .product_spec p,
#products-info .product_count p,
#products-info .u_price p:not(.u_price_final) {
	font-size: 12px;
	color: #979797;
	margin-bottom: 0 !important;
}

#products-info .product_count .d-inline-flex {
	gap: 8px;
}

#products-info .product_count .d-inline-flex:has(> .count):not(:has(.form-select)) {
	display: inline-flex !important;
	width: auto !important;
	max-width: max-content !important;
	flex: 0 0 auto !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
}

#products-info .product_count .d-inline-flex:has(> .count):not(:has(.form-select)) > .count {
	display: inline-grid !important;
	grid-template-columns: 32px 44px 32px;
	width: auto !important;
	min-width: 108px;
	max-width: 108px;
	height: 34px;
	flex: 0 0 auto !important;
	gap: 0;
	overflow: hidden;
	border: 1px solid #d7dce4;
	border-radius: 6px;
	background: #fff;
}

#products-info .product_count .d-inline-flex:has(> .count):not(:has(.form-select)) > .count .minus,
#products-info .product_count .d-inline-flex:has(> .count):not(:has(.form-select)) > .count .plus {
	width: 32px !important;
	min-width: 32px !important;
	max-width: 32px !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
}

#products-info .product_count .d-inline-flex:has(> .count):not(:has(.form-select)) > .count .border {
	width: 44px !important;
	min-width: 44px !important;
	max-width: 44px !important;
	border-top: 0 !important;
	border-bottom: 0 !important;
	border-radius: 0 !important;
}

#products-info .u_price_final {
	font-size: 22px;
	color: #e57738;
	font-weight: 900;
	font-family: "Arial Black";
	display: inline-flex;
	align-items: center;
}

#products-info .action_title,
#products-info .moreinfo_title {
	max-width: 18%;
	min-width: 72px;
}

#products-info .moreinfo_title,
#products-info .action_title {
	width: 14%;
	color: #979797;
	font-size: 12px;
}

#products-info .action_title {
	width: 100%;
	max-width: 180px;
}

#products-info .count span {
	cursor: pointer;
}

#products-info .minus,
#products-info .plus {
	background: #f2f2f2;
	border-radius: 4px;
	border: 1px solid #ddd;
	display: inline-flex;
	text-align: center;
	padding: 6px 1rem;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	font-weight: bold;
	vertical-align: middle;
}

#products-info .count input[type=number] {
	width: 60px;
	text-align: center;
	font-size: 1rem;
	border: 1px solid #ddd;
	border-radius: 4px;
	display: inline-block;
	vertical-align: middle;
	-moz-appearance: textfield;
}

#products-info .count input[type=number]::-webkit-inner-spin-button,
#products-info .count input[type=number]::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

#products-info .plus:hover,
#products-info .minus:hover {
	cursor: pointer;
	background-color: #f0f0f0;
	border-radius: 3px;
}

#products-info .indication {
	display: flex;
	align-items: center;
	padding-bottom: .75rem;
	border-bottom: 1px dashed #ddd;
	justify-content: center;
	color: #666;
	z-index: 1;
}

#products-info .indication::before {
	content: url('../img/hook/activity/Calendar.svg');
	width: 24px;
	position: relative;
	left: 0;
	top: 3px;
	margin-right: 8px;
}

#products-info .xt_area {
	width: 100%;
}

@media screen and (max-width: 1280px) {
	#products-info .product_count .form-select {
		max-width: 100%;
	}

	#products-info .count {
		width: 140px;
	}

	#products-info .count+.flex-grow-1 {
		max-width: calc(100% - 140px);
	}
}

@media screen and (max-width: 1024px) {
	#products-info .product_count .form-select {
		width: 100%;
		min-width: 240px;
	}

	#products-info .prd_price p:not(.fs-3) {
		font-size: .8rem;
	}

	#products-info .product_count,
	#products-info .u_price {
		padding-top: 12px;
		padding-bottom: 12px;
	}
}

@media screen and (max-width: 576px) {
	#products-info .slider_box {
		width: 100%;
		max-width: calc(100vw - 38px);
		margin-left: auto;
		margin-right: auto;
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) 72px;
		gap: 6px;
		align-items: start;
	}

	#products-info .product_count .form-select {
		width: 100%;
		min-width: 240px;
	}

	#products-info .product_count,
	#products-info .u_price {
		flex-wrap: wrap;
	}
}

/* === 商品速覽 offcanvas：加購商品巨頭同款視覺優化 === */
#products-info.offcanvas {
	--x-pg-quick-cta: var(--x-pg-sales-cta-color, #ee4d2d);
	--x-pg-quick-cta-dark: color-mix(in srgb, var(--x-pg-quick-cta) 86%, #000);
	--x-pg-quick-soft: color-mix(in srgb, var(--x-pg-quick-cta) 8%, #fff);
	--x-pg-quick-border: rgba(15, 23, 42, .08);
	--x-pg-quick-muted: #8a94a6;
	--x-pg-quick-slider-height: clamp(230px, 58vw, 320px);
	--x-pg-quick-slider-thumb-width: 72px;
	--x-pg-quick-slider-thumb-height: 48px;
	overflow: hidden;
	border-left: 0;
	background: #f5f6f8;
	color: #111827;
	box-shadow: -18px 0 46px rgba(15, 23, 42, .18);
}

#products-info .offcanvas-header {
	position: sticky;
	top: 0;
	z-index: 6;
	min-height: 62px;
	padding: 14px 18px !important;
	border-bottom: 1px solid var(--x-pg-quick-border) !important;
	background: #fff;
	box-shadow: 0 1px 0 rgba(15, 23, 42, .03);
}

#products-info .offcanvas-header h5,
#products-info h5[id^="offcanvasRightLabel"] {
	margin: 0;
	color: #111827;
	font-size: 17px;
	font-weight: 850;
	line-height: 1.35;
}

#products-info .offcanvas-header .gap-5 {
	gap: 14px !important;
}

#products-info .btn-close {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background-size: 12px;
	opacity: .72;
	transition: background-color .15s ease, opacity .15s ease;
}

#products-info .btn-close:hover,
#products-info .btn-close:focus {
	background-color: #f3f4f6;
	opacity: 1;
	box-shadow: none;
}

#products-info #fixed-register-btn .symbol-label {
	background: var(--x-pg-quick-cta) !important;
	box-shadow: 0 8px 18px color-mix(in srgb, var(--x-pg-quick-cta) 28%, transparent);
}

#products-info .addhint {
	right: -8px;
	top: -8px;
	width: 22px;
	height: 22px;
	border: 2px solid #fff;
	background: #d0011b;
	font-size: 11px !important;
	font-weight: 800;
	line-height: 18px;
	box-shadow: 0 4px 10px rgba(208, 1, 27, .24);
}

#products-info .offcanvas-body {
	padding: 12px 10px !important;
	background:
		linear-gradient(180deg, rgba(238, 77, 45, .06), rgba(238, 77, 45, 0) 118px),
		#f5f6f8;
}

#products-info .shopping,
#products-info .main {
	border: 1px solid var(--x-pg-quick-border);
	border-radius: 8px !important;
	background: #fff !important;
	box-shadow: 0 2px 10px rgba(15, 23, 42, .05) !important;
}

#products-info .shopping {
	margin-top: 0 !important;
	padding: 18px 14px !important;
}

#products-info .shopping .container {
	max-width: none;
	padding-right: 0;
	padding-left: 0;
}

	#products-info .product_name {
		margin: 0 0 14px;
		color: #111827;
		font-size: 22px;
		font-weight: 850;
	line-height: 1.35;
		letter-spacing: 0;
	}

	#products-info .basic_sales {
		margin: 18px 0 14px;
		padding: 14px 18px 12px !important;
		border: 1px solid #fbd5cb;
		border-radius: 12px !important;
		background: linear-gradient(135deg, #fff5f3 0%, #ffe9e3 100%) !important;
		box-shadow: 0 2px 8px rgba(238, 77, 45, 0.06);
	}

	#products-info .basic_sales > h3 {
		top: -13px !important;
		left: 16px;
		display: inline-flex !important;
		align-items: center;
		gap: 4px;
		margin: 0;
		padding: 5px 12px !important;
		border-radius: 4px !important;
		background: linear-gradient(135deg, #ff5b3c 0%, #ee4d2d 100%) !important;
		color: #fff !important;
		font-size: 12px !important;
		font-weight: 700;
		letter-spacing: 0.5px;
		line-height: 1.2;
		box-shadow: 0 3px 8px rgba(238, 77, 45, 0.28) !important;
	}

	#products-info .basic_sales > h3 i,
	#products-info .basic_sales > h3 svg {
		width: 11px !important;
		height: 11px !important;
		margin-right: 0;
		flex: 0 0 auto;
	}

	#products-info .basic_sales .prd_price {
		display: flex !important;
		flex-wrap: nowrap;
		align-items: flex-start;
		justify-content: flex-start !important;
		gap: 10px 0;
		margin: 8px 0 0 !important;
		padding: 0 !important;
		overflow: hidden;
		border-radius: 0 !important;
		background: transparent !important;
	}

	#products-info .basic_sales .prd_price > div {
		display: flex;
		flex: 0 0 auto !important;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start !important;
		min-width: 0;
		padding: 0 12px !important;
		gap: 2px;
		border-left: 0 !important;
		white-space: nowrap;
	}

	#products-info .basic_sales .prd_price > div:first-child {
		padding-left: 0 !important;
	}

	#products-info .basic_sales .prd_price > div:not(:last-child) {
		border-right: 1px dashed #f3c0b3;
	}

	#products-info .basic_sales .prd_price > div:not(:last-child) > span,
	#products-info .basic_sales .prd_price > div:last-child > span,
	#products-info .basic_sales .prd_price #discounted-price-div > span,
	#products-info .basic_sales .prd_price .discounted-price-div > span {
		color: #8a8a8a !important;
		font-size: 11px !important;
		font-weight: 500;
		letter-spacing: 0.3px;
		line-height: 1.2;
	}

	#products-info .basic_sales .prd_price > div:not(:last-child) p {
		margin: 0;
		color: #9a9a9a !important;
		font-size: 14px !important;
		line-height: 1.2;
	}

	#products-info .basic_sales .prd_price > div:not(:last-child) p span {
		color: #9a9a9a !important;
		text-decoration: line-through;
		text-decoration-color: #c4544c;
		text-decoration-thickness: 1px;
	}

	#products-info .basic_sales .prd_price > div:not(:last-child) .js_del::after {
		display: none;
	}

	#products-info .basic_sales .prd_price > div:last-child,
	#products-info .basic_sales .prd_price #discounted-price-div,
	#products-info .basic_sales .prd_price .discounted-price-div {
		flex: 1 1 auto !important;
		padding: 0 0 0 16px !important;
		overflow: hidden;
	}

	#products-info .basic_sales .prd_price > div:last-child p.fw-bolder,
	#products-info .basic_sales .prd_price #discounted-price-div p.fw-bolder,
	#products-info .basic_sales .prd_price .discounted-price-div p.fw-bolder {
		display: inline-flex;
		flex-wrap: wrap;
		align-items: baseline;
		max-width: 100%;
		margin: 0;
		column-gap: 6px;
		row-gap: 4px;
		color: #ee4d2d !important;
		line-height: 1.05;
	}

	#products-info .basic_sales .prd_price > div:last-child p.fw-bolder > .pricespan:first-child,
	#products-info .basic_sales .prd_price #discounted-price-div p.fw-bolder .pricespan.discounted-price-display,
	#products-info .basic_sales .prd_price .discounted-price-div p.fw-bolder .pricespan.discounted-price-display {
		flex: 0 0 auto;
		color: #ee4d2d !important;
		font-size: 1.75rem !important;
		font-weight: 900;
		letter-spacing: -0.5px;
		line-height: 1;
		white-space: nowrap;
	}

	#products-info .basic_sales .prd_price > div:last-child p.fw-bolder > .pricespan:first-child::before,
	#products-info .basic_sales .prd_price #discounted-price-div p.fw-bolder .pricespan.discounted-price-display::before,
	#products-info .basic_sales .prd_price .discounted-price-div p.fw-bolder .pricespan.discounted-price-display::before {
		content: "$";
		margin-right: 2px;
		color: #ee4d2d;
		font-size: 0.55em;
		font-weight: 700;
		vertical-align: 0.25em;
	}

	#products-info .basic_sales .prd_price > div:last-child p.fw-bolder small,
	#products-info .basic_sales .prd_price #discounted-price-div p.fw-bolder small,
	#products-info .basic_sales .prd_price .discounted-price-div p.fw-bolder small {
		display: inline-block;
		flex: 0 0 auto;
		width: fit-content;
		max-width: 100%;
		min-width: 0;
		margin-top: 4px;
		margin-left: 0 !important;
		padding: 2px 8px !important;
		overflow: hidden;
		border-radius: 999px;
		background: #ffe2da;
		color: #c84327 !important;
		font-size: 11px !important;
		font-weight: 600;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	#products-info .basic_sales .prd_price > div:last-child p.fw-bolder small .pricespan,
	#products-info .basic_sales .prd_price #discounted-price-div p.fw-bolder small .pricespan,
	#products-info .basic_sales .prd_price .discounted-price-div p.fw-bolder small .pricespan {
		color: #c84327 !important;
		font-size: 11px !important;
		font-weight: 700;
	}

	#products-info .slider-container,
	#products-info .slider_box {
		width: 100% !important;
		max-width: 100% !important;
	}

#products-info .main-slider {
	padding-right: 10px;
}

#products-info .main-slider .slick-list,
#products-info .slide-item {
	border: 1px solid #eef0f4;
	border-radius: 8px;
	background: #fff;
}

#products-info .main-slider .slick-list {
	overflow: hidden;
}

#products-info .slide-item {
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .6);
}

#products-info .slide-content {
	background:
		linear-gradient(180deg, #fff 0%, #fafafa 100%);
}

#products-info .slide-content img,
#products-info .thumb-content img {
	object-fit: contain;
	object-position: center;
}

/* 縮圖紅框統一在 .thumb-content 上（見下方 9324 區段），避免雙重邊框 */

#products-info .slick-prev,
#products-info .slick-next,
#products-info .slick-arrow.slick-prev,
#products-info .slick-arrow.slick-next {
	border: 0;
	background-color: rgba(17, 24, 39, .08);
	color: #4b5563;
	transition: background-color .15s ease, color .15s ease;
}

#products-info .slick-prev:hover,
#products-info .slick-next:hover,
#products-info .slick-prev:focus,
#products-info .slick-next:focus,
#products-info .slick-arrow.slick-prev:hover,
#products-info .slick-arrow.slick-next:hover,
#products-info .slick-arrow.slick-prev:focus,
#products-info .slick-arrow.slick-next:focus {
	background-color: color-mix(in srgb, var(--x-pg-quick-cta) 16%, #fff);
	color: var(--x-pg-quick-cta);
	outline: none;
}

#products-info .main {
	margin-top: 12px !important;
	padding: 18px !important;
}

#products-info .indication {
	justify-content: flex-start;
	margin: 0 0 14px;
	padding-bottom: 12px;
	border-bottom: 1px dashed #e5e7eb;
	color: #111827;
	font-size: 17px;
	font-weight: 850;
	line-height: 1.35;
}

#products-info .indication::before {
	content: "";
	width: 4px;
	height: 18px;
	margin-right: 9px;
	border-radius: 999px;
	background: var(--x-pg-quick-cta);
}

#products-info .xt_area {
	color: #374151;
	font-size: 14px;
	line-height: 1.75;
}

#products-info .xt_area p + p {
	margin-top: 12px;
}

#products-info .xt_area img {
	display: block;
	width: 100%;
	border-radius: 0;
}

#products-info .offcanvas-footer {
	position: relative;
	bottom: 0;
	z-index: 7;
	padding: 8px 14px calc(8px + env(safe-area-inset-bottom)) !important;
	border-top: 1px solid var(--x-pg-quick-border);
	background: rgba(255, 255, 255, .96);
	box-shadow: none !important;
	backdrop-filter: blur(10px);
}

.prd_box .offcanvas-footer:not(.x-pg-quick-footer-fixed),
#products-info .prd_box .offcanvas-footer:not(.x-pg-quick-footer-fixed) {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

#products-info .offcanvas-footer.x-pg-quick-footer-fixed,
.offcanvas .offcanvas-footer.x-pg-quick-footer-fixed:has(#addon-product-form),
.offcanvas .offcanvas-footer.x-pg-quick-footer-fixed:has(#sales-addon-drawer-product-form),
.offcanvas .offcanvas-footer.x-pg-quick-footer-fixed:has(#sales-shop-product-form) {
	position: fixed !important;
	left: var(--x-pg-quick-footer-left, auto) !important;
	right: auto !important;
	bottom: var(--x-pg-quick-footer-bottom, 0px) !important;
	width: var(--x-pg-quick-footer-width, 100%) !important;
	max-width: var(--x-pg-quick-footer-width, 100%) !important;
	box-sizing: border-box;
	box-shadow: 0 -12px 30px rgba(15, 23, 42, .1) !important;
}

#products-info .offcanvas-body,
.offcanvas:has(.offcanvas-footer #addon-product-form) .offcanvas-body,
.offcanvas:has(.offcanvas-footer #sales-addon-drawer-product-form) .offcanvas-body,
.offcanvas:has(.offcanvas-footer #sales-shop-product-form) .offcanvas-body {
	padding-bottom: var(--x-pg-quick-footer-space, 12px) !important;
}

#products-info :is(#addon-product-form, #sales-addon-drawer-product-form, #sales-shop-product-form) {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	column-gap: 12px;
	row-gap: 8px;
	align-items: end;
	width: 100%;
}

#products-info :is(#addon-product-form, #sales-addon-drawer-product-form, #sales-shop-product-form) > input[type="hidden"] {
	display: none !important;
}

#products-info #sales-shop-product-form > div:not(.u_price):not(.product_spec):not(.product_count),
#products-info #sales-addon-drawer-product-form > div:not(.u_price):not(.product_spec):not(.product_count),
#products-info #addon-product-form > div:not(.u_price):not(.product_spec):not(.product_count) {
	display: contents;
}

#products-info .offcanvas-footer .product_spec {
	display: grid !important;
	grid-column: 1 / -1;
	grid-template-columns: 44px minmax(0, 1fr);
	gap: 10px;
	align-items: center !important;
	margin: 0;
	padding: 0 0 8px;
	border-bottom: 1px solid #edf0f4;
}

#products-info .offcanvas-footer .product_count {
	display: grid !important;
	grid-column: 1;
	grid-template-columns: 1fr;
	align-items: end !important;
	justify-self: start;
	min-width: 108px;
	margin: 0;
	padding: 0;
	border-bottom: 0 !important;
}

#products-info .offcanvas-footer .product_count:empty {
	display: none !important;
}

#products-info .offcanvas-footer .product_spec .action_title,
#products-info .offcanvas-footer .product_count .action_title,
#products-info .offcanvas-footer .u_price .action_title {
	width: auto;
	max-width: none;
	min-width: 0;
	margin: 0 0 4px !important;
	color: #6b7280;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .02em;
	line-height: 1.2;
}

#products-info .offcanvas-footer .product_spec .action_title {
	margin-bottom: 0 !important;
}

#products-info .offcanvas-footer .product_count .d-inline-flex {
	display: flex !important;
	align-items: center !important;
	gap: 0;
	width: auto !important;
	min-width: 0;
}

#products-info .offcanvas-footer .form-select {
	width: 100%;
	max-width: none;
	min-width: 0 !important;
	height: 34px;
	padding: 6px 30px 6px 10px;
	border: 1px solid #d7dce4;
	border-radius: 6px;
	background-color: #fff;
	color: #111827;
	font-size: 13px;
	font-weight: 650;
	box-shadow: none;
}

#products-info .offcanvas-footer .form-select:focus {
	border-color: var(--x-pg-quick-cta);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--x-pg-quick-cta) 14%, transparent);
}

#products-info .offcanvas-footer .count {
	display: inline-grid;
	grid-template-columns: 32px 44px 32px;
	align-items: stretch;
	width: auto;
	height: 34px;
	gap: 0;
	overflow: hidden;
	border: 1px solid #d7dce4;
	border-radius: 6px;
	background: #fff;
}

#products-info .offcanvas-footer .minus,
#products-info .offcanvas-footer .plus {
	min-width: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: #f8fafc;
	color: #111827;
	font-size: 18px;
	font-weight: 850;
	line-height: 1;
	transition: background-color .15s ease, color .15s ease;
}

#products-info .offcanvas-footer .minus {
	border-right: 1px solid #e5e7eb;
}

#products-info .offcanvas-footer .plus {
	border-left: 1px solid #e5e7eb;
}

#products-info .offcanvas-footer .plus:hover,
#products-info .offcanvas-footer .minus:hover {
	border-radius: 0;
	background: var(--x-pg-quick-soft);
	color: var(--x-pg-quick-cta);
}

#products-info .offcanvas-footer .count .border {
	width: 44px !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: #fff;
	color: #111827;
	font-size: 14px;
	font-weight: 850;
}

#products-info .offcanvas-footer .count [contenteditable="true"] {
	width: 100%;
	min-width: 0 !important;
	line-height: 32px;
	text-align: center;
}

#products-info .offcanvas-footer > form > .u_price,
#products-info .offcanvas-footer .u_price.justify-content-between {
	display: grid !important;
	grid-column: 2 / 4;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 10px;
	align-items: center !important;
	margin: 0;
	padding: 0;
	border-bottom: 0 !important;
}

#products-info .offcanvas-footer .u_price:has(> .d-inline-flex > .count) {
	display: flex !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 12px !important;
	grid-column: 1 / -1;
	width: 100%;
	min-width: 0;
}

#products-info .offcanvas-footer .u_price:has(> .d-inline-flex > .count) > .flex-grow-1,
#products-info .offcanvas-footer .u_price:has(> .d-inline-flex > .count) > div:first-child {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	overflow: hidden;
}

#products-info .offcanvas-footer .u_price:has(> .d-inline-flex > .count) > .flex-grow-1 p,
#products-info .offcanvas-footer .u_price:has(> .d-inline-flex > .count) > div:first-child p {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	padding-right: 0 !important;
}

#products-info .offcanvas-footer .u_price:has(> .d-inline-flex > .count) > .d-inline-flex {
	flex: 0 0 auto !important;
	min-width: 0 !important;
}

#products-info .offcanvas-footer .u_price:has(> .d-inline-flex > .count) > .btn.u_price {
	flex: 0 0 auto !important;
	min-width: 108px !important;
	white-space: nowrap;
}

#products-info .offcanvas-footer .u_price p {
	margin: 0;
}

#products-info .offcanvas-footer .u_price_final {
	padding-left: 6px !important;
	color: var(--x-pg-quick-cta);
	font-family: Arial, "Helvetica Neue", sans-serif;
	font-size: 1.35rem !important;
	font-weight: 950;
	line-height: 1.1;
	letter-spacing: 0;
	white-space: nowrap;
}

#products-info .offcanvas-footer .u_price_final .final-price-currency,
#products-info .offcanvas-footer .u_price_final .price-currency,
#products-info .offcanvas-footer .u_price_final .currency {
	font-size: 0.75rem !important;
	font-weight: 650 !important;
	letter-spacing: .02em;
	line-height: 1;
}

#products-info .offcanvas-footer .u_price_final .final-price-display,
#products-info .offcanvas-footer .u_price_final .price-display {
	font-size: 1.35rem !important;
	font-weight: 950 !important;
	line-height: 1;
}

#products-info .offcanvas-footer .text-fade {
	color: #9ca3af !important;
	font-size: 0.75rem;
	font-weight: 650;
}

#products-info .offcanvas-footer .btn.u_price {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-width: 108px;
	min-height: 36px;
	margin: 0;
	padding: 0 16px;
	border: 0;
	border-radius: 6px;
	background: var(--x-pg-quick-cta);
	color: #fff;
	font-size: 14px;
	font-weight: 850;
	line-height: 1.2;
	box-shadow: 0 10px 22px color-mix(in srgb, var(--x-pg-quick-cta) 28%, transparent);
	transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
}

#products-info .offcanvas-footer .btn.u_price:hover,
#products-info .offcanvas-footer .btn.u_price:focus {
	filter: brightness(.96);
	box-shadow: 0 12px 26px color-mix(in srgb, var(--x-pg-quick-cta) 34%, transparent);
	transform: translateY(-1px);
}

#products-info .offcanvas-footer .btn.u_price:active {
	transform: translateY(0);
}

@media screen and (max-width: 575.98px) {
	#products-info.offcanvas,
	#products-info.offcanvas-end,
	#products-info.offcanvas-start {
		width: 95vw !important;
		max-width: 95vw !important;
	}

	#products-info .offcanvas-header {
		padding-right: 14px !important;
		padding-left: 14px !important;
	}

	#products-info .offcanvas-body {
		padding-right: 8px !important;
		padding-left: 8px !important;
		padding-bottom: 12px !important;
	}

	#products-info .shopping {
		padding: 14px 10px !important;
	}

		#products-info .product_name {
			font-size: 20px;
		}

		#products-info .basic_sales {
			padding: 18px 10px 12px !important;
		}

		#products-info .basic_sales .prd_price {
			gap: 0 !important;
		}

		#products-info .basic_sales .prd_price > div {
			padding: 0 6px !important;
		}

		#products-info .basic_sales .prd_price > div:first-child {
			padding-left: 0 !important;
		}

		#products-info .basic_sales .prd_price > div:last-child,
		#products-info .basic_sales .prd_price #discounted-price-div,
		#products-info .basic_sales .prd_price .discounted-price-div {
			padding-left: 8px !important;
		}

		#products-info .basic_sales .prd_price > div:not(:last-child) > span,
		#products-info .basic_sales .prd_price > div:last-child > span,
		#products-info .basic_sales .prd_price #discounted-price-div > span,
		#products-info .basic_sales .prd_price .discounted-price-div > span {
			font-size: 10px !important;
		}

		#products-info .basic_sales .prd_price > div:not(:last-child) p {
			font-size: 12px !important;
		}

		#products-info .basic_sales .prd_price > div:last-child p.fw-bolder > .pricespan:first-child,
		#products-info .basic_sales .prd_price #discounted-price-div p.fw-bolder .pricespan.discounted-price-display,
		#products-info .basic_sales .prd_price .discounted-price-div p.fw-bolder .pricespan.discounted-price-display {
			font-size: 1.45rem !important;
		}

		#products-info .main {
			padding: 15px !important;
		}

	#products-info .offcanvas-footer {
		padding: 6px 10px calc(6px + env(safe-area-inset-bottom)) !important;
	}

	#products-info .prd_box .offcanvas-footer:not(.x-pg-quick-footer-fixed) {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	#products-info :is(#addon-product-form, #sales-addon-drawer-product-form, #sales-shop-product-form) {
		column-gap: 8px;
		row-gap: 6px;
	}

	#products-info .offcanvas-footer .product_spec {
		grid-template-columns: minmax(0, 1fr);
		gap: 0;
		padding-bottom: 6px;
	}

	#products-info .offcanvas-footer .product_spec .action_title,
	#products-info .offcanvas-footer .u_price .action_title {
		display: none !important;
	}

	#products-info .offcanvas-footer .product_count {
		min-width: 98px;
	}

	#products-info .offcanvas-footer .product_count .d-inline-flex {
		gap: 0;
		align-items: center !important;
	}

	#products-info .offcanvas-footer > form > .u_price,
	#products-info .offcanvas-footer .u_price.justify-content-between {
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 8px;
		align-items: center !important;
	}

	#products-info .offcanvas-footer .u_price:has(> .d-inline-flex > .count) {
		gap: 6px !important;
	}

	#products-info .offcanvas-footer .u_price:has(> .d-inline-flex > .count) .u_price_final {
		font-size: 1rem !important;
	}

	#products-info .offcanvas-footer .u_price:has(> .d-inline-flex > .count) .u_price_currency {
		font-size: 0.72rem !important;
	}

	#products-info .offcanvas-footer .u_price:has(> .d-inline-flex > .count) .count {
		grid-template-columns: 26px 32px 26px;
	}

	#products-info .offcanvas-footer .u_price:has(> .d-inline-flex > .count) .count .border {
		width: 32px !important;
	}

	#products-info .offcanvas-footer .u_price:has(> .d-inline-flex > .count) > .btn.u_price {
		min-width: 96px !important;
		padding: 0 10px;
	}

	#products-info .offcanvas-footer .form-select {
		height: 32px;
		padding: 5px 28px 5px 9px;
		font-size: 12px;
	}

	#products-info .offcanvas-footer .count {
		width: auto;
		flex: 0 0 auto;
		grid-template-columns: 30px 38px 30px;
		height: 32px;
	}

	#products-info .offcanvas-footer .count .border {
		width: 38px !important;
		font-size: 13px;
	}

	#products-info .offcanvas-footer .count [contenteditable="true"] {
		line-height: 30px;
	}

	#products-info .offcanvas-footer .u_price_final {
		font-size: 1.15rem !important;
	}

	#products-info .offcanvas-footer .u_price_final .final-price-currency,
	#products-info .offcanvas-footer .u_price_final .price-currency,
	#products-info .offcanvas-footer .u_price_final .currency {
		font-size: 0.68rem !important;
	}

	#products-info .offcanvas-footer .u_price_final .final-price-display,
	#products-info .offcanvas-footer .u_price_final .price-display {
		font-size: 1.15rem !important;
	}

	#products-info .offcanvas-footer .text-fade {
		display: none !important;
	}

	#products-info .offcanvas-footer .btn.u_price {
		width: auto;
		min-width: 112px;
		min-height: 34px;
		padding: 0 14px;
		font-size: 13px;
		white-space: nowrap;
	}
}

@media screen and (max-width: 380px) {
	#products-info .offcanvas-footer .product_count .d-inline-flex {
		gap: 6px;
	}

	#products-info .offcanvas-footer .count {
		grid-template-columns: 28px 34px 28px;
	}

	#products-info .offcanvas-footer .count .border {
		width: 34px !important;
	}

	#products-info .offcanvas-footer .btn.u_price {
		min-width: 96px;
		padding: 0 10px;
	}

	#products-info .offcanvas-footer .u_price_final,
	#products-info .offcanvas-footer .u_price_final .final-price-display,
	#products-info .offcanvas-footer .u_price_final .price-display {
		font-size: 1.05rem !important;
	}
}

/* === 加入購物車 Toast 通知（add_cart_toast） === */
.toast_pic {
	width: 100%;
	height: 0;
	padding-bottom: 66.6667%;
	overflow: hidden;
	position: relative;
}

.toast_img {
	position: relative;
	height: 0;
	overflow: hidden;
}

.toast_img img {
	object-fit: cover;
	object-position: top;
	max-width: 100%;
	width: 100%;
	height: 100%;
	position: absolute;
}

.add_cart_toast {
	background-color: #fcece2;
	position: relative;
	z-index: 100;
	border: 0 !important;
	--bs-toast-border-width: 0;
	--bs-toast-border-color: transparent;
	--bs-toast-box-shadow: none;
	box-shadow: none;
	overflow: hidden;
}

.add_cart_toast .toast-body {
	padding: 1rem 1.5rem;
}

.add_cart_toast .d-flex {
	position: relative;
	align-items: center;
}

.add_cart_toast .text {
	display: flex;
	align-items: center;
	padding: .5rem 3rem .5rem 1rem;
	color: #363535;
}

.add_cart_toast .btn-close {
	position: absolute;
	right: .25rem;
	top: .25rem;
	width: 2rem;
	height: 2rem;
	padding: 0;
	border: 0;
	border-radius: 50%;
	opacity: .72;
	box-shadow: none;
	background-color: transparent;
	--bs-btn-close-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23363535'%3e%3cpath d='M2.146 2.146a.5.5 0 0 1 .708 0L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8 2.146 2.854a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
	background-image: var(--bs-btn-close-bg);
	background-size: .875rem .875rem;
	transition: background-color .15s ease, opacity .15s ease;
}

.add_cart_toast .btn-close:hover,
.add_cart_toast .btn-close:focus {
	background-color: rgba(255, 255, 255, .55);
	opacity: 1;
	box-shadow: none;
}

/* === 加購商品卡片清單（item-prd-box / card__item-prd / sp-prd-box） === */

body.x-pg-addon-product-modal-open > .modal-backdrop.show,
body.x-pg-sales-product-modal-open > .modal-backdrop.show {
	display: none !important;
	pointer-events: none !important;
}

#product-modal.modal.show {
	z-index: 16000240 !important;
	background-color: rgba(15, 23, 42, .42) !important;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}

#product-modal .modal-dialog {
	width: calc(100vw - 32px);
	max-width: 560px;
	width: min(560px, calc(100vw - 32px));
	margin-right: auto;
	margin-left: auto;
}

#product-modal .modal-content {
	overflow: hidden;
	border: 0;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 18px 48px rgba(15, 23, 42, .24);
}

#product-modal .modal-header {
	position: relative;
	padding: 16px 20px 12px;
	border-bottom: 1px solid rgba(15, 23, 42, .08);
	background: #fff;
}

#product-modal .modal-title {
	margin: 0;
	color: #111827;
	font-size: 18px;
	font-weight: 800;
	line-height: 1.35;
}

#product-modal .btn-close {
	width: 34px;
	height: 34px;
	padding: 0;
	border-radius: 50%;
	background-size: 12px;
	opacity: .72;
	transition: background-color .15s ease, opacity .15s ease;
}

#product-modal .btn-close:hover,
#product-modal .btn-close:focus {
	background-color: #f3f4f6;
	opacity: 1;
	box-shadow: none;
}

#product-modal .modal-body {
	padding: 0;
	background: #fff;
}

#product-modal .modal-body > .bg-light-danger {
	margin: 0;
	padding: 14px 18px 16px !important;
	background: #fff !important;
}

#product-modal .modal-body .fz12.text-muted {
	display: inline-flex;
	margin-bottom: 6px;
	color: #757575 !important;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: .02em;
}

#product-modal .modal-body h3 {
	margin: 0 0 14px;
	color: #111827;
	font-size: 21px;
	font-weight: 800;
	line-height: 1.3;
}

#product-modal .sale-info {
	margin: 18px 0 14px;
}

#product-modal .basic_sales,
#product-modal .basic_sales.bg-light-danger,
#product-modal .basic_sales.bg-light-danger.p-5,
#product-modal .sale-info .basic_sales,
#product-modal .sale-info .basic_sales.bg-light-danger,
#product-modal .sale-info .basic_sales.bg-light-danger.p-5 {
	margin: 0;
	padding: 8px 18px 10px !important;
	min-height: 0 !important;
	height: auto !important;
	border: 1px solid #fbd5cb !important;
	border-radius: 12px !important;
	background: linear-gradient(135deg, #fff5f3 0%, #ffe9e3 100%) !important;
	box-shadow: 0 2px 8px rgba(238, 77, 45, 0.06);
}

#product-modal .sale-info .basic_sales > h3 {
	top: -13px !important;
	left: 16px;
	display: inline-flex !important;
	align-items: center;
	gap: 4px;
	margin: 0 !important;
	padding: 5px 12px !important;
	border-radius: 4px !important;
	background: linear-gradient(135deg, #ff5b3c 0%, #ee4d2d 100%) !important;
	color: #fff !important;
	font-size: 12px !important;
	font-weight: 700;
	letter-spacing: .5px;
	line-height: 1.2;
	box-shadow: 0 3px 8px rgba(238, 77, 45, 0.28) !important;
}

#product-modal .sale-info .basic_sales > h3 i,
#product-modal .sale-info .basic_sales > h3 svg {
	flex: 0 0 auto;
	width: 11px !important;
	height: 11px !important;
	margin-right: 0;
}

#product-modal .sale-info .basic_sales .prd_price {
	display: flex !important;
	flex-wrap: nowrap !important;
	align-items: flex-start !important;
	justify-content: flex-start !important;
	gap: 0 !important;
	margin: 8px 0 0 !important;
	padding: 0 !important;
	overflow: hidden;
	border-radius: 0 !important;
	background: transparent !important;
}

#product-modal .sale-info .basic_sales .prd_price > div {
	display: flex !important;
	flex: 0 0 auto !important;
	flex-direction: column !important;
	align-items: flex-start !important;
	justify-content: flex-start !important;
	min-width: 0 !important;
	width: auto !important;
	padding: 0 12px !important;
	gap: 2px;
	border-left: 0 !important;
	white-space: nowrap !important;
}

#product-modal .sale-info .basic_sales .prd_price > div:first-child {
	padding-left: 0 !important;
}

#product-modal .sale-info .basic_sales .prd_price > div:not(:last-child) {
	border-right: 1px dashed #f3c0b3 !important;
}

#product-modal .sale-info .basic_sales .prd_price > div:not(:last-child) > span,
#product-modal .sale-info .basic_sales .prd_price > div:last-child > span,
#product-modal .sale-info .basic_sales .prd_price #discounted-price-div > span,
#product-modal .sale-info .basic_sales .prd_price .discounted-price-div > span {
	color: #8a8a8a !important;
	font-size: 11px !important;
	font-weight: 500;
	letter-spacing: .3px;
	line-height: 1.2;
}

#product-modal .sale-info .basic_sales .prd_price > div:not(:last-child) p {
	margin: 0;
	color: #9a9a9a !important;
	font-size: 14px !important;
	line-height: 1.2;
}

#product-modal .sale-info .basic_sales .prd_price > div:not(:last-child) p span {
	color: #9a9a9a !important;
	text-decoration: line-through;
	text-decoration-color: #c4544c;
	text-decoration-thickness: 1px;
}

#product-modal .sale-info .basic_sales .prd_price > div:not(:last-child) .js_del::after {
	display: none;
}

#product-modal .sale-info .basic_sales .prd_price > div:last-child,
#product-modal .sale-info .basic_sales .prd_price #discounted-price-div,
#product-modal .sale-info .basic_sales .prd_price .discounted-price-div {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	padding: 0 0 0 16px !important;
	overflow: hidden;
}

#product-modal .sale-info .basic_sales .prd_price > div:last-child p.fw-bolder,
#product-modal .sale-info .basic_sales .prd_price #discounted-price-div p.fw-bolder,
#product-modal .sale-info .basic_sales .prd_price .discounted-price-div p.fw-bolder {
	display: inline-flex !important;
	flex-wrap: wrap !important;
	align-items: baseline !important;
	max-width: 100%;
	margin: 0;
	column-gap: 6px;
	row-gap: 4px;
	color: #ee4d2d !important;
	line-height: 1.05;
}

#product-modal .sale-info .basic_sales .prd_price > div:last-child p.fw-bolder > .pricespan:first-child,
#product-modal .sale-info .basic_sales .prd_price #discounted-price-div p.fw-bolder .pricespan.discounted-price-display,
#product-modal .sale-info .basic_sales .prd_price .discounted-price-div p.fw-bolder .pricespan.discounted-price-display {
	flex: 0 0 auto;
	color: #ee4d2d !important;
	font-size: 1.75rem !important;
	font-weight: 900;
	letter-spacing: 0;
	line-height: 1;
	white-space: nowrap;
}

#product-modal .sale-info .basic_sales .prd_price > div:last-child p.fw-bolder > .pricespan:first-child::before,
#product-modal .sale-info .basic_sales .prd_price #discounted-price-div p.fw-bolder .pricespan.discounted-price-display::before,
#product-modal .sale-info .basic_sales .prd_price .discounted-price-div p.fw-bolder .pricespan.discounted-price-display::before {
	content: "$";
	margin-right: 2px;
	color: #ee4d2d;
	font-size: .55em;
	font-weight: 700;
	vertical-align: .25em;
}

#product-modal .sale-info .basic_sales .prd_price > div:last-child p.fw-bolder small,
#product-modal .sale-info .basic_sales .prd_price #discounted-price-div p.fw-bolder small,
#product-modal .sale-info .basic_sales .prd_price .discounted-price-div p.fw-bolder small {
	display: inline-block;
	flex: 0 0 auto;
	width: fit-content;
	max-width: 100%;
	min-width: 0;
	margin-top: 4px;
	margin-left: 0 !important;
	padding: 2px 8px !important;
	overflow: hidden;
	border-radius: 999px;
	background: #ffe2da;
	color: #c84327 !important;
	font-size: 11px !important;
	font-weight: 600;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#product-modal .sale-info .basic_sales .prd_price > div:last-child p.fw-bolder small .pricespan,
#product-modal .sale-info .basic_sales .prd_price #discounted-price-div p.fw-bolder small .pricespan,
#product-modal .sale-info .basic_sales .prd_price .discounted-price-div p.fw-bolder small .pricespan {
	color: #c84327 !important;
	font-size: 11px !important;
	font-weight: 700;
}

#product-modal .product_count,
#product-modal .product_spec {
	display: flex !important;
	flex-wrap: nowrap;
	align-items: center;
	gap: 16px;
	margin: 0;
	padding: 14px 0;
	border-bottom: 1px solid #f5f5f5;
	background: #fff;
	box-shadow: none;
}

#product-modal .product_count .action_title,
#product-modal .product_spec .action_title {
	flex: 0 0 80px;
	width: 80px;
	max-width: 80px;
	min-width: 80px;
	margin: 0 !important;
	color: #757575;
	font-size: 13px;
	font-weight: 400;
}

#product-modal .product_count .d-inline-flex,
#product-modal .product_spec .flex-grow-1 {
	display: flex !important;
	flex: 1 1 auto;
	min-width: 0;
	align-items: center;
}

#product-modal .product_count .d-inline-flex {
	flex-wrap: nowrap !important;
	gap: 10px;
}

#product-modal .product_count .form-select {
	flex: 1 1 auto;
	min-width: 0 !important;
}

#product-modal .product_count .count {
	flex: 0 0 auto;
}

#product-modal .form-select {
	width: 100%;
	max-width: none;
	min-height: 40px;
	padding: 8px 34px 8px 12px;
	border: 1px solid #e7e7e7;
	border-radius: var(--x-pg-radius-sm, 8px);
	background-color: #fff;
	color: #111827;
	font-size: 14px;
	font-weight: 500;
	box-shadow: none;
}

#product-modal .form-select:focus {
	border-color: var(--x-pg-sales-cta-color, #ee4d2d);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--x-pg-sales-cta-color, #ee4d2d) 16%, transparent);
}

#product-modal .count {
	display: inline-flex !important;
	align-items: center;
	gap: 0;
	min-height: 40px;
	border: 1px solid #e7e7e7;
	border-radius: var(--x-pg-radius-sm, 8px);
	background: #fff;
	overflow: hidden;
}

#product-modal .count .minus,
#product-modal .count .plus {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
	padding: 6px 14px !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: #fff !important;
	color: #555;
	font-size: 16px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	user-select: none;
	transition: background-color .15s ease, color .15s ease;
}

#product-modal .count .minus:hover,
#product-modal .count .plus:hover {
	background-color: #fafafa !important;
	color: #555;
}

#product-modal .count .border {
	width: 56px !important;
	min-width: 0;
	border: 0 !important;
	border-left: 1px solid #e7e7e7 !important;
	border-right: 1px solid #e7e7e7 !important;
	border-radius: 0 !important;
	background: #fff;
	color: #111827;
	font-size: 14px;
	font-weight: 600;
}

#product-modal .count [contenteditable="true"] {
	min-width: 0 !important;
	width: 100%;
	text-align: center;
	line-height: 38px;
}

#product-modal .modal-footer {
	padding: 0;
	border-top: 1px solid rgba(15, 23, 42, .08);
	background: #fff;
}

#product-modal .modal-footer > .u_price {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 14px;
	align-items: center !important;
	margin: 0;
	padding: 16px 20px;
	border: 0;
}

#product-modal .modal-footer .u_price > div {
	min-width: 0;
}

#product-modal .modal-footer .action_title {
	width: auto;
	max-width: none;
	margin: 0 0 2px !important;
	color: #757575;
	font-size: 13px;
	font-weight: 400;
}

#product-modal .modal-footer p {
	display: inline-flex !important;
	align-items: center !important;
	flex-wrap: wrap !important;
	gap: 6px !important;
	margin: 0 !important;
}

#product-modal .modal-footer p > .ps-1 {
	padding-left: 0 !important;
}

#product-modal .u_price_currency {
	color: #757575 !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	line-height: 1 !important;
	letter-spacing: .3px !important;
}

#product-modal .u_price_final {
	display: inline-block;
	padding-left: 0 !important;
	color: var(--x-pg-sales-cta-color, #ee4d2d) !important;
	font-family: inherit !important;
	font-size: 1.75rem !important;
	font-weight: 900 !important;
	line-height: 1 !important;
	letter-spacing: 0 !important;
}

#product-modal .u_price_final .final-price-display,
#product-modal .u_price_final .price-display {
	color: var(--x-pg-sales-cta-color, #ee4d2d) !important;
	font-size: 1.75rem !important;
	font-weight: 900 !important;
	letter-spacing: -.5px;
	line-height: 1;
}

#product-modal .text-fade {
	color: #9ca3af !important;
	font-size: 13px;
}

#product-modal .modal-footer .btn.u_price {
	min-width: 132px;
	min-height: 44px;
	margin: 0;
	padding: 0 24px;
	border: 0;
	border-radius: var(--x-pg-radius-sm, 8px);
	background: var(--x-pg-sales-cta-color, #ee4d2d);
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	box-shadow: 0 10px 22px color-mix(in srgb, var(--x-pg-sales-cta-color, #ee4d2d) 28%, transparent);
	transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
}

#product-modal .modal-footer .btn.u_price:hover,
#product-modal .modal-footer .btn.u_price:focus {
	filter: brightness(.96);
	box-shadow: 0 12px 26px color-mix(in srgb, var(--x-pg-sales-cta-color, #ee4d2d) 34%, transparent);
	transform: translateY(-1px);
}

#product-modal .modal-footer .btn.u_price:active {
	transform: translateY(0);
}

@media screen and (max-width: 575.98px) {
	#product-modal .modal-dialog {
		width: calc(100vw - 20px);
		margin: 10px auto;
	}

	#product-modal .modal-header {
		padding: 16px 16px 12px;
	}

	#product-modal .modal-body > .bg-light-danger {
		padding: 16px !important;
	}

	#product-modal .modal-body h3 {
		font-size: 20px;
	}

	#product-modal .sale-info {
		margin: 16px 0 12px;
	}

	#product-modal .sale-info .basic_sales {
		padding: 18px 10px 12px !important;
	}

	#product-modal .sale-info .basic_sales .prd_price > div {
		padding: 0 6px !important;
	}

	#product-modal .sale-info .basic_sales .prd_price > div:first-child {
		padding-left: 0 !important;
	}

	#product-modal .sale-info .basic_sales .prd_price > div:last-child,
	#product-modal .sale-info .basic_sales .prd_price #discounted-price-div,
	#product-modal .sale-info .basic_sales .prd_price .discounted-price-div {
		padding-left: 8px !important;
	}

	#product-modal .sale-info .basic_sales .prd_price > div:not(:last-child) > span,
	#product-modal .sale-info .basic_sales .prd_price > div:last-child > span,
	#product-modal .sale-info .basic_sales .prd_price #discounted-price-div > span,
	#product-modal .sale-info .basic_sales .prd_price .discounted-price-div > span {
		font-size: 10px !important;
	}

	#product-modal .sale-info .basic_sales .prd_price > div:not(:last-child) p {
		font-size: 12px !important;
	}

	#product-modal .sale-info .basic_sales .prd_price > div:last-child p.fw-bolder > .pricespan:first-child,
	#product-modal .sale-info .basic_sales .prd_price #discounted-price-div p.fw-bolder .pricespan.discounted-price-display,
	#product-modal .sale-info .basic_sales .prd_price .discounted-price-div p.fw-bolder .pricespan.discounted-price-display {
		font-size: 1.45rem !important;
	}

	#product-modal .product_count,
	#product-modal .product_spec {
		align-items: flex-start;
		gap: 10px;
	}

	#product-modal .product_count {
		display: block !important;
	}

	#product-modal .product_count .action_title,
	#product-modal .product_spec .action_title {
		flex-basis: 52px;
		width: 52px;
		max-width: 52px;
		min-width: 52px;
		padding-top: 8px;
	}

	#product-modal .product_count .action_title {
		width: auto;
		max-width: none;
		min-width: 0;
		margin-bottom: 8px !important;
		padding-top: 0;
	}

	#product-modal .product_count .d-inline-flex {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 8px;
		align-items: center;
	}

	#product-modal .count {
		width: auto;
	}

	#product-modal .count .border {
		width: 56px !important;
	}

	#product-modal .modal-footer > .u_price {
		grid-template-columns: 1fr;
		gap: 12px;
		padding: 14px 16px 16px;
	}

	#product-modal .modal-footer .btn.u_price {
		width: 100%;
	}
}

/* 卡片基本外觀 */
.card__item-prd.card {
	box-shadow: 0px 4px 6px rgba(0, 0, 0, .05);
	outline: 1px solid #eee;
}

.card__item-prd.card:hover {
	box-shadow: 2px 7px 10px rgba(0, 0, 0, .05);
	transition: all 0.3s ease-out;
}

.card__item-prd.card .pic_67 img {
	object-position: center;
}

/* 容器：水平排列 + 包覆控制 */
.item-prd-box .css-wrap {
	flex-wrap: wrap;
}

.addon_buying .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-x-scroll,
.addon_buying[data-mode="OFF"] {
	display: none;
}

.sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap {
	justify-content: center;
}

/* === LIST-ROW 模式（橫式：圖左、文右） === */
.item-prd-box[data-mode="LIST-ROW"] .size__item-prd {
	width: 80%;
	margin: auto;
}

.offcanvas .item-prd-box[data-mode="LIST-ROW"] .size__item-prd {
	width: 100%;
}

.sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .size__item-prd {
	width: 85%;
}

.item-prd-box[data-mode="LIST-ROW"] .size__item-prd .card__item-prd {
	flex-direction: row;
	padding: 1rem;
	flex-wrap: wrap;
	align-items: center;
	border-color: #f1f3f5;
	outline-color: #f4f5f7;
}

.item-prd-box[data-mode="LIST-ROW"] .pic_67 {
	width: 120px;
	padding-bottom: 80px;
}

.sp-prd-box[data-mode="LIST-ROW"] .pic_67 {
	width: 180px;
	padding-bottom: 120px;
}

.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-title {
	padding-bottom: 4px;
	flex-grow: 1;
	padding-right: 1rem;
	max-width: 83%;
}

.item-prd-box[data-mode="LIST-ROW"] .card-body {
	width: calc(100% - 120px);
	display: flex;
	padding-top: 0;
	padding-bottom: 0;
	align-items: center;
}

.sp-prd-box[data-mode="LIST-ROW"] .card-body {
	width: calc(100% - 180px);
}

.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action {
	min-width: 140px;
	flex-direction: column;
}

.sp-prd-box[data-mode="LIST-ROW"] .card__item-prd-action {
	min-width: 140px;
}

/* 加購商品 LIST-ROW：比主商品更精簡，避免加購卡片搶走主商品視覺重量 */
#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .css-wrap {
	gap: 12px !important;
}

#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .size__item-prd {
	width: min(72%, 720px);
}

#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd {
	padding: 10px 12px;
	border-color: #f1f3f5;
	outline-color: #f4f5f7;
	border-radius: 6px;
	box-shadow: 0 2px 8px rgba(15, 23, 42, .05);
}

#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .pic_67 {
	width: 132px;
	padding-bottom: 88px;
}

#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-body {
	width: calc(100% - 132px);
	padding: 0 0 0 12px;
	gap: 10px;
}

#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-title {
	max-width: none;
	padding-right: 8px;
	padding-bottom: 0;
}

#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-title {
	margin-bottom: 4px;
	font-size: 15px;
	line-height: 1.35;
}

#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-text {
	margin-bottom: 4px;
	line-height: 1.35;
}

#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-title__spec .badge {
	padding: 3px 7px;
	font-size: 11px;
	font-weight: 600;
}

#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action {
	width: 112px;
	min-width: 112px;
	gap: 6px !important;
}

#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn {
	min-height: 34px;
	padding: 6px 10px !important;
	border-radius: 6px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
}

#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action svg {
	width: 16px;
	height: 16px;
}

/* === LIST / LIST-COL 模式（直式：圖上、文下） === */
.sp-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) {
	width: 89%;
	margin: 0 auto;
}

.item-prd-box.sp-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .card__item-prd-action .btn {
	padding-left: 8px !important;
	padding-right: 8px !important;
}

.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
	width: 25%;
}

.sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
	width: 23%;
}

.offcanvas .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
	width: calc(50% - 1rem);
	padding-right: 4px;
	padding-left: 4px;
}

.offcanvas .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .carousel-item .row {
	gap: 1rem;
	justify-content: center;
}

.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .card__item-prd {
	height: 100%;
}

.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .card-body {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .card__item-prd-action {
	padding-top: 8px;
}

.offcanvas .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .card__item-prd-action {
	flex-direction: column;
}

/* #sales-addon-products 的 LIST 模式：商品卡片維持橫向滑動 */
#sales-addon-products .item-prd-box[data-mode="LIST"] {
	position: relative;
	max-width: 100%;
	overflow: hidden;
}

#sales-addon-products .item-prd-box[data-mode="LIST"] .css-x-scroll,
#sales-addon-products .item-prd-box[data-mode="LIST"] > .px-4.py-8 {
	display: block;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x proximity;
	scroll-padding-inline: 1rem;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
	scrollbar-color: color-mix(in srgb, var(--x-pg-sales-cta-color, #ee4d2d) 42%, #cfd4dc) transparent;
}

#sales-addon-products .item-prd-box[data-mode="LIST"] .css-x-scroll::-webkit-scrollbar,
#sales-addon-products .item-prd-box[data-mode="LIST"] > .px-4.py-8::-webkit-scrollbar {
	height: 7px;
}

#sales-addon-products .item-prd-box[data-mode="LIST"] .css-x-scroll::-webkit-scrollbar-track,
#sales-addon-products .item-prd-box[data-mode="LIST"] > .px-4.py-8::-webkit-scrollbar-track {
	background: transparent;
}

#sales-addon-products .item-prd-box[data-mode="LIST"] .css-x-scroll::-webkit-scrollbar-thumb,
#sales-addon-products .item-prd-box[data-mode="LIST"] > .px-4.py-8::-webkit-scrollbar-thumb {
	background: color-mix(in srgb, var(--x-pg-sales-cta-color, #ee4d2d) 42%, #cfd4dc);
	border-radius: 999px;
}

#sales-addon-products .item-prd-box[data-mode="LIST"] .css-wrap {
	flex-wrap: nowrap;
	justify-content: flex-start;
	width: max-content;
	min-width: 100%;
	overflow: visible;
	padding: 0;
}

#sales-addon-products .item-prd-box[data-mode="LIST"] .size__item-prd {
	flex: 0 0 clamp(180px, 24vw, 260px);
	width: clamp(180px, 24vw, 260px);
	min-width: 0;
	scroll-snap-align: start;
}

#sales-addon-products .item-prd-box[data-mode="LIST"] .x-pg-addon-scroll-btn {
	position: absolute;
	top: 50%;
	z-index: 3;
	display: grid;
	width: 32px;
	height: 32px;
	place-items: center;
	border-radius: 50%;
	background: rgba(255, 255, 255, .92);
	box-shadow: 0 8px 22px rgba(24, 28, 50, .16);
	color: var(--x-pg-sales-cta-color, #ee4d2d);
	font-size: 18px;
	font-weight: 700;
	line-height: 1;
	border: 0;
	cursor: pointer;
	transform: translateY(-50%);
	transition: opacity .15s ease, transform .15s ease, box-shadow .15s ease;
}

#sales-addon-products .item-prd-box[data-mode="LIST"] .x-pg-addon-scroll-btn:hover {
	box-shadow: 0 10px 26px rgba(24, 28, 50, .22);
	transform: translateY(-50%) scale(1.04);
}

#sales-addon-products .item-prd-box[data-mode="LIST"] .x-pg-addon-scroll-btn:disabled {
	opacity: .35;
	cursor: default;
}

#sales-addon-products .item-prd-box[data-mode="LIST"] .x-pg-addon-scroll-btn[hidden] {
	display: none;
}

#sales-addon-products .item-prd-box[data-mode="LIST"] .x-pg-addon-scroll-btn:disabled:hover {
	box-shadow: 0 8px 22px rgba(24, 28, 50, .16);
	transform: translateY(-50%);
}

#sales-addon-products .item-prd-box[data-mode="LIST"] .x-pg-addon-scroll-btn--prev {
	left: 8px;
}

#sales-addon-products .item-prd-box[data-mode="LIST"] .x-pg-addon-scroll-btn--next {
	right: 8px;
}

/* === 已選取商品（offcanvas 商品挑選器） === */
.card__item-prd.selected-prd {
	outline: 2px solid var(--bs-danger-active);
	position: relative;
}

.selected-prd::after {
	content: '';
	position: absolute;
	top: 5px;
	left: 5px;
	width: 28px;
	height: 28px;
	z-index: 2;
	background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 24 24" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2"><g transform="matrix(1.04201,0,0,1.04201,-1.03245,-0.767114)"><circle cx="12.507" cy="12.252" r="11.036" fill="rgb(246,175,114)"/></g><g transform="matrix(0.798773,0,0,0.799061,2.06385,3.15504)"><path d="M21,16L7,16C6.735,16 6.48,15.895 6.293,15.707C6.105,15.52 6,15.265 6,15C6,14.735 6.105,14.48 6.293,14.293C6.48,14.105 6.735,14 7,14L17.44,14C18.109,14 18.758,13.777 19.285,13.365C19.813,12.954 20.187,12.379 20.35,11.73L22,5.24C22.038,5.092 22.041,4.938 22.01,4.789C21.978,4.64 21.914,4.5 21.82,4.38C21.723,4.257 21.598,4.158 21.455,4.092C21.313,4.026 21.157,3.995 21,4L6.76,4C6.554,3.416 6.172,2.911 5.667,2.553C5.162,2.195 4.559,2.002 3.94,2L3,2C2.735,2 2.48,2.105 2.293,2.293C2.105,2.48 2,2.735 2,3C2,3.265 2.105,3.52 2.293,3.707C2.48,3.895 2.735,4 3,4L3.94,4C4.168,3.993 4.392,4.065 4.574,4.203C4.756,4.342 4.885,4.538 4.94,4.76L5,5.24L6.73,12C5.934,12.036 5.186,12.386 4.648,12.974C4.111,13.562 3.829,14.339 3.865,15.135C3.901,15.931 4.251,16.68 4.839,17.217C5.427,17.754 6.204,18.036 7,18L7.18,18C7.016,18.453 6.963,18.939 7.026,19.417C7.089,19.895 7.267,20.351 7.543,20.745C7.82,21.14 8.188,21.462 8.615,21.685C9.043,21.907 9.518,22.023 10,22.023C10.482,22.023 10.957,21.907 11.385,21.685C11.812,21.462 12.18,21.14 12.457,20.745C12.733,20.351 12.911,19.895 12.974,19.417C13.037,18.939 12.985,18.453 12.82,18L15.18,18C15.016,18.453 14.963,18.939 15.026,19.417C15.089,19.895 15.267,20.351 15.543,20.745C15.82,21.14 16.188,21.462 16.615,21.685C17.043,21.907 17.518,22.023 18,22.023C18.482,22.023 18.957,21.907 19.385,21.685C19.812,21.462 20.18,21.14 20.457,20.745C20.733,20.351 20.911,19.895 20.974,19.417C21.037,18.939 20.985,18.453 20.82,18L21,18C21.265,18 21.52,17.895 21.707,17.707C21.895,17.52 22,17.265 22,17C22,16.735 21.895,16.48 21.707,16.293C21.52,16.105 21.265,16 21,16ZM19.72,6L18.41,11.24C18.355,11.462 18.226,11.658 18.044,11.797C17.862,11.935 17.638,12.007 17.41,12L8.78,12L7.28,6L19.72,6ZM10,20C9.802,20 9.609,19.941 9.444,19.831C9.28,19.722 9.152,19.565 9.076,19.383C9,19.2 8.981,18.999 9.019,18.805C9.058,18.611 9.153,18.433 9.293,18.293C9.433,18.153 9.611,18.058 9.805,18.019C9.999,17.981 10.2,18 10.383,18.076C10.565,18.152 10.722,18.28 10.832,18.444C10.941,18.609 11,18.802 11,19C11,19.265 10.895,19.52 10.707,19.707C10.52,19.895 10.265,20 10,20ZM18,20C17.802,20 17.609,19.941 17.444,19.831C17.28,19.722 17.152,19.565 17.076,19.383C17,19.2 16.981,18.999 17.019,18.805C17.058,18.611 17.153,18.433 17.293,18.293C17.433,18.153 17.611,18.058 17.805,18.019C17.999,17.981 18.2,18 18.383,18.076C18.565,18.152 18.722,18.28 18.831,18.444C18.941,18.609 19,18.802 19,19C19,19.265 18.895,19.52 18.707,19.707C18.52,19.895 18.265,20 18,20Z" fill="white" fill-rule="nonzero"/></g><g transform="matrix(1.52824,0,0,1.52824,-12.5298,-3.12443)"><circle cx="19.732" cy="6.182" r="3.873" fill="rgb(255,118,0)"/></g><g transform="matrix(1.36021,0,0,1.36021,-7.81971,-1.10423)"><path d="M16.498,6.226C16.188,5.917 16.188,5.415 16.498,5.105C16.807,4.796 17.309,4.796 17.619,5.105C17.619,5.105 18.137,5.623 18.137,5.623L20.174,3.586C20.483,3.277 20.985,3.277 21.295,3.586C21.604,3.896 21.604,4.398 21.295,4.707L18.697,7.305C18.388,7.614 17.886,7.614 17.576,7.305L16.498,6.226Z" fill="white"/></g></svg>');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

/* === RWD：≤ 1280px === */
@media screen and (max-width: 1280px) {
	.item-prd-box.sp-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .card__item-prd-action .btn {
		padding-left: 1.75rem !important;
		padding-right: 1.75rem !important;
	}

	.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .card__item-prd-action .btn span.pc-only {
		display: none;
	}

	/* LIST-ROW：≤1280px 切成 icon-only，pc-only 文字隱藏 */
	.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn span.pc-only {
		display: none;
	}

	/* icon-only 按鈕：icon 水平/垂直置中、padding 縮小 */
	.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		padding-left: 0.5rem;
		padding-right: 0.5rem;
	}
}

/* === RWD：≤ 1024px === */
@media screen and (max-width: 1024px) {
	.sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .size__item-prd {
		width: 90%;
	}

	.item-prd-box[data-mode="LIST-ROW"] .size__item-prd {
		width: 100%;
	}

	.item-prd-box[data-mode="LIST-ROW"] .card-body {
		width: calc(100% - 120px - 1rem);
		padding-top: 0px;
		padding-bottom: 0;
		justify-content: space-between;
	}

	.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action {
		width: 80px;
		align-items: stretch;
	}

	.sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action {
		min-width: fit-content;
	}

	.sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-body {
		width: calc(100% - 180px - 1rem);
	}

	.item-prd-box[data-mode="LIST-ROW"] .css-x-scroll {
		overflow: auto;
	}

	.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-x-scroll {
		overflow-x: scroll;
	}

	.addon_buying .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-x-scroll {
		display: block;
	}

	.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap {
		flex-wrap: nowrap;
	}

	.sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap {
		flex-wrap: wrap;
	}

	.offcanvas .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap {
		flex-wrap: nowrap;
	}

	.sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
		width: 48%;
	}

		.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
			min-width: 200px;
		}

		#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .size__item-prd {
			width: 86%;
		}

		#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .pic_67 {
			width: 120px;
			padding-bottom: 80px;
		}

		#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-body {
			width: calc(100% - 120px);
		}

		#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action {
			width: 76px;
			min-width: 76px;
		}
	}

/* === RWD：≤ 576px === */
@media screen and (max-width: 576px) {
	#sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd {
		display: flex;
		flex-wrap: nowrap;
		align-items: center;
		gap: 12px;
		padding: 0;
	}

	.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
		width: 66.67%;
		min-width: 170px;
	}

	.sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]),
	.sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .size__item-prd {
		width: 100%;
	}

	.sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
		width: 48%;
	}

	.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action {
		flex: 0 0 54px;
		width: 54px;
		align-items: stretch;
		min-width: 54px;
	}

	#sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action {
		flex: 0 0 54px;
		width: 54px;
		min-width: 54px;
		max-width: 54px;
	}

	.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn {
		padding-left: 0.25rem;
		padding-right: 0.25rem;
		width: 100%;
	}

	.item-prd-box[data-mode="LIST-ROW"] .pic_67 {
		flex: 0 0 120px;
		width: 120px;
		padding-bottom: 80px;
	}

	#sales-list-products .item-prd-box[data-mode="LIST-ROW"] .pic_67 {
		flex: 0 0 120px;
		width: 120px;
	}

	#sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card-body {
		display: flex;
		flex: 1 1 auto;
		width: auto;
		min-width: 0;
		padding-left: 0;
		gap: 8px;
	}

	#sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-title {
		flex: 1 1 auto;
		min-width: 0;
		max-width: none;
		padding-right: 0;
	}

	#sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card-title {
		overflow-wrap: anywhere;
		word-break: break-word;
	}

	#sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-title__price p,
	#sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-title__spec {
		min-width: 0;
	}

	.sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap {
		overflow-x: scroll;
		padding: 14px;
		justify-content: start;
	}

		.sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-body {
			width: calc(100% - 120px - 1rem);
		}

		#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .size__item-prd {
			width: 100%;
		}

		#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd {
			padding: 8px;
		}

		#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .pic_67 {
			width: 96px;
			padding-bottom: 64px;
		}

		#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-body {
			width: calc(100% - 96px);
			padding-left: 8px;
			gap: 8px;
		}

		#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-title {
			font-size: 14px;
		}

		#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action {
			width: 46px;
			min-width: 46px;
			gap: 5px !important;
		}

		#sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn {
			min-height: 32px;
			padding: 5px !important;
		}
	}

/* === RWD：≤ 413px === */
@media screen and (max-width: 413px) {
	.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
		min-width: 150px;
	}
}

/* === 編輯器預覽模擬：當預覽切到平板 / 手機時，套用對應 RWD === */
/* 對應條件：
   - .x-pg-preview-frame.tablet（用戶選了平板）= 768px 寬
   - .x-pg-preview-frame.size-tablet（實際寬度 ≤ 768px 自動偵測）
   - .x-pg-preview-frame.mobile（用戶選了手機）= 375px 寬
   - .x-pg-preview-frame.size-mobile（實際寬度 ≤ 576px 自動偵測）
*/

/* --- 對應 max-width:1280px（平板 + 手機預覽都套用） --- */
.x-pg-preview-frame.tablet .item-prd-box.sp-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .card__item-prd-action .btn,
.x-pg-preview-frame.size-tablet .item-prd-box.sp-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .card__item-prd-action .btn,
.x-pg-preview-frame.mobile .item-prd-box.sp-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .card__item-prd-action .btn,
.x-pg-preview-frame.size-mobile .item-prd-box.sp-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .card__item-prd-action .btn {
	padding-left: 1.75rem !important;
	padding-right: 1.75rem !important;
}

.x-pg-preview-frame.tablet .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .card__item-prd-action .btn span.pc-only,
.x-pg-preview-frame.size-tablet .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .card__item-prd-action .btn span.pc-only,
.x-pg-preview-frame.mobile .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .card__item-prd-action .btn span.pc-only,
.x-pg-preview-frame.size-mobile .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .card__item-prd-action .btn span.pc-only,
.x-pg-preview-frame.tablet .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn span.pc-only,
.x-pg-preview-frame.size-tablet .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn span.pc-only,
.x-pg-preview-frame.mobile .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn span.pc-only,
.x-pg-preview-frame.size-mobile .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn span.pc-only {
	display: none;
}

/* --- 對應 max-width:1024px（平板 + 手機預覽都套用） --- */
.x-pg-preview-frame.tablet .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .size__item-prd,
.x-pg-preview-frame.size-tablet .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .size__item-prd,
.x-pg-preview-frame.mobile .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .size__item-prd,
.x-pg-preview-frame.size-mobile .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .size__item-prd {
	width: 90%;
}

.x-pg-preview-frame.tablet .item-prd-box[data-mode="LIST-ROW"] .size__item-prd,
.x-pg-preview-frame.size-tablet .item-prd-box[data-mode="LIST-ROW"] .size__item-prd,
.x-pg-preview-frame.mobile .item-prd-box[data-mode="LIST-ROW"] .size__item-prd,
.x-pg-preview-frame.size-mobile .item-prd-box[data-mode="LIST-ROW"] .size__item-prd {
	width: 100%;
}

.x-pg-preview-frame.tablet .item-prd-box[data-mode="LIST-ROW"] .card-body,
.x-pg-preview-frame.size-tablet .item-prd-box[data-mode="LIST-ROW"] .card-body,
.x-pg-preview-frame.mobile .item-prd-box[data-mode="LIST-ROW"] .card-body,
.x-pg-preview-frame.size-mobile .item-prd-box[data-mode="LIST-ROW"] .card-body {
	width: calc(100% - 120px - 1rem);
	padding-top: 0px;
	padding-bottom: 0;
	justify-content: space-between;
}

.x-pg-preview-frame.tablet .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action,
.x-pg-preview-frame.size-tablet .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action,
.x-pg-preview-frame.mobile .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action,
.x-pg-preview-frame.size-mobile .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action {
	width: 80px;
	align-items: stretch;
}

/* 平板/手機預覽：LIST-ROW 的 icon-only 按鈕填滿、icon 置中 */
.x-pg-preview-frame.tablet .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn,
.x-pg-preview-frame.size-tablet .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn,
.x-pg-preview-frame.mobile .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn,
.x-pg-preview-frame.size-mobile .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding-left: 0.5rem;
	padding-right: 0.5rem;
}

.x-pg-preview-frame.tablet .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action,
.x-pg-preview-frame.size-tablet .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action,
.x-pg-preview-frame.mobile .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action,
.x-pg-preview-frame.size-mobile .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action {
	min-width: fit-content;
}

.x-pg-preview-frame.tablet .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-body,
.x-pg-preview-frame.size-tablet .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-body,
.x-pg-preview-frame.mobile .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-body,
.x-pg-preview-frame.size-mobile .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-body {
	width: calc(100% - 180px - 1rem);
}

.x-pg-preview-frame.tablet .item-prd-box[data-mode="LIST-ROW"] .css-x-scroll,
.x-pg-preview-frame.size-tablet .item-prd-box[data-mode="LIST-ROW"] .css-x-scroll,
.x-pg-preview-frame.mobile .item-prd-box[data-mode="LIST-ROW"] .css-x-scroll,
.x-pg-preview-frame.size-mobile .item-prd-box[data-mode="LIST-ROW"] .css-x-scroll {
	overflow: auto;
}

.x-pg-preview-frame.tablet .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-x-scroll,
.x-pg-preview-frame.size-tablet .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-x-scroll,
.x-pg-preview-frame.mobile .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-x-scroll,
.x-pg-preview-frame.size-mobile .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-x-scroll {
	overflow-x: scroll;
}

.x-pg-preview-frame.tablet .addon_buying .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-x-scroll,
.x-pg-preview-frame.size-tablet .addon_buying .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-x-scroll,
.x-pg-preview-frame.mobile .addon_buying .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-x-scroll,
.x-pg-preview-frame.size-mobile .addon_buying .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-x-scroll {
	display: block;
}

.x-pg-preview-frame.tablet .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap,
.x-pg-preview-frame.size-tablet .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap,
.x-pg-preview-frame.mobile .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap,
.x-pg-preview-frame.size-mobile .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap {
	flex-wrap: nowrap;
}

.x-pg-preview-frame.tablet .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap,
.x-pg-preview-frame.size-tablet .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap,
.x-pg-preview-frame.mobile .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap,
.x-pg-preview-frame.size-mobile .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap {
	flex-wrap: wrap;
}

.x-pg-preview-frame.tablet .offcanvas .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap,
.x-pg-preview-frame.size-tablet .offcanvas .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap,
.x-pg-preview-frame.mobile .offcanvas .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap,
.x-pg-preview-frame.size-mobile .offcanvas .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap {
	flex-wrap: nowrap;
}

.x-pg-preview-frame.tablet .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd,
.x-pg-preview-frame.size-tablet .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd,
.x-pg-preview-frame.mobile .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd,
.x-pg-preview-frame.size-mobile .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
	width: 48%;
}

.x-pg-preview-frame.tablet .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd,
.x-pg-preview-frame.size-tablet .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd,
.x-pg-preview-frame.mobile .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd,
	.x-pg-preview-frame.size-mobile .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
		min-width: 200px;
	}

	.x-pg-preview-frame.tablet #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .size__item-prd,
	.x-pg-preview-frame.size-tablet #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .size__item-prd,
	.x-pg-preview-frame.mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .size__item-prd,
	.x-pg-preview-frame.size-mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .size__item-prd {
		width: 86%;
	}

	.x-pg-preview-frame.tablet #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .pic_67,
	.x-pg-preview-frame.size-tablet #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .pic_67,
	.x-pg-preview-frame.mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .pic_67,
	.x-pg-preview-frame.size-mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .pic_67 {
		width: 120px;
		padding-bottom: 80px;
	}

	.x-pg-preview-frame.tablet #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-body,
	.x-pg-preview-frame.size-tablet #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-body,
	.x-pg-preview-frame.mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-body,
	.x-pg-preview-frame.size-mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-body {
		width: calc(100% - 120px);
	}

	.x-pg-preview-frame.tablet #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action,
	.x-pg-preview-frame.size-tablet #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action,
	.x-pg-preview-frame.mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action,
	.x-pg-preview-frame.size-mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action {
		width: 76px;
		min-width: 76px;
	}

	/* --- 對應 max-width:576px（僅手機預覽套用，會 override 上面的平板規則） --- */
	.x-pg-preview-frame.mobile .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd,
	.x-pg-preview-frame.size-mobile .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
		width: 66.67%;
	min-width: 170px;
}

.x-pg-preview-frame.mobile .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]),
.x-pg-preview-frame.mobile .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .size__item-prd,
.x-pg-preview-frame.size-mobile .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]),
.x-pg-preview-frame.size-mobile .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .size__item-prd {
	width: 100%;
}

.x-pg-preview-frame.mobile .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd,
.x-pg-preview-frame.size-mobile .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
	width: 48%;
}

.x-pg-preview-frame.mobile .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action,
.x-pg-preview-frame.size-mobile .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action {
	width: 50px;
	align-items: stretch;
	min-width: 50px;
}

.x-pg-preview-frame.mobile .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn,
.x-pg-preview-frame.size-mobile .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn {
	padding-left: 0.25rem;
	padding-right: 0.25rem;
}

.x-pg-preview-frame.mobile .item-prd-box[data-mode="LIST-ROW"] .pic_67,
.x-pg-preview-frame.size-mobile .item-prd-box[data-mode="LIST-ROW"] .pic_67 {
	width: 120px;
	padding-bottom: 80px;
}

.x-pg-preview-frame.mobile .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap,
.x-pg-preview-frame.size-mobile .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap {
	overflow-x: scroll;
	padding: 14px;
	justify-content: start;
}

.x-pg-preview-frame.mobile .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-body,
	.x-pg-preview-frame.size-mobile .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-body {
		width: calc(100% - 120px - 1rem);
	}

	.x-pg-preview-frame.mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .size__item-prd,
	.x-pg-preview-frame.size-mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .size__item-prd {
		width: 100%;
	}

	.x-pg-preview-frame.mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd,
	.x-pg-preview-frame.size-mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd {
		padding: 8px;
	}

	.x-pg-preview-frame.mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .pic_67,
	.x-pg-preview-frame.size-mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .pic_67 {
		width: 96px;
		padding-bottom: 64px;
	}

	.x-pg-preview-frame.mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-body,
	.x-pg-preview-frame.size-mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card-body {
		width: calc(100% - 96px);
		padding-left: 8px;
		gap: 8px;
	}

	.x-pg-preview-frame.mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action,
	.x-pg-preview-frame.size-mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action {
		width: 46px;
		min-width: 46px;
		gap: 5px !important;
	}

	.x-pg-preview-frame.mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn,
	.x-pg-preview-frame.size-mobile #sales-addon-products .sp-prd-box.item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn {
		min-height: 32px;
		padding: 5px !important;
	}

	/* --- 對應 max-width:413px（手機預覽 375px 寬，自動套用） --- */
	.x-pg-preview-frame.mobile .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd,
	.x-pg-preview-frame.size-mobile .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
		min-width: 150px;
}

/* === SalesShops mini_mall：商品列表 + 組合式大卡片 === */
.x-pg-row-sales-list-products {
	overflow: hidden;
}

.x-pg-sales-list-products-wrap {
	width: 100%;
	background: transparent;
}

#sales-list-products {
	width: 100%;
}

#sales-list-products .px-4.py-8 {
	padding: 28px !important;
}

#sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) {
	width: 100%;
	margin: 0;
}

#sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap {
	justify-content: flex-start;
	gap: 18px !important;
}

#sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
	width: calc(33.333% - 12px);
	min-width: 0;
	container-type: inline-size;
}

.x-pg-x-container.x-pg-container-full #sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
	width: calc(25% - 13.5px);
	min-width: 0;
}

.x-pg-x-container.x-pg-container-full #sales-list-products .px-4.py-8 {
	padding-right: 32px !important;
	padding-left: 32px !important;
}

.x-pg-x-container.x-pg-container-full #sales-list-products .d-flex.flex-row.css-wrap.gap-4,
.x-pg-x-container.x-pg-container-full #sales-addon-products .d-flex.flex-row.css-wrap.gap-4 {
	padding-right: 32px !important;
	padding-left: 32px !important;
	box-sizing: border-box;
}

#sales-list-products .card__item-prd.card {
	border: 0;
	outline: 1px solid #eef0f4;
	border-radius: 10px;
	box-shadow: 0 8px 22px rgba(24, 28, 50, 0.06);
	background: #fff;
	transition: transform 0.18s ease, box-shadow 0.18s ease, outline-color 0.18s ease;
}

#sales-list-products .card__item-prd.card:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 28px rgba(24, 28, 50, 0.1);
	outline-color: color-mix(in srgb, var(--x-pg-sales-cta-color, #ee4d2d) 35%, #eef0f4);
}

#sales-list-products .pic_67,
#sales-list-products .card-title,
#sales-addon-products .pic_67,
#sales-addon-products .card-title {
	cursor: pointer;
}

#sales-list-products .pic_67 {
	background: linear-gradient(180deg, #fbfbfd 0%, #f4f6fa 100%);
}

#sales-list-products .pic_67 img {
	object-position: center;
	padding: 12px;
	mix-blend-mode: multiply;
}

#sales-list-products .card-body {
	padding: 14px;
	gap: 10px;
}

#sales-list-products .card-title {
	color: #202435;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.4;
	margin-bottom: 0;
	min-height: 0;
}

#sales-list-products .card__item-prd-title__price {
	margin-top: 4px;
}

#sales-list-products .card__item-prd-title__price p {
	color: #7a8091 !important;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 2px 4px;
	font-size: 13px !important;
	line-height: 1.3;
}

#sales-list-products .card__item-prd-original-price,
#sales-list-products .card__item-prd-title__price del {
	flex: 0 0 auto;
	font-size: 13px !important;
	font-weight: 400;
	line-height: 1.15;
}

#sales-list-products .card__item-prd-current-price {
	font-size: 16px !important;
	font-weight: 700;
	line-height: 1.25;
}

#sales-list-products .card__item-prd-title__price p > span:only-child {
	font-size: 16px !important;
	font-weight: 700;
	line-height: 1.25;
}

#sales-list-products .card__item-prd-title__price .text-danger,
#sales-list-products .card__item-prd-title__price .fw-bolder {
	color: var(--x-pg-sales-cta-color, #ee4d2d) !important;
	font-size: 16px !important;
}

#sales-list-products .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
	display: flex;
}

#sales-list-products .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .card__item-prd {
	display: flex;
	flex-direction: column;
	height: 100%;
	width: 100%;
}

#sales-list-products .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .card-body {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	justify-content: flex-start;
}

#sales-list-products .item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .card__item-prd-action {
	margin-top: auto;
	padding-top: 12px;
}

#sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action {
	margin-top: 0;
}

#sales-list-products .card__item-prd-action .btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	border-radius: 8px;
	font-weight: 600;
	min-height: 34px;
	height: 38px;
	white-space: nowrap;
	line-height: 1;
	min-width: 0;
	overflow: hidden;
}

#sales-list-products .card__item-prd-action .btn-outline-primary {
	flex: 0 0 44px;
	width: 44px;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

#sales-list-products .card__item-prd-action .btn-outline-primary .pc-only {
	display: none !important;
}

#sales-list-products .card__item-prd-action .btn-primary {
	flex: 1 1 0;
	min-width: 0;
	max-width: 100%;
	padding-left: 10px !important;
	padding-right: 10px !important;
}

#sales-list-products .card__item-prd-action .btn-primary {
	background-color: var(--x-pg-sales-cta-color, #ee4d2d) !important;
	border-color: var(--x-pg-sales-cta-color, #ee4d2d) !important;
	color: #fff !important;
}

#sales-list-products .card__item-prd-action .btn-outline-primary {
	background-color: color-mix(in srgb, var(--x-pg-sales-cta-color, #ee4d2d) 8%, #ffffff) !important;
	color: var(--x-pg-sales-cta-color, #ee4d2d) !important;
	border-color: var(--x-pg-sales-cta-color, #ee4d2d) !important;
}

#sales-list-products .card__item-prd-action .indicator-label {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-width: 0;
	max-width: 100%;
	overflow: hidden;
	white-space: nowrap;
	line-height: 1;
}

#sales-list-products .card__item-prd-action .btn-primary .pc-only {
	display: inline !important;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#sales-list-products .card__item-prd-action svg {
	flex: 0 0 auto;
}

@container (max-width: 230px) {
	#sales-list-products .card__item-prd-action .btn-primary .pc-only {
		display: none !important;
	}
}

/* KT indicator 切換：data-kt-indicator="on"（loading 中）時，連同 .indicator-label（文字 + icon）一併隱藏。 */
.btn[data-kt-indicator="on"] .indicator-label {
	display: none !important;
}

#sales-list-products .card__item-prd-action .btn[data-kt-indicator="on"] .indicator-progress,
#sales-addon-products .card__item-prd-action .btn[data-kt-indicator="on"] .indicator-progress,
.x-pg-sales-product-box .button_area .btn[data-kt-indicator="on"] .indicator-progress,
.shopping .button_area .btn[data-kt-indicator="on"] .indicator-progress,
#products-info .btn[data-kt-indicator="on"] .indicator-progress {
	font-size: 0 !important;
	gap: 0 !important;
}

#sales-list-products .card__item-prd-action .btn[data-kt-indicator="on"] .indicator-progress .spinner-border,
#sales-addon-products .card__item-prd-action .btn[data-kt-indicator="on"] .indicator-progress .spinner-border,
.x-pg-sales-product-box .button_area .btn[data-kt-indicator="on"] .indicator-progress .spinner-border,
.shopping .button_area .btn[data-kt-indicator="on"] .indicator-progress .spinner-border,
#products-info .btn[data-kt-indicator="on"] .indicator-progress .spinner-border {
	width: 1rem;
	height: 1rem;
	margin-left: 0 !important;
	border-width: .2em;
	font-size: 1rem;
}

/* mini_mall LIST-ROW 模式：商品速覽鈕在 PC 顯示完整文字，RWD（≤1280px）才退回 44px icon-only */
#sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn-outline-primary {
	flex: 0 0 auto;
	width: auto;
	padding-left: 10px !important;
	padding-right: 10px !important;
}

#sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn-outline-primary .pc-only {
	display: inline !important;
}

@media screen and (max-width: 1280px) {
	#sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn {
		flex: 0 0 auto;
		width: 100%;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	#sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn-outline-primary .pc-only,
	#sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn-primary .pc-only {
		display: none !important;
	}
}

.x-pg-preview-frame.mobile #sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd,
.x-pg-preview-frame.size-mobile #sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 12px;
	padding: 0;
}

.x-pg-preview-frame.mobile #sales-list-products .item-prd-box[data-mode="LIST-ROW"] .pic_67,
.x-pg-preview-frame.size-mobile #sales-list-products .item-prd-box[data-mode="LIST-ROW"] .pic_67 {
	flex: 0 0 120px;
	width: 120px;
	padding-bottom: 80px;
}

.x-pg-preview-frame.mobile #sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card-body,
.x-pg-preview-frame.size-mobile #sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card-body {
	display: flex;
	flex: 1 1 auto;
	width: auto;
	min-width: 0;
	padding-left: 0;
	gap: 8px;
}

.x-pg-preview-frame.mobile #sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-title,
.x-pg-preview-frame.size-mobile #sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-title {
	flex: 1 1 auto;
	min-width: 0;
	max-width: none;
	padding-right: 0;
}

.x-pg-preview-frame.mobile #sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action,
.x-pg-preview-frame.size-mobile #sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action {
	flex: 0 0 54px;
	width: 54px;
	min-width: 54px;
	max-width: 54px;
	align-items: stretch;
}

.x-pg-preview-frame.mobile #sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn,
.x-pg-preview-frame.size-mobile #sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card__item-prd-action .btn {
	width: 100%;
}

.x-pg-preview-frame.mobile #sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card-title,
.x-pg-preview-frame.size-mobile #sales-list-products .item-prd-box[data-mode="LIST-ROW"] .card-title {
	overflow-wrap: anywhere;
	word-break: break-word;
}

.x-pg-section-outer.x-pg-sales-shop-joined-intro {
	padding-bottom: 0 !important;
}

.x-pg-section-outer.x-pg-sales-shop-joined-list {
	padding-top: 0 !important;
}

.x-pg-sales-shop-joined-intro .x-pg-row-event-intro {
	border-bottom-left-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
}

.x-pg-sales-shop-joined-list .x-pg-row-sales-list-products {
	border-top-left-radius: 0 !important;
	border-top-right-radius: 0 !important;
}

.x-pg-sales-shopping-info-row {
	overflow: hidden;
}

.x-pg-sales-shopping-info {
	width: 100%;
	padding: 26px 32px 32px;
	background: transparent;
	box-sizing: border-box;
	min-width: 0;
}

.x-pg-sales-shopping-info__header {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 18px;
}

.x-pg-sales-shopping-info__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 10px;
	color: var(--x-pg-sales-shopping-info-icon-fg, #ffffff);
	background: var(--x-pg-sales-shopping-info-icon-color, var(--x-pg-sales-cta-color, #ee4d2d));
	flex: 0 0 auto;
}

.x-pg-sales-shopping-info-icon-btn i {
	color: var(--x-pg-sales-shopping-info-icon-color, var(--x-pg-nav, #667eea)) !important;
}

.x-pg-sales-shopping-info__icon i {
	font-size: 20px;
	color: inherit;
}

.x-pg-sales-shopping-info__header h3 {
	margin: 0;
	font-size: 22px;
	font-weight: 800;
	color: var(--x-pg-sales-shopping-info-text-color, #202435);
}

.x-pg-sales-shopping-info__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 16px;
	align-items: stretch;
}

.x-pg-sales-shopping-info__panel,
.x-pg-sales-shopping-info__payment,
.x-pg-sales-shopping-info__notice {
	border-radius: 12px;
	border: 1px solid var(--x-pg-sales-shopping-info-panel-border-color, #eef0f4);
	background: var(--x-pg-sales-shopping-info-panel-bg, #fff);
	box-sizing: border-box;
	min-width: 0;
}

.x-pg-sales-shopping-info__payment {
	padding: 20px 22px;
	background: var(--x-pg-sales-shopping-info-payment-bg, #fff);
	border-color: var(--x-pg-sales-shopping-info-payment-border-color, #eef0f4);
}

.x-pg-sales-shopping-info__notice {
	padding: 20px 22px;
	background: var(--x-pg-sales-shopping-info-terms-bg, #fff7f3);
	border-color: var(--x-pg-sales-shopping-info-terms-border-color, #ffe2d4);
	color: var(--x-pg-sales-shopping-info-text-color, #5c372b);
}

.x-pg-sales-shopping-info__panel-title {
	margin: 0 0 12px;
	color: var(--x-pg-sales-shopping-info-text-color, #202435);
	font-size: 16px;
	font-weight: 800;
	line-height: 1.35;
}

.x-pg-rich-text-content {
	overflow-wrap: anywhere;
	word-break: break-word;
}

.x-pg-sales-shopping-info__panel .x-pg-rich-text-content > :last-child,
.x-pg-sales-shopping-info__notice .x-pg-rich-text-content > :last-child {
	margin-bottom: 0;
}

.x-pg-sales-shopping-info .moreinfo_box.pc-only {
	display: block !important;
	border-top: 0;
	margin-top: 0;
}

.x-pg-sales-shopping-info .moreinfo_box > div,
.x-pg-sales-shopping-info__payment > .shipping_area,
.x-pg-sales-shopping-info__payment > .pay {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 14px;
	padding: 14px 0;
	border-bottom: 1px dashed #e7eaf0;
	font-size: 12px !important;
}

.x-pg-sales-shopping-info .moreinfo_box > div:last-child,
.x-pg-sales-shopping-info__payment > .shipping_area:last-child,
.x-pg-sales-shopping-info__payment > .pay:last-child {
	border-bottom: 0;
}

.x-pg-sales-shopping-info__payment > .shipping_area:not(:has(li)),
.x-pg-sales-shopping-info__payment > .pay:not(:has(li)) {
	display: none;
}

.x-pg-sales-shopping-info .moreinfo_title {
	flex: 0 0 92px;
	max-width: 92px;
	min-width: 92px;
	margin: 0;
	color: #757575;
	font-size: 13px;
}

.x-pg-sales-shopping-info .infolist {
	flex: 1 1 auto;
	min-width: 0;
}

.x-pg-sales-shopping-info .infolist ul {
	padding-left: 0;
	margin-bottom: 0 !important;
	list-style: none;
	color: #202435;
}

.x-pg-sales-shopping-info .infolist li {
	list-style: none;
	margin-bottom: 0;
	flex: 0 0 auto;
}

.x-pg-sales-shopping-info .pay .infolist ul,
.x-pg-sales-shopping-info__payment > .pay .infolist ul {
	flex-wrap: nowrap !important;
	overflow-x: auto;
}

.x-pg-sales-shopping-info__payment .x-pg-sales-preview-hint {
	position: absolute;
	top: 10px;
	right: 10px;
}

.x-pg-row-sales-list-products .x-pg-sales-preview-hint {
	position: absolute;
	top: 12px;
	right: 12px;
}

.x-pg-sales-product-intro-row {
	overflow: hidden;
}

.x-pg-sales-product-intro-row > .xt_area {
	width: 100%;
	padding: 24px 28px 28px;
	box-sizing: border-box;
	color: #202435;
}

.x-pg-sales-product-intro-row > .xt_area img {
	display: block;
	max-width: 100%;
	height: auto;
}

.x-pg-sales-product-intro-row > .xt_area > :last-child {
	margin-bottom: 0;
}

.x-pg-sales-product-intro {
	width: 100%;
	padding: 24px 28px 28px;
	background: #fff;
	box-sizing: border-box;
	min-width: 0;
}

.x-pg-sales-product-intro__media {
	width: 100%;
	overflow: hidden;
	border-radius: 12px;
	background: #f5f6f8;
	border: 1px solid #eef0f4;
}

.x-pg-sales-product-intro__media img {
	display: block;
	width: 100%;
	height: auto;
}

.x-pg-sales-product-intro__body {
	padding-top: 18px;
	color: #202435;
}

.x-pg-sales-product-intro__body > :last-child {
	margin-bottom: 0;
}

.x-pg-sales-product-intro__hint {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 2;
}

@media screen and (max-width: 1024px) {
	.x-pg-sales-product-intro,
	.x-pg-sales-product-intro-row > .xt_area {
		padding: 18px 16px 20px;
	}
}

.x-pg-preview-frame.tablet .x-pg-sales-product-intro,
.x-pg-preview-frame.tablet .x-pg-sales-product-intro-row > .xt_area,
.x-pg-preview-frame.mobile .x-pg-sales-product-intro,
.x-pg-preview-frame.mobile .x-pg-sales-product-intro-row > .xt_area {
	padding: 18px 16px 20px;
}

@media screen and (max-width: 1024px) {
	.x-pg-x-container.x-pg-container-full #sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd,
	#sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
		width: calc(33.333% - 12px);
		min-width: 0;
	}

	.x-pg-sales-shopping-info__grid {
		grid-template-columns: 1fr;
	}
}

@media screen and (max-width: 576px) {
	#sales-list-products .px-4.py-8 {
		padding: 16px !important;
	}

	.x-pg-x-container.x-pg-container-full #sales-list-products .px-4.py-8 {
		padding-right: 16px !important;
		padding-left: 16px !important;
	}

	.x-pg-x-container.x-pg-container-full #sales-list-products .d-flex.flex-row.css-wrap.gap-4,
	.x-pg-x-container.x-pg-container-full #sales-addon-products .d-flex.flex-row.css-wrap.gap-4 {
		padding-right: 16px !important;
		padding-left: 16px !important;
	}

	#sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .css-wrap {
		flex-wrap: wrap;
		overflow-x: visible;
		padding: 0;
	}

	.x-pg-x-container.x-pg-container-full #sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd,
	#sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
		width: calc(50% - 9px);
		min-width: 0;
	}

	.x-pg-sales-shopping-info {
		padding: 22px 18px 24px;
	}

	.x-pg-sales-shopping-info__header h3 {
		font-size: 20px;
	}

	.x-pg-sales-shopping-info__payment,
	.x-pg-sales-shopping-info__notice {
		padding-left: 16px;
		padding-right: 16px;
	}

	.x-pg-sales-shopping-info .moreinfo_box > div,
	.x-pg-sales-shopping-info__payment > .shipping_area,
	.x-pg-sales-shopping-info__payment > .pay {
		align-items: flex-start;
		flex-direction: column;
		gap: 8px;
	}

	.x-pg-sales-shopping-info .moreinfo_title {
		flex-basis: auto;
		max-width: none;
		min-width: 0;
	}
}

/* 編輯器裝置切換：商品列表與購物說明跟隨預覽框尺寸，而不是瀏覽器尺寸。 */
.x-pg-preview-frame.tablet #sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd,
.x-pg-preview-frame.size-tablet #sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd,
.x-pg-preview-frame.tablet .x-pg-x-container.x-pg-container-full #sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd,
.x-pg-preview-frame.size-tablet .x-pg-x-container.x-pg-container-full #sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
	width: calc(33.333% - 12px);
	min-width: 0;
}

.x-pg-preview-frame.mobile #sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd,
.x-pg-preview-frame.size-mobile #sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd,
.x-pg-preview-frame.mobile .x-pg-x-container.x-pg-container-full #sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd,
.x-pg-preview-frame.size-mobile .x-pg-x-container.x-pg-container-full #sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
	width: calc(50% - 9px);
	min-width: 0;
}

.x-pg-preview-frame.tablet .x-pg-sales-shopping-info__grid,
.x-pg-preview-frame.size-tablet .x-pg-sales-shopping-info__grid,
.x-pg-preview-frame.mobile .x-pg-sales-shopping-info__grid,
.x-pg-preview-frame.size-mobile .x-pg-sales-shopping-info__grid {
	grid-template-columns: 1fr;
}

.x-pg-preview-frame.mobile .x-pg-sales-shopping-info,
.x-pg-preview-frame.size-mobile .x-pg-sales-shopping-info {
	padding: 22px 18px 24px;
}

.x-pg-preview-frame.mobile .x-pg-sales-shopping-info__header h3,
.x-pg-preview-frame.size-mobile .x-pg-sales-shopping-info__header h3 {
	font-size: 20px;
}

.x-pg-preview-frame.mobile .x-pg-sales-shopping-info__payment,
.x-pg-preview-frame.mobile .x-pg-sales-shopping-info__notice,
.x-pg-preview-frame.size-mobile .x-pg-sales-shopping-info__payment,
.x-pg-preview-frame.size-mobile .x-pg-sales-shopping-info__notice {
	padding-left: 16px;
	padding-right: 16px;
}

.x-pg-preview-frame.mobile .x-pg-sales-shopping-info .moreinfo_box > div,
.x-pg-preview-frame.size-mobile .x-pg-sales-shopping-info .moreinfo_box > div,
.x-pg-preview-frame.mobile .x-pg-sales-shopping-info__payment > .shipping_area,
.x-pg-preview-frame.mobile .x-pg-sales-shopping-info__payment > .pay,
.x-pg-preview-frame.size-mobile .x-pg-sales-shopping-info__payment > .shipping_area,
.x-pg-preview-frame.size-mobile .x-pg-sales-shopping-info__payment > .pay {
	align-items: flex-start;
	flex-direction: column;
	gap: 8px;
}

.x-pg-preview-frame.mobile .x-pg-sales-shopping-info .moreinfo_title,
.x-pg-preview-frame.size-mobile .x-pg-sales-shopping-info .moreinfo_title {
	flex-basis: auto;
	max-width: none;
	min-width: 0;
}

.x-pg-preview-frame.mobile #sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd,
.x-pg-preview-frame.size-mobile #sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
	width: calc(50% - 9px);
}

.x-pg-preview-frame.desktop .x-pg-x-container.x-pg-container-full #sales-list-products .sp-prd-box.item-prd-box:is([data-mode="LIST-COL"], [data-mode="LIST"]) .size__item-prd {
	width: calc(25% - 13.5px);
	min-width: 0;
}

.x-pg-preview-frame.tablet #sales-list-products .card__item-prd-action .btn-primary .pc-only,
.x-pg-preview-frame.size-tablet #sales-list-products .card__item-prd-action .btn-primary .pc-only,
.x-pg-preview-frame.mobile #sales-list-products .card__item-prd-action .btn-primary .pc-only,
.x-pg-preview-frame.size-mobile #sales-list-products .card__item-prd-action .btn-primary .pc-only {
	display: none !important;
}

/* === 購物車 (offcanvas drawer) ===
   結構：.offcanvas .cart_list.drawer_cart > li.cart_list_line
        ├─ .list_head（圖片+商品名+折扣 badge）
        ├─ .list_adj_box（規格 / 原價 / 數量 / 砍價後價格）
        └─ .list_action（移除按鈕） */

/* --- 共用工具 --- */
.text-fade {
	color: #c9c9c9 !important;
}

.pic-placeholder {
	width: 100%;
	height: 200px;
	min-height: 40px;
	background-color: #f0f0f0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #999;
	cursor: wait;
	background-image: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.85), transparent);
	background-size: 50% 100%;
	animation: processing 1.5s infinite;
}

@keyframes processing {
	0% {
		background-position: -50% 0;
	}
	100% {
		background-position: 150% 0;
	}
}

.cut_img {
	position: relative;
	height: 0;
	overflow: hidden;
}

.cut_img img {
	position: absolute;
	width: 100%;
}

/* --- 刪除線（原價刪除標示） --- */
.js_del::after {
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 50%;
	left: 0;
	background-color: #e57738;
}

.pricespan.js_del::after,
.prd_price .js_del::after {
	background-color: #bbb;
}

/* --- 數量增減 (count / minus / plus) --- */
.product_count .count,
.list_count .count {
	display: flex;
	align-items: stretch;
	gap: 4px;
}

.count span {
	cursor: pointer;
}

.minus,
.plus {
	background: #f2f2f2;
	border-radius: 4px;
	border: 1px solid #ddd;
	display: inline-flex;
	text-align: center;
	padding: 6px 1rem;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	font-weight: bold;
	vertical-align: middle;
}

.count input[type=number] {
	width: 60px;
	text-align: center;
	font-size: 1rem;
	border: 1px solid #ddd;
	border-radius: 4px;
	display: inline-block;
	vertical-align: middle;
	-moz-appearance: textfield;
}

.count input[type=number]::-webkit-inner-spin-button,
.count input[type=number]::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* --- 購物車清單基本結構 --- */
ul.cart_list {
	padding-left: 0;
	margin-bottom: 0;
}

.list_head {
	display: flex;
	align-items: center;
	height: fit-content;
	grid-area: list_head;
	padding-right: 4px;
}

.cart_list li .pic {
	width: 25%;
	border-radius: 2px;
	margin-right: 1rem;
	display: inline-table;
}

.cart_pic {
	width: 100%;
	padding-bottom: 66.666667%;
}

.cart_list li .text {
	width: 75%;
	padding-right: 8px;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}

.cart_list li .dicount {
	margin-top: 4px;
}

.cart_list li .text .dicount p {
	font-size: 12px;
}

.cart_list li .text .dicount .badge {
	background-color: #FBF4E580;
	color: #F0762F;
	border-radius: 2px;
}

.prd_namem,
.prd_type,
.prd_price {
	font-weight: 700;
}

.cart_list .prd_price {
	font-size: 18px;
}

p.prd_type {
	margin-bottom: 4px;
}

.yousave {
	font-size: 12px;
	color: #979797;
}

.yousave span {
	color: #F0762F;
	font-weight: 700;
}

.cart_list li > div:nth-child(3) {
	color: #979797;
	font-size: 14px;
}

/* --- Grid 區域：規格 / 原價 / 砍價後 / 數量 / 移除 --- */
.list_spec {
	grid-area: list_spec;
	padding-right: 4px;
}

.list_price_o {
	grid-area: list_price_o;
	color: #888;
}

.list_price_f {
	grid-area: list_price_f;
}

.list_price_f .prd_price {
	background: none;
}

.list_count {
	grid-area: list_count;
}

.list_action {
	grid-area: list_action;
	display: flex;
	align-items: center;
}

.list_adj_box {
	grid-area: list_adj_box;
}

/* --- 寬版（桌機）每列商品 grid 配置 --- */
.cart_list_line {
	display: grid;
	grid-template-columns: 4fr 2fr 1fr 2fr 2fr 1fr;
	grid-template-rows: 100%;
	grid-template-areas: "list_head list_adj_box list_adj_box list_adj_box list_adj_box  list_action";
	width: 100%;
	margin: auto;
	padding: 16px 20px;
	border-bottom: 1px solid #E5EAEE;
}

.list_adj_box {
	display: grid;
	grid-template-columns: 1.5fr 1.5fr 2fr 2fr;
	grid-template-rows: 100%;
	grid-template-areas: "list_spec list_price_o  list_count list_price_f";
	align-items: center;
}

/* --- drawer_cart：抽屜版（offcanvas 內）疊式排列 --- */
.drawer_cart.cart_list {
	border-top: 1px solid #F5F5F5;
	padding-top: 8px;
}

.drawer_cart .cart_list_line {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	grid-template-rows: 1fr;
	grid-template-areas:
		"list_head list_head list_head list_head  list_action"
		"list_adj_box list_adj_box list_adj_box list_adj_box list_adj_box";
	grid-gap: 10px;
	padding: 8px;
	border: 1px solid #E5EAEE;
	border-radius: 12px;
	margin: 8px auto;
}

.drawer_cart .list_adj_box {
	background-color: #f5f5f5;
	border-radius: 12px;
	padding: 8px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-content: center;
	height: max-content;
}

.drawer_cart .list_spec {
	display: flex;
	order: 1;
	width: 100%;
	align-items: flex-start;
}

.drawer_cart .list_price_o,
.drawer .list_price_f {
	text-align: right;
}

.drawer_cart .list_price_o {
	display: flex;
	align-items: baseline;
	justify-content: start;
	order: 2;
	width: 100%;
	flex-direction: row-reverse;
	gap: .5rem;
}

.drawer_cart .list_count {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	order: 3;
	width: 50%;
}

.drawer_cart .list_price_f {
	display: flex;
	order: 4;
	width: 50%;
	flex-direction: column;
	align-items: flex-end;
	justify-content: flex-end;
}

.drawer_cart .list_action {
	display: flex;
	justify-content: end;
	padding-right: 8px;
}

.drawer_cart .f-price-p.pc-only {
	display: none;
}

.drawer_cart .d-xl-none.show-drawer-inline {
	display: inline !important;
}

/* --- 結帳金額 / 總計列 --- */
.cart_sum {
	background-color: #fcf3eb;
	padding: 16px;
	color: #666;
	font-size: 1rem;
	border-radius: 0 0 .625rem .625rem;
}

.cart_sum .button_area {
	display: flex;
	flex-direction: row;
}

.order_num_color {
	color: var(--x-pg-nav-cart-color, var(--x-pg-sales-cta-color, #ee4d2d));
	font-size: 1.45rem;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0;
	white-space: nowrap;
}

#offcanvasRight .offcanvas-footer,
body > .offcanvas .offcanvas-footer:has(.sum_pirce) {
	padding: 18px 20px calc(18px + env(safe-area-inset-bottom)) !important;
	border-top: 1px solid rgba(15, 23, 42, .08);
	background: rgba(255, 255, 255, .98);
	box-shadow: 0 -14px 34px rgba(15, 23, 42, .12) !important;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}

#offcanvasRight .offcanvas-footer .d-flex.justify-content-between,
body > .offcanvas .offcanvas-footer:has(.sum_pirce) .d-flex.justify-content-between {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 16px;
	align-items: center !important;
}

#offcanvasRight .sum_pirce,
body > .offcanvas .offcanvas-footer:has(.sum_pirce) .sum_pirce {
	min-width: 0;
}

#offcanvasRight .sum_pirce p,
body > .offcanvas .offcanvas-footer:has(.sum_pirce) .sum_pirce p {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	margin: 0;
	line-height: 1.1;
}

#offcanvasRight .sum_pirce .text-dark,
body > .offcanvas .offcanvas-footer:has(.sum_pirce) .sum_pirce .text-dark {
	color: #64748b !important;
	font-size: 12px;
	font-weight: 700 !important;
	letter-spacing: .02em;
}

#offcanvasRight .order_num_color,
body > .offcanvas .offcanvas-footer:has(.sum_pirce) .order_num_color {
	display: inline-flex;
	align-items: baseline;
	gap: 3px;
	color: var(--x-pg-nav-cart-color, var(--x-pg-sales-cta-color, #ee4d2d));
	font-size: 1.55rem;
	font-weight: 900;
	line-height: 1;
	letter-spacing: -.2px;
}

#offcanvasRight .order_num_color__currency,
body > .offcanvas .offcanvas-footer:has(.sum_pirce) .order_num_color__currency {
	font-size: .72rem;
	font-weight: 750;
	letter-spacing: 0;
}

#offcanvasRight .order_num_color__amount,
body > .offcanvas .offcanvas-footer:has(.sum_pirce) .order_num_color__amount {
	font-size: inherit;
	font-weight: inherit;
	line-height: 1;
}

#offcanvasRight .offcanvas-footer .checkout-btn,
body > .offcanvas .offcanvas-footer:has(.sum_pirce) .checkout-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 116px;
	min-height: 44px;
	padding: 10px 18px;
	border: 0 !important;
	border-radius: var(--x-pg-radius-sm, 8px);
	background: var(--x-pg-nav-cart-color, var(--x-pg-sales-cta-color, #ee4d2d)) !important;
	color: #fff !important;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	box-shadow: 0 10px 22px color-mix(in srgb, var(--x-pg-nav-cart-color, var(--x-pg-sales-cta-color, #ee4d2d)) 28%, transparent);
	transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
}

#offcanvasRight .offcanvas-footer .checkout-btn:hover,
#offcanvasRight .offcanvas-footer .checkout-btn:focus,
body > .offcanvas .offcanvas-footer:has(.sum_pirce) .checkout-btn:hover,
body > .offcanvas .offcanvas-footer:has(.sum_pirce) .checkout-btn:focus {
	filter: brightness(.96);
	box-shadow: 0 12px 26px color-mix(in srgb, var(--x-pg-nav-cart-color, var(--x-pg-sales-cta-color, #ee4d2d)) 34%, transparent);
	transform: translateY(-1px);
}

#offcanvasRight .offcanvas-footer .checkout-btn:active,
body > .offcanvas .offcanvas-footer:has(.sum_pirce) .checkout-btn:active {
	transform: translateY(0);
}

@media screen and (max-width: 420px) {
	#offcanvasRight .offcanvas-footer,
	body > .offcanvas .offcanvas-footer:has(.sum_pirce) {
		padding-right: 14px !important;
		padding-left: 14px !important;
	}

	#offcanvasRight .offcanvas-footer .d-flex.justify-content-between,
	body > .offcanvas .offcanvas-footer:has(.sum_pirce) .d-flex.justify-content-between {
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 12px;
	}

	#offcanvasRight .order_num_color,
	body > .offcanvas .offcanvas-footer:has(.sum_pirce) .order_num_color {
		font-size: 1.35rem;
	}

	#offcanvasRight .offcanvas-footer .checkout-btn,
	body > .offcanvas .offcanvas-footer:has(.sum_pirce) .checkout-btn {
		min-width: 104px;
		padding-right: 14px;
		padding-left: 14px;
	}
}

/* --- RWD：≤1024px（平板/手機）：cart_list 改成抽屜疊式 --- */
@media screen and (max-width: 1024px) {
	.cart_list {
		border-top: 1px solid #F5F5F5;
		padding-top: 8px;
	}

	.order_box + .cart_sum {
		border-radius: .625rem;
		margin-top: 1rem;
	}

	.cart_list_line {
		display: grid;
		grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
		grid-template-rows: 1fr;
		grid-template-areas:
			"list_head list_head list_head list_head  list_action"
			"list_adj_box list_adj_box list_adj_box list_adj_box list_adj_box";
		grid-gap: 10px;
		padding: 8px;
		border: 1px solid #E5EAEE;
		border-radius: 12px;
		margin: 8px auto;
	}

	.list_adj_box {
		background-color: #f5f5f5;
		border-radius: 12px;
		padding: 8px;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-content: center;
		height: max-content;
	}

	.list_spec {
		display: flex;
		order: 1;
		width: 100%;
		align-items: flex-start;
	}

	.list_price_o,
	.list_price_f {
		text-align: right;
	}

	.list_price_o {
		display: flex;
		align-items: baseline;
		justify-content: start;
		order: 2;
		width: 100%;
		flex-direction: row-reverse;
		gap: .5rem;
	}

	.list_count {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		order: 3;
		width: 50%;
	}

	.list_price_f {
		display: flex;
		order: 4;
		width: 50%;
		flex-direction: column;
		align-items: flex-end;
		justify-content: flex-end;
	}

	.list_action {
		display: flex;
		justify-content: end;
		padding-right: 8px;
	}
}

/* 最終覆蓋：實際輸出 basic_sales 不受 #products-info / xlead RWD 舊規則影響 */
.basic_sales .prd_price,
#products-info .basic_sales .prd_price,
.shopping .basic_sales .prd_price,
.x-pg-sales-product-box .basic_sales .prd_price {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: flex-start !important;
	justify-content: flex-start !important;
	gap: 0 !important;
	width: 100%;
	max-width: 100%;
	overflow: hidden;
}

.basic_sales .prd_price > div,
#products-info .basic_sales .prd_price > div,
.shopping .basic_sales .prd_price > div,
.x-pg-sales-product-box .basic_sales .prd_price > div {
	flex: 0 0 auto !important;
	min-width: 0 !important;
	width: auto !important;
	padding: 0 10px !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-start !important;
	justify-content: center !important;
	white-space: nowrap !important;
}

.basic_sales .prd_price > div:first-child,
#products-info .basic_sales .prd_price > div:first-child,
.shopping .basic_sales .prd_price > div:first-child,
.x-pg-sales-product-box .basic_sales .prd_price > div:first-child {
	padding-left: 0 !important;
}

.basic_sales .prd_price > div:not(:first-child),
#products-info .basic_sales .prd_price > div:not(:first-child),
.shopping .basic_sales .prd_price > div:not(:first-child),
.x-pg-sales-product-box .basic_sales .prd_price > div:not(:first-child) {
	border-left: 0 !important;
	border-right: 0 !important;
}

.basic_sales .prd_price > div:not(:last-child),
#products-info .basic_sales .prd_price > div:not(:last-child),
.shopping .basic_sales .prd_price > div:not(:last-child),
.x-pg-sales-product-box .basic_sales .prd_price > div:not(:last-child) {
	border-right: 1px dashed #f3c0b3 !important;
}

.basic_sales .prd_price #discounted-price-div,
.basic_sales .prd_price .discounted-price-div,
.basic_sales .prd_price > div:last-child,
#products-info .basic_sales .prd_price #discounted-price-div,
#products-info .basic_sales .prd_price .discounted-price-div,
#products-info .basic_sales .prd_price > div:last-child,
.shopping .basic_sales .prd_price #discounted-price-div,
.shopping .basic_sales .prd_price .discounted-price-div,
.shopping .basic_sales .prd_price > div:last-child,
.x-pg-sales-product-box .basic_sales .prd_price #discounted-price-div,
.x-pg-sales-product-box .basic_sales .prd_price .discounted-price-div,
.x-pg-sales-product-box .basic_sales .prd_price > div:last-child {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	padding-left: 12px !important;
	overflow: hidden;
}

.basic_sales .prd_price #discounted-price-div p.fw-bolder,
.basic_sales .prd_price .discounted-price-div p.fw-bolder,
.basic_sales .prd_price > div:last-child p.fw-bolder,
#products-info .basic_sales .prd_price #discounted-price-div p.fw-bolder,
#products-info .basic_sales .prd_price .discounted-price-div p.fw-bolder,
#products-info .basic_sales .prd_price > div:last-child p.fw-bolder,
.shopping .basic_sales .prd_price #discounted-price-div p.fw-bolder,
.shopping .basic_sales .prd_price .discounted-price-div p.fw-bolder,
.shopping .basic_sales .prd_price > div:last-child p.fw-bolder,
.x-pg-sales-product-box .basic_sales .prd_price #discounted-price-div p.fw-bolder,
.x-pg-sales-product-box .basic_sales .prd_price .discounted-price-div p.fw-bolder,
.x-pg-sales-product-box .basic_sales .prd_price > div:last-child p.fw-bolder {
	display: inline-flex !important;
	flex-wrap: wrap !important;
	align-items: baseline !important;
	gap: 5px !important;
	max-width: 100%;
	margin-bottom: 0 !important;
}

.basic_sales .prd_price .original-price-display,
.basic_sales .prd_price .special-price-display,
.basic_sales .prd_price .discounted-price-display,
.basic_sales .prd_price .discounted-price-display + small,
#products-info .basic_sales .prd_price .original-price-display,
#products-info .basic_sales .prd_price .special-price-display,
#products-info .basic_sales .prd_price .discounted-price-display,
#products-info .basic_sales .prd_price .discounted-price-display + small {
	display: inline-block !important;
}

.basic_sales .prd_price .discounted-price-display + small,
.basic_sales .prd_price > div:last-child > small.price-diff-pill,
.basic_sales .prd_price #discounted-price-div > small.price-diff-pill,
.basic_sales .prd_price .discounted-price-div > small.price-diff-pill,
#products-info .basic_sales .prd_price .discounted-price-display + small,
#products-info .basic_sales .prd_price > div:last-child > small.price-diff-pill,
.shopping .basic_sales .prd_price .discounted-price-display + small,
.shopping .basic_sales .prd_price > div:last-child > small.price-diff-pill,
.x-pg-sales-product-box .basic_sales .prd_price .discounted-price-display + small,
.x-pg-sales-product-box .basic_sales .prd_price > div:last-child > small.price-diff-pill {
	display: inline-block !important;
	align-self: flex-start;
	width: fit-content;
	max-width: 100%;
	margin-top: 4px;
	white-space: nowrap;
}

/* 熱銷標籤移除後，basic_sales 不再保留 badge 的上方空間 */
.basic_sales:not(:has(> h3)),
#products-info .basic_sales:not(:has(> h3)),
#product-modal .sale-info .basic_sales:not(:has(> h3)),
.shopping .basic_sales:not(:has(> h3)),
.x-pg-sales-product-box .basic_sales:not(:has(> h3)) {
	padding: 24px 28px !important;
}

.basic_sales:not(:has(> h3)) .prd_price,
#products-info .basic_sales:not(:has(> h3)) .prd_price,
#product-modal .sale-info .basic_sales:not(:has(> h3)) .prd_price,
.shopping .basic_sales:not(:has(> h3)) .prd_price,
.x-pg-sales-product-box .basic_sales:not(:has(> h3)) .prd_price {
	flex-wrap: wrap !important;
	align-items: flex-start !important;
	gap: 20px !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: visible;
}

.basic_sales:not(:has(> h3)) .prd_price > div,
#products-info .basic_sales:not(:has(> h3)) .prd_price > div,
#product-modal .sale-info .basic_sales:not(:has(> h3)) .prd_price > div,
.shopping .basic_sales:not(:has(> h3)) .prd_price > div,
.x-pg-sales-product-box .basic_sales:not(:has(> h3)) .prd_price > div,
.basic_sales:not(:has(> h3)) .prd_price > div:last-child,
.basic_sales:not(:has(> h3)) .prd_price #discounted-price-div,
.basic_sales:not(:has(> h3)) .prd_price .discounted-price-div,
#products-info .basic_sales:not(:has(> h3)) .prd_price > div:last-child,
#products-info .basic_sales:not(:has(> h3)) .prd_price #discounted-price-div,
#products-info .basic_sales:not(:has(> h3)) .prd_price .discounted-price-div,
#product-modal .sale-info .basic_sales:not(:has(> h3)) .prd_price > div:last-child,
#product-modal .sale-info .basic_sales:not(:has(> h3)) .prd_price #discounted-price-div,
#product-modal .sale-info .basic_sales:not(:has(> h3)) .prd_price .discounted-price-div,
.shopping .basic_sales:not(:has(> h3)) .prd_price > div:last-child,
.shopping .basic_sales:not(:has(> h3)) .prd_price #discounted-price-div,
.shopping .basic_sales:not(:has(> h3)) .prd_price .discounted-price-div,
.x-pg-sales-product-box .basic_sales:not(:has(> h3)) .prd_price > div:last-child,
.x-pg-sales-product-box .basic_sales:not(:has(> h3)) .prd_price #discounted-price-div,
.x-pg-sales-product-box .basic_sales:not(:has(> h3)) .prd_price .discounted-price-div {
	flex: 0 1 auto !important;
	padding: 0 !important;
	border: 0 !important;
	overflow: visible;
}

@media screen and (max-width: 768px) {
	.basic_sales .prd_price,
	#products-info .basic_sales .prd_price,
	.shopping .basic_sales .prd_price,
	.x-pg-sales-product-box .basic_sales .prd_price {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.basic_sales .prd_price > div,
	#products-info .basic_sales .prd_price > div,
	.shopping .basic_sales .prd_price > div,
	.x-pg-sales-product-box .basic_sales .prd_price > div {
		padding-left: 6px !important;
		padding-right: 6px !important;
	}

	.basic_sales .prd_price #discounted-price-div,
	.basic_sales .prd_price .discounted-price-div,
	.basic_sales .prd_price > div:last-child,
	#products-info .basic_sales .prd_price #discounted-price-div,
	#products-info .basic_sales .prd_price .discounted-price-div,
	#products-info .basic_sales .prd_price > div:last-child {
		padding-left: 8px !important;
	}

	.basic_sales .prd_price p:not(.fw-bolder),
	#products-info .basic_sales .prd_price p:not(.fw-bolder) {
		font-size: 12px !important;
	}

	.basic_sales .prd_price div span:not(.pricespan),
	#products-info .basic_sales .prd_price div span:not(.pricespan) {
		font-size: 10px !important;
	}

	.basic_sales .prd_price .discounted-price-display,
	#products-info .basic_sales .prd_price .discounted-price-display,
	.shopping .basic_sales .prd_price .discounted-price-display,
	.x-pg-sales-product-box .basic_sales .prd_price .discounted-price-display {
		font-size: 1.35rem !important;
	}

	.basic_sales .prd_price .discounted-price-display + small,
	.basic_sales .prd_price > div:last-child > small.price-diff-pill,
	.basic_sales .prd_price #discounted-price-div > small.price-diff-pill,
	.basic_sales .prd_price .discounted-price-div > small.price-diff-pill,
	#products-info .basic_sales .prd_price .discounted-price-display + small,
	#products-info .basic_sales .prd_price > div:last-child > small.price-diff-pill {
		font-size: 10px !important;
		padding-left: 0 !important;
	}

	.basic_sales:not(:has(> h3)),
	#products-info .basic_sales:not(:has(> h3)),
	#product-modal .sale-info .basic_sales:not(:has(> h3)),
	.shopping .basic_sales:not(:has(> h3)),
	.x-pg-sales-product-box .basic_sales:not(:has(> h3)) {
		padding: 18px 20px !important;
	}

	.basic_sales:not(:has(> h3)) .prd_price,
	#products-info .basic_sales:not(:has(> h3)) .prd_price,
	#product-modal .sale-info .basic_sales:not(:has(> h3)) .prd_price,
	.shopping .basic_sales:not(:has(> h3)) .prd_price,
	.x-pg-sales-product-box .basic_sales:not(:has(> h3)) .prd_price {
		gap: 14px !important;
	}
}

/* 最終覆蓋：實際輸出平板商品圖改為主圖 + 右側垂直縮圖欄 */
@media screen and (min-width: 768px) and (max-width: 1024px) {
	#products-info .slider_box {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) clamp(68px, 10vw, 92px);
		gap: 12px;
		align-items: stretch;
		max-width: min(100%, 760px);
		margin-left: auto;
		margin-right: auto;
		container-type: inline-size;
		--x-pg-quick-slider-thumb-width: clamp(68px, 10vw, 92px);
		--x-pg-quick-slider-gap: 12px;
		--x-pg-quick-slider-track-height: clamp(180px, calc((100cqw - var(--x-pg-quick-slider-thumb-width) - var(--x-pg-quick-slider-gap)) * 2 / 3), 520px);
	}

	#products-info .main-slider {
		width: auto !important;
		min-width: 0;
		padding-right: 0 !important;
		margin-bottom: 0;
	}

	/* #products-info .main-slider 改用 aspect-ratio 3:2，不再固定高度 */

	#products-info .thumb-slider,
	#products-info .slider-nav {
		display: grid !important;
		grid-template-rows: 32px minmax(0, 1fr) 32px;
		gap: 6px;
		width: auto !important;
		height: clamp(180px, 52vw, 240px);
		height: var(--x-pg-quick-slider-track-height, clamp(180px, 52vw, 240px));
		margin-top: 0;
		overflow: hidden;
	}

	#products-info .thumb-slider .slick-list,
	#products-info .slider-nav .slick-list {
		width: 100% !important;
		min-width: 64px !important;
		max-width: none !important;
		height: 100% !important;
		min-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		overflow-x: hidden !important;
		overflow-y: auto !important;
		scrollbar-width: thin;
	}

	#products-info .thumb-slider .slick-slide,
	#products-info .slider-nav .slick-slide {
		float: none !important;
		display: block !important;
		width: 100% !important;
		min-width: 64px !important;
		height: auto !important;
		opacity: 1 !important;
		padding: 0 !important;
	}

	#products-info .thumb-slider .slick-slide > div,
	#products-info .slider-nav .slick-slide > div {
		width: 100% !important;
		min-width: 64px !important;
		height: auto !important;
		aspect-ratio: 1 / 1 !important;
		box-sizing: border-box;
	}

	#products-info .thumb-slider .slick-slide > div > div,
	#products-info .slider-nav .slick-slide > div > div {
		width: 100% !important;
		min-width: 64px !important;
		height: 100% !important;
		padding-bottom: 0 !important;
	}

	#products-info .thumb-slider .slick-arrow,
	#products-info .slider-nav .slick-arrow,
	#products-info .slider-nav .slick-prev,
	#products-info .slider-nav .slick-next {
		position: static !important;
		display: flex !important;
		width: 100% !important;
		min-width: 64px !important;
		height: 32px !important;
		min-height: 32px !important;
		transform: none !important;
		border-radius: 2px;
		background-color: #e7e7e7ee;
		align-items: center !important;
		justify-content: center !important;
		padding: 0;
	}

	#products-info .thumb-slider .slick-arrow::before,
	#products-info .slider-nav .slick-arrow::before {
		display: none !important;
	}

	#products-info .thumb-slider .slick-arrow::after,
	#products-info .slider-nav .slick-arrow::after {
		content: "" !important;
		width: 0 !important;
		height: 0 !important;
		border-left: 7px solid transparent !important;
		border-right: 7px solid transparent !important;
		border-top: 0 !important;
		border-bottom: 8px solid #5f6672 !important;
		transform: none !important;
	}

	#products-info .thumb-slider .slick-prev::after,
	#products-info .slider-nav .slick-prev::after {
		transform: none !important;
	}

	#products-info .thumb-slider .slick-next::after,
	#products-info .slider-nav .slick-next::after {
		border-top: 8px solid #5f6672 !important;
		border-bottom: 0 !important;
		transform: none !important;
	}
}

/* EOF 覆蓋：平板縮圖軌道固定寬度，箭頭改為上/下 */
@media screen and (min-width: 768px) and (max-width: 1024px) {
	#products-info .thumb-slider,
	#products-info .slider-nav,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav {
		display: grid !important;
		grid-template-rows: 32px minmax(0, 1fr) 32px !important;
		grid-template-columns: minmax(64px, 1fr) !important;
		gap: 6px !important;
		width: auto !important;
		min-width: 64px !important;
	}

	#products-info .thumb-slider .slick-list,
	#products-info .slider-nav .slick-list,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-list,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-list {
		width: 100% !important;
		min-width: 64px !important;
		max-width: none !important;
		height: 100% !important;
		min-height: 0 !important;
		padding: 0 !important;
		overflow-x: hidden !important;
		overflow-y: auto !important;
	}

	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-track,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-track {
		display: flex !important;
		flex-direction: column !important;
		gap: 8px !important;
		width: 100% !important;
		min-width: 64px !important;
		height: auto !important;
		transform: none !important;
		left: 0 !important;
		top: 0 !important;
	}

	#products-info .thumb-slider .slick-slide,
	#products-info .slider-nav .slick-slide,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-slide,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-slide {
		float: none !important;
		display: block !important;
		width: 100% !important;
		min-width: 64px !important;
		height: auto !important;
		opacity: 1 !important;
		padding: 0 !important;
	}

	#products-info .thumb-slider .slick-slide > div,
	#products-info .slider-nav .slick-slide > div,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-slide > div,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-slide > div {
		width: 100% !important;
		min-width: 64px !important;
		height: auto !important;
		aspect-ratio: 1 / 1 !important;
		box-sizing: border-box;
	}

	#products-info .thumb-slider .slick-slide > div > div,
	#products-info .slider-nav .slick-slide > div > div,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-slide > div > div,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-slide > div > div {
		width: 100% !important;
		min-width: 64px !important;
		height: 100% !important;
		padding-bottom: 0 !important;
	}

	#products-info .thumb-slider .slick-arrow,
	#products-info .slider-nav .slick-arrow,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-arrow,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-arrow {
		position: static !important;
		display: flex !important;
		width: 100% !important;
		min-width: 64px !important;
		height: 32px !important;
		min-height: 32px !important;
		transform: none !important;
		align-items: center !important;
		justify-content: center !important;
	}

	#products-info .thumb-slider .slick-arrow::before,
	#products-info .slider-nav .slick-arrow::before,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-arrow::before,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-arrow::before {
		display: none !important;
	}

	#products-info .thumb-slider .slick-arrow::after,
	#products-info .slider-nav .slick-arrow::after,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-arrow::after,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-arrow::after {
		content: "" !important;
		width: 0 !important;
		height: 0 !important;
		border-left: 7px solid transparent !important;
		border-right: 7px solid transparent !important;
		border-top: 0 !important;
		border-bottom: 8px solid #5f6672 !important;
		transform: none !important;
	}

	#products-info .thumb-slider .slick-next::after,
	#products-info .slider-nav .slick-next::after,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-next::after,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-next::after {
		border-top: 8px solid #5f6672 !important;
		border-bottom: 0 !important;
	}
}

/* EOF：商品詳情 tabet_phone-only 只在桌機隱藏，平板/手機必須顯示 */
@media screen and (max-width: 1024px) {
	.x-pg-sales-product-box .tabet_phone-only,
	.x-pg-sales-product-box .tabet_phone-only.d-none {
		display: flex !important;
	}

	.x-pg-sales-product-box .pc-only:not(.button_area) {
		display: none !important;
	}
}

@media screen and (min-width: 1024.01px) {
	.x-pg-sales-product-box .tabet_phone-only {
		display: none !important;
	}
}

/* 最終覆蓋：平板垂直縮圖列的 slick-arrow 方向 */
@media screen and (min-width: 768px) and (max-width: 1024px) {
	.x-pg-row-form-block .slider-nav .slick-arrow::after,
	.x-pg-row-form-block .thumb-slider .slick-arrow::after,
	.x-pg-sales-product-box .slider-nav .slick-arrow::after,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-arrow::after,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-arrow::after,
	#products-info .slider-nav .slick-arrow::after,
	#products-info .thumb-slider .slick-arrow::after {
		content: "" !important;
		width: 9px !important;
		height: 9px !important;
		border: solid #5f6672 !important;
		border-width: 0 2px 2px 0 !important;
	}

	.x-pg-row-form-block .slider-nav .slick-prev::after,
	.x-pg-row-form-block .slider-nav .slick-arrow.slick-prev::after,
	.x-pg-row-form-block .thumb-slider .slick-prev::after,
	.x-pg-row-form-block .thumb-slider .slick-arrow.slick-prev::after,
	.x-pg-sales-product-box .slider-nav .slick-prev::after,
	.x-pg-sales-product-box .slider-nav .slick-arrow.slick-prev::after,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-prev::after,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-arrow.slick-prev::after,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-prev::after,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-arrow.slick-prev::after,
	#products-info .slider-nav .slick-prev::after,
	#products-info .slider-nav .slick-arrow.slick-prev::after,
	#products-info .thumb-slider .slick-prev::after,
	#products-info .thumb-slider .slick-arrow.slick-prev::after {
		transform: rotate(-135deg) !important;
	}

	.x-pg-row-form-block .slider-nav .slick-next::after,
	.x-pg-row-form-block .slider-nav .slick-arrow.slick-next::after,
	.x-pg-row-form-block .thumb-slider .slick-next::after,
	.x-pg-row-form-block .thumb-slider .slick-arrow.slick-next::after,
	.x-pg-sales-product-box .slider-nav .slick-next::after,
	.x-pg-sales-product-box .slider-nav .slick-arrow.slick-next::after,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-next::after,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-arrow.slick-next::after,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-next::after,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-arrow.slick-next::after,
	#products-info .slider-nav .slick-next::after,
	#products-info .slider-nav .slick-arrow.slick-next::after,
	#products-info .thumb-slider .slick-next::after,
	#products-info .thumb-slider .slick-arrow.slick-next::after {
		transform: rotate(45deg) !important;
	}
}

/* 最終覆蓋：平板商品圖右側縮圖軌道加寬，讓主圖區自然縮小 */
@media screen and (min-width: 768px) and (max-width: 1024px) {
	.x-pg-row-form-block .slider_box,
	.x-pg-sales-product-box .slider_box,
	#products-info .slider_box,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider_box,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider_box {
		grid-template-columns: minmax(0, 1fr) 100px !important;
	}

	.x-pg-row-form-block .slider-nav,
	.x-pg-row-form-block .thumb-slider,
	.x-pg-sales-product-box .slider-nav,
	.x-pg-sales-product-box .thumb-slider,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav {
		width: 100px !important;
		min-width: 100px !important;
		max-width: 100px !important;
		flex: 0 0 100px !important;
	}

	.x-pg-row-form-block .slider-nav .slick-list,
	.x-pg-row-form-block .thumb-slider .slick-list,
	.x-pg-row-form-block .slider-nav .slick-track,
	.x-pg-row-form-block .thumb-slider .slick-track,
	.x-pg-row-form-block .slider-nav .slick-slide,
	.x-pg-row-form-block .thumb-slider .slick-slide,
	.x-pg-row-form-block .slider-nav .slick-slide > div,
	.x-pg-row-form-block .thumb-slider .slick-slide > div,
	.x-pg-row-form-block .slider-nav .slick-slide > div > div,
	.x-pg-row-form-block .thumb-slider .slick-slide > div > div,
	.x-pg-sales-product-box .slider-nav .slick-list,
	.x-pg-sales-product-box .thumb-slider .slick-list,
	.x-pg-sales-product-box .slider-nav .slick-track,
	.x-pg-sales-product-box .thumb-slider .slick-track,
	.x-pg-sales-product-box .slider-nav .slick-slide,
	.x-pg-sales-product-box .thumb-slider .slick-slide,
	.x-pg-sales-product-box .slider-nav .slick-slide > div,
	.x-pg-sales-product-box .thumb-slider .slick-slide > div,
	.x-pg-sales-product-box .slider-nav .slick-slide > div > div,
	.x-pg-sales-product-box .thumb-slider .slick-slide > div > div,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-list,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-list,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-track,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-track,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-slide,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-slide,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-slide > div,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-slide > div,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-slide > div > div,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-slide > div > div {
		width: 100px !important;
		min-width: 100px !important;
		max-width: 100px !important;
		box-sizing: border-box !important;
	}

	.x-pg-row-form-block .slider-nav .slick-list,
	.x-pg-row-form-block .thumb-slider .slick-list,
	.x-pg-sales-product-box .slider-nav .slick-list,
	.x-pg-sales-product-box .thumb-slider .slick-list,
	#products-info .thumb-slider .slick-list,
	#products-info .slider-nav .slick-list,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-list,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-list {
		scrollbar-width: none !important;
	}

	.x-pg-row-form-block .slider-nav .slick-list::-webkit-scrollbar,
	.x-pg-row-form-block .thumb-slider .slick-list::-webkit-scrollbar,
	.x-pg-sales-product-box .slider-nav .slick-list::-webkit-scrollbar,
	.x-pg-sales-product-box .thumb-slider .slick-list::-webkit-scrollbar,
	#products-info .thumb-slider .slick-list::-webkit-scrollbar,
	#products-info .slider-nav .slick-list::-webkit-scrollbar,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-list::-webkit-scrollbar,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-list::-webkit-scrollbar {
		display: none !important;
	}

	.x-pg-row-form-block .slider-nav .slick-arrow,
	.x-pg-row-form-block .thumb-slider .slick-arrow,
	.x-pg-sales-product-box .slider-nav .slick-arrow,
	.x-pg-sales-product-box .thumb-slider .slick-arrow,
	#products-info .thumb-slider .slick-arrow,
	#products-info .slider-nav .slick-arrow,
	.x-pg-preview-frame.tablet .x-pg-sales-product-box .slider-nav .slick-arrow,
	.x-pg-preview-frame.size-tablet .x-pg-sales-product-box .slider-nav .slick-arrow {
		width: 100px !important;
		min-width: 100px !important;
		max-width: 100px !important;
	}
}

/* 商品速覽 offcanvas：沿用平板商品圖的主圖 + 右側縮圖邏輯，但使用 offcanvas 自己的寬度 */
#products-info .slider-container .slider_box {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) var(--x-pg-quick-slider-thumb-width, 72px) !important;
	gap: 10px !important;
	align-items: start !important;
	width: 100% !important;
	max-width: 100% !important;
	overflow: hidden !important;
	margin-right: auto;
	margin-left: auto;
	container-type: inline-size;
	--x-pg-quick-slider-gap: 10px;
	--x-pg-quick-slider-track-height: clamp(180px, calc((100cqw - var(--x-pg-quick-slider-thumb-width, 72px) - var(--x-pg-quick-slider-gap)) * 2 / 3), 320px);
}

#products-info .slider-container .main-slider {
	width: 100% !important;
	min-width: 0 !important;
	padding-right: 0 !important;
	margin-bottom: 0 !important;
}

#products-info .slider-container:has(.main-slider .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.main-slider .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .slider_box,
#products-info .slider-container:has(.slider-for .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.slider-for .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .slider_box {
	display: block !important;
	grid-template-columns: minmax(0, 1fr) !important;
	gap: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
	--x-pg-quick-slider-thumb-width: 0px;
	--x-pg-quick-slider-gap: 0px;
}

#products-info .slider-container:has(.main-slider .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.main-slider .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) :is(.thumb-slider, .slider-nav),
#products-info .slider-container:has(.slider-for .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.slider-for .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) :is(.thumb-slider, .slider-nav) {
	display: none !important;
}

#products-info .slider-container:has(.main-slider .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.main-slider .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .main-slider,
#products-info .slider-container:has(.slider-for .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.slider-for .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .slider-for,
#products-info .slider-container:has(.main-slider .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.main-slider .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .main-slider :is(.slick-slider, .slick-list, .slick-track, .slick-slide, .slide-item, .slide-content),
#products-info .slider-container:has(.slider-for .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.slider-for .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .slider-for :is(.slick-slider, .slick-list, .slick-track, .slick-slide, .slide-item, .slide-content) {
	width: 100% !important;
	max-width: 100% !important;
}

#products-info .slider-container:has(.main-slider .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.main-slider .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .main-slider .slick-track,
#products-info .slider-container:has(.slider-for .slick-slide[data-index="0"]:not(.slick-cloned):has(img)):not(:has(.slider-for .slick-slide[data-index="1"]:not(.slick-cloned):has(img))) .slider-for .slick-track {
	transform: translate3d(0, 0, 0) !important;
}

/* .slider-container .main-slider 高 specificity 固定高度規則移除：
   改由 #products-info .main-slider .slick-list aspect-ratio: 3/2 接管 */

/* .slider-container .thumb-slider 高 specificity 段已移除：
   改由 exportHtml.js 的 forceOffcanvasThumbLayout 在 client 端強塞 inline !important，
   繞過 CSS cascade 不確定性。視覺微調規則統一在 #products-info .thumb-slider 段。 */

/* 商品速覽 offcanvas：縮圖軌道 — 信任 Slick 原生 vertical layout，只做視覺微調 */
#products-info .thumb-slider,
#products-info .slider-nav {
	position: relative;
	width: 72px;
	min-width: 72px;
	max-width: 72px;
	height: clamp(180px, 50vw, 240px);
	height: var(--x-pg-quick-slider-track-height, clamp(180px, 50vw, 240px));
	max-height: clamp(180px, 50vw, 240px);
	max-height: var(--x-pg-quick-slider-track-height, clamp(180px, 50vw, 240px));
	align-self: start;
	overflow: hidden;
}

#products-info .thumb-slider .slick-slider,
#products-info .slider-nav .slick-slider {
	width: 100%;
	height: 100%;
	max-height: inherit;
	overflow: hidden;
}

/* slide 需要明確高度，否則 inline-block 的 thumb-item 撐不起來、可視窗看似空白 */
#products-info .thumb-slider .slick-slide,
#products-info .slider-nav .slick-slide {
	height: 50px !important;
}

#products-info .thumb-slider .slick-slide > div,
#products-info .slider-nav .slick-slide > div,
#products-info .thumb-slider .thumb-item,
#products-info .slider-nav .thumb-item,
#products-info .thumb-slider .thumb-content,
#products-info .slider-nav .thumb-content {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	padding: 2px 4px !important;
	box-sizing: border-box;
}

#products-info .thumb-slider .thumb-content,
#products-info .slider-nav .thumb-content {
	position: relative;
	overflow: hidden;
	border: 1px solid #eceff3;
	border-radius: 4px;
	background: #fff;
}

#products-info .thumb-slider .slick-current .thumb-content,
#products-info .thumb-slider .slick-center .thumb-content,
#products-info .slider-nav .slick-current .thumb-content,
#products-info .slider-nav .slick-center .thumb-content {
	border: 2px solid var(--x-pg-quick-cta);
}

/* 縮圖編號：同抽屜外（.x-pg-sales-product-box .slider-nav）的左上角數字角標 */
#products-info .thumb-slider .slick-track,
#products-info .slider-nav .slick-track {
	counter-reset: x-pg-quick-thumb;
}

#products-info .thumb-slider .slick-slide:not(.slick-cloned),
#products-info .slider-nav .slick-slide:not(.slick-cloned) {
	counter-increment: x-pg-quick-thumb;
}

#products-info .thumb-slider .slick-slide[data-x-pg-thumb-number] .thumb-content::after,
#products-info .slider-nav .slick-slide[data-x-pg-thumb-number] .thumb-content::after,
#products-info .thumb-slider .slick-slide:not([data-x-pg-thumb-number]) .thumb-content::after,
#products-info .slider-nav .slick-slide:not([data-x-pg-thumb-number]) .thumb-content::after {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	width: 26px;
	height: 26px;
	padding: 2px 0 0 4px;
	background: linear-gradient(135deg, rgba(32, 36, 53, .2) 0 50%, transparent 50% 100%);
	color: rgba(32, 36, 53, .82);
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
	text-align: left;
	pointer-events: none;
}

#products-info .thumb-slider .slick-slide[data-x-pg-thumb-number] .thumb-content::after,
#products-info .slider-nav .slick-slide[data-x-pg-thumb-number] .thumb-content::after {
	content: attr(data-x-pg-thumb-number);
}

#products-info .thumb-slider .slick-slide:not([data-x-pg-thumb-number]) .thumb-content::after,
#products-info .slider-nav .slick-slide:not([data-x-pg-thumb-number]) .thumb-content::after {
	content: counter(x-pg-quick-thumb);
}

#products-info .thumb-slider .thumb-content img,
#products-info .slider-nav .thumb-content img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	object-fit: contain;
}

/* SalesShop 商品 modal 用 React Slick；clone 使用 data-index，編號與少圖排列需另外覆蓋 */
#product-modal .slider-container .slider_box:has(> .thumb-slider),
#product-modal .slider-container .slider_box:has(> .slider-nav) {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 72px !important;
	gap: 8px !important;
	align-items: start !important;
	width: 100% !important;
	max-width: 100% !important;
	overflow: hidden !important;
}

#product-modal .main-slider,
#product-modal .slider-for {
	min-width: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
	padding-right: 0 !important;
}

#product-modal .main-slider .slick-list,
#product-modal .slider-for .slick-list {
	aspect-ratio: 3 / 2;
	height: auto !important;
	overflow: hidden;
}

#product-modal .main-slider .slide-content,
#product-modal .slider-for .slide-content {
	aspect-ratio: 3 / 2;
	overflow: hidden;
}

#product-modal .main-slider .slide-content img,
#product-modal .slider-for .slide-content img {
	width: 100% !important;
	height: 100% !important;
	object-fit: contain;
}

#product-modal .thumb-slider,
#product-modal .slider-nav {
	position: relative !important;
	align-self: start !important;
	width: 72px !important;
	min-width: 72px !important;
	max-width: 72px !important;
	height: clamp(220px, 52vw, 520px) !important;
	max-height: clamp(220px, 52vw, 520px) !important;
	min-height: 0 !important;
	overflow: hidden !important;
}

#product-modal .thumb-slider .slick-slider,
#product-modal .slider-nav .slick-slider {
	position: relative !important;
	width: 100% !important;
	height: 100% !important;
	overflow: hidden !important;
}

#product-modal .thumb-slider .slick-list,
#product-modal .slider-nav .slick-list {
	position: absolute !important;
	inset: 26px 0 !important;
	width: 100% !important;
	min-width: 72px !important;
	max-width: 72px !important;
	height: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
}

#product-modal .thumb-slider .slick-slide,
#product-modal .slider-nav .slick-slide {
	width: 72px !important;
	min-width: 72px !important;
	max-width: 72px !important;
	height: 50px !important;
	min-height: 50px !important;
	padding: 0 !important;
	margin: 0 !important;
}

#product-modal .thumb-slider .slick-slide > div,
#product-modal .slider-nav .slick-slide > div,
#product-modal .thumb-slider .thumb-item,
#product-modal .slider-nav .thumb-item,
#product-modal .thumb-slider .thumb-content,
#product-modal .slider-nav .thumb-content {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	padding: 2px 4px !important;
	margin: 0 !important;
	box-sizing: border-box;
}

#product-modal .thumb-slider .thumb-content img,
#product-modal .slider-nav .thumb-content img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	max-width: 100% !important;
	max-height: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	object-fit: contain;
}

#product-modal .thumb-slider .slick-prev,
#product-modal .thumb-slider .slick-next,
#product-modal .slider-nav .slick-prev,
#product-modal .slider-nav .slick-next {
	position: absolute !important;
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	min-width: 72px !important;
	max-width: 72px !important;
	height: 22px !important;
	min-height: 22px !important;
	padding: 0 !important;
	margin: 0 !important;
	transform: none !important;
	border: 0 !important;
	border-radius: 4px !important;
	background-color: #e7e7e7ee !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	z-index: 6 !important;
}

#product-modal .thumb-slider .slick-prev,
#product-modal .slider-nav .slick-prev {
	top: 0 !important;
	bottom: auto !important;
}

#product-modal .thumb-slider .slick-next,
#product-modal .slider-nav .slick-next {
	top: auto !important;
	bottom: 0 !important;
}

#product-modal .thumb-slider .slick-track,
#product-modal .slider-nav .slick-track {
	counter-reset: x-pg-quick-thumb;
}

#product-modal .thumb-slider .slick-slide:not(.slick-cloned),
#product-modal .slider-nav .slick-slide:not(.slick-cloned) {
	counter-increment: x-pg-quick-thumb;
}

#product-modal .thumb-slider .thumb-content,
#product-modal .slider-nav .thumb-content {
	position: relative;
	overflow: hidden;
	border: 1px solid #eceff3;
	border-radius: 4px;
	background: #fff;
	box-sizing: border-box;
}

#product-modal .thumb-slider .slick-current .thumb-content,
#product-modal .thumb-slider .slick-center .thumb-content,
#product-modal .slider-nav .slick-current .thumb-content,
#product-modal .slider-nav .slick-center .thumb-content {
	border: 2px solid var(--x-pg-quick-cta, #ee4d2d);
}

#product-modal .thumb-slider .slick-slide[data-x-pg-thumb-number] .thumb-content::after,
#product-modal .slider-nav .slick-slide[data-x-pg-thumb-number] .thumb-content::after,
#product-modal .thumb-slider .slick-slide:not([data-x-pg-thumb-number]) .thumb-content::after,
#product-modal .slider-nav .slick-slide:not([data-x-pg-thumb-number]) .thumb-content::after {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	width: 26px;
	height: 26px;
	padding: 2px 0 0 4px;
	background: linear-gradient(135deg, rgba(32, 36, 53, .2) 0 50%, transparent 50% 100%);
	color: rgba(32, 36, 53, .82);
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
	text-align: left;
	pointer-events: none;
}

#product-modal .thumb-slider .slick-slide[data-x-pg-thumb-number] .thumb-content::after,
#product-modal .slider-nav .slick-slide[data-x-pg-thumb-number] .thumb-content::after {
	content: attr(data-x-pg-thumb-number);
}

#product-modal .thumb-slider .slick-slide:not([data-x-pg-thumb-number]) .thumb-content::after,
#product-modal .slider-nav .slick-slide:not([data-x-pg-thumb-number]) .thumb-content::after {
	content: counter(x-pg-quick-thumb);
}

/* Slick clone 編號 fallback：JS guard 未載入時，也依 data-slick-index 做循環編號 */
.slider-container .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="-3"] .thumb-content::after,
.slider-container .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="-3"] .thumb-content::after,
#products-info .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="-3"] .thumb-content::after,
#products-info .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="-3"] .thumb-content::after,
#product-modal .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="-3"] .thumb-content::after,
#product-modal .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="-3"] .thumb-content::after,
.slider-container .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="0"] .thumb-content::after,
.slider-container .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="0"] .thumb-content::after,
#products-info .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="0"] .thumb-content::after,
#products-info .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="0"] .thumb-content::after,
#product-modal .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="0"] .thumb-content::after,
#product-modal .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="0"] .thumb-content::after,
.slider-container .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="3"] .thumb-content::after,
.slider-container .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="3"] .thumb-content::after,
#products-info .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="3"] .thumb-content::after,
#products-info .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="3"] .thumb-content::after,
#product-modal .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="3"] .thumb-content::after,
#product-modal .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="3"] .thumb-content::after {
	content: "1" !important;
}

.slider-container .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="-2"] .thumb-content::after,
.slider-container .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="-2"] .thumb-content::after,
#products-info .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="-2"] .thumb-content::after,
#products-info .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="-2"] .thumb-content::after,
#product-modal .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="-2"] .thumb-content::after,
#product-modal .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="-2"] .thumb-content::after,
.slider-container .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="1"] .thumb-content::after,
.slider-container .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="1"] .thumb-content::after,
#products-info .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="1"] .thumb-content::after,
#products-info .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="1"] .thumb-content::after,
#product-modal .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="1"] .thumb-content::after,
#product-modal .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="1"] .thumb-content::after,
.slider-container .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="4"] .thumb-content::after,
.slider-container .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="4"] .thumb-content::after,
#products-info .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="4"] .thumb-content::after,
#products-info .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="4"] .thumb-content::after,
#product-modal .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="4"] .thumb-content::after,
#product-modal .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="4"] .thumb-content::after {
	content: "2" !important;
}

.slider-container .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="-1"] .thumb-content::after,
.slider-container .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="-1"] .thumb-content::after,
#products-info .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="-1"] .thumb-content::after,
#products-info .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="-1"] .thumb-content::after,
#product-modal .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="-1"] .thumb-content::after,
#product-modal .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="-1"] .thumb-content::after,
.slider-container .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="2"] .thumb-content::after,
.slider-container .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="2"] .thumb-content::after,
#products-info .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="2"] .thumb-content::after,
#products-info .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="2"] .thumb-content::after,
#product-modal .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="2"] .thumb-content::after,
#product-modal .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="2"] .thumb-content::after,
.slider-container .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="5"] .thumb-content::after,
.slider-container .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="5"] .thumb-content::after,
#products-info .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="5"] .thumb-content::after,
#products-info .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="5"] .thumb-content::after,
#product-modal .thumb-slider:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="5"] .thumb-content::after,
#product-modal .slider-nav:not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide[data-slick-index="5"] .thumb-content::after {
	content: "3" !important;
}

.slider-container :is(.thumb-slider, .slider-nav):not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-3"], [data-slick-index="0"], [data-slick-index="3"]) :is(.thumb-content, div:not(:has(.thumb-content)))::after,
#products-info :is(.thumb-slider, .slider-nav):not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-3"], [data-slick-index="0"], [data-slick-index="3"]) :is(.thumb-content, div:not(:has(.thumb-content)))::after,
#product-modal :is(.thumb-slider, .slider-nav):not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-3"], [data-slick-index="0"], [data-slick-index="3"]) :is(.thumb-content, div:not(:has(.thumb-content)))::after {
	content: "1" !important;
}

.slider-container :is(.thumb-slider, .slider-nav):not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-2"], [data-slick-index="1"], [data-slick-index="4"]) :is(.thumb-content, div:not(:has(.thumb-content)))::after,
#products-info :is(.thumb-slider, .slider-nav):not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-2"], [data-slick-index="1"], [data-slick-index="4"]) :is(.thumb-content, div:not(:has(.thumb-content)))::after,
#product-modal :is(.thumb-slider, .slider-nav):not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-2"], [data-slick-index="1"], [data-slick-index="4"]) :is(.thumb-content, div:not(:has(.thumb-content)))::after {
	content: "2" !important;
}

.slider-container :is(.thumb-slider, .slider-nav):not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-1"], [data-slick-index="2"], [data-slick-index="5"]) :is(.thumb-content, div:not(:has(.thumb-content)))::after,
#products-info :is(.thumb-slider, .slider-nav):not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-1"], [data-slick-index="2"], [data-slick-index="5"]) :is(.thumb-content, div:not(:has(.thumb-content)))::after,
#product-modal :is(.thumb-slider, .slider-nav):not(:has(.slick-slide[data-slick-index="3"]:not(.slick-cloned))) .slick-slide:is([data-slick-index="-1"], [data-slick-index="2"], [data-slick-index="5"]) :is(.thumb-content, div:not(:has(.thumb-content)))::after {
	content: "3" !important;
}

/* React Slick 使用 data-index；3 張圖時 cloned slides 應循環回 1-2-3 */
.slider-container :is(.thumb-slider, .slider-nav):not(:has(.slick-slide[data-index="3"]:not(.slick-cloned))) .slick-slide:is([data-index="-3"], [data-index="0"], [data-index="3"]) :is(.thumb-content, div:not(:has(.thumb-content)))::after,
#products-info :is(.thumb-slider, .slider-nav):not(:has(.slick-slide[data-index="3"]:not(.slick-cloned))) .slick-slide:is([data-index="-3"], [data-index="0"], [data-index="3"]) :is(.thumb-content, div:not(:has(.thumb-content)))::after,
#product-modal :is(.thumb-slider, .slider-nav):not(:has(.slick-slide[data-index="3"]:not(.slick-cloned))) .slick-slide:is([data-index="-3"], [data-index="0"], [data-index="3"]) :is(.thumb-content, div:not(:has(.thumb-content)))::after {
	content: "1" !important;
}

.slider-container :is(.thumb-slider, .slider-nav):not(:has(.slick-slide[data-index="3"]:not(.slick-cloned))) .slick-slide:is([data-index="-2"], [data-index="1"], [data-index="4"]) :is(.thumb-content, div:not(:has(.thumb-content)))::after,
#products-info :is(.thumb-slider, .slider-nav):not(:has(.slick-slide[data-index="3"]:not(.slick-cloned))) .slick-slide:is([data-index="-2"], [data-index="1"], [data-index="4"]) :is(.thumb-content, div:not(:has(.thumb-content)))::after,
#product-modal :is(.thumb-slider, .slider-nav):not(:has(.slick-slide[data-index="3"]:not(.slick-cloned))) .slick-slide:is([data-index="-2"], [data-index="1"], [data-index="4"]) :is(.thumb-content, div:not(:has(.thumb-content)))::after {
	content: "2" !important;
}

.slider-container :is(.thumb-slider, .slider-nav):not(:has(.slick-slide[data-index="3"]:not(.slick-cloned))) .slick-slide:is([data-index="-1"], [data-index="2"], [data-index="5"]) :is(.thumb-content, div:not(:has(.thumb-content)))::after,
#products-info :is(.thumb-slider, .slider-nav):not(:has(.slick-slide[data-index="3"]:not(.slick-cloned))) .slick-slide:is([data-index="-1"], [data-index="2"], [data-index="5"]) :is(.thumb-content, div:not(:has(.thumb-content)))::after,
#product-modal :is(.thumb-slider, .slider-nav):not(:has(.slick-slide[data-index="3"]:not(.slick-cloned))) .slick-slide:is([data-index="-1"], [data-index="2"], [data-index="5"]) :is(.thumb-content, div:not(:has(.thumb-content)))::after {
	content: "3" !important;
}

.slider-container .thumb-slider .slick-slide[data-x-pg-thumb-number] .thumb-content,
.slider-container .slider-nav .slick-slide[data-x-pg-thumb-number] .thumb-content,
.slider-container .thumb-slider .slick-slide[data-x-pg-thumb-number] > div:not(:has(.thumb-content)),
.slider-container .slider-nav .slick-slide[data-x-pg-thumb-number] > div:not(:has(.thumb-content)) {
	position: relative;
	overflow: hidden;
}

.slider-container .thumb-slider .slick-slide[data-x-pg-thumb-number] .thumb-content::after,
.slider-container .slider-nav .slick-slide[data-x-pg-thumb-number] .thumb-content::after,
.slider-container .thumb-slider .slick-slide[data-x-pg-thumb-number] > div:not(:has(.thumb-content))::after,
.slider-container .slider-nav .slick-slide[data-x-pg-thumb-number] > div:not(:has(.thumb-content))::after {
	content: attr(data-x-pg-thumb-number);
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	width: 26px;
	height: 26px;
	padding: 2px 0 0 4px;
	background: linear-gradient(135deg, rgba(32, 36, 53, .2) 0 50%, transparent 50% 100%);
	color: rgba(32, 36, 53, .82);
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
	text-align: left;
	pointer-events: none;
	box-sizing: border-box;
}

.slider-container .thumb-slider .thumb-content[data-x-pg-thumb-number-rendered="1"]::after,
.slider-container .slider-nav .thumb-content[data-x-pg-thumb-number-rendered="1"]::after,
.slider-container .thumb-slider .slick-slide > div[data-x-pg-thumb-number-rendered="1"]::after,
.slider-container .slider-nav .slick-slide > div[data-x-pg-thumb-number-rendered="1"]::after,
#products-info .thumb-slider .thumb-content[data-x-pg-thumb-number-rendered="1"]::after,
#products-info .slider-nav .thumb-content[data-x-pg-thumb-number-rendered="1"]::after,
#products-info .thumb-slider .slick-slide > div[data-x-pg-thumb-number-rendered="1"]::after,
#products-info .slider-nav .slick-slide > div[data-x-pg-thumb-number-rendered="1"]::after,
#product-modal .thumb-slider .thumb-content[data-x-pg-thumb-number-rendered="1"]::after,
#product-modal .slider-nav .thumb-content[data-x-pg-thumb-number-rendered="1"]::after,
#product-modal .thumb-slider .slick-slide > div[data-x-pg-thumb-number-rendered="1"]::after,
#product-modal .slider-nav .slick-slide > div[data-x-pg-thumb-number-rendered="1"]::after {
	display: none !important;
	content: none !important;
}

.slider-container .thumb-slider .x-pg-thumb-number-badge,
.slider-container .slider-nav .x-pg-thumb-number-badge,
#products-info .thumb-slider .x-pg-thumb-number-badge,
#products-info .slider-nav .x-pg-thumb-number-badge,
#product-modal .thumb-slider .x-pg-thumb-number-badge,
#product-modal .slider-nav .x-pg-thumb-number-badge {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 4;
	display: none !important;
	width: 26px;
	height: 26px;
	padding: 2px 0 0 4px;
	background: linear-gradient(135deg, rgba(32, 36, 53, .2) 0 50%, transparent 50% 100%);
	color: rgba(32, 36, 53, .82);
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
	text-align: left;
	pointer-events: none;
	box-sizing: border-box;
}

#product-modal .thumb-slider[data-x-pg-thumb-count="2"] .slick-track,
#product-modal .thumb-slider[data-x-pg-thumb-count="3"] .slick-track,
#product-modal .thumb-slider[data-x-pg-thumb-count="4"] .slick-track,
#product-modal .slider-nav[data-x-pg-thumb-count="2"] .slick-track,
#product-modal .slider-nav[data-x-pg-thumb-count="3"] .slick-track,
#product-modal .slider-nav[data-x-pg-thumb-count="4"] .slick-track {
	display: flex !important;
	flex-direction: column !important;
	justify-content: flex-start !important;
	gap: 8px !important;
	transform: none !important;
	top: 0 !important;
	left: 0 !important;
}

/* vertical mode：把左右箭頭移到上下 */
#products-info .thumb-slider .slick-prev,
#products-info .thumb-slider .slick-next,
#products-info .slider-nav .slick-prev,
#products-info .slider-nav .slick-next {
	position: absolute;
	left: 0;
	right: 0;
	width: 100%;
	height: 22px;
	transform: none;
	border-radius: 4px;
	background-color: #e7e7e7ee;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
}

#products-info .thumb-slider .slick-prev,
#products-info .slider-nav .slick-prev {
	top: 0;
}

#products-info .thumb-slider .slick-next,
#products-info .slider-nav .slick-next {
	bottom: 0;
	top: auto;
}

#products-info .thumb-slider .slick-arrow::before,
#products-info .slider-nav .slick-arrow::before {
	display: none;
}

#products-info .thumb-slider .slick-arrow i,
#products-info .slider-nav .slick-arrow i {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	line-height: 1;
}

#products-info .thumb-slider .slick-arrow:has(i)::after,
#products-info .slider-nav .slick-arrow:has(i)::after {
	display: none !important;
}

#products-info .thumb-slider .slick-arrow::after,
#products-info .slider-nav .slick-arrow::after {
	content: "";
	display: inline-block;
	width: 9px;
	height: 9px;
	border: solid #5f6672;
	border-width: 0 2px 2px 0;
}

#products-info .thumb-slider .slick-prev::after,
#products-info .slider-nav .slick-prev::after {
	transform: rotate(-135deg);
	margin-top: 3px;
}

#products-info .thumb-slider .slick-next::after,
#products-info .slider-nav .slick-next::after {
	transform: rotate(45deg);
	margin-bottom: 3px;
}

/* 商品速覽 offcanvas：平板版用 PC 同款右側縮圖欄，不套手機 72px 小軌道 */
@media screen and (min-width: 768px) and (max-width: 1024px) {
	#products-info .slider-container .slider_box,
	#products-info .slider_box {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) 88px !important;
		gap: 10px !important;
		align-items: start !important;
		max-width: min(100%, 920px) !important;
		overflow: hidden !important;
		container-type: inline-size;
		--x-pg-quick-slider-thumb-width: 88px;
		--x-pg-quick-slider-gap: 10px;
		--x-pg-quick-slider-track-height: clamp(180px, calc((100cqw - var(--x-pg-quick-slider-thumb-width) - var(--x-pg-quick-slider-gap)) * 2 / 3), 520px);
	}

	#products-info .thumb-slider,
	#products-info .slider-nav {
		position: relative !important;
		width: 88px !important;
		min-width: 88px !important;
		max-width: 88px !important;
		align-self: start !important;
		height: clamp(180px, 52vw, 240px) !important;
		height: var(--x-pg-quick-slider-track-height, clamp(180px, 52vw, 240px)) !important;
		max-height: clamp(180px, 52vw, 240px) !important;
		max-height: var(--x-pg-quick-slider-track-height, clamp(180px, 52vw, 240px)) !important;
		min-height: 0 !important;
		overflow: hidden !important;
	}

	#products-info .thumb-slider .slick-slider,
	#products-info .slider-nav.slick-slider {
		position: relative !important;
		width: 100% !important;
		height: 100% !important;
		overflow: hidden !important;
	}

	#products-info .thumb-slider .slick-prev,
	#products-info .thumb-slider .slick-next,
	#products-info .slider-nav .slick-prev,
	#products-info .slider-nav .slick-next {
		position: absolute !important;
		left: 0 !important;
		right: 0 !important;
		width: 100% !important;
		min-width: 88px !important;
		max-width: 88px !important;
		height: 32px !important;
		min-height: 32px !important;
		display: flex !important;
		opacity: 1 !important;
		visibility: visible !important;
		align-items: center !important;
		justify-content: center !important;
		z-index: 6 !important;
	}

	#products-info .thumb-slider .slick-prev,
	#products-info .slider-nav .slick-prev {
		top: 0 !important;
		bottom: auto !important;
	}

	#products-info .thumb-slider .slick-next,
	#products-info .slider-nav .slick-next {
		top: auto !important;
		bottom: 0 !important;
	}

	#products-info .thumb-slider .slick-arrow i,
	#products-info .slider-nav .slick-arrow i {
		display: inline-flex !important;
		opacity: 1 !important;
		visibility: visible !important;
	}

	#products-info .thumb-slider .slick-list,
	#products-info .slider-nav .slick-list {
		position: absolute !important;
		inset: 34px 0 !important;
		width: 100% !important;
		min-width: 88px !important;
		max-width: 88px !important;
		height: auto !important;
		margin: 0 !important;
		padding: 0 !important;
		overflow: hidden !important;
	}

	#products-info .thumb-slider .slick-track,
	#products-info .slider-nav .slick-track {
		width: 88px !important;
		min-width: 88px !important;
		max-width: 88px !important;
	}

	#products-info .thumb-slider[data-x-pg-thumb-count="2"] .slick-track,
	#products-info .thumb-slider[data-x-pg-thumb-count="3"] .slick-track,
	#products-info .thumb-slider[data-x-pg-thumb-count="4"] .slick-track,
	#products-info .slider-nav[data-x-pg-thumb-count="2"] .slick-track,
	#products-info .slider-nav[data-x-pg-thumb-count="3"] .slick-track,
	#products-info .slider-nav[data-x-pg-thumb-count="4"] .slick-track {
		display: flex !important;
		flex-direction: column !important;
		justify-content: flex-start !important;
		gap: 8px !important;
		transform: none !important;
		top: 0 !important;
		left: 0 !important;
	}

	#products-info .thumb-slider .slick-slide,
	#products-info .slider-nav .slick-slide {
		width: 88px !important;
		min-width: 88px !important;
		max-width: 88px !important;
		height: 64px !important;
		min-height: 64px !important;
		max-height: 72px !important;
		opacity: 1 !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	#products-info .thumb-slider .slick-slide > div,
	#products-info .slider-nav .slick-slide > div,
	#products-info .thumb-slider .thumb-item,
	#products-info .slider-nav .thumb-item,
	#products-info .thumb-slider .thumb-content,
	#products-info .slider-nav .thumb-content {
		padding: 1px 2px !important;
	}
}

/* One page sales：平板右側縮圖軌道使用上下箭頭，避免橫向 next 箭頭覆蓋在軌道右側 */
@media screen and (min-width: 768px) and (max-width: 1024px) {
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .slider-nav .slick-prev,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .slider-nav .slick-next,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .slider-nav .slick-arrow.slick-prev,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .slider-nav .slick-arrow.slick-next,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .thumb-slider .slick-prev,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .thumb-slider .slick-next,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .thumb-slider .slick-arrow.slick-prev,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .thumb-slider .slick-arrow.slick-next {
		position: static !important;
		inset: auto !important;
		display: flex !important;
		width: 100% !important;
		min-width: 0 !important;
		max-width: none !important;
		height: 32px !important;
		min-height: 32px !important;
		transform: none !important;
		background-color: #e7e7e7ee !important;
		align-items: center !important;
		justify-content: center !important;
		padding: 0 !important;
	}

	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .slider-nav .slick-prev,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .slider-nav .slick-arrow.slick-prev,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .thumb-slider .slick-prev,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .thumb-slider .slick-arrow.slick-prev {
		grid-row: 1 !important;
		grid-column: 1 !important;
	}

	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .slider-nav .slick-next,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .slider-nav .slick-arrow.slick-next,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .thumb-slider .slick-next,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .thumb-slider .slick-arrow.slick-next {
		grid-row: 3 !important;
		grid-column: 1 !important;
	}

	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .slider-nav .slick-arrow::before,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .thumb-slider .slick-arrow::before {
		display: none !important;
		content: none !important;
	}

	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .slider-nav .slick-arrow::after,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .thumb-slider .slick-arrow::after {
		content: "" !important;
		width: 0 !important;
		height: 0 !important;
		border-left: 7px solid transparent !important;
		border-right: 7px solid transparent !important;
		border-top: 0 !important;
		border-bottom: 8px solid #5f6672 !important;
		transform: none !important;
	}

	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .slider-nav .slick-next::after,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .slider-nav .slick-arrow.slick-next::after,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .thumb-slider .slick-next::after,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .thumb-slider .slick-arrow.slick-next::after {
		border-top: 8px solid #5f6672 !important;
		border-bottom: 0 !important;
	}
}

@media screen and (max-width: 1024px) {
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .prd_first,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .prd_desc {
		padding-right: 0 !important;
		padding-left: 0 !important;
	}
}

.x-pg-preview-frame.tablet .x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .prd_first,
.x-pg-preview-frame.tablet .x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .prd_desc,
.x-pg-preview-frame.size-tablet .x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .prd_first,
.x-pg-preview-frame.size-tablet .x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .prd_desc,
.x-pg-preview-frame.mobile .x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .prd_first,
.x-pg-preview-frame.mobile .x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-sales-product-box .prd_desc {
	padding-right: 0 !important;
	padding-left: 0 !important;
}

/* One page sales：成品頁沒有 preview frame 時，也要把平板直向軌道內層全部鎖回同寬 */
@media screen and (min-width: 768px) and (max-width: 1024px) {
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .slider_box {
		grid-template-columns: minmax(0, 1fr) 100px !important;
		gap: 24px !important;
		justify-content: stretch !important;
	}

	.x-pg-row-sales-product-detail .x-pg-sales-product-box .slider_box .slider-nav,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-list,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-track,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-slide,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-slide > div,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-slide > div > div,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-prev,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-next,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-arrow.slick-prev,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-arrow.slick-next {
		width: 100px !important;
		min-width: 100px !important;
		max-width: 100px !important;
		box-sizing: border-box !important;
	}

	.x-pg-row-sales-product-detail .x-pg-sales-product-box .slider_box .slider-nav {
		justify-self: end !important;
		overflow: hidden !important;
	}

	.x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-list {
		grid-row: 2 !important;
		grid-column: 1 !important;
		margin: 0 !important;
		overflow-x: hidden !important;
	}

	.x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-track {
		left: 0 !important;
		transform: none !important;
	}

	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box .slider_box {
		grid-template-columns: minmax(0, 1fr) 100px !important;
		gap: 24px !important;
	}

	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box .slider_box .slider-nav,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-list,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-track,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-slide,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-slide > div,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-slide > div > div,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-arrow {
		width: 100px !important;
		min-width: 100px !important;
		max-width: 100px !important;
		box-sizing: border-box !important;
	}

	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-list {
		margin: 0 !important;
		padding: 0 !important;
	}

	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav .slick-track {
		left: 0 !important;
		transform: none !important;
	}

	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box .slider-nav img {
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
	}
}

@media screen and (max-width: 767.98px) {
	.x-pg-row-sales-product-detail .x-pg-sales-product-box,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .prd_first,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .prd_desc,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .prd_first.px-xl-5,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .prd_desc.px-xl-5,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .prd_first > .noshow_editor,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .slider_box,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .slider_box .slider-for {
		width: 100% !important;
		max-width: 100% !important;
	}

	.x-pg-row-sales-product-detail .x-pg-sales-product-box .prd_first,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .prd_desc,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .prd_first.px-xl-5,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box .prd_desc.px-xl-5 {
		flex: 0 0 100% !important;
		padding-right: 0 !important;
		padding-left: 0 !important;
		box-sizing: border-box !important;
	}

	.x-pg-row-sales-product-detail .x-pg-sales-product-box .slider_box {
		display: block !important;
		margin-right: 0 !important;
		margin-left: 0 !important;
	}
}

/* One page sales：統一商品詳情與商品介紹的內容左緣，避免不同裝置/容器寬度下看起來沒切齊。 */
.x-pg-row-sales-product-detail,
.x-pg-sales-product-intro-row,
.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-row-sales-product-detail,
.x-pg-section-outer[data-preview-section^="salesProductIntroBlock_"] .x-pg-sales-product-intro-row {
	--x-pg-sales-content-align-inset: 1rem;
}

@media screen and (min-width: 1024.01px) {
	.x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_first,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_desc,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box > .col-xl-6.px-xl-5,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_first,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_desc,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-row-sales-product-detail .x-pg-sales-product-box > .col-xl-6.px-xl-5,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_first,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_desc,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box > .col-xl-6.px-xl-5 {
		padding-left: var(--x-pg-sales-content-align-inset) !important;
		box-sizing: border-box;
	}

	.x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_first,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_first.px-xl-5,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_first,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_first.px-xl-5,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_first,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_first.px-xl-5 {
		padding-left: var(--x-pg-sales-content-align-inset) !important;
		padding-right: 0 !important;
	}

	.x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_desc,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_desc.px-xl-5,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_desc,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_desc.px-xl-5,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_desc,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_desc.px-xl-5 {
		padding-right: var(--x-pg-sales-content-align-inset) !important;
	}
}

.x-pg-sales-product-intro,
.x-pg-sales-product-intro-row > .xt_area,
.x-pg-section-outer[data-preview-section^="salesProductIntroBlock_"] .x-pg-sales-product-intro,
.x-pg-section-outer[data-preview-section^="salesProductIntroBlock_"] .x-pg-sales-product-intro-row > .xt_area {
	padding-right: var(--x-pg-sales-content-align-inset) !important;
	padding-left: var(--x-pg-sales-content-align-inset) !important;
}

@media screen and (max-width: 1024px) {
	.x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_first,
	.x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_desc,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_first,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_desc,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_first,
	.x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-x-container:is(.x-pg-container-medium, .x-pg-container-full) .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_desc {
		padding-right: 0 !important;
		padding-left: 0 !important;
	}
}

.x-pg-preview-frame.tablet .x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_first,
.x-pg-preview-frame.tablet .x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_desc,
.x-pg-preview-frame.size-tablet .x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_first,
.x-pg-preview-frame.size-tablet .x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_desc,
.x-pg-preview-frame.mobile .x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_first,
.x-pg-preview-frame.mobile .x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_desc,
.x-pg-preview-frame.size-mobile .x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_first,
.x-pg-preview-frame.size-mobile .x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"] .x-pg-row-sales-product-detail .x-pg-sales-product-box > .prd_desc {
	padding-right: 0 !important;
	padding-left: 0 !important;
}

/* One page sales：平板活動簡介左右 padding 歸零，和商品區左緣對齊。 */
@media screen and (min-width: 768px) and (max-width: 1024px) {
	body:has(.x-pg-row-sales-product-detail) .x-pg-section-outer[data-preview-section^="eventIntroBlock_"] .x-pg-event-intro-content,
	#bioPreviewContent:has(.x-pg-row-sales-product-detail) .x-pg-section-outer[data-preview-section^="eventIntroBlock_"] .x-pg-event-intro-content,
	.x-pg-page-scroll:has(.x-pg-row-sales-product-detail) .x-pg-section-outer[data-preview-section^="eventIntroBlock_"] .x-pg-event-intro-content,
	.x-pg-section-outer[data-preview-section^="eventIntroBlock_"]:has(~ .x-pg-section-outer[data-preview-section^="salesProductDetailBlock_"]) .x-pg-event-intro-content {
		padding-right: 0 !important;
		padding-left: 0 !important;
	}
}

.x-pg-preview-frame.tablet:has(.x-pg-row-sales-product-detail) .x-pg-section-outer[data-preview-section^="eventIntroBlock_"] .x-pg-event-intro-content,
.x-pg-preview-frame.size-tablet:has(.x-pg-row-sales-product-detail) .x-pg-section-outer[data-preview-section^="eventIntroBlock_"] .x-pg-event-intro-content {
	padding-right: 0 !important;
	padding-left: 0 !important;
}

/* 商品速覽：縮圖軌道按鈕保留完整點擊範圍，但視覺灰底縮小 */
#products-info .thumb-slider .slick-arrow,
#products-info .slider-nav .slick-arrow {
	position: absolute;
	isolation: isolate;
	background-color: transparent !important;
}

#products-info .thumb-slider .slick-arrow::before,
#products-info .slider-nav .slick-arrow::before {
	content: "" !important;
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
	z-index: 0 !important;
	display: block !important;
	width: min(54px, 76%) !important;
	height: 14px !important;
	border-radius: 4px !important;
	background-color: rgba(231, 231, 231, .92) !important;
	transform: translate(-50%, -50%) !important;
}

#products-info .thumb-slider .slick-arrow i,
#products-info .slider-nav .slick-arrow i,
#products-info .thumb-slider .slick-arrow::after,
#products-info .slider-nav .slick-arrow::after {
	position: relative;
	z-index: 1;
}

@media screen and (min-width: 768px) and (max-width: 1024px) {
	#products-info .thumb-slider .slick-arrow::before,
	#products-info .slider-nav .slick-arrow::before {
		width: 72px !important;
		height: 18px !important;
	}
}

/* 商品速覽：抽屜開啟時鎖住背景捲動，避免雙卷軸 */
body:has(.offcanvas.show),
html:has(.offcanvas.show) {
	overflow: hidden !important;
}

.x-pg-img-url-input-wrap {
	display: block;
	width: 100%;
}
.x-pg-img-url-preview {
	max-width: 120px;
	max-height: 120px;
	border-radius: 0.5rem;
	display: block;
	height: auto;
	border: 1px solid rgba(15, 23, 42, 0.08);
}

/* 圖片區塊：替代文字 trigger 與 popover */
.x-pg-alt-trigger {
	display: inline-flex;
	align-items: center;
	max-width: 100%;
	padding: 0.2rem 0.65rem;
	border: 1px dashed rgba(15, 23, 42, 0.2);
	border-radius: 999px;
	background: rgba(15, 23, 42, 0.02);
	color: var(--bs-secondary, #6c757d);
	font-size: 0.82rem;
	line-height: 1.3;
	transition: border-color 0.15s ease, color 0.15s ease, background-color 0.15s ease;
}
.x-pg-alt-trigger:hover,
.x-pg-alt-trigger:focus {
	border-color: var(--bs-primary, #0d6efd);
	color: var(--bs-primary, #0d6efd);
	background: rgba(13, 110, 253, 0.06);
}
.x-pg-alt-trigger.has-value {
	border-style: solid;
	border-color: rgba(13, 110, 253, 0.35);
	background: rgba(13, 110, 253, 0.06);
	color: var(--bs-body-color, #212529);
}
.x-pg-alt-trigger .x-pg-alt-label {
	white-space: nowrap;
}
.x-pg-alt-trigger .x-pg-alt-divider {
	color: var(--bs-secondary, #6c757d);
	margin: 0 0.1rem;
}
.x-pg-alt-preview {
	max-width: 180px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	display: inline-block;
	vertical-align: bottom;
	color: var(--bs-body-color, #212529);
	font-weight: 500;
}
.x-pg-alt-popover {
	max-width: 320px;
}
.x-pg-alt-popover textarea {
	resize: vertical;
	min-height: 56px;
}

/* === 規則 E：JS 偵測溢出時分四階切換 ===
   baseline（三欄並排，padding 10px）由前面「最終覆蓋」段（行 10099 區段）維持不動。
   1 階溢出 → prd_price--compact：先壓 padding/gap，盡量保留三欄並排（6 位數金額臨界區間用）。
   2 階仍溢出 → prd_price--stack-rows：上「原 ｜ 特」並排，下「砍價後」跨整寬。
   3 階仍溢出 → prd_price--stack-all：三列垂直、無 border。 */

/* E-pre：compact 模式 — 縮 padding 與內部 gap，金額大字略縮、pill 字級略縮，盡量留在三欄 */
.basic_sales .prd_price.prd_price--compact > div,
#products-info .basic_sales .prd_price.prd_price--compact > div,
.shopping .basic_sales .prd_price.prd_price--compact > div,
.x-pg-sales-product-box .basic_sales .prd_price.prd_price--compact > div {
	padding: 0 4px !important;
}

.basic_sales .prd_price.prd_price--compact > div:first-child,
#products-info .basic_sales .prd_price.prd_price--compact > div:first-child,
.shopping .basic_sales .prd_price.prd_price--compact > div:first-child,
.x-pg-sales-product-box .basic_sales .prd_price.prd_price--compact > div:first-child {
	padding-left: 0 !important;
}

.basic_sales .prd_price.prd_price--compact > div:last-child,
.basic_sales .prd_price.prd_price--compact #discounted-price-div,
.basic_sales .prd_price.prd_price--compact .discounted-price-div,
#products-info .basic_sales .prd_price.prd_price--compact > div:last-child,
#products-info .basic_sales .prd_price.prd_price--compact #discounted-price-div,
#products-info .basic_sales .prd_price.prd_price--compact .discounted-price-div,
.shopping .basic_sales .prd_price.prd_price--compact > div:last-child,
.shopping .basic_sales .prd_price.prd_price--compact #discounted-price-div,
.shopping .basic_sales .prd_price.prd_price--compact .discounted-price-div,
.x-pg-sales-product-box .basic_sales .prd_price.prd_price--compact > div:last-child,
.x-pg-sales-product-box .basic_sales .prd_price.prd_price--compact #discounted-price-div,
.x-pg-sales-product-box .basic_sales .prd_price.prd_price--compact .discounted-price-div {
	padding-left: 6px !important;
}

/* compact 下砍價後金額字級略縮 1.875rem → 1.5rem，保留醒目又少占約 20% 寬度 */
.x-pg-sales-product-box .prd_desc .prd_price.prd_price--compact > div:last-child p.fw-bolder .pricespan.discounted-price-display,
.x-pg-sales-product-box .prd_desc .prd_price.prd_price--compact #discounted-price-div p.fw-bolder .pricespan.discounted-price-display,
.x-pg-sales-product-box .prd_desc .prd_price.prd_price--compact .discounted-price-div p.fw-bolder .pricespan.discounted-price-display {
	font-size: 1.5rem !important;
}

/* compact 下砍價後 p 的內部 gap 縮 */
.x-pg-sales-product-box .prd_desc .prd_price.prd_price--compact > div:last-child p.fw-bolder,
.x-pg-sales-product-box .prd_desc .prd_price.prd_price--compact #discounted-price-div p.fw-bolder,
.x-pg-sales-product-box .prd_desc .prd_price.prd_price--compact .discounted-price-div p.fw-bolder {
	gap: 3px !important;
	column-gap: 3px !important;
}

/* E-pre-1：有 dashed 分隔線的價格欄，保留文字到線之間的安全距離 */
.basic_sales .prd_price:not(.prd_price--stack-all) > *:not(:last-child),
#products-info .basic_sales .prd_price:not(.prd_price--stack-all) > *:not(:last-child),
#product-modal .basic_sales .prd_price:not(.prd_price--stack-all) > *:not(:last-child),
#product-modal .sale-info .basic_sales .prd_price:not(.prd_price--stack-all) > *:not(:last-child),
.shopping .basic_sales .prd_price:not(.prd_price--stack-all) > *:not(:last-child),
.x-pg-sales-product-box .basic_sales .prd_price:not(.prd_price--stack-all) > *:not(:last-child) {
	border-right: 1px dashed #f3c0b3 !important;
	padding-right: 16px !important;
}

.basic_sales .prd_price:not(.prd_price--stack-all) > *:not(:first-child),
#products-info .basic_sales .prd_price:not(.prd_price--stack-all) > *:not(:first-child),
#product-modal .basic_sales .prd_price:not(.prd_price--stack-all) > *:not(:first-child),
#product-modal .sale-info .basic_sales .prd_price:not(.prd_price--stack-all) > *:not(:first-child),
.shopping .basic_sales .prd_price:not(.prd_price--stack-all) > *:not(:first-child),
.x-pg-sales-product-box .basic_sales .prd_price:not(.prd_price--stack-all) > *:not(:first-child) {
	border-left: 0 !important;
}

.bg-light-danger .prd_price:not(.prd_price--stack-all) > *:not(:last-child),
.sale-info .prd_price:not(.prd_price--stack-all) > *:not(:last-child),
.prd_price.prd_price--align-top:not(.prd_price--stack-all) > *:not(:last-child),
.x-pg-sales-product-box .prd_desc .prd_price:not(.prd_price--stack-all) > *:not(:last-child) {
	border-right: 1px dashed #f3c0b3 !important;
	padding-right: 16px !important;
	padding-inline-end: 16px !important;
}

.bg-light-danger .prd_price:not(.prd_price--stack-all) > *:not(:first-child),
.sale-info .prd_price:not(.prd_price--stack-all) > *:not(:first-child),
.prd_price.prd_price--align-top:not(.prd_price--stack-all) > *:not(:first-child),
.x-pg-sales-product-box .prd_desc .prd_price:not(.prd_price--stack-all) > *:not(:first-child) {
	border-left: 0 !important;
}

/* E-0：stack 狀態下，原價/特價的「標題 + 金額」改為同一行 */
.basic_sales .prd_price.prd_price--stack-rows > div:has(.original-price-display),
.basic_sales .prd_price.prd_price--stack-rows > div:has(.special-price-display),
.basic_sales .prd_price.prd_price--stack-all > div:has(.original-price-display),
.basic_sales .prd_price.prd_price--stack-all > div:has(.special-price-display) {
	flex-direction: row !important;
	align-items: baseline !important;
	gap: 6px !important;
	white-space: nowrap;
}

.basic_sales .prd_price.prd_price--stack-rows > div:has(.original-price-display) p,
.basic_sales .prd_price.prd_price--stack-rows > div:has(.special-price-display) p,
.basic_sales .prd_price.prd_price--stack-all > div:has(.original-price-display) p,
.basic_sales .prd_price.prd_price--stack-all > div:has(.special-price-display) p {
	margin: 0 !important;
	display: inline-block !important;
}

/* E-1：stack-rows — 兩列佈局 */
.basic_sales .prd_price.prd_price--stack-rows,
#products-info .basic_sales .prd_price.prd_price--stack-rows,
.shopping .basic_sales .prd_price.prd_price--stack-rows,
.x-pg-sales-product-box .basic_sales .prd_price.prd_price--stack-rows {
	display: grid !important;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: auto auto;
	column-gap: 14px !important;
	row-gap: 8px !important;
	align-items: start !important;
	overflow: visible !important;
}

.basic_sales .prd_price.prd_price--stack-rows > div:has(.original-price-display),
#products-info .basic_sales .prd_price.prd_price--stack-rows > div:has(.original-price-display),
.shopping .basic_sales .prd_price.prd_price--stack-rows > div:has(.original-price-display),
.x-pg-sales-product-box .basic_sales .prd_price.prd_price--stack-rows > div:has(.original-price-display) {
	grid-column: 1;
	grid-row: 1;
	border-right: 1px dashed #f3c0b3 !important;
	border-left: 0 !important;
	padding-left: 0 !important;
	padding-right: 14px !important;
}

.basic_sales .prd_price.prd_price--stack-rows > div:has(.special-price-display),
#products-info .basic_sales .prd_price.prd_price--stack-rows > div:has(.special-price-display),
.shopping .basic_sales .prd_price.prd_price--stack-rows > div:has(.special-price-display),
.x-pg-sales-product-box .basic_sales .prd_price.prd_price--stack-rows > div:has(.special-price-display) {
	grid-column: 2;
	grid-row: 1;
	border-right: 0 !important;
	border-left: 0 !important;
	padding-left: 0 !important;
}

.basic_sales .prd_price.prd_price--stack-rows > div:has(.discounted-price-display),
#products-info .basic_sales .prd_price.prd_price--stack-rows > div:has(.discounted-price-display),
.shopping .basic_sales .prd_price.prd_price--stack-rows > div:has(.discounted-price-display),
.x-pg-sales-product-box .basic_sales .prd_price.prd_price--stack-rows > div:has(.discounted-price-display) {
	grid-column: 1 / -1;
	grid-row: 2;
	border-left: 0 !important;
	padding-left: 0 !important;
}

/* visible=2（只有原或只有特 + 砍價後）：上方那項跨整寬、無分隔線 */
.basic_sales .prd_price.prd_price--stack-rows:not(:has(.special-price-display:not(:empty))) > div:has(.original-price-display),
.basic_sales .prd_price.prd_price--stack-rows:not(:has(.original-price-display:not(:empty))) > div:has(.special-price-display) {
	grid-column: 1 / -1 !important;
	border-right: 0 !important;
	padding-right: 0 !important;
}

/* E-2：stack-all — 三列垂直疊，無 border */
.basic_sales .prd_price.prd_price--stack-all,
#products-info .basic_sales .prd_price.prd_price--stack-all,
.shopping .basic_sales .prd_price.prd_price--stack-all,
.x-pg-sales-product-box .basic_sales .prd_price.prd_price--stack-all {
	display: flex !important;
	flex-direction: column !important;
	flex-wrap: nowrap !important;
	align-items: stretch !important;
	row-gap: 4px;
	overflow: visible !important;
}

.basic_sales .prd_price.prd_price--stack-all > div,
#products-info .basic_sales .prd_price.prd_price--stack-all > div,
.shopping .basic_sales .prd_price.prd_price--stack-all > div,
.x-pg-sales-product-box .basic_sales .prd_price.prd_price--stack-all > div {
	border: 0 !important;
	padding: 2px 0 !important;
	width: 100%;
	grid-column: auto !important;
	grid-row: auto !important;
}

/* === 數量驗證錯誤泡泡：把 FormValidation 對 qty 欄位產出的 invalid-feedback 變成箭頭泡泡指向 .count ===
   依靠 :has([data-field="qty"]) 精準鎖定，只有 fv 真正插入錯誤訊息時才浮現；
   訊息結構不動（保留 screen-reader 朗讀），只改視覺呈現。 */
.product_count .count {
	position: relative;
}

/* 錯誤狀態下解除 .count 的 overflow:hidden，避免泡泡被剪掉（既有 5126 行為了圓角設了 hidden） */
.product_count .count:has(.fv-plugins-message-container > [data-field="qty"]) {
	overflow: visible !important;
}

.product_count .count .fv-plugins-message-container:has([data-field="qty"]),
#product-form .product_count .count .fv-plugins-message-container:has([data-field="qty"]),
.x-pg-sales-product-box .product_count .count .fv-plugins-message-container:has([data-field="qty"]) {
	position: absolute !important;
	bottom: calc(100% + 10px);
	left: 50%;
	transform: translateX(-50%);
	display: block !important;
	width: max-content;
	max-width: min(220px, 80vw);
	background: #fff;
	border: 1px solid #ee4d2d;
	color: #c84327;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.4;
	padding: 6px 12px;
	border-radius: 8px;
	box-shadow: 0 4px 14px rgba(238, 77, 45, 0.22);
	white-space: nowrap;
	z-index: 9999;
	pointer-events: none;
	margin: 0 !important;
	animation: xpgQtyBubbleIn 0.18s ease-out;
}

/* 箭頭外緣（橘紅 border） */
.product_count .count .fv-plugins-message-container:has([data-field="qty"])::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	width: 0;
	height: 0;
	margin-left: -7px;
	border-left: 7px solid transparent;
	border-right: 7px solid transparent;
	border-top: 7px solid #ee4d2d;
}

/* 箭頭內緣（白底蓋住 border 中段） */
.product_count .count .fv-plugins-message-container:has([data-field="qty"])::before {
	content: "";
	position: absolute;
	top: calc(100% - 1px);
	left: 50%;
	width: 0;
	height: 0;
	margin-left: -6px;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid #fff;
	z-index: 1;
}

/* 內層每條訊息：移除預設 invalid-feedback 樣式（紅字、padding 等），純文字 */
.product_count .count .fv-plugins-message-container:has([data-field="qty"]) > div {
	color: inherit !important;
	background: transparent !important;
	padding: 0 !important;
	margin: 0 !important;
	border: 0 !important;
	font-size: inherit !important;
	line-height: inherit !important;
	width: auto !important;
}

@keyframes xpgQtyBubbleIn {
	from {
		opacity: 0;
		transform: translateX(-50%) translateY(4px);
	}
	to {
		opacity: 1;
		transform: translateX(-50%) translateY(0);
	}
}

/* sales-product-cat-group: vote type badge uses a neutral dotted icon instead of numeric text. */
.sales-product-cat-group .vote_type,
.sales-product-cat-group h3.vote_type {
	color: var(--x-pg-sales-category-title-color, inherit);
	padding-bottom: 10px;
	border-bottom: 1px dashed var(--x-pg-sales-category-icon-color, rgba(229, 119, 56, .35));
}

.sales-product-cat-group .vote_type .badge,
.sales-product-cat-group h3.vote_type .badge {
	display: inline-grid !important;
	flex: 0 0 28px;
	width: 28px !important;
	min-width: 28px !important;
	height: 28px !important;
	padding: 0 !important;
	place-items: center;
	overflow: hidden;
	border: 1px solid color-mix(in srgb, var(--x-pg-sales-category-icon-color, #e57738) 24%, #ffffff) !important;
	border-radius: 8px !important;
	background: color-mix(in srgb, var(--x-pg-sales-category-icon-color, #e57738) 18%, #ffffff) !important;
	box-shadow: 0 4px 10px color-mix(in srgb, var(--x-pg-sales-category-icon-color, #e57738) 14%, transparent);
	color: transparent !important;
	font-size: 0 !important;
	line-height: 1 !important;
	text-indent: -999px;
	transform: translateY(-3px);
	white-space: nowrap;
}

.sales-product-cat-group .vote_type .badge::before,
.sales-product-cat-group h3.vote_type .badge::before {
	content: "";
	display: block;
	width: 16px;
	height: 16px;
	background: var(--x-pg-sales-category-icon-color, #e57738);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cg fill='black'%3E%3Ccircle cx='3' cy='3' r='1.7'/%3E%3Ccircle cx='8' cy='3' r='1.7'/%3E%3Ccircle cx='13' cy='3' r='1.7'/%3E%3Ccircle cx='3' cy='8' r='1.7'/%3E%3Ccircle cx='8' cy='8' r='1.7'/%3E%3Ccircle cx='13' cy='8' r='1.7'/%3E%3Ccircle cx='3' cy='13' r='1.7'/%3E%3Ccircle cx='8' cy='13' r='1.7'/%3E%3Ccircle cx='13' cy='13' r='1.7'/%3E%3C/g%3E%3C/svg%3E") center / 16px 16px no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cg fill='black'%3E%3Ccircle cx='3' cy='3' r='1.7'/%3E%3Ccircle cx='8' cy='3' r='1.7'/%3E%3Ccircle cx='13' cy='3' r='1.7'/%3E%3Ccircle cx='3' cy='8' r='1.7'/%3E%3Ccircle cx='8' cy='8' r='1.7'/%3E%3Ccircle cx='13' cy='8' r='1.7'/%3E%3Ccircle cx='3' cy='13' r='1.7'/%3E%3Ccircle cx='8' cy='13' r='1.7'/%3E%3Ccircle cx='13' cy='13' r='1.7'/%3E%3C/g%3E%3C/svg%3E") center / 16px 16px no-repeat;
	transform: translateY(3px);
}

/* Product quick view: one real image should not reserve a thumbnail grid column. */
#products-info .slider_box:has(.main-slider .slick-slide[data-index="0"]:not(.slick-cloned)):not(:has(.main-slider .slick-slide[data-index="1"]:not(.slick-cloned))),
#products-info .slider_box:has(.slider-for .slick-slide[data-index="0"]:not(.slick-cloned)):not(:has(.slider-for .slick-slide[data-index="1"]:not(.slick-cloned))) {
	display: block !important;
	grid-template-columns: none !important;
	gap: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
	--x-pg-quick-slider-thumb-width: 0px !important;
	--x-pg-quick-slider-gap: 0px !important;
}

#products-info .slider_box:has(.main-slider .slick-slide[data-index="0"]:not(.slick-cloned)):not(:has(.main-slider .slick-slide[data-index="1"]:not(.slick-cloned))) :is(.thumb-slider, .slider-nav),
#products-info .slider_box:has(.slider-for .slick-slide[data-index="0"]:not(.slick-cloned)):not(:has(.slider-for .slick-slide[data-index="1"]:not(.slick-cloned))) :is(.thumb-slider, .slider-nav) {
	display: none !important;
}

#products-info .slider_box:has(.main-slider .slick-slide[data-index="0"]:not(.slick-cloned)):not(:has(.main-slider .slick-slide[data-index="1"]:not(.slick-cloned))) .main-slider,
#products-info .slider_box:has(.slider-for .slick-slide[data-index="0"]:not(.slick-cloned)):not(:has(.slider-for .slick-slide[data-index="1"]:not(.slick-cloned))) .slider-for,
#products-info .slider_box:has(.main-slider .slick-slide[data-index="0"]:not(.slick-cloned)):not(:has(.main-slider .slick-slide[data-index="1"]:not(.slick-cloned))) .main-slider :is(.slick-slider, .slick-list, .slick-track, .slick-slide, .slide-item, .slide-content),
#products-info .slider_box:has(.slider-for .slick-slide[data-index="0"]:not(.slick-cloned)):not(:has(.slider-for .slick-slide[data-index="1"]:not(.slick-cloned))) .slider-for :is(.slick-slider, .slick-list, .slick-track, .slick-slide, .slide-item, .slide-content) {
	width: 100% !important;
	max-width: 100% !important;
}

#products-info .slider_box:has(.main-slider .slick-slide[data-index="0"]:not(.slick-cloned)):not(:has(.main-slider .slick-slide[data-index="1"]:not(.slick-cloned))) .main-slider .slick-track,
#products-info .slider_box:has(.slider-for .slick-slide[data-index="0"]:not(.slick-cloned)):not(:has(.slider-for .slick-slide[data-index="1"]:not(.slick-cloned))) .slider-for .slick-track {
	transform: translate3d(0, 0, 0) !important;
}

/* Product count discount hint. */
.product_count > .bg-light-primary:has(.badge.badge-outline.badge-outline-primary) {
	display: flex !important;
	flex: 1 1 100% !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	gap: 4px 6px !important;
	width: 100% !important;
	min-width: 0 !important;
	padding: 10px 12px !important;
	border: 1px solid rgba(229, 119, 56, .2) !important;
	border-radius: 8px !important;
	background: #fff8f3 !important;
	color: #3f4254 !important;
	line-height: 1.45 !important;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .65) !important;
}

.product_count > .bg-light-primary:has(.badge.badge-outline.badge-outline-primary) > span {
	display: inline-flex !important;
	align-items: center !important;
	min-width: 0 !important;
	line-height: 1.35 !important;
	white-space: nowrap !important;
}

.product_count > .bg-light-primary:has(.badge.badge-outline.badge-outline-primary) .badge.badge-outline.badge-outline-primary {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-height: 22px !important;
	padding: 3px 8px !important;
	border: 1px solid #e57738 !important;
	border-radius: 999px !important;
	background: #fff !important;
	color: #e57738 !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	letter-spacing: 0 !important;
	white-space: nowrap !important;
	opacity: 1 !important;
	visibility: visible !important;
}

.product_count > .bg-light-primary:has(.badge.badge-outline.badge-outline-primary) .fw-bolder {
	color: #1f2937 !important;
	font-weight: 800 !important;
}

@media (max-width: 575.98px) {
	.product_count > .bg-light-primary:has(.badge.badge-outline.badge-outline-primary) {
		padding: 9px 10px !important;
		gap: 3px 5px !important;
	}
}

/* ===== 票選結果區塊（votetag_box）美化 ===== */
/* ── 組別名單切換鈕（{{漏斗.組別名單}}，得票結果頁）：膠囊式 tab，主題色作用中態 ── */
.x-pg-voting-cat-list {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 10px !important;
}

.x-pg-voting-cat-list .cat-btn,
.x-pg-voting-cat-list .cat-btn.typetag {
	display: inline-flex !important;
	align-items: center !important;
	padding: 8px 18px 8px 9px !important;
	border: 1.5px solid #e2e8f0 !important;
	border-radius: 999px !important;
	background: #ffffff !important;
	color: #475569 !important;
	font-size: 0.95rem !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	text-decoration: none !important;
	cursor: pointer !important;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .04) !important;
	transition: color .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease !important;
}

.x-pg-voting-cat-list .cat-btn:hover,
.x-pg-voting-cat-list .cat-btn:focus {
	border-color: var(--bs-primary, #2051a1) !important;
	color: var(--bs-primary, #2051a1) !important;
	transform: translateY(-1px) !important;
}

/* 作用中組別：主題色漸層膠囊 */
.x-pg-voting-cat-list .cat-btn.tag_active {
	background: linear-gradient(135deg, var(--bs-primary, #2051a1), #3b74d6) !important;
	border-color: transparent !important;
	color: #ffffff !important;
	box-shadow: 0 10px 22px -10px rgba(var(--bs-primary-rgb, 32, 81, 161), .75) !important;
}

.x-pg-voting-cat-list .cat-btn.tag_active:hover,
.x-pg-voting-cat-list .cat-btn.tag_active:focus {
	color: #ffffff !important;
}

/* 左側字母圓徽 */
.x-pg-voting-cat-list .cat-btn .badge-circle {
	display: inline-grid !important;
	place-items: center !important;
	flex: 0 0 auto !important;
	width: 26px !important;
	height: 26px !important;
	padding: 0 !important;
	border-radius: 999px !important;
	font-size: 0.82rem !important;
	font-weight: 800 !important;
	background: rgba(var(--bs-primary-rgb, 32, 81, 161), .12) !important;
	color: var(--bs-primary, #2051a1) !important;
}

.x-pg-voting-cat-list .cat-btn.tag_active .badge-circle {
	background: #ffffff !important;
	color: var(--bs-primary, #2051a1) !important;
}

/* 全部 scope 在 .votetag_box 內，避免影響其他投票頁共用的 .rank_no/.subtitle 等 class */

.votetag_box {
	display: flex !important;
	flex-direction: column !important;
	gap: 1.75rem !important;
	padding: 0 !important;
	background: transparent !important;
	border-radius: 20px !important;
	box-shadow: none !important;
}

/* 分類標題：漸層圓形徽章 + 隊名 */
.votetag_box .badge-circle {
	width: 40px !important;
	height: 40px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	border-radius: 50% !important;
	font-size: 1.05rem !important;
	font-weight: 800 !important;
	background: linear-gradient(135deg, var(--bs-primary, #2051a1), #3b74d6) !important;
	color: #fff !important;
	box-shadow: 0 6px 16px -6px rgba(var(--bs-primary-rgb, 32, 81, 161), .7) !important;
	flex: 0 0 auto !important;
}

.votetag_box #head-cat-name {
	margin: 0 !important;
	font-size: 1.45rem !important;
	font-weight: 800 !important;
	letter-spacing: .01em !important;
	color: var(--bs-primary, #2051a1) !important;
}

/* 區塊小標籤（● 票選實況 / ● 票選排行）：淡底膠囊 */
.votetag_box .rankbox .subtitle,
.votetag_box .vote_chart .subtitle {
	display: inline-flex !important;
	align-items: center !important;
	padding: .4rem .9rem !important;
	border-radius: 999px !important;
	font-size: .82rem !important;
	font-weight: 700 !important;
	letter-spacing: .04em !important;
	color: var(--bs-primary, #2051a1) !important;
	background: rgba(var(--bs-primary-rgb, 32, 81, 161), .1) !important;
	margin-bottom: 1.1rem !important;
}

/* 卡片區塊外框 */
.votetag_box .rankbox,
.votetag_box .vote_chart {
	background: transparent !important;
	border-radius: 16px !important;
	padding: 0 !important;
}

.votetag_box .ranklive {
	margin: 0 !important;
	padding: 0 0 .25rem !important;
	border: 0 !important;
}

/* 排名卡 */
.votetag_box .rank_order {
	display: flex !important;
	flex-wrap: wrap !important;
	justify-content: center !important;
	gap: 1.25rem !important;
}

.votetag_box .rank {
	flex: 1 1 280px !important;
	width: auto !important;
	max-width: 360px !important;
	padding: 0 !important;
}

.votetag_box .rank > div {
	position: relative !important;
	border: 1px solid #eef1f6 !important;
	border-radius: 20px !important;
	overflow: hidden !important;
	background: linear-gradient(180deg, #ffffff 0%, #fbfcfe 100%) !important;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 16px 40px -24px rgba(15, 23, 42, .45) !important;
	transition: transform .28s cubic-bezier(.2, .7, .2, 1), box-shadow .28s ease !important;
}

.votetag_box .rank > div:hover {
	transform: translateY(-6px) !important;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .05), 0 30px 56px -26px rgba(15, 23, 42, .5) !important;
}

/* 第一名：金邊 + 金色頂光 + 右上角獎盃 */
.votetag_box .rank > div.no1 {
	border: 1.5px solid #f3c34b !important;
	box-shadow: 0 1px 2px rgba(245, 179, 1, .15), 0 18px 42px -20px rgba(245, 179, 1, .6) !important;
}

.votetag_box .rank > div.no1::before {
	content: "" !important;
	position: absolute !important;
	inset: 0 0 auto 0 !important;
	height: 4px !important;
	background: linear-gradient(90deg, #f5b301, #ffd866, #f5b301) !important;
	z-index: 4 !important;
}

.votetag_box .rank > div.no1::after {
	content: "\F588"; /* bi-trophy */
	font-family: "bootstrap-icons" !important;
	position: absolute !important;
	top: .65rem;
	right: .7rem;
	width: 32px;
	height: 32px;
	display: flex !important;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: linear-gradient(135deg, #f5b301, #ffcf45) !important;
	color: #fff;
	font-size: .9rem;
	box-shadow: 0 6px 16px -4px rgba(245, 179, 1, .85);
	z-index: 4;
}

/* 名次徽章：浮在圖片左上角 */
.votetag_box .rank_no {
	position: absolute !important;
	top: .7rem;
	left: .7rem;
	z-index: 2;
	display: inline-flex !important;
	align-items: center !important;
	gap: .15rem !important;
	padding: .25rem .7rem !important;
	border-radius: 999px !important;
	background: rgba(var(--bs-primary-rgb, 32, 81, 161), .92) !important;
	color: #fff !important;
	font-size: .72rem !important;
	font-weight: 600 !important;
	box-shadow: 0 4px 12px -4px rgba(15, 23, 42, .5) !important;
}

.votetag_box .rank_no.no1 {
	background: linear-gradient(135deg, #f5b301, #ffcf45) !important;
	color: #5b4300 !important;
}

.votetag_box .rank_no span {
	font-size: .78rem !important;
	font-weight: 800 !important;
}

/* 圖片 */
.votetag_box .rank .pic {
	position: relative !important;
	height: 0 !important;
	padding-bottom: 62% !important;
	overflow: hidden !important;
	background: linear-gradient(135deg, #eef2f8, #e2e8f3) !important;
	box-shadow: inset 0 0 0 1px rgba(15, 23, 42, .04) !important;
}

.votetag_box .rank .pic img {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	transition: transform .4s ease !important;
}

/* 圖片底部柔光，讓裁切邊緣更收斂、與下方文字過渡自然 */
.votetag_box .rank .pic::after {
	content: "" !important;
	position: absolute !important;
	inset: auto 0 0 0 !important;
	height: 38% !important;
	background: linear-gradient(180deg, rgba(15, 23, 42, 0) 0%, rgba(15, 23, 42, .12) 100%) !important;
	pointer-events: none !important;
	z-index: 1 !important;
}

.votetag_box .rank > div:hover .pic img {
	transform: scale(1.06) !important;
}

/* 文字 */
.votetag_box .rank .text {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	gap: .55rem !important;
	padding: 1.3rem 1.1rem 1.35rem !important;
	background: transparent !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	width: 100% !important;
	text-align: center !important;
}

.votetag_box .rank .text div.num {
	position: relative !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	font-size: .78rem !important;
	color: #64748b !important;
	font-weight: 600 !important;
}

.votetag_box .num > div {
	background: rgba(var(--bs-primary-rgb, 32, 81, 161), .08) !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: .1rem !important;
	padding: .25rem .65rem !important;
	border-radius: 999px !important;
}

.votetag_box .num div > span,
.votetag_box .num span {
	font-size: .9rem !important;
	font-weight: 700 !important;
	color: var(--bs-primary, #2051a1) !important;
}

.votetag_box .bullet.bullet-vertical {
	display: inline-block !important;
	width: 3px !important;
	height: .85em !important;
	border-radius: 2px !important;
	background: var(--bs-primary, #2051a1) !important;
	margin-right: .4rem !important;
}

.votetag_box .rank_team_name h4 {
	margin: 0 !important;
	font-size: 1.25rem !important;
	font-weight: 800 !important;
	letter-spacing: .01em !important;
	color: #0f172a !important;
}

/* 圖表區 */
.votetag_box .vote_chart .chart {
	background: linear-gradient(180deg, #fbfcfe, #f4f7fb) !important;
	border: 1px solid #eaeef4 !important;
	border-radius: 16px !important;
	padding: 1.25rem 1rem !important;
}

@media (max-width: 575.98px) {
	.votetag_box {
		padding: 1.25rem !important;
		border-radius: 16px !important;
	}
	.votetag_box .rank {
		flex: 1 1 100% !important;
		max-width: 420px !important;
		margin-inline: auto !important;
	}
}

/* ===== 已選擇按鈕的勾選圖示對比修正 ===== */
/* bi-check-circle-fill 的勾是「鏤空」的，會透出按鈕底色，
   在綠色已選按鈕上勾呈現底色、糊在一起看不清楚。
   用 CSS 覆寫 glyph 為實心粗勾 bi-check-lg(\F633)，白勾配綠底對比清楚。 */
.x-pg-row-form-block.votepage .vote-btn.btn-success .bi-check-circle-fill::before,
.x-pg-row-form-block.votepage #detail-vote-btn.btn-success .bi-check-circle-fill::before,
#desc-modal .vote-btn.btn-success .bi-check-circle-fill::before,
#desc-modal #detail-vote-btn.btn-success .bi-check-circle-fill::before {
	content: "\F633" !important;
	font-weight: 700;
	color: #ffffff;
}