/* A1 Tools — Web Chat (visitor side).
 *
 * Two surfaces:
 *   - `.a1tools-web-chat` placement(s) — the trigger button(s).
 *   - `.a1tools-web-chat-window` — the single shared chat window
 *     (rendered once per page by the JS module on first open).
 *
 * Variables are scoped to keep theme CSS from accidentally overriding
 * the chat. Per-Elementor-instance overrides live on the
 * `[selectors]` declarations in the widget controls.
 */

/* ──────────────── Trigger button ──────────────── */
.a1tools-web-chat {
	box-sizing: border-box;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.a1tools-web-chat--floating {
	position: fixed;
	z-index: 999990;
}
.a1tools-web-chat--corner-br { bottom: 20px; right: 20px; }
.a1tools-web-chat--corner-bl { bottom: 20px; left: 20px; }
.a1tools-web-chat--corner-tr { top: 20px; right: 20px; }
.a1tools-web-chat--corner-tl { top: 20px; left: 20px; }

.a1tools-web-chat--inline {
	display: inline-block;
}

.a1tools-web-chat__button {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	border: 0;
	cursor: pointer;
	font-weight: 600;
	line-height: 1.2;
	transition: background-color 160ms ease, color 160ms ease, transform 80ms ease;
}
.a1tools-web-chat__button:active { transform: scale(0.97); }
.a1tools-web-chat__icon { flex: 0 0 auto; }
.a1tools-web-chat__button-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 18px;
	height: 18px;
	padding: 0 6px;
	border-radius: 9px;
	background: #dc2626;
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
}
.a1tools-web-chat__button-badge[hidden] { display: none; }

/* ──────────────── Window ──────────────── */
.a1tools-web-chat-window {
	position: fixed;
	bottom: 90px;
	right: 20px;
	width: 380px;
	max-width: calc(100vw - 24px);
	height: 580px;
	max-height: calc(100vh - 120px);
	display: none;
	flex-direction: column;
	background: #fff;
	border-radius: 14px;
	box-shadow: 0 20px 50px rgba(0,0,0,0.20), 0 8px 18px rgba(0,0,0,0.12);
	overflow: hidden;
	z-index: 999991;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	color: #111;
}
.a1tools-web-chat-window--open { display: flex; }

@media (max-width: 480px) {
	.a1tools-web-chat-window {
		bottom: 0;
		right: 0;
		left: 0;
		width: 100%;
		max-width: 100%;
		height: 100%;
		max-height: 100%;
		border-radius: 0;
	}
}

