/**
 * Assistente flutuante de dúvidas — BarberPrime Sales
 * Namespace .bpa-* para não colidir com o tema.
 */

.bpa-root{
	--bpa-accent:#C8A96E;
	--bpa-accent-2:#b4914f;
	--bpa-ink:#1f1a14;
	--bpa-bg:#ffffff;
	--bpa-bg-bot:#f5f1e8;
	--bpa-bg-user:#C8A96E;
	--bpa-user-ink:#1a1510;
	--bpa-border:#ece6d8;
	--bpa-muted:#8a8172;
	position:fixed; right:20px; bottom:20px; z-index:99990;
	font-family:inherit;
}
.bpa-root *{ box-sizing:border-box; }
/* Hardening: neutraliza estilos do tema que vazam para botões/campos do widget.
   :where() tem especificidade 0, então qualquer regra .bpa-* abaixo ainda vence. */
.bpa-root :where(button, input, textarea, select){
	font: inherit; line-height: normal; text-transform: none; letter-spacing: normal;
	box-shadow: none; -webkit-appearance: none; appearance: none; min-height: 0; margin: 0;
	border-radius: 0; background: none; color: inherit; text-align: left;
}
.bpa-root :where(img){ max-width: 100%; height: auto; display: block; }
.bpa-root :where(a){ box-shadow: none; }

