/* Humavit – Doradca AI — styl dopasowany do motywu (Tailwind/Oswald/Poppins, zieleń #16a34a) */
#hai-root{
	--hai-accent:#16a34a;
	--hai-accent-2:#15803d;
	--hai-accent-soft:#f0fdf4;
	--hai-accent-border:#bbf7d0;
	--hai-ink:#1e293b;
	--hai-ink-strong:#0f172a;
	--hai-muted:#64748b;
	--hai-faint:#94a3b8;
	--hai-line:#e2e8f0;
	--hai-line-2:#f1f5f9;
	--hai-bg:#ffffff;
	--hai-user:#ecfdf3;
	--hai-bottom:20px;      /* bazowy odstęp od dołu */
	--hai-x:20px;           /* odstęp od boku */
	--hai-safe:0px;         /* dodatkowy odstęp nad dolnym paskiem/przyciskiem (ustawiany przez JS) */
	--hai-font:'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
	--hai-head:'Oswald', Impact, 'Arial Narrow', sans-serif;
	position:fixed;
	bottom:calc(var(--hai-bottom) + var(--hai-safe));
	z-index:2147483000; /* nad paskiem zakupu i toastami; pod modalami o max z-index */
	font-family:var(--hai-font);
}
#hai-root.hai-pos-right{ right:var(--hai-x); left:auto; }
#hai-root.hai-pos-left{ left:var(--hai-x); right:auto; }
#hai-root *{ box-sizing:border-box; }

/* ── Launcher ─────────────────────────────────────────── */
#hai-launcher{
	display:inline-flex;
	align-items:center;
	gap:10px;
	background:linear-gradient(135deg, var(--hai-accent), var(--hai-accent-2));
	color:#fff;
	border:none;
	border-radius:100px;
	padding:13px 20px 13px 16px;
	font-family:var(--hai-font);
	font-size:14px;
	font-weight:700;
	letter-spacing:.2px;
	cursor:pointer;
	box-shadow:0 12px 28px -6px rgba(22,163,74,.5);
	transition:transform .2s ease, box-shadow .2s ease;
	line-height:1;
}
#hai-launcher:hover{ transform:translateY(-2px); box-shadow:0 18px 36px -8px rgba(22,163,74,.6); }
#hai-launcher i{ font-size:19px; }
.hai-launcher-label{ white-space:nowrap; }
#hai-root.hai-open #hai-launcher{ display:none; } /* na mobile launcher chowa się gdy panel otwarty */

/* ── Panel ────────────────────────────────────────────── */
#hai-panel{
	position:absolute;
	right:0;
	bottom:60px;
	transform-origin:bottom right;
	width:384px;
	max-width:calc(100vw - 32px);
	height:min(600px, calc(100vh - 130px));
	background:var(--hai-bg);
	color:var(--hai-ink);
	border:1px solid var(--hai-line);
	border-radius:24px;
	box-shadow:0 30px 60px -12px rgba(15,23,42,.28), 0 0 0 1px rgba(22,163,74,.04);
	display:flex;
	flex-direction:column;
	overflow:hidden;
	animation:hai-in .2s cubic-bezier(.2,.8,.2,1);
}
/* Wariant: launcher po lewej — panel wyrównany do lewej */
.hai-pos-left #hai-panel{ right:auto; left:0; transform-origin:bottom left; }
@keyframes hai-in{ from{ opacity:0; transform:translateY(14px) scale(.97);} to{opacity:1;transform:none;} }
.hai-hidden{ display:none !important; }

