/* Humbrix AI Assistant widget styles */
.humbrix-bot * { box-sizing: border-box; }

.humbrix-bot {
	--hb-red: #e4322b;
	--hb-red-dark: #c2261f;
	--hb-navy: #111a33;
	--hb-bg: #ffffff;
	--hb-muted: #6b7280;
	--hb-line: #e5e7eb;
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 99999;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* Launcher — flying robotic hummingbird */
.humbrix-bot__launcher {
	position: relative;
	width: 80px;
	height: 60px;
	border: none;
	padding: 0;
	cursor: pointer;
	background: transparent;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	will-change: transform;
	/* the glide between waypoints */
	transition: transform 1.8s cubic-bezier(.45, .05, .35, 1);
}

/* Bird */
.hb-bird-wrap { display: inline-flex; transition: transform .25s ease; }
.hb-bird-wrap.face-left { transform: scaleX(-1); }
.hb-bird {
	width: 72px; height: 50px;
	filter: drop-shadow(0 6px 9px rgba(0, 0, 0, .28));
	animation: hb-hover .7s ease-in-out infinite;
}
@keyframes hb-hover { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-2.5px); } }

/* Flapping wings (fast, opposite phase + translucency = motion blur) */
.hb-wing { transform-box: fill-box; transform-origin: 90% 79%; }
.hb-wing-a { animation: hb-flap-a .1s linear infinite; }
.hb-wing-b { animation: hb-flap-b .1s linear infinite; }
@keyframes hb-flap-a { 0%, 100% { transform: rotate(-24deg); } 50% { transform: rotate(42deg); } }
@keyframes hb-flap-b { 0%, 100% { transform: rotate(40deg); } 50% { transform: rotate(-22deg); } }

/* Spinning rotor */
.hb-rotor { transform-box: fill-box; transform-origin: center; animation: hb-spin .4s linear infinite; }
@keyframes hb-spin { to { transform: rotate(360deg); } }

/* Open state: bird lands and turns into a red close-button */
.hb-chevron { width: 26px; height: 26px; display: none; }
.humbrix-bot.is-open .humbrix-bot__launcher {
	width: 60px; height: 60px;
	background: var(--hb-red);
	border-radius: 50%;
	box-shadow: 0 8px 22px rgba(228, 50, 43, .45);
	transform: translate(0, 0) !important;
	transition: background .2s ease;
}
.humbrix-bot.is-open .hb-bird-wrap { display: none; }
.humbrix-bot.is-open .hb-chevron { display: block; }
.humbrix-bot.is-open .humbrix-bot__launcher:hover { background: var(--hb-red-dark); }

/* Attention bubble */
.humbrix-bot__bubble {
	position: absolute;
	right: 74px;
	bottom: 14px;
	white-space: nowrap;
	background: #fff;
	color: var(--hb-navy);
	font-size: 13.5px;
	font-weight: 500;
	padding: 9px 30px 9px 13px;
	border-radius: 14px;
	box-shadow: 0 8px 22px rgba(0, 0, 0, .18);
	cursor: pointer;
	opacity: 0;
	transform: translateX(8px) scale(.95);
	pointer-events: none;
	transition: opacity .25s ease, transform .25s ease;
}
.humbrix-bot__bubble::after {
	content: "";
	position: absolute;
	right: -6px;
	bottom: 16px;
	width: 12px; height: 12px;
	background: #fff;
	transform: rotate(45deg);
	box-shadow: 2px -2px 4px rgba(0, 0, 0, .05);
}
.humbrix-bot.show-bubble .humbrix-bot__bubble {
	opacity: 1;
	transform: translateX(0) scale(1);
	pointer-events: auto;
}
.humbrix-bot__bubble .hb-bubble-x {
	position: absolute;
	right: 9px; top: 50%;
	transform: translateY(-50%);
	font-size: 17px;
	line-height: 1;
	color: var(--hb-muted);
}
.humbrix-bot__bubble .hb-bubble-x:hover { color: var(--hb-navy); }