/* ---------- Launcher ---------- */
.bpa-launcher{
	position:relative; width:62px; height:62px; border:0; padding:0; cursor:pointer; border-radius:50%;
	background:linear-gradient(135deg,var(--bpa-accent),var(--bpa-accent-2));
	color:#1a1510; box-shadow:0 10px 30px rgba(180,145,79,.45), 0 2px 8px rgba(0,0,0,.18);
	display:flex; align-items:center; justify-content:center;
	animation:bpaFloat 3.6s ease-in-out infinite; transition:transform .18s ease, box-shadow .18s ease;
}
/* Launcher com foto do assistente */
.bpa-launcher--img{ background:#fff; }
.bpa-launcher .bpa-ava-img{ width:100%; height:100%; object-fit:cover; border-radius:50%; }
/* Avatar com foto no cabeçalho */
.bpa-head__avatar--img{ background:none; }
.bpa-head__avatar .bpa-ava-img{ width:40px; height:40px; object-fit:cover; border-radius:50%; }
.bpa-launcher:hover{ transform:translateY(-2px) scale(1.04); }
.bpa-launcher:active{ transform:scale(.97); }
.bpa-launcher:focus-visible{ outline:3px solid rgba(200,169,110,.6); outline-offset:3px; }
.bpa-launcher svg{ width:28px; height:28px; }
.bpa-launcher::after{ /* anel pulsante */
	content:""; position:absolute; inset:-4px; border-radius:50%;
	border:2px solid rgba(200,169,110,.5); animation:bpaPulse 2.4s ease-out infinite;
}
.bpa-launcher__badge{
	position:absolute; top:-3px; right:-3px; min-width:20px; height:20px; padding:0 5px;
	background:#e5484d; color:#fff; border-radius:12px; font-size:11px; font-weight:800; line-height:20px;
	text-align:center; box-shadow:0 2px 6px rgba(0,0,0,.25); border:2px solid #fff;
}
.bpa-root.is-open .bpa-launcher{ animation:none; }
/* Sobe o widget quando o botão flutuante do WhatsApp ocupa o mesmo canto */
.bpa-root.bpa-wa{ bottom:88px; }

/* ---------- Nudge ---------- */
.bpa-nudge{
	position:absolute; right:74px; bottom:8px;
	/* largura explícita: o container (launcher) tem ~0 de largura, então sem isto
	   o balão colapsava para uma palavra por linha. */
	width:230px; max-width:calc(100vw - 104px);
	background:var(--bpa-bg); color:var(--bpa-ink); border:1px solid var(--bpa-border);
	border-radius:14px 14px 4px 14px; padding:11px 30px 11px 13px; font-size:13.5px; line-height:1.4;
	box-shadow:0 10px 28px rgba(0,0,0,.14); opacity:0; transform:translateX(8px) scale(.96);
	transition:opacity .25s ease, transform .25s ease; pointer-events:none;
	white-space:normal; word-break:normal; overflow-wrap:break-word;
}
.bpa-nudge.is-visible{ opacity:1; transform:none; pointer-events:auto; }
.bpa-nudge__close{
	position:absolute; top:4px; right:5px; width:20px; height:20px; border:0; background:transparent;
	color:var(--bpa-muted); cursor:pointer; font-size:16px; line-height:1; border-radius:6px;
}
.bpa-nudge__close:hover{ background:rgba(0,0,0,.06); }

/* ---------- Panel ---------- */
.bpa-panel{
	position:absolute; right:0; bottom:76px; width:376px; max-width:calc(100vw - 32px);
	height:min(560px, calc(100vh - 120px)); background:var(--bpa-bg); border:1px solid var(--bpa-border);
	border-radius:18px; box-shadow:0 24px 70px rgba(20,16,10,.28); overflow:hidden;
	display:flex; flex-direction:column; transform-origin:bottom right;
	opacity:0; transform:translateY(12px) scale(.96); pointer-events:none;
	transition:opacity .2s ease, transform .2s cubic-bezier(.2,.8,.3,1);
}
.bpa-root.is-open .bpa-panel{ opacity:1; transform:none; pointer-events:auto; }

.bpa-head{
	display:flex; align-items:center; gap:11px; padding:13px 14px;
	background:linear-gradient(135deg,#241d15,#3a2f20); color:#fff;
}
.bpa-head__avatar{
	position:relative; width:40px; height:40px; flex:0 0 40px; border-radius:50%;
	background:linear-gradient(135deg,var(--bpa-accent),var(--bpa-accent-2));
	display:flex; align-items:center; justify-content:center; color:#1a1510;
}
.bpa-head__avatar svg{ width:22px; height:22px; }
.bpa-head__dot{ position:absolute; right:-1px; bottom:-1px; width:12px; height:12px; border-radius:50%;
	background:#2ecc71; border:2px solid #241d15; }
.bpa-head__meta{ flex:1; min-width:0; }
.bpa-head__title{ font-size:14.5px; font-weight:700; margin:0; line-height:1.2; }
.bpa-head__sub{ font-size:11.5px; opacity:.8; margin:1px 0 0; display:flex; align-items:center; gap:5px; }
.bpa-head__sub .bpa-live{ width:7px; height:7px; border-radius:50%; background:#2ecc71; display:inline-block; }
.bpa-head__btns{ display:flex; gap:2px; }
.bpa-iconbtn{ width:32px; height:32px; border:0; background:transparent; color:#fff; opacity:.85; cursor:pointer;
	border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:18px; line-height:1; }
.bpa-iconbtn:hover{ background:rgba(255,255,255,.12); opacity:1; }

.bpa-body{
	flex:1; overflow-y:auto; padding:16px 14px 6px; background:
		radial-gradient(circle at 20% 0%, rgba(200,169,110,.07), transparent 60%), var(--bpa-bg);
	scroll-behavior:smooth;
}
.bpa-row{ display:flex; margin-bottom:10px; animation:bpaIn .26s ease both; }
.bpa-row--bot{ justify-content:flex-start; }
.bpa-row--user{ justify-content:flex-end; }
.bpa-bubble{
	max-width:86%; padding:10px 13px; border-radius:16px; font-size:13.8px; line-height:1.55;
	word-wrap:break-word;
}
.bpa-row--bot .bpa-bubble{ background:var(--bpa-bg-bot); color:var(--bpa-ink); border-bottom-left-radius:5px; }
.bpa-row--user .bpa-bubble{ background:var(--bpa-bg-user); color:var(--bpa-user-ink); border-bottom-right-radius:5px; font-weight:500; }
.bpa-bubble p{ margin:0 0 7px; } .bpa-bubble p:last-child{ margin:0; }
.bpa-bubble a{ color:var(--bpa-accent-2); font-weight:600; }
.bpa-bubble ul,.bpa-bubble ol{ margin:5px 0 7px; padding-left:18px; }
.bpa-ans__q{ font-weight:700; margin:0 0 5px; display:flex; gap:7px; }
.bpa-ans__q .bpa-tick{ color:var(--bpa-accent-2); }

.bpa-typing{ display:inline-flex; gap:4px; padding:4px 2px; }
.bpa-typing span{ width:7px; height:7px; border-radius:50%; background:var(--bpa-accent); opacity:.5;
	animation:bpaBlink 1s infinite; }
.bpa-typing span:nth-child(2){ animation-delay:.15s; } .bpa-typing span:nth-child(3){ animation-delay:.3s; }

/* chips de sugestão / ações */
.bpa-chips{ display:flex; flex-wrap:wrap; gap:7px; margin:2px 0 12px; }
.bpa-chip{
	border:1px solid var(--bpa-border); background:#fff; color:var(--bpa-ink); cursor:pointer;
	border-radius:999px; padding:7px 12px; font-size:12.8px; line-height:1.25; text-align:left;
	transition:border-color .15s ease, background .15s ease, transform .1s ease;
}
.bpa-chip:hover{ border-color:var(--bpa-accent); background:rgba(200,169,110,.1); }
.bpa-chip:active{ transform:scale(.97); }
.bpa-chips__lead{ width:100%; font-size:11.5px; color:var(--bpa-muted); font-weight:700;
	text-transform:uppercase; letter-spacing:.6px; margin:0 0 1px; }

.bpa-miss{ background:rgba(200,169,110,.1); border:1px solid rgba(200,169,110,.35); border-radius:14px;
	padding:12px 13px; }
.bpa-miss p{ margin:0 0 9px; font-size:13.5px; }
.bpa-cta{ display:inline-flex; align-items:center; gap:6px; background:linear-gradient(135deg,var(--bpa-accent),var(--bpa-accent-2));
	color:#1a1510; font-weight:700; text-decoration:none; padding:9px 14px; border-radius:11px; font-size:13.5px; }
.bpa-cta:hover{ filter:brightness(1.05); }

.bpa-foot{ border-top:1px solid var(--bpa-border); padding:9px 10px 10px; background:var(--bpa-bg); }
.bpa-inputbar{ display:flex; align-items:flex-end; gap:8px; background:var(--bpa-bg-bot);
	border:1px solid var(--bpa-border); border-radius:14px; padding:6px 6px 6px 12px; }
.bpa-inputbar:focus-within{ border-color:var(--bpa-accent); box-shadow:0 0 0 3px rgba(200,169,110,.18); }
.bpa-input{ flex:1; border:0; outline:0; background:transparent; resize:none; font:inherit; font-size:13.8px;
	color:var(--bpa-ink); max-height:96px; line-height:1.45; padding:4px 0; }
.bpa-send{ width:38px; height:38px; flex:0 0 38px; border:0; cursor:pointer; border-radius:11px;
	background:linear-gradient(135deg,var(--bpa-accent),var(--bpa-accent-2)); color:#1a1510;
	display:flex; align-items:center; justify-content:center; transition:filter .15s ease, transform .1s ease; }
.bpa-send:hover{ filter:brightness(1.06); } .bpa-send:active{ transform:scale(.94); }
.bpa-send:disabled{ opacity:.45; cursor:default; } .bpa-send svg{ width:18px; height:18px; }
.bpa-footnote{ display:flex; justify-content:space-between; align-items:center; margin:7px 2px 0; }
.bpa-footnote a{ font-size:11.5px; color:var(--bpa-muted); text-decoration:none; }
.bpa-footnote a:hover{ color:var(--bpa-accent-2); text-decoration:underline; }
.bpa-footnote__secure{ font-size:10.5px; color:var(--bpa-muted); display:flex; align-items:center; gap:4px; }

/* ---------- Animações ---------- */
@keyframes bpaFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-4px); } }
@keyframes bpaPulse{ 0%{ transform:scale(1); opacity:.6; } 100%{ transform:scale(1.5); opacity:0; } }
@keyframes bpaIn{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
@keyframes bpaBlink{ 0%,100%{ opacity:.35; transform:translateY(0); } 50%{ opacity:1; transform:translateY(-2px); } }

/* ---------- Mobile ---------- */
@media (max-width:480px){
	.bpa-root{ right:14px; bottom:14px; }
	.bpa-root.bpa-wa{ bottom:80px; }
	.bpa-panel{ width:calc(100vw - 24px); height:min(72vh, calc(100vh - 100px)); right:-4px; }
	.bpa-nudge{ display:none; }
}

/* ---------- Dark mode (se o tema expuser) ---------- */
@media (prefers-color-scheme: dark){
	.bpa-root{
		--bpa-bg:#1c1813; --bpa-bg-bot:#272118; --bpa-ink:#f2ead9; --bpa-border:#3a3125; --bpa-muted:#a99;
	}
	.bpa-chip{ background:#241e16; }
}

@media (prefers-reduced-motion: reduce){
	.bpa-launcher,.bpa-launcher::after,.bpa-row,.bpa-typing span,.bpa-panel,.bpa-nudge{ animation:none !important; transition:none !important; }
}
