/* Karina — MCGS chat widget. Frosted glass, gold on black, bottom-right.
   Self-contained values so it renders the same on every page. */

.mcgs-chat {
	--k-bg: #FCFCFD;
	--k-glass: #F1F1F5;
	--k-border: rgba(21, 20, 26, .12);
	--k-gold: #146B6B;
	--k-gold-light: #146B6B;
	--k-glow: #5FE8E3;
	--k-text: #15141A;
	--k-dim: #5C6B6B;
	--k-blur: 0px;
	/* Always visible, centred at the bottom of the viewport (Sierra-style). */
	position: fixed;
	left: 0;
	right: 0;
	bottom: clamp(1rem, 3vw, 1.6rem);
	display: flex;
	justify-content: center;
	pointer-events: none;
	z-index: 2147483000;
	font-family: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
}
.mcgs-chat__launcher,
.mcgs-chat__panel { pointer-events: auto; }

/* ---------- launcher — always visible, prominent, elegant ---------- */
.mcgs-chat__launcher {
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	padding: .9rem 1.3rem .9rem 1.1rem;
	border-radius: 3px;
	cursor: pointer;
	color: #FCFCFD;
	font-family: "Fraunces", Georgia, serif;
	font-weight: 500;
	font-size: .96rem;
	letter-spacing: 0;
	background: #146B6B;
	border: 1px solid #146B6B;
	/* Elevation only at rest — never a glow. The accent glow is an interaction
	   effect (see :hover / :focus-visible below); §11 of the brief, and it
	   matters most here because the launcher is on screen on every page. */
	box-shadow: 0 6px 20px -6px rgba(20, 107, 107, .5);
	transition: transform .18s ease, box-shadow .18s ease;
}
/* The site theme (GeneratePress) blackens every <button> on hover/focus and
   tints form fields on focus — re-assert the widget's own colours on every
   interactive state so nothing ever goes black. */
.mcgs-chat__launcher:hover,
.mcgs-chat__launcher:focus,
.mcgs-chat__launcher:active {
	background: #146B6B;
	color: #FCFCFD;
	border-color: #146B6B;
	transform: translateY(-2px);
	box-shadow: 0 8px 24px -6px rgba(20, 107, 107, .6), 0 0 16px -2px rgba(95, 232, 227, .5);
}
.mcgs-chat__launcher-icon { display: inline-flex; width: 20px; height: 20px; }
.mcgs-chat__launcher-icon svg { width: 100%; height: 100%; }
.mcgs-chat__launcher-arrow { display: inline-flex; width: 15px; height: 15px; opacity: .7; transition: transform .18s ease; }
.mcgs-chat__launcher-arrow svg { width: 100%; height: 100%; }
.mcgs-chat__launcher:hover .mcgs-chat__launcher-arrow { transform: translateX(3px); opacity: 1; }
.mcgs-chat.is-open .mcgs-chat__launcher { opacity: 0; pointer-events: none; transform: scale(.9); }

