/* Synergium chat widget — floating launcher (chat + WhatsApp) and guided panel. */
.syn-chat { position:fixed; right:20px; bottom:20px; z-index:70; font-family:var(--font-sans); }

/* Launcher: a single round chat button (icon only). */
.syn-chat-fab.syn-chat-open { width:58px; height:58px; border-radius:50%; background:var(--crimson); color:#fff; border:0; cursor:pointer; display:grid; place-items:center; box-shadow:0 12px 30px -8px rgba(20,17,15,.45); transition:transform .16s ease, filter .16s ease; }
.syn-chat-open:hover { filter:brightness(1.06); transform:translateY(-2px); }
.syn-chat-open svg { width:24px; height:24px; }

/* Panel. */
.syn-chat-window { position:absolute; right:0; bottom:72px; width:min(360px, calc(100vw - 40px)); height:min(540px, calc(100vh - 140px)); background:var(--surface); border:1px solid var(--line); border-radius:18px; box-shadow:0 26px 64px -22px rgba(20,17,15,.55); display:flex; flex-direction:column; overflow:hidden; }
.syn-chat-window[hidden] { display:none; }
.syn-chat-top { background:var(--ink-canvas); color:#fff; padding:.85rem 1rem .85rem 1.1rem; display:flex; align-items:center; justify-content:space-between; flex:none; }
.syn-chat-brand { display:inline-flex; align-items:center; }
.syn-chat-brand svg { height:20px; width:auto; }
.syn-chat-actions { display:flex; align-items:center; gap:.5rem; }
.syn-chat-wa-mini { width:32px; height:32px; border-radius:50%; background:#25D366; color:#fff; display:grid; place-items:center; text-decoration:none; transition:filter .16s ease; }
.syn-chat-wa-mini:hover { filter:brightness(1.08); }
.syn-chat-wa-mini svg { width:18px; height:18px; }
.syn-chat-close { background:transparent; border:0; color:rgba(255,255,255,.75); font-size:1.5rem; line-height:1; cursor:pointer; padding:0 .15em; }
.syn-chat-close:hover { color:#fff; }

.syn-chat-body { flex:1; overflow-y:auto; padding:1rem; display:flex; flex-direction:column; gap:.55rem; background:var(--paper); }
.syn-msg { max-width:82%; padding:.62em .85em; border-radius:14px; font-size:.92rem; line-height:1.45; }
.syn-msg--bot { background:var(--surface); border:1px solid var(--line); color:var(--ink); align-self:flex-start; border-bottom-left-radius:5px; }
.syn-msg--bot small { color:var(--muted); }
.syn-msg--user { background:var(--crimson); color:#fff; align-self:flex-end; border-bottom-right-radius:5px; }

.syn-chat-input { padding:.8rem; border-top:1px solid var(--line); background:var(--surface); display:flex; flex-wrap:wrap; gap:.5rem; flex:none; }
.syn-opt { background:var(--crimson-tint); color:var(--crimson-deep); border:1px solid transparent; border-radius:999px; padding:.55em 1em; font-size:.88rem; font-family:inherit; cursor:pointer; text-decoration:none; transition:background .16s ease, color .16s ease; }
.syn-opt:hover { background:var(--crimson); color:#fff; }
.syn-opt--wa { background:#25D366; color:#fff; }
.syn-opt--wa:hover { background:#1EBE5A; color:#fff; }
.syn-chat-field { display:flex; gap:.5rem; width:100%; }
.syn-chat-field input { flex:1; min-width:0; padding:.72em .85em; border:1px solid var(--line-2); border-radius:10px; font:inherit; color:var(--ink); }
.syn-chat-field input:focus { outline:2px solid var(--crimson); outline-offset:1px; border-color:var(--crimson); }
.syn-chat-send { background:var(--crimson); color:#fff; border:0; border-radius:10px; padding:0 1.1em; font-family:inherit; font-weight:600; cursor:pointer; }
.syn-chat-send:hover { background:var(--crimson-deep); }

@media (max-width:560px) {
	.syn-chat { right:14px; bottom:14px; }
	.syn-chat-window { width:calc(100vw - 28px); height:min(70vh, 520px); }
}