/**
 * Ogbon.ai chat bubble — bottom-right, stacked above back-to-top (.tap-top).
 * Overrides styles injected by chatbot_bulle.js.
 */
:root {
	--ct-tap-top-size: 35px;
	--ct-tap-top-bottom: 24px;
	--ct-tap-top-right: 24px;
	--ct-floating-gap: 14px;
	--ct-chat-toggle-size: 56px;
}

.tap-top.top {
	right: var(--ct-tap-top-right) !important;
	bottom: var(--ct-tap-top-bottom) !important;
	z-index: 1040 !important;
}

.chat-toggle,
#chat-toggle {
	top: auto !important;
	left: auto !important;
	right: var(--ct-tap-top-right) !important;
	bottom: calc(var(--ct-tap-top-bottom) + var(--ct-tap-top-size) + var(--ct-floating-gap)) !important;
	transform: none !important;
	z-index: 1050 !important;
}

#chatbox {
	top: auto !important;
	left: auto !important;
	right: var(--ct-tap-top-right) !important;
	bottom: calc(var(--ct-tap-top-bottom) + var(--ct-tap-top-size) + var(--ct-floating-gap) + var(--ct-chat-toggle-size) + 12px) !important;
	transform: none !important;
	z-index: 1051 !important;
}

#whisper-message {
	top: auto !important;
	left: auto !important;
	right: calc(var(--ct-tap-top-right) + var(--ct-chat-toggle-size) - 8px) !important;
	bottom: calc(var(--ct-tap-top-bottom) + var(--ct-tap-top-size) + var(--ct-floating-gap) + 8px) !important;
	transform: none !important;
	max-width: min(280px, calc(100vw - 120px));
	z-index: 1049 !important;
}

@media (max-width: 767px) {
	:root {
		--ct-tap-top-size: 30px;
		--ct-tap-top-bottom: 16px;
		--ct-tap-top-right: 16px;
		--ct-floating-gap: 12px;
		--ct-chat-toggle-size: 52px;
	}

	.chat-toggle,
	#chat-toggle {
		width: 52px !important;
		height: 52px !important;
	}

	#chatbox {
		width: min(300px, calc(100vw - 32px)) !important;
		height: min(400px, calc(100vh - 120px)) !important;
	}

	#whisper-message {
		right: calc(var(--ct-tap-top-right) + var(--ct-chat-toggle-size) - 4px) !important;
		max-width: min(240px, calc(100vw - 100px));
	}
}

#chatlog .celai-search-btn {
	display: inline-block;
	margin-top: 8px;
	margin-right: 6px;
	padding: 6px 10px;
	background: #3DA6DB;
	color: #fff !important;
	border-radius: 6px;
	text-decoration: none;
	font-size: 13px;
	line-height: 1.2;
}

#chatlog .celai-search-btn:hover {
	opacity: 0.9;
	color: #fff !important;
}