/* Quy chuẩn giao diện (20/10/2026, anh Khôi duyệt "sửa triệt để"). Nạp CUỐI, sau giao-dien.css.
   Một bộ màu, một thang chữ, một kiểu bo góc cho nút / ô nhập / nút lọc / thẻ. Vùng bấm tối thiểu 44px. */
:root{
  --dk:#071c1f; --gr:#436B4A; --gr2:#365a3c; --lt:#e9f0ea; --bg:#F7F5EB; --mu:#4b5a5c; --ln:#e3e6dc; --vi:#d5d8cf; --rd:#c43b2e;
  --bo:8px; --cao-nut:48px; --cao-o:48px; --vong:0 0 0 3px rgba(67,107,74,.18);
}
.gx{--mu:#4b5a5c;--ln:#e3e6dc;--rd:#c43b2e}

/* ---------- nút ---------- */
.gx .btn-g,.theme-btn-1.btn,.theme-btn-2.btn,.btn-effect-1,.btn-effect-2,.mini-cart-footer .btn-wrapper .btn{border-radius:var(--bo)}
.gx .btn-g{height:var(--cao-nut);font-size:16px}
.gx .btn-g:focus-visible,.theme-btn-1:focus-visible{outline:0;box-shadow:var(--vong)}

/* ---------- ô nhập / ô chọn: cao 48, bo 8, viền xám, vòng xanh khi nhập ---------- */
input[type=text],input[type=email],input[type=tel],input[type=password],input[type=number],input[type=search],textarea,select,
.gx .f .in,.gx .dh input,.gx .dh textarea,.gx .bar select{border:1px solid var(--vi);border-radius:var(--bo);font-family:Nunito,sans-serif;font-size:16px;color:var(--dk);background:#fff;box-shadow:none}
input[type=text],input[type=email],input[type=tel],input[type=password],input[type=number],.gx .f .in,.gx .dh input{height:var(--cao-o)}
input:focus,textarea:focus,select:focus,.gx .dh input:focus,.gx .dh textarea:focus,.gx .f .in:focus{border-color:var(--gr);outline:0;box-shadow:var(--vong)}
.gx .dh .cart-plus-minus input,.gx .cart-plus-minus input.cart-plus-minus-box{border:0;border-radius:0;box-shadow:none;height:100%}
.gx .bar select{height:44px;padding:0 36px 0 12px;font-weight:700;font-size:15px;-webkit-appearance:none;appearance:none;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23071c1f' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 12px center}
/* nhãn ô: một kiểu — chữ đậm, phần "(tuỳ chọn)" chữ thường màu phụ, không nghiêng */
.gx .dh label{font-size:15px;font-weight:800}
.gx .dh label i,.gx .dh label small,.gx .dh label em{font-style:normal;font-weight:600;color:var(--mu)}
/* số lượng: khung bo cùng kiểu */
.gx .mua .cart-plus-minus,.gx .gh .cart-product-quantity .cart-plus-minus{border-radius:var(--bo);overflow:hidden;border-color:var(--vi)}
.gx .cart-plus-minus .qtybutton{width:44px}

/* ---------- nút lọc / lựa chọn ---------- */
.gx .chip{height:44px;border-radius:999px;padding:0 18px;font-size:15px;border-color:var(--vi)}
.gx .san-pham-btn a,.gx .chon-rang a{height:44px;border-radius:var(--bo);border-color:var(--vi);font-size:15px}
.gx .tags a,.gx .tags span{border-radius:999px;padding:5px 12px}
.gx .trang a,.gx .trang span{min-width:44px;height:44px;border-radius:var(--bo)}
.gx .note,.gx .tong,.gx .xong,.gx .loi-ds{border-radius:var(--bo)}
.gx .bd{border-radius:6px;top:10px;left:10px}

/* ---------- thẻ sản phẩm: khung bo, nút giỏ một hàng riêng (không đè tên) ---------- */
.gx .card{display:flex;flex-direction:column;border:1px solid var(--ln);border-radius:var(--bo);overflow:hidden;transition:box-shadow .15s,border-color .15s}
.gx .card:hover{border-color:#cfd6c9;box-shadow:0 6px 18px rgba(7,28,31,.08)}
.gx .card .ln{flex:1 1 auto;padding:0 0 4px}
.gx .card .tg,.gx .card .t,.gx .card .pr{padding-left:12px;padding-right:12px}
.gx .card .tg{padding-top:10px;font-size:12px;color:var(--mu);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gx .card .t{font-size:15px}
.gx .card .pr{padding-right:12px;display:flex;flex-wrap:wrap;align-items:baseline;column-gap:6px}
.gx .card .pr s{margin-left:0}
.gx .card .them{position:static;display:flex;align-items:center;justify-content:center;gap:6px;width:auto;height:44px;margin:0 12px 12px;border-radius:var(--bo);
  font:800 14px/1 Nunito,sans-serif;background:var(--gr);color:#fff;border:0;text-decoration:none;white-space:nowrap}
.gx .card .them span{position:static;font:inherit}
.gx .card .them.o{background:#fff;color:var(--gr);border:1.5px solid var(--gr)}
.gx .card .them.o:hover{background:var(--lt);color:var(--gr)}
.gx .hs .card{border-radius:var(--bo)}
@media (max-width:767px){.gx .grid{gap:12px 10px}.gx .card .t{font-size:14px}.gx .card .pr b{font-size:15px}.gx .card .them{font-size:13px;margin:0 8px 10px}.gx .card .tg,.gx .card .t,.gx .card .pr{padding-left:10px;padding-right:10px}}

/* ảnh trong trang chi tiết / bài viết / giỏ: bo nhẹ cùng kiểu */
.gx .gal .main,.gx .gal .th button,.gx .post img,.gx .gh .cart-product-image img,.gx .pt img,.gx .bvct .anh{border-radius:var(--bo);overflow:hidden}

/* ---------- đầu trang ---------- */
.gd-dau .header-search-1 .search-icon,.gd-dau .mini-cart-icon>a,.gd-dau .mobile-menu-toggle>a,.nn-chon summary{width:44px;height:44px;border-radius:var(--bo);border-color:var(--ln)}
.nn-chon summary{width:auto;min-width:44px}
.nn-chon ul{border-radius:var(--bo);overflow:hidden}
.gd-dau .mini-cart-icon sup{border-radius:999px;top:-6px;right:-6px}
@media (max-width:575px){
  .gd-dau .site-logo img{height:30px}
  .gd-dau .ltn__header-middle-area>.container>.row{min-height:60px}
  .gd-dau .ltn__header-options{padding-right:0}
}

/* ---------- menu điện thoại ---------- */
.ltn__utilize{width:min(340px,88vw)}
.ltn__utilize-menu>ul>li>a{text-transform:none;font-size:17px;font-weight:800;padding:12px 52px 12px 0;line-height:1.35;border-bottom:1px solid var(--ln)}
.ltn__utilize-menu>ul>li .menu-expand{width:44px;height:48px;top:0}
.ltn__utilize-menu>ul>li .menu-expand::before,.ltn__utilize-menu>ul>li .menu-expand::after{background-color:var(--dk);transform:scale(1)}
.ltn__utilize-menu>ul>li .menu-expand::after{transform:rotate(90deg)}
.ltn__utilize-menu>ul>li.active .menu-expand::after{transform:none}
.ltn__utilize-menu>ul>li .sub-menu{padding:4px 0 8px 14px}
.ltn__utilize-menu .sub-menu li a{display:block;padding:10px 0;font-size:15px;font-weight:600;text-transform:none}
.ltn__utilize-menu-search-form input[type=search]{border-radius:var(--bo) 0 0 var(--bo);border-color:var(--vi)}
.ltn__utilize-menu-search-form button{border-radius:0 var(--bo) var(--bo) 0;border-color:var(--vi)}
.menu-nn a{border-radius:var(--bo);border-color:var(--vi)}
.ltn__utilize-close{border-radius:var(--bo)}

/* ---------- giỏ hàng nhỏ ---------- */
.mini-cart-product-area .mini-cart-img img{border-radius:var(--bo)}
.mini-cart-product-area .mini-cart-item-delete{width:44px;height:44px;display:grid;place-items:center}

/* ---------- nút "Góp ý" nổi: điện thoại thì nằm trong chân trang, không che giá / tiêu đề ---------- */
.gy-nut{border-radius:999px!important;padding:10px 16px!important}
@media (max-width:767px){.gy-nut{display:none}}

/* ---------- chân trang ---------- */
.gd-cuoi .ltn__social-media ul li a{border-radius:var(--bo)}
.gd-cuoi .footer-menu ul li a{padding:6px 0}
.ltn__utilize-menu>ul>li,.ltn__utilize-menu .sub-menu li{margin:0}

/* ---------- trang 404 ---------- */
.gx .loi404{text-align:center;max-width:720px;margin:0 auto;padding-top:48px;padding-bottom:32px}
.gx .loi404 .ma{font:900 64px/1 Nunito,sans-serif;color:var(--gr);margin:0 0 8px;letter-spacing:2px}
.gx .loi404 h1{margin-bottom:10px}
.gx .loi404>p{color:var(--mu)}
.gx .loi404 .tim{display:flex;gap:8px;max-width:480px;margin:20px auto}
.gx .loi404 .tim input{flex:1;min-width:0;padding:0 14px}
.gx .loi404 .tim .btn-g{padding:0 22px}
.gx .loi404 .chips{justify-content:center;flex-wrap:wrap;margin:8px 0 18px;padding:0}
@media (max-width:767px){.gx .loi404 .chips{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;margin:8px -16px 18px;padding:0 16px 4px}}
.gx .loi404 a:not(.chip){color:var(--gr);font-weight:700}

/* ---------- đăng nhập (khách chưa đăng nhập vào /tai-khoan) ---------- */
.gx .dn{display:flex;justify-content:center;padding-top:40px;padding-bottom:56px}
.gx .dn-hop{width:100%;max-width:440px;border:1px solid var(--ln);border-radius:var(--bo);background:#fff;padding:28px 24px}
.gx .dn-hop h1{margin:0 0 10px}
.gx .dn-hop ul{margin:6px 0 22px;padding-left:20px;color:var(--mu)}
.gx .dn-hop li{margin:4px 0}
.gx .dn-g{display:flex;align-items:center;justify-content:center;gap:10px;height:var(--cao-nut);border:1px solid var(--vi);border-radius:var(--bo);
  background:#fff;color:var(--dk);font:800 16px/1 Nunito,sans-serif;text-decoration:none}
.gx .dn-g:hover{border-color:var(--gr);background:var(--lt);color:var(--dk)}
.gx .dn-g:focus-visible{outline:0;box-shadow:var(--vong)}
.gx .dn-phu{margin:16px 0 0;font-size:14px;color:var(--mu)}
.gx .dn-phu a{color:var(--gr);font-weight:700}

/* ---------- đặt hàng: một cột trên điện thoại (giỏ trước, form sau), hai cột trên máy tính ---------- */
.gx .dh2{padding-top:8px;padding-bottom:48px}
.gx .dh2-luoi{display:grid;gap:20px}
.gx .dh2 h2{font-size:19px;margin:0 0 12px}
.gx .dh2-gio{border:1px solid var(--ln);border-radius:var(--bo);background:#fff;padding:16px}
.gx .dh2-gio-dau{display:flex;align-items:baseline;justify-content:space-between}
.gx .dh2-gio-dau a{color:var(--gr);font-weight:700;font-size:14px}
.gx .dh2-ds .dong{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid var(--ln);font-size:15px}
.gx .dh2-ds .dong[hidden]{display:none}
.gx .dh2-ds .dong b,.gx .dh2-ds .dong strong{white-space:nowrap}
.gx .dh2-ds .sl{color:var(--mu);font-weight:700}
.gx .dh2-ds .ship{margin:0;padding:10px 0;border-top:1px solid var(--ln);font-size:13px;color:var(--mu)}
.gx .dh2-ds .ship a{color:var(--gr)}
.gx .dh2-ds .dong-giam b{color:var(--gr)}
.gx .dh2-ds .tong{font-weight:800;font-size:18px;border-top:2px solid var(--dk)}
.gx .dh2 .dh{border:0;padding:0;background:none}
.gx .dh2-o{display:grid;grid-template-columns:1fr;gap:14px 16px;margin-bottom:16px}
.gx .dh2-o label{display:block;margin:0 0 6px}
.gx .dh2-o input{width:100%;padding:0 14px}
.gx .dh2 .ma-giam-o{display:flex;gap:8px}
.gx .dh2 .ma-giam-o .btn-g{flex:0 0 auto;padding:0 18px;background:#fff;color:var(--gr);border:1.5px solid var(--gr);font-weight:800}
.gx .dh2 .ma-bao{margin:6px 0 0}
.gx .dh2 .ma-nhan{margin:6px 0 0}
.gx .dh2 .g-recaptcha{margin:0 0 14px}
.gx .dh2-nut{width:100%;font-size:17px;font-weight:800;text-transform:none}
.gx .dh2-phu{margin:10px 0 0;font-size:14px;color:var(--mu);text-align:center}
.gx .dh2 .loi-ds{background:#fdecea;border:1px solid #f3c2bc;color:#8a2219;padding:12px 16px;margin-bottom:16px}
.gx .dh2 .loi-ds ul{margin:0;padding-left:18px}
@media (min-width:768px){.gx .dh2-o{grid-template-columns:1fr 1fr}.gx .dh2-o>div:not(.nua){grid-column:1/-1}}
@media (min-width:992px){
  .gx .dh2-luoi{grid-template-columns:minmax(0,1fr) 380px;gap:32px;align-items:start}
  .gx .dh2-gio{grid-column:2;grid-row:1;position:sticky;top:96px}
  .gx .dh2 .dh{grid-column:1;grid-row:1}
  .gx .dh2-nut{width:auto;min-width:260px;padding:0 32px}
  .gx .dh2-phu{text-align:left}
}
.mini-cart-product-area .mini-cart-item-delete{cursor:pointer;border-radius:999px}
.mini-cart-quantity{font-weight:700;color:var(--dk)}
.mini-cart-footer .mini-cart-sub-total h5{font-size:17px;font-weight:800}
.mini-cart-footer>p a{color:var(--gr);text-decoration:underline}

/* ---------- /tim-gu: thanh "Tiếp" dính đáy MÀN HÌNH khi đang làm, dừng lại trên chân trang (không đè footer) ---------- */
.gx.quiz{min-height:0;padding-bottom:40px}
.gx .qb{position:sticky;bottom:0;margin-top:20px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));box-shadow:0 -6px 16px rgba(7,28,31,.06)}
.gx .qb .btn-g{height:var(--cao-nut)}
.gx .qb .lk{min-height:44px;display:inline-flex;align-items:center;font-size:14px}
@media (min-width:768px){.gx .qb{padding-left:16px;padding-right:16px;border:1px solid var(--ln);border-radius:var(--bo)}}

/* ---------- trang bài riêng (Về chúng tôi, Liên hệ, chính sách) ---------- */
.gx .trang-don{max-width:760px;margin:0 auto;padding-bottom:48px;font-size:17px;line-height:1.7;color:var(--dk)}
.gx .trang-don h1,.gx .trang-don h2,.gx .trang-don h3,.gx .trang-don h4{text-transform:none;letter-spacing:0;line-height:1.3;margin:28px 0 10px}
.gx .trang-don h1,.gx .trang-don h2{font-size:24px}.gx .trang-don h3{font-size:20px}.gx .trang-don h4{font-size:18px}
.gx .trang-don p{margin:0 0 14px;text-align:left!important}
.gx .trang-don img{max-width:100%;height:auto!important;border-radius:var(--bo);margin:8px auto 18px}
/* ảnh đầu bài không chiếm hết màn hình điện thoại */
.gx .trang-don>p:first-child img,.gx .trang-don>img:first-child{width:100%;max-height:min(56vh,440px);object-fit:cover}
.gx .trang-don ul,.gx .trang-don ol{padding-left:22px;margin:0 0 14px}
.gx .trang-don a{color:var(--gr);text-decoration:underline}
.gx .trang-don table{width:100%!important;display:block;overflow-x:auto}
.ltn__utilize .mini-cart-footer .mini-cart-sub-total h5{display:flex;justify-content:space-between;align-items:baseline}
.ltn__utilize .mini-cart-footer .mini-cart-sub-total h5 b{color:var(--gr);white-space:nowrap}
.ltn__utilize .mini-cart-footer .mini-cart-sub-total h5 span{float:none;margin:0}
.gx .dh2-ds .tong{background:none;padding:12px 0 0}
@media (min-width:768px){.gx.quiz .qb{width:100%;box-sizing:border-box;margin-left:0;margin-right:0}}

/* reCAPTCHA chấm điểm: ẩn huy hiệu ở trang đặt hàng, đã ghi dòng thông báo dưới nút */
.gx .dh2-rc{margin:6px 0 0;font-size:12px;line-height:1.5;color:#6b6b6b}.gx .dh2-rc a{color:inherit;text-decoration:underline}
body:has(.dh2-rc) .grecaptcha-badge{visibility:hidden}
/* mã giảm: dành sẵn chỗ cho dòng báo và nút "Nhận mã" để nút Đặt hàng không xê dịch khi gõ SĐT / áp mã */
.gx .dh .ma-giam .ma-bao{min-height:2.6em}
.gx .dh .ma-giam .ma-nhan[hidden]{display:inline-block!important;visibility:hidden}
/* điện thoại: ô nhập < 16px thì iPhone tự phóng to khi chạm */
@media (max-width:991px){input[type=search],input[type=text],input[type=tel],input[type=email],input[type=number],select,textarea{font-size:16px!important}}
/* ảnh chưa tải: nền chờ thay vì ô trắng */
.gx .pt img,.gx .gal .th img,.gx .gal .main img{background:#e9efe6}
/* menu điện thoại: 1 nút đóng (trong menu), nền tối phía sau, chạm nền là đóng */
.mobile-menu-toggle a.close{visibility:hidden}
.ltn__utilize-overlay{z-index:9998;cursor:pointer}
.ltn__utilize{z-index:9999}
body.ltn__utilize-open{overflow:hidden}
.gx .qh2 h2.qh{font-weight:800;font-size:28px;line-height:1.25;margin-top:6px}@media (min-width:992px){.gx .qh2 h2.qh{font-size:36px}}
/* điện thoại: link chân trang / đường dẫn đủ cao để bấm bằng ngón tay (~44px) */
@media (max-width:991px){.gd-cuoi .footer-menu ul li a,.gd-cuoi .footer-address ul li a{display:inline-block;padding:11px 0}.gx .bc a{display:inline-block;padding:10px 0}}
.gd-cuoi .ltn__social-media a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px}
/* nút "Điền nhanh bằng Gmail": cùng kiểu nút phụ (viền mảnh màu chủ đạo) */
.gx .dien-nhanh{display:flex;align-items:center;gap:10px;width:100%;min-height:var(--cao-nut,48px);justify-content:center;border:1.5px solid var(--gr);border-radius:8px;padding:8px 14px;margin:0 0 18px;font-weight:700;color:var(--gr);background:#fff;text-decoration:none;box-shadow:none}
.gx .dien-nhanh:hover{background:#f2f6ef;color:var(--gr)}
.gx .dien-nhanh.da{justify-content:flex-start;background:#f2f6ef;border-color:#d6dccf;color:#1f2a22;font-weight:500;font-size:14px}
.gx .dien-nhanh.da img{border-radius:50%}.gx .dien-nhanh.da a{margin-left:auto;color:var(--gr)}
/* theme tự gắn "animated fadeIn" cho mọi h3: máy chặn/hoãn hiệu ứng thì chữ kẹt opacity 0 → tắt */
h3.animated.fadeIn{animation:none!important;opacity:1!important}
.gx .gio-trong{text-align:center;padding-top:24px;padding-bottom:64px}.gx .gio-trong p{font-size:17px;margin-bottom:18px}.gx .gio-trong .btn-g{display:inline-flex;align-items:center;padding:0 28px}
.gx .dh2-ds .sua{display:inline-flex;align-items:center;gap:6px;margin-left:6px;vertical-align:middle}
.gx .dh2-ds .sua[hidden]{display:none}
.gx .dh2-ds .sua button{min-width:32px;height:32px;border:1px solid var(--ln);border-radius:8px;background:#fff;font-weight:700;cursor:pointer}
.gx .dh2-ds .sua b{min-width:22px;text-align:center}
.gx .dh2-ds .sua .xoa{padding:0 10px;color:#b3261e}
.gx .dh2-gio[aria-busy=true]{opacity:.6;pointer-events:none}