/**
 * TurfMan live chat widget — self-contained, themed to the site (forest / lime /
 * cream). All selectors are namespaced .ttmc- to avoid collisions.
 *
 * @package TheTurfMan\Core
 */

.ttmc {
	--ttmc-forest: #10261b;
	--ttmc-forest-2: #1c3d2b;
	--ttmc-lime: #285d42;
	--ttmc-orange: #285d42;
	--ttmc-cream: #f6f5ed;
	--ttmc-ink: #10261b;
	--ttmc-mu: #6c7d73;
	--ttmc-bd: #e0e7da;
	--ttmc-bot-bg: #f6f5ed;
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 2147483000;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	font-size: 15px;
	line-height: 1.5;
}
.ttmc *, .ttmc *::before, .ttmc *::after { box-sizing: border-box; }

/* ---- Launcher ---- */
.ttmc__launcher {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	border: 0;
	cursor: pointer;
	background: var(--ttmc-forest);
	color: #fff;
	box-shadow: 0 10px 30px rgba(26, 51, 32, .35);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform .18s ease, background .18s ease;
}
.ttmc__launcher:hover { transform: translateY(-2px) scale(1.04); background: var(--ttmc-forest-2); }
.ttmc__launcher:focus-visible { outline: 3px solid var(--ttmc-lime); outline-offset: 3px; }
.ttmc__launcher svg { width: 28px; height: 28px; }
.ttmc__launcher-close { display: none; }
.ttmc.is-open .ttmc__launcher-open { display: none; }
.ttmc.is-open .ttmc__launcher-close { display: block; }
.ttmc__badge {
	position: absolute;
	top: -2px;
	right: -2px;
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	border-radius: 999px;
	background: var(--ttmc-orange);
	color: #fff;
	font-size: 11px;
	font-weight: 800;
	display: none;
	align-items: center;
	justify-content: center;
	border: 2px solid #fff;
}
.ttmc.has-unread .ttmc__badge { display: flex; }
.ttmc.is-open .ttmc__badge { display: none; }

/* ---- Panel ---- */
.ttmc__panel {
	position: absolute;
	right: 0;
	bottom: 76px;
	width: 376px;
	max-width: calc(100vw - 40px);
	height: 70vh;
	max-height: 620px;
	background: #fff;
	border-radius: 18px;
	box-shadow: 0 24px 70px rgba(20, 40, 24, .32);
	display: none;
	flex-direction: column;
	overflow: hidden;
	opacity: 0;
	transform: translateY(12px);
	transition: opacity .2s ease, transform .2s ease;
}
.ttmc.is-open .ttmc__panel { display: flex; }
.ttmc.is-shown .ttmc__panel { opacity: 1; transform: translateY(0); }

/* ---- Header ---- */
.ttmc__header {
	background: var(--ttmc-forest);
	color: #fff;
	padding: 16px 18px;
	display: flex;
	align-items: center;
	gap: 12px;
}
.ttmc__avatar {
	width: 42px; height: 42px; border-radius: 50%;
	background: var(--ttmc-lime); color: var(--ttmc-forest);
	display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.ttmc__avatar svg { width: 24px; height: 24px; }
.ttmc__htext { flex: 1; min-width: 0; }
.ttmc__title { font-weight: 800; font-size: 15px; }
.ttmc__status { font-size: 12px; color: rgba(255, 255, 255, .72); display: flex; align-items: center; gap: 6px; }
.ttmc__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ttmc-lime); display: inline-block; }
.ttmc__close {
	background: rgba(255, 255, 255, .12); border: 0; color: #fff; width: 30px; height: 30px;
	border-radius: 8px; cursor: pointer; font-size: 18px; line-height: 1; flex-shrink: 0;
}
.ttmc__close:hover { background: rgba(255, 255, 255, .22); }

