.catcondo-wa-widget {
	--wa-green: #25d366;
	--wa-dark: #075e54;
	position: fixed;
	right: 24px;
	bottom: 24px;
	z-index: 1000;
	transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
}

.catcondo-wa-widget.is-footer-visible {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(12px);
}

.catcondo-wa-toggle {
	width: 58px;
	height: 58px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--wa-green);
	box-shadow: 0 8px 24px rgba(20, 42, 31, .22);
	cursor: pointer;
	transition: transform .2s ease, box-shadow .2s ease;
}

.catcondo-wa-toggle:hover,
.catcondo-wa-toggle:focus-visible {
	transform: translateY(-3px) scale(1.04);
	box-shadow: 0 12px 28px rgba(20, 42, 31, .28);
}

.catcondo-wa-toggle img { width: 100%; height: 100%; object-fit: contain; border-radius: 50%; }

.catcondo-wa-chat {
	position: absolute;
	right: 0;
	bottom: 76px;
	width: 340px;
	overflow: hidden;
	border-radius: 18px;
	background: #fff;
	box-shadow: 0 18px 50px rgba(31, 41, 38, .22);
	transform: translateY(30px) scale(.96);
	transform-origin: bottom right;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .2s ease, transform .45s cubic-bezier(.2, .8, .2, 1), visibility .2s;
}

.catcondo-wa-widget.is-open .catcondo-wa-chat {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateY(0) scale(1);
}

.catcondo-wa-header { display: flex; align-items: center; gap: 11px; padding: 14px 16px; color: #fff; background: var(--wa-dark); }
.catcondo-wa-avatar { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 50%; background: #fff; overflow: hidden; }
.catcondo-wa-avatar img { width: 100%; height: 100%; object-fit: cover; }
.catcondo-wa-heading { min-width: 0; flex: 1; line-height: 1.2; }
.catcondo-wa-heading strong, .catcondo-wa-heading span { display: block; }
.catcondo-wa-heading strong { font-size: .92rem; }
.catcondo-wa-heading span { margin-top: 3px; font-size: .72rem; opacity: .76; }
.catcondo-wa-close { padding: 0 0 3px; border: 0; background: transparent; color: #fff; font-size: 1.65rem; line-height: 1; cursor: pointer; }
.catcondo-wa-body { min-height: 180px; padding: 18px 14px; background-color: #ece5dd; background-image: radial-gradient(rgba(117, 109, 102, .10) 1px, transparent 1px); background-size: 18px 18px; }
.catcondo-wa-message, .catcondo-wa-typing { width: fit-content; max-width: 88%; padding: 10px 13px; border-radius: 4px 15px 15px 15px; background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .10); color: var(--ink); font-size: .88rem; line-height: 1.45; }
.catcondo-wa-message.is-visible { animation: catcondo-wa-message-in .28s ease both; }
.catcondo-wa-typing { display: flex; gap: 4px; padding: 14px 15px; }
.catcondo-wa-typing span { width: 6px; height: 6px; border-radius: 50%; background: #8b8985; animation: catcondo-wa-typing 1s infinite ease-in-out; }
.catcondo-wa-typing span:nth-child(2) { animation-delay: .15s; }
.catcondo-wa-typing span:nth-child(3) { animation-delay: .3s; }
.catcondo-wa-form { display: flex; gap: 8px; padding: 10px; background: #f7f7f7; border-top: 1px solid #e4e4e4; }
.catcondo-wa-input { min-width: 0; flex: 1; padding: 10px 13px; border: 1px solid #ddd; border-radius: 999px; outline: 0; background: #fff; color: var(--ink); }
.catcondo-wa-input:focus { border-color: var(--wa-green); box-shadow: 0 0 0 3px rgba(37, 211, 102, .16); }
.catcondo-wa-send { width: 40px; height: 40px; padding: 0 0 3px 2px; border: 0; border-radius: 50%; background: var(--wa-green); color: #fff; font-size: 1.25rem; cursor: pointer; }
.catcondo-wa-send:hover { background: #1fbd59; }

@keyframes catcondo-wa-typing { 0%, 60%, 100% { transform: translateY(0); opacity: .55; } 30% { transform: translateY(-4px); opacity: 1; } }
@keyframes catcondo-wa-message-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 480px) {
	.catcondo-wa-widget { right: 16px; bottom: 16px; }
	.catcondo-wa-chat { right: 0; bottom: 68px; width: calc(100vw - 32px); }
	.catcondo-wa-toggle { width: 52px; height: 52px; }
}