/* TapTrace — front-end widget. Squared card, circular minimise FABs. */
.lcw-widget {
	--lcw-primary: #25D366;
	--lcw-wa-text: #ffffff;
	--lcw-call: #2563EB;
	--lcw-call-text: #ffffff;
	--lcw-text: #111827;
	--lcw-shadow: 0 14px 40px rgba(15,23,42,.18);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	line-height: 1.45;
	text-align: left;
	box-sizing: border-box;
}
.lcw-widget *, .lcw-widget *::before, .lcw-widget *::after { box-sizing: border-box; border-radius: 0; }

/* Defensive resets — the host theme must not bleed in */
.lcw-widget button, .lcw-widget input {
	margin: 0; font-family: inherit; letter-spacing: normal;
	text-transform: none; text-shadow: none; box-shadow: none;
	min-width: 0; width: auto; max-width: none; float: none; outline: 0;
}
.lcw-widget button { line-height: 1.2; cursor: pointer; }
.lcw-widget .lcw-title, .lcw-widget .lcw-subtitle, .lcw-widget .lcw-label,
.lcw-widget .lcw-trust, .lcw-widget .lcw-btn, .lcw-widget .lcw-dial {
	text-transform: none; letter-spacing: normal;
}
.lcw-widget svg { vertical-align: middle; }

