:root{
        --lbuyfont-family:"abchanel-corpo,arial,helvetica,sans-serif";
        --color-black: #000000;
        --color-black-bg: #000000;
        --color-black-transparent: #0000008c;
        --color-white-transparent: #ffffffac;
        --color-dark_gray: #1717178c;
        --font-dark_gray: #282828;
        --font-light_gray: #7a7a7a;
        --color-light_gray: #f4f4f3;
        --remind-red:#C34B4B;
        --input-lg_bg: #fbfbfb;
        --unlock-bg:#ddd6d0;
        --color-white: #ffffff;
        --color-white-bg: #ffffff;
        --color-dark_brown: #684d35;
        --color-light_brown: #b38862;
        --color-input_focus: #bc9c726e;
        --color-lb-transparent: #b38862c1;
        --product-img_bg:#f6f5f3;
        --shadow-style:0 0 0 1px #f1f5f9, 0 2px 4px rgba(0, 0, 0, .05), 0 12px 24px rgba(0, 0, 0, .05);
        --border-radius:5px;
        --all-transition: all 0.18s;

        --cart_login_icon:url(images/cart_login_icon.svg);
        --cart_exchange_icon:url(images/exchange_icon.svg);
        --radio_on_icon:url(images/radio_in.svg);
        --radio_off_icon:url(images/radio_off.svg);
        --settlement_more_on:url(images/settlement_more_on.svg);/*灰上小箭頭*/
        --right_gray_arrow:url(images/right_gray_arrow.svg);/*灰右小箭頭*/
        --settlement_more_off:url(images/settlement_more_off.svg);/*灰下小箭頭*/
        --view_discounts_top:url(images/view_discounts_top.svg);/*紅上小箭頭*/
        --view_discounts_bottom:url(images/view_discounts_bottom.svg);/*紅下小箭頭*/
        --more_details_icon:url(images/more_details.svg);/*黑右小箭頭*/
        --expandable_content_arrow:url(images/expandable_content_arrow.png);/*小計下拉小箭頭*/

        --more_top_icon:url(images/more_black_top.svg);
        --more_bottom_icon:url(images/more_black_bottom.svg);
        --back_icon:url(images/back_icon.svg);/*黑左返回*/

        --cart_selected_icon:url(images/selected.svg);
        --cart_notselected_icon:url(images/not_selected.svg);
        --cart_required_icon:url(images/required.svg);
        --cart_failureselected_icon:url(images/failure_selected.svg);/*複選禁止*/
        --cart_radiounavailable_icon:url(images/radio_unavailable.svg);/*單選禁止*/

        --cart_discounts_icon:url(images/discounts_icon.svg);

        --cart_btnwish_icon:url(images/wish.svg);
        --cart_btnwishon_icon:url(images/wish_on.svg);
        --cart_btndel_icon:url(images/del.svg);

        --cart_add_icon:url(images/add.svg);
        --white_add_icon:url(images/white_add.svg);
        --cart_minus_icon:url(images/minus.svg);
        --cart_greyadd_icon:url(images/grey_add.svg);
        --cart_greyminus_icon:url(images/grey_minus.svg);
        --pop_search_icon:url(images/pop_search.svg);

        --pay_receiving_help:url(images/pay-receiving_icon.svg);/*灰色問號*/
        --black_help_icon:url(images/black_help_icon.svg);/*黑色問號*/
        --pay_sf_station:url(images/pay-sf_station.svg);
        --pay_receiving_address:url(images/pay-receiving_address.svg);/*黑色定位*/
        --location_icon:url(images/location_icon.svg);/*金色定位*/
        --pay_receiving_time:url(images/pay-receiving_time.svg);/*黑色時間*/
        --pay_receiving_default:url(images/pay-receiving_default.svg);/*金色勾*/
        --pay_receiving_add:url(images/pay-receiving_add.svg);
        --pop_cancel:url(images/pop_cancel.svg);
        --pen_icon:url(images/pen_icon.svg);
        --arrow_indication:url(images/arrow_indication.svg);
        --copy_icon:url(images/copy_icon.svg);/*灰色複製*/

        --pop_required_icon:url(images/pop_required.svg);
        --pop_search:url(images/pop_search.svg);


        --cart_bg-color: #FBFBFB;
        --cart_border-color: #EAEAEA;
        --cart_button-border: #B2B2B2;
        --cart_button-hoverborder: #ddd6d0;
        --attribute_bg-color: #F5F5F5;
        --cart-div_radius:10px;
        --boxcart-max_height:80vh;/*----這是為變量，需要獲取媒體高度 減去 頁頭頁腳的高度----*/
}
html,body{font-family:var(--lbuyfont-family); color: var(--color-black);font-size: 14px; margin:0; padding:0;}
ul{margin:0; padding:0; list-style-type: none;}
.cart_body{width:100%; background: var(--cart_bg-color); padding:20px 0; display: flex; justify-content: center;}
.box_cart{width:94%; position: relative;}
.cart_body input{transition: var(--all-transition);}
.cart_body input:focus-visible{outline: none;box-shadow: 0 0 2px 2px var(--color-input_focus);}

