.helpcenter-widget { z-index:1100; position: fixed; right: 20px; bottom: 50px; display: flex; flex-wrap: nowrap; align-items: end;}


.helpcenter-open {
  border-radius: 26px 0 26px 26px;
  font-family: $font-lato;
  font-size: 16px;
  height: 47px;
  display: flex;
  -webkit-box-align: center;  -moz-box-align: center; -o-box-align: center;  -ms-flex-align: center;  -webkit-align-items: center;
  align-items: center;
  -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-pack: center;  -webkit-justify-content: center;
  justify-content: center;
  font-weight: 400;
  background: #fff;
  -webkit-transition: all .3s ease-out; -moz-transition: all .3s ease-out; -o-transition: all .3s ease-out; -ms-transition: all .3s ease-out;
  transition: all .3s ease-out;
  -webkit-user-select: none; -moz-user-select: none;  -ms-user-select: none;  user-select: none;
  line-height: 1.25;
  font-style: normal;
  box-sizing: border-box;
  box-shadow: inset 0 0 0 2px var(--theme-color);
  position: relative;
  overflow: hidden;
  padding-top: 1px;
  padding-bottom: 1px;
  border: 0;
  
}


/* POPUP */
        .helpcenter-panel-wrap {
            position: fixed;
            opacity: 0;
            z-index: 10010;
            display: none;
            width: 100%;
            height: 100%;
            max-height:100vh;
            top: 0;
            left: 0;
            justify-content: center;
            align-items: center;
            overflow-y: scroll;
        }
        

        
        
        .helpcenter-open {
            cursor:pointer;
            padding: 10px;
            background-color: #fff;
            padding: 15px;
            color:var(--theme-color);
        }
        .helpcenter-open:hover { background-color: var(--theme-color); color:#fff}
        
        .helpcenter-helper-panel {
            padding:40px 40px 20px 40px; 
            background:#fff;
            z-index: 10001;
            border: 1px solid #dddddd;
            max-width:99%;
            width: inherit;
            /*display: none;*/
            max-height: 85vh;
            overflow-y: scroll;
            border-radius: 26px;
        }
        
        .helpcenter-close {
            font-size: 200%;
            float: right;
            margin: -35px -35px 0 0;
            cursor: pointer;
            color: var(--theme-color);
            border-radius: 50%;
            width: 32px;
            height: 32px;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .helpcenter-close:hover { opacity:0.8;}

        .helpcenter-helper-button {
            cursor:pointer;
        }
        

.helpcenter-shadow { display:none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; opacity: 0.5; background-color: #000;}

      
        @media (min-width: 768px) {
            .helpcenter-helper-panel {
                max-width: 80%;
            }
        }
        @media (min-width: 992px) {
            .helpcenter-helper-panel {
                max-width: 60%;
            }
        }
        @media (min-width: 1200px) {
            .helpcenter-helper-panel {
                max-width: 35%;
            }
        }
.helpcenter-messengers { flex-wrap: nowrap;
border-radius: 26px;
  font-family: $font-lato;
  font-size: 16px;
  height: 47px;
  justify-content: center;
  font-weight: 400;
  background: #fff;
  -webkit-transition: all .3s ease-out; -moz-transition: all .3s ease-out; -o-transition: all .3s ease-out; -ms-transition: all .3s ease-out;
  transition: all .3s ease-out;
  -webkit-user-select: none; -moz-user-select: none;  -ms-user-select: none;  user-select: none;
  line-height: 1.25;
  font-style: normal;
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
  height:47px;
  padding-right: 16px;
  padding-left: 16px;
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: box;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -o-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 20px;
  position: relative;
  -webkit-box-shadow: inset 0 0 0 2px var(--theme-color);
  box-shadow: inset 0 0 0 2px var(--theme-color);
  margin-left: 10px;
}


.helpcenter-messanger { display: flex; }
.helpcenter-messanger a { display: flex;}
.helpcenter-messanger svg { color:var(--theme-color); height: 18px; width: auto;}
.helpcenter-messanger a:hover svg { opacity: 0.8;}
