/* =========================================================================
 * Bobby Wallace Sénior — widget front (Breizh Web Studio)
 * Palette charte : magenta -> violet, détails or. Bobby (caméléon) = image.
 * IMPORTANT : chaque sélecteur est préfixé par #bws-chatbot-root pour gagner
 * en spécificité — cela empêche à la fois le reset interne d'annuler les
 * paddings ET le thème hôte de percuter le widget.
 * === CHARTE : ajuste ces 4 variables pour coller exactement à ton identité ==
 * ===================================================================== */

#bws-chatbot-root {
	--bws-navy:    #C21C74; /* couleur principale (charte) : dégradé, bulles utilisateur */
	--bws-navy-2:  #6A2C91; /* couleur secondaire (charte) : fin du dégradé */
	--bws-brass:   #F0A93B; /* accent/or : focus, filet, caret */
	--bws-brass-2: #F6C56B;

	--bws-paper:   #FBFCFD;
	--bws-ink:     #1E1420;
	--bws-muted:   #6B5B73;
	--bws-bot:     #F1ECF4;
	--bws-line:    #EAE3EF;
	--bws-shadow:  rgba(106, 44, 145, .22);

	--bws-serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
	--bws-sans:  system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

	position: fixed;
	right: clamp(14px, 3vw, 28px);
	bottom: clamp(14px, 3vw, 28px);
	z-index: 2147483000;
	font-family: var(--bws-sans);
	color: var(--bws-ink);
	line-height: 1.5;
}

#bws-chatbot-root *,
#bws-chatbot-root *::before,
#bws-chatbot-root *::after { box-sizing: border-box; margin: 0; padding: 0; }

#bws-chatbot-root .bws-avatar { display: block; border-radius: 50%; object-fit: cover; background: #fff; user-select: none; }

/* ------------------------------------------------------------------ Launcher (image de Bobby) */
#bws-chatbot-root .bws-launcher {
	position: relative; width: 78px; height: 78px;
	border: none; border-radius: 50%; background: none; padding: 0; cursor: pointer;
	box-shadow: 0 12px 30px var(--bws-shadow);
	transition: transform .25s cubic-bezier(.34, 1.56, .64, 1), box-shadow .25s ease, opacity .3s ease;
	animation: bws-breathe 3.6s ease-in-out infinite;
}
#bws-chatbot-root .bws-launcher .bws-avatar { width: 100%; height: 100%; }
#bws-chatbot-root .bws-launcher:hover { transform: translateY(-3px) scale(1.05); box-shadow: 0 18px 38px var(--bws-shadow); }
#bws-chatbot-root .bws-launcher:active { transform: translateY(-1px) scale(1); }
#bws-chatbot-root .bws-launcher:focus-visible { outline: 3px solid var(--bws-brass); outline-offset: 3px; }
#bws-chatbot-root .bws-launcher::after {
	content: ""; position: absolute; bottom: 4px; right: 4px;
	width: 14px; height: 14px; border-radius: 50%;
	background: #43C08A; box-shadow: 0 0 0 3px #fff;
}
#bws-chatbot-root.bws-root--open .bws-launcher { opacity: 0; pointer-events: none; transform: scale(.6); animation: none; }

/* Bulle d'accroche */
#bws-chatbot-root .bws-nudge {
	position: absolute; right: 92px; bottom: 16px; max-width: 230px;
	background: #fff; color: var(--bws-ink); font-size: 13.5px; line-height: 1.35;
	padding: 11px 14px; border-radius: 14px 14px 4px 14px; box-shadow: 0 8px 22px var(--bws-shadow);
	white-space: nowrap; opacity: 0; transform: translateX(6px) scale(.96); transform-origin: bottom right;
	pointer-events: none; transition: opacity .3s ease, transform .3s cubic-bezier(.34, 1.56, .64, 1);
}
#bws-chatbot-root .bws-nudge.is-visible { opacity: 1; transform: translateX(0) scale(1); pointer-events: auto; }
#bws-chatbot-root .bws-nudge b { color: var(--bws-navy); }

