/* ==========================================================================
   TRANG MINH — GIỎ HÀNG & THANH TOÁN
   assets/css/muahang.css

   Dựng lại trình bày hai trang /gio-hang/ và /thanh-toan/ theo đúng hai trang
   mẫu đã duyệt:
     xem-truoc-giao-dien/xem-truoc-gio-hang.html
     xem-truoc-giao-dien/xem-truoc-thanh-toan.html

   Mọi quy tắc nằm dưới `body.tm-mh` (lớp plugin gắn vào <body>), tắt plugin là
   giao diện trở lại nguyên trạng.

   Nối tiếp `trangminh-tiktok/assets/css/tiktok.css` (mục 3 và 7.4 ở đó đã đổi
   màu giá + xếp bảng giỏ thành thẻ trên điện thoại). Tệp này dựng lại thẻ hàng
   cho CẢ máy tính lẫn điện thoại nên phải đè vài quy tắc cũ — vì vậy mọi bộ
   chọn đều bắt đầu bằng `body.tm-mh.tm-mh--…` để chắc chắn đủ mạnh.

   Dùng lại biến của theme: --brand, --text, --text-2, --text-3, --line,
   --line-soft, --surface, --ivory, --r, --ff. Biến riêng đặt tiền tố --mh-.
   ========================================================================== */

/* --------------------------------------------------------- 1. MÀU RIÊNG - */
body.tm-mh{
  --mh-do:#FE2C55;            /* đỏ hồng "hành động mua" (bản mẫu: --mua) */
  --mh-do-dam:#E11945;
  --mh-do-nhat:#FFF0F3;
  --mh-do-vien:#FFD3DC;
  --mh-luc:#0FA968;
  --mh-luc-nhat:#E8F8F0;
  --mh-kem:#FFF6EC;
  --mh-kem-vien:#FFE2BF;
  --mh-vang:#B8860B;
  --mh-khe:#F1F3F5;           /* khe xám giữa các thẻ trắng */
  --mh-bo:999px;
  background:var(--mh-khe);
}

/* LỖI SẴN CÓ CỦA THEME, không phải do plugin này: nhãn đếm trên biểu tượng giỏ
   ở đầu trang dùng `.wstm-act__badge{position:absolute;left:20px}`; khi giỏ có
   hàng, ở màn 390px nó thò ra ngoài 2px làm CẢ TRANG trượt ngang — đo được cả
   khi TẮT plugin (scrollWidth 392 / clientWidth 390).
   Không được sửa theme nên ở hai trang này ta cắt phần thừa. Chỉ áp dụng ở
   ≤1024px, nơi theme đã bỏ `position:sticky` của cột phải, nên không ảnh hưởng
   khối tóm tắt dán dính trên máy tính.
   → Cần sửa tận gốc trong theme: xem mục "Cần sửa ở theme" trong báo cáo. */
@media (max-width:1024px){
  html.tm-mh-js{overflow-x:clip}
}

/* ==========================================================================
   2. THANH "MIỄN PHÍ GIAO HÀNG"
   (PHP in vào đầu khối tóm tắt của giỏ hàng, CHỈ khi có dữ liệu thật)
   ========================================================================== */
