/* hide the original widget - that there were no two labels on the screen*/
#jivo_chat_widget{
	display: none;
}

/* the default style - for offline messages if no one is online */
#jivo_custom_widget{
	position: fixed;
	right: 20px; /* правый нижний угол */
	bottom: 80px; /* правый нижний угол */
	width: 85px; /* уменьшенный размер */
	height: 85px; /* уменьшенный размер */
	z-index: 300000;
	cursor: pointer;
	background-image: url(images/jivo_widget_offline.png);
	background-size: contain;
	background-repeat: no-repeat;
	border-radius: 50%; /* делаем круглым */
	transition: transform 0.2s ease;
	overflow: hidden; /* обрезаем углы картинки */
}

/* when you hover the label should scale slightly */
#jivo_custom_widget:hover{
	transform: scale(1.05);
}

/* if there are operators online - show other label*/
#jivo_custom_widget.jivo_online{
	height: 85px; /* уменьшенный размер */
	background-image: url(images/jivo_widget_online.png);
}

/* Стиль для всплывающих надписей (bubble) */
#jivo_custom_bubble{
	position: fixed;
	right: 117px; /* слева от иконки (85px + 20px отступ + 12px gap) */
	bottom: 110px; /* чуть выше центра иконки */
	background: #ffffff;
	color: #333333;
	padding: 12px 18px;
	border-radius: 20px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 15px;
	font-weight: 500;
	z-index: 300001;
	white-space: nowrap;
	opacity: 0;
	transform: translateX(10px);
	transition: opacity 0.3s ease, transform 0.3s ease;
	pointer-events: none;
}

/* Треугольник для bubble (указатель на иконку) */
#jivo_custom_bubble:after{
	content: '';
    position: absolute;
    right: -8px;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-left: 8px solid #ffffff;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
}

/* Класс для показа bubble */
#jivo_custom_bubble.show{
	opacity: 1;
	transform: translateX(0);
}