/* ------------------------------------------------------------------ Panneau + métamorphose */
#bws-chatbot-root .bws-panel {
	position: absolute; right: 0; bottom: 0;
	width: min(390px, calc(100vw - 28px)); height: min(580px, calc(100vh - 40px));
	background: var(--bws-paper); border-radius: 22px;
	box-shadow: 0 26px 60px rgba(106, 44, 145, .34);
	display: flex; flex-direction: column; overflow: hidden;
	transform-origin: bottom right;
	opacity: 0; transform: scale(.5) translateY(12px); pointer-events: none;
	transition: opacity .3s ease, transform .42s cubic-bezier(.22, 1, .36, 1);
}
#bws-chatbot-root.bws-root--open .bws-panel { opacity: 1; transform: scale(1) translateY(0); pointer-events: auto; }

#bws-chatbot-root .bws-header, #bws-chatbot-root .bws-scroll, #bws-chatbot-root .bws-input-zone {
	opacity: 0; transform: translateY(7px); transition: opacity .3s ease, transform .3s ease;
}
#bws-chatbot-root.bws-root--open .bws-header     { opacity: 1; transform: none; transition-delay: .12s; }
#bws-chatbot-root.bws-root--open .bws-scroll     { opacity: 1; transform: none; transition-delay: .18s; }
#bws-chatbot-root.bws-root--open .bws-input-zone { opacity: 1; transform: none; transition-delay: .24s; }

/* ------------------------------------------------------------------ En-tête */
#bws-chatbot-root .bws-header {
	position: relative; padding: 16px 18px 15px;
	background: linear-gradient(135deg, var(--bws-navy) 0%, var(--bws-navy-2) 100%);
	color: #fff; display: flex; align-items: center; gap: 13px; flex: none;
}
#bws-chatbot-root .bws-header::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
	background: linear-gradient(90deg, transparent, var(--bws-brass), transparent); opacity: .9;
}
#bws-chatbot-root .bws-header .bws-avatar { width: 48px; height: 48px; flex: none; box-shadow: 0 0 0 2px rgba(255, 255, 255, .2); }
#bws-chatbot-root .bws-id { display: flex; flex-direction: column; line-height: 1.14; min-width: 0; }
#bws-chatbot-root .bws-eyebrow { font-size: 10px; letter-spacing: .18em; text-transform: uppercase; color: var(--bws-brass-2); font-weight: 700; }
#bws-chatbot-root .bws-name { font-family: var(--bws-serif); font-size: 19px; font-weight: 600; letter-spacing: .2px; color: #fff; }
#bws-chatbot-root .bws-status { font-size: 11.5px; color: rgba(255, 255, 255, .8); display: flex; align-items: center; gap: 6px; margin-top: 3px; }
#bws-chatbot-root .bws-status .dot { width: 7px; height: 7px; border-radius: 50%; background: #6BE3AE; box-shadow: 0 0 0 0 rgba(107, 227, 174, .6); animation: bws-pulse 2.4s ease-out infinite; }
#bws-chatbot-root .bws-close {
	margin-left: auto; align-self: flex-start; width: 32px; height: 32px;
	border: none; border-radius: 9px; background: rgba(255, 255, 255, .16); color: #fff; cursor: pointer;
	display: grid; place-items: center; transition: background .2s ease, transform .2s ease;
}
#bws-chatbot-root .bws-close:hover { background: rgba(255, 255, 255, .28); transform: rotate(90deg); }
#bws-chatbot-root .bws-close:focus-visible { outline: 2px solid var(--bws-brass); outline-offset: 2px; }

/* ------------------------------------------------------------------ Messages */
#bws-chatbot-root .bws-scroll {
	flex: 1 1 auto; overflow-y: auto; padding: 20px 18px 12px;
	display: flex; flex-direction: column; gap: 13px; scroll-behavior: smooth;
	background: radial-gradient(90% 60% at 100% 0, rgba(194, 28, 116, .05), transparent 60%), var(--bws-paper);
}
#bws-chatbot-root .bws-scroll::-webkit-scrollbar { width: 8px; }
#bws-chatbot-root .bws-scroll::-webkit-scrollbar-thumb { background: var(--bws-line); border-radius: 8px; }

