.grafica-assistente {
	--ga-ink: #07153b;
	--ga-blue: #102c8c;
	--ga-blue-soft: #e9efff;
	--ga-paper: #ffffff;
	--ga-canvas: #f3f5fa;
	--ga-line: #dce1ec;
	--ga-muted: #65708a;
	--ga-orange: #d64d11;
	--ga-cyan: #00a7d7;
	--ga-magenta: #e30065;
	--ga-yellow: #f6cc00;
	position: fixed;
	z-index: 99990;
	right: max( 22px, env( safe-area-inset-right ) );
	bottom: max( 22px, env( safe-area-inset-bottom ) );
	font-family: var( --wp--preset--font-family--texto, Inter, system-ui, -apple-system, sans-serif );
	color: var( --ga-ink );
}

.grafica-assistente *, .grafica-assistente *::before, .grafica-assistente *::after { box-sizing: border-box; }
.grafica-assistente [hidden] { display: none !important; }

.grafica-assistente__convite {
	position: absolute;
	right: 2px;
	bottom: 74px;
	display: grid;
	width: 286px;
	padding: 16px 18px 17px;
	border: 1px solid rgba( 7, 21, 59, .14 );
	border-radius: 14px 14px 3px 14px;
	background: var( --ga-paper );
	box-shadow: 0 16px 45px rgba( 7, 21, 59, .18 );
	animation: ga-invite-in .48s cubic-bezier( .2, .8, .2, 1 ) both;
}

.grafica-assistente__convite::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 4px;
	border-radius: 14px 14px 0 0;
	background: linear-gradient( 90deg, var( --ga-cyan ) 0 25%, var( --ga-magenta ) 25% 50%, var( --ga-yellow ) 50% 75%, var( --ga-ink ) 75% );
}

.grafica-assistente__convite-selo {
	margin-bottom: 7px;
	color: var( --ga-blue );
	font-family: "Arial Narrow", Arial, sans-serif;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .11em;
	text-transform: uppercase;
}

.grafica-assistente__convite strong { font-size: 16px; line-height: 1.25; letter-spacing: -.015em; }
.grafica-assistente__convite > span:last-child { margin-top: 4px; color: var( --ga-muted ); font-size: 12px; line-height: 1.35; }

