:root {
    --chat-ico: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M3.516 3.516c4.686-4.686 12.284-4.686 16.97 0s4.686 12.283 0 16.97a12 12 0 0 1-13.754 2.299l-5.814.735a.392.392 0 0 1-.438-.44l.748-5.788A12 12 0 0 1 3.517 3.517zm3.61 17.043.3.158a9.85 9.85 0 0 0 11.534-1.758c3.843-3.843 3.843-10.074 0-13.918s-10.075-3.843-13.918 0a9.85 9.85 0 0 0-1.747 11.554l.16.303-.51 3.942a.196.196 0 0 0 .219.22zm6.534-7.003-.933 1.164a9.84 9.84 0 0 1-3.497-3.495l1.166-.933a.79.79 0 0 0 .23-.94L9.561 6.96a.79.79 0 0 0-.924-.445l-2.023.524a.797.797 0 0 0-.588.88 11.754 11.754 0 0 0 10.005 10.005.797.797 0 0 0 .88-.587l.525-2.023a.79.79 0 0 0-.445-.923L14.6 13.327a.79.79 0 0 0-.94.23z'/%3E%3C/svg%3E");
    --chat-font: -apple-system, blinkmacsystemfont, "Segoe UI", roboto, oxygen-sans, ubuntu, cantarell, "Helvetica Neue", sans-serif
}
.chat {
    --sep: 20px;
    --bottom: var(--sep);
    --s: 60px;
    --h: calc(var(--s)/2);
    --header: max(50px, var(--s)*1.166667);
    --vh: 100vh;
    --ch: 142;
    --cs: 70%;
    --cl: 49%;
    --hsl: var(--ch) var(--cs) var(--cl);
    --color: hsl(var(--hsl));
    --dark: hsl(var(--ch) var(--cs) calc(var(--cl) - 10%));
    --hover: hsl(var(--ch) var(--cs) calc(var(--cl) + 20%));
    --bg: hsl(var(--hsl)/4%);
    --bw: 1;
    --text: hsl(0deg 0% clamp(0%, var(--bw)*1000%, 100%)/clamp(70%, var(--bw)*1000%, 100%));
    --msg: var(--color);
    color: var(--text);
    display: none;
    position: fixed;
    z-index: 9000;
    right: var(--sep);
    bottom: var(--bottom);
    font: normal normal normal 16px/1.625em var(--chat-font);
    letter-spacing: 0;
    animation: chat_show .5s cubic-bezier(.18, .89, .32, 1.28) 10ms both;
    transform: scale3d(0, 0, 0);
    transform-origin: calc(var(--s)/-2) calc(var(--s)/-4);
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    touch-action: manipulation;
    -webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color: rgb(0 0 0/0)
}
.chat *, .chat :after, .chat :before {
    box-sizing: border-box
}
.chat--show {
    display: block;
    transform: scaleX(1)
}
.chat--left {
    right: auto;
    left: var(--sep)
}
.chat--dark {
    --msg: var(--dark)
}
.chat--noanim {
    animation: none
}
.chat--chatbox:not(.chat--noanim) {
    transform-origin: 0 0;
    animation-timing-function: ease-in-out
}
.chat--hidden {
    display: none !important
}
@supports not (width:clamp(1px, 1%, 10px)) {
    .chat {
        --text: hsl(0deg 0% calc(var(--bw)*1%)/90%)
    }
}
.chat__button {
    position: absolute;
    z-index: 2;
    bottom: 8px;
    right: 8px;
    height: var(--s);
    width: var(--s);
    background: #25d366 var(--chat-ico) 50%/60% no-repeat;
    color: inherit;
    border-radius: 50%;
    box-shadow: 1px 6px 24px 0 rgba(7, 94, 84, .24);
    cursor: pointer;
    transition: background-color .2s linear
}
.chat__button:hover {
    background-color: #128c7e
}
.chat:has(.chat__chatbox) .chat__button:hover {
    transition-duration: 1.5s
}
.chat__button:active {
    background-color: #128c7e;
    transition: none
}
.chat--left .chat__button {
    right: auto;
    left: 8px
}
.chat--chatbox .chat__button {
    display: none
}
.chat__button__ico {
    position: absolute;
    inset: 0;
    display: flex;
    border-radius: 50%;
    overflow: hidden;
    color: var(--text) !important
}
.chat__button__ico svg {
    width: var(--ico-size, 100%);
    height: var(--ico-size, 100%);
    margin: calc((100% - var(--ico-size, 1))/2)
}
.chat__button:has(.chat__button__ico) {
    background: var(--color);
    box-shadow: 1px 6px 24px 0 hsl(var(--ch) var(--cs) calc(var(--cl) - 10%)/24%)
}
.chat__button:has(.chat__button__ico):active, .chat__button:has(.chat__button__ico):hover {
    background: var(--hover)
}
.chat__button__image {
    position: absolute;
    inset: 1px;
    border-radius: 50%;
    overflow: hidden;
    opacity: 0
}
.chat__button__image img, .chat__button__image video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center
}
.chat--show .chat__button__image {
    animation: chat_image_loop 20s linear 5s infinite normal both
}
.chat--img .chat__button__image {
    opacity: 1;
    animation: none
}
.chat__badge {
    position: absolute;
    z-index: 2;
    bottom: calc(var(--s) - 8px);
    right: 4px;
    width: 20px;
    height: 20px;
    border: none;
    border-radius: 50%;
    background: #e82c0c;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    line-height: 20px;
    text-align: center;
    box-shadow: none;
    opacity: 0;
    pointer-events: none
}
.chat--left .chat__badge {
    right: auto;
    left: calc(var(--s) - 8px)
}
.chat__badge.chat__badge--in {
    animation: chat_badge_in .5s cubic-bezier(.27, .9, .41, 1.28) 1 both
}
.chat__badge.chat__badge--out {
    animation: chat_badge_out .4s cubic-bezier(.215, .61, .355, 1) 1 both
}
.chat__tooltip {
    position: absolute;
    top: calc(var(--h) - 16px);
    right: calc(var(--s) + 16px);
    max-width: calc(100vw - var(--s) - 45px);
    height: 32px;
    padding: 0 14px;
    border: none;
    border-radius: 16px;
    background: #fff;
    color: rgba(0, 0, 0, .8);
    line-height: 31px;
    white-space: nowrap;
    opacity: 0;
    transition: opacity .3s ease-out .4s;
    filter: drop-shadow(0 1px 4px rgba(0, 0, 0, .4));
    pointer-events: none
}
.chat__tooltip:after {
    content: "";
    display: block;
    position: absolute;
    top: 10px;
    right: -6px;
    border: 8px solid transparent;
    border-width: 6px 0 6px 8px;
    border-left-color: #fff
}
.chat__tooltip div {
    width: -moz-max-content;
    width: max-content;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis
}
.chat--tooltip .chat__tooltip {
    animation: chat_tootlip 20s linear 5s 1 normal both
}
.chat--chatbox .chat__tooltip {
    display: none
}
.chat--left .chat__tooltip {
    right: auto;
    left: calc(var(--s) + 16px)
}
.chat--left .chat__tooltip:after {
    left: -6px;
    right: auto;
    border-color: transparent;
    border-width: 6px 8px 6px 0;
    border-right-color: #fff
}
.chat__qr {
    position: absolute;
    z-index: 2;
    bottom: calc(var(--s) + 24px);
    right: 8px;
    display: none;
    flex-direction: column-reverse;
    width: 228px;
    min-height: 200px;
    padding: 14px 14px 10px;
    border: none;
    border-radius: 16px;
    background: #fff;
    color: rgba(0, 0, 0, .8);
    text-align: center;
    white-space: nowrap;
    filter: drop-shadow(0 1px 4px rgba(0, 0, 0, .4));
    animation: chat_badge_in .4s cubic-bezier(.11, .84, .83, 1.01) .5s both;
    pointer-events: none
}
.chat__qr:after {
    content: "";
    display: block;
    position: absolute;
    bottom: -6px;
    right: calc(var(--h) - 6px);
    border: 8px solid transparent;
    border-width: 8px 6px 0;
    border-top-color: #fff
}
.chat--left .chat__qr {
    left: 8px;
    right: auto
}
.chat--left .chat__qr:after {
    left: calc(var(--h) - 6px);
    right: auto
}
.chat__qr div {
    font-size: 14px;
    color: #4a4a4a;
    overflow: hidden;
    text-overflow: ellipsis
}
.chat__qr canvas {
    display: block;
    width: 200px;
    height: 200px;
    margin: 0;
    image-rendering: pixelated
}
.chat__chatbox {
    content-visibility: hidden;
    display: flex;
    flex-direction: column;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
    width: calc(100vw - var(--sep)*2);
    max-width: 400px;
    max-height: calc(var(--vh) - var(--bottom) - var(--sep));
    border-radius: calc(var(--h) + 2px);
    background: #fff linear-gradient(180deg, var(--color), var(--color) var(--header), var(--bg) var(--header), var(--bg));
    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .5);
    text-align: left;
    overflow: hidden;
    transform: scale3d(0, 0, 0);
    opacity: 0;
    transition: max-height .2s ease-out, opacity .4s ease-out, transform 0s linear .3s
}
[dir=rtl] .chat__chatbox {
    text-align: right
}
.chat--chatbox .chat__chatbox {
    content-visibility: visible;
    opacity: 1;
    transform: scaleX(1);
    transition: max-height .2s ease-out, opacity .2s ease-out, transform 0s linear
}
.chat--left .chat__chatbox {
    right: auto;
    left: 0
}
.chat--dark .chat__chatbox {
    background: #1a1a1a linear-gradient(180deg, var(--dark), var(--dark) var(--header), var(--bg) var(--header), var(--bg))
}
.chat__header {
    display: flex;
    flex-flow: row;
    align-items: center;
    position: relative;
    flex-shrink: 0;
    height: var(--header);
    padding: 0 70px 0 26px;
    margin: 0
}
[dir=rtl] .chat__header {
    padding: 0 26px 0 70px
}
.chat__header span {
    font-size: 19px;
    font-weight: 600;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    opacity: .8
}
.chat__header a {
    font-size: 11px;
    line-height: 18px;
    color: inherit !important;
    text-decoration: none !important;
    fill: currentcolor;
    opacity: .8
}
.chat__header a svg {
    display: inline-block;
    width: auto;
    height: 18px;
    vertical-align: -30%
}
.chat__header a:active, .chat__header a:hover {
    color: inherit !important;
    text-decoration: none !important;
    opacity: .9;
    filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .3))
}
.chat__wa {
    display: block;
    fill: currentcolor;
    opacity: .8
}
.chat__close {
    --size: 34px;
    position: absolute;
    top: calc(50% - var(--size)/2);
    right: 24px;
    width: var(--size);
    height: var(--size);
    border-radius: 50%;
    background: rgba(0, 0, 0, .4) url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 24 24'%3E%3Cpath d='M24 2.4 21.6 0 12 9.6 2.4 0 0 2.4 9.6 12 0 21.6 2.4 24l9.6-9.6 9.6 9.6 2.4-2.4-9.6-9.6z'/%3E%3C/svg%3E") 50%/12px no-repeat;
    cursor: pointer;
    transition: background-color .3s ease-out
}
.chat__close:hover {
    background-color: rgba(0, 0, 0, .6)
}
.chat__close:active {
    background-color: rgba(0, 0, 0, .7)
}
[dir=rtl] .chat__close {
    right: auto;
    left: 24px
}
.chat__scroll {
    overflow: hidden scroll;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch
}
.chat__scroll::-webkit-scrollbar {
    width: 4px;
    background: rgb(0 0 0/0)
}
.chat__scroll::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background: rgb(0 0 0/0)
}
.chat--blur .chat__scroll {
    background: hsl(var(--hsl)/2%);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px)
}
.chat__scroll:hover::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, .2)
}
.chat__content {
    display: flex;
    flex-direction: column;
    width: calc(100% + 4px);
    padding: 20px 0 8px
}
.chat__content:after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 4px;
    height: calc(var(--s) + 20px);
    background: #fff linear-gradient(180deg, var(--bg), var(--bg));
    -webkit-mask-image: linear-gradient(rgb(0 0 0/0), rgb(0 0 0/60%) 25%, rgb(0 0 0/92%) 70%, rgb(0 0 0/100%) 95%, rgb(0 0 0/100%));
    mask-image: linear-gradient(rgb(0 0 0/0), rgb(0 0 0/60%) 25%, rgb(0 0 0/92%) 70%, rgb(0 0 0/100%) 95%, rgb(0 0 0/100%));
    pointer-events: none
}
.chat--dark .chat__content:after {
    background-color: #1a1a1a
}
.chat__open {
    position: sticky;
    z-index: 2;
    bottom: 8px;
    align-self: flex-end;
    display: flex;
    flex-direction: row;
    min-width: var(--s);
    height: var(--s);
    margin: 0 8px;
    background: var(--color);
    color: inherit;
    border-radius: var(--h);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .3);
    overflow: hidden;
    cursor: pointer;
    transition: background-color .2s linear
}
[dir=rtl] .chat__open {
    align-self: flex-start;
    flex-direction: row-reverse
}
.chat__open:active, .chat__open:hover {
    background: var(--hover)
}
.chat--left .chat__open {
    align-self: flex-start;
    flex-direction: row-reverse
}
[dir=rtl] .chat--left .chat__open {
    flex-direction: row
}
.chat--optout .chat__open {
    background-color: #999;
    pointer-events: none
}
.chat__open__icon {
    flex-shrink: 0;
    width: var(--s);
    height: var(--s);
    max-width: var(--s);
    padding: calc(var(--s)*0.18);
    margin: 0;
    overflow: hidden
}
.chat__open__icon path {
    fill: none !important;
    stroke: var(--text) !important;
    stroke-linecap: round;
    stroke-width: 33px;
    animation: none
}
.chat__open__icon .chat__pa {
    --stroke: 1097
}
.chat__open__icon .chat__pb {
    --stroke: 1020
}
.chat--chatbox .chat__open__icon path {
    stroke-dasharray: var(--stroke);
    stroke-dashoffset: var(--stroke);
    animation: chat_send_svg 6s .2s ease-in-out infinite
}
.chat--chatbox .chat__open__icon .chat__pb {
    animation-delay: 3.2s
}
.chat--optout .chat__open__icon path {
    animation: none
}
.chat--optout .chat__open__icon .chat__pa {
    stroke-dasharray: 0
}
.chat__open__text {
    max-width: 0;
    padding: 0;
    border-radius: var(--s);
    font-weight: 600;
    line-height: var(--s);
    white-space: nowrap;
    opacity: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: none
}
.chat--chatbox .chat__open__text {
    max-width: min(400px - 16px - var(--s), 100vw - 16px - var(--s) - 2*var(--sep));
    padding: 0 4px 0 24px;
    opacity: 1;
    transition: max-width .2s linear, opacity .4s ease-out .2s
}
.chat--chatbox.chat--left .chat__open__text {
    padding: 0 24px 0 4px
}
.chat__optin {
    padding: 0 16px;
    margin-bottom: 16px;
    color: #4a4a4a;
    font-size: 13px;
    line-height: 1.33
}
.chat__optin a {
    display: inline;
    padding: 0;
    color: inherit !important;
    text-decoration: underline
}
.chat__optin a:hover {
    text-decoration-thickness: 2px
}
.chat__optin input {
    position: absolute;
    visibility: hidden
}
.chat__optin label {
    position: relative;
    display: block;
    margin: 0;
    padding: 0 0 0 30px;
    color: inherit;
    font: inherit;
    cursor: pointer
}
.chat__optin label:before {
    content: "";
    display: block;
    position: absolute;
    top: min(50% - 11px, 5px);
    left: 0;
    width: 22px;
    height: 22px;
    border: 3px solid var(--color);
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 0 0 1px var(--text);
    transition: box-shadow .3s ease-in-out
}
.chat--dark .chat__optin label:before {
    background: #000
}
.chat__optin label:after {
    content: "";
    display: none;
    position: absolute;
    top: min(50% - 8px, 8px);
    left: 8px;
    width: 6px;
    height: 14px;
    border: solid var(--text);
    border-width: 0 3px 3px 0;
    transform: rotate(45deg)
}
[dir=rtl] .chat__optin label {
    padding: 0 30px 0 0
}
[dir=rtl] .chat__optin label:before {
    left: auto;
    right: 0
}
[dir=rtl] .chat__optin label:after {
    left: auto;
    right: 8px
}
.chat__optin input:checked + label:before {
    box-shadow: 0 0 0 1px var(--text), inset 0 0 0 10px var(--color)
}
.chat__optin input:checked + label:after {
    display: block
}
.chat--dark .chat__optin {
    color: #d8d8d8
}
.chat__chat {
    --peak_l: path("M17 25V0C17 12.877 6.082 14.9 1.031 15.91c-1.559.31-1.179 2.272.004 2.272C9.609 18.182 17 18.088 17 25z");
    --peak_r: path("M0 25.68V0c0 13.23 10.92 15.3 15.97 16.34 1.56.32 1.18 2.34 0 2.34-8.58 0-15.97-.1-15.97 7Z");
    --peak: var(--peak_l);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding-bottom: 10px
}
[dir=rtl] .chat__chat {
    --peak: var(--peak_r)
}
.chat__bubble {
    position: relative;
    min-width: 60px;
    max-width: calc(100% - 52px);
    min-height: 56px;
    padding: 15px 20px;
    margin: 0 26px 16px;
    border-radius: 26px;
    background: #fff;
    color: #4a4a4a;
    word-break: break-word;
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .3));
    transform-origin: 0 50%;
    animation: chat_show .25s cubic-bezier(0, 0, .58, 1.19) 10ms both
}
[dir=rtl] .chat__bubble {
    transform-origin: 100% 50%
}
.chat__bubble:before {
    content: "";
    display: block;
    position: absolute;
    bottom: 18px;
    left: -15px;
    width: 17px;
    height: 25px;
    background: inherit;
    clip-path: var(--peak)
}
[dir=rtl] .chat__bubble:before {
    left: auto;
    right: -15px
}
.chat--dark .chat__bubble {
    background: #505050;
    color: #d8d8d8
}
.chat__bubble.chat__bubble--loading {
    width: 70px;
    border: none;
    background: transparent url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Ccircle cx='4' cy='12' r='3'%3E%3Canimate id='c' attributeName='cy' begin='0;a.end+0.1s' calcMode='spline' dur='0.4s' keySplines='.33,.66,.66,1;.33,0,.66,.33' values='12;6;12'/%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='3'%3E%3Canimate attributeName='cy' begin='c.begin+0.1s' calcMode='spline' dur='0.4s' keySplines='.33,.66,.66,1;.33,0,.66,.33' values='12;6;12'/%3E%3C/circle%3E%3Ccircle cx='20' cy='12' r='3'%3E%3Canimate id='a' attributeName='cy' begin='c.begin+0.2s' calcMode='spline' dur='0.4s' keySplines='.33,.66,.66,1;.33,0,.66,.33' values='12;6;12'/%3E%3C/circle%3E%3C/svg%3E") 20px 20px no-repeat;
    transform-origin: 50% !important;
    animation: chat_show .1s ease-out 10ms both
}
.chat--dark .chat__bubble.chat__bubble--loading {
    filter: invert(.5)
}
.chat__bubble.chat__bubble--note {
    min-height: 0;
    padding: 0;
    background: none;
    font-size: 13px;
    line-height: 1.33;
    filter: none;
    animation: none
}
.chat__bubble.chat__bubble--media {
    padding: 5px
}
.chat__bubble.chat__bubble--loading:before, .chat__bubble.chat__bubble--note:before {
    content: none
}
.chat__bubble a {
    color: var(--msg) !important;
    font-size: 1em;
    text-decoration: underline
}
.chat__bubble a:active, .chat__bubble a:hover {
    color: var(--hover) !important;
    border-color: var(--hover)
}
.chat__bubble a.chat__btn {
    display: inline-block;
    min-height: 46px;
    max-width: 100%;
    padding: 10px 20px;
    margin: 5px 0;
    border: 3px solid var(--msg);
    border-radius: 23px;
    line-height: 20px;
    text-align: center;
    text-decoration: none !important;
    overflow: hidden;
    text-overflow: ellipsis
}
.chat__bubble a.chat__btn + .chat__bubble a.chat__btn {
    margin-top: -5px
}
.chat__bubble img, .chat__bubble video {
    max-width: 100%;
    height: auto;
    margin: .2em 0;
    border-radius: 4px;
    box-shadow: 0 1px 5px rgb(0 0 0/10%)
}
.chat__bubble .chat--inline {
    display: inline-block;
    margin: -10px 0;
    border-radius: 0;
    box-shadow: none;
    vertical-align: middle
}
.chat__bubble--media .chat--inline, .chat__bubble--media img, .chat__bubble--media video {
    display: block;
    margin: 0;
    border-radius: 21px
}
.chat__bubble code {
    padding: 2px 5px;
    font-size: 90%;
    color: #c7254e;
    background-color: #f9f2f4;
    border-radius: 4px
}
.chat__bubble hr {
    width: 100% !important;
    height: 0 !important;
    padding: 0 !important;
    border: none !important;
    border-top: 2px solid var(--msg) !important;
    margin: 10px 0 !important
}
@keyframes chat_show {
    0% {
        transform: scale3d(0, 0, 0)
    }
    to {
        transform: scaleX(1)
    }
}
@keyframes chat_badge_in {
    0% {
        opacity: 0;
        transform: translate3d(0, 50px, 0)
    }
    to {
        opacity: 1;
        transform: translateZ(0)
    }
}
@keyframes chat_badge_out {
    0% {
        opacity: 1;
        transform: translateZ(0)
    }
    to {
        opacity: 0;
        transform: translate3d(0, -20px, 0)
    }
}
@keyframes chat_send_svg {
    0%, 50%, to {
        stroke-dashoffset: var(--stroke)
    }
    5%, 45% {
        stroke-dashoffset: 0
    }
}
@keyframes chat_image_loop {
    0% {
        opacity: 0
    }
    3%, 20% {
        opacity: 1
    }
    25%, to {
        opacity: 0
    }
}
@keyframes chat_tootlip {
    0% {
        opacity: 0;
        transform: scaleY(0)
    }
    1%, 20% {
        opacity: 1;
        transform: scaleX(1)
    }
    25%, to {
        opacity: 0;
        transform: scaleX(1)
    }
}
.chat__woo-btn__wrapper {
    clear: both
}
.chat__woo-btn {
    --s: 40px;
    display: inline-block;
    box-sizing: border-box;
    height: var(--s);
    max-width: 100%;
    padding: 0 calc(var(--s)/2) 0 var(--s);
    background: #25d366 var(--chat-ico) calc(var(--s)*0.2) 50% no-repeat;
    background-size: calc(var(--s)*0.6);
    color: #fff;
    border-radius: calc(var(--s)/2);
    font: 700 normal calc(var(--s)*0.35)/var(--s) var(--chat-font);
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    cursor: pointer;
    transition: background-color .2s
}
.chat__woo-btn:empty {
    padding-right: 0
}
.chat__woo-btn:hover {
    background-color: #128c7e
}
@media (orientation:landscape) and (height >=481px), (orientation:portrait) and (width >=481px) {
    .chat--mobile {
        display: none !important
    }
}
@media (width <=767px) {
    .chat--footer-bar {
        --bottom: 76px !important
    }
}
@media (orientation:landscape) and (height <=480px), (width <=480px) {
    .chat {
        --sep: 6px;
        --header: max(50px, var(--s)*0.9166667)
    }
    .chat__header__text {
        font-size: 17px
    }
    .chat__close {
        --size: 28px
    }
    .chat__bubble {
        max-width: calc(100% - 40px);
        padding: 16px;
        margin: 0 20px 10px;
        line-height: 24px
    }
}
@media (hover:hover) {
    .chat__button:hover .chat__tooltip {
        opacity: 1;
        animation: none;
        transition: opacity .2s
    }
    .chat--btn .chat__button:hover ~ .chat__qr, .chat--chatbox:has(.chat__open:hover) .chat__qr {
        display: flex
    }
}
@media (prefers-color-scheme:dark) {
    .chat--dark-auto {
        --msg: var(--dark)
    }
    .chat--dark-auto .chat__chatbox {
        background: #1a1a1a linear-gradient(180deg, var(--dark), var(--dark) var(--header), var(--bg) var(--header), var(--bg))
    }
    .chat--dark-auto .chat__content:after {
        background-color: #1a1a1a
    }
    .chat--dark-auto .chat__optin label:before {
        background: #000
    }
    .chat--dark-auto .chat__optin {
        color: #d8d8d8
    }
    .chat--dark-auto .chat__bubble {
        background: #505050;
        color: #d8d8d8
    }
    .chat--dark-auto .chat__bubble.chat__bubble--loading {
        filter: invert(.5)
    }
}
@media (prefers-reduced-motion) {
    .chat, .chat__open__icon path {
        animation: none
    }
    .chat__open__icon .chat__pa {
        stroke-dasharray: 0
    }
    .chat__open__text {
        transition: none !important
    }
    .chat__bubble {
        animation: none !important
    }
}