/* AVM Estética — validador (página /avaliacao/) */
:root {
	--nude: #E8D5C4;
	--cafe: #6B4F3F;
	--cafe-hover: #563E31;
	--off: #FAF7F3;
	--escuro: #3F2D23;
	--borda: #EADCCD;
	--verde: #2E9E5B;
	--serif: 'Cormorant Garamond', Georgia, serif;
	--sans: 'Jost', system-ui, -apple-system, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { height: 100%; }
body.vd-body {
	margin: 0;
	background: var(--off);
	color: var(--escuro);
	font-family: var(--sans);
	font-weight: 400;
	line-height: 1.5;
	-webkit-text-size-adjust: 100%;
	overscroll-behavior: none;
}
:focus-visible { outline: 2px solid var(--cafe); outline-offset: 2px; }

.vd {
	height: 100vh;
	height: 100dvh;
	display: flex;
	flex-direction: column;
	background: var(--off);
	padding-left: env(safe-area-inset-left);
	padding-right: env(safe-area-inset-right);
}
.admin-bar .vd { height: calc(100dvh - 32px); }
@media (max-width: 782px) { .admin-bar .vd { height: calc(100dvh - 46px); } }

/* Topo */
.vd-topo {
	flex: none;
	background: #fff;
	border-bottom: 1px solid var(--borda);
	padding-top: env(safe-area-inset-top);
	z-index: 2;
}
.vd-topo__inner {
	max-width: 680px;
	margin: 0 auto;
	padding: 10px 16px;
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 64px;
}
.vd-voltar {
	flex: none;
	width: 44px; height: 44px;
	margin-left: -10px;
	display: inline-flex; align-items: center; justify-content: center;
	border: 0; border-radius: 50%;
	background: transparent; color: var(--cafe);
	cursor: pointer;
}
.vd-voltar:hover { background: var(--off); }
.vd-voltar[hidden] { display: none; }
.vd-avatar {
	position: relative;
	flex: none;
	width: 44px; height: 44px;
	border-radius: 50%;
	background: var(--nude);
	color: var(--cafe);
	display: flex; align-items: center; justify-content: center;
	font-family: var(--serif);
	font-size: 18px; font-weight: 600; letter-spacing: .04em;
}
.vd-online {
	position: absolute; right: 0; bottom: 1px;
	width: 11px; height: 11px; border-radius: 50%;
	background: var(--verde);
	border: 2px solid #fff;
}
.vd-quem { flex: 1; min-width: 0; }
.vd-nome { margin: 0; font-weight: 500; font-size: 16px; line-height: 1.2; color: var(--escuro); }
.vd-cargo { margin: 2px 0 0; font-size: 12.5px; color: #6E5A4D; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vd-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.vd-logo { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; }

.vd-progresso { height: 3px; background: var(--nude); }
.vd-progresso__barra { display: block; height: 100%; width: 0; background: var(--cafe); transition: width .4s ease; }

/* Chat */
.vd-chat {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;
	padding: 20px 16px 12px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	scroll-behavior: smooth;
}
.vd-chat > * { width: 100%; max-width: 648px; margin-inline: auto; }
.vd-msg {
	margin: 0;
	padding: 11px 15px;
	font-size: 15.5px;
	line-height: 1.45;
	border-radius: 18px;
	width: fit-content;
	max-width: min(84%, 520px);
	white-space: pre-line;
	overflow-wrap: anywhere;
	animation: vd-entra .25s ease-out;
}
.vd-msg--bot {
	background: #fff;
	color: var(--escuro);
	border: 1px solid var(--borda);
	border-bottom-left-radius: 6px;
	box-shadow: 0 1px 2px rgba(63, 45, 35, .04);
}
.vd-msg--user {
	background: var(--cafe);
	color: #fff;
	border-bottom-right-radius: 6px;
	margin-top: 4px;
	margin-bottom: 4px;
}
.vd-linha { display: flex; }
.vd-linha--bot { justify-content: flex-start; }
.vd-linha--user { justify-content: flex-end; }

.vd-digitando {
	display: inline-flex; gap: 4px; align-items: center;
	padding: 14px 16px;
	background: #fff;
	border: 1px solid var(--borda);
	border-radius: 18px; border-bottom-left-radius: 6px;
}
.vd-digitando i {
	width: 7px; height: 7px; border-radius: 50%;
	background: #B9A08D;
	animation: vd-pulo 1s infinite ease-in-out;
}
.vd-digitando i:nth-child(2) { animation-delay: .15s; }
.vd-digitando i:nth-child(3) { animation-delay: .3s; }

@keyframes vd-pulo { 0%, 60%, 100% { transform: translateY(0); opacity: .5; } 30% { transform: translateY(-4px); opacity: 1; } }
@keyframes vd-entra { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* Base: respostas + rodapé */
.vd-base {
	flex: none;
	background: var(--off);
	border-top: 1px solid var(--borda);
	padding-bottom: env(safe-area-inset-bottom);
}
.vd-respostas {
	max-width: 680px;
	margin: 0 auto;
	padding: 12px 16px 4px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.vd-respostas:empty { padding: 0; }
.vd-chip {
	width: 100%;
	min-height: 48px;
	padding: 12px 18px;
	border: 1px solid var(--cafe);
	border-radius: 14px;
	background: #fff;
	color: var(--cafe);
	font-family: var(--sans);
	font-size: 15.5px;
	font-weight: 500;
	text-align: left;
	cursor: pointer;
	transition: background .15s, color .15s;
	animation: vd-entra .25s ease-out both;
	-webkit-tap-highlight-color: transparent;
}
.vd-chip:hover, .vd-chip:focus-visible { background: var(--cafe); color: #fff; }
.vd-chip:active { transform: scale(.99); }
.vd-chip--principal { background: var(--cafe); color: #fff; text-align: center; letter-spacing: .02em; }
.vd-chip--principal:hover { background: var(--cafe-hover); }

.vd-form { display: flex; gap: 8px; }
.vd-form label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.vd-input {
	flex: 1; min-width: 0;
	min-height: 48px;
	padding: 12px 16px;
	border: 1px solid var(--cafe);
	border-radius: 14px;
	background: #fff;
	color: var(--escuro);
	font-family: var(--sans);
	font-size: 16px; /* evita zoom no iOS */
}
.vd-input::placeholder { color: #9C8676; }
.vd-input[aria-invalid="true"] { border-color: #B3402A; }
.vd-enviar {
	flex: none;
	width: 48px; height: 48px;
	border: 0; border-radius: 14px;
	background: var(--cafe); color: #fff;
	display: inline-flex; align-items: center; justify-content: center;
	cursor: pointer;
}
.vd-enviar:hover { background: var(--cafe-hover); }

.vd-cta {
	display: flex; align-items: center; justify-content: center; gap: 10px;
	min-height: 52px;
	padding: 14px 20px;
	border-radius: 14px;
	background: var(--cafe); color: #fff;
	font-size: 16px; font-weight: 500;
	text-decoration: none;
	animation: vd-entra .25s ease-out both;
}
.vd-cta:hover { background: var(--cafe-hover); color: #fff; }
.vd-cta--zap { background: #1F7A4C; }
.vd-cta--zap:hover { background: #17633D; }

.vd-rodape {
	max-width: 680px;
	margin: 0 auto;
	padding: 8px 16px 10px;
	text-align: center;
	font-size: 11.5px;
	line-height: 1.5;
	color: #6E5A4D;
}
.vd-rodape p { margin: 0; }
.vd-rodape a { color: var(--cafe); }

@media (min-width: 700px) {
	.vd-chat { padding-top: 28px; }
}

@media (prefers-reduced-motion: reduce) {
	.vd-msg, .vd-chip, .vd-cta { animation: none; }
	.vd-chat { scroll-behavior: auto; }
	.vd-digitando i { animation: none; opacity: .7; }
}
