.cart-box.row { margin-left: 0; margin-right: 0; }
.cart-row {
	display: grid;
	width: 100%;
	gap: 0; 
	
	/* 將寬度切分為 8 等份 */
	grid-template-columns: repeat(8, 1fr);
	/* 高度自適應，或根據需求設定 */
	grid-template-rows: repeat(2, auto);
	
	/* 定義區塊分佈 */
	grid-template-areas: 
		"area1 area1 area1 area2 area2 area2 area2 area2"
		"area3 area3 area3 area3 area4 area4 area4 area5";

	border-bottom: 1px solid #808080; 
	padding: 1rem .75rem;
	/* margin-bottom: 1rem; */
}
.cart-row:nth-child(1) { display: none; }

.cart-list2 .cart-row { 
	grid-template-areas: 
		"area1 area1 area1 area2 area2 area2 area2 area2"
		"area3 area3 area3 area3 area4 area4 area4 area4" !important;
}

.cart-row > div {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	
	width: 100%;
	padding: 0 0 0;
}

.cart-row > div:nth-child(1) { grid-area: area1; }
.cart-row > div:nth-child(1) > img { border-radius: 5px; }

.cart-row > div:nth-child(2) { grid-area: area2; padding: .25rem .75rem .75rem; }
.cart-row > div:nth-child(2) > div:nth-child(1) { font-size: 18px; color: #000; margin-right: auto; }
.cart-row > div:nth-child(2) > div:nth-child(2) { margin-right: auto; }
.cart-row > div:nth-child(2) > div:nth-child(2) > span { font-size:18px; color: #000; }
.cart-row > div:nth-child(2) > div:nth-child(2) > span:nth-child(2) { 
	font-size: 15px; 
	color: #808080; 
	text-decoration: line-through;
	text-decoration-color: #BBB;
}
.cart-row > div:nth-child(2) > div:nth-child(3) { font-size: 1em; color: #666; margin-right: auto; }

.cart-row > div:nth-child(3) { grid-area: area3; margin-top: .5rem; }
.cart-row > div:nth-child(4) { 
	grid-area: area4; 
	margin-top: .5rem; 
	font-size: 1.15em; 
	padding: .25rem .5rem .25rem; 
	justify-content: flex-end;
}
.cart-row > div:nth-child(5) { grid-area: area5; margin-top: .5rem; }
.cart-row > div:nth-child(5) > img { width: 60%; max-width: 32px; }

.quantity-selector { width: 100%; }
.quantity-selector button { width: 40px; height: 40px; }
.quantity-selector input[type="number"] { width: calc(100% - 80px); height: 40px; }

.btn-buy { display: block; width: 100%; margin: .75rem auto; }
.btn-pay { background-color: #00458D; }

/* 購物車總計&結帳 */
.cart-check { margin-top: 1.5rem; padding: 0; }
.cart-check > div {
	display: grid;
	width: 100%;
	
	gap: 0; 
	grid-template-columns: 1fr;
	grid-template-rows: repeat(7, auto);
				
	padding: 1rem 1rem;
	
	border: 1px solid #808080;
	border-radius: 16px;
}
.cart-check > div > div {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
	
	width: 100%;
	padding: .75rem .5rem;
	
	font-size: 18px;
}

.cart-check > div > div:nth-child(1) { margin-bottom: 1rem; }
.cart-check > div > div:nth-child(4),
.cart-check > div > div:nth-child(5) { align-items: flex-start; }

.cart-check > div > div:nth-child(2) > div,
.cart-check > div > div:nth-child(4) > div,
.cart-check > div > div:nth-child(5) > div,
.cart-check > div > div:nth-child(6) > div {
	flex: 0 0 auto;
    width: 100%;
    max-width: 100%;
    padding: 0;
}

.cart-check > div > div:nth-child(2) > div:nth-child(1),
.cart-check > div > div:nth-child(6) > div:nth-child(1) { width: 100px; }
.cart-check > div > div:nth-child(2) > div:nth-child(2),
.cart-check > div > div:nth-child(6) > div:nth-child(2) { width: calc(100% - 100px); text-align: right; }

.cart-check > div > div:nth-child(4) > div:nth-child(1),
.cart-check > div > div:nth-child(5) > div:nth-child(1) { width: 30px; }
.cart-check > div > div:nth-child(4) > div:nth-child(2),
.cart-check > div > div:nth-child(5) > div:nth-child(2) { width: calc(100% - 30px); }

input[type=radio] {
	width: 24px;
	height: 24px;
	margin-top: .25rem;
}

.cart-check > div > div:nth-child(3),
.cart-check > div > div:nth-child(6) { border-top: 1px solid #808080; }

.grand-total {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}
.grand-total > * {
	flex: 0 0 auto;
	width: 100%;
    max-width: 100%;
	margin: .5rem 0;
	font-size: 1.15em;
}

@media screen and (max-width: 374px) {
	.cart-row > div:nth-child(2) > div:nth-child(1) { font-size: 15px; }
	.cart-row > div:nth-child(2) > div:nth-child(2) > span { font-size: 15px; }
	.cart-row > div:nth-child(2) > div:nth-child(2) > span:nth-child(2) { font-size: 13px; }
}

@media screen and (min-width: 500px) {
	.cart-row {
		grid-template-columns: 45% 1fr 45px;
		grid-template-rows: repeat(3, auto);
  
		/* 定義區塊分佈 */
		grid-template-areas: 
			"left right1 right1"
			"left right2 right2"
			"left right3 right4";
			
		padding: 1rem 0;
	}
	
	.cart-row > div { padding: 0 .75rem 0; }
	
	.cart-list2 .cart-row {
		grid-template-areas: 
			"left right1 right1"
			"left right2 right2"
			"left right3 right3" !important;
	}
	
	.cart-row > div:nth-child(1) { grid-area: left; padding: 0; }
	.cart-row > div:nth-child(2) { grid-area: right1; padding: .25rem .75rem 0; }
	.cart-row > div:nth-child(2) > div:nth-child(1),
	.cart-row > div:nth-child(2) > div:nth-child(2) > span { font-size: 1.1em; }
	.cart-row > div:nth-child(3) { grid-area: right2; }
	.cart-row > div:nth-child(4) { grid-area: right3; justify-content: flex-start; }
	.cart-row > div:nth-child(5) { grid-area: right4; padding: 0; }
	.cart-row > div:nth-child(5) > img { width: 60%; max-width: 32px; }
	
	.btn-buy { width: 50%; margin: .75rem 0 .75rem auto; }
}

@media screen and (min-width: 615px) {
	.cart-row {
		grid-template-columns: 125px 1fr 120px 100px 40px;
		grid-template-rows: repeat(1, auto);
  
		/* 定義區塊分佈 */
		grid-template-areas: 
			"column1 column2 column3 column4 column5";
	}
	
	.cart-list2 .cart-row {
		grid-template-rows: repeat(1, auto) !important;
		grid-template-columns: 125px 1fr 70px 100px !important;
		grid-template-areas: 
			"column1 column2 column3 column4" !important;
	}
	
	.cart-row > div:nth-child(1) { grid-area: column1; padding: 0; }
	.cart-row > div:nth-child(2) { grid-area: column2; padding: .25rem .75rem 0; }
	.cart-row > div:nth-child(2) > div:nth-child(1) { font-size: 16px; }
	.cart-row > div:nth-child(2) > div:nth-child(2) > span { font-size: 16px; }
	.cart-row > div:nth-child(2) > div:nth-child(2) > span:nth-child(2) { font-size: 14px; }
	.cart-row > div:nth-child(2) > div:nth-child(3) { font-size: 14px; }
	.cart-row > div:nth-child(3) { grid-area: column3; }
	.cart-list2 .cart-row > div:nth-child(3) { justify-content: flex-end !important; }
	.cart-row > div:nth-child(4) { grid-area: column4; justify-content: flex-end; font-size: 16px; }
	.cart-row > div:nth-child(5) { grid-area: column5; }
	.cart-row > div:nth-child(5) > img { width: 60%; max-width: 32px; }
	
	.quantity-selector { justify-content: flex-end; }
	.quantity-selector button { width: 30px; }
	.quantity-selector input[type="number"] { width: calc(100% - 60px); }
	
	.cart-row:nth-child(1) { display: grid; padding: .75rem 0 .25rem; }
	.cart-row:nth-child(1) > div:nth-child(3) { font-size: 16px; justify-content: center; }
	.cart-list2 .cart-row:nth-child(1) > div:nth-child(3) { justify-content: flex-end !important; }
	.cart-row:nth-child(1) > div:nth-child(4) { font-size: 16px; justify-content: flex-end; }
	
	.btn-buy { width: 40%; }
	
	.grand-total { justify-content: space-between; }
	.grand-total > * { width: 33.333333%; }
}

@media screen and (min-width: 768px) {
	.cart-row > div:nth-child(2) > div:nth-child(1) { font-size: 1.05em; }
	.cart-row > div:nth-child(2) > div:nth-child(2) > span { font-size: 1.05em; }
	.cart-row > div:nth-child(2) > div:nth-child(2) > span:nth-child(2) { font-size: .9em; }
	
	.cart-row > div:nth-child(4) { font-size: 1.05em; }
	
	.cart-row:nth-child(1) > div:nth-child(3) { font-size: 1.05em; }
	.cart-row:nth-child(1) > div:nth-child(4) { font-size: 1.05em; }	
	
	.btn-buy { width: 200px; }
}

@media screen and (min-width: 992px) {
	.cart-row { grid-template-columns: 150px 1fr 140px 130px 50px;}
	.cart-list2 .cart-row { grid-template-columns: 150px 1fr 140px 130px !important; }
	
	.quantity-selector button { width: 40px; }
	.quantity-selector input[type="number"] { width: calc(100% - 80px); }
}


@media screen and (min-width: 1200px) {
	.cart-list { width: 68%; }
	.cart-list2 { width: 100% !important; }
	.cart-row { grid-template-columns: 100px 1fr 120px 100px 40px; }
	.cart-list2 .cart-row { grid-template-columns: 100px 1fr 120px 100px !important; }
	
	.quantity-selector button { width: 30px; }
	.quantity-selector input[type="number"] { width: calc(100% - 60px); }
	
	/* 購物車總計&結帳 */
	.cart-check { width: 32%; margin-top: 0; padding: 0 .75rem; }
}

@media screen and (min-width: 1400px) {
	.cart-list { width: 70%; }
	.cart-row { grid-template-columns: 135px 1fr 120px 120px 40px; }
	.cart-list2 .cart-row { grid-template-columns: 135px 1fr 120px 120px !important; }
	
	.cart-row > div:nth-child(2) > div:nth-child(1) { font-size: 1.15em; }
	.cart-row > div:nth-child(2) > div:nth-child(2) > span { font-size: 1.15em; }
	.cart-row > div:nth-child(2) > div:nth-child(2) > span:nth-child(2) { font-size: 1em; }
	
	.cart-row > div:nth-child(4) { font-size: 1.15em; }
	
	.cart-row:nth-child(1) > div:nth-child(3) { font-size: 1.15em; }
	.cart-row:nth-child(1) > div:nth-child(4) { font-size: 1.15em; }
	
	/* 購物車總計&結帳 */
	.cart-check { width: 30%; }
}