/*------------------------------ left ------------------------------*/
.cart_left{width:calc(100% - 360px); background: var(--color-white-bg); border-radius:10px; padding:20px; box-sizing: border-box;}
.cart_label{font-size:1.14rem; font-weight: bold; color: var(--color-black);}
.cart_btu{border-radius: var(--border-radius); cursor: pointer; transition: var(--all-transition); line-height:1rem; padding:10px; border: 1px solid var(--cart_button-border); display: flex; gap:5px; font-size:1rem;}
.action_bar{display: flex; gap:15px; align-items: center; border-bottom:1px solid var(--cart_border-color); padding:20px 0;}
.cart_btu:hover{background: var(--product-img_bg); border: 1px solid var(--cart_button-hoverborder);}
.cart_btu.wish::before{display: block; content: ""; width:14px; height:14px; background:var(--cart_btnwish_icon) no-repeat; background-size: 14px; margin-top:1px;}
.cart_btu.del::before{display: block; content: ""; width:14px; height:14px; background:var(--cart_btndel_icon) no-repeat; background-size: 14px; margin-top:1px;}
.checkbox_style{display: flex; align-items: center; gap:15px; line-height:1.14rem; max-height:80px;}
/* 復選 */
        .custom_checkbox{
            display: inline-block;
            cursor: pointer;
        }
        .checkbox_style input {
            display: none;
        }
        .custom_checkbox {
            height: 16px;
            width: 16px;
            background: var(--cart_notselected_icon) no-repeat;
            background-size:16px;
        }
        .checkbox_style input:checked ~ .custom_checkbox::after {
            content: "";
            display: block;
            height: 16px;
            width: 16px;
            background: var(--cart_selected_icon) no-repeat;
            background-size:16px;
        }

