@charset "UTF-8";
/* =============================================================================
   THANG CHỮ CHUẨN — bật ở Giao diện AZPOS → Thông tin chung → "Cỡ chữ theo thang chuẩn" (bofit 03/11/2026).
   One không bật: One giữ khớp số đo gốc onewaymobile.

   Vì sao có tệp này: style.css viết cỡ chữ bằng rem, mà ≥1200px thì 1rem = 1vw, nên chữ co theo màn hình:
   - màn 1366: tên SP 10.7px, giá gốc 10px, "Mới 100%" + chân trang 8.5px, thẻ thanh toán 7.9px, trong khi tiêu đề 25px;
   - màn 1024 (1rem = 16px) tiêu đề lại to hơn màn 1366: 29px so với 25px;
   - điện thoại: "… MỚI NHẤT" in hoa 25px to hơn "… NỔI BẬT" 18px, dù cùng một cấp.

   Thang chữ: 12 · 13 · 14 · 16 · 20 · 24 (px). Đậm chỉ dùng 400 / 500 / 600 / 700 (800 chỉ còn ở logo).
   Từ 1700px trở lên chữ mới to dần theo màn hình (--k > 1px) cho khớp khung rem đang to dần; dưới đó cỡ chữ cố định.
   Chỉ đổi chữ và những chỗ xếp bị vỡ khi chữ to lên. Khung, lề, màu giữ nguyên.
   Tệp nạp sau cùng nên chỉ cần cùng độ ưu tiên với style.css là thắng, kể cả luật trong @media của style.css.
   ============================================================================= */
:root {
  --k: max(1px, calc(1rem / 17));
  --c12: calc(12 * var(--k));
  --c13: calc(13 * var(--k));
  --c14: calc(14 * var(--k));
  --c16: calc(16 * var(--k));
  --c20: calc(20 * var(--k));
  --c24: calc(24 * var(--k));
}

/* ---------- đầu trang ---------- */
.hd-logo .chu small { font-size: 11px; }
.hd-search input { font-size: 16px; } /* điện thoại: dưới 16px thì iPhone tự phóng to trang khi bấm vào ô */
.goi-y { font-size: var(--c13); line-height: 1.4; }
.mcat-trai li a, .mcat-nhom .xem-tat, .mcat-nhom .cot > a, .mcat-nhom .cot li a { font-size: 13px; line-height: 1.35; }

