/* Floating support launcher (live chat / Telegram / WhatsApp). Shared by every layout. */
.sl-root { position: fixed; bottom: 20px; z-index: 9990; font-family: "Sansation", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.sl-root--left { left: 20px; }
.sl-root--right { right: 20px; align-items: flex-end; }
@media (max-width: 639px) { .sl-root { bottom: 14px; } .sl-root--left { left: 14px; } .sl-root--right { right: 14px; } }

.sl-btn { display: inline-flex; align-items: center; gap: 0.55rem; height: 52px; padding: 0 1.15rem 0 0.85rem; border: 0; border-radius: 9999px; cursor: pointer; color: #fff; font: inherit; font-size: 15px; font-weight: 700; letter-spacing: 0.02em; background: linear-gradient(180deg, #8dddff 0%, #3385ff 100%); box-shadow: 0 14px 40px -12px rgba(51, 133, 255, 0.85), 0 4px 14px rgba(0, 0, 0, 0.35); position: relative; transition: transform 0.25s ease, box-shadow 0.25s ease; }
.sl-btn:hover { transform: translateY(-2px); box-shadow: 0 18px 44px -12px rgba(51, 133, 255, 0.95), 0 6px 16px rgba(0, 0, 0, 0.35); }
.sl-btn:focus-visible { outline: 3px solid rgba(141, 221, 255, 0.7); outline-offset: 3px; }
.sl-btn-icon { position: relative; width: 26px; height: 26px; display: inline-grid; place-items: center; }
.sl-btn-icon svg { position: absolute; inset: 0; width: 26px; height: 26px; transition: opacity 0.2s ease, transform 0.25s ease; }
.sl-ic-close { opacity: 0; transform: rotate(-90deg) scale(0.6); }
.sl-root.is-open .sl-ic-open { opacity: 0; transform: rotate(90deg) scale(0.6); }
.sl-root.is-open .sl-ic-close { opacity: 1; transform: none; }
.sl-dot { position: absolute; top: 6px; right: 8px; width: 10px; height: 10px; border-radius: 9999px; background: #5ef0a5; border: 2px solid #0a1f4d; box-shadow: 0 0 0 0 rgba(94, 240, 165, 0.7); animation: sl-pulse 2s ease-out infinite; }
.sl-root.is-open .sl-dot { display: none; }
@keyframes sl-pulse { 0% { box-shadow: 0 0 0 0 rgba(94, 240, 165, 0.7); } 70% { box-shadow: 0 0 0 8px rgba(94, 240, 165, 0); } 100% { box-shadow: 0 0 0 0 rgba(94, 240, 165, 0); } }
@media (max-width: 480px) { .sl-btn-label { display: none; } .sl-btn { padding: 0 0.85rem; } }

.sl-panel { width: min(340px, calc(100vw - 28px)); border-radius: 22px; border: 1px solid rgba(255, 255, 255, 0.14); background: linear-gradient(160deg, #0a1f4d 0%, #061636 60%, #040f2a 100%); color: #fff; box-shadow: 0 30px 80px -30px rgba(0, 0, 0, 0.85), 0 0 0 1px rgba(0, 0, 0, 0.3); overflow: hidden; transform-origin: bottom left; animation: sl-in 0.25s cubic-bezier(0.2, 0.8, 0.2, 1); }
.sl-root--right .sl-panel { transform-origin: bottom right; }
.sl-panel[hidden] { display: none; }
@keyframes sl-in { from { opacity: 0; transform: translateY(10px) scale(0.96); } to { opacity: 1; transform: none; } }
.sl-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1.1rem 1.1rem 0.9rem; background: linear-gradient(180deg, rgba(141, 221, 255, 0.12) 0%, rgba(141, 221, 255, 0) 100%); border-bottom: 1px solid rgba(255, 255, 255, 0.08); }
.sl-head strong { display: block; font-size: 17px; }
.sl-head span { display: block; margin-top: 0.25rem; font-size: 13px; line-height: 1.45; color: rgba(255, 255, 255, 0.72); }
.sl-close { flex: 0 0 auto; width: 32px; height: 32px; display: grid; place-items: center; border: 0; border-radius: 9999px; background: rgba(255, 255, 255, 0.08); color: #fff; cursor: pointer; }
.sl-close:hover { background: rgba(255, 255, 255, 0.16); }
.sl-close svg { width: 16px; height: 16px; }
.sl-list { list-style: none; margin: 0; padding: 0.6rem; display: grid; gap: 0.4rem; }
.sl-item { display: flex; align-items: center; gap: 0.8rem; padding: 0.7rem 0.8rem; border-radius: 14px; text-decoration: none; color: #fff; border: 1px solid rgba(255, 255, 255, 0.08); background: rgba(255, 255, 255, 0.04); transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease; }
.sl-item:hover { background: rgba(255, 255, 255, 0.09); border-color: rgba(255, 255, 255, 0.18); transform: translateX(2px); }
.sl-icon { flex: 0 0 auto; width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; color: #fff; }
.sl-icon svg { width: 22px; height: 22px; }
.sl-item--livechat .sl-icon { background: linear-gradient(180deg, #8dddff, #3385ff); }
.sl-item--telegram .sl-icon { background: #229ED9; }
.sl-item--whatsapp .sl-icon { background: #25D366; }
.sl-item--email .sl-icon { background: rgba(255, 255, 255, 0.14); }
.sl-item--phone .sl-icon { background: rgba(255, 255, 255, 0.14); }
.sl-text { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.sl-text strong { font-size: 15px; }
.sl-text small { font-size: 12.5px; color: rgba(255, 255, 255, 0.68); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sl-arrow { width: 16px; height: 16px; color: rgba(255, 255, 255, 0.5); flex: 0 0 auto; }
.sl-foot { margin: 0; padding: 0.4rem 1.1rem 1rem; font-size: 12.5px; color: rgba(255, 255, 255, 0.65); }
.sl-foot a { color: #8dddff; text-decoration: none; }
@media (prefers-reduced-motion: reduce) { .sl-panel, .sl-dot { animation: none; } }