﻿/* 購物車專用樣式 */
.cart-section {
		padding-top: 120px;
		padding-bottom: 60px;
		min-height: calc(100vh - 200px);
}
.cart-steps {
		display: flex;
		justify-content: center;
		align-items: center;
		margin-bottom: 50px;
		position: relative;
}
.cart-step {
		display: flex;
		flex-direction: column;
		align-items: center;
		position: relative;
		flex: 1;
		max-width: 200px;
}
.cart-step-number {
		width: 50px;
		height: 50px;
		border-radius: 50%;
		background: #E5E5E5;
		color: #999;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 1.2rem;
		font-weight: 600;
		margin-bottom: 10px;
		transition: all 0.3s;
		position: relative;
		z-index: 2;
}
.cart-step.active .cart-step-number {
		background: var(--primary-color);
		color: #fff;
}
.cart-step.completed .cart-step-number {
		background: var(--click-color);
		color: #fff;
}
.cart-step-label {
		font-size: 0.9rem;
		color: #999;
		transition: all 0.3s;
}
.cart-step.active .cart-step-label {
		color: var(--primary-color);
		font-weight: 500;
}
.cart-step-line {
		position: absolute;
		top: 25px;
		left: 50%;
		width: 100%;
		height: 2px;
		background: #E5E5E5;
		z-index: 1;
}
.cart-step.completed .cart-step-line {
		background: var(--click-color);
}
.cart-step:last-child .cart-step-line {
		display: none;
}
.cart-content {
		background: #fff;
		border-radius: 15px;
		padding: 30px;
		box-shadow: 0 4px 20px rgba(212, 165, 165, 0.1);
		margin-bottom: 30px;
}
.cart-title {
		font-size: 1.5rem;
		color: #333;
		margin-bottom: 30px;
		font-weight: 500;
		padding-bottom: 20px;
		border-bottom: 2px solid #F5E5E7;
		height: 55px;
}
/* 購物車商品列表 */
.cart-items {
		display: flex;
		flex-direction: column;
		gap: 20px;
		margin-bottom: 30px;
}
.cart-item {
		display: flex;
		gap: 20px;
		padding: 25px;
		background: #FFF5F7;
		border-radius: 12px;
		transition: all 0.3s;
		position: relative;
		width: 100%;
}
.cart-item:hover {
		box-shadow: 0 4px 20px rgba(212, 165, 165, 0.15);
}
.cart-item-checkbox {
		display: flex;
		align-items: center;
		padding-top: 10px;
}
.cart-item-checkbox input[type="checkbox"] {
		width: 20px;
		height: 20px;
		cursor: pointer;
		accent-color: var(--select-color);
}
.cart-item-image {
		width: 120px;
		height: 120px;
		border-radius: 10px;
		overflow: hidden;
		flex-shrink: 0;
}
.cart-item-image img {
		width: 100%;
		height: 100%;
		object-fit: cover;
}
.cart-item-info {
		flex: 1;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
}
.cart-item-info > div:last-child {
		flex: 1;
}
.cart-item-name {
		font-size: 1.1rem;
		color: #333;
		margin-bottom: 8px;
		font-weight: 500;
}
.cart-item-spec {
		font-size: 0.9rem;
		color: #999;
		margin-bottom: 15px;
		flex: auto;
}
.cart-item-price {
		font-size: 1.2rem;
		color: var(--primary-color);
		font-weight: 600;
}
.cart-item-original-price {
		font-size: 0.95rem;
		color: #999;
		text-decoration: line-through;
		margin-left: 10px;
}
.cart-item-controls {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: flex-end;
		gap: 15px;
		padding-top: 2rem;
}
.cart-item-remove {
		background: none;
		border: none;
		color: #999;
		cursor: pointer;
		transition: all 0.3s;
		font-size: 1rem;
		padding: 5px;
		position: absolute;
		top: .5rem;
}
.cart-item-remove:hover {
		color: #F44336;
		transform: scale(1.1);
}
.cart-item-quantity {
		display: flex;
		align-items: center;
		border: 2px solid #E5E5E5;
		border-radius: 8px;
		overflow: hidden;
}
.cart-qty-btn {
		width: 35px;
		height: 35px;
		border: none;
		background: #F9F5F5;
		color: #666;
		cursor: pointer;
		transition: all 0.3s;
		font-size: 1.1rem;
}
.cart-qty-btn:hover {
		background: var(--primary-color);
		color: #fff;
}
.cart-qty-input {
		width: 50px;
		height: 35px;
		border: none;
		text-align: center;
		font-size: 0.95rem;
		font-weight: 500;
}
.cart-item-subtotal {
		font-size: 1.3rem;
		color: var(--primary-color);
		font-weight: 600;
		white-space: nowrap;
}
/* 全選與批次操作 */
.cart-actions-top {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 20px;
		background: #FFF5F7;
		border-radius: 10px;
		margin-bottom: 20px;
}
.cart-select-all {
		display: flex;
		align-items: center;
		gap: 10px;
}
.cart-select-all input[type="checkbox"] {
		width: 20px;
		height: 20px;
		cursor: pointer;
		accent-color: var(--select-color);
}
.cart-select-all label {
		font-size: 0.95rem;
		color: #666;
		cursor: pointer;
		margin: 0;
}
.cart-batch-delete {
		background: transparent;
		border: 1px solid #F44336;
		color: #F44336;
		padding: 8px 20px;
		border-radius: 6px;
		font-size: 1rem;
		cursor: pointer;
		transition: all 0.3s;
}
.cart-batch-delete:hover {
		background: #F44336;
		color: #fff;
}
/* 購物車摘要 */
.cart-summary {
		background: #fff;
		border-radius: 15px;
		padding: 30px;
		box-shadow: 0 4px 20px rgba(212, 165, 165, 0.1);
		position: sticky;
		top: 110px;
}
.cart-summary-title {
		font-size: 1.3rem;
		color: #333;
		margin-bottom: 25px;
		font-weight: 500;
		padding-bottom: 15px;
		border-bottom: 2px solid #F5E5E7;
		height: 55px;
}
.cart-summary-row {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 15px;
		font-size: 0.95rem;
}
.cart-summary-label {
		color: #666;
}
.cart-summary-value {
		color: #333;
		font-weight: 500;
}
.cart-summary-shipping {
		display: flex;
		flex-direction: column;
		gap: 10px;
		margin-bottom: 15px;
}
.shipping-option {
		display: flex;
		align-items: center;
		gap: 10px;
		padding: 12px;
		background: #FFF5F7;
		border-radius: 8px;
		cursor: pointer;
		transition: all 0.3s;
}
.shipping-option:hover {
		background: #FFE8EC;
}
.shipping-option input[type="radio"] {
		width: 18px;
		height: 18px;
		cursor: pointer;
		accent-color: var(--select-color);
}
.shipping-option label {
		flex: 1;
		cursor: pointer;
		margin: 0;
		font-size: 0.9rem;
		color: #666;
}
.shipping-price {
		font-weight: 500;
		color: var(--primary-color);
}
.cart-coupon {
		margin-bottom: 20px;
}
.cart-coupon-input {
		display: flex;
		gap: 10px;
		margin-top: 10px;
}
.cart-coupon-input input {
		flex: 1;
		padding: 10px 15px;
		border: 1px solid #E5E5E5;
		border-radius: 8px;
		font-size: 0.9rem;
}
.cart-coupon-input button {
		background: var(--primary-color);
		color: #fff;
		border: none;
		padding: 10px 20px;
		border-radius: 8px;
		cursor: pointer;
		transition: all 0.3s;
		white-space: nowrap;
}
.cart-coupon-input button:hover {
		background: var(--click-color);
}
.cart-summary-divider {
		height: 1px;
		background: #F5E5E7;
		margin: 20px 0;
}
.cart-summary-total {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 25px;
		padding: 20px;
		background: #FFF5F7;
		border-radius: 10px;
}
.cart-total-label {
		font-size: 1.2rem;
		color: #333;
		font-weight: 500;
}
.cart-total-value {
		font-size: 1.8rem;
		color: var(--primary-color);
		font-weight: 600;
}
.btn-checkout.disabled, .btn-checkout {
		width: 100%;
		background: var(--primary-color);
		color: #fff;
		border: none;
		padding: 15px;
		border-radius: 10px;
		font-size: 1.1rem;
		font-weight: 500;
		cursor: pointer;
		transition: all 0.3s;
		margin-bottom: 15px;
		text-decoration: none;
}
.btn-checkout:hover {
		background: var(--click-color);
		color: #fff;
		transform: translateY(-2px);
		box-shadow: 0 4px 15px rgba(212, 165, 165, 0.3);
}
.btn-checkout.disabled {
		pointer-events: none;
		opacity: .5;
}
.btn-continue-shopping {
		width: 100%;
		background: #fff;
		color: var(--primary-color);
		border: 2px solid var(--primary-color);
		padding: 13px;
		border-radius: 10px;
		font-size: 1rem;
		cursor: pointer;
		transition: all 0.3s;
		text-decoration: none;
}
.btn-continue-shopping:hover {
		background: #FFF5F7;
}
.btn-empty-cart-action, .btn-checkout.disabled, .btn-continue-shopping, .btn-checkout {
		display: inline-flex;
		align-items: center;
		justify-content: center;
}
/* 付款方式選項 */
.payment-content {
		background: #fff;
		border-radius: 15px;
		padding: 40px;
		box-shadow: 0 4px 20px rgba(212, 165, 165, 0.1);
		margin-bottom: 30px;
}
.payment-title {
		font-size: 1.5rem;
		color: #333;
		margin-bottom: 30px;
		font-weight: 500;
		padding-bottom: 20px;
		border-bottom: 2px solid #F5E5E7;
		display: flex;
		align-items: center;
		gap: 10px;
}
.payment-title i {
		color: var(--primary-color);
}
.payment-methods {
		display: flex;
		flex-direction: column;
		gap: 15px;
		margin-bottom: 30px;
}
.payment-method {
		border: 2px solid #F5E5E7;
		border-radius: 10px;
		padding: 20px;
		cursor: pointer;
		transition: all 0.3s;
		display: flex;
		align-items: center;
		gap: 15px;
}
.payment-method:hover {
		border-color: var(--primary-color);
		background: #FFF5F7;
}
.payment-method.selected {
		border-color: var(--primary-color);
		background: #FFF5F7;
}
.payment-method input[type="radio"] {
		width: 20px;
		height: 20px;
		cursor: pointer;
		accent-color: var(--select-color);
		flex-shrink: 0;
}
.payment-method-icon {
		width: 50px;
		height: 50px;
		border-radius: 10px;
		background: #FFF5F7;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 1.5rem;
		color: var(--primary-color);
		flex-shrink: 0;
}
.payment-method-icon.sub {
		background: #E8F9E8 !important;
}
.payment-method-icon.sub i {
		color: #00B900 !important;
}
.payment-method-info {
		flex: 1;
}
.payment-method-name {
		font-weight: 600;
		color: #333;
		margin-bottom: 5px;
		font-size: 1rem;
}
.payment-method-desc {
		font-size: 1rem;
		color: #999;
}
.payment-method-details {
		margin-top: 20px;
		padding-top: 20px;
		border-top: 1px solid #F5E5E7;
		display: none;
}
.payment-method.selected .payment-method-details {
		display: block;
}
/* 信用卡表單 */
.credit-card-form {
		background: #FFF5F7;
		padding: 25px;
		border-radius: 10px;
}
.card-visual {
		background: linear-gradient(135deg, var(--primary-color), var(--click-color));
		border-radius: 15px;
		padding: 25px;
		color: #fff;
		margin-bottom: 25px;
		box-shadow: 0 4px 20px rgba(212, 165, 165, 0.3);
		min-height: 180px;
		position: relative;
		overflow: hidden;
		aspect-ratio: 16 / 9;
}
/*.card-visual::before {
		content: '';
		position: absolute;
		top: -50%;
		right: -20%;
		width: 200px;
		height: 200px;
		background: rgba(255, 255, 255, 0.1);
		border-radius: 50%;
}*/
.card-chip {
		width: 50px;
		height: 40px;
		background: linear-gradient(135deg, #FFD700, #FFA500);
		border-radius: 8px;
		margin-bottom: 20px;
		position: relative;
}
.card-chip::before {
		content: '';
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 30px;
		height: 25px;
		border: 2px solid rgba(0, 0, 0, 0.2);
		border-radius: 4px;
}
.card-number {
		font-size: 1.3rem;
		letter-spacing: 3px;
		margin-bottom: 20px;
		font-family: 'Courier New', monospace;
}
.card-info {
		display: flex;
		justify-content: space-between;
		font-size: 0.9rem;
}
.card-holder, .card-expiry {
		display: flex;
		flex-direction: column;
		gap: 5px;
}
.card-label {
		font-size: 0.7rem;
		opacity: 0.8;
		text-transform: uppercase;
}
/* 累積點數 */
.detail-section .info-block {
		background: #F0F9F0;
		border-radius: 10px;
		padding: 20px;
		text-align: center;
}
.detail-section .info-block i {
		font-size: 2.5rem;
		color: #4CAF50;
		margin-bottom: 15px;
		display: block;
}
.detail-section .info-block .point {
		font-size: 1.8rem;
		color: #4CAF50;
		font-weight: 700;
		margin-bottom: 8px;
}
.detail-section .info-block .note {
		color: #666;
		font-size: 1rem;
}
/* ATM 轉帳資訊 */
.atm-info {
		background: #FFF5F7;
		padding: 25px;
		border-radius: 10px;
}
.atm-account {
		background: #fff;
		border: 2px dashed var(--primary-color);
		border-radius: 10px;
		padding: 20px;
		margin-bottom: 20px;
}
.atm-row {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 12px 0;
		border-bottom: 1px solid #F5F5F5;
}
.atm-row:last-child {
		border-bottom: none;
}
.atm-label {
		color: #666;
		font-size: 0.9rem;
}
.atm-value {
		color: #333;
		font-weight: 600;
		font-size: 1.1rem;
		display: flex;
		align-items: center;
		gap: 10px;
}
.atm-value.large {
		color: var(--primary-color);
		font-size: 1.3rem;
}
.btn-copy {
		background: var(--primary-color);
		color: #fff;
		border: none;
		padding: 5px 15px;
		border-radius: 5px;
		font-size: 0.8rem;
		cursor: pointer;
		transition: all 0.3s;
}
.btn-copy:hover {
		background: var(--click-color);
		;
}
.atm-notice {
		background: #FFF9E6;
		border-left: 4px solid #FFC107;
		padding: 15px;
		border-radius: 5px;
		font-size: 1rem;
		color: #666;
		line-height: 1.6;
}
.atm-notice i {
		color: #FFC107;
		margin-right: 8px;
}
/* LINE Pay */
.linepay-info {
		background: #FFF5F7;
		padding: 25px;
		border-radius: 10px;
		text-align: center;
}
.linepay-qr {
		width: 200px;
		height: 200px;
		background: #fff;
		border: 2px solid #E5E5E5;
		border-radius: 10px;
		margin: 20px auto;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 3rem;
		color: #00B900;
}
.linepay-btn {
		background: #00B900;
		color: #fff;
		border: none;
		padding: 15px 40px;
		border-radius: 10px;
		font-size: 1rem;
		font-weight: 500;
		cursor: pointer;
		transition: all 0.3s;
		display: inline-flex;
		align-items: center;
		gap: 10px;
}
.linepay-btn:hover {
		background: #00A000;
		transform: translateY(-2px);
}
/* 訂單資訊摘要 */
.order-info-card {
		background: #FFF5F7;
		border-radius: 10px;
		padding: 20px;
		margin-bottom: 30px;
}
.order-info-title {
		font-size: 1.1rem;
		color: #333;
		font-weight: 500;
		margin-bottom: 15px;
		display: flex;
		align-items: center;
		gap: 8px;
}
.order-info-title i {
		color: var(--primary-color);
}
.order-info-row {
		display: flex;
		justify-content: space-between;
		padding: 10px 0;
		font-size: 0.9rem;
		border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}
.order-info-row:last-child {
		border-bottom: none;
}
.order-info-label {
		color: #666;
}
.order-info-value {
		color: #333;
		font-weight: 500;
}
/* 訂單摘要 */
.order-summary {
		background: #fff;
		border-radius: 15px;
		padding: 30px;
		box-shadow: 0 4px 20px rgba(212, 165, 165, 0.1);
		position: sticky;
		top: 110px;
}
.summary-title {
		font-size: 1.3rem;
		color: #333;
		margin-bottom: 25px;
		font-weight: 500;
		padding-bottom: 15px;
		border-bottom: 2px solid #F5E5E7;
}
.summary-row {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 12px 0;
		font-size: 0.95rem;
}
.summary-label {
		color: #666;
}
.summary-value {
		color: #333;
		font-weight: 500;
}
.summary-divider {
		height: 1px;
		background: #F5E5E7;
		margin: 15px 0;
}
.summary-total {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 20px;
		background: #FFF5F7;
		border-radius: 10px;
		margin-bottom: 25px;
}
.total-label {
		font-size: 1.2rem;
		color: #333;
		font-weight: 500;
}
.total-value {
		font-size: 1.8rem;
		color: var(--primary-color);
		font-weight: 600;
}
/* 確認訂單專用樣式 */
.checkout-title {
		font-size: 1.5rem;
		color: #333;
		margin-bottom: 30px;
		font-weight: 500;
		padding-bottom: 20px;
		border-bottom: 2px solid #F5E5E7;
		display: flex;
		align-items: center;
		gap: 10px;
}
.checkout-title i {
		color: var(--primary-color);
}
.checkout-subtitle {
		font-size: 1.2rem;
		color: var(--primary-color);
		margin-bottom: 20px;
		font-weight: 500;
		display: flex;
		align-items: center;
		gap: 10px;
}
.same-as-member {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		color: var(--primary-color);
		cursor: pointer;
		font-size: 0.9rem;
		margin-top: 15px;
}
.same-as-member input[type="checkbox"] {
		width: 18px;
		height: 18px;
		cursor: pointer;
		accent-color: var(--select-color);
}
/* 配送選項 */
.delivery-options {
		display: flex;
		flex-direction: column;
		gap: 15px;
}
.delivery-option {
		border: 2px solid #F5E5E7;
		border-radius: 10px;
		padding: 20px;
		cursor: pointer;
		transition: all 0.3s;
		display: flex;
		align-items: center;
		gap: 15px;
}
.delivery-option:hover {
		border-color: var(--primary-color);
		background: #FFF5F7;
}
.delivery-option.selected {
		border-color: var(--primary-color);
		background: #FFF5F7;
}
.delivery-option input[type="radio"] {
		width: 20px;
		height: 20px;
		cursor: pointer;
		accent-color: var(--select-color);
		flex-shrink: 0;
}
.delivery-info {
		flex: 1;
}
.delivery-name {
		font-weight: 600;
		color: #333;
		margin-bottom: 5px;
		font-size: 1rem;
}
.delivery-desc {
		font-size: 1rem;
		color: #999;
}
.delivery-price {
		font-weight: 600;
		color: var(--primary-color);
		font-size: 1.1rem;
		flex-shrink: 0;
}
/* 發票選項 */
.invoice-options {
		display: flex;
		flex-direction: column;
		gap: 15px;
}
.invoice-option {
		border: 2px solid #F5E5E7;
		border-radius: 10px;
		padding: 20px;
		cursor: pointer;
		transition: all 0.3s;
}
.invoice-option:hover {
		border-color: var(--primary-color);
		background: #FFF5F7;
}
.invoice-option.selected {
		border-color: var(--primary-color);
		background: #FFF5F7;
}
.invoice-header {
		display: flex;
		align-items: center;
		gap: 15px;
}
.invoice-header input[type="radio"] {
		width: 20px;
		height: 20px;
		cursor: pointer;
		accent-color: var(--select-color);
		flex-shrink: 0;
}
.invoice-header label {
		font-weight: 600;
		color: #333;
		cursor: pointer;
		margin: 0;
		font-size: 1rem;
}
.invoice-details {
		margin-top: 20px;
		padding-top: 20px;
		border-top: 1px solid #F5E5E7;
		display: none;
}
.invoice-option.selected .invoice-details {
		display: block;
}
/* 訂單摘要 */
.order-summary {
		background: #fff;
		border-radius: 15px;
		padding: 30px;
		box-shadow: 0 4px 20px rgba(212, 165, 165, 0.1);
		position: sticky;
		top: 110px;
}
.summary-title {
		font-size: 1.3rem;
		color: #333;
		margin-bottom: 25px;
		font-weight: 500;
		padding-bottom: 15px;
		border-bottom: 2px solid #F5E5E7;
}
.product-list {
		margin-bottom: 20px;
}
.product-item {
		display: flex;
		gap: 15px;
		padding: 15px 0;
		border-bottom: 0;
}
.product-info .border-bottom {
		border-color: #F5F5F5;
}
.product-item:last-child {
		border-bottom: none;
}
.product-card-simple {
		background: #fff;
		border-radius: 15px;
		overflow: hidden;
		box-shadow: 0 4px 20px rgba(212, 165, 165, 0.1);
		transition: all 0.4s ease;
		height: 100%;
		display: flex;
		flex-direction: column;
}
.product-card-simple:hover {
		box-shadow: 0 12px 40px rgba(212, 165, 165, 0.25);
}
.product-card-simple .product-image-wrapper {
		position: relative;
		width: 100%;
		padding-top: 100%; /* 1:1 比例 */
		overflow: hidden;
		background: #F9F5F5;
}
.product-card-simple .product-image-wrapper img {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: transform 0.5s ease;
}
.product-card-simple:hover .product-image-wrapper img {
		transform: scale(1.08);
}
.product-badge {
		position: absolute;
		top: 15px;
		right: 15px;
		padding: 6px 15px;
		border-radius: 20px;
		font-size: 0.75em;
		font-weight: 600;
		letter-spacing: 0.05em;
		z-index: 2;
		backdrop-filter: blur(10px);
}
.product-badge.new {
		background: var(--new-color);
		color: #fff;
}
.product-badge.hot {
		background: var(--hot-color);
		color: #fff;
}
.product-image {
		width: 70px;
		height: 70px;
		border-radius: 8px;
		overflow: hidden;
		flex-shrink: 0;
		background: #F5F5F5;
}
.product-image img {
		width: 100%;
		height: 100%;
		object-fit: cover;
}
.product-info {
		padding: 1rem;
		text-align: center;
		flex: 1;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
}
.product-info .small {
		font-size: 1rem;
		color: #aaa !important;
}
.product-name {
		font-size: 1rem;
		color: #333;
		margin-bottom: .5rem;
		line-height: 1.5;
		font-weight: 500;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
		text-overflow: ellipsis;
		min-height: 50px;
}
.checkout-section .product-name {
		min-height: inherit;
}
.product-name a {
		color: #333333;
		text-decoration: none;
}
.product-name a:hover {
		color: #000000;
		text-decoration: underline;
}
.product-name-en {
		font-size: 0.9rem;
		color: #999;
		margin-bottom: 15px;
		font-style: italic;
}
.product-spec {
		font-size: 0.8rem;
		color: #999;
}
.product-price {
		font-size: 1.5em;
		color: var(--primary-color);
		font-weight: 600;
		margin-bottom: 1rem;
		flex-shrink: 0;
}
.product-price .original-price {
		font-size: 1rem;
}
.product-quantity {
		font-size: 1rem;
		color: #666;
}
.product-subtotal {
		font-size: 1rem;
		color: var(--primary-color);
		font-weight: 600;
}
.summary-row {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 12px 0;
		font-size: 0.95rem;
}
.summary-label {
		color: #666;
}
.summary-value {
		color: #333;
		font-weight: 500;
}
.summary-divider {
		height: 1px;
		background: #F5E5E7;
		margin: 15px 0;
}
.summary-total {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 20px;
		background: #FFF5F7;
		border-radius: 10px;
		margin-bottom: 25px;
}
.total-label {
		font-size: 1.2rem;
		color: #333;
		font-weight: 500;
}
.total-value {
		font-size: 1.8rem;
		color: var(--primary-color);
		font-weight: 600;
}
/* 訂單完成專用樣式 */
.success-card {
		background: #fff;
		border-radius: 20px;
		padding: 50px;
		box-shadow: 0 4px 20px rgba(76, 175, 80, 0.15);
		text-align: center;
		margin-bottom: 30px;
		animation: fadeInUp 0.6s ease-out;
}
.unsuccess-card {
		background: #fff;
		border-radius: 20px;
		padding: 50px;
		box-shadow: 0 4px 20px rgba(76, 175, 80, 0.15);
		text-align: center;
		margin-bottom: 30px;
		animation: fadeInUp 0.6s ease-out;
}
@keyframes fadeInUp {
		from {
				opacity: 0;
				transform: translateY(30px);
		}
		to {
				opacity: 1;
				transform: translateY(0);
		}
}
.success-icon {
		width: 100px;
		height: 100px;
		background: linear-gradient(135deg, #4CAF50, #66BB6A);
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 0 auto 30px;
		animation: scaleIn 0.5s ease-out 0.3s both;
}
.unsuccess-icon {
		width: 100px;
		height: 100px;
		background: linear-gradient(135deg, #b74555, #d38691);
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 0 auto 30px;
		animation: scaleIn 0.5s ease-out 0.3s both;
}
@keyframes scaleIn {
		from {
				transform: scale(0);
		}
		to {
				transform: scale(1);
		}
}
.unsuccess-icon i, .success-icon i {
		font-size: 3.5rem;
		color: #fff;
}
.order-result-title {
		font-size: 2rem;
		color: #333;
		font-weight: 600;
		margin-bottom: 1rem;
}
.order-result-subtitle {
		font-size: 1.1rem;
		color: #666;
		margin-bottom: 1rem;
		line-height: 1.8;
}
.order-number {
		display: inline-block;
		padding: 15px 30px;
		border-radius: 10px;
		font-size: 1.2rem;
		font-weight: 600;
		margin-bottom: 1.5rem;
}
.success-card .order-number {
		background: #F0F9F0;
		color: #4CAF50;
}
.unsuccess-card .order-number {
		background: #fff8f9;
		color: #cb727f;
}
.order-result-actions {
		display: flex;
		gap: 15px;
		justify-content: center;
		flex-wrap: wrap;
}
.order-result-action {
		padding: 12px 30px;
		border-radius: 10px;
		font-size: 1rem;
		cursor: pointer;
		transition: all 0.3s;
		text-decoration: none;
		display: inline-flex;
		align-items: center;
		gap: 8px;
}
.btn-primary-action {
		background: var(--primary-color);
		color: #fff;
		border: none;
}
.btn-primary-action:hover {
		background: var(--click-color);
		transform: translateY(-2px);
		box-shadow: 0 4px 15px rgba(212, 165, 165, 0.3);
}
.btn-secondary-action {
		background: #fff;
		color: #666;
		border: 2px solid #E5E5E5;
}
.btn-secondary-action:hover {
		border-color: var(--primary-color);
		color: var(--primary-color);
		background: #FFF5F7;
}
/* 訂單詳情 */
.order-details {
		background: #fff;
		border-radius: 15px;
		padding: 40px;
		box-shadow: 0 4px 20px rgba(212, 165, 165, 0.1);
		margin-bottom: 30px;
}
.detail-section {
		margin-bottom: 35px;
}
.detail-section:last-child {
		margin-bottom: 0;
}
.detail-title {
		font-size: 1.2rem;
		color: var(--primary-color);
		font-weight: 600;
		margin-bottom: 20px;
		padding-bottom: 12px;
		border-bottom: 2px solid #F5E5E7;
		display: flex;
		align-items: center;
		gap: 10px;
}
.detail-title i {
		font-size: 1.3rem;
}
/* 資訊行 */
.info-row {
		display: flex;
		justify-content: space-between;
		padding: 12px 0;
		border-bottom: 1px solid #F5F5F5;
}
.info-row:last-child {
		border-bottom: none;
}
.info-label {
		color: #666;
		font-size: 0.95rem;
}
.info-value {
		color: #333;
		font-weight: 500;
		font-size: 0.95rem;
		text-align: right;
}
/* 費用摘要 */
.cost-summary {
		background: #FFF5F7;
		border-radius: 10px;
		padding: 20px;
		margin-top: 20px;
}
.cost-row {
		display: flex;
		justify-content: space-between;
		padding: 10px 0;
		font-size: 0.95rem;
}
.cost-label {
		color: #666;
}
.cost-value {
		color: #333;
		font-weight: 500;
}
.cost-divider {
		height: 1px;
		background: rgba(212, 165, 165, 0.2);
		margin: 15px 0;
}
.cost-total {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 15px 0;
}
.total-label {
		font-size: 1.2rem;
		color: #333;
		font-weight: 600;
}
.total-value {
		font-size: 1.8rem;
		color: var(--primary-color);
		font-weight: 700;
}
/* 時間軸 */
.timeline {
		position: relative;
		padding-left: 40px;
}
.timeline::before {
		content: '';
		position: absolute;
		left: 12px;
		top: 10px;
		bottom: 10px;
		width: 2px;
		background: #E5E5E5;
}
.timeline-item {
		position: relative;
		padding-bottom: 25px;
}
.timeline-item:last-child {
		padding-bottom: 0;
}
.timeline-dot {
		position: absolute;
		left: -33px;
		top: 5px;
		width: 12px;
		height: 12px;
		border-radius: 50%;
		background: #E5E5E5;
}
.timeline-item.active .timeline-dot {
		background: #4CAF50;
		box-shadow: 0 0 0 4px rgba(76, 175, 80, 0.2);
}
.timeline-content {
		font-size: 0.9rem;
}
.timeline-title {
		color: #333;
		font-weight: 500;
		margin-bottom: 3px;
}
.timeline-time {
		color: #999;
		font-size: 1rem;
}
/* 提示訊息 */
.notice-box {
		background: #FFF9E6;
		border-left: 4px solid #FFC107;
		border-radius: 8px;
		padding: 20px;
		margin-top: 30px;
}
.notice-title {
		color: #F57C00;
		font-weight: 600;
		margin-bottom: 10px;
		display: flex;
		align-items: center;
		gap: 8px;
}
.notice-title i {
		font-size: 1.2rem;
}
.notice-list {
		margin: 0;
		padding-left: 20px;
		color: #666;
		font-size: 0.9rem;
		line-height: 1.8;
}
/* 推薦商品 */
.recommend-section {
		background: #fff;
		border-radius: 15px;
		padding: 40px;
		box-shadow: 0 4px 20px rgba(212, 165, 165, 0.1);
}
.recommend-title {
		font-size: 1.5rem;
		color: #333;
		font-weight: 600;
		margin-bottom: 30px;
		text-align: center;
}
.recommend-products {
		display: grid;
		grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
		gap: 20px;
}
.recommend-product {
		background: #FFF5F7;
		border-radius: 10px;
		padding: 20px;
		text-align: center;
		cursor: pointer;
		transition: all 0.3s;
}
.recommend-product:hover {
		transform: translateY(-5px);
		box-shadow: 0 8px 20px rgba(212, 165, 165, 0.2);
}
.recommend-product-image {
		width: 100%;
		height: auto;
		border-radius: 8px;
		overflow: hidden;
		margin-bottom: 15px;
		background: #F5F5F5;
		aspect-ratio: 1 / 1;
}
.recommend-product-image img {
		width: 100%;
		height: 100%;
		object-fit: cover;
}
.recommend-product a {
		color: #333;
		text-decoration: none;
}
.recommend-product a:hover {
		color: #000;
		text-decoration: underline;
}
.recommend-product-name {
		font-size: 0.95rem;
		color: #333;
		margin-bottom: 8px;
		font-weight: 500;
}
.recommend-product-price {
		font-size: 1.1rem;
		color: var(--primary-color);
		font-weight: 600;
}
/* 按鈕 */
.btn-actions {
		display: flex;
		gap: 15px;
		margin-top: 30px;
}
.btn-back {
		flex: 1;
		background: #fff;
		color: #666;
		border: 2px solid #E5E5E5;
		padding: 15px;
		border-radius: 10px;
		font-size: 1rem;
		cursor: pointer;
		transition: all 0.3s;
		text-align: center;
		text-decoration: none;
		display: inline-block;
}
.btn-back:hover {
		border-color: var(--primary-color);
		color: var(--primary-color);
		background: #FFF5F7;
}
.btn-next {
		flex: 2;
		background: var(--primary-color);
		color: #fff;
		border: none;
		padding: 15px;
		border-radius: 10px;
		font-size: 1rem;
		font-weight: 500;
		cursor: pointer;
		transition: all 0.3s;
		text-decoration: none;
}
.btn-next:hover {
		background: var(--click-color);
		transform: translateY(-2px);
		box-shadow: 0 4px 15px rgba(212, 165, 165, 0.3);
}
.btn-pay {
		flex: 2;
		background: var(--primary-color);
		color: #fff;
		border: none;
		padding: 15px;
		border-radius: 10px;
		font-size: 1rem;
		font-weight: 500;
		cursor: pointer;
		transition: all 0.3s;
		text-decoration: none;
}
.btn-pay:hover {
		background: var(--click-color);
		transform: translateY(-2px);
		box-shadow: 0 4px 15px rgba(212, 165, 165, 0.3);
}
.btn-pay:disabled {
		background: #E5E5E5;
		color: #999;
		cursor: not-allowed;
		transform: none;
}
/* 同意條款 */
.terms-agreement {
		background: #FFF5F7;
		padding: 20px;
		border-radius: 10px;
		margin-top: 30px;
}
.terms-agreement label {
		display: flex;
		align-items: flex-start;
		gap: 10px;
		cursor: pointer;
		font-size: 0.9rem;
		color: #666;
		line-height: 1.6;
}
.terms-agreement input[type="checkbox"] {
		width: 20px;
		height: 20px;
		cursor: pointer;
		accent-color: var(--select-color);
		flex-shrink: 0;
		margin-top: 2px;
}
.terms-agreement a {
		color: var(--primary-color);
		text-decoration: none;
}
.terms-agreement a:hover {
		text-decoration: underline;
}
/* 空購物車 */
.empty-cart {
		text-align: center;
		padding: 80px 20px;
}
.empty-cart-icon {
		font-size: 5rem;
		color: #E5E5E5;
		margin-bottom: 25px;
}
.empty-cart-text {
		font-size: 1.2rem;
		color: #999;
		margin-bottom: 30px;
}
.btn-empty-cart-action {
		background: var(--primary-color);
		color: #fff;
		border: none;
		padding: 15px 40px;
		border-radius: 10px;
		font-size: 1rem;
		cursor: pointer;
		transition: all 0.3s;
		text-decoration: none;
}
.btn-empty-cart-action:hover {
		background: var(--click-color);
		transform: translateY(-2px);
}
/* 迷你購物車 Modal */
.mini-cart-modal {
		display: none;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(0, 0, 0, 0.5);
		z-index: 10000;
		align-items: center;
		justify-content: center;
}
.mini-cart-modal.show {
		display: flex;
}
.mini-cart-content {
		background: #fff;
		border-radius: 20px;
		padding: 40px;
		max-width: 500px;
		width: 90%;
		max-height: 80vh;
		overflow-y: auto;
		position: relative;
		animation: slideDown 0.3s ease-out;
}
@keyframes slideDown {
		from {
				opacity: 0;
				transform: translateY(-30px);
		}
		to {
				opacity: 1;
				transform: translateY(0);
		}
}
.mini-cart-close {
		position: absolute;
		top: 20px;
		right: 20px;
		background: none;
		border: none;
		font-size: 1.5rem;
		color: #999;
		cursor: pointer;
		transition: all 0.3s;
}
.mini-cart-close:hover {
		color: #333;
		transform: rotate(90deg);
}
.mini-cart-title {
		font-size: 1.5rem;
		color: #333;
		margin-bottom: 25px;
		font-weight: 500;
		display: flex;
		align-items: center;
		gap: 10px;
}
.mini-cart-title i {
		color: var(--done-color);
		font-size: 1.8rem;
}
.mini-cart-item {
		display: flex;
		gap: 15px;
		padding: 20px;
		background: #FFF5F7;
		border-radius: 10px;
		margin-bottom: 15px;
}
.mini-cart-item-image {
		width: 80px;
		height: 80px;
		border-radius: 8px;
		overflow: hidden;
		flex-shrink: 0;
}
.mini-cart-item-image img {
		width: 100%;
		height: 100%;
		object-fit: cover;
}
.mini-cart-item-info {
		flex: 1;
}
.mini-cart-item-name {
		font-size: 1rem;
		color: #333;
		margin-bottom: 5px;
		font-weight: 500;
}
.mini-cart-item-spec {
		font-size: 1rem;
		color: #999;
		margin-bottom: 8px;
}
.mini-cart-item-price {
		font-size: 1.1rem;
		color: var(--primary-color);
		font-weight: 600;
}
.mini-cart-total {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 20px;
		background: #FFF5F7;
		border-radius: 10px;
		margin-bottom: 20px;
}
.mini-cart-total-label {
		font-size: 1.1rem;
		color: #333;
		font-weight: 500;
}
.mini-cart-total-value {
		font-size: 1.5rem;
		color: var(--primary-color);
		font-weight: 600;
}
.mini-cart-actions {
		display: flex;
		gap: 10px;
}
.btn-mini-cart-view {
		flex: 1;
		background: #fff;
		color: var(--primary-color);
		border: 2px solid var(--primary-color);
		padding: 12px;
		border-radius: 8px;
		cursor: pointer;
		transition: all 0.3s;
		text-decoration: none;
}
.btn-mini-cart-view:hover {
		background: #FFF5F7;
}
.btn-mini-cart-checkout {
		flex: 1;
		background: var(--primary-color);
		color: #fff;
		border: none;
		padding: 12px;
		border-radius: 8px;
		cursor: pointer;
		transition: all 0.3s;
		text-decoration: none;
}
.btn-mini-cart-checkout:hover {
		background: var(--click-color);
}
/* 登入提示 Modal */
.login-prompt-modal {
		display: none;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(0, 0, 0, 0.5);
		z-index: 10000;
		align-items: center;
		justify-content: center;
}
.login-prompt-modal.show {
		display: flex;
}
.login-prompt-content {
		background: #fff;
		border-radius: 20px;
		padding: 40px;
		max-width: 400px;
		width: 90%;
		text-align: center;
		animation: slideDown 0.3s ease-out;
}
.login-prompt-icon {
		font-size: 4rem;
		color: var(--primary-color);
		margin-bottom: 20px;
}
.login-prompt-title {
		font-size: 1.5rem;
		color: #333;
		margin-bottom: 15px;
		font-weight: 500;
}
.login-prompt-text {
		font-size: 0.95rem;
		color: #666;
		margin-bottom: 30px;
		line-height: 1.6;
}
.login-prompt-actions {
		display: flex;
		gap: 10px;
}
.btn-login-prompt {
		flex: 1;
		padding: 12px;
		border-radius: 8px;
		cursor: pointer;
		transition: all 0.3s;
		font-size: 0.95rem;
}
.btn-login {
		background: var(--primary-color);
		color: #fff;
		border: none;
		text-decoration: none;
}
.btn-login:hover {
		background: var(--click-color);
}
.btn-register {
		background: #fff;
		color: var(--primary-color);
		border: 2px solid var(--primary-color);
		text-decoration: none;
}
.btn-register:hover {
		background: #FFF5F7;
}
/* 商品操作按鈕容器 */
.product-actions {
		display: flex;
		gap: 8px;
		align-items: center;
}
/* 加入最愛按鈕 */
.btn-add-favorite {
		width: 40px;
		height: 40px;
		border: 1px solid var(--primary-color);
		border-radius: 100%;
		cursor: pointer;
		transition: all 0.3s ease;
		display: flex;
		align-items: center;
		justify-content: center;
		flex-shrink: 0;
		background-color: transparent;
}
.btn-add-favorite i {
		font-size: .825rem;
		color: var(--primary-color);
		transition: all 0.3s ease;
		position: relative;
		top: 2px;
}
.btn-add-favorite:hover {
		border-color: var(--primary-color);
		background: var(--primary-color);
}
.btn-add-favorite:hover i {
		color: #ffffff;
}
/* Active 狀態 (已加入最愛) */
.btn-add-favorite.active {
		background: var(--primary-color);
		border-color: var(--primary-color);
}
.btn-add-favorite.active i {
		color: white;
}
/* 讓購物車按鈕 */
.btn-pro-detail, .btn-add-cart {
		background: transparent;
		border: 1px solid var(--primary-color);
		color: var(--primary-color);
		padding: .5rem .5rem;
		border-radius: 2rem;
		font-size: .875rem;
		font-weight: 500;
		transition: all 0.3s;
		cursor: pointer;
		width: 100%;
		flex: 1;
}
.btn-pro-detail:hover, .btn-add-cart:hover {
		background: var(--click-color);
		color: #fff;
		transform: translateY(-2px);
		box-shadow: 0 4px 15px rgba(212, 165, 165, 0.3);
}
.remark-group {
		margin-top: 20px;
		padding: 15px;
		background: #FFF5F7;
		border-radius: 8px;
		font-size: 1rem;
		color: #666;
		line-height: 1.6;
}
.remark-group i {
		color: var(--primary-color);
		margin-right: 5px;
}
@media (max-width: 1199px) {
		.cart-section {
				padding-top: 60px;
				padding-bottom: 60px;
		}
		.cart-summary-total {
				flex-direction: column;
		}
		.cart-total-label {
				font-size: 1rem;
		}
		.btn-continue-shopping, .btn-checkout {
				font-size: 1rem;
		}
		.remark-group {
				font-size: .85rem;
		}
}
@media (max-width: 991px) {
		.cart-items {
				flex-direction: row;
				gap: 20px;
				flex-wrap: wrap;
				justify-content: space-between;
		}
		.order-summary {
				position: static;
				margin-top: 30px;
		}
		.cart-steps {
				margin-bottom: 30px;
		}
		.cart-step-label {
				font-size: 0.8rem;
		}
		.success-card {
				padding: 30px 20px;
		}
		.success-title {
				font-size: 1.5rem;
		}
		.success-actions {
				flex-direction: column;
		}
		.btn-success-action {
				width: 100%;
				justify-content: center;
		}
		.order-details {
				padding: 25px 20px;
		}
		.product-item {
				flex-direction: row;
				flex-wrap: wrap;
		}
		.product-image {
				width: 80px;
				height: 80px;
				border-radius: 8px;
		}
		.product-item .product-info {
				text-align: start;
		}
		.product-item .product-price {
				width: 100%;
		}
		.recommend-products {
				grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
				gap: 15px;
		}
		.payment-content {
				padding: 25px 20px;
		}
		.payment-method {
				padding: 15px;
		}
		.card-visual {
				padding: 20px;
				min-height: 160px;
		}
		.card-number {
				font-size: 1.1rem;
		}
		.checkout-content {
				padding: 25px 20px;
		}
		.btn-actions {
				flex-direction: column;
		}
		.delivery-option, .invoice-option {
				padding: 15px;
		}
		.mini-cart-content {
				padding: 30px 20px;
		}
}
@media (max-width: 767px) {
		.cart-select-all label, .cart-batch-delete {
				font-size: .875rem;
		}
		.cart-section > .container {
				max-width: calc(100% - 1rem);
		}
		.cart-summary-total {
				flex-direction: row;
		}
		.btn-continue-shopping, .btn-checkout {
				max-width: calc(50% - 1rem);
				margin: 0;
		}
		.btn-continue-shopping {
				margin-left: auto;
				float: right;
		}
		.cart-item {
				padding: 25px 15px;
		}
		.cart-item-price {
				font-size: 1rem;
		}
		.cart-item-image {
				width: 100px;
				height: 100px;
		}
		.cart-item-name {
				font-size: 1rem;
		}
		.cart-item-spec {
				font-size: .8125rem;
				margin-bottom: 10px;
		}
		.cart-item-controls {
				padding-top: 1rem;
		}
}
@media (max-width: 576px) {
		.cart-item-name {
				font-size: .85rem;
		}
		.cart-item {
				flex-direction: row;
				padding: 45px 10px 80px 10px;
				position: relative;
		}
		.cart-item-original-price {
				font-size: .65rem;
		}
		.cart-item-checkbox {
				position: absolute;
				top: -5px;
				margin-top: 10px;
		}
		.cart-item-remove {
				right: 0;
				top: -160px;
		}
		.cart-item-controls {
				border-top: 1px solid #ccc;
				padding-top: .75rem;
				position: absolute;
				bottom: 0;
				flex-direction: row;
				left: 0;
				right: 0;
				margin: 1rem auto;
				max-width: calc(100% - 1rem);
		}
		.product-actions {
				gap: 5px;
		}
		.recommend-section {
				padding: .5rem;
		}
		.recommend-products {
				grid-template-columns: repeat(2, 1fr);
		}
		.product-badge {
				top: 8px;
				right: 8px;
				padding: .125rem .75rem;
				border-radius: 20px;
		}
		.btn-add-favorite {
				width: 30px;
				height: 30px;
		}
		.btn-pro-detail, .btn-add-cart {
				padding: .25rem .25rem;
		}
		.product-info {
				padding: .5rem .25rem .75rem .25rem;
		}
		.product-name {
				font-size: .85rem;
				margin-bottom: .5rem !important;
		}
		.product-price {
				font-size: 1.125rem;
				margin-bottom: .5rem !important;
		}
		.original-price {
				font-size: .75rem;
				display: block;
				margin-left: 0 !important;
		}
		.cart-steps {
				flex-wrap: wrap;
				gap: 10px;
		}
		.cart-step {
				max-width: none;
		}
		.cart-step-number {
				width: 30px;
				height: 30px;
				font-size: 1rem;
		}
		.content-section, .cart-section {
				padding-top: 30px;
				padding-bottom: 30px;
		}
		.summary-total, .cart-summary-total {
				padding: 15px;
		}
		.btn-continue-shopping, .btn-checkout {
				max-width: calc(50% - .5rem);
		}
		.product-quantity, .product-info .small, .product-unit-price, .total-label, .cart-total-label {
				font-size: .85rem;
		}
		.total-value, .cart-total-value {
				font-size: 1.5rem;
		}
		.cart-step-line {
				display: none;
		}
		.order-summary, .cart-content, .cart-summary {
				padding: 25px 20px;
		}
		.checkout-section .product-name {
				min-height: inherit;
		}
		.cart-title, .checkout-title {
				font-size: 1.125rem;
		}
		.checkout-subtitle {
				font-size: 1rem;
		}
		.empty-cart {
				padding: 30px 20px;
		}
		.empty-cart-icon {
				font-size: 3rem;
		}
		.empty-cart-text {
				font-size: 1rem;
		}
		.btn-empty-cart-action, .btn-checkout.disabled, .btn-continue-shopping, .btn-checkout {
				font-size: .85rem;
				padding: 8px 5px;
				margin-bottom: 0;
				height: 45px;
		}
		.btn-empty-cart-action {
				padding: 8px 25px;
		}
}