/* ---- Messages ---- */
.ttmc__body {
	flex: 1;
	overflow-y: auto;
	padding: 16px;
	background: var(--ttmc-cream);
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.ttmc__msg { max-width: 84%; padding: 9px 13px; border-radius: 14px; word-wrap: break-word; }
.ttmc__msg a { color: var(--ttmc-forest); font-weight: 600; }
.ttmc__msg--bot { background: #fff; color: var(--ttmc-ink); border: 1px solid var(--ttmc-bd); border-bottom-left-radius: 4px; align-self: flex-start; }
.ttmc__msg--user { background: var(--ttmc-forest); color: #fff; border-bottom-right-radius: 4px; align-self: flex-end; }
.ttmc__msg--user a { color: #fff; }

.ttmc__typing { display: inline-flex; gap: 4px; align-items: center; }
.ttmc__typing span { width: 7px; height: 7px; border-radius: 50%; background: var(--ttmc-mu); opacity: .5; animation: ttmc-bounce 1s infinite; }
.ttmc__typing span:nth-child(2) { animation-delay: .15s; }
.ttmc__typing span:nth-child(3) { animation-delay: .3s; }
@keyframes ttmc-bounce { 0%, 60%, 100% { transform: translateY(0); opacity: .4; } 30% { transform: translateY(-4px); opacity: .9; } }

/* ---- Product / info card ---- */
.ttmc__card {
	align-self: flex-start;
	max-width: 84%;
	background: #fff;
	border: 1px solid var(--ttmc-bd);
	border-radius: 14px;
	padding: 12px 14px;
	border-bottom-left-radius: 4px;
}
.ttmc__card-title { font-weight: 800; color: var(--ttmc-forest); }
.ttmc__card-price { color: var(--ttmc-orange); font-weight: 800; }
.ttmc__card-meta { font-size: 13px; color: var(--ttmc-mu); margin-top: 3px; }
.ttmc__card-link {
	display: inline-block; margin-top: 8px; font-weight: 700; font-size: 13px;
	color: var(--ttmc-forest); text-decoration: none;
}
.ttmc__card-link:hover { color: var(--ttmc-orange); }

/* ---- Quick replies ---- */
.ttmc__chips { display: flex; flex-wrap: wrap; gap: 7px; margin: 2px 0 2px; }
.ttmc__chip {
	background: #fff; border: 1.5px solid var(--ttmc-forest); color: var(--ttmc-forest);
	border-radius: 999px; padding: 6px 13px; font-size: 13px; font-weight: 700;
	cursor: pointer; transition: background .15s, color .15s;
}
.ttmc__chip:hover { background: var(--ttmc-forest); color: #fff; }
.ttmc__chip--primary { background: var(--ttmc-lime); border-color: var(--ttmc-lime); color: var(--ttmc-forest); }
.ttmc__chip--primary:hover { background: var(--ttmc-forest); border-color: var(--ttmc-forest); color: #fff; }
.ttmc__chip--human { background: var(--ttmc-orange); border-color: var(--ttmc-orange); color: #fff; }
.ttmc__chip--human:hover { background: #234f39; border-color: #234f39; }

/* ---- Hand-off form ---- */
.ttmc__form { align-self: stretch; background: #fff; border: 1px solid var(--ttmc-bd); border-radius: 14px; padding: 14px; }
.ttmc__form h4 { margin: 0 0 4px; color: var(--ttmc-forest); font-size: 15px; }
.ttmc__form p { margin: 0 0 10px; font-size: 13px; color: var(--ttmc-mu); }
.ttmc__field { width: 100%; padding: 9px 11px; border: 1.5px solid var(--ttmc-bd); border-radius: 9px; font-size: 14px; margin-bottom: 8px; font-family: inherit; }
.ttmc__field:focus { outline: 0; border-color: var(--ttmc-forest); }
textarea.ttmc__field { resize: vertical; min-height: 64px; }
.ttmc__submit {
	width: 100%; background: var(--ttmc-forest); color: #fff; border: 0; border-radius: 9px;
	padding: 11px; font-weight: 800; font-size: 14px; cursor: pointer; transition: background .15s;
}
.ttmc__submit:hover { background: var(--ttmc-forest-2); }
.ttmc__submit:disabled { opacity: .6; cursor: default; }
.ttmc__error { color: var(--ttmc-orange); font-size: 13px; margin: 4px 0 0; }

/* ---- Input bar ---- */
.ttmc__inputbar { display: flex; gap: 8px; padding: 12px; background: #fff; border-top: 1px solid var(--ttmc-bd); }
.ttmc__input {
	flex: 1; border: 1.5px solid var(--ttmc-bd); border-radius: 999px; padding: 10px 15px;
	font-size: 14px; font-family: inherit; min-width: 0;
}
.ttmc__input:focus { outline: 0; border-color: var(--ttmc-forest); }
.ttmc__send {
	width: 42px; height: 42px; flex-shrink: 0; border: 0; border-radius: 50%;
	background: var(--ttmc-forest); color: #fff; cursor: pointer; display: flex;
	align-items: center; justify-content: center; transition: background .15s;
}
.ttmc__send:hover { background: var(--ttmc-forest-2); }
.ttmc__send svg { width: 20px; height: 20px; }

.ttmc__foot { text-align: center; font-size: 11px; color: var(--ttmc-mu); padding: 0 0 8px; background: #fff; }

/* ---- Mobile: full screen ---- */
@media (max-width: 480px) {
	.ttmc { right: 14px; bottom: 14px; }
	.ttmc__panel {
		position: fixed; right: 0; left: 0; top: 0; bottom: 0;
		width: 100vw; max-width: 100vw; height: 100dvh; max-height: none; border-radius: 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ttmc__panel, .ttmc__launcher { transition: none; }
	.ttmc__typing span { animation: none; }
}