/* ---------- AI advisor: a chat window docked bottom-right ----------
   Computer: minimized it is a bar (it opens by itself once per visitor, on the
   home page or the instant-quote page). Phones and tablets (.is-touch):
   minimized it is a round button. Sits above the cookie bar (--p3-consent-h).
   Plain sRGB colors, no dvh/inset shorthand: old iPad Safari renders it too. */

.p3-ai-dock {
	position: fixed;
	right: 20px;
	right: calc(20px + env(safe-area-inset-right, 0px));
	bottom: calc(20px + var(--p3-consent-h, 0px));
	z-index: 46; /* above the floating WhatsApp/phone buttons (45), below the header drawer */
	width: 370px;
	height: 540px;
	max-height: calc(100vh - 120px);
	display: flex;
	flex-direction: column;
	background: #f6f7f9;
	border: 1px solid #d6dbe1;
	border-radius: 16px;
	box-shadow: 0 12px 40px rgba(10, 20, 35, 0.22);
	overflow: hidden;
	font-family: inherit;
	color: #111820;
	direction: rtl;
	text-align: right;
	animation: p3-ai-in 0.35s ease both;
}
.p3-ai-dock[dir="ltr"] { direction: ltr; text-align: left; }
@keyframes p3-ai-in {
	from { transform: translateY(16px); opacity: 0; }
	to   { transform: none; opacity: 1; }
}

/* Minimized: just the title bar. */
.p3-ai-dock.is-min {
	height: auto;
	width: 300px;
	border-radius: 999px;
	cursor: pointer;
}
.p3-ai-dock.is-min .p3-ai-list,
.p3-ai-dock.is-min .p3-ai-foot { display: none; }
.p3-ai-dock.is-min .p3-ai-head { border-radius: 999px; padding-top: 8px; padding-bottom: 8px; }

@media (max-width: 640px) {
	/* Leaves the left column (WhatsApp and phone buttons, 16px + 56px) free. */
	.p3-ai-dock {
		right: 8px;
		left: 80px;
		width: auto;
		bottom: calc(8px + var(--p3-consent-h, 0px));
		height: 62vh;
		max-height: calc(100vh - 90px);
	}
	/* Minimized on a phone: a short bar on the right, clear of the WhatsApp
	   and phone buttons on the left. */
	.p3-ai-dock.is-min { left: auto; width: 262px; }
	.p3-ai-dock.is-min .p3-ai-sub { display: none; }
}

.p3-ai-head {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 12px;
	background: #16325c;
	color: #fff;
	flex-shrink: 0;
}
.p3-ai-head .p3-ai-avatar circle { fill: transparent; }
.p3-ai-head-text { flex: 1; min-width: 0; }
.p3-ai-title { font-weight: 700; font-size: 0.95rem; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.p3-ai-sub { font-size: 0.72rem; opacity: 0.75; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.p3-ai-min {
	background: transparent;
	border: 0;
	color: #fff;
	width: 34px;
	height: 34px;
	border-radius: 8px;
	cursor: pointer;
	display: grid;
	place-items: center;
	flex-shrink: 0;
}
.p3-ai-min:hover { background: rgba(255, 255, 255, 0.14); }
.p3-ai-min:focus-visible { outline: 2px solid #c7dc00; outline-offset: 1px; }
.p3-ai-min svg { transition: transform 0.2s ease; }
.p3-ai-dock.is-min .p3-ai-min svg { transform: rotate(180deg); }

/* Avatar "prints" its layers while an answer is being written. */
@keyframes p3-ai-layer {
	0%, 15% { opacity: 0.15; }
	35%, 100% { opacity: 1; }
}
.p3-ai-busy rect { animation: p3-ai-layer 1.6s ease-in-out infinite both; }

.p3-ai-list {
	flex: 1;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;
	padding: 14px;
}
.p3-ai-row { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 10px; }
.p3-ai-row.is-user { justify-content: flex-end; }
.p3-ai-bubble {
	max-width: 85%;
	padding: 8px 12px;
	border-radius: 14px;
	font-size: 0.9rem;
	line-height: 1.6;
	white-space: pre-wrap;
	word-wrap: break-word;
	overflow-wrap: anywhere;
	background: #fff;
	border: 1px solid #e3e6ea;
}
.p3-ai-row.is-user .p3-ai-bubble { background: #16325c; color: #fff; border-color: #16325c; }
.p3-ai-bubble a { color: inherit; text-decoration: underline; }
.p3-ai-bubble .is-muted { color: #6b7480; }
.p3-ai-starters { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0 10px; }
.p3-ai-chip {
	border: 1px solid #d6dbe1;
	background: #fff;
	border-radius: 999px;
	padding: 6px 11px;
	font: inherit;
	font-size: 0.78rem;
	cursor: pointer;
	color: #111820;
}
.p3-ai-chip:hover { border-color: #16325c; }

.p3-ai-foot {
	border-top: 1px solid #e3e6ea;
	background: #fff;
	padding: 8px 10px;
	flex-shrink: 0;
}
.p3-ai-form { display: flex; align-items: flex-end; gap: 8px; }
.p3-ai-input {
	flex: 1;
	min-width: 0;
	resize: none;
	border: 1px solid #d6dbe1;
	border-radius: 12px;
	padding: 8px 12px;
	font: inherit;
	font-size: 16px; /* 16px keeps iOS from zooming in on focus */
	line-height: 1.4;
	max-height: 110px;
	background: #fff;
	color: #111820;
}
.p3-ai-input:focus { outline: 2px solid rgba(22, 50, 92, 0.35); outline-offset: 0; }
.p3-ai-send {
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	border: 0;
	border-radius: 12px;
	background: #16325c;
	color: #fff;
	cursor: pointer;
	display: grid;
	place-items: center;
}
.p3-ai-send[disabled] { opacity: 0.4; cursor: default; }
.p3-ai-meta {
	display: flex;
	justify-content: space-between;
	gap: 8px;
	margin-top: 6px;
	font-size: 0.7rem;
	color: #6b7480;
}
.p3-ai-meta a, .p3-ai-meta button {
	color: inherit;
	background: none;
	border: 0;
	padding: 0;
	font: inherit;
	cursor: pointer;
	text-decoration: none;
}
.p3-ai-meta .p3-ai-team { color: #128c4a; font-weight: 700; }

/* Phones and tablets, minimized: a round button bottom-right, same size and
   frame as the WhatsApp and phone buttons on the left. */
.p3-ai-dock.is-touch.is-min {
	left: auto;
	right: 16px;
	right: calc(16px + env(safe-area-inset-right, 0px));
	bottom: calc(20px + var(--p3-consent-h, 0px)); /* level with the WhatsApp button */
	width: 56px;
	height: 56px;
	border-radius: 50%;
	border: 2px solid #c7dc00;
	background: #16325c;
	box-shadow: 0 6px 20px rgba(17, 24, 32, 0.22);
}
.p3-ai-dock.is-touch.is-min .p3-ai-head {
	padding: 0;
	height: 100%;
	justify-content: center;
	border-radius: 50%;
}
.p3-ai-dock.is-touch.is-min .p3-ai-head-text,
.p3-ai-dock.is-touch.is-min .p3-ai-min { display: none; }
.p3-ai-dock.is-touch.is-min .p3-ai-head .p3-ai-avatar { width: 40px; height: 40px; }

@media print { .p3-ai-dock { display: none; } }
@media (prefers-reduced-motion: reduce) {
	.p3-ai-dock { animation: none; }
	.p3-ai-busy rect { animation: none; }
	.p3-ai-min svg { transition: none; }
}