/* Checkout page */
ul.cms-checkout-breadcrumb {
  color: var(--muted-text);
  font-size: 16px;
  line-height: 24px;
  font-weight: 500;
  text-transform: capitalize;

  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;

  list-style-type: none;
  list-style-position: inside;
}

ul.cms-checkout-breadcrumb li,
ul.cms-checkout-breadcrumb li > * {
  margin: 0;
  display: flex;
  justify-content: flex-start;
  align-items: center;

  color: var(--muted-text);
}

ul.cms-checkout-breadcrumb li:not(.inactive-breadcrumb) > *:hover,
ul.cms-checkout-breadcrumb li.active-breadcrumb > * {
  color: var(--primary-blue);
}

ul.cms-checkout-breadcrumb li,
ul.cms-checkout-breadcrumb li > * {
  gap: 4px;
}

ul.cms-checkout-breadcrumb .breadcrumb-current {
  color: var(--muted-text);
}

ul.cms-checkout-breadcrumb li.inactive-breadcrumb {
  color: var(--muted-text);
}

@media all and (max-width: 468px) {
  ul.cms-checkout-breadcrumb {
    font-size: 14px;
    line-height: 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    gap: 4px;
  }

  ul.cms-checkout-breadcrumb * {
    text-align: left;
  }

  ul.cms-checkout-breadcrumb .material-symbols-outlined {
    font-size: 20px;
  }

  ul.cms-checkout-breadcrumb .material-symbols-outlined:not(.mobile-keep) {
    display: none;
  }
}

.cms-checkout-section {
  border-radius: var(--radius-md);
  padding: 32px;
  border: 1px solid var(--border-default);
  background-color: #fff;
  margin-bottom: 32px;
}

.cms-checkout-step-title {
}

.cms-checkout-step-title .cms-step-number {
  display: inline-block;
  width: 32px;
  height: 32px;
  line-height: 32px;
  border-radius: 50%;
  background-color: var(--primary-blue);
  color: #fff;
  text-align: center;
  font-weight: 600;
  margin-right: 12px;
}

.cms-checkout-step-title .cms-step-text {
  font-size: 20px;
  font-weight: 600;
  color: var(--primary-text);
}

/* Fields */

.cms-checkout-fields .woocommerce-billing-fields p {
  margin-bottom: 0;
}

.cms-checkout-fields .woocommerce-billing-fields {
  border-top: 1px solid var(--border-default);
}
.cms-checkout-fields .woocommerce-billing-fields h3 {
  display: none;
}

.cms-checkout-fields .woocommerce-billing-fields label {
  color: var(--primary-text);
  font-size: 16px;
  line-height: 24px;
  font-weight: 500;
}

.cms-checkout-fields .woocommerce-billing-fields span.required {
  color: var(--accent-danger);
}

.cms-checkout-fields .woocommerce-billing-fields :where(input, select, textarea) {
  padding: 8px 16px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  box-shadow: none;
}

.cms-checkout-fields .woocommerce-billing-fields .select2-container,
.cms-checkout-fields .woocommerce-billing-fields .select2-container span.selection,
.cms-checkout-fields .woocommerce-billing-fields .select2-container span.select2-selection {
  border-radius: var(--radius-lg) !important;
  /* overflow: hidden !important; */
}

.select2-container--open .select2-dropdown--below {
  border-radius: 10px;
}

.select2-search--dropdown {
  padding: 4px 8px;
  border-radius: 10px;
}

.select2-search--dropdown input.select2-search__field {
  padding: 4px 8px;
  border-radius: 10px;
}

span.select2-results {
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.cms-checkout-fields .cms-checkout-fields .woocommerce-billing-fields input:focus {
  border-color: var(--primary-blue);
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.3);
  outline: none;
}

.woocommerce-input-wrapper textarea[name="order_comments"] {
  border-radius: var(--radius-lg);
  margin: 0;
}

.woocommerce-additional-fields > h3 {
  display: none;
}

.woocommerce-additional-fields {
  margin-top: 20px;
}

.cms-checkout-section.cms-review-order {
  padding: 0;
}

.cms-checkout-section.cms-review-order :where(.checkout-sidebar, h3#order_review_heading) {
  padding: 16px 24px;
}

.cms-checkout-section.cms-review-order h3#order_review_heading {
  background-color: var(--surface-alt);
  border-bottom: 1px solid var(--border-default);
  border-top-left-radius: 24px;
  border-top-right-radius: 24px;
  color: var(--primary-text);
  font-size: 18px;
  line-height: 28px;
  font-weight: 700;
  text-transform: none;
  margin: 0;
}