.shopping_product{padding:30px 0; display: flex;flex-direction: column;gap: 20px; border-bottom: 1px solid var(--cart_border-color);}
.shopping_product:last-child{border: 0;}
.activity_title{display: flex; gap:15px;}
.activity_title p{display: flex; gap:5px; margin:0; padding:0; align-items: center; font-size:1.14rem; color: var(--color-black);}
.activity_title p>b{padding:8px; line-height:1.14rem; font-size:1.14rem; 
    border-bottom-left-radius:var(--border-radius); border-top-right-radius:var(--border-radius); 
color: var(--color-white); background: var(--color-light_brown);}
.activity_title p>span{color: var(--color-light_brown); transition: var(--all-transition); border-bottom:1px solid var(--color-light_brown); padding-bottom:1px; cursor: pointer;}
.activity_title p>span:hover{color: var(--color-dark_brown);  border-bottom:1px solid var(--color-dark_brown);}
.product_ul{ display: flex; flex-direction: column; gap: 20px;}
.product_li{display: flex; gap:15px;}
.product_quantity{font-size: 1.14rem; color: var(--color-black); display: none;}
/* 加减器容器 */
.counter-container {width:calc(20% - 15px); min-width:140px; display: flex;flex-direction: column;align-items: center;}
/* 加减器样式 */
.quantity-control {display: flex;align-items: center;background:var(--color-white-bg);border-radius:var(--border-radius);border: 2px solid var(--cart_border-color);gap:5px;}
.quantity-btn {width: 34px;height: 34px;display: flex;align-items: center;justify-content: center;background: var(--cart_bg-color);color: #4e54c8;font-size: 1.8rem;border: none;cursor: pointer;transition:var(--all-transition);}  
.decrement::before{content: ""; width:14px; height:14px; display: block; background:var(--cart_minus_icon) no-repeat center; background-size:14px;}
.increment::before{content: ""; width:14px; height:14px; display: block; background:var(--cart_add_icon) no-repeat center; background-size:14px;}
.quantity-btn:disabled{cursor: not-allowed;}
.decrement:disabled::before {content: ""; width:14px; height:14px; display: block; background:var(--cart_greyminus_icon) no-repeat center; background-size:14px;}
.increment:disabled::before {content: ""; width:14px; height:14px; display: block; background:var(--cart_greyadd_icon) no-repeat center; background-size:14px;}
.quantity-btn:not(:disabled):hover {background: var(--color-white-bg);}
.quantity-input {width: 54px;height: 34px;text-align: center;font-size: 1.14rem;border: none;outline: none;background:var(--color-white-bg);color:var(--color-black);margin:0;transition: var(--all-transition);}
/* 移除输入框的箭头 */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input[type=number] {-moz-appearance: textfield;}
/* 优化焦点效果 */
.free_gifts_box .product_quantity{display: block;}
.free_gifts_box .quantity-control{display: none;}
.product_content{display: flex; gap:15px; width:100%;}
.product_img{width:80px; height:80px; min-width:80px; border-radius: var(--border-radius); display: block; background: var(--product-img_bg);}
.product_name{display: flex; flex-direction: column; justify-content: space-between;}
.product_name>a{text-decoration: none; font-size: 1rem; color: var(--color-black); line-height: 1.14rem;
display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;text-overflow: ellipsis;}
.more_action{display: flex; align-items: center; gap:15px; position: relative;}
.more_action .free_gifts{border: 1px solid var(--color-light_brown); font-size: 1rem; line-height:1rem; padding:4px; color: var(--color-light_brown); border-radius:var(--border-radius); display: none;}
.free_gifts_box .more_action .free_gifts{display: block;}
.free_gifts_box .more_action .more_discounts{display: none;}
.more_discounts{color: var(--color-dark_brown); cursor: pointer; transition: var(--all-transition); 
    border-bottom:1px solid var(--color-dark_brown); display: flex; align-items: center; gap:5px;}
.more_discounts::before{width:15px; height:15px; margin-top:3px; content: ""; background:var(--cart_discounts_icon) center no-repeat; background-size: 15px; display: block;}
.more_discounts:hover{opacity: 0.8;}
.more_discounts>i{font-style: normal;}
.product_attribute,.product_price{width:calc(20% - 15px); text-align: center; min-width:140px;}
.product_attribute{color: var(--font-light_gray); transition:all 0.1s; border: 2px solid #ffffff00; box-sizing: border-box; border-radius:var(--border-radius); position: relative; overflow: hidden;}
.product_attribute:hover{border: 2px dotted var(--color-black-bg); box-sizing: border-box;}
.product_attribute>span{cursor: pointer; display: none; border-top-left-radius: 10px; color: var(--color-black); position: absolute; right:0px; bottom:0px; padding:3px 5px; font-size: 1rem;}
.product_attribute>span:hover{opacity: 0.8;}
.product_attribute:hover>span{display: block;}

.product_price{display: flex;flex-direction: column;gap: 5px;}
.product_price>b{font-size:1.14rem;}
.product_price>b span{display: none;}
.cash.product_price>b{color: var(--color-dark_brown);}
.cash.product_price>b span{display: inline-block;}

.product_price>del{color: var(--font-light_gray);}
.like_del{display: flex; gap:16px; flex-direction: column; min-width:20px;}
.like_del>span{display: block; width:16px; height:16px; cursor: pointer; transition: var(--all-transition);}
.like_del>span:hover{opacity:0.8;}
.like_icon{background:var(--cart_btnwish_icon) center no-repeat; background-size:16px;}
.like_icon.on{background: var(--cart_btnwishon_icon) center no-repeat; background-size:16px;}
.del_icon{background:var(--cart_btndel_icon) center no-repeat; background-size:16px;}
.free_gifts_box .like_del .del_icon{display: none;}
.free_gifts_box .checkbox_style span{display: none;}
.free_gifts_box .checkbox_style::before{content: ""; width:16px; height:16px; background: var(--cart_required_icon) no-repeat; background-size:16px;}


.purchase_invalid .activity_title p>b{background: var(--cart_button-border);}
.purchase_invalid .product_quantity{display: block;}
.purchase_invalid .quantity-control,
.purchase_invalid .more_action,
.purchase_invalid .product_attribute:hover>span{display: none;}
.purchase_invalid .product_name>a,
.purchase_invalid .product_price>b{color: var(--font-light_gray);}
.purchase_invalid .product_attribute:hover{border: 2px solid #ffffff00; box-sizing: border-box;}
.purchase_invalid .custom_checkbox{cursor: not-allowed;background: var(--cart_prohibitselected_icon) no-repeat;
            background-size:16px;}


/*------------------------------ right ------------------------------*/
.cart_right{position: fixed; width:340px; right:3%; top:20px; max-height: var(--boxcart-max_height); overflow-y: auto; display: flex; flex-direction: column; gap:20px;}
.slide_area{display: flex; flex-direction: column;overflow-y: auto; gap:20px; height: calc(100% - 151px);}/*----151px為變量，需要獲取.total_payment、.settlement>label、還有間隙總和40px的高度----*/
.right_box{background: var(--color-white-bg); border:1px solid var(--cart_border-color); border-radius:10px; padding:20px;}

/*------ Login&Coupon ------*/
.login_box{min-height:200px; color: var(--color-black); display: flex; align-items: center; justify-content: center;flex-direction: column; gap:20px;}
.login_box>span{cursor: pointer; transition: var(--all-transition); font-size:1rem; border-radius: var(--border-radius); border:1px solid var(--cart_button-border); display: flex; align-items: center; padding:10px 15px; gap:5px;}
.login_box>span:hover{background: var(--product-img_bg); border: 1px solid var(--cart_button-hoverborder);}
.login_box>span::before{display: block; content: ""; width:14px; height:14px; background:var(--cart_login_icon) no-repeat 100%; margin-top:1px;}
.login_box>p{font-size:1.14rem; margin:0; padding:0; text-align: center;}
.login_box>p span{color: var(--color-light_brown);}
.coupon_box{display: flex;flex-direction: column;}
.coupon_top{display: flex; align-items: center; justify-content: space-between;}
.coupon_top>label{font-size:1.14rem; font-weight: bold;}

/*20260122*/
.coupon_top>span{font-size:1rem; color: var(--color-light_brown); display: flex; align-items: center; gap:5px; cursor: pointer; transition: var(--all-transition);}
.coupon_top>span:hover{opacity: 0.8;}
/*20260122*/

.coupon_top>span::before{width:14px; height:14px; content:""; background:var(--cart_exchange_icon) no-repeat; background-size:14px;}
.coupon_box>ul li{padding:20px 0; border-bottom: 1px solid var(--cart_border-color); display: flex; gap:10px; align-items: center;}
.coupon_box>ul li:last-child{border:0; padding-bottom:0;}
.coupon_box>ul li>label{width:calc(100% - 26px); cursor: pointer;}
.coupon_box>ul li>label p{font-size:1.14rem;width:calc(100% - 24px); color: var(--color-black); padding: 0; margin:0; line-height:20px;}
.coupon_box>ul li>label p>b{font-size:20px; vertical-align: text-top; padding:0 5px; display: inline-block; color: var(--color-light_brown); line-height:20px;}
.coupon_box>ul li>label .expiration_date{font-size: 1rem; color: var(--font-light_gray); display: block; margin-top:8px;}
.coupon_box>ul li>span{display: block; width:16px; height:16px; font-size: 0; cursor: pointer; transition: var(--all-transition);}
.coupon_box>ul li>span:hover{opacity: 0.8;}
.coupon_box>ul li>span>img{width:100%;}
.coupon_more{display: flex; cursor: pointer; transition: var(--all-transition); align-items: center; justify-content: center; width:100%; padding:10px 0; margin-top:20px; color: var(--font-light_gray); font-size:1rem; line-height:1rem;}
.coupon_more::after {content: "";display: inline-block;margin-left: 10px;width: 10px;min-width: 10px;height: 10px;background: var(--right_gray_arrow) no-repeat;background-size: 10px;}
.coupon_more:hover{opacity: 0.8;}

.coupon_boxmore{display: flex; align-items: center; display: none;}
.selected_coupon p{font-size:1.14rem;width:calc(100% - 24px); color: var(--color-black); padding: 0; margin:0; line-height:20px;}
.selected_coupon p>b{font-size:20px; vertical-align: text-top; padding:0 5px; display: inline-block; color: var(--color-light_brown); line-height:20px;}
.selected_coupon{font-size: 1rem; color: var(--font-light_gray); display: flex; width:100%; gap:8px;flex-direction: column;}
.selected_more{font-size:0.85rem; white-space:nowrap; display: flex; align-items: center; gap:5px; cursor:pointer;}
.selected_more::after{width:10px; height:10px; content: ""; max-width: 12px; background:var(--more_details_icon) no-repeat; background-size:10px; display: block;}
/* 單選 */
.radio_style {display: flex;align-items: center;width:100%;gap:10px;}
.radio_style input {display: none;}
.custom_radio {height: 14px;width: 14px; margin-top: 3px; display: block;background: var(--radio_off_icon) no-repeat;background-size:14px;}
.radio_style input:checked ~ .custom_radio::after {content: "";display: block;width: 14px;height: 14px;background: var(--radio_on_icon) no-repeat;background-size:14px;}



/*------ LDollar ------*/
.right_box.ldollar{padding:0; }
.ldollar_switch{padding:20px;}
.ldollar_switch_top{display: flex;align-items: center;justify-content: space-between;}
.ldollar_switch_top>label{font-weight: bold; font-size: 1.14rem;}

/* 开关样式 */
.toggle-wrapper {display: flex;justify-content: center;}
.toggle-switch {position: relative;display: inline-block;width: 40px;height: 20px;}
/* 隐藏原生复选框 */
.toggle-switch input {opacity: 0;width: 0;height: 0;}
/* 滑动轨道 */
.slider {position: absolute;cursor: pointer;top: 0;left: 0;right: 0;bottom: 0;transition: .4s;
    border-radius: 20px;background-color:var(--color-white-bg); background-color: var(--cart_border-color);
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.1);}
/* 开关圆形按钮 */
.slider:before {position: absolute;content: "";height: 16px;width: 16px;left: 2px;top: 2px;
    background-color:var(--color-white-bg);transition: .4s;
    border-radius: 50%;box-shadow: 0 2px 5px rgba(0,0,0,0.2);}
/* 当复选框被选中时的样式 */
input:checked + .slider {background-color:var(--color-light_brown);}
input:checked + .slider:before { transform: translateX(20px);}

.ldollar_switch{ display: flex; flex-direction: column; gap:10px;}
.ldollar_switch>p{margin:0; padding:0; color: var(--color-dark_brown); font-size: 1rem; line-height:1.1rem;}
.ldollar_switch>p b{color: var(--color-light_brown); padding:0 5px;}
.ldollar_input{background: var(--cart_bg-color); padding:20px; display: none; 
    align-items: center; gap:15px; border-bottom-left-radius:10px;  border-bottom-right-radius:10px;}
.ldollar_input.show{display: flex;}
.ldollar_input>span{font-size:1rem; white-space:nowrap;}
.ldollar_input>input{width:100%; transition: var(--all-transition); border: 1px solid var(--cart_border-color); height:34px; padding:0 10px; border-radius:var(--border-radius);}
.ldollar_input>input::placeholder{color:var(--font-light_gray);}
.ldollar_input>input:focus-visible{border:1px solid var(--color-light_brown); outline:none;}


/*------ 結算明細 ------*/
.settlement{display: flex; gap:15px;flex-direction: column; transition: var(--all-transition); max-height: calc(100% - 90px - 465px); overflow-y: auto;}
.settlement::-webkit-scrollbar{display: none;}
.settlement>label{font-size: 1.14rem; font-weight: bold; width:100%;}
.settlement_img ul{display: flex; gap:9.5px; transition: var(--all-transition); 
    flex-wrap: wrap; width:100%; height:114px; overflow: hidden;}
.settlement_img ul.more_img{height:auto;}
.settlement_img ul>li{width:52px; height:52px; background: var(--product-img_bg); border-radius: var(--border-radius);
display: flex; align-items: center; justify-content: center; overflow: hidden;}
.settlement_img ul>li img{max-width: 100%; max-height:100%;}
.settlement_img>span{display: flex; cursor: pointer; transition: var(--all-transition); gap:5px; align-items: center; justify-content: center; width:100%; margin-top:15px; font-size:0.85rem; color: var(--font-light_gray);}
.settlement_img>span:hover{opacity: 0.8;}
.settlement_img>span::after{content: ""; width:10px; height:10px; background: var(--settlement_more_on) center no-repeat; background-size: 10px;}
.settlement_img>span.retract::after{content: ""; width:10px; height:10px; background: var(--settlement_more_off) center no-repeat; background-size: 10px;}
.settlement_ul{display: flex;flex-direction: column; gap:15px; width:100%;}
.settlement_ul li{width:100%; display: flex; justify-content: space-between; font-size: 1rem;}
.settlement_ul li>label,.settlement_ul li>span{color: var(--color-black);}
.settlement_ul li>label b{color: var(--remind-red); margin-right:5px;}
.settlement_ul li>span i{font-style: normal;color: var(--remind-red);}
.total{width:100%; display: flex; justify-content: space-between;}
.total>.span_label{font-weight: bold; color: var(--color-black); display: flex;flex-direction: column; gap:5px;}
.total>.span_label label{line-height: 1.28rem;}
.total>.span_label i{display: none; font-size: 1rem; cursor: pointer; transition: var(--all-transition); font-weight: normal; font-style: normal;}
.total>.span_label i:hover{opacity: 0.8;}
.total>.span_label i::after{content: ""; width:10px; height:10px; background: var(--more_top_icon) center no-repeat; background-size: 10px;}
.total>.span_label i.on::after{transform: rotate(180deg);}
.total>.overall{font-size:1.28rem; font-weight: bold; color: var(--color-light_brown);line-height:1.28rem;}
.confirm_payment{background: var(--color-black-bg); color: var(--color-white); border-radius: var(--border-radius);
width:100%; height:50px; border: 0; font-size:1.14rem; transition: var(--all-transition); cursor: pointer;}
.confirm_payment:hover{opacity: 0.8;}
.total_payment{display: flex;flex-direction: column; gap: 20px;}




/*------ 彈窗 ------*/
.cart_pop{width:100vw; height: 100vh; position: fixed; left:0; top:0; 
    background: var(--color-black-transparent); display: flex; 
    align-items: center; justify-content: center;backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);}
.cart_pop_box{background: var(--color-white-bg); padding:20px; border-radius:10px; width:40%; min-width:500px; display: flex; flex-direction: column; gap:20px;}
.pop_product_box{display: flex; gap:15px;}
.pop_product_img{width:80px; height:80px; background: var(--product-img_bg); border-radius: var(--border-radius);}
.pop_product{display: flex; flex-direction: column; gap: 10px; width:calc(100% - 90px);}
.pop_product>label{font-size:1rem; color: var(--color-black);
display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;text-overflow: ellipsis;}
.pop_product>span{font-size:1rem; color:var(--font-light_gray);
display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;text-overflow: ellipsis;}
.pop_product_price{display: flex; gap:10px; align-items: flex-end;}
.pop_product_price>span{font-size: 1.14rem; font-weight:bold;}

.coupons_win{overflow-y: auto; max-height:60vh; display: flex; gap:10px; flex-direction: column;}
.coupons_win .coupons_label>label{width: calc(100% - 36px);}
.discounted_activities>label{display:flex; font-size:1.14rem; align-items: center; gap:5px;}
.discounted_activities>label b{font-size: 20px; color: var(--color-light_brown);}
.discounted_activities>label input {display: none;}
.discounted_activities .custom_radio {height: 14px; margin-right: 5px; margin-top: 2px; width: 14px;display: block;background: var(--radio_off_icon) no-repeat;background-size:14px;}
.discounted_activities>label input:checked ~ .custom_radio::after {content: "";display: block;width: 14px;height: 14px;background: var(--radio_on_icon) no-repeat;background-size:14px;}
.discounted_activities span{font-size: 1rem;}
.discounted_activities span>i{color: var(--color-light_brown); font-style: normal; margin:0 5px; font-size:1.1rem;}
.discounted_activities>label>i{padding:6px 8px;line-height: 1.14rem;font-size: 1.14rem;border-bottom-left-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius);color: var(--color-white);background: var(--color-light_brown); font-style: normal;}
.cart_pop_box{position: relative;}
.pop_cancel{background: var(--color-white-bg); cursor: pointer; width:50px; height:50px; border-radius:50px; 
    transition: var(--all-transition); opacity:0.6; position: absolute; top: calc(100% + 30px); 
    left:calc(50% - 25px); display: flex; align-items: center; justify-content: center;}
