/* ===== Agência Loggo — Chat de Atendimento ===== */
.alc-chat {
	--alc-red: #C1121C;
	--alc-red-light: #E6402F;
	--alc-red-dark: #6E0B0E;
	--alc-red-grad: linear-gradient(135deg, #E6402F 0%, #C1121C 45%, #7A0C10 100%);
	--alc-bg: #f4f1f1;
	--alc-bot-bubble: #ffffff;
	--alc-user-bubble: var(--alc-red-grad);
	--alc-text: #2b2b2b;
	--alc-muted: #8a8a8a;
	--alc-shadow: 0 12px 40px rgba(110, 11, 14, .22);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	box-sizing: border-box;
}
.alc-chat *, .alc-chat *::before, .alc-chat *::after { box-sizing: border-box; }

/* ---- Launcher flutuante ---- */
.alc-float { position: fixed; right: 22px; bottom: 22px; z-index: 99999; }
.alc-launcher {
	width: 62px; height: 62px; border-radius: 50%; border: none; cursor: pointer;
	background: var(--alc-red-grad); box-shadow: var(--alc-shadow);
	display: flex; align-items: center; justify-content: center; position: relative;
	transition: transform .2s ease;
}
.alc-launcher:hover { transform: scale(1.06); }
.alc-launcher-close { display: none; position: absolute; }
.alc-chat.alc-open .alc-launcher-icon { display: none; }
.alc-chat.alc-open .alc-launcher-close { display: block; }

/* ---- Painel ---- */
.alc-panel {
	width: 380px; max-width: calc(100vw - 32px); height: 560px; max-height: calc(100vh - 120px);
	background: var(--alc-bg); border-radius: 18px; overflow: hidden;
	display: flex; flex-direction: column; box-shadow: var(--alc-shadow);
	border: 1px solid rgba(0,0,0,.05);
}
.alc-float .alc-panel {
	position: absolute; right: 0; bottom: 78px;
	transform-origin: bottom right; transform: scale(.4); opacity: 0; pointer-events: none;
	transition: transform .22s cubic-bezier(.2,.8,.2,1), opacity .18s ease;
}
.alc-float.alc-open .alc-panel { transform: scale(1); opacity: 1; pointer-events: auto; }
.alc-inline .alc-panel { height: 600px; max-width: 100%; margin: 0 auto; }

/* ---- Header ---- */
.alc-header {
	background: var(--alc-red-grad); color: #fff; padding: 14px 16px;
	display: flex; align-items: center; gap: 12px; position: relative;
}
.alc-avatar { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; border: 2px solid rgba(255,255,255,.7); background:#fff; }
.alc-header-txt { display: flex; flex-direction: column; line-height: 1.2; }
.alc-header-txt strong { font-size: 15px; }
.alc-header-txt span { font-size: 12px; opacity: .9; display: flex; align-items: center; gap: 6px; }
.alc-header-txt span::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #46e06e; box-shadow: 0 0 0 rgba(70,224,110,.6); animation: alc-pulse 2s infinite; }
@keyframes alc-pulse { 0%{box-shadow:0 0 0 0 rgba(70,224,110,.5);} 70%{box-shadow:0 0 0 7px rgba(70,224,110,0);} 100%{box-shadow:0 0 0 0 rgba(70,224,110,0);} }
.alc-min { margin-left: auto; background: transparent; border: none; cursor: pointer; padding: 4px; display: flex; }

/* ---- Mensagens ---- */
.alc-messages {
	flex: 1; overflow-y: auto; padding: 18px 14px; display: flex; flex-direction: column; gap: 12px;
	background:
		radial-gradient(circle at 20% 10%, rgba(193,18,28,.05), transparent 40%),
		var(--alc-bg);
	scrollbar-width: thin;
}
.alc-messages::-webkit-scrollbar { width: 6px; }
.alc-messages::-webkit-scrollbar-thumb { background: rgba(0,0,0,.15); border-radius: 3px; }
.alc-msg { display: flex; max-width: 82%; }
.alc-msg.alc-bot { align-self: flex-start; }
.alc-msg.alc-user { align-self: flex-end; }
.alc-bubble {
	padding: 10px 14px; border-radius: 16px; font-size: 14px; line-height: 1.45; color: var(--alc-text);
	background: var(--alc-bot-bubble); box-shadow: 0 1px 2px rgba(0,0,0,.08); word-wrap: break-word; white-space: pre-wrap;
}
.alc-msg.alc-bot .alc-bubble { border-bottom-left-radius: 4px; }
.alc-msg.alc-user .alc-bubble { background: var(--alc-user-bubble); color: #fff; border-bottom-right-radius: 4px; box-shadow: 0 2px 8px rgba(193,18,28,.35); }
.alc-bubble img { max-width: 100%; border-radius: 10px; display: block; }
.alc-bubble .alc-audio-tag { font-size: 12px; opacity: .85; display: flex; align-items: center; gap: 6px; }

/* Digitando... */
.alc-typing .alc-bubble { display: inline-flex; gap: 4px; padding: 14px; }
.alc-typing .alc-bubble span { width: 7px; height: 7px; border-radius: 50%; background: var(--alc-red); opacity: .5; animation: alc-bounce 1.2s infinite; }
.alc-typing .alc-bubble span:nth-child(2){ animation-delay: .2s; }
.alc-typing .alc-bubble span:nth-child(3){ animation-delay: .4s; }
@keyframes alc-bounce { 0%,60%,100%{ transform: translateY(0); opacity:.4; } 30%{ transform: translateY(-5px); opacity:1; } }

/* ---- Preview de anexo ---- */
.alc-preview { padding: 8px 14px; background: #fff; border-top: 1px solid #eee; display: flex; align-items: center; gap: 10px; font-size: 13px; }
.alc-preview img { width: 40px; height: 40px; border-radius: 8px; object-fit: cover; }
.alc-preview .alc-remove { margin-left: auto; background: none; border: none; color: var(--alc-red); cursor: pointer; font-size: 18px; }

/* ---- Input ---- */
.alc-input { display: flex; align-items: flex-end; gap: 6px; padding: 10px; background: #fff; border-top: 1px solid #ececec; }
.alc-attach { display: flex; gap: 2px; }
.alc-icon-btn { width: 38px; height: 38px; border-radius: 50%; border: none; background: transparent; color: var(--alc-red); cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .15s; }
.alc-icon-btn:hover { background: rgba(193,18,28,.08); }
.alc-icon-btn.alc-recording { background: var(--alc-red); color: #fff; animation: alc-rec 1s infinite; }
@keyframes alc-rec { 50% { opacity: .55; } }
.alc-input textarea {
	flex: 1; resize: none; border: none; outline: none; font-size: 14px; font-family: inherit;
	max-height: 96px; padding: 9px 4px; color: var(--alc-text); background: transparent; line-height: 1.4;
}
.alc-send { width: 42px; height: 42px; border-radius: 50%; border: none; cursor: pointer; background: var(--alc-red-grad); display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: transform .15s; }
.alc-send:hover { transform: scale(1.08); }
.alc-send:disabled { opacity: .5; cursor: default; transform: none; }

.alc-footer { text-align: center; font-size: 11px; color: var(--alc-muted); padding: 6px; background: #fff; }
.alc-footer strong { color: var(--alc-red); }

/* ---- Responsivo ---- */
@media (max-width: 480px) {
	.alc-float .alc-panel { width: calc(100vw - 20px); height: calc(100vh - 100px); bottom: 76px; }
	.alc-float { right: 12px; bottom: 12px; }
}