.checkout-sidebar .shop_table thead {
  display: none;
}

.cms-thumb-wrapper {
  width: 80px;
  height: 80px;
  padding: 4px;
  border-radius: var(--radius-lg);
  background-color: transparent;
  border: 1px solid var(--border-default);
}

.cms-thumb-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: var(--radius-md);
}

/* ===== Hàng sản phẩm (order review): ảnh + tên + giá 1 hàng, "Gói mua/Quà tặng" full-width hàng dưới — chuẩn mọi bề rộng ===== */
/* table + tbody -> block full width để hàng grid ăn hết bề rộng (tránh table auto-layout bóp tên 1 chữ/dòng).
   tfoot giữ display:table để các dòng tổng (nhãn|giá trị) vẫn 2 cột chuẩn. */
#order_review .shop_table { display: block; width: 100%; }
#order_review .shop_table thead { display: none; }
#order_review .shop_table tbody { display: block; width: 100%; }
#order_review .shop_table tfoot { display: table; width: 100%; }
/* Hàng SP: tr = block full-width, giá đặt absolute góc phải-trên -> thẻ gói/variation tràn HẾT chiều ngang hàng */
#order_review .shop_table tr.cart_item {
  display: block;
  position: relative;
  width: 100%;
  box-sizing: border-box;
  padding: 14px 0;
}
#order_review .shop_table tr.cart_item td.product-name {
  display: grid;
  grid-template-columns: 64px 1fr; /* ảnh + tên; meta/thẻ span full bên dưới */
  column-gap: 10px;
  row-gap: 8px;
  align-items: start;
  width: 100%;
  min-width: 0;
}
#order_review .shop_table tr.cart_item .cms-product-name-wrapper { padding-right: 96px; } /* chừa chỗ cho giá absolute */
#order_review .shop_table tr.cart_item td.product-total { position: absolute; top: 14px; right: 0; text-align: right; padding: 0; border: 0; white-space: nowrap; }
#order_review .shop_table tr.cart_item .cms-thumb-wrapper { width: 64px; height: 64px; }
#order_review .shop_table tr.cart_item .cms-product-name-wrapper { min-width: 0; }

#order_review .shop_table tr.cart_item .cms-product-name {
  color: var(--primary-text);
  font-size: 15px;
  line-height: 1.35;
  font-weight: 600;
  margin-bottom: 4px;
}
#order_review .shop_table tr.cart_item .cms-product-quantity {
  color: var(--muted-text);
  font-size: 13.5px;
  line-height: 1.4;
}

/* Gói mua / Quà tặng — HỘP TO RÕ, full chiều rộng (khách thấy rõ mua gói gì, tặng gì) */
/* CARD "GÓI ĐÃ CHỌN" — to, rõ, khách biết ngay mua gói nào + quà gì (nổi bật xanh lá) */
#order_review .shop_table tr.cart_item .variation {
  grid-column: 1 / -1;
  margin: 8px 0 0;
  padding: 12px 14px;
  background: var(--primary-blue-soft);
  border: 1px solid var(--primary-blue-border);
  border-left: 4px solid var(--primary-blue);
  border-radius: 10px;
  line-height: 1.45;
}
#order_review .shop_table tr.cart_item .variation::before {
  content: "📦 Gói bạn đã chọn";
  display: block;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: .4px;
  text-transform: uppercase;
  color: var(--primary-blue);
  margin-bottom: 8px;
}
#order_review .shop_table tr.cart_item .variation dt {
  display: block;
  float: none !important;
  clear: none !important;
  width: auto !important;
  font-weight: 600;
  font-size: 11.5px;
  text-transform: uppercase;
  letter-spacing: .3px;
  color: var(--muted-text);
  margin: 8px 0 1px;
}
#order_review .shop_table tr.cart_item .variation dd { float: none !important; width: auto !important; }
#order_review .shop_table tr.cart_item .variation dt:first-of-type { margin-top: 0; }
#order_review .shop_table tr.cart_item .variation dd {
  display: block;
  margin: 0;
  font-size: 14.5px;
  font-weight: 700;
  color: var(--primary-text);
}
#order_review .shop_table tr.cart_item .variation dd p { display: inline; margin: 0; }
/* Quà tặng: nhấn màu xanh lá + icon để thấy giá trị khuyến mãi */
#order_review .shop_table tr.cart_item .variation dt.variation-Qutng { color: #1a7f37; }
#order_review .shop_table tr.cart_item .variation dt.variation-Qutng::before { content: "🎁 "; }
#order_review .shop_table tr.cart_item .variation dd.variation-Qutng,
#order_review .shop_table tr.cart_item .variation dd.variation-Qutng p { color: #1a7f37; }