.pop_cancel:hover{opacity:1;}
.pop_cancel::before{width:40%; height:40%; content: ""; background:var(--pop_cancel) no-repeat; background-size:100%; display: block;}
.cart_pop_box ul{display: flex; flex-direction: column; gap:20px;}
.discounted_activities{border-bottom: 1px solid var(--cart_border-color); padding-bottom:20px;}
.discounted_activities:last-child{border: 0;}

.display_coupons{padding:10px; background: var(--cart_bg-color); border-radius: var(--border-radius); gap:10px;}

/*20260122*/
.display_coupons>label,.coupons_title>label{font-size: 1.14rem;font-weight: bold;color: var(--color-black);display: flex;justify-content: space-between;}
.coupons_title{display: flex;}
.coupons_title>span{display: none;}
/*20260122*/

.coupons_label{display: flex; align-items: center; padding:10px 0; border-bottom: 1px solid var(--cart_border-color);}
.coupons_label:last-child{padding-bottom:0; border: 0;}
.coupons_p,.expiration_date{font-size: 1rem; color: var(--font-light_gray); width:calc(100% - 36px);}
.coupons_p p,.coupons_win .radio_style>p{font-size: 1.14rem; color: var(--color-black); margin:0;}
.coupons_p p>b,.coupons_win .radio_style>p>b{color: var(--color-light_brown); font-size: 1.42rem; padding:0 5px; line-height: 1.14rem;}
.coupons_label>span{background: var(--pay_receiving_help) center no-repeat; width:16px; height:16px; 
    background-size: 16px; padding:10px; cursor: pointer;}





