/**
 * Singulary Chatbot — Bubble + Botpress-FAB-Anpassung.
 * Die iframe-Regeln brauchen !important, weil Botpress inline-Styles
 * setzt (Vendor-Override, kein Stil-Drift).
 */

@media ( min-width: 768px ) {
	iframe[title='Botpress Webchat Fab'],
	.bpWebchat iframe,
	div[class*='bpFab'] iframe {
		width: 80px !important;
		height: 80px !important;
	}
}

#sg-chat-bubble {
	position: fixed;
	right: 20px;
	bottom: 110px;
	z-index: 9999;
	padding: 10px 18px;
	border-radius: var(--wp--custom--radius--sm, 12px);
	background: var(--wp--preset--color--base, #fff);
	color: var(--wp--preset--color--ink, #1a2434);
	color-scheme: light;
	box-shadow: 0 4px 20px rgba( 0, 0, 0, .12 );
	font-size: 14px;
	cursor: pointer;
	animation: sg-bubble-in .5s ease-out;
}

#sg-chat-bubble[hidden] {
	display: none;
}

@keyframes sg-bubble-in {
	0% { transform: scale( 0 ) translateY( 30% ); opacity: 0; }
	60% { transform: scale( 1.05 ) translateY( -5% ); opacity: 1; }
	100% { transform: scale( 1 ) translateY( 0 ); }
}

@media ( max-width: 600px ) {
	#sg-chat-bubble {
		right: 16px;
		bottom: 80px;
		padding: 8px 14px;
		font-size: 12px;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	#sg-chat-bubble {
		animation: none;
	}
}