/* XD LuxHome — Chatbot tu van (Obsidian & Champagne Gold) */
.xbot{
	--cb-bg:#0B0C0F; --cb-sf:#14161B; --cb-sf2:#1B1E25;
	--cb-ink:#F7F5F0; --cb-body:rgba(247,245,240,.80); --cb-mu:#9AA0AA;
	--cb-gold:#CBA135; --cb-goldl:#E8D5A3; --cb-line:rgba(232,213,163,.16);
	position:fixed; z-index:10000; right:22px; bottom:24px;
	font-family:inherit; font-size:15px; line-height:1.55;
}

/* ---------- Nut mo ---------- */
.xbot-launch{
	display:inline-flex; align-items:center; gap:9px;
	padding:11px 18px 11px 14px; border:1px solid rgba(203,161,53,.5); border-radius:999px;
	background:linear-gradient(135deg,#1A1C22,#0D0E12); color:var(--cb-goldl);
	font:600 15px/1 inherit; letter-spacing:.01em; cursor:pointer; position:relative;
	box-shadow:0 10px 30px rgba(0,0,0,.45), inset 0 1px 0 rgba(232,213,163,.12);
	transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.xbot-launch:hover{ transform:translateY(-2px); border-color:var(--cb-gold); box-shadow:0 14px 34px rgba(0,0,0,.55); }
.xbot-launch-ic{ display:flex; color:var(--cb-gold); }
.xbot-dot{ position:absolute; top:9px; right:12px; width:8px; height:8px; border-radius:50%; background:#3ED07E; box-shadow:0 0 0 3px rgba(62,208,126,.18); }
.xbot[data-open="1"] .xbot-launch{ opacity:0; pointer-events:none; transform:scale(.9); }

/* ---------- Khung chat ---------- */
.xbot-panel{
	position:absolute; right:0; bottom:0; width:380px; max-width:calc(100vw - 32px);
	height:min(74vh,600px); display:none; flex-direction:column; overflow:hidden;
	background:var(--cb-bg); color:var(--cb-body);
	border:1px solid var(--cb-line); border-radius:20px;
	box-shadow:0 26px 70px rgba(0,0,0,.6);
}
.xbot[data-open="1"] .xbot-panel{ display:flex; animation:xbot-in .22s ease both; }
@keyframes xbot-in{ from{ opacity:0; transform:translateY(14px) scale(.985); } to{ opacity:1; transform:none; } }

.xbot-head{
	display:flex; align-items:center; gap:11px; padding:13px 14px;
	background:linear-gradient(135deg,#191B21,#101116);
	border-bottom:1px solid var(--cb-line); flex:0 0 auto;
}
.xbot-ava{
	width:38px; height:38px; flex:0 0 38px; border-radius:50%;
	display:grid; place-items:center; font:700 13px/1 inherit; letter-spacing:.05em;
	color:#0B0C0F; background:linear-gradient(140deg,var(--cb-goldl),var(--cb-gold));
}
.xbot-id{ display:flex; flex-direction:column; min-width:0; flex:1 1 auto; }
.xbot-id b{ color:var(--cb-ink); font-size:15px; font-weight:600; }
.xbot-id i{ color:var(--cb-mu); font-size:12px; font-style:normal; }
.xbot-min{ background:none; border:0; color:var(--cb-mu); cursor:pointer; padding:6px; border-radius:8px; display:flex; }
.xbot-min:hover{ color:var(--cb-goldl); background:rgba(232,213,163,.08); }

/* ---------- Dong tin nhan ---------- */
.xbot-log{ flex:1 1 auto; overflow-y:auto; padding:16px 14px 4px; scrollbar-width:thin; scrollbar-color:rgba(232,213,163,.25) transparent; }
.xbot-log::-webkit-scrollbar{ width:6px; }
.xbot-log::-webkit-scrollbar-thumb{ background:rgba(232,213,163,.22); border-radius:3px; }

.xbot-m{ max-width:88%; margin:0 0 10px; padding:10px 13px; border-radius:14px; font-size:14.5px; }
.xbot-m p{ margin:0 0 8px; } .xbot-m p:last-child{ margin-bottom:0; }
.xbot-m.bot{ background:var(--cb-sf); border:1px solid var(--cb-line); border-bottom-left-radius:5px; color:var(--cb-body); }
.xbot-m.me{ margin-left:auto; background:linear-gradient(135deg,var(--cb-goldl),var(--cb-gold)); color:#0B0C0F; font-weight:500; border-bottom-right-radius:5px; }
.xbot-m b{ color:var(--cb-ink); font-weight:600; }
.xbot-m.me b{ color:#0B0C0F; }
.xbot-hint{ color:var(--cb-mu); font-size:13px; }
.xbot-a{ color:var(--cb-goldl); text-decoration:underline; text-underline-offset:2px; }
.xbot-list{ margin:8px 0 0; padding:0; list-style:none; }
.xbot-list li{ padding:8px 0; border-top:1px solid var(--cb-line); font-size:14px; }
.xbot-list li b{ color:var(--cb-goldl); }

.xbot-typing{ display:inline-flex; gap:4px; padding:4px 2px; }
.xbot-typing i{ width:6px; height:6px; border-radius:50%; background:var(--cb-mu); animation:xbot-bl 1s infinite; }
.xbot-typing i:nth-child(2){ animation-delay:.15s; } .xbot-typing i:nth-child(3){ animation-delay:.3s; }
@keyframes xbot-bl{ 0%,60%,100%{ opacity:.25; transform:translateY(0); } 30%{ opacity:1; transform:translateY(-3px); } }

/* ---------- The san pham ---------- */
.xbot-cards{ display:flex; flex-direction:column; gap:8px; margin:0 0 10px; max-width:96%; }
.xbot-card{
	display:flex; gap:11px; align-items:center; padding:9px; text-decoration:none;
	background:var(--cb-sf); border:1px solid var(--cb-line); border-radius:13px;
	transition:border-color .16s ease, transform .16s ease;
}
.xbot-card:hover{ border-color:rgba(203,161,53,.5); transform:translateX(2px); }
.xbot-card img{ width:60px; height:60px; flex:0 0 60px; object-fit:contain; border-radius:9px; background:#fff; }
.xbot-card-ph{ width:60px; height:60px; flex:0 0 60px; border-radius:9px; display:grid; place-items:center; background:var(--cb-sf2); color:var(--cb-gold); font-weight:700; font-size:13px; }
.xbot-card-b{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.xbot-card-b b{ color:var(--cb-ink); font-size:13.5px; font-weight:600; line-height:1.35; }
.xbot-card-b i{ color:var(--cb-mu); font-size:12px; font-style:normal; line-height:1.4; }
.xbot-card-b u{ color:var(--cb-goldl); font-size:13px; font-weight:600; text-decoration:none; }

/* ---------- Nut hanh dong ---------- */
.xbot-cta{ display:flex; flex-wrap:wrap; gap:8px; margin:10px 0 0 !important; }
.xbot-b{
	display:inline-block; padding:8px 14px; border-radius:999px; font-size:13.5px; font-weight:600; text-decoration:none;
	color:#0B0C0F; background:linear-gradient(135deg,var(--cb-goldl),var(--cb-gold));
}
.xbot-b.ghost{ background:transparent; color:var(--cb-goldl); border:1px solid rgba(203,161,53,.5); }

/* ---------- Chip goi y ---------- */
.xbot-chips{ display:flex; flex-wrap:wrap; gap:7px; padding:6px 14px 10px; flex:0 0 auto; }
.xbot-chip{
	padding:8px 13px; border-radius:999px; cursor:pointer; font:500 13.5px/1.2 inherit;
	color:var(--cb-goldl); background:rgba(203,161,53,.07); border:1px solid rgba(203,161,53,.34);
	transition:background .16s ease, border-color .16s ease;
}
.xbot-chip:hover{ background:rgba(203,161,53,.16); border-color:var(--cb-gold); }

/* ---------- O nhap ---------- */
.xbot-bar{ display:flex; align-items:center; gap:8px; padding:10px 12px 12px; border-top:1px solid var(--cb-line); background:#0D0E12; flex:0 0 auto; }
.xbot-hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.xbot-in{
	flex:1 1 auto; min-width:0; padding:11px 14px; border-radius:999px;
	background:var(--cb-sf); border:1px solid var(--cb-line); color:var(--cb-ink); font:400 14.5px/1.3 inherit;
}
.xbot-in::placeholder{ color:#6E7480; }
.xbot-in:focus{ outline:none; border-color:rgba(203,161,53,.55); }
.xbot-send{
	flex:0 0 42px; width:42px; height:42px; border:0; border-radius:50%; cursor:pointer; display:grid; place-items:center;
	color:#0B0C0F; background:linear-gradient(135deg,var(--cb-goldl),var(--cb-gold));
}
.xbot-send:disabled{ opacity:.45; cursor:default; }

/* ---------- Ket qua tra cuu bao hanh ---------- */
.xbot-wr .xwl-msg{ padding:9px 12px; border-radius:10px; font-size:13.5px; margin:0 0 9px; background:rgba(62,208,126,.1); border:1px solid rgba(62,208,126,.3); color:#BEEBD2; }
.xbot-wr .xwl-msg.err{ background:rgba(226,92,92,.1); border-color:rgba(226,92,92,.3); color:#F0C3C3; }
.xbot-wr .xwl-msg a{ color:var(--cb-goldl); }
.xbot-wr .xwl-list{ display:flex; flex-direction:column; gap:8px; }
.xbot-wr .xwl-it{ display:flex; gap:10px; padding:9px; background:var(--cb-sf); border:1px solid var(--cb-line); border-radius:12px; }
.xbot-wr .xwl-it img{ width:54px; height:54px; flex:0 0 54px; object-fit:contain; border-radius:8px; background:#fff; }
.xbot-wr .xwl-ph{ width:54px; height:54px; flex:0 0 54px; border-radius:8px; display:grid; place-items:center; background:var(--cb-sf2); color:var(--cb-gold); font-size:10px; text-align:center; }
.xbot-wr .xwl-n{ margin:0 0 4px; font-size:13.5px; font-weight:600; color:var(--cb-ink); }
.xbot-wr .xwl-n a{ color:var(--cb-ink); text-decoration:none; }
.xbot-wr .xwl-meta{ display:flex; flex-wrap:wrap; gap:4px 10px; font-size:12px; color:var(--cb-mu); }
.xbot-wr .xwl-meta b{ color:var(--cb-body); font-weight:600; }
.xbot-wr .xwl-badge{ display:inline-block; margin-top:6px; padding:4px 9px; border-radius:999px; font-size:11.5px; font-weight:600; }
.xbot-wr .xwl-badge.on{ background:rgba(62,208,126,.14); color:#7FE0A8; }
.xbot-wr .xwl-badge.off{ background:rgba(226,92,92,.14); color:#F0A5A5; }
.xbot-wr .xwl-badge.na{ background:rgba(154,160,170,.14); color:var(--cb-mu); }

/* ---------- Mobile ---------- */
@media (max-width:760px){
	.xbot{ right:auto; left:14px; bottom:68px; }
	.xbot-launch{ padding:11px 16px 11px 13px; font-size:14px; }
	.xbot-panel{
		position:fixed; inset:0; width:100%; max-width:none; height:100%;
		border-radius:0; border:0;
	}
	.xbot-log{ padding:14px 12px 4px; }
	.xbot-m{ max-width:92%; }
	.xbot-bar{ padding-bottom:calc(12px + env(safe-area-inset-bottom)); }
	.xbot-head{ padding-top:calc(13px + env(safe-area-inset-top)); }
}
@media (max-width:400px){
	.xbot-launch-tx{ display:none; }
	.xbot-launch{ padding:12px; }
}

/* Trang san pham co thanh CTA dinh duoi -> day nut mo chat len cao hon */
@media (max-width:860px){
	body.single-product .xbot{ bottom:calc(136px + env(safe-area-inset-bottom)); }
}

/* Mo khung chat thi an thanh menu duoi cung tren mobile */
@media (max-width:760px){
	body.xbot-open nav.xb{ display:none !important; }
	body.xbot-open .xp-sticky{ display:none !important; }
}

@media print{ .xbot{ display:none !important; } }