/* =========================================================
   TRANG GIỎ HÀNG GỘP CHECKOUT - SurfaceShop
   File này chỉ được nạp trên trang Giỏ hàng (is_cart()).
   ========================================================= */

/* ===== KHUNG ===== */
#content {
    max-width: 1000px !important;
    margin: 30px auto !important;
    padding: 0 !important;
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, .06);
    overflow: hidden;
    box-sizing: border-box;
}

#content .row > .col,
#content .row > .cart-collaterals {
    flex-basis: 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    border-left: 0 !important;
    padding: 16px 25px 0 !important;
}

/* ===== ẨN CÁC PHẦN THỪA ===== */
.woocommerce-checkout-review-order-table thead,
.woocommerce-checkout-review-order-table tbody,
#order_review_heading,
.woocommerce-privacy-policy-text,
.woocommerce-additional-fields {
    display: none !important;
}

/* ===== TIÊU ĐỀ ===== */
#content h3,
.woocommerce-billing-fields h3 {
    font-size: 16px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: .3px;
    margin: 0 0 14px !important;
    padding-top: 6px;
    color: #222;
}

/* ===== MÃ ƯU ĐÃI: 1 HÀNG ===== */
#content form.ux-cart-coupon .coupon {
    display: flex !important;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 10px;
}

#content form.ux-cart-coupon .coupon .widget-title {
    flex: 0 0 100%;
    margin: 0 0 8px !important;
}

#content form.ux-cart-coupon .coupon input#coupon_code {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
}

#content form.ux-cart-coupon .coupon button {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 130px;
    margin: 0 !important;
    padding: 0 28px !important;
}

/* ===== KHỐI TỔNG TIỀN ===== */
#content .col-inner.has-border {
    border: 0 !important;
    background: #fafafa;
    border-radius: 8px;
    padding: 16px !important;
    margin-bottom: 20px;
}

.woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout-review-order-table tfoot td {
    padding: 10px 0 !important;
    border-bottom: 1px solid #eee;
}

.woocommerce-checkout-review-order-table tfoot .order-total td {
    font-size: 18px;
    font-weight: 700;
}

/* ===== TÊN + SĐT CÙNG HÀNG ===== */
#content .woocommerce-billing-fields__field-wrapper {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0 16px;
}

#content .woocommerce-billing-fields__field-wrapper .form-row {
    width: auto !important;
    max-width: none !important;
    float: none !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
    clear: none !important;
}

#content #billing_first_name_field {
    flex: 1 1 calc(50% - 8px) !important;
    min-width: 0 !important;
    order: 1;
}

#content #billing_phone_field {
    flex: 1 1 calc(50% - 8px) !important;
    min-width: 0 !important;
    order: 2;
}

#content #billing_address_1_field {
    flex: 1 1 100% !important;
    order: 3;
}

#content #billing_email_field {
    flex: 1 1 100% !important;
    order: 4;
}

/* ===== Ô NHẬP ===== */
#content input[type="text"],
#content input[type="tel"],
#content input[type="email"],
#content textarea {
    border: 1px solid #ddd !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    padding: 12px 14px !important;
    height: auto !important;
    font-size: 15px;
    width: 100%;
}

#content input:focus {
    border-color: #d70018 !important;
}

#content label {
    font-size: 14px;
    font-weight: 600;
}

/* ===== PHƯƠNG THỨC THANH TOÁN ===== */
.woocommerce-checkout-payment {
    background: transparent !important;
    padding: 0 !important;
}

.wc_payment_methods {
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 6px 14px !important;
    margin-bottom: 16px !important;
}

.wc_payment_method label {
    font-weight: 600 !important;
}

.payment_box {
    background: transparent !important;
    font-size: 13px;
    color: #666;
}

.payment_box::before {
    display: none !important;
}

/* ===== NÚT ĐẶT HÀNG ===== */
#place_order {
    width: 100% !important;
    background: #d70018 !important;
    border: 0 !important;
    border-radius: 8px !important;
    padding: 16px !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: .5px;
    margin-bottom: 25px !important;
}

