/* Thanh Digital - cart and checkout styles, extracted from style.css. */
/* CSS dùng chung cho thanh toán và giỏ hàng–thanh toán (trang 10, 3777).
 * Điện thoại: họ tên và số điện thoại cùng hàng; địa chỉ và email rộng toàn hàng. */
body:is(.page-id-10, .page-id-3777) :is(#order_review tr.cart-subtotal, #order_review tr.woocommerce-shipping-totals, #payment li.payment_method_bacs, #payment li.payment_method_cheque, #billing_country_field, #ship-to-different-address, .woocommerce-shipping-fields .shipping_address) { display: none !important; }
body.page-id-3777 form.ux-cart-coupon, body.page-id-10 :is(.woocommerce-cart-form .coupon, .wc-proceed-to-checkout) { display: none !important; }
body:is(.page-id-10, .page-id-3777) #customer_details .woocommerce-billing-fields__field-wrapper { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
body:is(.page-id-10, .page-id-3777) :is(#billing_first_name_field, #billing_phone_field, #billing_address_1_field, #billing_email_field) { float: none !important; min-width: 0; width: auto !important; max-width: none !important; margin: 0 !important; }
body:is(.page-id-10, .page-id-3777) #billing_first_name_field { grid-area: 1 / 1; }
body:is(.page-id-10, .page-id-3777) #billing_phone_field { grid-area: 1 / 2; }
body:is(.page-id-10, .page-id-3777) #billing_address_1_field { grid-area: 2 / 1 / 3 / -1; }
body:is(.page-id-10, .page-id-3777) #billing_email_field { grid-area: 3 / 1 / 4 / -1; }
@media (min-width: 550px) {
  body:is(.page-id-10, .page-id-3777) #billing_address_1_field { grid-area: 2 / 1; }
  body:is(.page-id-10, .page-id-3777) #billing_email_field { grid-area: 2 / 2; }
}
body.page-id-10 :is(#billing_first_name_field, #billing_phone_field, #billing_address_1_field, #billing_email_field) :is(.woocommerce-input-wrapper, input) { display: block; width: 100% !important; max-width: 100% !important; }
@media (min-width: 850px) {
  body:is(.page-id-10, .page-id-3777) .woocommerce .row:has(.woocommerce-cart-form) > .col:has(.woocommerce-cart-form) { flex: 0 0 100%; width: 100%; max-width: 100%; }
  body:is(.page-id-10, .page-id-3777) .woocommerce .row:has(.woocommerce-cart-form) > .col:has(.cart-collaterals) { display: none !important; }
  body:is(.page-id-10, .page-id-3777) :is(.woocommerce-cart-form, .woocommerce-cart-form .shop_table) { width: 100%; max-width: 100%; }
}

/* =====================================================
   THANH TOÁN: CÁC BƯỚC ĐẶT HÀNG
   ===================================================== */
body.woocommerce-checkout .checkout-breadcrumbs {  display: flex !important; align-items: stretch !important; justify-content: center !important; gap: 2px !important; width: 100% !important; margin: 12px auto 20px !important; padding: 0 8px !important; }
body.woocommerce-checkout .checkout-breadcrumbs > a, body.woocommerce-checkout .checkout-breadcrumbs > .checkout-breadcrumb {  display: flex !important; flex: 1 1 0 !important; align-items: center !important; justify-content: center !important; min-width: 0 !important; max-width: 33.333% !important; min-height: 46px !important; margin: 0 !important; padding: 7px 8px !important; background: #edf0f4 !important; color: #475569 !important; font-size: 12px !important; font-weight: 700 !important; line-height: 1.15 !important; text-align: center !important; white-space: normal !important; overflow-wrap: anywhere !important; overflow: hidden !important; clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 0 100%, 10px 50%); }
body.woocommerce-checkout .checkout-breadcrumbs > a:first-child, body.woocommerce-checkout .checkout-breadcrumbs > .checkout-breadcrumb:first-child {  padding-left: 5px !important; background: #c62828 !important; color: #fff !important; clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 0 100%); }
@media (max-width: 549px) {
  body.woocommerce-checkout .checkout-breadcrumbs {  gap: 1px !important; margin: 8px auto 16px !important; padding: 0 3px !important; }
  body.woocommerce-checkout .checkout-breadcrumbs > a, body.woocommerce-checkout .checkout-breadcrumbs > .checkout-breadcrumb {  min-height: 44px !important; padding: 5px !important; font-size: 9px !important; line-height: 1.1 !important; clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 50%, calc(100% - 8px) 100%, 0 100%, 8px 50%); }
  body.woocommerce-checkout .checkout-breadcrumbs > a:first-child, body.woocommerce-checkout .checkout-breadcrumbs > .checkout-breadcrumb:first-child {  padding-left: 4px !important; clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 50%, calc(100% - 8px) 100%, 0 100%); }
}

/* =====================================================
   TRANG XÁC NHẬN ĐƠN HÀNG HOÀN TẤT
   ===================================================== */

/* 1. Ẩn các thành phần không cần thiết */
body.woocommerce-order-received h2, body.woocommerce-order-received .woocommerce-cart-form, body.woocommerce-order-received .cart-empty, body.woocommerce-order-received .return-to-shop, body.woocommerce-order-received .woocommerce-order-details, body.woocommerce-order-received .woocommerce-customer-details, body.woocommerce-order-received p:not(.woocommerce-notice--success) {  display: none !important; }

/* 2. ÉP RỘNG TOÀN BỘ CỘT TRÊN TRANG NÀY — không cần :has() */
body.woocommerce-order-received .row > :is(.col, [class*="col-"], [class*="large-"], [class*="medium-"], [class*="small-"]) {  flex: 0 0 100% !important; width: 100% !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }

/* 3. Khối xác nhận — căn giữa màn hình, rộng 560px */
body.woocommerce-order-received .woocommerce-order {  display: flex !important; flex-direction: column !important; align-items: stretch !important; width: min(560px, calc(100vw - 32px)) !important; max-width: min(560px, calc(100vw - 32px)) !important; margin: 32px auto !important; padding: 0 !important; float: none !important; position: static !important; }

/* 4. Hai khối con chiếm toàn bộ chiều rộng */
body.woocommerce-order-received .woocommerce-order > .woocommerce-notice--success, body.woocommerce-order-received .woocommerce-order > .woocommerce-order-overview {  width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box; float: none !important; margin-left: 0 !important; margin-right: 0 !important; }

/* 5. Khối "Cảm ơn bạn..." — viền trên + 2 bên */
body.woocommerce-order-received .woocommerce-order > .woocommerce-notice--success, body.woocommerce-order-received .woocommerce-order > .woocommerce-order-overview { border: 1px solid #e5e7eb; background: #fff; box-shadow: 0 8px 24px rgba(0, 0, 0, .08); }
body.woocommerce-order-received .woocommerce-order > .woocommerce-notice--success { margin: 0 !important; padding: 22px 24px 8px; border-bottom: 0; }

/* 6. Khối thông tin đơn — viền dưới + 2 bên */
body.woocommerce-order-received .woocommerce-order > .woocommerce-order-overview { margin: 0 !important; padding: 4px 24px 22px; border-top: 0; }

/* 7. Đặt lại danh sách thông tin đơn hàng để xếp dọc */
body.woocommerce-order-received .woocommerce-order-overview {  display: block !important; list-style: none !important; }
body.woocommerce-order-received .woocommerce-order-overview li {  display: block !important; float: none !important; width: 100% !important; margin: 0 0 12px 0 !important; padding: 0 !important; border: 0 !important; }

/* 8. Giao diện điện thoại */
@media (max-width: 549px) {
  body.woocommerce-order-received .woocommerce-order {  width: calc(100vw - 24px) !important; max-width: calc(100vw - 24px) !important; margin: 20px auto !important; }
  body.woocommerce-order-received .woocommerce-order > .woocommerce-notice--success {  padding: 18px 16px 8px; font-size: 14px; line-height: 1.55; }
  body.woocommerce-order-received .woocommerce-order > .woocommerce-order-overview {  padding: 4px 16px 18px; }
  body.woocommerce-order-received .woocommerce-order-overview li {  margin-bottom: 10px !important; }
}

/* =====================================================
   Ẩn thông báo thêm sản phẩm trên giỏ hàng và thanh toán
   ===================================================== */
body.woocommerce-cart .woocommerce-message, body.woocommerce-checkout .woocommerce-message {  display: none !important; }