/* Header */
.hai-header{
	background:linear-gradient(135deg, var(--hai-accent), var(--hai-accent-2));
	color:#fff;
	padding:16px 16px;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:10px;
}
.hai-header-t{ display:flex; align-items:center; gap:12px; min-width:0; }
.hai-avatar{
	width:40px; height:40px; flex:0 0 auto;
	border-radius:50%;
	background:rgba(255,255,255,.18);
	display:flex; align-items:center; justify-content:center;
	font-size:18px;
}
.hai-avatar svg{ width:30px; height:30px; display:block; }
.hai-header-titles{ display:flex; flex-direction:column; min-width:0; }
.hai-header-titles strong{ font-family:var(--hai-head); font-weight:700; font-size:18px; text-transform:uppercase; letter-spacing:.5px; line-height:1.1; display:flex; align-items:center; gap:8px; }
.hai-header-titles small{ font-size:11px; opacity:.9; font-weight:500; margin-top:2px; }
.hai-badge{
	background:rgba(255,255,255,.25);
	font-family:var(--hai-font);
	font-size:9px; font-weight:800; letter-spacing:.5px;
	padding:2px 6px; border-radius:5px; text-transform:uppercase;
}
#hai-close{
	background:rgba(255,255,255,.12); border:none; color:#fff;
	width:34px; height:34px; border-radius:50%;
	font-size:16px; line-height:1; cursor:pointer;
	display:flex; align-items:center; justify-content:center;
	transition:background .2s; flex:0 0 auto;
}
#hai-close:hover{ background:rgba(255,255,255,.28); }