/* ---------- tiêu đề khối: "nổi bật" và "mới nhất" cùng một cấp nên cùng một kiểu ---------- */
.nb-trai :is(h1, h2), .dm-tieude h2 { font-size: var(--c20); line-height: 1.25; font-weight: 700; color: #000; text-transform: none; }

/* hàng tiêu đề "mới nhất": tiêu đề + nút trên một hàng, chip danh mục xuống hàng dưới (xếp chung một hàng thì tiêu đề bị ép 2 dòng) */
.nhom-dm { flex-direction: column-reverse; align-items: stretch; gap: 12px; margin-bottom: 16px; }
.dm-tieude { justify-content: space-between; gap: 16px; }
.dm-tieude h2 { min-width: 0; margin-right: 0; }
.dm-chip { margin-bottom: 0; }
.dm-chip > span { font-size: var(--c12); line-height: 1.3; font-weight: 600; letter-spacing: .02em; white-space: nowrap; }
.dm-chip ul { padding-bottom: 0; }
.dm-chip a { font-size: var(--c13); line-height: 1.3; font-weight: 500; padding: 6px 14px; }

/* nút "Xem tất cả" */
.dm-tieude .nut, .nhom-xemtat, .fl-xemthem { font-size: var(--c14); line-height: 1.2; font-weight: 600; padding: calc(9 * var(--k)) calc(20 * var(--k)); }

/* ---------- thẻ sản phẩm: tên luôn đủ chỗ 2 dòng, hàng đánh giá ghim đáy → giá và đánh giá các thẻ thẳng hàng ---------- */
.the-sp { display: flex; flex-direction: column; }
.swiper-slide:has(> .the-sp), .nhom-ds > .the-sp { height: auto; } /* height:100% của theme làm flex không kéo giãn: thẻ có giá gốc cao hơn thẻ không có */
.the-sp :is(h2, h3) { height: auto; min-height: 2.8em; margin: calc(10 * var(--k)) 0 calc(6 * var(--k)); font-size: 13px; line-height: 1.4; font-weight: 600; }
.gia, .the-sp .gia { flex-direction: column; flex-wrap: nowrap; align-items: flex-start; }
.gia b { font-size: var(--c16); line-height: 1.3; font-weight: 700; }
.gia del { font-size: var(--c12); line-height: 1.3; font-weight: 400; margin: 2px 0 0; }
.tinh-trang { margin-top: auto; padding-top: calc(10 * var(--k)); }
.giam { font-size: var(--c12); line-height: 1.2; font-weight: 700; }
.bien-the a { font-size: var(--c12); line-height: 1.3; }
.sao { font-size: var(--c12); line-height: 1.3; }
.nhan-moi { font-size: var(--c12); line-height: 1.4; font-weight: 600; padding: 1px calc(8 * var(--k)); }
.uu-dai { font-size: var(--c12); line-height: 1.5; }
.the-sp .anh.co-khung::after { font-size: calc(11 * var(--k)); }
/* thẻ Flash Sale (chỉ hiện khi có sản phẩm flash) */
.the-fs h3 { font-size: var(--c14); line-height: 1.4; font-weight: 600; }
.the-fs .gia { flex-wrap: wrap; }
.the-fs .gia b { font-size: var(--c16); line-height: 1.3; }
.the-fs .gia del { font-size: var(--c12); line-height: 1.3; margin: 0; }
.the-fs .nut-deal { font-size: var(--c13); }

/* ---------- chân trang ---------- */

/* ---------- thanh đáy điện thoại ---------- */
.thanh-day a { font-size: 12px; line-height: 1.3; }

/* điện thoại: chữ công ty to hơn thì xuống hàng riêng dưới logo, không bị ép thành cột hẹp */
@media (max-width: 767px) {
}

/* =============================================================================
   ≥ 768px
   ============================================================================= */
@media (min-width: 768px) {
  /* đầu trang */
  .hd-logo .chu small { font-size: 11.23px; }
  .hd-search input { font-size: var(--c14); line-height: normal; }
  .hd-hotline span { font-size: var(--c12); line-height: 1.3; font-weight: 500; }
  .hd-hotline b { font-size: var(--c16); line-height: 1.3; font-weight: 700; }
  .hd-menu > li > a { font-size: var(--c13); line-height: 1.3; white-space: nowrap; }
  .mega > ul > li > a { font-size: var(--c14); line-height: 1.3; }
  .mega-con > li > a { font-size: var(--c14); line-height: 1.3; font-weight: 600; }
  .mega-con ul a { font-size: var(--c13); line-height: 1.4; }

  /* khối sản phẩm */
  .nb-trai :is(h1, h2), .dm-tieude h2 { font-size: var(--c24); }
  .nhom-dm { gap: calc(14 * var(--k)); margin-bottom: calc(20 * var(--k)); }
  .dm-chip { gap: 10px; }
  .dm-chip ul { flex-wrap: wrap; gap: 8px; }
  .dm-chip a { margin-left: 0; }
  .the-sp :is(h2, h3) { font-size: var(--c14); }

  /* chân trang */
  .nut-zalo span { font-size: var(--c13); }
}

/* Cột chân trang cách ĐỀU (bofit 03/11/2026): theme chia 16,67% ×3 + 25% ×2 nên mép trái các cột cách nhau 238 · 238 · 238 · 357px.
   Cột co theo chữ, phần dư chia đều giữa các cột, cột cuối sát mép phải khung. Từ 992 vì dưới đó theme xếp 3 cột/hàng. */
@media (min-width: 992px) {
}

/* Menu ngang: chữ 13px không đủ chỗ xếp icon bên cạnh trên một hàng → dưới 1536px đặt icon trên chữ (như máy tính bảng của theme) */
@media (min-width: 768px) and (max-width: 1535px) {
  .hd-menu > li > a { flex-direction: column; gap: 3px; padding: 7px 5px; text-align: center; }
}
@media (min-width: 768px) and (max-width: 1199px) {
  .hd-menu > li > a { font-size: 12px; padding: 7px 6px; }
}

/* Đủ rộng mới để giá gốc cạnh giá bán; hẹp hơn thì xếp dọc, không tràn thẻ */
@media (min-width: 1600px) {
  .gia, .the-sp .gia { flex-direction: row; flex-wrap: wrap; align-items: baseline; column-gap: calc(8 * var(--k)); }
  .gia del { margin: 0; }
}

/* =============================================================================
   ĐƯỜNG DẪN + TRANG DANH MỤC + TRANG SẢN PHẨM
   Cùng thang trên. H1 và tiêu đề khối: 20px điện thoại, 24px từ 768, như trang chủ.
   Mô tả danh mục + mô tả sản phẩm bỏ Arial, dùng chung phông với cả trang.
   Một số khối bofit đang tắt (trả góp, khuyến mãi, nút tư vấn, bài liên quan) vẫn đặt cỡ, để bật lại không bị chữ tí hon.
   ============================================================================= */
.vet-dan li span { font-size: var(--c13); line-height: 1.4; }
.vet-dan li:last-child { font-weight: 600; }
.vet-dan li + li::before { font-size: var(--c12); }

/* ---------- trang danh mục ---------- */
.dm-ten { font-size: var(--c20); line-height: 1.25; }
.dm-con-ten { font-size: var(--c16); line-height: 1.4; }
.dm-con a, .dm-con-truot .swiper-slide a { font-size: var(--c13); line-height: 1.6; font-weight: 500; }
.dm-logo a { padding: calc(8 * var(--k)) calc(4 * var(--k)); } /* ô hẹp: bớt lề để tên thương hiệu không gãy 5 dòng */
.dm-logo span { padding: 0; font-size: var(--c12); line-height: 1.3; font-weight: 600; }
.dm-loc h2 { font-size: var(--c16); line-height: 1.4; }
.nut-loc { height: auto; min-height: calc(32 * var(--k)); font-size: var(--c13); line-height: 1.2; } /* chiều cao theo rem chỉ còn 25px ở màn 1200, chật cho chữ 13px */
.chip-loc span { font-size: var(--c13); line-height: 1.2; }
.bo-loc-xoa { font-size: var(--c13); }
.dm-sap > span { font-size: var(--c14); line-height: 1.4; font-weight: 600; }
.sap-hien, .o-sap li button span { font-size: var(--c13); line-height: 1.2; }
.dm .trong { font-size: var(--c14); }
.xem-kq, .nut-xemthem { font-size: var(--c14); line-height: 1.2; font-weight: 600; }
.dm-mota > .nut { font-size: var(--c13); line-height: 1.4; font-weight: 600; }
.xem-kq { padding: calc(9 * var(--k)) calc(20 * var(--k)); }

/* mô tả danh mục */
.dm-mota .noi-dung-bai, .dm-mota .noi-dung-bai * { font-family: inherit; }
.dm-mota .noi-dung-bai p, .dm-mota .noi-dung-bai li, .dm-mota .noi-dung-bai ul { font-size: var(--c14); line-height: 1.6; }
.dm-mota .noi-dung-bai h1, .dm-mota .noi-dung-bai h2 { font-size: var(--c16); line-height: 1.35; }
.dm-mota .noi-dung-bai h3 { font-size: var(--c14); line-height: 1.4; }
/* wp.css đè cỡ tiêu đề gắn cứng trong nội dung cũ bằng !important nên ở đây cũng phải vậy */
.dm-mota .noi-dung-bai h2[style*="font-size"] { font-size: var(--c16) !important; }
.dm-mota .noi-dung-bai h3[style*="font-size"] { font-size: var(--c14) !important; }

/* ---------- trang sản phẩm: cột mua ---------- */
.sp-ten { font-size: var(--c20); line-height: 1.3; }
.sp-meta { font-size: var(--c13); line-height: 1.4; }
.sp-nhan .nhan { font-size: var(--c12); line-height: 1.3; }
.nut-thongso { font-size: 11px; line-height: 1.2; padding: 2px; } /* ô 52px: chừa đủ chỗ cho chữ "Thông số" không gãy dòng */
.o-chon strong { font-size: var(--c13); line-height: 1.3; white-space: normal; }
.o-chon span { font-size: var(--c12); line-height: 1.3; white-space: normal; }
.dai-tragop { padding-top: calc(22 * var(--k)); font-size: var(--c20); }
.dai-tragop .nho { font-size: var(--c12); line-height: 1.3; }
.dai-tragop .lon { font-size: var(--c16); line-height: 1.2; }
.gia-tai { font-size: var(--c13); line-height: 1.4; }
.chon-tinh-sp li { font-size: var(--c13); }
.gia-lon { flex-wrap: wrap; row-gap: 4px; }
.gia-lon b { font-size: var(--c20); line-height: 1.3; font-weight: 700; }
.gia-lon del { font-size: var(--c14); line-height: 1.3; font-weight: 400; margin: 0 calc(8 * var(--k)) 0 calc(12 * var(--k)); }
.gia-lon .pt { font-size: var(--c12); line-height: 1.3; }
.hop-km .tieu-de { font-size: var(--c12); line-height: 1.3; }
.hop-km li { font-size: var(--c13); line-height: 1.5; }
.nut-tuvan strong { font-size: var(--c16); line-height: 1.2; font-weight: 700; }
.nut-tragop-the .chu { font-size: var(--c14); line-height: 1.3; font-weight: 700; }
.nut-tragop-the .chu small { font-size: var(--c12); line-height: 1.3; }
.nut-tragop-the .phai span { font-size: var(--c12); line-height: 1.3; }

/* ---------- trang sản phẩm: thông số, mô tả, đánh giá, liên quan ---------- */
.sp-thongso th h2 { font-size: var(--c14); line-height: 1.3; font-weight: 700; }
.sp-thongso thead a { font-size: var(--c13); line-height: 1.4; }
.sp-thongso tbody td { font-size: var(--c13); line-height: 1.5; }
.sp-muacung h2 { font-size: var(--c16); line-height: 1.3; font-weight: 600; }
.sp-mota .noi-dung { font-family: inherit; font-size: var(--c14); line-height: 1.7; }
.sp-mota .noi-dung h1, .sp-mota .noi-dung h2 { font-size: var(--c16); line-height: 1.35; }
.sp-mota .noi-dung h3 { font-size: var(--c14); line-height: 1.4; }
.sp-mota .noi-dung h2[style*="font-size"] { font-size: var(--c16) !important; }
.sp-mota .noi-dung h3[style*="font-size"] { font-size: var(--c14) !important; }
.sp-baiviet .dau h2 { font-size: var(--c14); line-height: 1.3; }
.sp-baiviet .dau a { font-size: var(--c13); line-height: 1.4; }
.sp-baiviet .tin-ngay span { font-size: var(--c12); }
.sp-baiviet h3 { font-size: var(--c14); line-height: 1.4; font-weight: 600; }
.dg-diem .so { font-size: var(--c24); line-height: 1.2; font-weight: 700; }
.dg-diem .chu { font-size: var(--c13); line-height: 1.4; }
.dong-sao .so { font-size: var(--c13); line-height: 1.4; }
.dong-sao .pt { width: auto; min-width: calc(36 * var(--k)); font-size: var(--c13); line-height: 1.4; font-weight: 600; }
.dg-nut button { font-size: var(--c13); line-height: 1.4; font-weight: 700; white-space: nowrap; }
.dg-xem-them { font-size: var(--c13); line-height: 1.2; }
.dg-muc .ten { font-size: var(--c14); line-height: 1.4; font-weight: 600; }
.dg-muc .loi { font-size: var(--c13); line-height: 1.5; }
.dg-muc .tac { font-size: var(--c12); line-height: 1.5; }
.nhom-lq .dau h2 { font-size: var(--c20); line-height: 1.25; }
.nhom-lq .dau .nho { font-size: var(--c16); line-height: 1.3; }
.thanh-mua a { font-size: 13px; line-height: 1.2; }

/* ---------- popup (thông số, đánh giá, tư vấn) ---------- */
.popup .pp-tieu { font-size: var(--c20); line-height: 1.3; }
.popup .phu { font-size: var(--c13); line-height: 1.4; }
.form-tuvan label { font-size: var(--c13); line-height: 1.4; }
.form-tuvan button[type=submit] { font-size: var(--c14); }
.form-tuvan .bao { font-size: var(--c14); }
.bang-ts tr.ts-nhom th { font-size: var(--c14); }
.bang-ts td { font-size: var(--c13); line-height: 1.5; }

@media (min-width: 768px) {
  /* danh mục */
  .dm-ten { font-size: var(--c24); }

  /* sản phẩm */
  .sp-ten { font-size: var(--c24); margin-bottom: calc(6 * var(--k)); }
  .sp-meta { flex-wrap: wrap; gap: 4px 0; }
  .gia-lon b { font-size: var(--c24); }
  .sp-mota .noi-dung { font-size: var(--c16); }
  .sp-mota .noi-dung h1, .sp-mota .noi-dung h2 { font-size: var(--c20); }
  .sp-mota .noi-dung h3 { font-size: var(--c16); }
  .sp-mota .noi-dung h2[style*="font-size"] { font-size: var(--c20) !important; }
  .sp-mota .noi-dung h3[style*="font-size"] { font-size: var(--c16) !important; }
  .dg-tong { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) auto; } /* cột nút theo chiều dài chữ, "ĐÁNH GIÁ NGAY" không bị ép 2 dòng */
  .nhom-lq .dau h2 { font-size: var(--c24); }
  .nhom-lq .dau .nho { font-size: var(--c20); }
  .form-tuvan input, .form-tuvan textarea { font-size: var(--c14); }
}
@media (min-width: 992px) {
  .nut-thongso { font-size: var(--c12); padding: .521rem; }
}