@media (max-width: 480px) {
	.humbrix-bot__bubble { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	.hb-bird, .hb-wing-a, .hb-wing-b, .hb-rotor { animation: none; }
	.humbrix-bot__launcher { transition: none; }
}

/* Panel */
.humbrix-bot__panel {
	position: absolute;
	right: 0;
	bottom: 76px;
	width: 370px;
	max-width: calc(100vw - 32px);
	height: 560px;
	max-height: calc(100vh - 120px);
	background: var(--hb-bg);
	border-radius: 16px;
	box-shadow: 0 20px 50px rgba(0, 0, 0, .28);
	display: none;
	flex-direction: column;
	overflow: hidden;
}
.humbrix-bot.is-open .humbrix-bot__panel { display: flex; }

/* Header */
.humbrix-bot__header {
	background: var(--hb-navy);
	color: #fff;
	padding: 14px 16px;
	display: flex;
	align-items: center;
	gap: 10px;
}
.humbrix-bot__header .hb-dot { width: 9px; height: 9px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 3px rgba(34,197,94,.25); }
.humbrix-bot__header h4 { margin: 0; font-size: 15px; font-weight: 600; }
.humbrix-bot__header p { margin: 2px 0 0; font-size: 12px; opacity: .75; }
.humbrix-bot__header .hb-close {
	margin-left: auto; background: transparent; border: none; color: #fff;
	font-size: 22px; line-height: 1; cursor: pointer; opacity: .8;
}
.humbrix-bot__header .hb-close:hover { opacity: 1; }

/* Messages */
.humbrix-bot__messages {
	flex: 1;
	overflow-y: auto;
	padding: 16px;
	background: #f7f8fa;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.hb-msg { max-width: 85%; padding: 10px 13px; border-radius: 14px; font-size: 14px; line-height: 1.45; white-space: pre-wrap; word-wrap: break-word; }
.hb-msg.bot { background: #fff; border: 1px solid var(--hb-line); align-self: flex-start; border-bottom-left-radius: 4px; }
.hb-msg.user { background: var(--hb-red); color: #fff; align-self: flex-end; border-bottom-right-radius: 4px; }
.hb-typing { align-self: flex-start; display: flex; gap: 4px; padding: 12px 14px; background: #fff; border: 1px solid var(--hb-line); border-radius: 14px; }
.hb-typing span { width: 7px; height: 7px; border-radius: 50%; background: #c4c8d0; animation: hb-bounce 1.2s infinite; }
.hb-typing span:nth-child(2) { animation-delay: .2s; }
.hb-typing span:nth-child(3) { animation-delay: .4s; }
@keyframes hb-bounce { 0%, 60%, 100% { transform: translateY(0); } 30% { transform: translateY(-5px); } }

/* Quick replies */
.humbrix-bot__quick { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 16px 8px; background: #f7f8fa; }
.humbrix-bot__quick button {
	font-size: 12.5px; padding: 6px 11px; border-radius: 999px;
	border: 1px solid var(--hb-red); color: var(--hb-red); background: #fff; cursor: pointer;
}
.humbrix-bot__quick button:hover { background: var(--hb-red); color: #fff; }

/* Input */
.humbrix-bot__input { display: flex; gap: 8px; padding: 12px; border-top: 1px solid var(--hb-line); background: #fff; }
.humbrix-bot__input textarea {
	flex: 1; resize: none; border: 1px solid var(--hb-line); border-radius: 10px;
	padding: 9px 11px; font-size: 14px; font-family: inherit; max-height: 90px; outline: none;
}
.humbrix-bot__input textarea:focus { border-color: var(--hb-red); }
.humbrix-bot__input button {
	background: var(--hb-red); border: none; color: #fff; width: 42px; border-radius: 10px; cursor: pointer;
	display: flex; align-items: center; justify-content: center;
}
.humbrix-bot__input button:hover { background: var(--hb-red-dark); }
.humbrix-bot__input button svg { width: 18px; height: 18px; }

/* Lead form */
.humbrix-bot__lead { padding: 16px; background: #fff; border-top: 1px solid var(--hb-line); display: none; }
.humbrix-bot.is-lead .humbrix-bot__lead { display: block; }
.humbrix-bot.is-lead .humbrix-bot__input,
.humbrix-bot.is-lead .humbrix-bot__quick { display: none; }
.humbrix-bot__lead h5 { margin: 0 0 8px; font-size: 14px; color: var(--hb-navy); }
.humbrix-bot__lead input, .humbrix-bot__lead textarea {
	width: 100%; margin-bottom: 8px; border: 1px solid var(--hb-line); border-radius: 9px; padding: 9px 11px; font-size: 13.5px; font-family: inherit; outline: none;
}
.humbrix-bot__lead input:focus, .humbrix-bot__lead textarea:focus { border-color: var(--hb-red); }
.humbrix-bot__lead .hb-hp { display: none; } /* honeypot */
.humbrix-bot__lead .hb-actions { display: flex; gap: 8px; }
.humbrix-bot__lead .hb-submit { flex: 1; background: var(--hb-red); color: #fff; border: none; border-radius: 9px; padding: 10px; font-size: 14px; cursor: pointer; }
.humbrix-bot__lead .hb-submit:hover { background: var(--hb-red-dark); }
.humbrix-bot__lead .hb-cancel { background: #eef0f3; border: none; border-radius: 9px; padding: 10px 14px; cursor: pointer; }
.humbrix-bot__note { font-size: 11.5px; color: var(--hb-muted); text-align: center; padding: 6px 12px 10px; background: #fff; }
.humbrix-bot__note a { color: var(--hb-red); text-decoration: none; }