#place_order:hover {
    background: #b80014 !important;
}

/* ===== BỎ CỘT TẠM TÍNH TRONG BẢNG GIỎ ===== */
#content .woocommerce-cart-form__contents th.product-subtotal,
#content .woocommerce-cart-form__contents td.product-subtotal {
    display: none !important;
}

/* ===== Ô SỐ LƯỢNG ===== */
#content .woocommerce-cart-form__contents td.product-quantity {
    display: table-cell !important;
    visibility: visible !important;
    text-align: center;
}

#content td.product-quantity .ux-quantity,
#content td.product-quantity .quantity {
    display: inline-flex !important;
    visibility: visible !important;
    align-items: stretch;
    opacity: 1 !important;
    border: 1px solid #ddd;
    border-radius: 8px;
    overflow: hidden;
}

#content td.product-quantity input.qty {
    display: block !important;
    width: 50px !important;
    min-width: 50px !important;
    height: 38px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    text-align: center;
    font-size: 15px;
    box-shadow: none !important;
    -moz-appearance: textfield;
}

#content td.product-quantity input.qty::-webkit-outer-spin-button,
#content td.product-quantity input.qty::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

#content td.product-quantity .ux-quantity__button {
    display: block !important;
    width: 36px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #f5f5f5 !important;
    color: #333 !important;
    font-size: 16px;
    line-height: 38px;
    opacity: 1 !important;
}

#content td.product-quantity .ux-quantity__button:hover {
    background: #ebebeb !important;
}

/* ===== CÁC ĐIỀU CHỈNH KHÁC ===== */
dl.variation {
    display: none;
}

.woocommerce-notices-wrapper .success-color {
    color: #dd042b;
}

#content a.woocommerce-remove-coupon {
    display: none !important;
}

.woocommerce-checkout div#content .row.row-large {
    padding: 0 0 1em;
}

.shop_table .actions {
    padding: 0;
}

/* ===== NOTICE: CĂN GIỮA + KHUNG ĐỎ ===== */
#content .woocommerce-message,
#content .woocommerce-info,
#content .woocommerce-error,
#content .message-wrapper {
    text-align: center !important;
    border: 1px solid #d70018 !important;
    border-radius: 8px !important;
    background: #fff5f5 !important;
    padding: 14px 18px !important;
    margin: 0 0 18px !important;
    color: #222 !important;
}

#content .woocommerce-message::before,
#content .woocommerce-info::before {
    position: static !important;
    display: inline !important;
    margin-right: 6px;
}

#content .woocommerce-message .button,
#content .woocommerce-info .button {
    display: none !important;
}

/* ===== NÚT TIẾP TỤC XEM SẢN PHẨM ===== */
.ss-continue-top {
    margin: 0 0 18px;
}

.ss-continue-top .button-continue-shopping {
    margin: 0 !important;
}

/* Ẩn nút cũ nằm dưới bảng giỏ */
#content td.actions .continue-shopping {
    display: none !important;
}

/* ===== DÒNG LƯU Ý TRÊN NÚT ĐẶT HÀNG ===== */
.ss-order-note {
    margin: 0 0 14px !important;
    padding: 12px 14px;
    background: #fff8e6;
    border-left: 3px solid #f0a500;
    border-radius: 6px;
    font-size: 14px;
    line-height: 1.6;
    color: #444;
}

.ss-order-note strong {
    color: #d70018;
}

/* ===== MOBILE ===== */
@media (max-width: 640px) {
    #content {
        margin: 0 auto !important;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    #content .row > .col,
    #content .row > .cart-collaterals {
        padding: 0 14px !important;
    }

    #content #billing_first_name_field,
    #content #billing_phone_field {
        flex: 1 1 100% !important;
    }

    #content form.ux-cart-coupon .coupon input#coupon_code {
        flex: 1 1 100% !important;
    }

    #content form.ux-cart-coupon .coupon button {
        width: 100% !important;
    }
}