.grafica-assistente__abrir {
	position: relative;
	display: grid;
	place-items: center;
	width: 62px;
	height: 62px;
	margin-left: auto;
	padding: 0;
	border: 0;
	border-radius: 19px 19px 5px 19px;
	background: var( --ga-blue );
	color: #fff;
	box-shadow: 0 12px 30px rgba( 16, 44, 140, .34 );
	cursor: pointer;
	transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.grafica-assistente__abrir::before {
	content: "";
	position: absolute;
	inset: -5px;
	border: 1px solid rgba( 16, 44, 140, .22 );
	border-radius: 23px 23px 8px 23px;
	pointer-events: none;
}

.grafica-assistente__abrir:hover { transform: translateY( -3px ); background: #1739ad; box-shadow: 0 16px 34px rgba( 16, 44, 140, .4 ); }
.grafica-assistente__abrir:focus-visible,
.grafica-assistente button:focus-visible,
.grafica-assistente a:focus-visible,
.grafica-assistente input:focus-visible { outline: 3px solid var( --ga-orange ); outline-offset: 3px; }

.grafica-assistente__icone {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 3px;
	width: 29px;
	height: 23px;
	border: 2px solid currentColor;
	border-radius: 7px 7px 2px 7px;
}
.grafica-assistente__icone::after { content: ""; position: absolute; right: 3px; bottom: -6px; width: 8px; height: 7px; border-right: 2px solid currentColor; transform: skewY( 38deg ); }
.grafica-assistente__icone i { width: 3px; height: 3px; border-radius: 50%; background: currentColor; }

.grafica-assistente__painel {
	position: absolute;
	right: 0;
	bottom: 78px;
	display: flex;
	flex-direction: column;
	width: min( 420px, calc( 100vw - 44px ) );
	max-height: min( 710px, calc( 100vh - 124px ) );
	overflow: hidden;
	border: 1px solid rgba( 7, 21, 59, .16 );
	border-radius: 18px 18px 6px 18px;
	background: var( --ga-paper );
	box-shadow: 0 28px 75px rgba( 7, 21, 59, .27 ), 0 2px 8px rgba( 7, 21, 59, .08 );
	transform-origin: right bottom;
	animation: ga-panel-in .32s cubic-bezier( .2, .82, .2, 1 ) both;
}

.grafica-assistente__barra-cor { display: grid; grid-template-columns: repeat( 4, 1fr ); flex: 0 0 5px; }
.grafica-assistente__barra-cor i:nth-child( 1 ) { background: var( --ga-cyan ); }
.grafica-assistente__barra-cor i:nth-child( 2 ) { background: var( --ga-magenta ); }
.grafica-assistente__barra-cor i:nth-child( 3 ) { background: var( --ga-yellow ); }
.grafica-assistente__barra-cor i:nth-child( 4 ) { background: var( --ga-ink ); }

.grafica-assistente__cabecalho {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 84px;
	padding: 15px 17px;
	overflow: hidden;
	background: var( --ga-ink );
	color: #fff;
}
.grafica-assistente__cabecalho::after {
	content: "";
	position: absolute;
	right: 46px;
	top: -47px;
	width: 160px;
	height: 160px;
	border-radius: 50%;
	background-image: radial-gradient( rgba( 255, 255, 255, .13 ) 1.2px, transparent 1.2px );
	background-size: 7px 7px;
	mask-image: radial-gradient( circle, #000, transparent 68% );
	pointer-events: none;
}

.grafica-assistente__avatar {
	position: relative;
	z-index: 1;
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	flex: 0 0 46px;
	border: 1px solid rgba( 255, 255, 255, .35 );
	border-radius: 50%;
	background: #fff;
}
.grafica-assistente__avatar::before, .grafica-assistente__avatar::after { content: ""; position: absolute; border-radius: 50%; border: 2px solid; }
.grafica-assistente__avatar::before { inset: 5px; border-color: var( --ga-cyan ) var( --ga-magenta ) var( --ga-yellow ) var( --ga-blue ); transform: rotate( 22deg ); }
.grafica-assistente__avatar::after { inset: 10px; border-color: var( --ga-magenta ) var( --ga-yellow ) var( --ga-blue ) var( --ga-cyan ); transform: rotate( -17deg ); }
.grafica-assistente__avatar span { z-index: 1; color: var( --ga-ink ); font-size: 13px; font-weight: 900; }

.grafica-assistente__identidade { position: relative; z-index: 1; min-width: 0; }
.grafica-assistente__sobretitulo { display: block; margin-bottom: 1px; color: #9db0f7; font-family: "Arial Narrow", Arial, sans-serif; font-size: 9px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.grafica-assistente__cabecalho h2, .grafica-assistente__cabecalho p { margin: 0; color: inherit; }
.grafica-assistente__cabecalho h2 { font-size: 20px; font-weight: 800; line-height: 1; letter-spacing: -.025em; }
.grafica-assistente__cabecalho p { display: flex; align-items: center; gap: 6px; margin-top: 6px; color: #cbd3e9; font-size: 11px; }
.grafica-assistente__cabecalho p i { width: 7px; height: 7px; border-radius: 50%; background: #48cf7b; box-shadow: 0 0 0 3px rgba( 72, 207, 123, .14 ); }

.grafica-assistente__fechar {
	position: relative;
	z-index: 2;
	align-self: center;
	width: 38px;
	height: 38px;
	margin-left: auto;
	padding: 0;
	border: 1px solid rgba( 255, 255, 255, .18 );
	border-radius: 50%;
	background: rgba( 255, 255, 255, .07 );
	color: #fff;
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	transition: background .15s ease, transform .15s ease;
}
.grafica-assistente__fechar:hover { background: rgba( 255, 255, 255, .16 ); transform: rotate( 5deg ); }

.grafica-assistente__etapas { display: grid; grid-template-columns: repeat( 3, 1fr ); gap: 4px; padding: 0 17px; background: var( --ga-ink ); }
.grafica-assistente__etapas i { height: 3px; background: rgba( 255, 255, 255, .17 ); transition: background .3s ease; }
.grafica-assistente[data-assistant-depth="0"] .grafica-assistente__etapas i:first-child,
.grafica-assistente[data-assistant-depth="1"] .grafica-assistente__etapas i:nth-child( -n+2 ),
.grafica-assistente[data-assistant-depth="2"] .grafica-assistente__etapas i,
.grafica-assistente[data-assistant-depth="3"] .grafica-assistente__etapas i { background: var( --ga-cyan ); }

.grafica-assistente__aviso {
	display: flex;
	align-items: center;
	gap: 7px;
	padding: 10px 17px;
	border-bottom: 1px solid var( --ga-line );
	background: #f7f9ff;
	color: #4f5c79;
	font-size: 10.5px;
	line-height: 1.3;
}
.grafica-assistente__aviso span { display: grid; place-items: center; width: 17px; height: 17px; flex: 0 0 17px; border-radius: 50%; background: #dff5e7; color: #14743a; font-size: 10px; font-weight: 900; }

.grafica-assistente__mensagens {
	min-height: 110px;
	flex: 1 1 145px;
	padding: 18px 17px 5px;
	overflow-y: auto;
	background-color: var( --ga-canvas );
	background-image: linear-gradient( rgba( 7, 21, 59, .025 ) 1px, transparent 1px ), linear-gradient( 90deg, rgba( 7, 21, 59, .025 ) 1px, transparent 1px );
	background-size: 20px 20px;
	scrollbar-color: #aeb7ca transparent;
	scrollbar-width: thin;
}

.grafica-assistente__mensagem {
	position: relative;
	width: fit-content;
	max-width: 90%;
	margin: 0 0 13px;
	padding: 12px 14px;
	border: 1px solid var( --ga-line );
	border-radius: 4px 13px 13px 13px;
	background: var( --ga-paper );
	box-shadow: 0 4px 14px rgba( 7, 21, 59, .06 );
	font-size: 13px;
	line-height: 1.48;
	animation: ga-message-in .25s ease both;
}
.grafica-assistente__mensagem::before { content: "LIA / RESPOSTA"; display: block; margin-bottom: 5px; color: var( --ga-blue ); font-family: "Arial Narrow", Arial, sans-serif; font-size: 8px; font-weight: 900; letter-spacing: .12em; }
.grafica-assistente__mensagem p { margin: 0; color: var( --ga-ink ); }
.grafica-assistente__mensagem--user { margin-left: auto; border-color: #c7d4ff; border-radius: 13px 4px 13px 13px; background: var( --ga-blue ); box-shadow: 0 5px 14px rgba( 16, 44, 140, .16 ); }
.grafica-assistente__mensagem--user::before { content: "VOCÊ"; color: #aebdf6; }
.grafica-assistente__mensagem--user p { color: #fff; }

.grafica-assistente__resultado {
	display: block;
	margin-top: 10px;
	padding: 10px 28px 1px 0;
	border-top: 1px solid var( --ga-line );
	background: linear-gradient( 90deg, var( --ga-cyan ) 0 33%, var( --ga-magenta ) 33% 66%, var( --ga-yellow ) 66% ) left top / 54px 2px no-repeat;
	color: var( --ga-blue );
	text-decoration: none;
}
.grafica-assistente__resultado::after { content: "↗"; position: absolute; right: 13px; color: var( --ga-blue ); font-size: 15px; }
.grafica-assistente__resultado strong, .grafica-assistente__resultado span { display: block; }
.grafica-assistente__resultado strong { font-size: 12px; line-height: 1.3; }
.grafica-assistente__resultado span { margin-top: 3px; color: var( --ga-muted ); font-size: 10px; line-height: 1.35; }
.grafica-assistente__resultado:hover strong { text-decoration: underline; }

.grafica-assistente__digitando {
	align-items: center;
	gap: 4px;
	width: fit-content;
	margin: 8px 17px 13px;
	padding: 9px 12px;
	border: 1px solid var( --ga-line );
	border-radius: 4px 12px 12px 12px;
	background: #fff;
	box-shadow: 0 3px 10px rgba( 7, 21, 59, .06 );
}
.grafica-assistente__digitando:not([hidden]) { display: flex; }
.grafica-assistente__digitando b { margin-right: 5px; color: var( --ga-muted ); font-size: 9px; font-weight: 700; letter-spacing: .03em; }
.grafica-assistente__digitando > span[aria-hidden="true"] { width: 5px; height: 5px; border-radius: 50%; background: var( --ga-blue ); animation: ga-typing 1.15s infinite ease-in-out; }
.grafica-assistente__digitando > span[aria-hidden="true"]:nth-of-type( 3 ) { animation-delay: .14s; }
.grafica-assistente__digitando > span[aria-hidden="true"]:nth-of-type( 4 ) { animation-delay: .28s; }

.grafica-assistente__pergunta {
	position: relative;
	flex: 0 0 auto;
	padding: 12px 17px 11px;
	border-top: 1px solid var( --ga-line );
	border-bottom: 1px solid var( --ga-line );
	background: #fff;
}
.grafica-assistente__pergunta::after {
	content: "";
	position: absolute;
	left: 17px;
	bottom: -1px;
	width: 72px;
	height: 2px;
	background: linear-gradient( 90deg, var( --ga-cyan ) 0 25%, var( --ga-magenta ) 25% 50%, var( --ga-yellow ) 50% 75%, var( --ga-ink ) 75% );
}
.grafica-assistente__pergunta > label {
	display: block;
	margin-bottom: 7px;
	color: var( --ga-ink );
	font-family: "Arial Narrow", Arial, sans-serif;
	font-size: 9px;
	font-weight: 900;
	letter-spacing: .11em;
	text-transform: uppercase;
}
.grafica-assistente__pergunta-campo {
	display: grid;
	grid-template-columns: 28px minmax( 0, 1fr ) auto;
	align-items: center;
	min-height: 42px;
	overflow: hidden;
	border: 1px solid #b9c4df;
	border-radius: 9px;
	background: #f9faff;
	box-shadow: inset 0 1px 2px rgba( 7, 21, 59, .035 );
}
.grafica-assistente__pergunta-campo > span {
	display: grid;
	place-items: center;
	width: 20px;
	height: 20px;
	margin-left: 7px;
	border: 1px solid var( --ga-cyan );
	border-radius: 50%;
	color: var( --ga-blue );
	font-family: Georgia, serif;
	font-size: 12px;
	font-weight: 800;
}
.grafica-assistente__pergunta input {
	width: 100%;
	min-width: 0;
	height: 40px;
	padding: 0 8px;
	border: 0;
	background: transparent;
	color: var( --ga-ink );
	font: inherit;
	font-size: 11.5px;
}
.grafica-assistente__pergunta input::placeholder { color: #818ba2; opacity: 1; }
.grafica-assistente__pergunta input:focus { outline: 0; }
.grafica-assistente__pergunta-campo:focus-within { border-color: var( --ga-blue ); box-shadow: 0 0 0 3px rgba( 16, 44, 140, .1 ); }
.grafica-assistente__pergunta button {
	align-self: stretch;
	min-width: 78px;
	padding: 0 11px;
	border: 0;
	background: var( --ga-blue );
	color: #fff;
	font: inherit;
	font-size: 10.5px;
	font-weight: 800;
	cursor: pointer;
}
.grafica-assistente__pergunta button:hover { background: #1739ad; }
.grafica-assistente__pergunta input:disabled,
.grafica-assistente__pergunta button:disabled { opacity: .55; cursor: wait; }
.grafica-assistente__pergunta small { display: block; margin-top: 6px; color: var( --ga-muted ); font-size: 8.5px; line-height: 1.3; }

.grafica-assistente__escolhas { display: flex; flex: 0 1 auto; flex-direction: column; min-height: 0; overflow: hidden; padding: 13px 17px 4px; background: #fff; }
.grafica-assistente__escolhas > p { margin: 0 0 9px; color: var( --ga-muted ); font-family: "Arial Narrow", Arial, sans-serif; font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.grafica-assistente__opcoes { display: grid; flex: 1 1 auto; grid-template-columns: repeat( 2, minmax( 0, 1fr ) ); gap: 8px; min-height: 0; max-height: 220px; overflow-y: auto; }
.grafica-assistente__opcoes:empty { display: none; }
.grafica-assistente__opcoes button {
	position: relative;
	min-height: 52px;
	padding: 10px 30px 10px 13px;
	overflow: hidden;
	border: 1px solid var( --ga-line );
	border-radius: 8px;
	background: #fff;
	color: var( --ga-ink );
	font: inherit;
	font-size: 11.5px;
	font-weight: 750;
	line-height: 1.25;
	text-align: left;
	cursor: pointer;
	transition: border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease;
}
.grafica-assistente__opcoes button::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var( --ga-cyan ); }
.grafica-assistente__opcoes button:nth-child( 4n+2 )::before { background: var( --ga-magenta ); }
.grafica-assistente__opcoes button:nth-child( 4n+3 )::before { background: var( --ga-yellow ); }
.grafica-assistente__opcoes button:nth-child( 4n+4 )::before { background: var( --ga-blue ); }
.grafica-assistente__opcoes button::after { content: "→"; position: absolute; right: 12px; top: 50%; color: var( --ga-blue ); font-size: 14px; transform: translateY( -50% ); transition: transform .18s ease; }
.grafica-assistente__opcoes button:hover { border-color: #aab8df; background: #f7f9ff; box-shadow: 0 5px 13px rgba( 7, 21, 59, .08 ); transform: translateY( -1px ); }
.grafica-assistente__opcoes button:hover::after { transform: translate( 2px, -50% ); }
.grafica-assistente__opcoes button:disabled { opacity: .5; cursor: wait; }

.grafica-assistente__navegacao { display: flex; flex: 0 0 auto; justify-content: space-between; gap: 8px; padding: 6px 17px 10px; border-bottom: 1px solid var( --ga-line ); background: #fff; }
.grafica-assistente__navegacao button { min-height: 30px; padding: 3px 0; border: 0; background: transparent; color: var( --ga-blue ); font: inherit; font-size: 10.5px; font-weight: 700; cursor: pointer; }
.grafica-assistente__navegacao button:first-child::before { content: "← "; }
.grafica-assistente__navegacao button:last-child::after { content: " ↻"; }
.grafica-assistente__navegacao button:hover { text-decoration: underline; }
.grafica-assistente__navegacao button:disabled { visibility: hidden; }

.grafica-assistente__whatsapp {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 10px;
	margin: 12px 17px 6px;
	padding: 11px 13px;
	border-radius: 8px;
	background: #147d3f;
	color: #fff;
	text-align: left;
	text-decoration: none;
	transition: background .18s ease, transform .18s ease;
}
.grafica-assistente__whatsapp:hover { background: #0e6c35; transform: translateY( -1px ); }
.grafica-assistente__whatsapp > span:first-child { display: grid; place-items: center; width: 28px; height: 28px; flex: 0 0 28px; border: 1px solid rgba( 255, 255, 255, .35 ); border-radius: 50%; font-size: 14px; }
.grafica-assistente__whatsapp > span:last-child, .grafica-assistente__whatsapp strong, .grafica-assistente__whatsapp small { display: block; }
.grafica-assistente__whatsapp strong { font-size: 12px; line-height: 1.2; }
.grafica-assistente__whatsapp small { margin-top: 2px; color: rgba( 255, 255, 255, .76 ); font-size: 9px; }
.grafica-assistente__whatsapp.is-highlighted { animation: ga-whatsapp 1.05s ease-in-out 2; box-shadow: 0 0 0 4px rgba( 20, 125, 63, .13 ); }
.grafica-assistente__privacidade { flex: 0 0 auto; margin: 0 17px 11px; color: #8690a5; font-size: 8.5px; line-height: 1.35; text-align: center; }

@keyframes ga-panel-in { from { opacity: 0; transform: translateY( 12px ) scale( .96 ); } to { opacity: 1; transform: none; } }
@keyframes ga-invite-in { from { opacity: 0; transform: translateY( 8px ); } to { opacity: 1; transform: none; } }
@keyframes ga-message-in { from { opacity: 0; transform: translateY( 5px ); } to { opacity: 1; transform: none; } }
@keyframes ga-whatsapp { 50% { transform: scale( 1.015 ); } }
@keyframes ga-typing { 0%, 60%, 100% { transform: translateY( 0 ); opacity: .35; } 30% { transform: translateY( -3px ); opacity: 1; } }

@media ( max-width: 480px ) {
	.grafica-assistente { right: 12px; bottom: 12px; }
	/* O botão continua disponível; o convite não cobre campos em telas estreitas. */
	.grafica-assistente__convite { display: none; }
	.grafica-assistente__painel { position: fixed; inset: 8px 8px 82px; width: auto; max-height: none; border-radius: 15px 15px 5px 15px; }
	.grafica-assistente__mensagens { flex: 1 1 auto; }
	.grafica-assistente__opcoes { max-height: 190px; }
	.grafica-assistente__cabecalho { min-height: 76px; }
	.grafica-assistente__pergunta { padding-top: 10px; padding-bottom: 9px; }
}

@media ( max-width: 350px ) {
	.grafica-assistente__opcoes { grid-template-columns: 1fr; }
}

@media ( max-height: 760px ) and ( min-width: 481px ) {
	.grafica-assistente__cabecalho { min-height: 72px; padding-top: 10px; padding-bottom: 10px; }
	.grafica-assistente__aviso { padding-top: 7px; padding-bottom: 7px; }
	.grafica-assistente__mensagens { min-height: 78px; flex-basis: 90px; padding-top: 12px; }
	.grafica-assistente__pergunta { padding-top: 8px; padding-bottom: 8px; }
	.grafica-assistente__pergunta > label { margin-bottom: 5px; }
	.grafica-assistente__pergunta small { display: none; }
	.grafica-assistente__escolhas { padding-top: 9px; }
	.grafica-assistente__opcoes { max-height: 150px; }
	.grafica-assistente__opcoes button { min-height: 44px; }
	.grafica-assistente__navegacao { padding-top: 3px; padding-bottom: 5px; }
	.grafica-assistente__whatsapp { margin-top: 8px; padding-top: 8px; padding-bottom: 8px; }
	.grafica-assistente__privacidade { margin-bottom: 7px; }
}

@media ( prefers-reduced-motion: reduce ) {
	.grafica-assistente *, .grafica-assistente *::before, .grafica-assistente *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
