/* ═══════════════════════════════════════════════════
   Formax Chat Widget CSS v5.1
   ID-based selectors + !important to beat theme CSS
═══════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap');

#_fw,#_fw *,#_fw *::before,#_fw *::after{box-sizing:border-box;font-family:'DM Sans',system-ui,sans-serif;line-height:normal}

/* LAUNCHER */
#_fb{display:flex!important;align-items:center!important;gap:10px!important;border:none!important;cursor:pointer!important;white-space:nowrap!important;position:relative!important;transition:transform .2s,filter .2s!important;text-decoration:none!important}
#_fb:hover{transform:translateY(-2px)!important;filter:brightness(1.08)!important}
#_fbico{width:26px;height:26px;display:flex!important;align-items:center!important;justify-content:center!important;flex-shrink:0!important}
/* Button text – theme resets strong/em to inline, force block */
#_fbtxt{display:flex!important;flex-direction:column!important;line-height:1.25!important;gap:1px!important}
#_fbtxt strong{display:block!important;font-weight:700!important;font-size:13px!important;color:inherit!important;margin:0!important;padding:0!important}
#_fbtxt em{display:block!important;font-style:normal!important;font-size:11px!important;opacity:.82!important;color:inherit!important;margin:0!important;padding:0!important}
#_fxp{position:absolute!important;top:-8px!important;right:-8px!important;width:20px!important;height:20px!important;border-radius:50%!important;background:#333!important;color:#fff!important;border:2px solid #fff!important;font-size:9px!important;font-weight:800!important;display:none!important;align-items:center!important;justify-content:center!important;cursor:pointer!important;line-height:1!important;z-index:1!important}
#_fw.on #_fxp{display:flex!important}

/* PANEL */
#_fpnl{display:flex!important;flex-direction:column!important;overflow:hidden!important;transform-origin:bottom right!important;transform:scale(.82) translateY(24px)!important;opacity:0!important;pointer-events:none!important;transition:transform .3s cubic-bezier(.34,1.56,.64,1),opacity .22s ease!important;box-shadow:0 12px 48px rgba(0,0,0,.2)!important}
#_fw.on #_fpnl{transform:scale(1) translateY(0)!important;opacity:1!important;pointer-events:all!important}
/* Minimized/maximized – panel size controlled by JS (not CSS)
   because inline !important would override stylesheet !important */
#_fw.mn #_fstr,#_fw.mn #_fxm,#_fw.mn #_fxir,#_fw.mn #_fbranches,#_fw.mn #_fft{display:none!important}

