/* PolisMarket chat widget: floating launcher + panel, wired to the Telegram group inbox. */

#pm-chat-widget {
	--pm-chat-z: 999999;
	--pm-chat-danger: #e6394a;
}

.pm-chat-fab {
	position: fixed;
	right: 22px;
	bottom: 22px;
	width: 60px;
	height: 60px;
	border: none;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, var(--pm-green), var(--pm-green-dark));
	color: var(--pm-white);
	box-shadow: 0 14px 32px rgba(23, 129, 50, .35);
	z-index: var(--pm-chat-z);
	transition: transform .2s ease, box-shadow .2s ease;
}

.pm-chat-fab:hover {
	transform: translateY(-2px);
	box-shadow: 0 18px 38px rgba(23, 129, 50, .42);
}

.pm-chat-fab:focus-visible {
	outline: 2px solid var(--pm-white);
	outline-offset: 3px;
}

.pm-chat-fab::before,
.pm-chat-fab::after {
	content: '';
	position: absolute;
	inset: -7px;
	border-radius: 50%;
	border: 2px solid var(--pm-chat-danger);
	opacity: 0;
	animation: pmChatPulse 2.2s ease-out infinite;
	pointer-events: none;
}

.pm-chat-fab::after {
	animation-delay: 1.1s;
}

.pm-chat-fab.is-open::before,
.pm-chat-fab.is-open::after {
	animation: none;
	opacity: 0;
}

@keyframes pmChatPulse {
	0% { opacity: .55; transform: scale(.92); }
	70% { opacity: 0; transform: scale(1.38); }
	100% { opacity: 0; transform: scale(1.38); }
}

.pm-chat-fab__icon {
	position: absolute;
	display: flex;
	transition: opacity .15s ease, transform .15s ease;
}

.pm-chat-fab__icon svg {
	width: 26px;
	height: 26px;
}

.pm-chat-fab__icon--close {
	opacity: 0;
	transform: scale(.6) rotate(-45deg);
}

.pm-chat-fab.is-open .pm-chat-fab__icon--chat {
	opacity: 0;
	transform: scale(.6) rotate(45deg);
}

.pm-chat-fab.is-open .pm-chat-fab__icon--close {
	opacity: 1;
	transform: none;
}

.pm-chat-fab__badge {
	position: absolute;
	top: -3px;
	right: -3px;
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	border-radius: 999px;
	background: var(--pm-chat-danger);
	color: var(--pm-white);
	font: 700 12px/20px Inter, sans-serif;
	text-align: center;
	box-shadow: 0 0 0 2px var(--pm-white);
}

.pm-chat-fab__badge[hidden] {
	display: none;
}

.pm-chat-teaser {
	position: fixed;
	right: 22px;
	bottom: 94px;
	max-width: 250px;
	background: var(--pm-white);
	border: 1px solid var(--pm-line);
	border-radius: 14px;
	padding: 14px 32px 14px 16px;
	box-shadow: var(--pm-shadow);
	font: 500 14px/1.45 Inter, sans-serif;
	color: var(--pm-navy);
	z-index: var(--pm-chat-z);
	animation: pmChatFadeUp .3s ease;
	cursor: pointer;
}

.pm-chat-teaser[hidden] {
	display: none;
}

.pm-chat-teaser p {
	margin: 0;
}

.pm-chat-teaser__close {
	position: absolute;
	top: 4px;
	right: 6px;
	border: none;
	background: none;
	color: var(--pm-muted);
	font-size: 17px;
	line-height: 1;
	cursor: pointer;
	padding: 6px;
}

@keyframes pmChatFadeUp {
	from { opacity: 0; transform: translateY(10px); }
	to { opacity: 1; transform: none; }
}

.pm-chat-panel {
	position: fixed;
	right: 22px;
	bottom: 94px;
	width: 380px;
	max-width: calc(100vw - 44px);
	height: min(600px, calc(100vh - 150px));
	background: var(--pm-white);
	border-radius: 18px;
	box-shadow: var(--pm-shadow);
	display: flex;
	flex-direction: column;
	overflow: hidden;
	z-index: var(--pm-chat-z);
	animation: pmChatPanelIn .25s ease;
}

.pm-chat-panel[hidden] {
	display: none;
}

@keyframes pmChatPanelIn {
	from { opacity: 0; transform: translateY(18px) scale(.98); }
	to { opacity: 1; transform: none; }
}

