@font-face {
    font-family: 'Gilroy-Regular'; 
    src: url('/fileservice/file/download/h/684fd856948fbf0aaab89183009f2fad.otf/a/2134/sc/256') format('opentype'),
         url('/fileservice/file/download/h/0a3699c74d4c2d8cb971763552acec63.woff/a/2134/sc/154') format('woff');
}

@font-face {
    font-family: 'Lighthaus'; 
    src: url('/fileservice/file/download/h/290a86b63e383ff5483dfebd17951575.otf/a/2134/sc/117') format('opentype'), 
         url('/fileservice/file/download/h/8b5f67f1fc1d2117d028827373731f76.woff/a/2134/sc/12') format('woff');
}

.feedback-custom-block {
    --block-bg:#fff; /*Фон блока*/
    --text-color:#333; /*Цвет текста*/
    --stars-color:/*#efae2c*/#fe777d; /*Цвет звезд*/
    --textarea-bg:/*#f3f3f3*/#e9e9f5; /*Фон тектового поля*/
    --link-color:#69a5ff; /*Цвет ссылок Далее/Назад*/
    --button-bg:/*#81ABE9*/#19153d; /*Фон кнопки*/
    --button-color:#fff; /*Цвет текста кнопки*/
    position:fixed;
    right:50px;
    bottom:40px;
    display:block;
    padding:20px;
    max-width:fit-content;
    width:100%;
    z-index:99;
    background:#fff;
    border-radius:16px;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.20), 0px 0.1px 0.3px 0px rgba(0, 0, 0, 0.10);
}

.feedback-custom-block .header {
    display:flex;
    justify-content:space-between;
    align-items: center;
}

.feedback-custom-block .header h3 {
    font-family: 'Lighthaus';
    color: #121318;
}

.feedback-custom-block .header button {
    background-image:url('/fileservice/file/download/a/790870/sc/372/h/abb2fe9deeda07220e434bcb119e8e70.svg');
    background-size:cover;
    background-color:transparent;
    width:25px;
    height:25px;
    padding:0;
    border:none;
    outline:none;
}

.slide-header {
    display:flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom:5px;
}

.slide-header label {
    margin:0;
    flex:0 0 100%;
    font-family: 'Gilroy-Regular';
    color: #000;
}

.rating-slide {
    margin-top:20px
}

.rating-slide input {
    display:none;
}

.feedback-input-block {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
}

.feedback-input-block label {
    margin:0;
}

.feedback-input-block label:before {
    content: '';
    mask-image:url('/fileservice/file/download/a/790870/sc/164/h/f366d3835c54d49e281b1d9d49a9c44e.svg');
    -webkit-mask-image:url('/fileservice/file/download/a/790870/sc/164/h/f366d3835c54d49e281b1d9d49a9c44e.svg');
    mask-size:cover;
    -webkit-mask-size:cover;
    width:35px;
    height:35px;
    display:block;
    background:var(--stars-color);
    opacity:.5;
    cursor: pointer;
}

.feedback-input-block label:hover:before,
.feedback-input-block label:hover ~ label:before {
    opacity:1;
}

.feedback-input-block label.active:before, 
.feedback-input-block label.active ~ label:before {
    mask-image:url('/fileservice/file/download/a/790870/sc/228/h/a26731ed24a7e3021e8504aa66be9ceb.svg');
    -webkit-mask-image:url('/fileservice/file/download/a/790870/sc/228/h/a26731ed24a7e3021e8504aa66be9ceb.svg');
    opacity:1;
}

.rating-slide textarea {
    width:100%;
    min-height:90px;
    border-radius:5px;
    border:none;
    outline:none;
    background:var(--textarea-bg);
    padding:5px 10px;
    resize:none;
}

.slide-btns a {
    color:#81ABE9
}

.slide-btns button {
    border: 0;
    padding:7px 20px;
    border-radius: 6px;
    font-size: 14px;
    color: #fff;
    background: var(--button-bg);
    transition:all .3s
}

.slide-btns {
    margin-top:10px;
}

.rating-slide:not([slide="1"]) .slide-btns {
    display:flex;
    justify-content: space-between;
    align-items: center;
}

.rating-slide[slide="1"] .feedback-slide-next{
    float:right
}

@media(max-width:768px) {
    .feedback-custom-block {
        bottom:45px;
        right:0;
        max-width:100%;
        box-shadow:0px 2px 10px 0px rgba(0, 0, 0, 0.40), 0px 0.1px 0.3px 0px rgba(0, 0, 0, 0.10);
        border-radius:16px 16px 0 0;
        padding:0px;
        padding-bottom:20px;
    }

    .chatium_body .feedback-custom-block {
        bottom:0;
    }

    .feedback-custom-block .header {
        cursor:pointer;
        padding:20px 20px 0;
    }

    .feedback-custom-block .header:after {
        content:'';
        background-image:url('/fileservice/file/download/a/790870/sc/322/h/7900ffd9e5c904ee4977988ffff10adc.svg');
        background-size: cover;
        background-color: transparent;
        width: 25px;
        height: 25px;
        transition:all .3s;
        transform:rotate(-180deg);
    }

    .feedback-custom-block .header.opened-feedback:after {
        transform:rotate(0)
    }

    .feedback-custom-block .header button {
        display:none;
    }

    .feedback-custom-block form {
        padding:0 20px 40px;
        display:none;
    }

    .rating-slide[slide="1"] .slide-btns {
        margin-left:auto;
        width:fit-content;
    }

    .rating-slide[slide="1"] .feedback-slide-next {
        float:unset
    }
}

@media(max-width:415px) {
    .feedback-input-block label:before {
        width:30px;
        height:30px;
    }

    .feedback-custom-block .header h3 {
        font-size: 20px;
    }
}

@media(max-width:376px) {
    .feedback-custom-block .header h3 {
        font-size: 18px;
    }
}