/* Phòng chat 1-1 Deta AI Lab — Gọn sang, 1 nút nổi duy nhất góc phải dưới */
.cc-nut-noi{
  position:fixed;right:18px;bottom:18px;z-index:35;
  display:inline-flex;align-items:center;gap:9px;
  font:800 13.8px/1 "Be Vietnam Pro",ui-sans-serif,system-ui,sans-serif;
  padding:12px 18px;border-radius:999px;border:1px solid rgba(52,211,153,.45);
  background:linear-gradient(135deg,#10B981 0%,#059669 55%,#0EA5E9 100%);
  color:#FFFFFF;cursor:pointer;
  box-shadow:0 12px 28px -6px rgba(16,185,129,.52),0 2px 8px rgba(0,0,0,.22);
  transition:transform .16s ease,box-shadow .16s ease
}
.cc-nut-noi:hover{transform:translateY(-2px);box-shadow:0 16px 34px -6px rgba(16,185,129,.65)}
.cc-nut-noi .cham-song{
  width:8px;height:8px;border-radius:50%;background:#A7F3D0;
  box-shadow:0 0 0 4px rgba(167,243,208,.28);flex:none
}
@media (max-width:480px){
  .cc-nut-noi{right:12px;bottom:12px;padding:10px 14px;font-size:13px}
}

/* Bong bóng vẫy gọi thử thách Chatbot Chốt Đơn */
.cc-moi-chat{
  position:fixed;right:18px;bottom:68px;z-index:34;
  width:min(315px,calc(100vw - 32px));
  background:var(--the,#fff);color:var(--muc,#0F172A);
  border:1.5px solid rgba(16,185,129,.45);border-radius:16px;
  padding:11px 13px;box-shadow:0 16px 36px -8px rgba(15,23,42,.32);
  font:500 13px/1.42 "Be Vietnam Pro",ui-sans-serif,system-ui,sans-serif;
  animation:ccNhoi .4s cubic-bezier(.2,.8,.3,1)
}
@keyframes ccNhoi{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}
.cc-moi-dau{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:5px}
.cc-moi-nhan{font-size:11px;font-weight:800;color:#059669;background:rgba(16,185,129,.14);padding:2px 8px;border-radius:999px}
:root[data-theme=dark] .cc-moi-nhan{color:#34D399}
.cc-moi-tat{border:0;background:transparent;color:var(--mo,#64748B);font:800 15px/1 sans-serif;cursor:pointer;padding:2px 5px;border-radius:6px}
.cc-moi-nut{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.cc-moi-nut button{
  font:700 11.8px/1.2 "Be Vietnam Pro",sans-serif;padding:6px 10px;border-radius:999px;
  border:1px solid rgba(16,185,129,.42);background:var(--chinh-nhat,#ECFDF5);color:var(--chinh-dam,#047857);
  cursor:pointer;transition:transform .14s
}
:root[data-theme=dark] .cc-moi-nut button{background:rgba(16,185,129,.18);color:#34D399}
.cc-moi-nut button:hover{transform:translateY(-1px)}
@media (max-width:480px){.cc-moi-chat{right:12px;bottom:58px;width:min(290px,calc(100vw - 24px))}}

/* Thanh chọn Vai Demo (Role Switcher) & Gợi ý nhanh */
.cc-vai-bar{
  display:flex;gap:5px;overflow-x:auto;padding:7px 11px;
  border-bottom:1px solid var(--net,rgba(15,23,42,.08));background:var(--the,#fff);
  scrollbar-width:none
}
.cc-vai-bar::-webkit-scrollbar{display:none}
.cc-vai-pill{
  flex:none;font:700 11.8px/1.2 "Be Vietnam Pro",sans-serif;
  padding:5px 10px;border-radius:999px;border:1px solid var(--net,rgba(15,23,42,.14));
  background:var(--the-phu,#F8FAFC);color:var(--muc,#0F172A);cursor:pointer;white-space:nowrap
}
.cc-vai-pill.chon{
  background:linear-gradient(135deg,#10B981,#0EA5E9);color:#fff;border-color:transparent
}
.cc-custom-box{
  padding:6px 10px;border-bottom:1px solid var(--net,rgba(15,23,42,.1));
  background:var(--chinh-nhat,#ECFDF5);display:flex;align-items:center;gap:6px;font-size:12px
}
.cc-custom-box[hidden]{display:none!important}
:root[data-theme=dark] .cc-custom-box{background:rgba(16,185,129,.12)}
.cc-custom-box input{
  flex:1;min-width:0;box-sizing:border-box;font:inherit;padding:6px 9px;border-radius:8px;
  border:1px solid rgba(16,185,129,.4);background:var(--the,#fff);color:var(--muc,#0F172A)
}
.cc-goi-y-nhanh{
  display:flex;gap:5px;overflow-x:auto;padding:5px 10px;
  border-top:1px solid var(--net,rgba(15,23,42,.08));background:var(--the-phu,#F8FAFC);
  scrollbar-width:none;flex:none
}
.cc-goi-y-nhanh::-webkit-scrollbar{display:none}
.cc-chip-hoi{
  flex:none;font:600 11.5px/1.2 "Be Vietnam Pro",sans-serif;
  padding:5px 9px;border-radius:999px;border:1px dashed rgba(16,185,129,.45);
  background:var(--the,#fff);color:var(--muc,#0F172A);cursor:pointer;white-space:nowrap
}
.cc-chip-hoi:hover{border-style:solid;border-color:#10B981}
.cc-shop-cta{
  display:flex;align-items:center;justify-content:space-between;gap:6px;
  padding:5px 10px;border-top:1px solid var(--net,rgba(15,23,42,.08));
  background:linear-gradient(135deg,rgba(16,185,129,.10),rgba(14,165,233,.10));
  font-size:11.5px;font-weight:700;flex:none
}
.cc-shop-cta a{text-decoration:none;color:var(--chinh-dam,#047857);font-weight:800;white-space:nowrap}
:root[data-theme=dark] .cc-shop-cta a{color:#34D399}

.cc-khung{
  position:fixed;z-index:42;right:16px;bottom:14px;
  width:min(440px,calc(100vw - 24px));height:min(740px,calc(100vh - 28px));
  display:none;flex-direction:column;
  background:var(--the,#fff);color:var(--muc,#0F172A);
  border:1.5px solid var(--net-dam,rgba(16,185,129,.35));border-radius:20px;
  box-shadow:0 24px 56px -12px rgba(0,0,0,.55);
  font:400 14.2px/1.5 "Be Vietnam Pro",ui-sans-serif,system-ui,sans-serif;
  overflow:hidden;backdrop-filter:blur(12px)
}
.cc-khung.mo{display:flex}
@media (max-width:560px){
  .cc-khung{right:0!important;left:0!important;top:0!important;bottom:0!important;width:100%!important;height:100%!important;border-radius:0;border:0;z-index:50}
}

.cc-dau{padding:9px 12px;border-bottom:1px solid var(--net,rgba(15,23,42,.1));background:var(--the-phu,#F8FAFC);display:flex;gap:8px;align-items:center;flex:none}
.cc-dau>div:first-child{min-width:0;flex:1}
.cc-dau b{display:block;font-size:14.2px;font-weight:800;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-dau small{display:block;color:var(--mo,#475569);font-size:11.5px;line-height:1.3;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-to{margin-left:auto}
.cc-to,.cc-dong{
  font:800 14px/1 ui-sans-serif,system-ui,sans-serif;
  border:1px solid var(--net,rgba(15,23,42,.14));border-radius:9px;
  background:var(--the,#fff);color:var(--muc,#0F172A);
  width:30px;height:30px;cursor:pointer;flex:none;
  display:grid;place-items:center;transition:border-color .15s
}
.cc-to:hover,.cc-dong:hover{border-color:#10B981}
@media (max-width:560px){.cc-to{display:none}}

.cc-ds{flex:1;min-height:220px;overflow-y:auto;padding:12px 13px;display:flex;flex-direction:column;gap:9px;background:var(--giay,#F3F7FB)}
.cc-tin{
  max-width:92%;padding:9px 12px;border:1px solid var(--net,rgba(15,23,42,.1));
  border-radius:14px 14px 14px 4px;background:var(--the,#fff);
  word-wrap:break-word;overflow-wrap:anywhere;white-space:pre-wrap;
  box-shadow:0 2px 6px rgba(15,23,42,.04)
}
.cc-tin .ai-ten{display:block;font-size:11.5px;font-weight:800;color:var(--mo,#475569);margin-bottom:3px}
.cc-tin.ai{background:linear-gradient(135deg,#ECFDF5,#E0F2FE);color:#0F172A;border-color:rgba(16,185,129,.28)}
:root[data-theme=dark] .cc-tin.ai{background:linear-gradient(135deg,rgba(16,185,129,.20),rgba(56,189,248,.16));color:#F1F5F9;border-color:rgba(52,211,153,.32)}
.cc-tin.ai .ai-ten{color:#059669}:root[data-theme=dark] .cc-tin.ai .ai-ten{color:#34D399}
.cc-tin.toi{align-self:flex-end;background:var(--the,#fff);border-radius:14px 14px 4px 14px}
.cc-chan{border-top:1px solid var(--net,rgba(15,23,42,.1));background:var(--the,#fff);padding:8px 10px;display:grid;gap:6px;flex:none}
.cc-nhap-hang{display:flex;gap:6px;align-items:stretch}
.cc-chan input,.cc-chan textarea{
  flex:1;min-width:0;width:100%;box-sizing:border-box;font:inherit;font-size:13.8px;padding:8px 10px;
  border:1px solid var(--net,rgba(15,23,42,.14));border-radius:11px;
  background:var(--the-phu,#F8FAFC);color:var(--muc,#0F172A);resize:none
}
.cc-chan input:focus,.cc-chan textarea:focus{outline:none;border-color:#10B981;box-shadow:0 0 0 3px rgba(16,185,129,.18)}
.cc-nut{
  font:inherit;font-size:13.5px;font-weight:800;padding:8px 14px;border:0;border-radius:11px;
  background:linear-gradient(135deg,#10B981,#059669);color:#FFFFFF;
  cursor:pointer;box-shadow:0 6px 16px -4px rgba(16,185,129,.42);text-align:center;
  transition:transform .14s,box-shadow .14s;white-space:nowrap;flex:none
}
.cc-nut:hover{transform:translateY(-1px)}
.cc-nut.phu{background:var(--the-phu,#F8FAFC);color:var(--muc,#0F172A);border:1px solid var(--net,rgba(15,23,42,.14));box-shadow:none}
.cc-nut:disabled{opacity:.6;cursor:wait}
.cc-hang{display:flex;gap:8px}.cc-hang>*{flex:1;min-width:0}
.cc-ghi{font-size:12px;color:var(--mo,#475569);line-height:1.42}
.cc-loi{font-size:13px;color:var(--do,#EF4444);font-weight:700}
.cc-qr{text-align:center}.cc-qr img{width:100%;max-width:210px;background:#fff;padding:8px;border-radius:14px}

.cc-khung.toan-man{left:24px!important;right:24px!important;top:20px!important;bottom:20px!important;width:auto!important;height:auto!important;z-index:48;max-width:1020px;margin:0 auto}
.cc-khung.toan-man .cc-ds{padding:16px 20px}.cc-khung.toan-man .cc-tin{max-width:72%;font-size:15.5px}
.cc-nen{position:fixed;inset:0;z-index:46;background:rgba(2,6,23,.72);backdrop-filter:blur(4px)}

/* Thu gọn + sắp xếp từng mục (h2) */
.cc-muc-dau{cursor:pointer;display:flex;align-items:center;gap:10px;user-select:none}
.cc-muc-nut{
  margin-left:auto;flex:none;font:700 12.5px/1 "Be Vietnam Pro",ui-sans-serif,system-ui,sans-serif;
  padding:6px 12px;border:1px solid var(--net,rgba(15,23,42,.12));border-radius:999px;
  background:var(--the,#fff);color:var(--mo,#475569);cursor:pointer;box-shadow:var(--bong)
}
.cc-muc-dau.dang-an{opacity:.75}
.cc-tay{flex:none;font:800 15px/1 ui-sans-serif,system-ui,sans-serif;width:26px;height:30px;padding:0;border:1px dashed var(--net,rgba(15,23,42,.2));border-radius:8px;background:transparent;color:var(--mo,#475569);cursor:grab;touch-action:none}
.cc-tay:active{cursor:grabbing}
.cc-modul.dang-keo{opacity:.85;outline:2px dashed #10B981;outline-offset:6px;border-radius:16px}
.cc-khoi-phuc{margin:24px 0 0;text-align:center}
.cc-khoi-phuc button{font:600 13px/1.2 "Be Vietnam Pro",ui-sans-serif,system-ui,sans-serif;padding:7px 14px;border:1px solid var(--net);border-radius:999px;background:var(--the-phu);color:var(--mo);cursor:pointer}
