/**
 * Sales agent widget.
 *
 * Inherits the Uptime theme's tokens when present, and falls back to its own
 * values so the widget still looks right on any other theme.
 */

.ica {
	--ica-ink: var(--up-ink, #0C1A1F);
	--ica-ink-2: var(--up-ink-2, #12252B);
	--ica-hair: var(--up-hair, rgba(255,255,255,.09));
	--ica-hair-2: var(--up-hair-2, rgba(255,255,255,.16));
	--ica-accent: var(--up-accent, #F0A830);
	--ica-ok: var(--up-ok, #4ED8A0);
	--ica-text: var(--up-text-inv, #E9EFEE);
	--ica-soft: var(--up-text-inv-soft, #90A9AF);
	--ica-mono: var(--up-mono, ui-monospace, "IBM Plex Mono", Menlo, monospace);
	--ica-body: var(--up-body, -apple-system, "Segoe UI", Roboto, sans-serif);
	--ica-ease: cubic-bezier(.22,.61,.36,1);

	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 99998;
	font-family: var(--ica-body);
}

/* --- Launcher --------------------------------------------------------- */
.ica__launcher {
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	padding: .8rem 1.15rem;
	background: var(--ica-accent);
	color: var(--ica-ink);
	border: 0;
	border-radius: 100px;
	cursor: pointer;
	font-family: var(--ica-mono);
	font-size: .78rem;
	font-weight: 500;
	letter-spacing: .06em;
	text-transform: uppercase;
	box-shadow: 0 10px 30px rgba(0,0,0,.28);
	transition: transform .18s var(--ica-ease), box-shadow .18s var(--ica-ease);
}
.ica__launcher:hover { transform: translateY(-2px); box-shadow: 0 16px 40px rgba(0,0,0,.34); }
.ica__launcher[hidden] { display: none; }
.ica__launcher-dot {
	width: 7px; height: 7px; border-radius: 50%;
	background: var(--ica-ink); opacity: .55; flex: none;
}

/* --- Panel ------------------------------------------------------------ */
.ica__panel {
	position: absolute;
	right: 0;
	bottom: 0;
	width: min(390px, calc(100vw - 32px));
	height: min(600px, calc(100vh - 100px));
	display: flex;
	flex-direction: column;
	background: var(--ica-ink);
	border: 1px solid var(--ica-hair-2);
	border-radius: 10px;
	box-shadow: 0 30px 80px rgba(0,0,0,.45);
	overflow: hidden;
	opacity: 0;
	transform: translateY(12px) scale(.985);
	pointer-events: none;
	transition: opacity .2s var(--ica-ease), transform .2s var(--ica-ease);
}
.ica__panel.is-open { opacity: 1; transform: none; pointer-events: auto; }

.ica__bar {
	display: flex;
	align-items: center;
	gap: .6rem;
	padding: .85rem 1rem;
	background: rgba(0,0,0,.24);
	border-bottom: 1px solid var(--ica-hair);
	flex: none;
}
.ica__status { width: 7px; height: 7px; border-radius: 50%; background: var(--ica-ok); flex: none; }
.ica__title {
	font-family: var(--ica-mono);
	font-size: .7rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ica-text);
}
.ica__badge {
	font-family: var(--ica-mono);
	font-size: .58rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--ica-soft);
	border: 1px solid var(--ica-hair);
	border-radius: 100px;
	padding: .15rem .45rem;
}
.ica__close {
	margin-left: auto;
	background: none;
	border: 0;
	color: var(--ica-soft);
	cursor: pointer;
	font-size: 1.1rem;
	line-height: 1;
	padding: .25rem .4rem;
	border-radius: 4px;
}
.ica__close:hover { color: var(--ica-text); }

.ica__preview {
	background: var(--ica-accent);
	color: var(--ica-ink);
	font-family: var(--ica-mono);
	font-size: .62rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	text-align: center;
	padding: .35rem;
	flex: none;
}

/* --- Log -------------------------------------------------------------- */
.ica__log {
	flex: 1;
	overflow-y: auto;
	padding: 1rem;
	display: flex;
	flex-direction: column;
	gap: .8rem;
	scrollbar-width: thin;
}
.ica__log::-webkit-scrollbar { width: 8px; }
.ica__log::-webkit-scrollbar-thumb { background: var(--ica-hair-2); border-radius: 4px; }

.ica__msg {
	max-width: 88%;
	padding: .7rem .9rem;
	border-radius: 10px;
	font-size: .93rem;
	line-height: 1.55;
	white-space: pre-wrap;
	overflow-wrap: anywhere;
}
.ica__msg--bot { align-self: flex-start; background: var(--ica-ink-2); color: var(--ica-text); border: 1px solid var(--ica-hair); }
.ica__msg--me  { align-self: flex-end; background: var(--ica-accent); color: var(--ica-ink); }
.ica__msg--sys {
	align-self: stretch;
	max-width: 100%;
	background: none;
	border: 0;
	border-top: 1px solid var(--ica-hair);
	border-bottom: 1px solid var(--ica-hair);
	border-radius: 0;
	padding: .7rem 0;
	color: var(--ica-soft);
	font-size: .78rem;
	line-height: 1.5;
}
.ica__msg--err {
	align-self: stretch;
	max-width: 100%;
	background: rgba(255,107,91,.1);
	border: 1px solid rgba(255,107,91,.3);
	color: #FFB3AA;
	font-size: .85rem;
}

.ica__tool {
	align-self: flex-start;
	font-family: var(--ica-mono);
	font-size: .64rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--ica-soft);
	display: flex;
	align-items: center;
	gap: .45rem;
}
.ica__tool::before {
	content: "";
	width: 5px; height: 5px; border-radius: 50%;
	background: var(--ica-accent);
	animation: ica-pulse 1.1s ease-in-out infinite;
}
@keyframes ica-pulse { 0%,100% { opacity: .3; } 50% { opacity: 1; } }

.ica__typing { display: flex; gap: 4px; align-self: flex-start; padding: .8rem .9rem; }
.ica__typing span {
	width: 6px; height: 6px; border-radius: 50%;
	background: var(--ica-soft);
	animation: ica-bounce 1.2s infinite;
}
.ica__typing span:nth-child(2) { animation-delay: .15s; }
.ica__typing span:nth-child(3) { animation-delay: .3s; }
@keyframes ica-bounce { 0%,60%,100% { transform: translateY(0); opacity: .4; } 30% { transform: translateY(-4px); opacity: 1; } }

/* --- Composer --------------------------------------------------------- */
.ica__form {
	flex: none;
	display: flex;
	gap: .5rem;
	padding: .75rem;
	border-top: 1px solid var(--ica-hair);
	background: rgba(0,0,0,.2);
}
.ica__input {
	flex: 1;
	background: rgba(255,255,255,.05);
	border: 1px solid var(--ica-hair-2);
	border-radius: 8px;
	color: var(--ica-text);
	font-family: inherit;
	font-size: .93rem;
	line-height: 1.4;
	padding: .6rem .75rem;
	resize: none;
	max-height: 110px;
	min-height: 42px;
}
.ica__input::placeholder { color: var(--ica-soft); }
.ica__input:focus { outline: none; border-color: var(--ica-accent); }

.ica__send {
	flex: none;
	width: 42px;
	background: var(--ica-accent);
	color: var(--ica-ink);
	border: 0;
	border-radius: 8px;
	cursor: pointer;
	font-size: 1rem;
	transition: opacity .15s;
}
.ica__send:disabled { opacity: .4; cursor: default; }

.ica__foot {
	flex: none;
	padding: 0 .75rem .6rem;
	background: rgba(0,0,0,.2);
	font-family: var(--ica-mono);
	font-size: .6rem;
	letter-spacing: .06em;
	color: var(--ica-soft);
	text-align: center;
}

/* --- Mobile ----------------------------------------------------------- */
@media (max-width: 520px) {
	.ica { right: 12px; bottom: 12px; left: 12px; }
	.ica__panel {
		position: fixed;
		inset: 8px;
		width: auto;
		height: auto;
		border-radius: 12px;
	}
	.ica__launcher { width: 100%; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
	.ica *, .ica *::before { animation: none !important; transition-duration: .01ms !important; }
}