.a1tools-web-chat-window__header {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 16px;
	background: #f49320;
	color: #fff;
}
.a1tools-web-chat-window__header-text { flex: 1 1 auto; min-width: 0; }
.a1tools-web-chat-window__title {
	font-size: 15px;
	font-weight: 700;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.a1tools-web-chat-window__subtitle {
	font-size: 12px;
	opacity: 0.85;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.a1tools-web-chat-window__close {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border: 0;
	background: rgba(255,255,255,0.12);
	color: inherit;
	border-radius: 50%;
	cursor: pointer;
	transition: background-color 120ms ease;
}
.a1tools-web-chat-window__close:hover { background: rgba(255,255,255,0.24); }

.a1tools-web-chat-window__body {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	padding: 14px;
	background: #fafafa;
}

.a1tools-web-chat-window__attended {
	position: sticky;
	top: -14px;
	margin: -14px -14px 12px;
	padding: 8px 14px;
	background: #ecfdf5;
	color: #047857;
	font-size: 12px;
	font-weight: 600;
	border-bottom: 1px solid #d1fae5;
}

/* Pre-chat form */
.a1tools-web-chat-window__prechat {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.a1tools-web-chat-window__prechat-intro {
	margin: 0;
	font-size: 13px;
	color: #4b5563;
	line-height: 1.4;
}
.a1tools-web-chat-window__prechat label {
	display: flex;
	flex-direction: column;
	gap: 4px;
	font-size: 12px;
	font-weight: 600;
	color: #374151;
}
.a1tools-web-chat-window__prechat input {
	padding: 10px 12px;
	border: 1px solid #e5e7eb;
	background: #fff;
	border-radius: 6px;
	font: inherit;
	color: #111;
}
.a1tools-web-chat-window__prechat input:focus {
	outline: none;
	border-color: #f49320;
	box-shadow: 0 0 0 3px rgba(244,147,32,0.18);
}
.a1tools-web-chat-window__prechat-submit {
	margin-top: 4px;
	padding: 10px 14px;
	border: 0;
	background: #f49320;
	color: #fff;
	border-radius: 6px;
	cursor: pointer;
	font-weight: 700;
	transition: background-color 140ms ease;
}
.a1tools-web-chat-window__prechat-submit:hover { background: #d67d10; }

/* Thread */
.a1tools-web-chat-window__messages {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.a1tools-web-chat-window__msg {
	display: flex;
	flex-direction: column;
	max-width: 85%;
}
.a1tools-web-chat-window__msg--visitor {
	align-self: flex-end;
	align-items: flex-end;
}
.a1tools-web-chat-window__msg--dispatcher,
.a1tools-web-chat-window__msg--system {
	align-self: flex-start;
	align-items: flex-start;
}
.a1tools-web-chat-window__msg--system { max-width: 100%; align-self: stretch; align-items: center; }
.a1tools-web-chat-window__bubble {
	padding: 8px 12px;
	border-radius: 14px;
	font-size: 14px;
	line-height: 1.35;
	white-space: pre-wrap;
	word-wrap: break-word;
}
.a1tools-web-chat-window__msg--visitor .a1tools-web-chat-window__bubble {
	background: #f49320;
	color: #fff;
	border-bottom-right-radius: 4px;
}
.a1tools-web-chat-window__msg--dispatcher .a1tools-web-chat-window__bubble {
	background: #eef2ff;
	color: #111;
	border-bottom-left-radius: 4px;
}
.a1tools-web-chat-window__msg--system .a1tools-web-chat-window__bubble {
	background: transparent;
	color: #6b7280;
	font-size: 12px;
	font-style: italic;
	padding: 4px 12px;
}
.a1tools-web-chat-window__bubble-img {
	display: block;
	max-width: 220px;
	max-height: 220px;
	border-radius: 8px;
	margin-bottom: 4px;
}
.a1tools-web-chat-window__meta {
	font-size: 10px;
	color: #9ca3af;
	margin-top: 2px;
	padding: 0 4px;
}
.a1tools-web-chat-window__msg--visitor .a1tools-web-chat-window__meta { text-align: right; }

/* Typing indicator */
.a1tools-web-chat-window__typing {
	display: flex;
	gap: 4px;
	padding: 8px 12px;
	background: #eef2ff;
	border-radius: 14px;
	width: fit-content;
	margin-top: 4px;
}
.a1tools-web-chat-window__typing-dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #6366f1;
	animation: a1tools-web-chat-typing-bounce 1.2s infinite ease-in-out;
}
.a1tools-web-chat-window__typing-dot:nth-child(2) { animation-delay: 150ms; }
.a1tools-web-chat-window__typing-dot:nth-child(3) { animation-delay: 300ms; }
@keyframes a1tools-web-chat-typing-bounce {
	0%, 80%, 100% { transform: scale(0.6); opacity: 0.4; }
	40%           { transform: scale(1.0); opacity: 1.0; }
}

/* Resolved state */
.a1tools-web-chat-window__resolved {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 24px 16px;
	gap: 12px;
	color: #6b7280;
	font-size: 13px;
	text-align: center;
}
.a1tools-web-chat-window__restart {
	padding: 8px 14px;
	border: 1px solid #f49320;
	color: #f49320;
	background: #fff;
	border-radius: 6px;
	cursor: pointer;
	font-weight: 700;
}
.a1tools-web-chat-window__restart:hover { background: #fff7ed; }

/* Composer */
.a1tools-web-chat-window__composer {
	flex: 0 0 auto;
	display: flex;
	align-items: flex-end;
	gap: 6px;
	padding: 10px;
	background: #fff;
	border-top: 1px solid #e5e7eb;
}
.a1tools-web-chat-window__composer textarea {
	flex: 1 1 auto;
	min-height: 38px;
	max-height: 160px;
	resize: none;
	border: 1px solid #e5e7eb;
	border-radius: 18px;
	padding: 8px 14px;
	font: inherit;
	color: #111;
	background: #f9fafb;
	outline: none;
}
.a1tools-web-chat-window__composer textarea:focus {
	border-color: #f49320;
	background: #fff;
	box-shadow: 0 0 0 3px rgba(244,147,32,0.18);
}
.a1tools-web-chat-window__attach,
.a1tools-web-chat-window__send {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: #6b7280;
	cursor: pointer;
	transition: background-color 120ms ease, color 120ms ease;
}
.a1tools-web-chat-window__attach:hover {
	background: #f3f4f6;
	color: #111;
}
.a1tools-web-chat-window__send {
	background: #f49320;
	color: #fff;
}
.a1tools-web-chat-window__send:hover { background: #d67d10; }

.a1tools-web-chat-window__attachment-preview {
	position: absolute;
	bottom: 70px;
	left: 14px;
	right: 14px;
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	padding: 6px 8px;
	display: flex;
	align-items: center;
	gap: 8px;
	box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}
.a1tools-web-chat-window__attachment-preview img {
	max-width: 60px;
	max-height: 60px;
	border-radius: 4px;
}
.a1tools-web-chat-window__attachment-preview button {
	margin-left: auto;
	width: 24px;
	height: 24px;
	border: 0;
	background: #f3f4f6;
	border-radius: 50%;
	cursor: pointer;
	font-size: 18px;
	line-height: 1;
	color: #6b7280;
}
.a1tools-web-chat-window__attachment-preview button:hover { background: #e5e7eb; color: #111; }