#order_review .shop_table tr.cart_item td.product-total .woocommerce-Price-amount {
  font-size: 16px;
  font-weight: 700;
}

/* ===== THẺ GÓI (giống hệt trang SP) — full width trong order review ===== */
#order_review .shop_table tr.cart_item .cms-pkg-card {
  grid-column: 1 / -1;
  width: 100%;
  box-sizing: border-box;
  margin: 8px 0 0;
  padding: 12px 14px;
  background: var(--primary-blue-soft);
  border: 1.5px solid var(--primary-blue);
  border-radius: var(--radius-md, 8px);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
#order_review .cms-pkg-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
#order_review .cms-pkg-title { color: var(--accent-danger); font-size: 18px; font-weight: 900; letter-spacing: .2px; line-height: 1.1; }
#order_review .cms-pkg-chosen { flex: none; display: inline-flex; align-items: center; gap: 3px; font-size: 11px; font-weight: 700; color: #fff; background: var(--primary-blue); border-radius: 999px; padding: 2px 9px; white-space: nowrap; }
#order_review .cms-pkg-sub { font-size: 13px; color: var(--primary-text); font-weight: 600; }
#order_review .cms-pkg-price { color: var(--accent-danger); font-size: 18px; font-weight: 800; line-height: 1.1; margin-top: 4px; }
#order_review .cms-pkg-perunit { font-size: 12px; color: var(--muted-text); }
#order_review .cms-pkg-perunit strong { color: var(--primary-blue); font-weight: 700; }
#order_review .cms-pkg-gift { font-size: 13px; color: #1a7f37; font-weight: 600; margin-top: 3px; line-height: 1.4; overflow-wrap: anywhere; }
#order_review .cms-pkg-gift strong { color: #1a7f37; font-weight: 700; }
#order_review .cms-pkg-foot { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 700; color: #1a7f37; margin-top: 3px; }

tfoot tr.cart-subtotal th,
tfoot tr.cart-subtotal bdi,
tfoot tr.woocommerce-shipping-totals tr th {
  color: var(--muted-text);
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
}

.cms-return-cart {
  display: block;
  text-align: center;
  padding: 16px 24px;
  margin: 12px 0;
}

.cms-return-cart a {
  display: block;
  width: 100%;
  color: var(--muted-text);
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  margin: 0;
  padding: 12px 16px;
  text-transform: unset;
  border: 1px solid transparent;
  border-radius: var(--radius-pill);
  transition: all 0.3s;
}

.cms-return-cart a:hover {
  display: block;
  color: var(--muted-text);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-pill);
  background-color: var(--border-default);
}

/* Payment Methods */
.cms-checkout-payment-methods .cms-list ul.wc_payment_methods {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.cms-checkout-payment-methods .cms-list ul.wc_payment_methods li {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 12px;

  border: 1px solid var(--border-default);
  border-radius: var(--radius-lg);
  padding: 16px;
}

.cms-checkout-payment-methods .cms-list ul.wc_payment_methods li input {
  margin: 0;
  width: 20px;
  height: 20px;
}

.cms-checkout-payment-methods .cms-list ul.wc_payment_methods li label {
  color: var(--primary-text);
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
}

.cms-checkout-payment-methods .cms-list ul.wc_payment_methods li label {
  color: var(--primary-text);
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
}

.cms-checkout-payment-methods .cms-list ul.wc_payment_methods li .payment_box {
  display: block !important;
  color: var(--muted-text);
  font-size: 14px;
  line-height: 20px;
  margin: 0;
}

.cms-checkout-payment-methods .cms-list ul.wc_payment_methods li .material-symbols-outlined {
  font-size: 28px;
  padding: 8px;
  border-radius: var(--radius-pill);
}

.cms-checkout-payment-methods .cms-list ul.wc_payment_methods li .cms-cash {
  color: var(--accent-success);
  background-color: var(--accent-success-bg);
}

.cms-checkout-payment-methods .cms-list ul.wc_payment_methods li .cms-bank {
  color: var(--primary-blue);
  background-color: var(--primary-blue-soft);
}

.cms-checkout-payment-methods .cms-list ul.wc_payment_methods li .cms-bank {
  color: var(--primary-blue);
  background-color: var(--primary-blue-soft);
}
/* Review and Complete Order Button */
.cms-checkout-order-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px;

  color: #fff;
  background-color: var(--primary-blue) !important;
  font-size: 18px;
  line-height: 28px;
  margin: 0;
  padding: 3px;
  white-space: normal;
  width: 100%;
  border-radius: var(--radius-pill);

  box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(23, 115, 207, 0.3) 0px 10px 15px -3px, rgba(23, 115, 207, 0.3) 0px 4px 6px -4px;
}