/* Wiadomości */
.hai-messages{
	flex:1;
	overflow-y:auto;
	padding:18px 16px;
	display:flex;
	flex-direction:column;
	gap:12px;
	background:#f8fafc;
	scroll-behavior:smooth;
}
.hai-messages::-webkit-scrollbar{ width:8px; }
.hai-messages::-webkit-scrollbar-thumb{ background:#dbe3ec; border-radius:8px; }

.hai-row{ display:flex; flex-direction:column; max-width:88%; }
.hai-row-user{ align-self:flex-end; align-items:flex-end; }
.hai-row-bot{ align-self:flex-start; align-items:flex-start; }

.hai-msg{
	padding:11px 14px;
	border-radius:16px;
	font-size:14.5px;
	line-height:1.5;
	word-wrap:break-word;
	overflow-wrap:anywhere;
}
.hai-msg a{ color:var(--hai-accent); text-decoration:underline; font-weight:600; }
.hai-msg-bot{ background:#fff; border:1px solid var(--hai-line); color:var(--hai-ink); border-bottom-left-radius:5px; box-shadow:0 2px 6px rgba(15,23,42,.03); }
.hai-msg-user{ background:linear-gradient(135deg, var(--hai-accent), var(--hai-accent-2)); color:#fff; border-bottom-right-radius:5px; }
.hai-msg-user a{ color:#fff; }

/* Typing */
.hai-typing{ display:inline-flex; gap:5px; padding:3px 0; }
.hai-typing span{ width:8px; height:8px; border-radius:50%; background:var(--hai-faint); opacity:.4; animation:hai-blink 1s infinite; }
.hai-typing span:nth-child(2){ animation-delay:.2s; }
.hai-typing span:nth-child(3){ animation-delay:.4s; }
@keyframes hai-blink{ 0%,100%{opacity:.3; transform:translateY(0);} 50%{opacity:1; transform:translateY(-2px);} }

/* Karty produktów */
.hai-cards{ display:flex; flex-direction:column; gap:10px; margin-top:10px; width:100%; }
.hai-card{
	display:flex; gap:12px; align-items:center;
	background:#fff; border:1px solid var(--hai-line);
	border-radius:16px; padding:10px; text-decoration:none;
	transition:border-color .2s, box-shadow .2s, transform .2s;
}
.hai-card:hover{ border-color:var(--hai-accent-border); box-shadow:0 10px 24px -10px rgba(22,163,74,.28); transform:translateY(-1px); }
.hai-card-img{ width:60px; height:60px; flex:0 0 auto; border-radius:12px; background:#f8fafc; border:1px solid var(--hai-line-2); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.hai-card-img img{ width:100%; height:100%; object-fit:contain; padding:4px; }
.hai-card-body{ flex:1; min-width:0; }
.hai-card-name{ font-size:13px; font-weight:700; color:var(--hai-ink-strong); line-height:1.3; margin:0 0 4px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.hai-card-price{ font-family:var(--hai-head); font-size:16px; font-weight:700; color:var(--hai-accent); line-height:1; }
.hai-card-price-old{ font-family:var(--hai-font); font-size:12px; font-weight:600; color:var(--hai-faint); text-decoration:line-through; margin-right:7px; }
.hai-card-actions{ display:flex; gap:6px; align-items:center; margin-top:8px; flex-wrap:wrap; }
.hai-card-btn{
	display:inline-flex; align-items:center; gap:6px;
	font-family:var(--hai-font); font-size:11px; font-weight:700;
	padding:6px 12px; border-radius:100px; cursor:pointer; text-decoration:none;
	border:1px solid var(--hai-accent); background:var(--hai-accent); color:#fff !important;
	transition:all .2s; line-height:1;
}
.hai-card-btn:hover{ background:var(--hai-accent-2); border-color:var(--hai-accent-2); }
.hai-card-btn.hai-ghost{ background:#fff; color:var(--hai-accent) !important; }
.hai-card-btn.hai-ghost:hover{ background:var(--hai-accent-soft); }
.hai-card-btn.added{ background:var(--hai-accent-2); border-color:var(--hai-accent-2); }

/* Przycisk „Zobacz wszystkie wyniki" */
.hai-seeall{
	display:flex; align-items:center; justify-content:center; gap:8px;
	margin-top:10px; padding:11px 14px;
	border:1px dashed var(--hai-accent-border); border-radius:14px;
	background:var(--hai-accent-soft); color:var(--hai-accent-2) !important;
	font-size:12.5px; font-weight:700; text-decoration:none;
	transition:background .2s;
}
.hai-seeall:hover{ background:#dcfce7; }

/* Suggestion chips */
.hai-suggestions{ display:flex; flex-wrap:wrap; gap:7px; padding:0 14px 4px; background:#f8fafc; }
.hai-suggestions:empty{ display:none; }
.hai-chip{
	border:1px solid var(--hai-accent-border); background:#fff;
	color:var(--hai-accent-2); font-family:var(--hai-font);
	font-size:12px; font-weight:600; padding:7px 12px; border-radius:100px;
	cursor:pointer; transition:all .2s; white-space:nowrap;
}
.hai-chip:hover{ background:var(--hai-accent-soft); border-color:var(--hai-accent); }

/* Formularz */
.hai-form{
	display:flex; align-items:flex-end; gap:8px;
	padding:12px; border-top:1px solid var(--hai-line); background:#fff;
}
#hai-input{
	flex:1; resize:none;
	border:1px solid var(--hai-line); border-radius:14px;
	padding:11px 14px; font-size:14.5px; font-family:var(--hai-font);
	max-height:120px; outline:none; color:var(--hai-ink); background:#f8fafc;
	transition:border-color .2s, box-shadow .2s, background .2s;
}
#hai-input:focus{ border-color:var(--hai-accent); background:#fff; box-shadow:0 0 0 3px rgba(22,163,74,.1); }
#hai-send{
	flex:0 0 auto; width:46px; height:46px;
	border:none; border-radius:14px;
	background:linear-gradient(135deg, var(--hai-accent), var(--hai-accent-2)); color:#fff;
	cursor:pointer; font-size:16px;
	display:inline-flex; align-items:center; justify-content:center;
	transition:transform .15s, opacity .2s; box-shadow:0 8px 18px -6px rgba(22,163,74,.5);
}
#hai-send:hover:not(:disabled){ transform:scale(1.05); }
#hai-send:disabled{ opacity:.5; cursor:default; box-shadow:none; }

.hai-disclaimer{
	font-size:10.5px; color:var(--hai-faint);
	padding:8px 14px; background:#fff; border-top:1px solid var(--hai-line-2);
	line-height:1.4; text-align:center;
}

/* ── Kolizja z dolnym paskiem produktu (desktop): podnieś launcher ── */
body.single-product #hai-root{ --hai-safe:76px; }

/* ── Mobile: panel pełnoekranowy ─────────────────────── */
@media (max-width:640px){
	#hai-root{ --hai-x:14px; --hai-bottom:14px; --hai-safe:70px; }
	.hai-launcher-label{ display:none; }
	#hai-launcher{ padding:15px; border-radius:50%; }
	#hai-launcher i{ font-size:20px; }

	#hai-panel{
		position:fixed;
		inset:0;
		width:100vw; max-width:100vw;
		height:100vh; height:100dvh;
		max-height:none;
		border-radius:0;
		border:none;
	}
	.hai-row{ max-width:92%; }
}

@media (prefers-reduced-motion: reduce){
	#hai-root *{ animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}
