/* PHIEN BAN: 2.5 — 23/10/2026 — giao dien thanh ho tro (ho-tro.js). Mau thuong hieu lay tu <meta theme-color>. */
.ht-moi .lien-he-noi{display:none!important}

.ht-goc{--ht-c:#8b0000;--ht-d:#4a0000;font-family:inherit;line-height:1.35;color:#1d2b22;-webkit-font-smoothing:antialiased}
.ht-goc *,.ht-goc *::before,.ht-goc *::after{box-sizing:border-box}
.ht-goc a{text-decoration:none}
.ht-svg{display:inline-flex;align-items:center;justify-content:center}
.ht-svg svg{width:1em;height:1em;fill:currentColor;display:block}

/* ---------- GOC TRAI: Zalo + Goi ---------- */
.ht-trai{position:fixed;left:16px;bottom:18px;z-index:9990;display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.ht-nut{border:0;cursor:pointer;font-family:inherit;display:flex;align-items:center;gap:10px;height:50px;padding:0 22px 0 8px;border-radius:999px;color:#fff!important;font-weight:800;font-size:16px;letter-spacing:.2px;
  box-shadow:0 8px 22px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.28);transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;position:relative;overflow:hidden}
.ht-nut::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.28) 50%,transparent 70%);transform:translateX(-120%);transition:transform .6s ease}
.ht-nut:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.3);filter:brightness(1.06)}
.ht-nut:hover::after{transform:translateX(120%)}
.ht-nut:active{transform:translateY(0) scale(.98)}
.ht-nut-a{background:linear-gradient(135deg,#0068ff 0%,#2f8bff 100%)}
.ht-nut-b{background:linear-gradient(135deg,var(--ht-c) 0%,var(--ht-d) 100%)}
.ht-bieu{flex:none;width:34px;height:34px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(0,0,0,.18)}
.ht-zi{color:#0068ff;font-weight:900;font-size:10.5px;letter-spacing:-.3px}
.ht-nut-b .ht-bieu{color:var(--ht-c);font-size:18px}
.ht-nut-b .ht-bieu .ht-svg{animation:ht-rung 2.4s ease-in-out infinite}
.ht-nut-b::before{content:"";position:absolute;left:8px;top:50%;width:34px;height:34px;margin-top:-17px;border-radius:50%;box-shadow:0 0 0 0 rgba(255,255,255,.55);animation:ht-song 2.4s ease-out infinite}
@keyframes ht-song{0%{box-shadow:0 0 0 0 rgba(255,255,255,.55)}70%,100%{box-shadow:0 0 0 14px rgba(255,255,255,0)}}
@keyframes ht-rung{0%,60%,100%{transform:rotate(0)}65%{transform:rotate(-14deg)}75%{transform:rotate(12deg)}85%{transform:rotate(-8deg)}92%{transform:rotate(4deg)}}

/* ---------- GOC PHAI: nut + bang ---------- */
.ht-phai-khung{position:fixed;right:16px;bottom:18px;z-index:9991;display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.ht-phai{display:flex;align-items:center;gap:10px;height:54px;padding:0 22px 0 8px;border:0;border-radius:999px;cursor:pointer;color:#fff;font:inherit;font-weight:800;font-size:16px;
  background:linear-gradient(135deg,var(--ht-c) 0%,var(--ht-d) 100%);box-shadow:0 8px 22px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.28),0 0 0 2px rgba(255,255,255,.35);transition:transform .18s ease,box-shadow .18s ease}
.ht-phai:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.3),0 0 0 2px rgba(255,255,255,.5)}
.ht-phai:focus-visible,.ht-nut:focus-visible,.ht-dong:focus-visible{outline:3px solid #ffd54a;outline-offset:2px}
.ht-mo .ht-phai{box-shadow:0 8px 22px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.28),0 0 0 3px #ffd54a}

.ht-cum{display:inline-flex;align-items:center}
.ht-av{position:relative;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:linear-gradient(135deg,#f3e3b0,#e1c26c);color:#5b3a00;overflow:visible;flex:none}
.ht-av img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.ht-av b{font-size:15px;font-weight:800}
.ht-av-nho{width:38px;height:38px;border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.ht-av-nho+.ht-av-nho{margin-left:-12px}
.ht-av-lon{width:52px;height:52px;border:2px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.18)}
.ht-av-lon b{font-size:19px}

.ht-bang{width:372px;max-width:calc(100vw - 24px);max-height:calc(100vh - 110px);overflow:auto;background:#fff;border-radius:22px;border:2px solid #0f1a14;
  box-shadow:0 22px 60px rgba(0,0,0,.38);animation:ht-vao .22s ease both;overscroll-behavior:contain}
.ht-bang[hidden]{display:none}
@keyframes ht-vao{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.ht-dau{display:flex;align-items:center;gap:12px;padding:14px 14px 14px 16px;background:linear-gradient(135deg,var(--ht-c) 0%,var(--ht-d) 100%);color:#fff;position:sticky;top:0;z-index:1}
.ht-dau .ht-av-nho{width:40px;height:40px}
.ht-tieu{flex:1;min-width:0}
.ht-tieu-ten{font-weight:800;font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ht-tieu-phu{display:flex;align-items:center;gap:7px;font-size:12.5px;opacity:.95}
.ht-cham{display:inline-block;width:9px;height:9px;border-radius:50%;background:#23c552;box-shadow:0 0 0 3px rgba(35,197,82,.28);flex:none;animation:ht-nhay 2s ease-in-out infinite}
@keyframes ht-nhay{50%{box-shadow:0 0 0 6px rgba(35,197,82,0)}}
.ht-dong{flex:none;width:36px;height:36px;border-radius:50%;border:2px solid #fff;background:#e5322d;color:#fff;font-size:22px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0 0 3px}
.ht-dong:hover{background:#c91f1a}

.ht-than{padding:18px 18px 16px}
.ht-hl-nhan{display:flex;align-items:center;justify-content:center;gap:8px;font-weight:800;font-size:13px;letter-spacing:.6px;color:var(--ht-c)}
.ht-so{display:flex;align-items:center;justify-content:center;gap:10px;margin:8px 0 14px;font-weight:900;font-size:32px;letter-spacing:.5px;color:var(--ht-c)!important}
.ht-so-i{font-size:26px}
.ht-hai{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ht-b{display:flex;align-items:center;justify-content:center;height:46px;border-radius:14px;color:#fff!important;font-weight:800;font-size:16px;box-shadow:0 5px 14px rgba(0,0,0,.18);transition:transform .15s,filter .15s}
.ht-b:hover{transform:translateY(-2px);filter:brightness(1.07)}
.ht-b-goi{background:linear-gradient(135deg,var(--ht-c),var(--ht-d))}
.ht-b-zalo{background:linear-gradient(135deg,#0068ff,#2f8bff)}
.ht-ghi{margin:12px 0 4px;text-align:center;font-size:13px;color:#667a6e}
.ht-muc{margin:16px 2px 8px;font-weight:800;font-size:13px;letter-spacing:.5px;color:#5c6f63}
.ht-ds{display:flex;flex-direction:column;gap:10px}
.ht-dong-nguoi{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid #e1e8e3;border-radius:16px;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.05);transition:box-shadow .15s,border-color .15s}
.ht-dong-nguoi:hover{border-color:var(--ht-c);box-shadow:0 4px 12px rgba(0,0,0,.1)}
.ht-cham-av{position:absolute;right:-1px;bottom:-1px;width:13px;height:13px;border:2px solid #fff;box-shadow:none;animation:none}
.ht-tin{flex:1;min-width:0}
.ht-ten{font-weight:800;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ht-sdt{font-size:14px;color:#5c6f63;letter-spacing:.3px}
.ht-vuong{flex:none;display:flex;align-items:center;justify-content:center;width:42px;height:38px;border-radius:12px;font-weight:800;font-size:12px;transition:transform .15s,filter .15s}
.ht-vuong:hover{transform:translateY(-2px);filter:brightness(.96)}
.ht-vuong-goi{background:#e6f1e9;color:var(--ht-c)!important;font-size:18px}
.ht-vuong-zalo{background:#e3eeff;color:#0068ff!important;width:46px}
.ht-mxh{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid #e8eee9}
.ht-mxh-chu{font-size:13px;color:#667a6e;margin-right:2px}
.ht-xh{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--ht-c);color:#fff!important;font-size:17px;transition:transform .15s,filter .15s}
.ht-xh:hover{transform:translateY(-2px) scale(1.06);filter:brightness(1.12)}
.ht-xh b{font-size:14px}
.ht-xh-facebook{background:#1877f2}.ht-xh-tiktok{background:#111}.ht-xh-youtube{background:#e11d1d}.ht-xh-zalo{background:#0068ff}
.ht-xh-instagram{background:linear-gradient(45deg,#f9a03f,#e1306c,#833ab4)}.ht-xh-x{background:#000}

@media (max-width:600px){
  .ht-trai{left:12px;bottom:14px;gap:10px}
  .ht-phai-khung{right:12px;bottom:14px}
  .ht-nut{height:46px;font-size:15px;padding-right:18px}
  .ht-phai{height:50px;font-size:15px;padding-right:18px}
  .ht-av-nho{width:34px;height:34px}
  .ht-bang{width:calc(100vw - 24px);max-height:calc(100vh - 96px)}
  .ht-so{font-size:28px}
}
@media (prefers-reduced-motion:reduce){.ht-goc *{animation:none!important;transition:none!important}}
@media print{.ht-goc{display:none!important}}

/* ---------- v2: bang trai (cham soc khach hang) + form Dat tu van ---------- */
.ht-bang-trai{transform-origin:left bottom}
.ht-mo-trai .ht-nut-a,.ht-mo-trai .ht-nut-b{box-shadow:0 8px 22px rgba(0,0,0,.28),0 0 0 3px #ffd54a}
.ht-ghi-form{margin:0 0 12px;text-align:left;font-size:14px;color:#44574b}
.ht-form[hidden],.ht-camon[hidden]{display:none}
.ht-truong{display:block;margin-bottom:12px}
.ht-nhan-t{display:block;margin-bottom:5px;font-weight:700;font-size:13px;color:#3d4f43}
.ht-truong input,.ht-truong textarea{width:100%;border:1.5px solid #d3ddd6;border-radius:12px;padding:11px 13px;font:inherit;font-size:16px;color:#1d2b22;background:#fff;transition:border-color .15s,box-shadow .15s}
.ht-truong textarea{resize:vertical;min-height:92px}
.ht-truong input:focus,.ht-truong textarea:focus{outline:0;border-color:var(--ht-c);box-shadow:0 0 0 3px rgba(139,0,0,.14)}
.ht-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.ht-loi{min-height:0;margin:-4px 0 8px;color:#c0211c;font-size:13.5px;font-weight:600}
.ht-gui{display:flex;align-items:center;justify-content:center;width:100%;height:48px;border:0;border-radius:14px;cursor:pointer;color:#fff;font:inherit;font-weight:800;font-size:16px;background:linear-gradient(135deg,var(--ht-c),var(--ht-d));box-shadow:0 5px 14px rgba(0,0,0,.2);transition:transform .15s,filter .15s}
.ht-gui:hover{transform:translateY(-2px);filter:brightness(1.07)}
.ht-gui-phu{background:#fff;color:var(--ht-c);border:1.5px solid var(--ht-c);box-shadow:none;margin-top:14px}
.ht-camon{text-align:center;padding:14px 4px 4px}
.ht-camon-i{width:64px;height:64px;border-radius:50%;margin:0 auto 12px;background:#e4f4e8;color:#14a44d;font-size:34px;font-weight:900;display:flex;align-items:center;justify-content:center}
.ht-camon-c{font-size:16px;line-height:1.5;color:#1d2b22;font-weight:600}


/* ---------- v2.1: thu nho cac bang, gon cho di dong ---------- */
.ht-bang{width:318px;max-height:min(520px,calc(100vh - 120px));max-height:min(520px,calc(100dvh - 120px));border-radius:18px;border-width:1.5px}
.ht-dau{padding:10px 10px 10px 12px;gap:10px}
.ht-dau .ht-av-nho{width:34px;height:34px}
.ht-av-nho+.ht-av-nho{margin-left:-11px}
.ht-tieu-ten{font-size:15px}
.ht-tieu-phu{font-size:12px}
.ht-dong{width:30px;height:30px;font-size:19px;padding-bottom:2px}
.ht-than{padding:12px 14px 12px}
.ht-hl-nhan{font-size:11.5px}
.ht-so{font-size:25px;margin:4px 0 10px;gap:8px}
.ht-so-i{font-size:21px}
.ht-hai{gap:10px}
.ht-b{height:40px;font-size:15px;border-radius:12px}
.ht-ghi{margin:8px 0 2px;font-size:12px}
.ht-ghi-form{font-size:13px;margin-bottom:10px}
.ht-muc{margin:12px 2px 6px;font-size:11.5px}
.ht-ds{gap:8px}
.ht-dong-nguoi{gap:10px;padding:7px 10px;border-radius:14px}
.ht-av-lon{width:42px;height:42px}
.ht-av-lon b{font-size:16px}
.ht-cham-av{width:11px;height:11px}
.ht-ten{font-size:14.5px}
.ht-sdt{font-size:12.5px}
.ht-vuong{width:36px;height:34px;border-radius:10px}
.ht-vuong-goi{font-size:16px}
.ht-vuong-zalo{width:40px;font-size:11.5px}
.ht-mxh{margin-top:12px;padding-top:10px;gap:8px}
.ht-xh{width:32px;height:32px;font-size:15px}
.ht-truong{margin-bottom:9px}
.ht-nhan-t{font-size:12.5px;margin-bottom:4px}
.ht-truong input,.ht-truong textarea{padding:9px 11px;font-size:16px;border-radius:10px}
.ht-truong textarea{min-height:70px}
.ht-gui{height:42px;font-size:15px;border-radius:12px}
.ht-camon-i{width:52px;height:52px;font-size:28px}
.ht-camon-c{font-size:15px}
.ht-nut{height:42px;padding:0 18px 0 6px;font-size:15px;gap:8px}
.ht-bieu{width:30px;height:30px}
.ht-nut-b::before{left:6px;width:30px;height:30px;margin-top:-15px}
.ht-phai{height:46px;padding:0 18px 0 6px;font-size:15px;gap:8px}
.ht-av-nho{width:34px;height:34px}
.ht-trai{gap:10px}
@media (max-width:600px){
  .ht-trai{left:10px;bottom:12px;gap:8px}
  .ht-phai-khung{right:10px;bottom:12px;gap:10px}
  .ht-nut{height:40px;font-size:14px;padding-right:15px}
  .ht-phai{height:42px;font-size:14px;padding-right:15px}
  .ht-av-nho{width:30px;height:30px}
  .ht-bang,.ht-bang-trai{width:min(318px,calc(100vw - 20px));max-height:calc(100vh - 150px);max-height:calc(100dvh - 150px)}
  .ht-bang-trai{width:min(318px,calc(100vw - 20px))}
  .ht-so{font-size:24px}
}
@media (max-width:360px){.ht-nhan,.ht-phai-chu{font-size:13px}.ht-phai .ht-cum .ht-av-nho:nth-child(3){display:none}}

/* ---------- v2.2: MOT nut "Goi / Zalo" ---------- */
.ht-trai{gap:0}
.ht-bang-trai{margin-bottom:12px}
.ht-nut-a{overflow:visible;padding:0 20px 0 7px;gap:10px;height:46px;background:linear-gradient(135deg,var(--ht-c) 0%,var(--ht-d) 100%);box-shadow:0 8px 22px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.28),0 0 0 2px rgba(255,255,255,.4)}
.ht-nut-a::after{display:none}
.ht-nut-a::before{content:"";position:absolute;inset:0;border-radius:999px;box-shadow:0 0 0 0 rgba(139,0,0,.5);animation:ht-vong 2.6s ease-out infinite;pointer-events:none}
@keyframes ht-vong{0%{box-shadow:0 0 0 0 rgba(139,0,0,.45)}70%,100%{box-shadow:0 0 0 14px rgba(139,0,0,0)}}
.ht-kep{display:inline-flex;align-items:center;flex:none}
.ht-kep .ht-bieu{width:32px;height:32px;border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.25);position:relative}
.ht-kep .ht-bieu+.ht-bieu{margin-left:-9px}
.ht-bieu-tel{color:var(--ht-c);font-size:16px}
.ht-bieu-tel .ht-svg{animation:ht-rung 2.4s ease-in-out infinite}
.ht-kep .ht-zi{font-size:9.5px}
.ht-mo-trai .ht-nut-a{box-shadow:0 8px 22px rgba(0,0,0,.3),0 0 0 3px #ffd54a}
.ht-mo-trai .ht-nut-a::before{animation:none}
@media (max-width:600px){.ht-trai{gap:0}.ht-nut-a{height:42px;padding-right:16px}.ht-kep .ht-bieu{width:28px;height:28px}.ht-bang-trai{margin-bottom:10px}}

/* ---------- v2.3 ---------- */
.ht-so-ten{text-align:center;margin:-6px 0 10px;font-size:13px;font-weight:700;color:#44574b}
.ht-ten{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.2}
.ht-tieu-ten{max-width:100%}

/* ---------- v2.4: hien dan, khong giat ---------- */
.ht-goc{animation:ht-hien .4s ease both}
@keyframes ht-hien{from{opacity:0}to{opacity:1}} /* chi opacity: transform se lam vung fixed tinh theo .ht-goc */
.lien-he-noi{display:none!important}

/* ---------- v2.5: o Turnstile (chi hien khi can) ---------- */
.ht-ts{display:flex;justify-content:center;margin:0 0 6px}
.ht-ts:empty{display:none}
.ht-gui:disabled{opacity:.7;cursor:progress;transform:none}