#bws-chatbot-root .bws-msg { display: flex; gap: 9px; align-items: flex-end; max-width: 100%; animation: bws-msg-in .26s ease both; }
#bws-chatbot-root .bws-msg--bot .bws-avatar { width: 30px; height: 30px; flex: none; margin-bottom: 2px; }
#bws-chatbot-root .bws-bubble {
	font-size: 14.5px; line-height: 1.5; padding: 12px 16px; border-radius: 16px;
	max-width: 80%; word-wrap: break-word; overflow-wrap: anywhere; white-space: pre-wrap;
}
#bws-chatbot-root .bws-msg--bot .bws-bubble { background: var(--bws-bot); color: var(--bws-ink); border-bottom-left-radius: 5px; }
#bws-chatbot-root .bws-msg--user { margin-left: auto; flex-direction: row-reverse; }
#bws-chatbot-root .bws-msg--user .bws-bubble { background: linear-gradient(135deg, var(--bws-navy), var(--bws-navy-2)); color: #fff; border-bottom-right-radius: 5px; }
#bws-chatbot-root .bws-bubble a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
#bws-chatbot-root .bws-msg--bot .bws-bubble a { color: var(--bws-navy); font-weight: 600; }

#bws-chatbot-root .bws-caret { display: inline-block; width: 2px; height: 1.05em; vertical-align: -2px; margin-left: 1px; background: var(--bws-brass); animation: bws-blink 1s steps(2, start) infinite; }

#bws-chatbot-root .bws-typing { display: flex; gap: 9px; align-items: flex-end; animation: bws-msg-in .26s ease both; }
#bws-chatbot-root .bws-typing .bws-avatar { width: 30px; height: 30px; flex: none; }
#bws-chatbot-root .bws-typing-bubble { background: var(--bws-bot); border-radius: 16px; border-bottom-left-radius: 5px; padding: 13px 16px; display: flex; align-items: center; gap: 9px; }
#bws-chatbot-root .bws-typing-dots { display: inline-flex; gap: 4px; }
#bws-chatbot-root .bws-typing-dots i { width: 7px; height: 7px; border-radius: 50%; background: var(--bws-navy); opacity: .55; display: block; animation: bws-dot 1.2s ease-in-out infinite; }
#bws-chatbot-root .bws-typing-dots i:nth-child(2) { animation-delay: .18s; }
#bws-chatbot-root .bws-typing-dots i:nth-child(3) { animation-delay: .36s; }
#bws-chatbot-root .bws-typing-label { font-size: 12px; color: var(--bws-muted); font-style: italic; }

/* ------------------------------------------------------------------ Consentement */
#bws-chatbot-root .bws-consent {
	position: absolute; inset: 0; top: 80px;
	background: rgba(251, 252, 253, .97); backdrop-filter: blur(2px);
	display: flex; flex-direction: column; justify-content: center;
	padding: 28px 26px 30px; text-align: center; gap: 16px;
	opacity: 0; transform: translateY(8px); pointer-events: none;
	transition: opacity .3s ease, transform .3s ease;
}
#bws-chatbot-root .bws-consent.is-visible { opacity: 1; transform: translateY(0); pointer-events: auto; }
#bws-chatbot-root .bws-consent .bws-avatar { width: 66px; height: 66px; margin: 0 auto 2px; box-shadow: 0 6px 16px var(--bws-shadow); }
#bws-chatbot-root .bws-consent h3 { font-family: var(--bws-serif); font-size: 20px; color: var(--bws-navy); font-weight: 600; }
#bws-chatbot-root .bws-consent p { font-size: 13.5px; line-height: 1.55; color: var(--bws-muted); }
#bws-chatbot-root .bws-consent a { color: var(--bws-navy); font-weight: 600; }
#bws-chatbot-root .bws-consent-actions { display: flex; flex-direction: column; gap: 9px; margin-top: 6px; }

/* ------------------------------------------------------------------ Saisie */
#bws-chatbot-root .bws-input-zone { flex: none; border-top: 1px solid var(--bws-line); padding: 13px 14px; background: #fff; display: flex; flex-direction: column; gap: 8px; }
#bws-chatbot-root .bws-input-row { display: flex; align-items: flex-end; gap: 9px; }
#bws-chatbot-root .bws-input {
	flex: 1 1 auto; resize: none; -webkit-appearance: none; appearance: none;
	border: 1.5px solid var(--bws-line); border-radius: 13px; padding: 12px 14px;
	font-family: var(--bws-sans); font-size: 14px; line-height: 1.4; color: var(--bws-ink);
	max-height: 108px; background: #fff; box-shadow: none;
	transition: border-color .2s ease, box-shadow .2s ease;
}
#bws-chatbot-root .bws-input::placeholder { color: #9C8FA6; }
#bws-chatbot-root .bws-input:focus { outline: none; border-color: var(--bws-navy); box-shadow: 0 0 0 3px rgba(194, 28, 116, .16); }
#bws-chatbot-root .bws-input:disabled { background: #F5F1F7; color: var(--bws-muted); }