.cms-checkout-order-wrapper:hover,
.cms-checkout-order-wrapper:hover > button#place_order {
  background-color: var(--primary-blue-hover) !important;
}

.cms-checkout-order-wrapper button {
  margin: 0 !important;
  width: auto !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 1.2em !important;
  font-weight: 600 !important;
  padding: 0 !important;
  text-transform: uppercase;
  transition: unset !important;
}

/* kl 2026-07: Flatsome .button.alt (#1773cf) đè nền button -> tạo hộp lồng màu nhạt.
   Ép button TRONG SUỐT ở mọi state (specificity cao hơn) để nút full 1 màu của wrapper. */
.cms-checkout-order-wrapper #place_order,
.cms-checkout-order-wrapper #place_order.button.alt,
.cms-checkout-order-wrapper #place_order:hover,
.cms-checkout-order-wrapper #place_order:focus,
.cms-checkout-order-wrapper #place_order:active {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

.cms-side-item.cms-support-order.cms-checkout-section {
  padding: 16px !important;
}

.cms-side-item.cms-support-order.cms-checkout-section :where(h4, p) {
  margin: 0;
}

.cms-side-item.cms-support-order.cms-checkout-section .cms-tel {
  color: var(--primary-text);
  font-weight: 700;
}

.woocommerce-privacy-policy-text {
  color: var(--muted-text);
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  text-align: center;
}

.woocommerce-privacy-policy-text a {
  text-decoration: underline;
}
/* ============================================================
   CHECKOUT — MOBILE COMPRESSION (highest conversion stake)
   ============================================================ */
@media (max-width: 768px) {
  .woocommerce-checkout .page-title { font-size: 20px !important; padding: 12px !important; margin: 0 !important; }
  .woocommerce-checkout form.checkout { padding: 0 8px !important; }
  .woocommerce-checkout h3, .woocommerce-checkout #order_review_heading { font-size: 16px !important; margin: 14px 0 8px !important; padding: 0 !important; }
  .woocommerce-billing-fields, .woocommerce-shipping-fields, .woocommerce-additional-fields { padding: 0 !important; }
  .woocommerce-checkout .form-row { margin-bottom: 8px !important; padding: 0 !important; }
  .woocommerce-checkout .form-row label { font-size: 13px !important; margin-bottom: 3px !important; }
  .woocommerce-checkout .form-row input[type=text], .woocommerce-checkout .form-row input[type=email], .woocommerce-checkout .form-row input[type=tel], .woocommerce-checkout .form-row textarea, .woocommerce-checkout .form-row select { font-size: 14px !important; padding: 10px 12px !important; height: auto !important; min-height: 42px !important; }
  .woocommerce-checkout textarea { min-height: 70px !important; }

  /* ĐỒNG BỘ LỀ MỌI BOX = 16px (form 32 / order 4 lệch nhau -> chuẩn hoá) + giảm khoảng cách dọc */
  .cms-checkout-section { margin-bottom: 16px !important; }
  .cms-checkout-customer-info.cms-checkout-section,
  .cms-checkout-payment-methods.cms-checkout-section { padding: 16px !important; }
  .cms-checkout-section.cms-review-order,
  .large-5 .col-inner.cms-review-order { padding: 0 !important; }
  .cms-checkout-section.cms-review-order .checkout-sidebar { padding: 16px !important; }
  #order_review { padding: 0 !important; margin-top: 0 !important; }
  /* Header "Đơn hàng của bạn" bị cắt chữ do mobile ép padding:0 -> trả lại padding + bo góc vừa */
  .cms-checkout-section.cms-review-order h3#order_review_heading {
    padding: 14px 16px !important;
    margin: 0 !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    border-top-left-radius: 6px !important;
    border-top-right-radius: 6px !important;
  }
  #order_review table.shop_table { font-size: 13px !important; }
  #order_review table.shop_table th, #order_review table.shop_table td { padding: 6px 4px !important; }
  /* hàng SP: bỏ padding cell để tên có tối đa bề rộng; giá gọn hơn */
  #order_review .shop_table tr.cart_item td.product-name { padding: 0 !important; column-gap: 8px; grid-template-columns: 58px 1fr; }
  #order_review .shop_table tr.cart_item td.product-total { padding: 0 !important; }
  #order_review .shop_table tr.cart_item .cms-thumb-wrapper { width: 58px; height: 58px; }
  #order_review .shop_table tr.cart_item td.product-total .woocommerce-Price-amount { font-size: 14px !important; }
  #order_review .shop_table tr.cart_item { column-gap: 8px; }
  #order_review .wc_payment_methods .wc_payment_method label { font-size: 13.5px !important; }
  #order_review .payment_box { font-size: 12.5px !important; padding: 8px 12px !important; }
  #place_order { width: 100% !important; padding: 14px 18px !important; font-size: 16px !important; font-weight: 800 !important; height: auto !important; line-height: 1.2 !important; }

  /* Login / coupon prompts */
  .woocommerce-form-login-toggle, .woocommerce-form-coupon-toggle { padding: 8px 10px !important; margin: 6px 0 !important; }
  .woocommerce-form-login-toggle .woocommerce-info, .woocommerce-form-coupon-toggle .woocommerce-info { font-size: 13px !important; padding: 8px 12px !important; }
  .woocommerce-form-login { padding: 12px !important; }
  .checkout_coupon { padding: 12px !important; }
}