.pm-chat-panel__header {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 16px;
	background: linear-gradient(135deg, var(--pm-navy), var(--pm-blue));
	color: var(--pm-white);
	flex-shrink: 0;
}

.pm-chat-panel__avatar {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .16);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.pm-chat-panel__avatar svg {
	width: 22px;
	height: 22px;
}

.pm-chat-panel__title {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}

.pm-chat-panel__title strong {
	font: 700 15px/1.2 Inter, sans-serif;
}

.pm-chat-panel__status {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	opacity: .85;
}

.pm-chat-panel__status i {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--pm-green);
	box-shadow: 0 0 0 2px rgba(255, 255, 255, .35);
	flex-shrink: 0;
}

.pm-chat-panel__close {
	border: none;
	background: rgba(255, 255, 255, .16);
	color: var(--pm-white);
	width: 30px;
	height: 30px;
	border-radius: 50%;
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
	flex-shrink: 0;
}

.pm-chat-panel__body {
	flex: 1;
	overflow-y: auto;
	padding: 16px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	background: var(--pm-soft);
	-webkit-overflow-scrolling: touch;
}

.pm-chat-bubble {
	max-width: 84%;
	padding: 10px 13px;
	border-radius: 14px;
	font: 400 14px/1.45 Inter, sans-serif;
	overflow-wrap: break-word;
	white-space: pre-wrap;
}

.pm-chat-bubble--agent {
	align-self: flex-start;
	background: var(--pm-white);
	border: 1px solid var(--pm-line);
	color: var(--pm-ink);
	border-bottom-left-radius: 4px;
}

.pm-chat-bubble--visitor {
	align-self: flex-end;
	background: linear-gradient(135deg, var(--pm-navy), var(--pm-blue));
	color: var(--pm-white);
	border-bottom-right-radius: 4px;
}

.pm-chat-bubble--visitor.is-pending {
	opacity: .6;
}

.pm-chat-bubble--error {
	border: 1px dashed var(--pm-chat-danger);
}

.pm-chat-bubble__meta {
	display: block;
	margin-top: 4px;
	font-size: 11px;
	opacity: .65;
}

.pm-chat-bubble__retry {
	display: inline-block;
	margin-top: 2px;
	font: 600 12px/1.4 Inter, sans-serif;
	color: #ffd7db;
	cursor: pointer;
	background: none;
	border: none;
	padding: 0;
	text-decoration: underline;
}

.pm-chat-panel__form {
	display: flex;
	align-items: flex-end;
	gap: 8px;
	padding: 12px;
	border-top: 1px solid var(--pm-line);
	background: var(--pm-white);
	flex-shrink: 0;
}

.pm-chat-panel__input {
	flex: 1;
	resize: none;
	max-height: 96px;
	border: 1px solid var(--pm-line);
	border-radius: 12px;
	padding: 10px 12px;
	font: 400 14px/1.4 Inter, sans-serif;
	color: var(--pm-ink);
	background: var(--pm-white);
}

.pm-chat-panel__input:focus {
	outline: 2px solid var(--pm-green);
	outline-offset: 1px;
}

.pm-chat-panel__send {
	width: 42px;
	height: 42px;
	flex-shrink: 0;
	border: none;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--pm-green), var(--pm-green-dark));
	color: var(--pm-white);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

.pm-chat-panel__send svg {
	width: 18px;
	height: 18px;
}

.pm-chat-panel__send:disabled {
	opacity: .5;
	cursor: default;
}

body.pm-modal-open .pm-chat-fab,
body.pm-modal-open .pm-chat-teaser,
body.pm-modal-open .pm-chat-panel {
	display: none;
}

@media (max-width: 680px) {
	.pm-chat-panel {
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		width: auto;
		max-width: none;
		height: auto;
		border-radius: 0;
	}

	.pm-chat-panel__header {
		padding-top: max(16px, env(safe-area-inset-top));
	}

	.pm-chat-panel__form {
		padding-bottom: max(12px, env(safe-area-inset-bottom));
	}

	.pm-chat-fab {
		right: 16px;
		bottom: max(16px, env(safe-area-inset-bottom));
		width: 56px;
		height: 56px;
	}

	.pm-chat-teaser {
		right: 12px;
		left: 12px;
		max-width: none;
		bottom: calc(84px + env(safe-area-inset-bottom));
	}

	body.pm-chat-open {
		overflow: hidden;
		height: 100%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.pm-chat-fab::before,
	.pm-chat-fab::after {
		animation: none;
	}

	.pm-chat-panel,
	.pm-chat-teaser {
		animation: none;
	}
}
