/* 移除按鈕預設的 focus outline，讓樣式與 WooCommerce 原始按鈕一致 */
.wc-block-order-confirmation-status__button:focus {
	outline: none;
}

/* 移除自動 focus 時的視覺效果，保持與原始狀態一致 */
.wc-block-order-confirmation-status__button:focus:not(:active):not(:hover) {
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	transform: none;
}

/* 為 4 個按鈕設定不同的背景顏色 */
/* 返回購物車按鈕 - 綠色 */
.wc-block-order-confirmation-status__button--cart {
	background-color: #1fb25a !important;
	border-color: #1fb25a !important;
}

.wc-block-order-confirmation-status__button--cart:hover {
	background-color: #1a9a4a !important;
	border-color: #1a9a4a !important;
}

/* 返回商店按鈕 - 藍色 */
.wc-block-order-confirmation-status__button--shop {
	background-color: #2271b1 !important;
	border-color: #2271b1 !important;
}

.wc-block-order-confirmation-status__button--shop:hover {
	background-color: #135e96 !important;
	border-color: #135e96 !important;
}

/* 再試一次按鈕 - 藍色（主要操作） */
.wc-block-order-confirmation-status__button--try-again {
	background-color: #2271b1 !important;
	border-color: #2271b1 !important;
}

.wc-block-order-confirmation-status__button--try-again:hover {
	background-color: #135e96 !important;
	border-color: #135e96 !important;
}

/* 我的帳號按鈕 - 透明背景（次要操作，已有樣式但確保覆蓋） */
.wc-block-order-confirmation-status__button--my-account {
	background-color: transparent !important;
	color: #2271b1 !important;
	border-color: #2271b1 !important;
}

.wc-block-order-confirmation-status__button--my-account:hover {
	background-color: #2271b1 !important;
	color: #fff !important;
}

/* 響應式設計：小螢幕上按鈕全寬 */
@media (max-width: 782px) {
	.wc-block-order-confirmation-status__actions .wc-block-order-confirmation-status__button {
		display: block;
		width: 100%;
		margin-right: 0;
		text-align: center;
	}
}