/* ===== UPSELL "Hay mua kèm" ===== */
#order_review .cms-upsell-row td { padding: 0 !important; border: 0 !important; }
.cms-upsell { margin: 12px 0; display: flex; flex-direction: column; gap: 8px; }
.cms-upsell-title { font-size: 13px; font-weight: 800; color: var(--primary-text); text-transform: uppercase; letter-spacing: .3px; }
.cms-upsell-title span { color: var(--muted-text); font-weight: 500; text-transform: none; }
.cms-upsell-item {
  display: flex; align-items: center; gap: 12px;
  padding: 10px; border: 1px solid var(--border-default); border-radius: 12px;
  background: #fff; box-shadow: 0 1px 2px rgba(16,24,40,.05);
  transition: box-shadow .15s ease, border-color .15s ease;
}
.cms-upsell-item:hover { border-color: var(--primary-blue); box-shadow: 0 3px 10px rgba(23,115,207,.12); }
.cms-upsell-thumb {
  flex: none; width: 56px; height: 56px; border-radius: 10px; overflow: hidden;
  border: 1px solid var(--border-default); background: #fff;
}
.cms-upsell-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cms-upsell-info { display: flex; flex-direction: column; gap: 5px; min-width: 0; flex: 1; }
.cms-upsell-name {
  font-size: 13px; font-weight: 600; color: var(--primary-text); line-height: 1.3;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.cms-upsell-meta { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px; }
.cms-upsell-variant {
  font-size: 10.5px; font-weight: 600; color: var(--primary-blue);
  background: var(--primary-blue-soft); border-radius: 999px; padding: 2px 8px; white-space: nowrap;
}
.cms-upsell-price { font-size: 15px; font-weight: 800; color: var(--accent-danger); }
.cms-upsell-add {
  flex: none; align-self: stretch; display: inline-flex; align-items: center; gap: 4px;
  border: 0; background: var(--primary-blue); color: #fff;
  font-weight: 700; font-size: 13px; border-radius: 10px;
  padding: 0 14px; min-height: 44px; cursor: pointer; white-space: nowrap;
  box-shadow: 0 2px 6px rgba(23,115,207,.28); transition: background .15s ease, transform .05s ease;
}
.cms-upsell-add:hover { background: #125aa6; }
.cms-upsell-add:active { transform: scale(.97); }
.cms-upsell-add:disabled { opacity: .55; cursor: default; box-shadow: none; }
.cms-upsell-plus { font-size: 17px; line-height: 1; font-weight: 400; }

/* ===== ORDER BUMPS — nâng cấp đơn ===== */
#order_review .cms-bumps-row td { padding: 0 !important; border: 0 !important; }
.cms-bumps { margin: 10px 0; display: flex; flex-direction: column; gap: 8px; }
.cms-bumps-title { font-size: 13px; font-weight: 800; color: var(--primary-text); text-transform: uppercase; letter-spacing: .3px; }
.cms-bumps-title span { color: var(--muted-text); font-weight: 500; text-transform: none; }
.cms-bump {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 10px 12px; border: 1px dashed var(--primary-blue); border-radius: 8px;
  background: var(--primary-blue-soft); cursor: pointer;
}
.cms-bump input { margin: 2px 0 0; flex: none; width: 18px; height: 18px; accent-color: var(--primary-blue); }
.cms-bump-body { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.cms-bump-label { font-size: 13.5px; font-weight: 700; color: var(--primary-text); }
.cms-bump-label b { color: var(--accent-danger); }
.cms-bump-approx { color: var(--muted-text); font-weight: 600; font-size: 11.5px; }
.cms-bump-desc { font-size: 12px; color: var(--muted-text); line-height: 1.35; }

/* ===== CHECKOUT TẬP TRUNG: bỏ link/điều hướng gây phân tâm (giữ logo + hỗ trợ) ===== */
body.woocommerce-checkout #wide-nav,                 /* menu danh mục desktop */
body.woocommerce-checkout .header-search-form,       /* ô tìm kiếm */
body.woocommerce-checkout .cms-pm-mobile-trending,   /* thanh pill xu hướng (Kẹo sâm, Viên uống…) */
body.woocommerce-checkout footer#footer,             /* footer + ~15 link ra ngoài */
body.woocommerce-checkout .absolute-footer {
  display: none !important;
}

/* ===== Thanh giữ đơn (urgency) đầu trang thanh toán ===== */
.cms-checkout-hold {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 14px;
  padding: 10px 14px;
  background: var(--accent-orange-soft, #fff4ed);
  border: 1px solid #ffd8bf;
  border-radius: var(--radius-md, 8px);
  color: var(--primary-text);
  font-size: 13.5px;
  line-height: 1.4;
}
.cms-checkout-hold .cms-checkout-hold-ic { font-size: 16px; flex: none; }
.cms-checkout-hold #cms-ck-hold-timer { color: var(--accent-orange, #ff5b1f); font-weight: 800; }

/* ===== Inline validation (viền xanh/đỏ + dấu ✓/✕) + nút X xóa nhanh ===== */
.woocommerce-checkout .woocommerce-input-wrapper { position: relative; display: block; }
.woocommerce-checkout .woocommerce-input-wrapper .input-text { padding-right: 34px !important; }
/* trạng thái hợp lệ / lỗi (WooCommerce tự thêm class khi blur) */
.woocommerce-checkout .form-row.woocommerce-validated .input-text,
.woocommerce-checkout .form-row.woocommerce-validated select { border-color: #16a34a !important; }
.woocommerce-checkout .form-row.woocommerce-invalid .input-text,
.woocommerce-checkout .form-row.woocommerce-invalid select { border-color: #e53935 !important; }
.woocommerce-checkout .form-row.woocommerce-validated .woocommerce-input-wrapper:has(> .input-text)::after {
  content: "✓"; position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
  color: #16a34a; font-weight: 800; font-size: 13px; pointer-events: none;
}
.woocommerce-checkout .form-row.woocommerce-invalid .woocommerce-input-wrapper:has(> .input-text)::after {
  content: "✕"; position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
  color: #e53935; font-weight: 800; font-size: 13px; pointer-events: none;
}
/* khi đang gõ (focus) thì ẩn dấu ✓/✕, hiện nút X */
.woocommerce-checkout .form-row:focus-within .woocommerce-input-wrapper::after { display: none !important; }
.woocommerce-checkout .cms-clear-x {
  display: none; position: absolute; right: 8px; top: 50%; transform: translateY(-50%);
  width: 20px; height: 20px; border-radius: 50%; background: #e5e7eb; color: #374151;
  font-size: 12px; line-height: 20px; text-align: center; cursor: pointer; z-index: 3;
}
.woocommerce-checkout .woocommerce-input-wrapper:focus-within .input-text:not(:placeholder-shown) ~ .cms-clear-x { display: block; }

/* ===== Ghi chú dưới ô SĐT (mục đích dùng số) ===== */
.woocommerce-checkout #billing_phone_field .description,
.woocommerce-checkout .woocommerce-input-wrapper + .description,
.woocommerce-checkout #billing_phone_field span.description {
  display: block !important;
  margin-top: 4px;
  color: var(--muted-text, #6b7280);
  font-size: 12px;
  line-height: 1.4;
  font-style: normal;
}