#bws-chatbot-root .bws-btn { font-family: var(--bws-sans); font-size: 14px; font-weight: 600; border: none; border-radius: 12px; cursor: pointer; transition: transform .18s cubic-bezier(.34, 1.56, .64, 1), box-shadow .2s ease, opacity .2s ease; }
#bws-chatbot-root .bws-btn--primary { background: linear-gradient(135deg, var(--bws-navy), var(--bws-navy-2)); color: #fff; padding: 12px 16px; box-shadow: 0 6px 16px var(--bws-shadow); }
#bws-chatbot-root .bws-btn--primary:hover { transform: translateY(-2px); box-shadow: 0 10px 22px var(--bws-shadow); }
#bws-chatbot-root .bws-btn--primary:active { transform: translateY(0); }
#bws-chatbot-root .bws-btn--ghost { background: transparent; color: var(--bws-muted); padding: 8px; font-weight: 500; font-size: 13px; text-decoration: underline; }
#bws-chatbot-root .bws-btn:focus-visible { outline: 2px solid var(--bws-brass); outline-offset: 2px; }

#bws-chatbot-root .bws-send {
	flex: none; width: 46px; height: 46px; border-radius: 12px;
	background: linear-gradient(135deg, var(--bws-navy), var(--bws-navy-2)); color: #fff;
	display: grid; place-items: center; border: none; cursor: pointer; box-shadow: 0 6px 16px var(--bws-shadow);
	transition: transform .18s cubic-bezier(.34, 1.56, .64, 1), box-shadow .2s ease, opacity .2s ease;
}
#bws-chatbot-root .bws-send:hover { transform: translateY(-2px) rotate(-8deg); }
#bws-chatbot-root .bws-send:active { transform: translateY(0); }
#bws-chatbot-root .bws-send:disabled { opacity: .45; cursor: default; transform: none; box-shadow: none; }
#bws-chatbot-root .bws-send:focus-visible { outline: 2px solid var(--bws-brass); outline-offset: 2px; }
#bws-chatbot-root .bws-send svg { width: 20px; height: 20px; }

#bws-chatbot-root .bws-footer { text-align: center; font-size: 10.5px; color: #9C8FA6; letter-spacing: .02em; }
#bws-chatbot-root .bws-footer .paw { vertical-align: -2px; margin: 0 3px; opacity: .8; }

/* ------------------------------------------------------------------ Mobile */
@media (max-width: 460px) {
	#bws-chatbot-root { right: 12px; bottom: 12px; }
	#bws-chatbot-root .bws-panel { width: calc(100vw - 20px); height: min(78vh, calc(100vh - 88px)); }
	#bws-chatbot-root .bws-nudge { display: none; }
}

@keyframes bws-breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.045); } }
@keyframes bws-pulse { 0% { box-shadow: 0 0 0 0 rgba(107, 227, 174, .5); } 70%, 100% { box-shadow: 0 0 0 7px rgba(107, 227, 174, 0); } }
@keyframes bws-msg-in { from { opacity: 0; transform: translateY(9px); } to { opacity: 1; transform: translateY(0); } }
@keyframes bws-dot { 0%, 60%, 100% { transform: translateY(0); opacity: .5; } 30% { transform: translateY(-5px); opacity: 1; } }
@keyframes bws-blink { 0%, 49% { opacity: 1; } 50%, 100% { opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
	#bws-chatbot-root *, #bws-chatbot-root *::before, #bws-chatbot-root *::after {
		animation-duration: .001ms !important; animation-iteration-count: 1 !important;
		transition-duration: .001ms !important; scroll-behavior: auto !important;
	}
}

/* ------------------------------------------------------------------ Cohabitation avec d'autres badges flottants
 * Masque le badge reCAPTCHA (Google impose alors d'afficher la mention légale reCAPTCHA
 * quelque part sur le site — voir note). Décommente/adapte le sélecteur « retour en haut »
 * de ton thème pour le décaler à gauche et éviter le chevauchement. */
.grecaptcha-badge { visibility: hidden !important; }
/* Exemple à adapter au sélecteur réel de ton bouton « retour en haut » :
   #retour-haut, .back-to-top, #scroll-to-top { right: auto !important; left: 24px !important; } */