/* ---------------- Card ---------------- */
.lcw-card {
	background: #fff;
	border: 1px solid #e6e8ec;
	box-shadow: var(--lcw-shadow);
	overflow: hidden;
	width: 360px;
	max-width: calc(100vw - 40px);
	max-height: calc(100vh - 40px);
}
.lcw-card-head {
	display: flex; align-items: center; gap: 12px;
	padding: 16px 16px 14px; border-bottom: 1px solid #f0f1f4;
}
.lcw-avatar {
	width: 38px; height: 38px; background: var(--lcw-primary); color: #fff;
	display: flex; align-items: center; justify-content: center; flex: none;
}
.lcw-head-text { flex: 1; min-width: 0; }
.lcw-title { font-size: 16px; font-weight: 600; color: var(--lcw-text); line-height: 1.3; }
.lcw-subtitle { font-size: 12.5px; color: #6b7280; margin-top: 3px; line-height: 1.35; }
.lcw-min { background: transparent; border: 0; cursor: pointer; color: #9aa1ad; padding: 6px; line-height: 1; display: flex; align-items: center; }
.lcw-min:hover { background: #f1f3f5; color: #4b5563; }
.lcw-min-m { display: none; }

.lcw-theme-dark .lcw-card-head { background: #0f172a; border-bottom-color: #0f172a; }
.lcw-theme-dark .lcw-title { color: #fff; }
.lcw-theme-dark .lcw-subtitle { color: #94a3b8; }
.lcw-theme-dark .lcw-min { color: #94a3b8; }
.lcw-theme-dark .lcw-min:hover { background: rgba(255,255,255,.08); color: #e5e7eb; }

.lcw-card-body { padding: 16px; }
.lcw-label { font-size: 12.5px; font-weight: 500; color: #4b5563; margin: 0 0 8px; }

/* ---------------- Field ---------------- */
.lcw-field { display: flex; align-items: stretch; border: 1px solid #cbd0d6; overflow: hidden; transition: border-color .15s ease, box-shadow .15s ease; }
.lcw-field.lcw-focus { border-color: var(--lcw-primary); box-shadow: 0 0 0 3px rgba(37,211,102,.15); }
.lcw-field.lcw-invalid { border-color: #ef4444; box-shadow: 0 0 0 3px rgba(239,68,68,.15); }
.lcw-dial { display: inline-flex; align-items: center; padding: 0 13px; background: #f6f7f9; border-right: 1px solid #e5e7eb; color: #374151; font-size: 14.5px; font-weight: 600; white-space: nowrap; }
.lcw-input { flex: 1; min-width: 0; border: 0; padding: 12px 13px; font-size: 16px; color: var(--lcw-text); background: #fff; }
.lcw-input::placeholder { color: #9aa1ad; }
.lcw-error { margin: 8px 0 0; color: #dc2626; font-size: 12.5px; font-weight: 500; }
.lcw-error[hidden] { display: none; }

/* ---------------- Buttons ---------------- */
.lcw-actions { display: flex; gap: 10px; margin-top: 14px; }
.lcw-btn { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 10px; border: 0; font-size: 14px; font-weight: 600; cursor: pointer; white-space: nowrap; transition: filter .15s ease, transform .08s ease; }
.lcw-btn svg { flex: none; }
.lcw-btn:hover { filter: brightness(1.06); }
.lcw-btn:active { transform: scale(.985); }
.lcw-btn:focus-visible { outline: 3px solid rgba(0,0,0,.22); outline-offset: 2px; }
.lcw-call { background: var(--lcw-call); color: var(--lcw-call-text); }
.lcw-wa   { background: var(--lcw-primary); color: var(--lcw-wa-text); }
.lcw-trust { display: flex; align-items: center; gap: 6px; justify-content: center; font-size: 11.5px; color: #9aa1ad; margin-top: 12px; }

/* ---------------- Minimised: circular FABs with ripple ---------------- */
.lcw-fab-group { display: none; flex-direction: column; gap: 14px; align-items: center; }
.lcw-fab {
	position: relative;
	width: 56px; height: 56px;
	border-radius: 50%;
	border: 0; display: flex; align-items: center; justify-content: center;
	color: #fff; cursor: pointer;
	box-shadow: 0 8px 22px rgba(15,23,42,.24);
}
.lcw-fab svg { position: relative; z-index: 2; width: 24px; height: 24px; }
.lcw-fab-wa { background: var(--lcw-primary); color: var(--lcw-wa-text); }
.lcw-fab-call { background: var(--lcw-call); color: var(--lcw-call-text); }
.lcw-fab:hover { filter: brightness(1.05); }
.lcw-fab:active { transform: scale(.96); }
.lcw-fab:focus-visible { outline: 3px solid rgba(0,0,0,.28); outline-offset: 3px; }
/* Ripple: two staggered expanding rings behind the FAB */
.lcw-fab::before, .lcw-fab::after {
	content: ""; position: absolute; inset: 0; border-radius: 50%; z-index: 0;
	animation: lcw-ripple 2s ease-out infinite;
}
.lcw-fab::after { animation-delay: 1s; }
.lcw-fab-wa::before, .lcw-fab-wa::after { background: var(--lcw-primary); }
.lcw-fab-call::before, .lcw-fab-call::after { background: var(--lcw-call); }
@keyframes lcw-ripple { 0% { transform: scale(1); opacity: .45; } 100% { transform: scale(1.9); opacity: 0; } }

/* ---------------- Inline placement ---------------- */
.lcw-inline-wrap .lcw-card { position: static; width: 100%; max-width: 420px; max-height: none; box-shadow: none; border: 1px solid #e5e7eb; }

/* ================ Floating positioning ================ */
.lcw-float .lcw-card, .lcw-float .lcw-fab-group { position: fixed; z-index: 2147483000; }

/* FAB group placement follows the position setting (both desktop and mobile) */
.lcw-float.lcw-fab-pos-right  .lcw-fab-group { right: 24px; bottom: 24px; }
.lcw-float.lcw-fab-pos-left   .lcw-fab-group { left: 24px; bottom: 24px; }
.lcw-float.lcw-fab-pos-bottom-center .lcw-fab-group,
.lcw-float.lcw-fab-pos-center .lcw-fab-group { left: 50%; transform: translateX(-50%); bottom: 24px; }

.lcw-float[data-collapsed="1"] .lcw-card { display: none; }
.lcw-float[data-collapsed="1"] .lcw-fab-group { display: flex; }

/* Desktop / tablet card position */
@media (min-width: 769px) {
	.lcw-float.lcw-form-pos-right  .lcw-card { right: 24px; bottom: 24px; }
	.lcw-float.lcw-form-pos-left   .lcw-card { left: 24px; bottom: 24px; }
	.lcw-float.lcw-form-pos-bottom-center .lcw-card { left: 50%; bottom: 24px; transform: translateX(-50%); }
	.lcw-float.lcw-form-pos-center .lcw-card { left: 50%; top: 50%; transform: translate(-50%, -50%); }
}

/* Mobile: card becomes a full-width bottom sheet */
@media (max-width: 768px) {
	.lcw-float .lcw-card {
		left: 0; right: 0; bottom: 0; top: auto;
		width: 100%; max-width: none; max-height: 88vh; transform: none;
		box-shadow: 0 -8px 22px rgba(15,23,42,.14);
		padding-bottom: env(safe-area-inset-bottom, 0px); overflow: auto;
	}
	.lcw-float .lcw-subtitle, .lcw-float .lcw-label, .lcw-float .lcw-trust { display: none; }
	.lcw-min-d { display: none; }
	.lcw-min-m { display: flex; }
}

@media (prefers-reduced-motion: reduce) {
	.lcw-btn, .lcw-fab, .lcw-field { transition: none !important; }
	.lcw-fab::before, .lcw-fab::after { animation: none !important; display: none !important; }
}

/* Honeypot */
.lcw-hp-wrap { position: absolute !important; left: -9999px !important; top: auto; width: 1px; height: 1px; overflow: hidden; }