/*------ 活動產品列表彈窗-開始 ------*/
/* 遮罩层 */
.overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #0000008c;
    backdrop-filter: blur(4px);
    display: none;
    z-index: 1000;
}

/* 弹窗 */
.products_pop_drawer {
    position: fixed;
    top: 0;
    right: -60vw;
    /* 初始位置在屏幕外 */
    width: 60vw;
    height: 100vh;
    background: var(--color-white-bg);
    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.15);
    z-index: 1001;
    display: flex;
    flex-direction: column;
    transition: right 0.3s cubic-bezier(0.23, 1, 0.32, 1);
    gap: 20px;
    border-top-left-radius: var(--cart-div_radius);
    border-bottom-left-radius: var(--cart-div_radius);
}

.products_pop_drawer.active {
    right: 0;
    /* 滑入屏幕 */
}

/* 弹窗标题 */
.pop_drawer_header {
    padding: 20px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-size: 1.14rem;
    gap: 5px;
    padding-bottom: 0;
}

.pop_drawer_header b {
    padding: 8px;
    line-height: 1.14rem;
    font-size: 1.14rem;
    border-bottom-left-radius: var(--border-radius);
    border-top-right-radius: var(--border-radius);
    color: var(--color-white);
    background: var(--color-light_brown);
}