/* HEADER */
#_fhdr{padding:10px 12px!important;display:flex!important;align-items:center!important;gap:10px!important;flex-shrink:0!important}
#_fhi{flex:1!important;min-width:0!important}
#_fhi strong{display:block!important;font-size:13px!important;font-weight:700!important;margin:0!important;padding:0!important}
#_fhi span{font-size:11px!important;color:#888!important}
._fonl{display:inline-block!important;width:6px!important;height:6px!important;border-radius:50%!important;background:#22c55e!important;margin-right:4px!important;vertical-align:middle!important}

/* WINDOW BUTTONS – force display:flex, theme often resets to block */
#_fwb{display:flex!important;gap:5px!important;align-items:center!important;margin-left:auto!important;flex-shrink:0!important}
#_fw ._fwbtn{width:16px!important;height:16px!important;min-width:16px!important;max-width:16px!important;min-height:16px!important;max-height:16px!important;border-radius:50%!important;border:none!important;cursor:pointer!important;display:flex!important;align-items:center!important;justify-content:center!important;font-size:10px!important;font-weight:800!important;line-height:1!important;padding:0!important;margin:0!important;flex-shrink:0!important;transition:filter .15s!important;box-sizing:border-box!important;aspect-ratio:1!important}
#_fw ._fwbtn:hover{filter:brightness(.8)!important;transform:scale(1.15)!important}

/* STRIPE */
#_fstr{font-size:10.5px!important;font-weight:700!important;letter-spacing:.8px!important;text-transform:uppercase!important;padding:4px 14px!important;text-align:center!important;flex-shrink:0!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;color:#fff!important}
._fon{background:rgba(255,255,255,.2)!important;border-radius:4px!important;padding:1px 8px!important;font-size:9.5px!important;font-weight:700!important;letter-spacing:1px!important}

/* MESSAGES – NO scroll-behavior:smooth (causes lag on every scrollTop= call) */
#_fxm{flex:1!important;overflow-y:auto!important;padding:14px 14px 8px!important;display:flex!important;flex-direction:column!important;gap:10px!important;overflow-anchor:none!important;min-height:0!important;-webkit-overflow-scrolling:touch}
#_fxm::-webkit-scrollbar{width:4px!important}
#_fxm::-webkit-scrollbar-thumb{background:#e0e0e0!important;border-radius:4px!important}
._fm{display:flex!important;gap:7px!important;align-items:flex-end!important;animation:_fin .2s ease!important;max-width:100%!important}
@keyframes _fin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
._fm.b{align-self:flex-start!important}
._fm.u{align-self:flex-end!important;flex-direction:row-reverse!important}

/* AVATAR – no background when logo image is used */
._fav{width:28px!important;height:28px!important;border-radius:50%!important;display:flex!important;align-items:center!important;justify-content:center!important;flex-shrink:0!important;overflow:hidden!important}
._fav svg{width:14px!important;height:14px!important;fill:#fff!important}
/* Logo image: contain (no crop), transparent bg */
._fav img{width:100%!important;height:100%!important;object-fit:contain!important;border-radius:0!important;background:transparent!important}
._fav:has(img){background:transparent!important}

._fbb{max-width:80%!important;padding:9px 13px!important;border-radius:14px!important;line-height:1.55!important;font-size:13.5px!important;word-break:break-word!important}
._fm.b ._fbb{border-bottom-left-radius:4px!important}
._fm.u ._fbb{border-bottom-right-radius:4px!important}
._fbb strong{font-weight:700!important}

/* QUICK QUESTIONS */
#_fxqk{display:flex!important;flex-direction:column!important;gap:5px!important;margin-top:2px!important;flex-shrink:0!important}
._fqb{background:#fff!important;border:1.5px solid #e5e5e5!important;border-radius:18px!important;padding:7px 13px!important;font-size:13px!important;color:#333!important;text-align:left!important;display:flex!important;align-items:center!important;gap:7px!important;font-family:inherit!important;cursor:pointer!important;width:100%!important;box-shadow:none!important;text-decoration:none!important;transition:border-color .15s,background .15s!important}

/* INPUT */
#_fxir{padding:9px 11px!important;border-top:1px solid #f0f0f0!important;display:flex!important;align-items:center!important;gap:7px!important;flex-shrink:0!important;background:#fff!important}
#_fxi{flex:1!important;border:1.5px solid #e8e8e8!important;border-radius:18px!important;padding:8px 14px!important;font-size:13px!important;font-family:inherit!important;outline:none!important;background:#f8f8f8!important;color:#1a1a1a!important;transition:border .2s!important;box-shadow:none!important;margin:0!important}
#_fxi::placeholder{color:#bbb!important}
#_fxs{width:36px!important;height:36px!important;border-radius:50%!important;color:#fff!important;border:none!important;cursor:pointer!important;display:flex!important;align-items:center!important;justify-content:center!important;flex-shrink:0!important;transition:filter .15s!important;padding:0!important}
#_fxs:hover{filter:brightness(.88)!important;transform:scale(1.06)!important}
#_fxs.ld{background:#ccc!important;pointer-events:none!important}

/* BRANCHES */
#_fbranches{flex-shrink:0!important;border-top:1px solid #f0f0f0!important;background:#fafafa!important;max-height:220px!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch}
#_fbranches::-webkit-scrollbar{width:3px!important}
#_fbranches::-webkit-scrollbar-thumb{background:#ddd!important;border-radius:3px!important}
#_fbrhdr{display:flex!important;align-items:center!important;gap:8px!important;padding:8px 14px!important;cursor:pointer!important;user-select:none!important;position:sticky!important;top:0!important;background:#fafafa!important;z-index:1!important;border-bottom:1px solid #f0f0f0!important}
#_fbrhdr:hover{background:#f3f3f3!important}
#_fbrtitle{font-size:10px!important;font-weight:700!important;letter-spacing:.8px!important;text-transform:uppercase!important;color:#888!important;flex:1!important;margin:0!important;padding:0!important}
._fbrchev{font-size:11px!important;color:#aaa!important;transition:transform .2s!important}
#_fbranches.col ._fbrchev{transform:rotate(-90deg)!important}
#_fbrbody{overflow:hidden!important;transition:max-height .3s ease,opacity .25s ease!important;max-height:500px!important;opacity:1!important}
#_fbranches.col #_fbrbody{max-height:0!important;opacity:0!important}
._fbr{border-top:1px solid #efefef!important}
._fbacc-hdr{display:flex!important;align-items:center!important;gap:8px!important;padding:9px 14px 8px!important;cursor:pointer!important;transition:background .15s!important}
._fbacc-hdr:hover{background:#f5f5f5!important}
._fbacc-body{max-height:0!important;overflow:hidden!important;opacity:0!important;transition:max-height .28s ease,opacity .22s ease!important;padding:0 14px!important}
._fbr.open ._fbacc-body{max-height:130px!important;opacity:1!important;padding:0 14px 10px!important}
._farr{font-size:11px!important;color:#ccc!important;transition:transform .2s!important}
._fbr.open ._farr{transform:rotate(180deg)!important}
._fbrow{display:flex!important;align-items:center!important;gap:7px!important;margin-bottom:4px!important;font-size:12px!important;color:#555!important}
._fbrow svg{flex-shrink:0!important}
._fbrow a{text-decoration:none!important}

/* FOOTER */
#_fft{text-align:center!important;padding:5px 12px 8px!important;font-size:10.5px!important;color:#bbb!important;border-top:1px solid #f0f0f0!important;background:#fff!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;flex-shrink:0!important}
#_fft a{color:#bbb!important;text-decoration:none!important}

/* TYPING */
._ftyp ._fbb{padding:11px 14px!important;display:flex!important;gap:5px!important;align-items:center!important}
._fd{width:7px!important;height:7px!important;border-radius:50%!important;background:#ccc!important;animation:_fda 1.2s infinite!important}
._fd:nth-child(2){animation-delay:.2s!important}
._fd:nth-child(3){animation-delay:.4s!important}
@keyframes _fda{0%,80%,100%{transform:scale(.8);opacity:.5}40%{transform:scale(1.1);opacity:1}}

/* Pointer events – #_fw nie może blokować kliknięć na stronie */
#_fw{pointer-events:none!important}
#_fb{pointer-events:all!important}
#_fw.on #_fpnl{pointer-events:all!important}
#_fw.on #_fxp{pointer-events:all!important}
/* LOGO */
#_flogo{display:flex!important;align-items:center!important;flex-shrink:0!important}
#_flogo img{object-fit:contain!important;display:block!important}
