/* WC LINE Notify — 商品頁樣式（參考圖片：圓角標籤 + 綠色外框按鈕） */

.wcln-wrapper {
	--wcln-green: #318fff;
	--wcln-green-dark: #2779df;
	--wcln-border: #A8A8A8;
	--wcln-text: #333;
	--wcln-muted: #bdbdbd;
	margin: 16px 0;
	clear: both;
}

/* 缺貨通知主按鈕：白底、綠框、綠字、圓角 */
.wcln-btn-outline {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 10px 20px;
	width: 100%;
	background: #fff;
	border: 1.5px solid var(--wcln-green);
	letter-spacing: 0.05em;
	color: var(--wcln-green);
	border-radius: 50px;
	font-size: 15px;
	font-weight: bold;
	line-height: 1.4;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.wcln-btn-outline:hover,
.wcln-btn-outline.wcln-active {
	background: var(--wcln-green);
	color: #fff;
}

.wcln-panel {
	margin-top: 14px;
	padding: 18px;
	border: 1px solid #ececec;
	border-radius: 10px;
	background: #fafafa;
}

.wcln-step-title {
	margin: 0 0 14px;
	font-weight: 600;
	font-size: 14px;
	color: var(--wcln-text);
}

/* 標籤群：圓角矩形 pill、淡灰外框，與參考圖一致 */
.wcln-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.wcln-tag {
	display: inline-block;
	padding: 2px 12px;
	background: #fff;
	border: 1px solid var(--wcln-border);
	border-radius: 3px;
	font-size: 15px;
	color: var(--wcln-text);
	cursor: pointer;
	user-select: none;
	transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.wcln-tag:hover {
	border-color: var(--wcln-green);
	color: var(--wcln-green);
}

/* 選取狀態：綠底白字 */
.wcln-tag.wcln-selected {
	background: var(--wcln-green);
	border-color: var(--wcln-green);
	color: #fff;
	box-shadow: 0 1px 3px rgba(32, 164, 74, 0.3);
}

/* 不可點選 / 灰階（保留樣式供未來顯示已售完項目用） */
.wcln-tag.wcln-disabled {
	color: var(--wcln-muted);
	border-color: #ececec;
	background: #f7f7f7;
	cursor: not-allowed;
	pointer-events: none;
}

.wcln-result {
	margin-top: 18px;
	padding-top: 16px;
	border-top: 1px dashed #ddd;
}

.wcln-result-label {
	margin: 0 0 10px;
	font-size: 14px;
	font-weight: 600;
	color: var(--wcln-text);
}

.wcln-copy-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.wcln-id-string {
	display: inline-block;
	padding: 6px 12px;
	background: #fff;
	border: 1px solid var(--wcln-border);
	border-radius: 3px;
	font-family: monospace;
	font-size: 15px;
	color: var(--wcln-text);
	word-break: break-all;
}

/* 複製按鈕沿用外框按鈕，但縮小一級 */
.wcln-copy-row .wcln-btn-outline {
	padding: 9px 16px;
	border-radius: 4px;
	font-size: 14px;
	width: auto;
}

.wcln-hint {
	margin: 14px 0 0;
	font-size: 13px;
	color: #666;
	line-height: 1.7;
}

.wcln-hint a {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--wcln-green);
	font-weight: 600;
	text-decoration: none;
}

.wcln-hint a:hover {
	color: var(--wcln-green-dark);
	text-decoration: underline;
}