:root{--ink:#111;--mute:#767676;--line:#e5e5e5;--soft:#f3f3f3;--red:#c8102e;--gap:6px}
*{box-sizing:border-box}
body{margin:0;font:400 14px/1.45 Inter,Arial,Helvetica,sans-serif;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,select,input{font:inherit;color:inherit}
button{cursor:pointer}
/* thanh trên + header */
.note{background:#111;color:#fff;font-size:12px;text-align:center;padding:7px 16px;letter-spacing:.02em}
.top{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--line)}
.top-in{height:60px;padding:0 20px;display:flex;align-items:center;gap:32px}
.logo img{height:30px;display:block}
.menu{display:flex;gap:26px;flex:1;font-weight:500;font-size:14px}
.menu a{padding:6px 0;border-bottom:1.5px solid transparent}
.menu a:hover,.menu a.on{border-color:var(--ink)}
.menu .sale{color:var(--red)}
.tools{display:flex;gap:18px;font-size:13px;font-weight:500;align-items:center}
.tools b{display:inline-block;min-width:19px;height:19px;line-height:19px;text-align:center;border-radius:10px;background:var(--ink);color:#fff;font-size:11px;margin-left:5px}
.burger{display:none;background:none;border:0;font-size:22px;padding:0}
@media(max-width:760px){.menu .mi{display:block;height:auto}.menu .dd{display:block;position:static;border:0;box-shadow:none;padding:0}.menu .dd a{padding:10px 20px 10px 36px;font-size:13px;color:var(--mute)}.menu.open{align-items:stretch}.menu{display:none}.burger{display:block}.top-in{gap:14px;padding:0 14px;height:54px}.logo{margin-right:auto}.tools .t-opt{display:none}
 .menu.open{display:flex;position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;gap:0;border-bottom:1px solid var(--line)}.menu.open a{padding:14px 20px;border-top:1px solid var(--line)}}
/* tiêu đề + lọc */
.head{padding:28px 20px 12px}
.head h1{margin:0;font-size:24px;font-weight:500;letter-spacing:.01em}
.head p{margin:6px 0 0;color:var(--mute);font-size:13px;max-width:640px}
.bar{display:flex;align-items:center;gap:10px;padding:10px 20px 14px;flex-wrap:wrap}
.bar .cnt{margin-right:auto;font-size:12px;letter-spacing:.06em;color:var(--mute);font-weight:500}
.bar select{border:1px solid var(--line);background:#fff;height:36px;padding:0 12px;border-radius:0}
/* banner (bật/tắt trong trang quản trị) */
.banner{display:block;margin:0 0 var(--gap);background:linear-gradient(90deg,#111,#3a3a3a);color:#fff;text-align:center;padding:26px 16px;position:relative}
.banner b{display:block;font-size:18px;font-weight:600;letter-spacing:.04em}
.banner span{font-size:13px;opacity:.8}
.banner i{position:absolute;right:10px;top:8px;font-style:normal;font-size:10px;opacity:.55;letter-spacing:.08em}
/* lưới sát mép */
.grid{--cols:4;display:grid;grid-template-columns:repeat(var(--cols),1fr);gap:var(--gap) var(--gap);padding:0}
@media(max-width:1000px){.grid{--cols:3}}
@media(max-width:640px){.grid{--cols:2;--gap:4px}}
.card{min-width:0;position:relative}
.card .fav-c{position:absolute;right:8px;top:8px;z-index:3;width:34px;height:34px;border:0;border-radius:50%;background:rgba(255,255,255,.92);color:var(--ink);font-size:20px;line-height:34px;padding:0;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.18)}.card .fav-c.on{color:var(--red)}
@media(hover:hover){.card .fav-c:hover{color:var(--red)}}
.grid.dn .card .fav-c{width:28px;height:28px;line-height:28px;font-size:16px;right:5px;top:5px}
.card .ph{position:relative;aspect-ratio:1/1;background:var(--soft);overflow:hidden;display:block}
.card .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .3s}
.card .ph img.h{opacity:0}
@media(hover:hover){.card .ph:hover img.h{opacity:1}}
.card .ph.noimg img{opacity:0!important}
.pu{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:linear-gradient(160deg,#e6e6e6,#d2d2d2);color:#8d8d8d;font-weight:500;letter-spacing:.22em;font-size:12px;text-align:center;filter:saturate(0)}
.noimg .pu,.pu.show{display:flex}
.badge{position:absolute;left:8px;top:8px;background:#fff;color:var(--ink);font-size:11px;font-weight:600;padding:3px 8px;z-index:2;letter-spacing:.04em;line-height:1.2}
.badge~.badge{top:calc(8px + 1.2em + 6px + 4px)}   /* 13/11 (đợt 8): HẾT HÀNG + -x% xếp chồng, không đè nhau */
.badge.red{background:var(--red);color:#fff}
.card .meta{padding:10px 12px 22px}
.card .nm{display:block;font-size:13px;line-height:1.4;letter-spacing:.02em;text-transform:uppercase}
.card .pr{margin-top:6px;font-size:13px;display:flex;gap:8px;align-items:baseline}
.card .pr.sale b{color:var(--red);font-weight:600}
.old{color:var(--mute);text-decoration:line-through;font-size:12px}
.dots{display:flex;gap:7px;align-items:center;margin-top:10px;flex-wrap:wrap}
.dot{width:15px;height:15px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.2);border:0;padding:0;background-size:cover;background-position:center;position:relative}
.dot::before{content:"";position:absolute;inset:-4px}
.skip{position:absolute;left:-9999px;top:0;background:#111;color:#fff;padding:10px 14px;z-index:1000}.skip:focus{left:8px;top:8px}
a:focus-visible,button:focus-visible,select:focus-visible{outline:2px solid #111;outline-offset:2px}
.dot.on::after{content:"";position:absolute;inset:-4px;border:1px solid var(--ink);border-radius:50%}
.more{font-size:11px;color:var(--mute)}
/* chi tiết: gallery sát mép + info dính bên phải */
.crumb{font-size:12px;color:var(--mute);padding:14px 20px}
.pd{display:grid;grid-template-columns:minmax(0,1fr) 440px;align-items:start}
@media(max-width:980px){.pd{grid-template-columns:1fr}}
.gal{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}
.gal .tile{position:relative;aspect-ratio:1/1;background:var(--soft);overflow:hidden}
.gal .tile.plain{background:#3a3a3c}
.gal .tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cl{position:absolute;left:0;right:0;bottom:0;padding:110px 12px 22px;background:linear-gradient(to top,rgba(0,0,0,.92) 0%,rgba(0,0,0,.78) 35%,rgba(0,0,0,0));color:#fff;text-align:center;font-weight:600;font-size:clamp(18px,2.2vw,28px);letter-spacing:.14em;text-transform:uppercase;z-index:3;pointer-events:none}
.info{position:sticky;top:60px;padding:8px 32px 40px}
@media(max-width:980px){.info{position:static;padding:16px 20px 32px}}
.info h1,.info h2{font-size:20px;font-weight:500;margin:0 0 4px;line-height:1.3}
.info .code{color:var(--mute);font-size:12px}
.info .price{font-size:18px;margin:14px 0 4px;display:flex;gap:10px;align-items:baseline}
.info .price.sale b{color:var(--red);font-weight:600}
.info .price em{font-style:normal;background:var(--red);color:#fff;font-size:11px;font-weight:600;padding:2px 7px}
.lbl{font-size:12px;font-weight:600;letter-spacing:.08em;margin:22px 0 10px;text-transform:uppercase}
.lbl span{font-weight:400;color:var(--mute);letter-spacing:0;text-transform:none;margin-left:6px}
.info .dots{gap:10px}
.info .dot{width:30px;height:30px}
.sizes{display:flex;gap:8px;flex-wrap:wrap}
.sz{min-width:52px;height:42px;border:1px solid var(--line);background:#fff;font-weight:500}
.sz.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.sz:disabled{color:#b5b5b5;background:repeating-linear-gradient(135deg,#fff 0 6px,#f1f1f1 6px 7px);cursor:not-allowed}
.stock{font-size:12px;color:var(--mute);margin-top:10px;min-height:18px}
.buy{display:flex;gap:10px;margin-top:18px}
.qty{display:flex;border:1px solid var(--line)}
.qty button{width:38px;border:0;background:#fff;font-size:16px}
.qty input{width:40px;border:0;text-align:center}
.btn{flex:1;height:48px;border:0;background:var(--ink);color:#fff;font-weight:600;letter-spacing:.08em;font-size:13px}
.btn:disabled{background:#a5a5a5;cursor:not-allowed}
.perks{margin-top:24px;border-top:1px solid var(--line);font-size:13px}
.perks>div{padding:11px 0;border-bottom:1px solid var(--line)}
.tabs{margin-top:40px;border-top:1px solid var(--line)}
.tabs nav{display:flex;gap:28px;justify-content:center}
.tabs nav button{border:0;background:none;padding:15px 0;font-weight:600;font-size:12px;letter-spacing:.08em;color:var(--mute);border-bottom:2px solid transparent}
.tabs nav button.on{color:var(--ink);border-color:var(--ink)}
.tab{padding:20px;max-width:900px;margin:0 auto}
.tab img{max-width:100%;display:block;margin:0 auto 12px}
.empty{color:var(--mute);text-align:center;padding:22px;border:1px dashed var(--line)}
.vid{aspect-ratio:16/9;margin-bottom:12px}.vid iframe{width:100%;height:100%;border:0}
.rel h2{font-size:18px;font-weight:500;padding:36px 20px 14px;margin:0}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:#111;color:#fff;padding:11px 18px;font-size:13px;opacity:0;transition:.25s;pointer-events:none;z-index:50}
.toast.on{opacity:1}
footer{border-top:1px solid var(--line);margin-top:40px;padding:28px 20px;color:var(--mute);font-size:12px;display:flex;gap:20px;flex-wrap:wrap;justify-content:space-between}

.subcats{display:flex;gap:8px;flex-wrap:wrap;padding:4px 20px 8px}
.subcats a{border:1px solid var(--line);padding:7px 14px;font-size:13px;font-weight:500}
.subcats a:hover{border-color:var(--ink)}
@media(max-width:640px){.head{padding:20px 14px 8px}.bar{padding:8px 14px 12px}.subcats{padding:4px 14px 8px}.crumb{padding:12px 14px}.rel h2{padding:28px 14px 12px}.card .meta{padding:8px 8px 18px}}

/* nút bảng size + popup */
.sizebtn{border:1px solid var(--ink);background:#fff;padding:9px 14px;font-size:12px;font-weight:600;letter-spacing:.06em;margin:2px 0 10px;transition:.18s}
.sizebtn:hover{background:var(--ink);color:#fff}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.6);display:none;align-items:center;justify-content:center;z-index:80;padding:16px}
.modal.on{display:flex}
.modal .box{background:#fff;max-width:760px;width:100%;max-height:88vh;overflow:auto;position:relative;padding:40px 20px 20px}
.modal .x{position:absolute;top:6px;right:10px;border:0;background:none;font-size:28px;line-height:1;padding:4px 8px}
.modal .box img{max-width:100%;display:block;margin:0 auto 12px}
/* nút nổi: lên đầu / Zalo / Facebook */
.fab{position:fixed;right:14px;bottom:18px;display:flex;flex-direction:column;align-items:flex-end;gap:10px;z-index:40}
.fab a,.fab button{width:46px;height:46px;border-radius:50%;border:0;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:12px;box-shadow:0 2px 10px rgba(0,0,0,.25);transition:transform .18s,opacity .25s}
.fab a:hover,.fab button:hover{transform:translateY(-3px)}
.fab .zl,.fab .fb{background:#fff;color:var(--ink);border:1px solid var(--line);box-shadow:0 2px 10px rgba(0,0,0,.12);letter-spacing:-.02em}.fab .fb{font-size:20px;font-weight:700}
.fab .up{background:#111;font-size:20px;opacity:0;pointer-events:none}.fab .up.on{opacity:1;pointer-events:auto}
/* hiệu ứng nút thêm vào giỏ */
.btn{transition:background .18s,transform .18s,box-shadow .18s}
.btn:not(:disabled):hover{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink);transform:translateY(-1px)}
.btn:not(:disabled):active{transform:scale(.98)}
.fly{position:fixed;z-index:90;width:64px;height:64px;object-fit:cover;border-radius:50%;pointer-events:none;box-shadow:0 4px 14px rgba(0,0,0,.3);transition:transform .75s cubic-bezier(.5,-.2,.8,.4),opacity .75s}
.tools b.bump{animation:bump .5s}
@keyframes bump{0%,100%{transform:scale(1)}40%{transform:scale(1.7)}70%{transform:scale(.9)}}

/* giỏ hàng / đặt hàng */
.cartwrap{display:grid;grid-template-columns:minmax(0,1fr) 440px;gap:32px;padding:0 20px 60px;align-items:start}
@media(max-width:980px){.cartwrap{grid-template-columns:1fr;padding:0 14px 48px;gap:24px}}
.cl-row{display:grid;grid-template-columns:96px 1fr auto;gap:14px;padding:14px 0;border-bottom:1px solid var(--line)}
.cl-img{position:relative;aspect-ratio:1/1;background:var(--soft);overflow:hidden;display:block}.cl-img img{width:100%;height:100%;object-fit:cover}
.cl-info{display:flex;flex-direction:column;gap:4px;font-size:14px}.cl-info span{color:var(--mute);font-size:13px}
.cl-info .qty{margin-top:6px;width:max-content}
.cl-tot{text-align:right;font-weight:600;font-size:14px;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.rm{border:0;background:none;font-size:22px;line-height:1;color:var(--mute)}.rm:hover{color:var(--ink)}
.cform{display:flex;flex-direction:column;gap:12px}.cform h2{font-size:15px;margin:8px 0 0;letter-spacing:.04em}
.cform label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:500;color:var(--mute)}
.cform input:not([type=radio]),.cform select,.cform textarea{border:1px solid var(--line);padding:11px 12px;font:inherit;font-size:14px;color:var(--ink);background:#fff;border-radius:0}
.cform input:focus,.cform select:focus,.cform textarea:focus{outline:0;border-color:var(--ink)}
.cform .rad{flex-direction:row;align-items:center;gap:8px;font-size:14px;color:var(--ink)}
.bankbox{background:var(--soft);padding:12px;font-size:13px;line-height:1.6}.bk-r{display:flex;align-items:center;gap:8px;padding:2px 0}.bk-r span{flex:0 0 108px;color:var(--mute)}.bk-r b{font-weight:600;word-break:break-all}.bk-cp{margin-left:auto;border:1px solid var(--ink);background:#fff;color:var(--ink);font:inherit;font-size:11px;padding:2px 9px;height:24px;cursor:pointer}.bk-n{margin:8px 0 0;font-size:12.5px;color:var(--mute);line-height:1.55}@media(max-width:380px){.bk-r span{flex-basis:92px}}
.sum{display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--line);padding-top:14px;font-size:14px}
.sum div{display:flex;justify-content:space-between}.sum .grand{font-size:17px;font-weight:600}.sum small{color:var(--mute)}
.err{color:#c8102e;font-size:13px;min-height:18px}.fine{font-size:12px;color:var(--mute);line-height:1.5}
.done{grid-column:1/-1;max-width:560px;margin:20px auto;text-align:center;display:flex;flex-direction:column;gap:12px;font-size:15px}
.done[hidden],.cform[hidden],.clist[hidden]{display:none}
.cform .btn{flex:none;width:100%}.cform select{height:44px}

/* menu thả xuống (hover) */
.menu{align-items:center}
.menu .mi{position:relative;display:flex;align-items:center;height:60px}
.menu .dd{display:none;position:absolute;top:100%;left:-16px;min-width:210px;background:#fff;border:1px solid var(--line);border-top:0;padding:8px 0;z-index:30;box-shadow:0 10px 24px rgba(0,0,0,.08)}
.menu .mi:hover .dd,.menu .mi:focus-within .dd{display:block}
.menu .dd a{display:block;padding:9px 18px;border:0;white-space:nowrap;font-weight:400}
.menu .dd a:hover{background:var(--soft)}
/* nút xem bảng size dạng chữ gạch chân cạnh nhãn Kích cỡ */
.sizelink{background:none;border:0;padding:0;margin-left:12px;font:inherit;font-size:12px;font-weight:400;letter-spacing:0;text-transform:none;text-decoration:underline;text-underline-offset:3px;color:var(--ink);cursor:pointer}
.sizelink:hover{opacity:.6}
.sizelink.alone{display:block;margin:10px 0}
/* ảnh thumb (ghép nhiều màu): hiện nguyên ảnh, nền trắng */
.gal .tile.th{background:#fff}.gal .tile.th img{object-fit:contain}

.t-opt{background:none;border:0;padding:0;font:inherit;color:inherit;cursor:pointer}.t-opt:hover{text-decoration:underline}
footer .flinks{flex-basis:100%;display:flex;gap:6px 18px;flex-wrap:wrap;padding-top:14px;border-top:1px solid var(--line)}footer .flinks a:hover{color:var(--ink);text-decoration:underline}
.art,.newslist{max-width:760px;margin:0 auto;padding:10px 20px 20px}
.art h1{font-size:22px;margin:6px 0 4px;font-weight:600}.art .adate{color:var(--mute);font-size:12px;margin-bottom:18px}
.art img{max-width:100%;height:auto;display:block;margin:12px auto}.art h3{font-size:14px;margin:18px 0 6px;font-weight:600}.art ol{margin:8px 0;padding-left:20px;line-height:1.65;font-size:14px}.art blockquote{margin:10px 0;padding:4px 14px;border-left:3px solid var(--line);color:var(--mute)}.art table{border-collapse:collapse;max-width:100%;font-size:13px}.art td,.art th{border:1px solid var(--line);padding:6px 8px}
.art h2{font-size:15px;margin:24px 0 8px;font-weight:600}.art p{margin:8px 0;line-height:1.65;font-size:14px}.art ul{margin:8px 0;padding-left:20px;line-height:1.65;font-size:14px}.art li{margin:4px 0}.art a{text-decoration:underline}
.newslist a{display:flex;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--line);font-size:14px}.newslist a span{color:var(--mute);font-size:12px;white-space:nowrap}.newslist a:hover b{text-decoration:underline}
.sov{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:200;display:flex;justify-content:center;align-items:flex-start;padding:70px 16px 16px}.sov[hidden]{display:none}
.sbox{background:#fff;width:100%;max-width:620px;max-height:calc(100vh - 100px);overflow:auto;padding:14px}
.srow{display:flex;gap:8px}.srow input{flex:1;font:inherit;font-size:16px;padding:11px 12px;border:1px solid var(--line);outline:0}.srow input:focus{border-color:var(--ink)}.srow button{border:0;background:none;font-size:26px;cursor:pointer;padding:0 8px}
#sres a{display:flex;gap:12px;align-items:center;padding:10px 4px;border-bottom:1px solid var(--line);font-size:13px}#sres a:hover{background:#f6f6f6}
#sres img{width:44px;height:58px;object-fit:cover;background:#eee;flex:none}#sres .sn{flex:1;text-transform:uppercase}#sres .sn small{display:block;color:var(--mute);text-transform:none;margin-top:2px}#sres .sp{white-space:nowrap;font-weight:600}#sres .sp s{color:var(--mute);font-weight:400;margin-left:6px}
#sres .sn2{padding:14px 4px;color:var(--mute);font-size:13px}

/* ---- nút chọn số sản phẩm mỗi hàng (app.js dựng nút; khách chọn thì nhớ trên trình duyệt) ---- */
.cols{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--mute);margin-right:6px}
.cols:empty{display:none}
.cols button{width:34px;height:34px;border:1px solid var(--line);background:#fff;font-weight:500;font-size:13px}
.cols button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.cols button:hover:not(.on){border-color:var(--ink)}
/* Khi khách chọn nhiều cột hơn mặc định: chữ co theo bề rộng THẬT của thẻ, khung chữ cao cố định nên giá/màu không nhảy */
.card{container-type:inline-size}
@container (max-width:260px){
 .grid.dn .card .meta{padding:8px 8px 16px}
 .grid.dn .card .nm{font-size:12px;line-height:1.3;letter-spacing:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.6em}
 .grid.dn .card .pr{font-size:12px;gap:6px;margin-top:4px}.grid.dn .card .pr .old{font-size:11px}
 .grid.dn .card .dots{flex-wrap:nowrap;overflow:hidden;gap:5px;margin-top:8px;height:14px;align-items:center}
 .grid.dn .card .dot{width:12px;height:12px;flex:none}.grid.dn .card .dot.on::after{inset:-3px}
 .grid.dn .card .badge{font-size:10px;padding:2px 6px;left:6px;top:6px}.grid.dn .card .badge~.badge{top:calc(6px + 1.2em + 4px + 3px)}
}
@container (max-width:200px){
 .grid.dn .card .meta{padding:6px 6px 14px}
 .grid.dn .card .nm{font-size:11px}
 .grid.dn .card .pr{font-size:11px;gap:4px}.grid.dn .card .pr .old{font-size:10px}
 .grid.dn .card .dots{gap:4px;height:12px}.grid.dn .card .dot{width:10px;height:10px}.grid.dn .card .more{font-size:10px}
 .grid.dn .card .badge{font-size:9px;padding:2px 5px;left:4px;top:4px}.grid.dn .card .badge~.badge{top:calc(4px + 1.2em + 4px + 3px)}
}
@container (max-width:150px){
 .grid.dn .card .nm{font-size:10px}.grid.dn .card .pr{font-size:10px}.grid.dn .card .pr .old{font-size:9px}.grid.dn .card .dot{width:9px;height:9px}
}
/* ---- banner Lookbook trang chủ: 4 ảnh sát nhau (điện thoại 2), trượt ngang ---- */
.lbb{position:relative;margin:0 0 var(--gap)}
.lbb-v{overflow:hidden;aspect-ratio:4/1;background:var(--soft)}
.lbb-t{display:flex;height:100%}
.lbb-s{flex:0 0 calc(100% / var(--per,4));height:100%;display:block;overflow:hidden;position:relative;container-type:inline-size}
.lbb .lbp{font-size:13px;padding:6px 12px}@media(max-width:640px){.lbb .lbp{font-size:10.5px;padding:4px 8px}}
.lbb-s img{width:100%;height:100%;object-fit:cover;object-position:center 25%;display:block;opacity:0;transition:opacity .4s}.lbb-s img.ok{opacity:1}
.lbb-a{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border:0;border-radius:50%;background:rgba(255,255,255,.85);font-size:22px;line-height:1;opacity:0;transition:opacity .2s}
.lbb:hover .lbb-a{opacity:1}.lbb-p{left:10px}.lbb-n{right:10px}
@media(max-width:640px){.lbb-v{aspect-ratio:2/1}.lbb-a{opacity:.9;width:32px;height:32px;font-size:18px}.lbb-p{left:6px}.lbb-n{right:6px}}
/* ---- trang Lookbook + cửa sổ xem sản phẩm trong ảnh ---- */
.lbgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap)}
@media(max-width:1000px){.lbgrid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.lbgrid{grid-template-columns:repeat(2,1fr);--gap:4px}}
.lbt{display:block;position:relative;aspect-ratio:1/1;background:var(--soft);overflow:hidden;container-type:inline-size}
.lbt img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 25%;transition:transform .4s}
@media(hover:hover){.lbt:hover img{transform:scale(1.03)}}
.lbx{position:fixed;inset:0;background:rgba(0,0,0,.82);z-index:90;display:none;align-items:center;justify-content:center;padding:16px}
.lbx.on{display:flex}
.lbx-b{display:flex;background:#fff;max-width:980px;width:100%;max-height:92vh;overflow:hidden}
.lbx-img{flex:1 1 60%;min-width:0;background:var(--soft);display:flex;align-items:center;justify-content:center}
.lbx-img img{width:100%;max-height:92vh;object-fit:contain;display:block}
.lbx-i{flex:0 0 340px;padding:24px;display:flex;flex-direction:column;gap:0;overflow:auto}
.lbx-h{font-size:11px;letter-spacing:.1em;color:var(--mute);font-weight:600;margin-bottom:4px}
.lbx-p{display:flex;flex-direction:column;gap:8px;padding:14px 0;border-bottom:1px solid var(--line,#e5e5e5)}.lbx-p:last-child{border-bottom:0}
.lbx-nm{font-size:17px;font-weight:500;line-height:1.35;text-transform:uppercase;letter-spacing:.02em}
.lbx-cd{font-size:12px;color:var(--mute)}
.lbx-pr{font-size:18px;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.lbx-pr.sale b{color:var(--red);font-weight:600}.lbx-pr em{font-style:normal;background:var(--red);color:#fff;font-size:11px;font-weight:600;padding:2px 7px}
.lbx-oos{display:inline-block;align-self:flex-start;border:1px solid var(--ink);padding:6px 12px;font-size:12px;font-weight:600;letter-spacing:.08em}
.lbx-go{display:flex;align-items:center;justify-content:center;margin-top:4px;height:40px;background:var(--ink);color:#fff;font-weight:600;font-size:13px;letter-spacing:.08em}
.lbx-x{position:absolute;top:10px;right:14px;border:0;background:none;color:#fff;font-size:34px;line-height:1}
.lbx-a{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.9);font-size:26px;line-height:1}
.lbx-pv{left:10px}.lbx-nx{right:10px}
@media(max-width:760px){.lbx{padding:0;align-items:stretch}.lbx-b{flex-direction:column;max-height:none;height:100%;overflow:auto}.lbx-img{flex:none}.lbx-img img{max-height:64vh}.lbx-i{flex:none;padding:16px}.lbx-x{top:4px;right:8px}.lbx-a{top:32%;width:38px;height:38px}}

/* chi tiết SP: ảnh 2/hàng, ảnh thumb/màu bên phải hàng đầu */
.gal .tile.lead{grid-column:2}
@media(max-width:980px){.gal .tile.lead{grid-column:1;order:99}}
.sizelink.off{opacity:.35;cursor:not-allowed;text-decoration:line-through}
/* dòng cam kết dạng dropdown */
.pk-h{display:flex;width:100%;align-items:center;justify-content:space-between;gap:12px;padding:11px 0;border:0;background:none;text-align:left;font:inherit;color:inherit;cursor:pointer}
.pk-h i{font-style:normal;font-size:20px;line-height:1;width:22px;text-align:center;flex:none}
.pk{border-bottom:1px solid var(--line)}.perks .pk{padding:0}
.pk-b{padding:2px 0 14px;font-size:13px;line-height:1.6;color:var(--mute);max-height:340px;overflow:auto}
.pk-b p{margin:0 0 8px}.pk-b ul,.pk-b ol{margin:0 0 8px;padding-left:18px}.pk-b img{max-width:100%}
.pk-more{text-decoration:underline;color:var(--ink)}
.qr{margin:14px 0;text-align:center}.qr img{max-width:100%;height:auto;border:1px solid var(--line)}.qr small{display:block;margin-top:6px;color:var(--mute)}

.dot.sl{box-shadow:0 0 0 2px #fff,0 0 0 3px var(--red,#c00)}.dot.sl.on{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--ink,#111)}
.pr .fr,.pr b small{font-weight:400}

/* giỏ hàng: hình thức giao + mã giảm giá */
.shipbox{margin:6px 0 4px}.shipbox h2{margin:10px 0 8px}
.shipbox .opt{display:flex;gap:10px;align-items:flex-start;padding:12px;border:1px solid var(--line);margin-bottom:8px;cursor:pointer;font-size:13px;line-height:1.5}
.shipbox .opt.on{border-color:var(--ink)}.shipbox .opt input{margin-top:4px}
.shipbox em{font-style:normal;background:var(--ink);color:#fff;font-size:11px;padding:1px 6px;margin-left:4px;white-space:nowrap}.shipbox i{font-style:normal;color:var(--mute);font-size:12px}
.shipbox .km{font-size:12px;color:var(--mute);margin-top:4px}.shipbox small{color:var(--mute)}
.shipbox .warn{border:1px solid #c98a00;background:#fff8e6;color:#4a3500;padding:10px 12px;font-size:12px;line-height:1.55;margin-bottom:8px}.shipbox .warn .ck{display:flex;gap:8px;align-items:center;margin-top:8px;font-weight:600}
.coupon{display:flex;gap:8px}.coupon input{flex:1;min-width:0;text-transform:uppercase}.coupon button{flex:none;padding:0 16px;border:1px solid var(--ink);background:#fff;font-weight:600;font-size:12px;letter-spacing:.06em;cursor:pointer}
.cpmsg{font-size:12px;margin:6px 0;min-height:1em}.cpmsg.ok{color:#1a7f37}.cpmsg.bad{color:#c00}

.cform .shipbox label.opt{display:flex;flex-direction:row;align-items:flex-start;gap:10px;font-size:13px}
.cform .shipbox input[type=radio],.cform .shipbox input[type=checkbox]{width:auto;height:auto;flex:none;margin:3px 0 0}
.cform .shipbox .warn label.ck{display:flex;flex-direction:row;align-items:center;gap:8px;font-size:13px}

/* mobile: icon FB ở header, drawer menu bên phải, thanh Tên + Giá ghim dưới (chi tiết SP) */
.t-fb,.drawer,.dov,.sbar{display:none}
@media(max-width:760px){
.fab{display:none}
.t-fb{display:flex;width:26px;height:26px;border-radius:50%;background:var(--ink);align-items:center;justify-content:center}.t-fb svg{width:16px;height:16px;fill:#fff}
.tools{gap:12px}
.dov{display:block;position:fixed;inset:0;background:rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:opacity .25s;z-index:100}
.drawer{display:flex;flex-direction:column;position:fixed;top:0;right:0;bottom:0;width:min(82vw,340px);background:#fff;transform:translateX(100%);transition:transform .28s,visibility .28s;visibility:hidden;z-index:110}
body.dr-open .dov{opacity:1;pointer-events:auto}body.dr-open .drawer{transform:none;visibility:visible}body.dr-open{overflow:hidden}
.dr-h{display:flex;align-items:center;justify-content:space-between;padding:0 8px 0 16px;height:54px;border-bottom:1px solid var(--line);flex:none}
.dr-h .logo img{height:26px}.dr-h button{border:0;background:none;font-size:32px;line-height:1;padding:4px 10px}
.dr-n{overflow:auto;flex:1;padding:4px 0 28px}
.dr-a{display:block;padding:14px 20px;font-weight:500;border-bottom:1px solid var(--line)}.dr-a.sale{color:var(--red)}
.dr-g{border-bottom:1px solid var(--line)}
.dr-r{display:flex;align-items:center}.dr-r>a{flex:1;padding:14px 20px;font-weight:500}
.dr-t{width:52px;height:46px;border:0;background:none;position:relative;flex:none}
.dr-t::before{content:"";position:absolute;left:50%;top:50%;width:8px;height:8px;border-right:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);transform:translate(-50%,-30%) rotate(-135deg);transition:transform .2s}
.dr-t[aria-expanded=false]::before{transform:translate(-50%,-70%) rotate(45deg)}
.dr-s{padding:0 0 8px;background:#fafafa}.dr-s[hidden]{display:none}
.dr-s a{display:block;padding:10px 20px 10px 36px;font-size:13px;color:var(--mute)}
body.detail .sbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:35;align-items:center;gap:12px;background:#fff;border-top:1px solid var(--line);padding:11px 14px calc(11px + env(safe-area-inset-bottom));box-shadow:0 -2px 12px rgba(0,0,0,.08);transform:translateY(110%);transition:transform .25s}
body.detail .sbar.on{transform:none}
.sb-n{flex:1;min-width:0;font-weight:500;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-p{flex:none;font-size:14px;white-space:nowrap}.sb-p b{font-weight:600}.sb-p.sale b{color:var(--red)}.sb-p .old{color:var(--mute);text-decoration:line-through;font-size:12px;margin-left:6px}.sb-p em{display:none}
}

/* giỏ hàng: 2 thẻ hình thức giao hàng */
.shipbox .sc{display:flex;flex-direction:column;gap:2px;min-width:0}.shipbox .sc-h{display:flex;align-items:center;gap:8px;margin-bottom:2px}.shipbox .sc-h b{font-size:14px;letter-spacing:.06em}
.shipbox .sc-h em{margin:0;font-size:11px;font-weight:600}.shipbox .sc-l{font-size:13px}.shipbox .sc-r{color:var(--mute);font-size:12px}

/* mã đơn + nút, trang tra cứu đơn */
.btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--ink)}
.done .dbtn{display:flex;flex-direction:column;gap:10px;align-items:center;margin:0}.done .dbtn .btn{display:flex;align-items:center;justify-content:center;padding:0 24px;width:100%;max-width:300px;flex:none}
.ocode{border:1.5px solid var(--ink);padding:14px 12px;display:flex;flex-direction:column;align-items:center;gap:6px}
.ocode>span{font-size:12px;color:var(--mute);letter-spacing:.06em}.ocode b{font-size:26px;letter-spacing:.06em;font-weight:600}.ocode mark{background:#ffe14d;color:var(--ink);padding:0 4px}
.ocode button{border:1px solid var(--ink);background:#fff;padding:7px 18px;font-size:12px;font-weight:600;letter-spacing:.06em}
.ocn{font-size:13px;line-height:1.55;background:#fff8e6;border:1px solid #c98a00;color:#4a3500;padding:10px 12px;margin:0}
.trkwrap{max-width:640px;margin:0 auto;padding:0 20px 56px;display:flex;flex-direction:column;gap:20px}
.trkform{display:flex;flex-direction:column;gap:12px}.trkform label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--mute)}
.trkform input{height:46px;border:1px solid var(--line);padding:0 12px;font-size:15px;color:var(--ink)}.trkform .btn{flex:none;width:100%}
.trkres[hidden]{display:none}.trkres{display:flex;flex-direction:column;gap:14px}
.trk-st{border:1.5px solid var(--ink);padding:16px;display:flex;flex-direction:column;gap:6px}.trk-st b{font-size:20px;letter-spacing:.04em}.trk-st span{font-size:13px;line-height:1.55}
.trk-st.cancelled b{color:var(--red)}.trk-st .btn{margin-top:8px;display:flex;align-items:center;justify-content:center;flex:none;width:100%}
.trk-st a.tel{text-decoration:underline;font-weight:600}
.trk-box{border:1px solid var(--line);padding:14px;font-size:13px;line-height:1.6}.trk-box h3{margin:0 0 8px;font-size:12px;letter-spacing:.08em;color:var(--mute);font-weight:600}
.trk-l{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px solid var(--line)}.trk-l:last-child{border:0}
.trk-m div{display:flex;justify-content:space-between;padding:3px 0}.trk-m .g{font-weight:600;font-size:15px;border-top:1px solid var(--line);margin-top:4px;padding-top:8px}
.mlv{font-size:12px;font-weight:600;color:#7a5200;background:#fff8e6;border:1px solid #c98a00;padding:6px 10px;margin-top:2px}.mlv[hidden]{display:none}
#sum .mnote{color:#7a5200;font-weight:600}
.trkforgot{font-size:12.5px;line-height:1.55;color:var(--mute);margin:4px 0 0}

.card.pg-h{display:none}.more-w{text-align:center;padding:28px 20px 8px}.more-w:empty{display:none}.more-b{min-width:260px;padding:0 28px}.more-b small{font-weight:400;opacity:.7}
@media(max-width:640px){.more-w{padding:20px 14px 4px}.more-b{width:100%;min-width:0}}
@media(prefers-reduced-motion:reduce){.lbb-s img{transition:none}}

@media(max-width:640px){}

.t-ic{width:14px;height:14px;margin-right:6px;vertical-align:-2px}
.flt-b{height:36px;padding:0 14px;border:1px solid var(--line);background:#fff;font-weight:500;font-size:13px;margin-right:6px}
.flt-b em{font-style:normal;display:inline-block;min-width:18px;height:18px;line-height:18px;margin-left:4px;border-radius:9px;background:var(--ink);color:#fff;font-size:11px;text-align:center}
.flt-b:hover,.flt-b.open{border-color:var(--ink)}
.flt{padding:4px 20px 18px;border-bottom:1px solid var(--line);display:flex;flex-wrap:wrap;gap:18px 40px;align-items:flex-start}
.flt[hidden]{display:none}
.fg b{display:block;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);font-weight:500;margin-bottom:8px}
.fc{display:flex;flex-wrap:wrap;gap:6px}
.chip{min-height:36px;padding:0 14px;border:1px solid var(--line);background:#fff;font-size:13px;display:inline-flex;align-items:center;gap:8px}
.chip i{width:14px;height:14px;border-radius:50%;border:1px solid rgba(0,0,0,.2);flex:none}
.chip:hover{border-color:var(--ink)}
.chip.on{background:var(--ink);border-color:var(--ink);color:#fff}
.chip.on i{border-color:#fff}
.fx{align-self:flex-end}
.fclr{border:0;background:none;text-decoration:underline;text-underline-offset:3px;font-size:13px;padding:8px 0}
.f-empty{padding:48px 20px;text-align:center;color:var(--mute)}
@media(max-width:640px){.flt{padding:4px 14px 16px;gap:14px}.chip{min-height:40px}.flt-b{margin-right:0}}

@media(max-width:760px){.burger{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}.tools a,.t-opt{min-height:44px;display:inline-flex;align-items:center}.t-fb{position:relative}.t-fb::after{content:"";position:absolute;inset:-9px}}
.cartwrap.is-empty{grid-template-columns:1fr}.cartwrap.is-empty .cform{display:none}
.cl-empty{text-align:center;padding:56px 16px 72px}.cl-empty p{margin:0 0 20px;color:var(--mute);font-size:15px}.cl-empty .btn{display:inline-flex;align-items:center;justify-content:center;padding:0 32px;flex:none}

/* b5: ô sắp xếp - mũi tên tự vẽ, có đệm, không sát lề */
.bar select,.flt select{-webkit-appearance:none;appearance:none;padding:0 36px 0 14px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23111' stroke-width='1.3'/%3E%3C/svg%3E") no-repeat right 14px center;background-size:10px 6px;cursor:pointer}

/* b8: menu không gãy dòng ở 761-1100px */
.menu a,.tools a,.t-opt{white-space:nowrap}
@media(min-width:761px) and (max-width:1100px){.top-in{gap:18px;padding:0 16px}.menu{gap:16px;font-size:13px}.tools{gap:14px}}

/* b9: nút lọc cạnh ô sắp xếp; nút "Hiển thị" dạng icon; tên chi tiết in hoa; sửa mobile */
.cols button{display:inline-flex;align-items:center;justify-content:center;padding:0}
.cols{gap:6px}
.flt-b{margin-right:0}
.info h1,.info h2,.sb-n{text-transform:uppercase}
.t-fb{min-height:0!important;width:28px;height:28px;flex:none}
@media(max-width:760px){
 .tools .t-opt{display:inline-flex;font-size:0;width:44px;justify-content:center;gap:0}
 .tools .t-opt .t-ic{width:22px;height:22px;margin:0}
 .tools{gap:4px}
 .t-fb{margin-right:6px}
 .bar{gap:8px}
 .bar .cnt{flex:1 1 auto;min-width:0}
 .bar .cols{margin:0}
 .bar .flt-b,.bar select{flex:1 1 calc(50% - 4px);min-width:0;font-size:13px}
 .bar select{padding:0 28px 0 10px;text-overflow:ellipsis;background-position:right 10px center}
}

/* b9b: icon Hiển thị chỉ viền, không nền */
.cols button{width:auto;height:34px;min-width:36px;padding:0 6px;border:0!important;background:none!important;color:#a3a3a3}
.cols button:hover{color:var(--ink)}
.cols button.on{color:var(--ink);background:none!important}
.cols button.on svg{stroke-width:2.2}

/* 07/11: xem to ảnh sản phẩm */
.gal .tile img{cursor:zoom-in}
.zm{position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:95;display:none}
.zm.on{display:block}
.zm-s{position:absolute;inset:0;overflow:auto;display:flex;align-items:center;justify-content:center;-webkit-overflow-scrolling:touch}
.zm-i{display:block;margin:auto;max-width:100vw;max-height:100vh;object-fit:contain;cursor:zoom-in}
.zm.z .zm-s{display:block}
.zm.z .zm-i{max-width:none;max-height:none;width:200%;margin:0;cursor:zoom-out}
.zm-x{position:absolute;top:8px;right:14px;z-index:2;border:0;background:none;color:#fff;font-size:38px;line-height:1;text-shadow:0 0 6px rgba(0,0,0,.6)}
.zm-a{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.88);font-size:26px;line-height:1}
.zm-pv{left:10px}.zm-nx{right:10px}
.zm.one .zm-a{display:none}
.zm-n{position:absolute;left:0;right:0;bottom:12px;z-index:2;text-align:center;color:#fff;font-size:13px;letter-spacing:.06em;text-shadow:0 0 6px rgba(0,0,0,.7);pointer-events:none}
@media(max-width:760px){.zm-a{width:38px;height:38px;font-size:22px}.zm-pv{left:6px}.zm-nx{right:6px}}

/* 12/11: trang chủ — h1 chỉ cho máy đọc; mô tả xuống cuối trang */
.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ===== 12/11: giỏ hàng mới (sale, mã, tick, đổi size, yêu thích, tooltip ship, bản đồ) + trang yêu thích + dropdown chi tiết SP ===== */
.cl-head{padding:2px 0 12px;border-bottom:1px solid var(--line);font-size:13px}
.ck{display:flex;gap:8px;align-items:center;cursor:pointer}
.cl-head input,.cl-ck input{width:18px;height:18px;margin:0;accent-color:#111;flex:none}
.cl-row{grid-template-columns:22px 96px minmax(0,1fr) auto;align-items:start}
.cl-ck{padding-top:4px;display:block}
.cl-row.off .cl-img,.cl-row.off .cl-nm,.cl-row.off .cl-pr,.cl-row.off .cl-tot>span{opacity:.45}
.cl-nm{color:inherit;text-decoration:none}.cl-nm b{font-weight:600;font-size:14px}
.cl-info .cl-code{font-size:12px}
.cl-var{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center}
.cl-ed{border:0;background:none;padding:0;font:inherit;font-size:12px;color:var(--ink);text-decoration:underline;cursor:pointer}
.cl-pr{display:flex;gap:8px;align-items:baseline;font-size:14px;margin-top:2px}.cl-pr b{font-weight:600}.cl-pr.sale b{color:var(--red)}
.cl-pr em{font-style:normal;background:var(--red);color:#fff;font-size:11px;font-weight:600;padding:1px 6px}
.cl-info .cl-warn{color:var(--red);font-size:12px}
.cl-ac{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:6px}.cl-info .cl-ac .qty{margin-top:0}
.cl-fav{border:1px solid var(--line);background:#fff;padding:0 12px;height:40px;font:inherit;font-size:12px;cursor:pointer;color:var(--ink)}.cl-fav.on{color:var(--red);border-color:var(--red)}
.cl-tot s{color:var(--mute);font-weight:400;font-size:12px}
@media(max-width:560px){.cl-row{grid-template-columns:22px 72px minmax(0,1fr);gap:10px}.cl-tot{grid-column:3;flex-direction:row;align-items:center;justify-content:space-between}}
.tip{position:relative;display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border:1px solid var(--mute);border-radius:50%;font-size:10px;font-style:normal;font-weight:600;color:var(--mute);cursor:help;margin-left:6px;vertical-align:1px;outline:0}
.tipb{display:none;position:absolute;left:-6px;bottom:calc(100% + 9px);width:250px;background:#111;color:#fff;padding:9px 11px;font-size:12px;font-weight:400;line-height:1.5;text-align:left;z-index:6}
.tipb::after{content:"";position:absolute;left:10px;top:100%;border:6px solid transparent;border-top-color:#111}
.tip:hover .tipb,.tip:focus .tipb{display:block}
.modal .box:has(.edp){max-width:460px}
.edp h3{margin:0 0 4px;font-size:15px;letter-spacing:.04em}.edn{font-size:12px;color:var(--mute);margin-bottom:10px}
.edl{font-size:12px;font-weight:600;margin:14px 0 6px}
.edc,.eds{display:flex;flex-wrap:wrap;gap:8px}
.edcb,.edsb{border:1px solid var(--line);background:#fff;padding:7px 12px;font:inherit;font-size:13px;cursor:pointer;display:inline-flex;gap:8px;align-items:center;color:var(--ink)}
.edbig{margin:0 0 10px;text-align:center;background:var(--bg2,#f4f4f4);position:relative;height:min(30vh,260px)}.edbig .pu{font-size:13px}.edbig img{display:block;width:100%;height:min(30vh,260px);object-fit:contain}
.edcb .edth{width:34px;height:34px;object-fit:cover;flex:none;border:1px solid var(--line)}.edcb{padding:4px 10px 4px 4px}
.edcb i{width:16px;height:16px;border-radius:50%;border:1px solid var(--line);flex:none}
.edcb.on,.edsb.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.edcb:disabled,.edsb:disabled{opacity:.4;cursor:not-allowed;text-decoration:line-through}
.edsb{flex-direction:column;gap:0;min-width:84px;align-items:flex-start}.edsb small{color:var(--mute);font-size:11px}.edsb small.sl{color:var(--red)}
.edf{display:flex;gap:8px;margin-top:18px}.edf .btn{flex:1}
.fav-btn{flex:none;width:48px;height:48px;border:1px solid var(--ink);background:#fff;font-size:22px;line-height:1;cursor:pointer;color:var(--ink)}.fav-btn.on{color:var(--red);border-color:var(--red)}
.t-fav{white-space:nowrap}
.c-ic{display:none}
.fav-rm{border:0;background:none;padding:0;margin-top:6px;font:inherit;font-size:12px;color:var(--red);cursor:pointer;text-align:left}
.pk-b,.pk-b *{font-family:inherit!important;font-size:inherit!important;line-height:1.65!important;color:var(--ink)!important;font-weight:400!important}
.pk-b h1,.pk-b h2,.pk-b h3,.pk-b h4,.pk-b h5,.pk-b h6,.pk-b strong,.pk-b b{font-weight:500!important;margin:10px 0 4px}
.pk-b a,.pk-more{text-decoration:underline}

/* ===== 12/11 đợt 2: người mẫu + hướng dẫn chọn size + popup ===== */
.szline{font-size:12.5px;color:var(--mute);margin:8px 0 0}
.szg{margin:0 0 18px}
.szt{font-size:13px;font-weight:600;letter-spacing:.03em;margin:0 0 8px}
.szm{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;background:#f4f4f4;border-radius:12px;padding:16px 18px}
.szm span{display:block;font-size:12px;color:var(--mute)}.szm b{display:block;font-size:15px;font-weight:500}
.szm-c{grid-column:2;grid-row:1}.szm-c img{width:92px;height:92px;border-radius:50%;object-fit:cover;object-position:50% 15%;display:block;background:#e8e8e8}
.szm-c:empty{display:none}
.szm-l{grid-column:1;grid-row:1;display:flex;gap:22px;justify-content:flex-end;flex-wrap:wrap}.szm-r{grid-column:3;grid-row:1;text-align:left}
.szm-r b{font-size:18px;font-weight:600;letter-spacing:.02em}
.szf{margin-top:14px;border:1px solid var(--line);padding:14px 16px}
.szf h4{margin:0 0 10px;font-size:13px;font-weight:600;letter-spacing:.03em}
.szin{display:grid;grid-template-columns:1fr 1fr;gap:8px}.szin input{height:42px;border:1px solid var(--line);padding:0 10px;font:inherit;font-size:14px;min-width:0;background:#fff;color:var(--ink)}
.szfit{display:flex;gap:8px;margin:10px 0}.szfit button{flex:1;height:38px;border:1px solid var(--line);background:#fff;font:inherit;font-size:13px;cursor:pointer;color:var(--ink)}.szfit button.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.szgo{width:100%;height:42px;margin-top:10px}
/* 13/11 (đợt 8): thẻ kết quả gợi ý size */
.szc{border:1px solid var(--line);background:#fff;padding:2px 14px}
.szc-h,.szc-r{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0}
.szc-h{border-bottom:1px solid var(--line)}.szc-h span{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}.szc-h b{font-size:28px;font-weight:600;line-height:1}
.szc-r{font-size:13px;color:var(--mute)}.szc-r b{color:var(--ink);font-weight:600;font-size:15px}.szc-r+.szc-r{border-top:1px dashed var(--line)}
.szs.szc-n{margin-top:8px;color:var(--ink);font-size:13px}
.szr{margin-top:10px;font-size:13px}.szres{font-weight:600;font-size:15px;margin-top:6px}.szs{color:var(--mute);font-size:12.5px;margin-top:4px}.szs.szw{color:var(--ink);background:#f6f4f0;padding:8px 10px;margin-top:8px;line-height:1.5}.szs.szw a{text-decoration:underline}.szr .bad{color:var(--red)}
.szn{margin:12px 0 0;font-size:11.5px;line-height:1.55;color:var(--mute)}.szn a{color:var(--ink);text-decoration:underline}
.szfl{font-size:12.5px;margin:12px 0 6px}.szfit{margin-top:0}.szt2{font-style:italic}
@media(max-width:480px){.szm{grid-template-columns:1fr auto;padding:14px;gap:12px 10px}.szm-c{grid-column:1/-1;grid-row:1;justify-self:center}.szm-c img{width:84px;height:84px}.szm-l{grid-column:1;grid-row:2;justify-content:flex-start;gap:16px}.szm-r{grid-column:2;grid-row:2;text-align:right}}
.g6pop{position:fixed;z-index:90}
.g6pop-b{position:relative}.g6pop img{display:block;width:100%;height:auto}.g6pop-a{display:block}
.g6pop-x{position:absolute;top:6px;right:6px;width:32px;height:32px;border:0;border-radius:50%;background:rgba(0,0,0,.65);color:#fff;font-size:20px;line-height:32px;cursor:pointer;padding:0}
.g6pop-center{inset:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;padding:16px}
.g6pop-center .g6pop-b{width:min(480px,92vw);max-height:90vh}.g6pop-center img{max-height:86vh;object-fit:contain;width:auto;max-width:100%;margin:0 auto}
.g6pop-br{right:16px;bottom:16px;width:min(320px,86vw);box-shadow:0 6px 24px rgba(0,0,0,.3)}
.g6pop-bottom{left:0;right:0;bottom:0;background:#fff;box-shadow:0 -4px 18px rgba(0,0,0,.25)}.g6pop-bottom .g6pop-b{max-width:900px;margin:0 auto}

/* ===== 12/11: nút báo lỗi ===== */
.fab .rp{width:auto;height:40px;padding:0 14px 0 12px;gap:6px;border-radius:20px;background:#fff;color:var(--ink);border:1px solid var(--line);box-shadow:0 2px 10px rgba(0,0,0,.12);font-size:12px;font-weight:600;cursor:pointer;align-self:flex-end;white-space:nowrap}
.g6rp{position:fixed;inset:0;z-index:110;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;padding:16px}
.rp-b{position:relative;background:#fff;width:min(480px,100%);max-height:92vh;overflow:auto;padding:22px 20px 20px}
.rp-b h3{margin:0 0 8px;font-size:15px;font-weight:600;letter-spacing:.03em}.rp-in{margin:0 0 14px;font-size:13px;line-height:1.55;color:var(--mute)}
.rp-x{position:absolute;top:8px;right:8px;width:32px;height:32px;border:0;background:none;font-size:24px;line-height:32px;cursor:pointer;color:var(--ink)}
.rp-f{position:relative}.rp-f label{display:block;font-size:12.5px;margin:0 0 12px}
.rp-f textarea,.rp-f input:not([type=file]){display:block;width:100%;margin-top:5px;border:1px solid var(--line);padding:9px 10px;font:inherit;font-size:14px;background:#fff;color:var(--ink);box-sizing:border-box}
.rp-f textarea{resize:vertical;min-height:92px}
.rp-l{font-size:12.5px;margin:0 0 6px}.rp-th{display:flex;gap:8px;flex-wrap:wrap}.rp-th span{position:relative}.rp-th img{width:72px;height:72px;object-fit:cover;border:1px solid var(--line);display:block}
.rp-th button{position:absolute;top:-6px;right:-6px;width:20px;height:20px;border-radius:50%;border:0;background:#111;color:#fff;font-size:14px;line-height:20px;cursor:pointer;padding:0}
.rp-add{border:1px dashed var(--ink);background:#fff;height:36px;padding:0 14px;font:inherit;font-size:13px;cursor:pointer;margin:6px 0 14px;color:var(--ink)}
.rp-2{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}.rp-2 label{margin:0;white-space:nowrap}.rp-2 input{white-space:normal}.rp-2+.rp-msg{margin-top:12px}.rp-2{margin-bottom:0}@media(max-width:480px){.rp-2{grid-template-columns:1fr}}
.rp-msg{font-size:13px;margin:0 0 10px;min-height:0}.rp-msg.bad{color:var(--red)}.rp-go{width:100%;height:44px}.rp-ok{font-size:14px;line-height:1.6;margin:6px 0 4px}

/* ===== 12/11: ô giá trên ảnh Lookbook (như app Tạo ảnh quảng cáo: ô trắng, chữ đậm) ===== */
.lbp{position:absolute;transform:translate(-50%,-50%);z-index:2;background:#fff;color:#111;font-weight:700;font-size:14px;line-height:1;letter-spacing:.01em;padding:7px 14px;border-radius:999px;box-shadow:0 1px 6px rgba(0,0,0,.22);cursor:pointer;white-space:nowrap}
.lbc-w{background:#fff;color:#111}.lbc-k{background:#111;color:#fff}.lbc-g{background:#5c5c5c;color:#fff}
@media(hover:hover){.lbp.lbc-w:hover{background:#111;color:#fff}.lbp.lbc-k:hover,.lbp.lbc-g:hover{background:#fff;color:#111}}
.lbx-img{position:relative}.lbx-img .lbp{z-index:3}
@media(max-width:640px){.lbp{font-size:11.5px;padding:5px 10px}}
.fav .card .fav-rm{display:block;margin-top:8px}
.rp-th:not(:empty){margin-bottom:12px}
.lbp[hidden]{display:none}
/* 13/11: thanh nối từ ô giá tới sản phẩm (như app Tạo ảnh quảng cáo): ô ở nửa trái ảnh → thanh bên phải ô; nửa phải → bên trái; màu theo ô; dài ≈14% cạnh ảnh tính từ mép ô (tối thiểu 30px) — tỉ lệ như thanh nối ở app */
.lbp::after{content:"";position:absolute;top:50%;transform:translateY(-50%);z-index:-1;background:inherit;border-radius:999px;height:max(2px,calc(var(--u,100cqw)*.0045));width:max(30px,calc(var(--u,100cqw)*.14));box-shadow:0 1px 4px rgba(0,0,0,.25)}
.lbp.lbr::after{left:calc(100% - 2px)}.lbp.lbl::after{right:calc(100% - 2px)}

/* 13/11: header mobile gọn (tìm kiếm / Facebook / tim / giỏ bằng nhau, số lượng không tràn); Báo lỗi cuối footer; khoá kéo ngang trang */
html,body{overflow-x:clip;overscroll-behavior-x:none}
body{touch-action:pan-y}.zm-s,.lbb-v{touch-action:pan-y}.zm-s{touch-action:pan-x pan-y pinch-zoom}
.t-fav,.tools a[href="/gio-hang"]{position:relative}
@media(max-width:760px){
 input,select,textarea{font-size:16px!important}
 .tools{gap:2px}
 .tools .t-opt,.tools .t-fav,.tools a[href="/gio-hang"],.t-fb{width:38px;height:38px;min-height:0!important;padding:0;display:inline-flex;align-items:center;justify-content:center;margin:0;flex:none}
 .t-fb{width:38px;height:38px;border-radius:0;background:none;margin-right:0}.t-fb svg{width:28px;height:28px;padding:5px;box-sizing:border-box;border-radius:50%;background:var(--ink)}
 .tools .t-opt .t-ic,.t-fav .fv-ic,.c-ic{width:26px;height:26px;margin:0;display:block}
 .t-fav .fv-t,.c-t{display:none}
 .tools b{position:absolute;top:1px;right:-1px;margin:0;min-width:16px;height:16px;line-height:16px;font-size:10px;padding:0 4px;box-sizing:border-box;border-radius:8px}
}
@media(min-width:761px){.t-fav .fv-ic{width:14px;height:14px;margin-right:6px;vertical-align:-2px}.tools .t-fav,.tools a[href="/gio-hang"]{display:inline-flex;align-items:center}}

.hs{width:1.15em;height:1.15em;display:block;margin:auto}.fav-c .hs{width:18px;height:18px}.grid.dn .card .fav-c .hs{width:15px;height:15px}.fav-btn .hs{width:24px;height:24px}.cl-fav .hs,.fav-rm .hs{display:inline-block;width:14px;height:14px;vertical-align:-2px;margin:0}
.fav-btn,.card .fav-c{display:inline-flex;align-items:center;justify-content:center}.card .fav-c{display:flex}

/* 13/11 (đợt 7): lookbook popup có nút đóng rõ; giỏ hàng mobile: không lặp giá, nút bằng nhau, thanh tổng cộng đáy màn hình */
.lbx-x,.lbx-a{z-index:6}
@media(max-width:760px){
 .lbx-x{top:10px;right:10px;width:40px;height:40px;border-radius:50%;background:rgba(0,0,0,.7);color:#fff;font-size:26px;line-height:40px;padding:0;position:fixed}
 .lbx-b{padding-top:0}
 .cl-row.one .cl-tot>span,.cl-row.one .cl-tot>s{display:none}.cl-row.one .cl-tot{justify-content:flex-end}
 #cbar{position:fixed;left:0;right:0;bottom:0;z-index:70;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:#111;color:#fff;cursor:pointer;box-shadow:0 -4px 16px rgba(0,0,0,.18)}
 #cbar[hidden]{display:none}#cbar .cb-l{font-size:13px;font-weight:500}#cbar small{display:block;font-size:11px;opacity:.7;font-weight:400}#cbar b{font-size:17px;font-weight:600}
}
@media(min-width:761px){#cbar{display:none}}
.cl-ac .qty{height:36px}.cl-ac .qty button,.cl-ac .qty input{height:34px;box-sizing:border-box}.cl-ac .cl-fav{height:36px;box-sizing:border-box;display:inline-flex;align-items:center;gap:5px;padding:0 12px}

/* 13/11 đợt 8: giỏ hàng kiểu 1688 */
.cl-row{position:relative}
.cl-buy{display:flex;align-items:center;justify-content:space-between;gap:8px 12px;flex-wrap:wrap;margin-top:6px}
.cl-buy .cl-pr{margin-top:0}.cl-buy .cl-ac{margin:0 0 0 auto;gap:8px;flex-wrap:nowrap}
.cl-rm.rm{position:absolute;top:8px;right:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer;z-index:2}
.cl-row .cl-nm{padding-right:30px}
.cl-ac .cl-fav,.cl-ac .cl-fav.on{width:36px;height:36px;padding:0;justify-content:center;border:0;background:none;display:inline-flex;align-items:center}
.cl-ac .cl-fav .hs{width:20px;height:20px}
.cl-tot{margin-top:30px}
#cbar .cb-r{display:flex;align-items:center;gap:8px}#cbar .cb-up{font-style:normal;font-size:16px;line-height:1;transform:translateY(3px);opacity:.8}#cbar[aria-expanded=true] .cb-up{transform:rotate(180deg) translateY(3px)}
#cbs[hidden]{display:none}
#cbs{position:fixed;inset:0;z-index:69}#cbs .cbs-bg{position:absolute;inset:0;background:rgba(0,0,0,.45)}
#cbs .cbs-p{position:absolute;left:0;right:0;bottom:0;background:#fff;padding:14px 16px calc(78px + env(safe-area-inset-bottom));max-height:80vh;overflow:auto;border-radius:14px 14px 0 0}
#cbs .cbs-h{display:flex;align-items:center;justify-content:space-between;padding-bottom:10px;margin-bottom:6px;border-bottom:1px solid var(--line);font-size:15px}
#cbs .cbs-x{border:0;background:none;font-size:26px;line-height:1;width:36px;height:36px;cursor:pointer}
body.cbs-on{overflow:hidden}
@media(min-width:761px){#cbs{display:none!important}}
@media(max-width:760px){
 .cl-row .cl-tot{display:none}
 .cl-row{grid-template-columns:22px 72px minmax(0,1fr)}
 .cl-row.off .cl-ac{opacity:.6}
}

/* 13/11 đợt 8: cụm nút nổi — Báo lỗi dạng icon (hover mới hiện chữ), nút thu/ẩn bám cạnh phải, có cả trên mobile */
.fab{transition:transform .25s ease}
.fab .rp{height:46px;min-width:46px;padding:0 14px;border-radius:23px;gap:0;justify-content:center}
.fab .rp span{max-width:0;opacity:0;overflow:hidden;margin-left:0;transition:max-width .25s ease,opacity .2s ease,margin .25s ease}
.fab .rp:hover span,.fab .rp:focus-visible span{max-width:140px;opacity:1;margin-left:7px}
.fab .fab-t{width:22px;height:46px;border-radius:12px 0 0 12px;background:#111;color:#fff;box-shadow:0 2px 10px rgba(0,0,0,.2);align-self:flex-end;margin-right:-14px;padding:0 0 0 2px;cursor:pointer;order:9}
.fab .fab-t:hover{transform:none;background:#333}
.fab.shut{right:0;gap:0}
.fab.shut>a,.fab.shut>button:not(.fab-t){display:none}
.fab.shut .fab-t{margin-right:0}
@media(max-width:760px){
 .fab{display:flex;right:12px;bottom:calc(76px + env(safe-area-inset-bottom));gap:8px;z-index:38}
 .fab a,.fab button:not(.fab-t){width:42px;height:42px}.fab .rp{height:42px;min-width:42px;padding:0 12px;border-radius:21px}
 .fab .fab-t{height:42px;margin-right:-12px}.fab.shut .fab-t{margin-right:0}
 .fab.shut{right:0}
 .fab .rp:hover span{max-width:0;opacity:0;margin-left:0}
}

@media(max-width:760px){.fab .rp{display:none!important}}

/* 14/11: link Tra cứu đơn ở header (máy tính); điện thoại dùng menu ☰ và footer */
.t-trk{display:none}@media(min-width:761px){.tools .t-trk{display:inline-flex;align-items:center}.t-trk:hover{text-decoration:underline}}