/* 搜索区域 */
.pop_search-container {
    padding: 0 20px;
    position: sticky;
    top: 0;
    z-index: 10;
}

.pop_search-box {
    display: flex;
    align-items: center;
    height: 46px;
    border-bottom: 1px solid var(--cart_border-color);
}

.pop_search-box input {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    font-size: 1.14rem;
    height: 100%;
    padding: 0;
}

.pop_search-icon {
    width: 46px;
    height: 46px;
    background: var(--pop_search) no-repeat center;
    background-size: 16px;
    cursor: pointer;
    transition: var(--all-transition);
}

.pop_search-icon:hover {
    opacity: 0.8;
}


/* 产品列表 */
.pop_products_container {
    flex: 1;
    overflow-y: auto;
    padding: 0 20px 20px;
}

.products-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
    margin-top: 15px;
}

/* 20260122 */
.pop_product_card {
    border: 1px solid var(--cart_border-color);
    border-radius: var(--border-radius);
    padding: 10px;
    cursor: pointer;
    transition: var(--all-transition);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.product_information{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.product_information a {
    text-decoration: none;
}

.pop_product_card:hover {
    transform: translateY(-4px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}

.product_information.selected {
    border: 0;
    background: var(--product-img_bg);
}

.exchange_price{
    display: flex; align-items: center; gap:10px;
}
.exchange_price>b{font-size: 1.14rem;}
/* 20260122 */

/* 选择按钮 */

.select_pop_btn {
    background: var(--color-black-bg);
    color: var(--color-white);
    border-radius: var(--border-radius);
    width: auto;
    padding: 5px 20px;
    border: 0;
    font-size: 1.14rem;
    transition: var(--all-transition);
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 10px 0;
}

.select_pop_btn:hover{
    opacity: 0.8;
}

.select_pop_btn::before {
    content: "";
    width: 14px;
    height: 14px;
    background: var(--pop_required_icon) no-repeat center;
    background-size: 14px;
    display: none;
}

.pop_product_card.selected .select_pop_btn {
    background: var(--product-img_bg);
    border-color: var(--product-img_bg);
    color: var(--color-dark_brown);
}

.pop_product_card.selected .select_pop_btn::before {
    display: block;
}


.pop_product-image {
    width: 100%;
    position: relative;
    overflow: hidden;
    border-radius: var(--border-radius);
}

.pop_product-image::before {
    content: "";
    display: block;
    padding-top: 100%;
}

.pop_product-image>img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: var(--all-transition);
}

.pop_product_card:hover .pop_product-image img {
    transform: scale(1.05);
}

.product-brand {
    font-weight: 600;
    font-size: 1rem;
    color: var(--color-black);
}

.product-name {
    text-decoration: none;
    font-size: 1rem;
    color: var(--color-black);
    line-height: 1.14rem;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
}

/* 底部按钮 */
.pop_drawer_footer {
    padding: 20px;
    border-top: 1px solid var(--cart_border-color);
    display: flex;
    justify-content: flex-end;
    gap: 15px;
}

.pop_btn {
    padding: 10px;
    min-width: 80px;
    border-radius: var(--border-radius);
    font-size: 1rem;
    cursor: pointer;
    transition: var(--all-transition);
    font-size: 1rem;
}

.btn-close {
    background: var(--color-white-bg);
    color: var(--color-black);
    border: 1px solid var(--cart_border-color);
}

.btn-close:hover {
    background: var(--product-img_bg);
    border: 1px solid var(--cart_button-hoverborder);
}


.btn-confirm {
    background: var(--color-black-bg);
    color: var(--color-white);
    border: 1px solid var(--color-black-bg);
}

.btn-confirm:hover {
    opacity: 0.8;
}

/* 滚动锁定时的body样式 */
body.no-scroll {
    overflow: hidden;
    position: fixed;
    width: 100%;
    height: 100%;
}
/*------ 活動產品列表彈窗-結束 ------*/



/*20260122*/
/*--------------- 通用樣式-開始 ---------------*/
/* 通用輸入框樣式 */
.input_field {
    width: 100%;
    border: 1px solid var(--cart_border-color);
    border-radius: var(--border-radius);
    height: 40px;
    margin: 0;
    padding: 0 10px;
    box-sizing: border-box;
    transition: var(--all-transition);
}

.input_field:focus-visible {
    outline: none;
    box-shadow: 0 0 2px 2px var(--color-input_focus);
}

/* 通用placeholder樣式 */
::placeholder {
    color: #898989;
    opacity: 1;
}

::-webkit-input-placeholder {
    color: #898989;
}

::-moz-placeholder {
    color: #898989;
    opacity: 1;
}

:-ms-input-placeholder {
    color: #898989;
}

:-moz-placeholder {
    color: #898989;
}

/* 通用取消按鈕樣式 */
.btn_cancel {
    background: var(--color-white-bg);
    color: var(--color-black);
    border: 1px solid var(--cart_border-color);
}

.btn_cancel:hover {
    background: var(--product-img_bg);
    border: 1px solid var(--cart_button-hoverborder);
}

/* 通用確認按鈕樣式 */
.btn_confirm {
    background: var(--color-black-bg);
    color: var(--color-white);
    border: 1px solid var(--color-black-bg);
}

.btn_confirm:hover {
    opacity: 0.8;
}
/*--------------- 通用樣式-結束 ---------------*/

/*------ 兌換優惠券彈窗-開始 ------*/
.redemption_code{display: flex; flex-direction: column; gap: 5px;}
#redeem_coupon .cart_pop_box{width:auto; align-items: center; overflow: hidden;}
#redeem_coupon .coupons_win{width:100%; overflow: unset; gap:20px;}
.failure_notification{
    color: var(--remind-red);
    font-size: 0.85rem;
    padding:0 10px;
}
.success_notification{
    width: 100%;
    height: 100%;
    background-color: var(--color-white-transparent);
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    gap:10px;
    font-size:1.18rem;
    opacity: 0;
    z-index:999;
    pointer-events: none;
    visibility: hidden;
    transition: var(--all-transition);
}
.success_notification.success{
    opacity: 1;
    pointer-events: all;
    visibility: visible;
}
.success_notification::before{
    background: var(--radio_on_icon) no-repeat;
    content: "";
    width:34px;
    height: 34px;
    background-size: 34px;
}
.footer_pop_btn{display: flex; gap:20px; justify-content: center;}
/*------ 兌換優惠券彈窗-結束 ------*/