body.tm-mh .tmmh-freeship{
  display:flex;align-items:flex-start;gap:10px;
  background:var(--mh-luc-nhat);border-radius:10px;
  padding:11px 13px;margin:0 0 14px;
}
body.tm-mh .tmmh-freeship__ico{width:19px;height:19px;flex:none;color:var(--mh-luc);margin-top:1px}
body.tm-mh .tmmh-freeship__than{flex:1;min-width:0}
body.tm-mh .tmmh-freeship__than p{
  margin:0 0 8px;font-size:13.5px;line-height:1.45;color:#0B6B44;
}
body.tm-mh .tmmh-freeship__than p b{color:var(--mh-luc);font-weight:800}
body.tm-mh .tmmh-freeship__than p:last-child{margin-bottom:0}
body.tm-mh .tmmh-freeship__thanh{
  height:6px;border-radius:999px;background:#CFEEE0;overflow:hidden;
}
body.tm-mh .tmmh-freeship__thanh i{
  display:block;height:100%;border-radius:999px;
  background:linear-gradient(90deg,#0FA968,#FF8A00);
}

/* ==========================================================================
   3. MẢNH GHÉP DÙNG CHUNG: ô tích tròn đỏ, bộ − 1 +, nhãn, giá
   ========================================================================== */
body.tm-mh .tmmh-tick{
  appearance:none;-webkit-appearance:none;
  width:24px;height:24px;flex:none;border-radius:50%;
  border:1.8px solid #C9D2E4;background:#fff;cursor:pointer;
  display:grid;place-content:center;margin:0;padding:0;
  transition:background .16s ease,border-color .16s ease;
}
body.tm-mh .tmmh-tick::before{
  content:'';width:12px;height:12px;background:#fff;transform:scale(0);
  transition:transform .16s ease;
  clip-path:polygon(14% 45%,0 60%,40% 100%,100% 22%,85% 8%,38% 70%);
}
body.tm-mh .tmmh-tick:checked{background:var(--mh-do);border-color:var(--mh-do)}
body.tm-mh .tmmh-tick:checked::before{transform:scale(1)}
body.tm-mh .tmmh-tick:focus-visible{outline:2px solid var(--mh-do);outline-offset:2px}

body.tm-mh .tmmh-sl{
  display:inline-flex;align-items:center;flex:none;
  border:1px solid var(--line,#E3E8F2);border-radius:9px;overflow:hidden;background:#fff;
}
body.tm-mh .tmmh-sl button{
  width:34px;height:34px;flex:none;border:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font:inherit;font-size:18px;font-weight:600;line-height:1;
  color:var(--text,#2A2A2A);background:var(--ivory,#F0F4FF);
  transition:background .15s ease,color .15s ease;
}
body.tm-mh .tmmh-sl button:hover:not(:disabled){background:var(--mh-do-nhat);color:var(--mh-do)}
body.tm-mh .tmmh-sl button:disabled{color:#B9C2D4;cursor:not-allowed}
body.tm-mh .tmmh-sl input.qty,
body.tm-mh .tmmh-sl input[type=number]{
  width:46px;height:34px;min-height:0;border:0;border-radius:0;padding:0;
  text-align:center;background:#fff;box-shadow:none;
  font-size:15px;font-weight:700;color:var(--text,#2A2A2A);
  -moz-appearance:textfield;appearance:textfield;
}
body.tm-mh .tmmh-sl input[type=number]::-webkit-outer-spin-button,
body.tm-mh .tmmh-sl input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
body.tm-mh .tmmh-sl input:focus{outline:none;box-shadow:none}

/* Hàng nhãn dưới tên hàng */
body.tm-mh .tmmh-nhan{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
body.tm-mh .tmmh-flash{
  display:inline-flex;align-items:center;border-radius:6px;overflow:hidden;
  font-size:12.5px;font-weight:700;line-height:1;flex:none;
}
body.tm-mh .tmmh-flash i{
  font-style:normal;display:inline-flex;align-items:center;gap:4px;
  background:var(--mh-do);color:#fff;padding:5px 8px;
}
body.tm-mh .tmmh-flash i svg{width:12px;height:12px;flex:none}
body.tm-mh .tmmh-flash b{
  background:var(--mh-do-nhat);color:var(--mh-do);padding:5px 9px;
  font-variant-numeric:tabular-nums;letter-spacing:.02em;
}
body.tm-mh .tmmh-chip{
  display:inline-flex;align-items:center;gap:5px;flex:none;
  font-size:12.5px;font-weight:600;line-height:1.35;
  padding:4px 9px;border-radius:6px;
}
body.tm-mh .tmmh-chip svg{width:13px;height:13px;flex:none}
body.tm-mh .tmmh-chip--kem{background:var(--mh-kem);color:#8A5B00;border:1px solid var(--mh-kem-vien)}

/* Ô chọn phân loại */
body.tm-mh .tmmh-pl{
  display:inline-flex;align-items:center;gap:6px;align-self:flex-start;max-width:100%;
  background:var(--ivory,#F0F4FF);border:1px solid var(--line,#E3E8F2);
  border-radius:8px;padding:5px 10px;
  font-size:13px;font-weight:600;color:var(--text-2,#666);line-height:1.3;
  text-decoration:none;
}
body.tm-mh a.tmmh-pl:hover{border-color:var(--mh-do);color:var(--mh-do);background:var(--mh-do-nhat)}
body.tm-mh .tmmh-pl svg{width:12px;height:12px;flex:none}

/* Giá dòng hàng */
body.tm-mh .tmmh-gia{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
body.tm-mh .tmmh-gia__now,
body.tm-mh .tmmh-gia__now .amount,
body.tm-mh .tmmh-gia__now bdi{
  font-size:21px;font-weight:800;color:var(--mh-do);line-height:1.15;letter-spacing:-.01em;
}
body.tm-mh .tmmh-gia__old,
body.tm-mh .tmmh-gia__old .amount,
body.tm-mh .tmmh-gia__old bdi{
  font-size:13.5px;font-weight:500;color:var(--text-3,#8C8C8C);text-decoration:line-through;
}
body.tm-mh .tmmh-gia__off{
  display:inline-flex;align-items:center;flex:none;
  background:var(--mh-do-nhat);color:var(--mh-do);
  font-size:12.5px;font-weight:800;padding:3px 7px;border-radius:6px;line-height:1.3;
}
body.tm-mh .tmmh-tk-mon{
  display:inline-flex;align-items:center;gap:6px;margin-top:6px;
  font-size:13px;font-weight:600;color:var(--mh-vang);line-height:1.5;
}
body.tm-mh .tmmh-tk-mon svg{width:14px;height:14px;flex:none}

/* ==========================================================================
   4. TRANG GIỎ HÀNG
   ========================================================================== */
body.tm-mh.tm-mh--gio .wstm-cart-head{padding-bottom:6px}
body.tm-mh.tm-mh--gio .wstm-cart-head__title{font-size:clamp(22px,2.4vw,30px)}

/* ---- 4.1 Dòng "Shop · <tên shop> ›" (JS chèn, giống bản mẫu) ---- */
body.tm-mh.tm-mh--gio .tmmh-shop{
  display:flex;align-items:center;gap:11px;
  background:#fff;border:1px solid var(--line,#E3E8F2);border-bottom:0;
  border-radius:var(--r,14px) var(--r,14px) 0 0;
  padding:14px 18px 13px;
}
body.tm-mh.tm-mh--gio .tmmh-shop__nhan{
  display:inline-flex;align-items:center;flex:none;
  background:var(--text,#2A2A2A);color:#fff;
  font-size:11.5px;font-weight:800;padding:3px 9px;border-radius:5px;letter-spacing:.02em;
}
body.tm-mh.tm-mh--gio .tmmh-shop__ten{
  display:inline-flex;align-items:center;gap:8px;
  font-size:16px;font-weight:700;color:var(--text,#2A2A2A);text-decoration:none;
}
body.tm-mh.tm-mh--gio .tmmh-shop__ten:hover{color:var(--mh-do)}
body.tm-mh.tm-mh--gio .tmmh-shop__ten svg{width:14px;height:14px;flex:none;color:#B9C2D4}

/* ---- 4.2 Bảng giỏ → danh sách thẻ hàng (cả máy tính lẫn điện thoại) ---- */
body.tm-mh.tm-mh--gio table.wstm-carttable,
body.tm-mh.tm-mh--gio table.wstm-carttable tbody,
body.tm-mh.tm-mh--gio table.wstm-carttable tr,
body.tm-mh.tm-mh--gio table.wstm-carttable td{
  display:block;width:100%;border:0;background:none;
}
body.tm-mh.tm-mh--gio table.wstm-carttable{
  border:0;background:none;box-shadow:none;overflow:visible;margin:0;
}
body.tm-mh.tm-mh--gio table.wstm-carttable thead{display:none}
body.tm-mh.tm-mh--gio table.wstm-carttable tbody{
  background:#fff;border:1px solid var(--line,#E3E8F2);
  border-radius:0 0 var(--r,14px) var(--r,14px);
  padding:0 18px;
}

body.tm-mh.tm-mh--gio table.wstm-carttable tr.cart_item{
  position:relative;
  display:grid;
  grid-template-columns:24px 104px minmax(0,1fr) 118px;
  grid-template-areas:
    "tick anh ten ten"
    "tick anh gia sl";
  column-gap:14px;row-gap:9px;align-items:start;
  padding:18px 34px 18px 0;margin:0;
  border-bottom:1px solid var(--line-soft,#EEF1F8);
  border-radius:0;min-height:0;
}
body.tm-mh.tm-mh--gio table.wstm-carttable tr.cart_item:last-child{border-bottom:0}
body.tm-mh.tm-mh--gio table.wstm-carttable tr.cart_item.tmmh-bo{opacity:.5}

body.tm-mh.tm-mh--gio td.tmmh-chon{grid-area:tick;align-self:center;padding:0;width:auto}
body.tm-mh.tm-mh--gio td.tmmh-chon label{display:flex;align-items:center;margin:0}

/* Ảnh bo góc */
body.tm-mh.tm-mh--gio table.wstm-carttable td.product-thumbnail{
  grid-area:anh;position:static;left:auto;top:auto;
  width:104px;height:104px;padding:0;align-self:start;
}
body.tm-mh.tm-mh--gio table.wstm-carttable td.product-thumbnail a,
body.tm-mh.tm-mh--gio table.wstm-carttable td.product-thumbnail img{
  display:block;width:104px;height:104px;object-fit:cover;
  border-radius:12px;background:var(--ivory,#F0F4FF);
}
body.tm-mh.tm-mh--gio table.wstm-carttable td.product-thumbnail a{
  overflow:hidden;border:1px solid var(--line,#E3E8F2);
}

/* Tên + phân loại + nhãn */
body.tm-mh.tm-mh--gio table.wstm-carttable td.product-name{
  grid-area:ten;padding:0;text-align:left;min-width:0;
  display:flex;flex-direction:column;align-items:flex-start;gap:8px;
}
body.tm-mh.tm-mh--gio td.product-name .wstm-cartline__name{
  font-size:15px;font-weight:600;line-height:1.4;color:var(--text,#2A2A2A);
  max-width:100%;width:100%;
  display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
body.tm-mh.tm-mh--gio td.product-name .wstm-cartline__name:hover{color:var(--mh-do)}
body.tm-mh.tm-mh--gio td.product-name .wstm-cartline__origin{
  font-size:12.5px;color:var(--text-3,#8C8C8C);
}

/* Giá + dòng tiết kiệm */
body.tm-mh.tm-mh--gio table.wstm-carttable td.product-price{
  grid-area:gia;padding:0;text-align:left;font-size:inherit;align-self:end;
}
body.tm-mh.tm-mh--gio table.wstm-carttable td.product-price::before{content:none}

/* Số lượng */
body.tm-mh.tm-mh--gio table.wstm-carttable td.product-quantity{
  grid-area:sl;padding:0;text-align:right;justify-self:end;align-self:end;
}
body.tm-mh.tm-mh--gio td.product-quantity .quantity{margin:0;display:inline-flex}

/* Bản mẫu không có dòng "Thành tiền" ở thẻ hàng (số đó đã nằm ở khối tóm tắt),
   nên ẩn cho khớp. Ô vẫn còn trong DOM để WooCommerce tự cập nhật. */
body.tm-mh.tm-mh--gio table.wstm-carttable td.product-subtotal{display:none}

/* Nút bỏ món: góc trên bên phải thẻ */
body.tm-mh.tm-mh--gio table.wstm-carttable td.product-remove{
  position:absolute;right:0;top:16px;width:auto;padding:0;
}
body.tm-mh.tm-mh--gio td.product-remove a.remove{
  display:flex;align-items:center;justify-content:center;
  width:28px;height:28px;border-radius:50%;
  background:var(--ivory,#F0F4FF);color:var(--text-2,#666);
  font-size:0;line-height:1;text-decoration:none;
}
body.tm-mh.tm-mh--gio td.product-remove a.remove:hover{background:var(--mh-do);color:#fff}

/* ---- 4.3 Hàng nút dưới bảng ---- */
body.tm-mh.tm-mh--gio .wstm-cart__actions{margin-top:14px;display:flex;gap:10px;flex-wrap:wrap}
/* JS chạy được thì số lượng tự lưu, nút "Cập nhật giỏ hàng" thành thừa.
   Không có JS thì nút vẫn hiện để khách còn đường cập nhật. */
body.tm-mh.tm-mh--gio.tm-mh-js .wstm-cart__actions button[name=update_cart]{display:none}
body.tm-mh.tm-mh--gio .wstm-cart__actions .wstm-btn{border-radius:var(--mh-bo)}

/* ---- 4.4 Khối "Tóm tắt đơn hàng" (cột phải) ----
   Theme in các khối theo thứ tự khác bản mẫu. Không được sửa template nên
   xếp lại bằng `order` của flexbox. */
body.tm-mh.tm-mh--gio .wstm-summary{
  display:flex;flex-direction:column;border-radius:var(--r,14px);
}
body.tm-mh.tm-mh--gio .wstm-summary > *{order:6}
body.tm-mh.tm-mh--gio .wstm-summary .wstm-summary__title{order:1;font-size:19px;margin-bottom:14px}
body.tm-mh.tm-mh--gio .wstm-summary .tmmh-freeship{order:2}
body.tm-mh.tm-mh--gio .wstm-summary .tmmh-row--goc{order:3}
body.tm-mh.tm-mh--gio .wstm-summary .tmmh-row--giam{order:4}
body.tm-mh.tm-mh--gio .wstm-summary .wstm-summary__row--ship{order:5}
body.tm-mh.tm-mh--gio .wstm-summary .cart-subtotal{order:6}
body.tm-mh.tm-mh--gio .wstm-summary .wstm-summary__row--total{order:7}
body.tm-mh.tm-mh--gio .wstm-summary .wstm-summary__vat{order:8}
body.tm-mh.tm-mh--gio .wstm-summary .tmmh-tk{order:9}
body.tm-mh.tm-mh--gio .wstm-summary .wc-proceed-to-checkout{order:10}
body.tm-mh.tm-mh--gio .wstm-summary .tmmh-ghi{order:11}
body.tm-mh.tm-mh--gio .wstm-summary .wstm-coupon{order:12}
body.tm-mh.tm-mh--gio .wstm-summary .wstm-uudai{order:13}
body.tm-mh.tm-mh--gio .wstm-summary .wstm-summary__policy{order:14}
/* Bản mẫu không có dải logo thanh toán trong khối tóm tắt của giỏ hàng. */
body.tm-mh.tm-mh--gio .wstm-summary .wstm-summary__pay{display:none}

body.tm-mh.tm-mh--gio .wstm-summary .wstm-summary__row{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:9px 0;font-size:14.5px;
}
body.tm-mh.tm-mh--gio .wstm-summary .tmmh-row--giam b,
body.tm-mh.tm-mh--gio .wstm-summary .tmmh-row--giam .amount,
body.tm-mh.tm-mh--gio .wstm-summary .tmmh-row--giam bdi{color:var(--mh-do);font-weight:700}
body.tm-mh.tm-mh--gio .wstm-summary__row--total b,
body.tm-mh.tm-mh--gio .wstm-summary__row--total .amount,
body.tm-mh.tm-mh--gio .wstm-summary__row--total bdi{
  font-size:25px;font-weight:800;color:var(--mh-do);
}
body.tm-mh .tmmh-tk{
  margin:2px 0 0;text-align:right;font-size:13.5px;font-weight:700;color:var(--mh-do);
}
body.tm-mh .tmmh-ghi{
  margin:10px 0 0;text-align:center;font-size:12.5px;color:var(--text-2,#666);line-height:1.5;
}
body.tm-mh.tm-mh--gio .wc-proceed-to-checkout{margin-top:14px}
body.tm-mh.tm-mh--gio .wc-proceed-to-checkout .checkout-button,
body.tm-mh.tm-mh--gio .wstm-summary .wstm-btn--primary{
  border-radius:var(--mh-bo);font-weight:700;
  background:var(--mh-do);border-color:var(--mh-do);color:#fff;
  box-shadow:0 4px 14px rgba(254,44,85,.26);
}
body.tm-mh.tm-mh--gio .wc-proceed-to-checkout .checkout-button{
  width:100%;justify-content:center;font-size:16px;padding:14px 26px;
}
body.tm-mh.tm-mh--gio .wc-proceed-to-checkout .checkout-button:hover,
body.tm-mh.tm-mh--gio .wstm-summary .wstm-btn--primary:hover{
  background:var(--mh-do-dam);border-color:var(--mh-do-dam);
}
body.tm-mh.tm-mh--gio .wstm-coupon{margin-top:16px}

/* ==========================================================================
   5. TRANG THANH TOÁN
   ========================================================================== */

/* Bảng "Đặt hàng nhanh" của theme đã bị gỡ khỏi DOM từ PHP. Lớp chặn thứ hai. */
body.tm-mh.tm-mh--tt .wstm-nhanh{display:none !important}

body.tm-mh.tm-mh--tt .wstm-cobox{border-radius:var(--r,14px)}
body.tm-mh.tm-mh--tt .wstm-cobox__title{
  font-size:17px;font-weight:800;color:var(--text,#2A2A2A);letter-spacing:0;
}
body.tm-mh.tm-mh--tt .wstm-cobox input[type=text],
body.tm-mh.tm-mh--tt .wstm-cobox input[type=tel],
body.tm-mh.tm-mh--tt .wstm-cobox input[type=email],
body.tm-mh.tm-mh--tt .wstm-cobox textarea,
body.tm-mh.tm-mh--tt .wstm-cobox select{border-radius:10px}
body.tm-mh.tm-mh--tt .wstm-cobox input:focus,
body.tm-mh.tm-mh--tt .wstm-cobox textarea:focus,
body.tm-mh.tm-mh--tt .wstm-cobox select:focus{border-color:var(--mh-do);outline-color:var(--mh-do)}

/* ---- 5.1 Thời gian giao hàng ---- */
body.tm-mh.tm-mh--tt .wstm-delivery__item{border-radius:12px}
body.tm-mh.tm-mh--tt .wstm-delivery__item.is-on,
body.tm-mh.tm-mh--tt .wstm-delivery__item:has(input:checked){
  border-color:var(--mh-do);background:var(--mh-do-nhat);
}
body.tm-mh.tm-mh--tt .wstm-delivery__item input[type=radio]{accent-color:var(--mh-do)}

/* ---- 5.2 Danh sách hàng trong đơn (JS chuyển sang cột trái như bản mẫu) --- */
body.tm-mh.tm-mh--tt .tmmh-hang__dau{
  display:flex;align-items:center;gap:11px;
  padding-bottom:13px;border-bottom:1px solid var(--line,#E3E8F2);
}
body.tm-mh.tm-mh--tt .tmmh-shop__nhan{
  display:inline-flex;align-items:center;flex:none;
  background:var(--text,#2A2A2A);color:#fff;
  font-size:11.5px;font-weight:800;padding:3px 9px;border-radius:5px;letter-spacing:.02em;
}
body.tm-mh.tm-mh--tt .tmmh-hang__ten{font-size:16px;font-weight:700;color:var(--text,#2A2A2A)}
body.tm-mh.tm-mh--tt .tmmh-hang__sua{
  margin-left:auto;display:inline-flex;align-items:center;gap:6px;
  font-size:14px;font-weight:600;color:var(--text-2,#666);text-decoration:none;
}
body.tm-mh.tm-mh--tt .tmmh-hang__sua:hover{color:var(--mh-do)}
body.tm-mh.tm-mh--tt .tmmh-hang__sua svg{width:13px;height:13px;flex:none}

body.tm-mh.tm-mh--tt .tmmh-hang__ds,
body.tm-mh.tm-mh--tt .tmmh-hang__ds tbody{display:block;width:100%;border:0}
body.tm-mh.tm-mh--tt .tmmh-hang__ds tr.cart_item{
  display:grid;grid-template-columns:96px minmax(0,1fr) auto;
  grid-template-areas:"anh ten tong";
  column-gap:14px;row-gap:8px;align-items:center;
  padding:16px 0;border-bottom:1px solid var(--line-soft,#EEF1F8);
}
body.tm-mh.tm-mh--tt .tmmh-hang__ds tr.cart_item:last-child{border-bottom:0}
body.tm-mh.tm-mh--tt .tmmh-hang__ds td{display:block;border:0;padding:0}
/* `display:contents` để ảnh và khối chữ nằm thẳng vào lưới của dòng hàng,
   thay vì bị kẹt trong ô <td> rồi xếp chồng lên nhau. */
body.tm-mh.tm-mh--tt .tmmh-hang__ds td.product-name{display:contents}
body.tm-mh.tm-mh--tt .tmmh-hang__ds td.product-total{
  grid-area:tong;align-self:center;text-align:right;white-space:nowrap;
}
body.tm-mh.tm-mh--tt .tmmh-hang__ds td.product-total .amount,
body.tm-mh.tm-mh--tt .tmmh-hang__ds td.product-total bdi{
  font-size:19px;font-weight:800;color:var(--mh-do);
}
body.tm-mh.tm-mh--tt .tmmh-hang__ds .wstm-review__item{display:contents}
body.tm-mh.tm-mh--tt .tmmh-hang__ds .wstm-review__item > img{
  grid-area:anh;width:96px;height:96px;object-fit:cover;
  border-radius:12px;border:1px solid var(--line,#E3E8F2);background:var(--ivory,#F0F4FF);
}
body.tm-mh.tm-mh--tt .tmmh-hang__ds .wstm-review__item > span{
  grid-area:ten;display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0;
}
body.tm-mh.tm-mh--tt .wstm-review__name{
  font-size:15px;font-weight:600;line-height:1.4;color:var(--text,#2A2A2A);
}
body.tm-mh.tm-mh--tt .wstm-review__qty{font-size:13px;color:var(--text-3,#8C8C8C)}

/* ---- 5.3 Phương thức thanh toán: nhãn vuông + chấm tròn đỏ ---- */
body.tm-mh.tm-mh--tt ul.wc_payment_methods{list-style:none;margin:0;padding:0}
body.tm-mh.tm-mh--tt li.wc_payment_method{
  border-bottom:1px solid var(--line-soft,#EEF1F8);padding:0;margin:0;
}
body.tm-mh.tm-mh--tt li.wc_payment_method:last-child{border-bottom:0}
body.tm-mh.tm-mh--tt li.wc_payment_method > label{
  display:flex;align-items:center;gap:13px;width:100%;
  padding:14px 2px;margin:0;cursor:pointer;
  font-size:15.5px;font-weight:600;color:var(--text,#2A2A2A);line-height:1.4;
}
body.tm-mh.tm-mh--tt li.wc_payment_method > label img{max-height:26px;width:auto}
body.tm-mh.tm-mh--tt .tmmh-pt-logo{
  width:46px;height:30px;flex:none;border-radius:6px;
  display:grid;place-content:center;
  font-size:10.5px;font-weight:800;color:#fff;letter-spacing:.02em;text-align:center;
  background:var(--text-2,#666);
}
body.tm-mh.tm-mh--tt .tmmh-pt-logo--cod{background:var(--mh-luc)}
body.tm-mh.tm-mh--tt .tmmh-pt-logo--bacs{background:var(--brand,#1F4FD8)}
body.tm-mh.tm-mh--tt .tmmh-pt-logo--cheque{background:#6B7280}
body.tm-mh.tm-mh--tt .tmmh-pt-logo--momo{background:#A50064}
body.tm-mh.tm-mh--tt .tmmh-pt-logo--zalopay{background:#0068FF}
body.tm-mh.tm-mh--tt .tmmh-pt-logo--vnpay{background:#E11B23}
body.tm-mh.tm-mh--tt .tmmh-pt-logo--paypal{background:#003087}
body.tm-mh.tm-mh--tt .tmmh-pt-ten{flex:1;min-width:0}
body.tm-mh.tm-mh--tt .tmmh-pt-cham{
  width:22px;height:22px;flex:none;border-radius:50%;
  border:2px solid #C9D2E4;background:#fff;
  display:grid;place-content:center;transition:border-color .16s ease,border-width .16s ease;
}
body.tm-mh.tm-mh--tt li.wc_payment_method.tmmh-chon .tmmh-pt-cham{
  border-color:var(--mh-do);border-width:6px;
}
body.tm-mh.tm-mh--tt li.wc_payment_method.tmmh-chon > label{color:var(--mh-do)}
body.tm-mh.tm-mh--tt .wstm-paytag{flex:none}
body.tm-mh.tm-mh--tt .payment_box{
  background:var(--ivory,#F0F4FF);border-radius:10px;
  padding:12px 14px;margin:0 0 14px;font-size:13.5px;color:var(--text-2,#666);
}
body.tm-mh.tm-mh--tt .payment_box p{margin:0}

/* ---- 5.4 Khối tóm tắt bên phải ---- */
body.tm-mh.tm-mh--tt .wstm-summary{border-radius:var(--r,14px)}
body.tm-mh.tm-mh--tt .wstm-summary__title{font-size:19px}
/* Bản mẫu không có khối "Ưu đãi đang áp dụng" trong tóm tắt — nội dung đó đã
   nằm ở khối "Cam kết của TRANG MINH" ngay dưới nên ẩn cho đỡ trùng. */
body.tm-mh.tm-mh--tt .wstm-summary .wstm-uudai{display:none}

body.tm-mh.tm-mh--tt .wstm-review{width:100%;border:0;margin:0}
body.tm-mh.tm-mh--tt .wstm-review tfoot{display:flex;flex-direction:column}
body.tm-mh.tm-mh--tt .wstm-review tfoot tr{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  padding:9px 0;border:0;order:5;
}
body.tm-mh.tm-mh--tt .wstm-review tfoot th,
body.tm-mh.tm-mh--tt .wstm-review tfoot td{
  border:0;padding:0;text-align:left;font-size:14.5px;font-weight:500;color:var(--text-2,#666);
}
body.tm-mh.tm-mh--tt .wstm-review tfoot td{text-align:right;font-weight:700;color:var(--text,#2A2A2A)}
body.tm-mh.tm-mh--tt .wstm-review tfoot tr.cart-subtotal{order:1}
body.tm-mh.tm-mh--tt .wstm-review tfoot tr.tmmh-row--goc{order:2}
body.tm-mh.tm-mh--tt .wstm-review tfoot tr.tmmh-row--giam{order:3}
body.tm-mh.tm-mh--tt .wstm-review tfoot tr.shipping{order:4}
body.tm-mh.tm-mh--tt .wstm-review tfoot tr.order-total{
  order:8;border-top:1px solid var(--line,#E3E8F2);margin-top:8px;padding-top:14px;
}
body.tm-mh.tm-mh--tt .wstm-review tfoot tr.tmmh-tk-row{order:9;padding-top:0}
body.tm-mh.tm-mh--tt .wstm-review tfoot tr.tmmh-tk-row td{
  color:var(--mh-do);font-size:13.5px;font-weight:700;
}
body.tm-mh.tm-mh--tt .wstm-review tfoot tr.tmmh-row--giam td{color:var(--mh-do)}
body.tm-mh.tm-mh--tt .wstm-review tfoot tr.order-total th{
  font-size:16px;font-weight:700;color:var(--text,#2A2A2A);
}
body.tm-mh.tm-mh--tt .wstm-review .order-total td,
body.tm-mh.tm-mh--tt .wstm-review .order-total .amount,
body.tm-mh.tm-mh--tt .wstm-review .order-total bdi{
  font-size:25px;font-weight:800;color:var(--mh-do);
}
/* Hai dòng chi tiết thụt vào, gập lại được như bản mẫu */
body.tm-mh.tm-mh--tt .wstm-review tfoot tr.tmmh-row th{padding-left:16px;font-size:14px}
body.tm-mh.tm-mh--tt .wstm-review tfoot tr.tmmh-row.tmmh-an{display:none}
body.tm-mh.tm-mh--tt .tmmh-gap{
  display:inline-flex;align-items:center;gap:6px;
  border:0;background:none;cursor:pointer;font:inherit;padding:0;
  font-size:14.5px;font-weight:700;color:var(--text,#2A2A2A);
}
body.tm-mh.tm-mh--tt .tmmh-gap:hover{color:var(--mh-do)}
body.tm-mh.tm-mh--tt .tmmh-gap svg{width:13px;height:13px;transition:transform .2s ease}
body.tm-mh.tm-mh--tt .tmmh-gap[aria-expanded=false] svg{transform:rotate(-90deg)}

/* Nút "Đặt hàng" thật, JS chuyển vào cuối khối tóm tắt như bản mẫu */
body.tm-mh.tm-mh--tt .wstm-summary .place-order{margin-top:16px}
body.tm-mh.tm-mh--tt #place_order{
  width:100%;border-radius:var(--mh-bo);border:0;
  background:var(--mh-do);color:#fff;
  font-size:16.5px;font-weight:700;padding:14px 26px;line-height:1.25;
  box-shadow:0 4px 14px rgba(254,44,85,.28);
}
body.tm-mh.tm-mh--tt #place_order:hover{background:var(--mh-do-dam)}
body.tm-mh.tm-mh--tt .tmmh-dat-phu{
  display:block;margin:8px 0 0;padding:0 8px;
  text-align:center;font-size:12.5px;font-weight:600;color:var(--text-2,#666);
}
body.tm-mh.tm-mh--tt .woocommerce-privacy-policy-text p,
body.tm-mh.tm-mh--tt .woocommerce-terms-and-conditions-wrapper{
  font-size:12.5px;color:var(--text-3,#8C8C8C);line-height:1.55;
}

/* ==========================================================================
   6. THANH THAO TÁC DÍNH ĐÁY (theme đã có `.wstm-dathang`, chỉ dựng lại kiểu)
   ========================================================================== */
@media (max-width:900px){
  body.tm-mh .wstm-dathang{
    gap:10px;padding:9px 12px calc(9px + env(safe-area-inset-bottom));
    box-shadow:0 -4px 20px rgba(14,36,100,.12);z-index:970;
  }
  body.tm-mh .tmmh-day-chon{
    display:flex;align-items:center;gap:7px;flex:none;margin:0;
    font-size:13.5px;font-weight:600;color:var(--text,#2A2A2A);cursor:pointer;
  }
  body.tm-mh .wstm-dathang__tien{text-align:right}
  body.tm-mh .wstm-dathang__tien b,
  body.tm-mh .wstm-dathang__tien .amount,
  body.tm-mh .wstm-dathang__tien bdi{color:var(--mh-do);font-size:19px;font-weight:800}
  body.tm-mh .tmmh-day-gap{
    border:0;background:none;padding:0;cursor:pointer;font:inherit;
    display:block;width:100%;text-align:right;line-height:1.25;
  }
  body.tm-mh .tmmh-day-gap small{
    display:block;font-size:11.5px;color:var(--text-2,#666);font-weight:500;
  }
  body.tm-mh .tmmh-day-gap svg{width:11px;height:11px;vertical-align:-1px;transition:transform .2s ease}
  body.tm-mh .tmmh-day-gap[aria-expanded=true] svg{transform:rotate(180deg)}
  body.tm-mh .wstm-dathang__nut{
    border-radius:var(--mh-bo);background:var(--mh-do);color:#fff;
    font-weight:700;font-size:15.5px;padding:13px 24px;min-width:132px;
    box-shadow:0 4px 14px rgba(254,44,85,.3);
  }
  body.tm-mh .wstm-dathang__nut:hover{background:var(--mh-do-dam);color:#fff}

  body.tm-mh .tmmh-day-bang{
    position:fixed;left:0;right:0;bottom:0;z-index:969;
    background:#fff;border-top:1px solid var(--line,#E3E8F2);
    box-shadow:0 -6px 20px rgba(14,36,100,.1);
    padding:14px 16px calc(96px + env(safe-area-inset-bottom));
  }
  body.tm-mh .tmmh-day-bang[hidden]{display:none}
  body.tm-mh .tmmh-day-bang .wstm-summary__row{
    display:flex;align-items:baseline;justify-content:space-between;gap:14px;
    padding:7px 0;font-size:14px;
  }

  /* Theme xếp khối "Đơn hàng của bạn" lên đầu trên điện thoại vì trước đây
     bảng "Đặt hàng nhanh" mới là chỗ khách điền. Bảng đó đã bỏ, nên khối nhập
     thông tin phải quay về đúng thứ tự: điền trước, xem lại đơn sau. */
  body.tm-mh.tm-mh--tt .wstm-checkout__main{order:0}
  body.tm-mh.tm-mh--tt .wstm-checkout__side{order:1}

  /* Chừa chỗ cho thanh đáy, không thì nó che mất phần cuối trang. */
  body.tm-mh .wstm-footer{padding-bottom:86px}
  body.tm-mh .wstm-float{bottom:92px}
}

/* ==========================================================================
   7. LỚP PHỦ "ĐANG CẬP NHẬT GIỎ HÀNG"
   ========================================================================== */
body.tm-mh .tmmh-doi{
  position:fixed;inset:0;z-index:9990;
  background:rgba(255,255,255,.72);
  display:flex;align-items:center;justify-content:center;gap:10px;
  font-size:15px;font-weight:700;color:var(--text,#2A2A2A);
}
body.tm-mh .tmmh-doi i{
  width:22px;height:22px;border-radius:50%;
  border:3px solid var(--mh-do-vien);border-top-color:var(--mh-do);
  animation:tmmh-quay .7s linear infinite;
}
@keyframes tmmh-quay{to{transform:rotate(360deg)}}

/* ==========================================================================
   8. ĐIỆN THOẠI  (≤ 782px)
   ========================================================================== */
@media (max-width:782px){
  /* Thẻ hàng: gỡ hẳn bố cục tuyệt đối mà tiktok.css dựng cho điện thoại.
     Bản mẫu ở 390px đặt bộ − 1 + xuống hàng riêng, căn trái. */
  body.tm-mh.tm-mh--gio table.wstm-carttable tbody{padding:0 12px}
  body.tm-mh.tm-mh--gio table.wstm-carttable tr.cart_item{
    grid-template-columns:22px 84px minmax(0,1fr);
    grid-template-areas:
      "tick anh ten"
      "tick anh gia"
      "tick anh sl";
    column-gap:10px;padding:14px 30px 14px 0;min-height:0;
    background:none;border:0;border-bottom:1px solid var(--line-soft,#EEF1F8);
    border-radius:0;margin:0;
  }
  body.tm-mh.tm-mh--gio table.wstm-carttable tr.cart_item:last-child{border-bottom:0}
  body.tm-mh.tm-mh--gio table.wstm-carttable td.product-quantity{justify-self:start;text-align:left}
  body.tm-mh.tm-mh--gio .tmmh-tick{width:22px;height:22px}
  body.tm-mh.tm-mh--gio .tmmh-tick::before{width:11px;height:11px}
  body.tm-mh.tm-mh--gio table.wstm-carttable td.product-thumbnail{width:84px;height:84px}
  body.tm-mh.tm-mh--gio table.wstm-carttable td.product-thumbnail a,
  body.tm-mh.tm-mh--gio table.wstm-carttable td.product-thumbnail img{width:84px;height:84px;border-radius:10px}
  body.tm-mh.tm-mh--gio td.product-name .wstm-cartline__name{font-size:14px}
  body.tm-mh .tmmh-gia__now,
  body.tm-mh .tmmh-gia__now .amount,
  body.tm-mh .tmmh-gia__now bdi{font-size:19px}
  body.tm-mh .tmmh-sl button{width:30px;height:30px;font-size:17px}
  body.tm-mh .tmmh-sl input.qty,
  body.tm-mh .tmmh-sl input[type=number]{width:38px;height:30px;font-size:14px}
  body.tm-mh.tm-mh--gio table.wstm-carttable td.product-remove{top:12px}

  body.tm-mh.tm-mh--gio .tmmh-shop{padding:12px;border-radius:12px 12px 0 0}
  body.tm-mh.tm-mh--gio .tmmh-shop__ten{font-size:15px}

  body.tm-mh .tmmh-freeship{padding:11px 12px;gap:9px}
  body.tm-mh .tmmh-freeship__than p{font-size:13px}

  body.tm-mh.tm-mh--tt .tmmh-hang__dau{gap:8px}
  body.tm-mh.tm-mh--tt .tmmh-hang__ten{font-size:15px}
  body.tm-mh.tm-mh--tt .tmmh-hang__sua{font-size:13px;white-space:nowrap}
  body.tm-mh.tm-mh--tt .tmmh-hang__ds tr.cart_item{
    grid-template-columns:76px minmax(0,1fr) auto;column-gap:11px;
  }
  body.tm-mh.tm-mh--tt .tmmh-hang__ds .wstm-review__item > img{width:76px;height:76px;border-radius:10px}
  body.tm-mh.tm-mh--tt .tmmh-hang__ds td.product-total .amount,
  body.tm-mh.tm-mh--tt .tmmh-hang__ds td.product-total bdi{font-size:17px}
  body.tm-mh.tm-mh--tt li.wc_payment_method > label{font-size:14.5px;gap:11px;padding:13px 2px}
  body.tm-mh.tm-mh--tt .tmmh-pt-logo{width:42px;height:28px;font-size:10px}
  body.tm-mh.tm-mh--tt #place_order{font-size:15.5px;padding:14px 20px}

  body.tm-mh.tm-mh--gio .wstm-cart__actions .wstm-btn{width:100%;justify-content:center}
}

@media (max-width:400px){
  body.tm-mh.tm-mh--gio table.wstm-carttable tr.cart_item{
    grid-template-columns:22px 76px minmax(0,1fr);column-gap:9px;
  }
  body.tm-mh.tm-mh--gio table.wstm-carttable td.product-thumbnail{width:76px;height:76px}
  body.tm-mh.tm-mh--gio table.wstm-carttable td.product-thumbnail a,
  body.tm-mh.tm-mh--gio table.wstm-carttable td.product-thumbnail img{width:76px;height:76px}
  body.tm-mh .tmmh-sl button{width:28px;height:28px}
  body.tm-mh .tmmh-sl input.qty,
  body.tm-mh .tmmh-sl input[type=number]{width:34px;height:28px}
  body.tm-mh .wstm-dathang__nut{min-width:112px;padding:12px 16px;font-size:14.5px}
}

/* ==========================================================================
   9. MÀN HÌNH LỚN (≥1400px)
   ========================================================================== */
@media (min-width:1400px){
  body.tm-mh.tm-mh--gio table.wstm-carttable tr.cart_item{
    grid-template-columns:24px 116px minmax(0,1fr) 118px;column-gap:16px;
  }
  body.tm-mh.tm-mh--gio table.wstm-carttable td.product-thumbnail{width:116px;height:116px}
  body.tm-mh.tm-mh--gio table.wstm-carttable td.product-thumbnail a,
  body.tm-mh.tm-mh--gio table.wstm-carttable td.product-thumbnail img{width:116px;height:116px}
}

/* ==========================================================================
   9. 27/09/2026 — ĐIỆN THOẠI: ĐI THEO ĐÚNG LỐI TIKTOK SHOP

   Khách chốt: "Học đúng kiểu giỏ hàng, thanh toán của tiktok ko theo mặc định wp".
   Đối chiếu hai ảnh TikTok khách gửi trong "Giao diện yêu cầu":
     · trên cùng CHỈ một thanh mảnh: ‹ quay lại · tên trang · thao tác bên phải;
     · không đường dẫn "Trang chủ ›", không tiêu đề lớn, không dãy bước 1·2·3·4,
       không dải logo VISA/MASTERCARD;
     · nền trang xám, các khối trắng TRÀN hết bề ngang, cách nhau 8px, không bo góc;
     · tên khối chữ nhỏ viết thường, không in hoa màu xanh.

   Đo trên máy thật ở khổ 390px TRƯỚC khi sửa: trang giỏ hàng cao 4270px, trang
   thanh toán 4921px; riêng phần đầu trang kiểu WordPress đã chiếm 354px và 243px
   mà không giúp khách mua nhanh hơn chút nào.

   Vẫn không đụng luồng WooCommerce: chỉ ẩn/đổi trình bày, mọi nút thật giữ nguyên.
   ========================================================================== */
@media (max-width:767px){

  /* ---- 9.1 Bỏ phần đầu trang kiểu WordPress ---- */
  body.tm-mh .tmdm-tb,
  body.tm-mh #wstm-header,
  body.tm-mh .wstm-crumb,
  body.tm-mh .wstm-cart-head,
  body.tm-mh .wstm-cart-trust,
  body.tm-mh .wstm-cart__actions,
  body.tm-mh .wstm-checkout-head,
  body.tm-mh .wstm-steps,
  body.tm-mh .wstm-paystrip{display:none !important}

  /* ---- 9.2 Thanh đầu trang kiểu TikTok (JS dựng) ----
     Đầu trang của web đã ẩn nên thanh này phải luôn thấy được: nút ‹ là lối ra
     duy nhất, không được để nó cuộn mất. */
  .tmmh-dau{
    position:fixed;top:0;left:0;right:0;z-index:968;
    display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;
    min-height:48px;padding:0 8px;
    background:#fff;border-bottom:1px solid var(--line-soft,#EEF1F8);
  }
  .tmmh-dau__lui{
    width:40px;height:40px;display:grid;place-items:center;
    background:none;border:0;padding:0;cursor:pointer;color:var(--text,#161823);
  }
  .tmmh-dau__lui svg{width:22px;height:22px}
  .tmmh-dau__ten{
    text-align:center;font-size:16px;font-weight:700;line-height:1.3;
    color:var(--text,#161823);
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  .tmmh-dau__phai{
    min-width:40px;padding:0 8px;text-align:right;
    font-size:13.5px;font-weight:600;color:var(--text-2,#666);text-decoration:none;
  }
  body.tm-mh .wstm-main{padding-top:48px}

  /* ---- 9.3 Nền xám, khối trắng tràn mép, cách nhau 8px ---- */
  body.tm-mh{background:#F2F3F5}
  body.tm-mh .wstm-shoppage{padding:0 0 12px;max-width:none}
  body.tm-mh .woocommerce-notices-wrapper{margin:0 0 8px}

  /* 27/09/2026 — khách chụp màn: đầu trang thanh toán đang đội HAI dải xanh
     "…đã được thêm vào giỏ hàng" giống hệt nhau, đẩy ô điền thông tin xuống
     gần hết màn hình đầu. TikTok Shop không có dải nào ở đây cả: khách đã bấm
     Thanh toán thì đương nhiên hàng đã ở trong giỏ, báo lại là thừa.
     CHỈ bỏ loại báo "đã xong" — báo LỖI vẫn giữ nguyên, đó là thứ khách buộc
     phải đọc (thiếu tên, thiếu số điện thoại…).
     27/09 (lần 2) — khách bảo bỏ cả ở TRANG GIỎ HÀNG: "đang ở giỏ hàng và nhìn
     thấy rồi thông báo gì nữa". Đúng vậy, nên bỏ cho cả hai trang. */
  body.tm-mh .woocommerce-message,
  body.tm-mh .woocommerce-info,
  body.tm-mh .wc-block-components-notice-banner.is-success,
  body.tm-mh .wc-block-components-notice-banner.is-info{display:none}
  body.tm-mh .woocommerce-notices-wrapper:empty,
  body.tm-mh .woocommerce-notices-wrapper:not(:has(.woocommerce-error)):not(:has(.is-error)){
    margin:0;
  }

  body.tm-mh .wstm-summary,
  body.tm-mh .wstm-suggest-box,
  body.tm-mh section.wstm-cobox,
  body.tm-mh .wstm-promise,
  body.tm-mh .wstm-support{
    background:#fff;border:0;border-radius:0;box-shadow:none;
    margin:0 0 8px;padding:14px 12px;
  }
  /* Khối hàng trong giỏ đã có đệm riêng cho bảng, thêm đệm nữa là lệch. */
  body.tm-mh .wstm-cart__main{
    background:#fff;border:0;border-radius:0;box-shadow:none;
    margin:0 0 8px;padding:0;
  }
  body.tm-mh .col2-set{margin:0;padding:0;background:none}
  body.tm-mh .wstm-cart,
  body.tm-mh .wstm-checkout{gap:0}

  /* ---- 9.3b Bỏ chân trang và mấy khối phụ ở hai trang mua hàng ----
     27/09/2026 — khách chốt: "TikTok Shop họ không để chân trang, ta cũng bỏ
     luôn để khách tập trung đặt hàng". Đúng: ở màn thanh toán, mọi liên kết
     dẫn khách đi chỗ khác đều là chỗ rơi đơn. Các trang KHÁC vẫn còn chân
     trang đầy đủ, nên không mất đường dẫn nào cho Google. */
  body.tm-mh .wstm-footer,
  body.tm-mh .wstm-promise,
  body.tm-mh .wstm-support,
  body.tm-mh .wstm-float{display:none !important}

  /* ---- 9.3c Giỏ hàng trống: nút vừa tay, thôi choán màn ----
     28/09/2026 — khách chê "nút hơi to chưa đẹp". Đo ở 390px: hai nút dùng
     lớp `wstm-btn--lg` của theme, cao 64px, chữ IN HOA 17px, chiếm gần nửa
     màn hình cho một việc phụ. Thu về 46px, chữ thường 15px, nút gọi điện
     thành viền nhạt để mắt dồn vào nút chính. */
  body.tm-mh .wstm-empty--cart{padding:26px 16px}
  body.tm-mh .wstm-empty--cart h2{font-size:18px;margin:10px 0 6px}
  body.tm-mh .wstm-empty--cart p{font-size:14px;margin:0 0 18px}
  body.tm-mh .wstm-empty__cta{display:flex;flex-direction:column;gap:9px;align-items:stretch}
  body.tm-mh .wstm-empty__cta .wstm-btn{
    height:46px;min-height:0;padding:0 18px;border-radius:999px;
    font-size:15px;font-weight:700;text-transform:none;letter-spacing:0;
  }
  body.tm-mh .wstm-empty__cta .wstm-btn svg{width:16px;height:16px}
  body.tm-mh .wstm-empty__cta .wstm-btn--outline{
    background:none;border:1px solid var(--line,#E3E8F2);color:var(--text-2,#666);font-weight:600;
  }

  /* ---- 9.3d CHỮ TRONG Ô NHẬP PHẢI ĐỦ 16px ----
     28/09/2026 — khách chụp màn: đang gõ địa chỉ thì cả trang "xộc xệch",
     chữ tràn khỏi mép phải. Không phải lỗi bố cục: Safari trên iPhone TỰ PHÓNG
     TO trang mỗi khi ô đang gõ có cỡ chữ NHỎ HƠN 16px, và nó không thu lại.
     Đo được 9 ô đang để 13–14px: họ tên, điện thoại, email, tỉnh, phường,
     địa chỉ, ghi chú, và hai ô chọn cách giao hàng.
     16px là ngưỡng của Safari — đủ 16 là hết phóng, không cần mẹo gì thêm. */
  body.tm-mh input:not([type=checkbox]):not([type=radio]),
  body.tm-mh select,
  body.tm-mh textarea{font-size:16px}
  /* Ô ghi chú được theme đặt cỡ chữ bằng selector mạnh hơn, phải gọi đích danh. */
  body.tm-mh textarea#order_comments{font-size:16px}

  /* ---- 9.4 Tên khối: chữ nhỏ, viết thường, đúng kiểu TikTok ---- */
  body.tm-mh .wstm-cobox__title,
  body.tm-mh .wstm-summary__title,
  body.tm-mh .wstm-suggest-box__head h2{
    font-size:15px;font-weight:700;text-transform:none;letter-spacing:0;
    color:var(--text,#161823);margin:0 0 10px;text-align:left;
  }
  body.tm-mh .wstm-suggest-box__head{justify-content:flex-start}

  /* ---- 9.5 Giỏ hàng: bỏ nút thanh toán LẶP trong thẻ tóm tắt ----
     Thanh dính đáy đã có đúng nút đó rồi; để hai nút giống hệt nhau trên cùng
     một màn hình là chỗ khách hay bấm nhầm. */
  body.tm-mh.tm-mh--gio .wstm-summary .wc-proceed-to-checkout,
  body.tm-mh.tm-mh--gio .wstm-summary .tmmh-ghi{display:none}

  /* ---- 9.5b Thanh toán: chỉ CÒN MỘT nút "Đặt hàng" như TikTok ----
     Nút thật `#place_order` nằm cuối khối tóm tắt, nút ở thanh dính đáy chỉ bấm
     hộ nó. KHÔNG dùng `display:none` cho nút thật: WooCommerce và jQuery còn soi
     nút này, ẩn hẳn là có ngày đặt hàng không ăn. Thu nó về 1px theo đúng cách
     "ẩn với mắt, còn với máy" nên jQuery vẫn thấy `:visible`. */
  body.tm-mh.tm-mh--tt #order_review_wrap .form-row.place-order #place_order{
    position:absolute;width:1px;height:1px;padding:0;margin:0;
    overflow:hidden;white-space:nowrap;border:0;opacity:0;pointer-events:none;
  }
  body.tm-mh.tm-mh--tt #order_review_wrap .form-row.place-order .tmmh-dat-phu{display:none}

  /* ---- 9.6 Thanh dính đáy ----
     Giỏ hàng: [✓ Tất cả] [tổng tiền · Xem chi tiết] [Thanh toán (N)] một hàng.
     Thanh toán: TikTok xếp hai tầng — dòng tổng ở trên, nút to hết bề ngang ở
     dưới, để ngón cái bấm được mà không cần nhìn. */
  body.tm-mh .wstm-dathang{padding:10px 12px calc(10px + env(safe-area-inset-bottom))}
  body.tm-mh.tm-mh--tt .wstm-dathang{
    display:grid;grid-template-columns:1fr;gap:9px;
  }
  body.tm-mh.tm-mh--tt .wstm-dathang__tien{
    display:flex;align-items:baseline;justify-content:space-between;gap:12px;
    text-align:left;
  }
  body.tm-mh.tm-mh--tt .wstm-dathang__nut{
    width:100%;min-width:0;border-radius:999px;padding:14px 20px;font-size:16px;
  }
}

/* ==========================================================================
   9b. TẤM HỎI LẠI KHI KHÁCH ĐỊNH RỜI GIỎ HÀNG / THANH TOÁN  (27/09/2026)
   Chép theo ảnh TikTok Shop khách gửi: hình vẽ nét, một câu, nút đỏ to ở giữa,
   nút "Có lẽ để sau" chữ xám bên dưới — bấm là đi ra ngay, không giữ thêm.
   ========================================================================== */
.tmmh-giu{position:fixed;inset:0;z-index:9995;display:flex;align-items:center;justify-content:center;padding:24px}
.tmmh-giu[hidden]{display:none}
.tmmh-giu__nen{position:absolute;inset:0;background:rgba(14,20,36,.45)}
.tmmh-giu__hop{
  position:relative;width:100%;max-width:330px;background:#fff;border-radius:20px;
  padding:26px 22px 18px;text-align:center;box-shadow:0 18px 50px rgba(10,16,32,.28);
}
.tmmh-giu__x{
  position:absolute;top:10px;right:12px;width:34px;height:34px;border:0;background:none;
  font-size:26px;line-height:1;color:var(--text-2,#666);cursor:pointer;border-radius:50%;
}
.tmmh-giu__x:hover{background:var(--ivory,#F2F3F5)}
.tmmh-giu__hinh{display:flex;justify-content:center;margin:4px 0 14px}
.tmmh-giu__hinh svg{width:150px;height:auto}
.tmmh-giu__chu{
  margin:0 0 18px;font-size:19px;font-weight:800;line-height:1.35;color:var(--text,#161823);
}
.tmmh-giu__tiep{
  width:100%;border:0;border-radius:999px;cursor:pointer;
  background:var(--mh-do,#FE2C55);color:#fff;font-family:inherit;
  font-size:16px;font-weight:700;padding:14px 18px;
}
.tmmh-giu__tiep:active{background:var(--mh-do-dam,#E4244A)}
.tmmh-giu__sau{
  width:100%;margin-top:6px;border:0;background:none;cursor:pointer;font-family:inherit;
  font-size:15px;font-weight:600;color:var(--text-2,#7A8496);padding:12px 8px;
}

/* Lời nhắc ưu đãi khách quay lại, ở trang thanh toán. */
.tmmh-nhac-taimua{
  margin:0 0 14px;padding:10px 12px;border-radius:12px;
  background:#FFF8E8;border:1px solid #FFE0A3;color:#8A5B00;
  font-size:13.5px;font-weight:600;line-height:1.45;
}

/* ==========================================================================
   10. TÔN TRỌNG "GIẢM CHUYỂN ĐỘNG"
   ========================================================================== */
@media (prefers-reduced-motion:reduce){
  body.tm-mh *,body.tm-mh *::before,body.tm-mh *::after{
    animation-duration:.01ms !important;transition-duration:.01ms !important;
  }
}

/* =========================================================================
   10. NÚT LẤY VỊ TRÍ Ở TRANG THANH TOÁN
   ========================================================================= */
.tmmh-vitri {
	/* Đứng đầu khối địa chỉ nên trải hết bề ngang: khách nhìn thấy trước khi
	   kịp gõ tay, và ngón tay chạm trúng dễ hơn. */
	display: flex;
	width: 100%;
	justify-content: center;
	align-items: center;
	gap: 7px;
	margin: 0 0 14px;
	padding: 12px 14px;
	border: 1px solid rgba(15, 23, 42, .14);
	border-radius: 999px;
	background: #fff;
	color: #0f172a;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	text-align: left;
}

.tmmh-vitri:active {
	background: #f1f5f9;
}

.tmmh-vitri[disabled] {
	opacity: .65;
	cursor: default;
}

.tmmh-vitri svg {
	flex: 0 0 17px;
	color: #fe2c55;
}

.tmmh-vitri.is-hong {
	border-color: #fecaca;
	color: #b91c1c;
}

.tmmh-vitri.is-hong svg {
	color: #b91c1c;
}