/* ---------- panel ---------- */
.mcgs-chat__panel {
	position: fixed;
	left: 50%;
	bottom: clamp(1rem, 3vw, 1.6rem);
	transform: translateX(-50%);
	width: min(92vw, 400px);
	height: min(74vh, 580px);
	display: flex;
	flex-direction: column;
	border-radius: 4px;
	overflow: hidden;
	color: var(--k-text);
	background: var(--k-bg);
	border: 1px solid var(--k-border);
	-webkit-backdrop-filter: blur(var(--k-blur));
	backdrop-filter: blur(var(--k-blur));
	box-shadow: 0 10px 30px -12px rgba(21, 20, 26, .18);
	transform-origin: bottom center;
	animation: mcgs-chat-in .22s ease both;
}
.mcgs-chat__panel[hidden] { display: none; }
@keyframes mcgs-chat-in {
	from { opacity: 0; transform: translateX(-50%) translateY(12px) scale(.98); }
	to   { opacity: 1; transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
	.mcgs-chat__panel { animation: none; }
	.mcgs-chat__launcher { transition: none; }
}

/* ---------- header ---------- */
.mcgs-chat__head {
	display: flex;
	align-items: center;
	gap: .7rem;
	padding: .85rem 1rem;
	border-bottom: 1px solid var(--k-border);
	background: linear-gradient(180deg, rgba(20, 107, 107, .08), transparent);
}
.mcgs-chat__avatar {
	flex: none;
	width: 34px; height: 34px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	font-family: "Fraunces", Georgia, serif;
	font-weight: 700;
	font-size: .95rem;
	color: #FCFCFD;
	background: #146B6B;
}
.mcgs-chat__head-text { display: flex; flex-direction: column; line-height: 1.2; flex: 1; min-width: 0; }
.mcgs-chat__head-text strong { font-family: "Fraunces", Georgia, serif; font-size: .95rem; }
.mcgs-chat__head-text span { font-size: .74rem; color: var(--k-dim); }
.mcgs-chat__close {
	flex: none;
	width: 30px; height: 30px;
	display: grid;
	place-items: center;
	border-radius: 4px;
	cursor: pointer;
	color: var(--k-dim);
	background: none;
	border: 0;
	transition: color .15s ease, background .15s ease;
}
.mcgs-chat__close:hover,
.mcgs-chat__close:focus { color: var(--k-gold-light); background: rgba(21, 20, 26, .06); }
.mcgs-chat__close svg { width: 16px; height: 16px; }

/* ---------- message log ---------- */
.mcgs-chat__log {
	flex: 1;
	overflow-y: auto;
	padding: 1rem;
	display: flex;
	flex-direction: column;
	gap: .6rem;
	scrollbar-width: thin;
	scrollbar-color: rgba(20, 107, 107, .3) transparent;
}
.mcgs-chat__log::-webkit-scrollbar { width: 6px; }
.mcgs-chat__log::-webkit-scrollbar-thumb { background: rgba(20, 107, 107, .3); border-radius: 3px; }

.mcgs-chat__msg {
	max-width: 86%;
	padding: .6rem .8rem;
	border-radius: 4px;
	font-size: .9rem;
	line-height: 1.5;
	white-space: pre-wrap;
	word-wrap: break-word;
}
.mcgs-chat__msg--karina {
	align-self: flex-start;
	background: var(--k-glass);
	border: 1px solid var(--k-border);
	border-bottom-left-radius: 4px;
}
.mcgs-chat__msg--user {
	align-self: flex-end;
	background: rgba(20, 107, 107, .16);
	border: 1px solid rgba(20, 107, 107, .3);
	border-bottom-right-radius: 4px;
	color: #15141A;
}
.mcgs-chat__msg a { color: var(--k-gold-light); }

.mcgs-chat__typing {
	align-self: flex-start;
	display: inline-flex;
	gap: 4px;
	padding: .7rem .85rem;
}
.mcgs-chat__typing span {
	width: 6px; height: 6px;
	border-radius: 50%;
	background: var(--k-dim);
	animation: mcgs-chat-dot 1.2s ease-in-out infinite;
}
.mcgs-chat__typing span:nth-child(2) { animation-delay: .15s; }
.mcgs-chat__typing span:nth-child(3) { animation-delay: .3s; }
@keyframes mcgs-chat-dot {
	0%, 60%, 100% { opacity: .25; transform: translateY(0); }
	30% { opacity: 1; transform: translateY(-3px); }
}
@media (prefers-reduced-motion: reduce) {
	.mcgs-chat__typing span { animation: none; opacity: .5; }
}

/* route-to-team CTA inside a message */
.mcgs-chat__route {
	align-self: flex-start;
	margin-top: -.1rem;
}
.mcgs-chat__route button {
	font-family: "Fraunces", Georgia, serif;
	font-weight: 600;
	font-size: .82rem;
	color: var(--k-gold-light);
	background: rgba(20, 107, 107, .16);
	border: 1px solid rgba(20, 107, 107, .42);
	border-radius: 4px;
	padding: .55rem .9rem;
	cursor: pointer;
	transition: background .15s ease;
}
.mcgs-chat__route button:hover,
.mcgs-chat__route button:focus { background: rgba(20, 107, 107, .28); color: var(--k-gold-light); }

/* ---------- input ---------- */
.mcgs-chat__form {
	display: flex;
	align-items: flex-end;
	gap: .5rem;
	padding: .7rem;
	border-top: 1px solid var(--k-border);
}
.mcgs-chat__input {
	flex: 1;
	resize: none;
	max-height: 96px;
	font-family: inherit;
	font-size: .9rem;
	line-height: 1.4;
	color: var(--k-text);
	background: var(--k-glass);
	border: 1px solid var(--k-border);
	border-radius: 4px;
	padding: .6rem .75rem;
	transition: border-color .15s ease, background .15s ease;
}
/* keep it light on focus — the theme forces form fields dark when focused */
.mcgs-chat__input:focus,
.mcgs-chat__input:hover {
	outline: none;
	color: var(--k-text);
	background: var(--k-bg);
	border-color: rgba(20, 107, 107, .5);
}
.mcgs-chat__input::placeholder { color: var(--k-dim); opacity: .7; }
.mcgs-chat__send {
	flex: none;
	width: 38px; height: 38px;
	display: grid;
	place-items: center;
	border-radius: 4px;
	cursor: pointer;
	color: #FCFCFD;
	background: #146B6B;
	border: 0;
	transition: transform .15s ease, opacity .15s ease;
}
.mcgs-chat__send:hover,
.mcgs-chat__send:focus,
.mcgs-chat__send:active {
	background: #146B6B;
	color: #FCFCFD;
	transform: translateY(-1px);
	box-shadow: 0 0 14px -2px rgba(95, 232, 227, .5);
}
.mcgs-chat__send:disabled { opacity: .4; cursor: default; transform: none; box-shadow: none; }
.mcgs-chat__send svg { width: 17px; height: 17px; }

.mcgs-chat__disclaimer {
	margin: 0;
	padding: 0 1rem .8rem;
	font-size: .7rem;
	color: var(--k-dim);
	text-align: center;
}
.mcgs-chat__disclaimer a { color: var(--k-dim); text-decoration: underline; }
.mcgs-chat__disclaimer a:hover { color: var(--k-gold-light); }

/* ---------- mobile ---------- */
@media (max-width: 480px) {
	.mcgs-chat { bottom: 1rem; }
	.mcgs-chat__launcher { font-size: .9rem; padding: .8rem 1.15rem .8rem .95rem; }
	.mcgs-chat__panel {
		left: 0;
		width: 100vw;
		height: 100dvh;
		height: 100vh;
		border-radius: 0;
		bottom: 0;
		transform: none;
		animation: none;
	}
}

/* keyboard focus (§10) */
.mcgs-chat__launcher:focus-visible,
.mcgs-chat__send:focus-visible,
.mcgs-chat__route button:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px rgba(95, 232, 227, .5);
}