html {
    scroll-behavior: smooth;
}
.sidebar-faq-link {
    text-decoration: none;
    color: inherit;
}
.format-locked {
    opacity: 0.35;
    pointer-events: auto;
    cursor: not-allowed;
    position: relative;
}
.format-locked input {
    pointer-events: none;
}
.format-locked label {
    pointer-events: none;
}
@font-face {
    font-family: 'Avenir Next Cyr Regular';
    src: url('../font/AvenirNextCyr-Regular.eot');
    src: url('../font/AvenirNextCyr-Regular.eot?#iefix') format('embedded-opentype'),
    url('../font/AvenirNextCyr-Regular.woff') format('woff'),
    url('../font/AvenirNextCyr-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Avenir Next Cyr Medium';
    src: url('../font/AvenirNextCyr-Medium.eot');
    src: url('../font/AvenirNextCyr-Medium.eot?#iefix') format('embedded-opentype'),
    url('../font/AvenirNextCyr-Medium.woff') format('woff'),
    url('../font/AvenirNextCyr-Medium.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Avenir Next Cyr Demi';
    src: url('../font/AvenirNextCyr-Demi.eot');
    src: url('../font/AvenirNextCyr-Demi.eot?#iefix') format('embedded-opentype'),
    url('../font/AvenirNextCyr-Demi.woff') format('woff'),
    url('../font/AvenirNextCyr-Demi.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Avenir Next Cyr Bold';
    src: url('../font/AvenirNextCyr-Bold.eot');
    src: url('../font/AvenirNextCyr-Bold.eot?#iefix') format('embedded-opentype'),
    url('../font/AvenirNextCyr-Bold.woff') format('woff'),
    url('../font/AvenirNextCyr-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
body{
	padding: 0px;
	margin: 0px;
	font-family: 'Avenir Next Cyr Regular';
	background-color: #2b333c;
}
body.hidden{
    overflow: hidden;
}
ul{
	padding: 0px;
	margin: 0px;
}
li{
	list-style: none;
}
a{
	text-decoration: none;
	color: unset;
	cursor: pointer;
}
h1, h2, h3, h4, h5{
	margin: 0px;
    font-weight: unset;
}
p{
    margin: 0px;
}
input, button, textarea, select{
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	-ms-appearance: none;
    font-family: 'Avenir Next Cyr Regular';
    -webkit-tap-highlight-color: transparent;
    tap-highlight-color: transparent;
}
input[type="radio"]:focus {
    outline: none;
    box-shadow: none;
}
select::-webkit-scrollbar{
    width: 4px;
}
select::-webkit-scrollbar-track {
    border-radius: 2px;
    background-color: #353e4a;
}
select::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background-color: #616972;
}
.center{
	width: calc(100% - 32px);
	/* max-width: 1888px; */
	height: auto;
	margin: 0 auto;
}

/* HEADER */
header{
    width: 100%;
    height: auto;
    float: left;
    padding: 20px 0;
}
.header__row{
    width: 100%;
    height: auto;
    float: left;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-content: center;
    align-items: center;
    padding: 0 32px 0 25px;
    box-sizing: border-box;
    flex-direction: row;
}
.header__item{
    width: 33%;
    height: auto;
}
.header__item-logo{
    width: fit-content;
    height: auto;
    float: left;
}
.header__item-logo img{
    width: 44px;
    height: 44px;
    float: left;
}
.header__item-title{
    width: 100%;
    height: auto;
    font-size: 20px;
    font-family: 'Avenir Next Cyr Demi';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #FFFFFF;
    transition: .4s;
}
header.active .header__item-title{
    opacity: 0;
    transition: .4s;
}
.header__item-username{
    width: fit-content;
    height: auto;
    float: right;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    align-items: center;
}
.header__item-username span{
    width: fit-content;
    height: auto;
    float: right;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #8e99a5;
    margin: 0 21px 0 0;
}
.header__item-username img{
    width: 45px;
    height: 45px;
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.12);
    border: solid 1px #39424b;
    background-color: #2e3640;
    border-radius: 100px;
    object-fit: none;
    object-position: center;
}
.header__item-bar{
    width: 16.8px;
    height: 13.1px;
    float: right;
    background-image: url("../images/icon/bar.svg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: none;
    background-color: unset;
    border: unset;
}
header.active .header__item-bar{
    background-image: url("../images/icon/close.svg");
    width: 14px;
    height: 14px;
}
/* HEADER */

/* DISPLAY */
.display{
    width: 100%;
    height: auto;
    float: left;
    background-color: #2b333c;
    box-sizing: border-box;
}
.display__row{
    width: 100%;
    height: calc(100vh - 111px);
    float: left;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    box-sizing: border-box;
}
.display__item:nth-child(1){
    width: 294px;
    height: 100%;
}
.display__item:nth-child(2){
    width: calc(73% - 326px);
    height: 100%;
    position: relative;
}
.display__item:nth-child(3){
    width: 27%;
    height: 100%;
}
.display__item__menu{
    width: 100%;
    height: 100%;
    float: left;
    border-radius: 24px;
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.12);
    border: solid 1px #39424b;
    background-color: #2e3640;
    padding: 34px 32px 34px 38px;
    box-sizing: border-box;
    margin: 0;
    overflow-y: auto;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
}
.display__item__menu > .shortvoiceovers__item__plan{
    margin-top: auto;
    margin-left: -14px;
    margin-right: -8px;
    margin-bottom: -10px;
    width: calc(100% + 22px);
    flex-shrink: 0;
}
/* H1 heading in left sidebar */
.display__item__menu-heading {
    width: 100%;
    float: left;
    margin: 0;
    padding: 0;
    font-size: 18px;
    font-family: 'Avenir Next Cyr Demi';
    color: #FFFFFF;
    line-height: 1.4;
    font-weight: normal;
}
.display__item__menu-heading__sub {
    display: block;
    font-size: 12px;
    font-family: 'Avenir Next Cyr Medium';
    color: #8e99a5;
    line-height: 1.4;
    margin-top: 4px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #39424b;
    font-weight: normal;
    width: 100%;
}
.display__item__menu-heading__sub .demo-badge {
    color: #ff6b6b;
    font-family: 'Avenir Next Cyr Demi';
    letter-spacing: 0.5px;
}
.display__item__menu-mobile-pro{
    display: none;
}
.display__item__menu::-webkit-scrollbar {
    width: 1px;
}
.display__item__menu::-webkit-scrollbar-track {
    border-radius: 2px;
    background-color: #353e4a00;
}
.display__item__menu::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background-color: #61697259;
}
.display__item__menu ul{
    width: 100%;
    height: auto;
    float: left;
}
.display__item__menu ul > li{
    width: 100%;
    height: auto;
    float: left;
    margin: 0 0 44px 0;
    position: relative;
}
.display__item__menu ul > li.new::before{
    content: "New";
    position: absolute;
    right: 0%;
    top: 50%;
    -webkit-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
    font-size: 14px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: right;
    color: #4e9eff;
}
.display__item__menu ul > li > a,
.display__item__menu ul > li > span{
    width: fit-content;
    height: auto;
    float: left;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #8e99a5;
    padding: 0 0 0 41px;
    position: relative;
    transition: .4s;
    cursor: pointer;
}
.display__item__menu ul > li > a:hover,
.display__item__menu ul > li > a.active,
.display__item__menu ul > li > span:hover,
.display__item__menu ul > li > span.active{
    color: #FFFFFF;
    transition: .4s;
}
.display__item__menu ul > li > a::before,
.display__item__menu ul > li > span::before{
    content: "";
    position: absolute;
    width: 20px;
    height: 19.9px;
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;
    left: 0%;
    top: 50%;
    -webkit-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
    border: unset;
    border-radius: unset;
}
.display__item__menu ul > li > a:hover::before,
.display__item__menu ul > li > a.active::before,
.display__item__menu ul > li > span:hover::before,
.display__item__menu ul > li > span.active::before{
    filter: invert(54%) sepia(56%) saturate(2673%) hue-rotate(193deg) brightness(104%) contrast(101%);
}
.display__item__menu ul > li:nth-child(1) a::before,
.display__item__menu ul > li:nth-child(1) span::before{
    background-image: url("../images/icon/menu-1.svg");
}
.display__item__menu ul > li:nth-child(2) a::before,
.display__item__menu ul > li:nth-child(2) span::before{
    background-image: url("../images/icon/menu-2.svg");
}
.display__item__menu ul > li:nth-child(3) a::before,
.display__item__menu ul > li:nth-child(3) span::before{
    background-image: url("../images/icon/menu-3.svg");
}
.display__item__menu ul > li:nth-child(4) a::before,
.display__item__menu ul > li:nth-child(4) span::before{
    background-image: url("../images/icon/menu-10.svg");
}
.display__item__menu ul > li:nth-child(5) a::before,
.display__item__menu ul > li:nth-child(5) span::before{
    background-image: url("../images/icon/menu-faq.svg");
}
.display__item__menu-file{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 1;
}

/* ── Sidebar plan banner (tone-style) ──────────── */
.shortvoiceovers__item__plan{
    width: 100%;
    height: auto;
    float: left;
    padding: 29px 18px 18px;
    border-radius: 16px;
    background-color: #6c63ff;
    box-sizing: border-box;
    margin: 0;
    background-image: url("../images/vectory/plan.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.shortvoiceovers__item__plan-title{
    width: 100%;
    height: auto;
    float: left;
    font-size: 18px;
    font-family: 'Avenir Next Cyr Demi';
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    text-transform: uppercase;
    color: #FFFFFF;
}
.shortvoiceovers__item__plan-description{
    width: 100%;
    height: auto;
    float: left;
    font-size: 15px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.2;
    letter-spacing: normal;
    text-align: left;
    color: #FFFFFF;
    margin: 10px 0 0 0;
}
.shortvoiceovers__item__plan__price{
    width: 100%;
    height: auto;
    float: left;
    margin: 20px 0 0 0;
}
.shortvoiceovers__item__plan__price b{
    width: 100%;
    height: auto;
    float: left;
    font-size: 38px;
    font-family: 'Avenir Next Cyr Demi';
    font-stretch: normal;
    font-style: normal;
    line-height: 1.24;
    letter-spacing: normal;
    text-align: left;
    color: #FFFFFF;
}
.shortvoiceovers__item__plan__price p{
    width: 100%;
    height: auto;
    float: left;
    font-size: 15px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: 1.8;
    letter-spacing: normal;
    text-align: left;
    color: #FFFFFF;
}
.shortvoiceovers__item__plan-button{
    width: 100%;
    height: auto;
    float: left;
    font-size: 16px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #6c63ff;
    border-radius: 12px;
    background-color: #FFFFFF;
    margin: 24px 0 0 0;
    padding: 11px 0 12px;
    display: block;
    text-decoration: none;
    transition: opacity .25s;
}
.shortvoiceovers__item__plan-button:hover{
    opacity: .88;
}

.display__item__settingsbar{
    width: 100%;
    height: auto;
    min-height: 104px;
    float: left;
    border-radius: 24px;
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.12);
    border: solid 1px #39424b;
    background-color: #2e3640;
    padding: 29px 30px 18px 37px;
    box-sizing: border-box;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    flex-direction: row;
    overflow-x: auto;
}
.display__item__settingsbar::-webkit-scrollbar {
    height: 3px;
}
.display__item__settingsbar::-webkit-scrollbar-track {
    border-radius: 2px;
    background-color: #353e4a;
}
.display__item__settingsbar::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background-color: #616972;
}
.display__item__settingsbar__box{
    width: fit-content;
    height: auto;
    position: relative;
    padding: 0 0 0 59px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    flex-wrap: nowrap;
    margin: 0 56px 0 0;
    cursor: pointer;
    transition: .4s;
}
.display__item__settingsbar__box.unactive{
    opacity: 0.3;
    transition: .4s;
}
.display__item__settingsbar__box::before{
    content: "";
    position: absolute;
    width: 45px;
    height: 45px;
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.12);
    border: solid 1px #48525d;
    left: 0;
    top: 0;
    border-radius: 100px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: auto;
    box-sizing: border-box;
}
.display__item__settingsbar__box:nth-child(1):before{
    background-image: url("https://apihost.ru/images/icon/revoice/set-1.svg");
}
.display__item__settingsbar__box:nth-child(2):before{
    background-image: url("https://apihost.ru/images/icon/revoice/set-2.svg");
}
.display__item__settingsbar__box:nth-child(3):before{
    background-image: url("https://apihost.ru/images/icon/revoice/set-3.svg");
}
.display__item__settingsbar__box:nth-child(4):before{
    background-image: url("https://apihost.ru/images/icon/revoice/set-5.svg");
}
.display__item__settingsbar__box:nth-child(5):before{
    background-image: url("https://apihost.ru/images/icon/revoice/parametr.svg");
}
.display__item__settingsbar__box:nth-child(5){
	display: none;
}
.display__item__settingsbar__box:nth-child(4){
    margin: 0;
}
.display__item__settingsbar__box-title{
    width: fit-content;
    height: auto;
    float: left;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #8e99a5;
	position: relative;
}
.display__item__settingsbar__box-title::before {
    content: "";
    position: absolute;
    width: 13px;
    height: 13px;
    background-color: #576472;
    right: -19px;
    top: 3px;
    border-radius: 100px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(../images/icon/dropdown.svg);
    background-size: 9px;
}
.display__item__settingsbar__box-parametr{
    width: 100px;
    height: auto;
    min-height: 26px;
    float: left;
    font-size: 16px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: 1.59;
    letter-spacing: normal;
    text-align: left;
    color: #FFFFFF;
    margin: 5px 0 0 0;
    white-space: nowrap;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.display__item__settingsbar__box__voice{
    width: 33px;
    height: 5px;
    padding: 0 14px 0 0;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 5px 0 0 0;
}

/* Резервируем место под рейтинг голоса до выбора, чтобы не было layout shift */
.display__item__settingsbar__box[data-dropdown="2"] {
    min-height: 45px;
}
.display__item__settingsbar__box__voice.female::before{
    content: "";
    position: absolute;
    right: 0;
    top: -3px;
    width: 9px;
    height: 12.9px;
    background-image: url("https://apihost.ru/images/icon/revoice/women.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}
.display__item__settingsbar__box__voice.male::before{
    content: "";
    position: absolute;
    right: 0;
    top: -5px;
    width: 10px;
    height: 11px;
    background-image: url("https://apihost.ru/images/icon/revoice/men.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}
.display__item__settingsbar__box__voice div{
    width: 5px;
    height: 5px;
    border-radius: 1px;
    background-color: #687686;
}
.display__item__settingsbar__box__voice div.active{
    background-color: #4e9eff;
}
.display__item__settingsbar__box-loader div{
    width: 100%;
    height: 2px;
    float: left;
    border-radius: 1px;
    background-color: #616972;
    margin: 40px 0 0 0;
}
.display__item__content {
    width: 100%;
    height: calc(100% - 126px);
    float: left;
    border-radius: 24px;
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.12);
    border: solid 1px #39424b;
    background-color: #2e3640;
    margin: 16px 0 0 0;
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
}
.display__item__content__textarea{
    width: 100%;
    height: calc(100% - 193.5px);
    float: left;
    padding: 32px 39px 0 32px;
    box-sizing: border-box;
}
.display__item__content__textarea-close{
    position: absolute;
    right: 33px;
    top: 32px;
    width: 13.5px;
    height: 13.5px;
    background-image: url("../images/icon/delet.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: #2e3640;
    border: unset;
    cursor: pointer;
    padding: 0;
    display: none;
}
.display__item__content__textarea textarea{
    width: 100%;
    height: 100%;
    padding: 0 27px 0 0;
    box-sizing: border-box;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: #c7d1db;
    background-color: unset;
    border: unset;
    resize: unset;
}
.display__item__content__textarea textarea::-webkit-scrollbar {
    width: 4px;
}
.display__item__content__textarea textarea::-webkit-scrollbar-track {
    border-radius: 2px;
    background-color: #353e4a;
	margin: 40px 0 0 0;
}
.display__item__content__textarea textarea::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background-color: #616972;
}
.display__item__content__voice__list,
.display__item__content__voice__favorite{
    width: 100%;
    height: calc(100% - 54px);
    float: left;
    display: flex;
    flex-wrap: wrap;
    margin: 15px 0 0 0;
    padding: 0 18px 0 0;
    box-sizing: border-box;
    overflow-y: auto;
    gap: 8px;
    align-content: flex-start;
    align-items: flex-start;
}
.display__item__content__voice__list::-webkit-scrollbar,
.display__item__content__voice__favorite::-webkit-scrollbar {
    width: 4px;
}
.display__item__content__voice__list::-webkit-scrollbar-track,
.display__item__content__voice__favorite::-webkit-scrollbar-track {
    border-radius: 2px;
    background-color: #353e4a;
}
.display__item__content__voice__list::-webkit-scrollbar-thumb,
.display__item__content__voice__favorite::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background-color: #616972;
}
.display__item__content__voice__box{
    width: calc(20% - 8px);
    height: auto;
    border-radius: 16px;
    border: solid 1px #444f5a;
    background-color: #363f4b;
    box-sizing: border-box;
    padding: 6px 11px 5px 9.6px;
    margin: 0 0 4px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    cursor: pointer;
    transition: .4s;
}
.display__item__content__voice__box:not(.visible) {
    display: none !important;
}
.display__item__content__voice__box.visible {
    display: flex !important;
}
/* Плашка «Не нашли голос?» */
.voice-cta-banner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    margin-top: 10px;
    margin-bottom: 20px;
    padding: 26px 16px;
    border-radius: 16px;
    background-color: #6c63ff;
    border: none;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.25s ease;
    box-sizing: border-box;
}
.voice-cta-banner:hover {
    opacity: 0.9;
    box-shadow: 0 4px 16px rgba(108, 99, 255, 0.3);
}
.voice-cta-banner__text {
    font-size: 14px;
    font-weight: 500;
    font-family: 'Avenir Next Cyr Bold';
    color: #ffffff;
    line-height: normal;
}
.voice-cta-banner__link {
    font-size: 14px;
    font-weight: 500;
    font-family: 'Avenir Next Cyr Bold';
    color: #141618;
    line-height: normal;
}
.voice-cta-banner:hover .voice-cta-banner__link {
    color: #141618;
}
.voice-cta-banner__icon {
    width: 16px;
    height: 15px;
    flex-shrink: 0;
    transition: opacity 0.2s;
}
.voice-cta-banner:hover .voice-cta-banner__icon {
    opacity: 0.8;
}

/* Заблокированные голоса (free-версия) */
.display__item__content__voice__box.locked {
    opacity: 0.4;
    position: relative;
}
.display__item__content__voice__box.locked:hover {
    opacity: 0.6;
    border-color: #48525d;
}
.display__item__content__voice__box.locked .display__item__content__voice__box-favorite {
    display: none;
}

/* Все кнопки избранного приглушены в free-версии */
.display__item__content__voice__box-favorite {
    opacity: 0.35;
    pointer-events: auto;
}

/* Скрываем секцию «Избранные» и притушаем её вкладку в settingsbar */
.display__item__settingsbar__box[data-dropdown="6"] {
    opacity: 0.4;
    pointer-events: auto;
    cursor: pointer;
}
.display__item__content__dropdown__section[data-dropdown="6"] {
    display: none !important;
}
.display__item__content__voice__box:hover,
.display__item__content__voice__box.active{
	border-color: #4e9eff;
	background-color: rgb(78 158 255 0.6);
	transition: .4s;
}
.display__item__content__voice__box__top{
    width: 100%;
    height: auto;
    float: left;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: center;
    align-items: center;
}
.display__item__content__voice__box-title{
    width: calc(100% - 50px);
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #fff;
    display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.display__item__content__voice__box-play{
    width: 16px;
    height: 15.3px;
    background-image: url("https://apihost.ru/images/icon/revoice/play.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    border: unset;
    background-color: unset;
    cursor: pointer;
}
.display__item__content__voice__box-play.play{
    background-image: url("https://apihost.ru/images/icon/revoice/pause.svg");
}
.display__item__content__voice__box-favorite{
    width: 16px;
    height: 15.3px;
    background-image: url("https://apihost.ru/images/icon/revoice/favorite.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    border: unset;
    background-color: unset;
    cursor: pointer;
}
.display__item__content__voice__box-favorite.active{
    background-image: url("../images/icon/favorite-remove.svg?update=4");
}
.display__item__content__voice__box-price{
    width: 100%;
    height: auto;
    float: left;
    font-size: 12px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    line-height: normal;
    text-align: left;
    color: #8e99a5;
    padding: 2px 11px 0 24.5px;
    box-sizing: border-box;
}
.display__item__content__voice__box__bottom{
	width: 100%;
	height: auto;
	float: left;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-content: center;
	align-items: center;
	padding: 0 0 0 24.4px;
	box-sizing: border-box;
	margin: 5px 0 0 0;
}
.display__item__content__voice__box__bottom-class{
    width: fit-content;
    height: auto;
    min-height: 15px;
    font-size: 10px;
    font-family: 'Avenir Next Cyr Demi';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    padding: 1px 0 0 0;
    border: 1px solid transparent;
    box-sizing: border-box;
    position: relative;
}
/* === Плашки по дробной части рейтинга === */
/* Общий стиль подложки для основных 4 плашек */
.display__item__content__voice__box__bottom-class.badge-top,
.display__item__content__voice__box__bottom-class.badge-pro,
.display__item__content__voice__box__bottom-class.badge-hit,
.display__item__content__voice__box__bottom-class.badge-hd{
    padding: 1px 6px 1px 6px;
    border-radius: 4px;
    font-size: 9px;
    letter-spacing: 0.8px;
    font-family: 'Avenir Next Cyr Demi';
    line-height: normal;
}
/* Иконка гендера теперь отдельным элементом */
.display__item__content__voice__box__bottom-class.badge-top.female::before,
.display__item__content__voice__box__bottom-class.badge-pro.female::before,
.display__item__content__voice__box__bottom-class.badge-hit.female::before,
.display__item__content__voice__box__bottom-class.badge-hd.female::before,
.display__item__content__voice__box__bottom-class.badge-top.male::before,
.display__item__content__voice__box__bottom-class.badge-pro.male::before,
.display__item__content__voice__box__bottom-class.badge-hit.male::before,
.display__item__content__voice__box__bottom-class.badge-hd.male::before{
    display: none;
}
.display__item__content__voice__box__bottom-class.badge-top{
    color: #22c55e;
    background: rgba(34, 197, 94, 0.12);
    border: 1px solid rgba(34, 197, 94, 0.30);
}
.display__item__content__voice__box__bottom-class.badge-pro{
    color: #60a5fa;
    background: rgba(96, 165, 250, 0.12);
    border: 1px solid rgba(96, 165, 250, 0.30);
}
.display__item__content__voice__box__bottom-class.badge-hit{
    color: #fbbf24;
    background: rgba(251, 191, 36, 0.12);
    border: 1px solid rgba(251, 191, 36, 0.30);
}
.display__item__content__voice__box__bottom-class.badge-hd{
    color: #22d3ee;
    background: rgba(34, 211, 238, 0.12);
    border: 1px solid rgba(34, 211, 238, 0.30);
}
/* Второстепенные плашки — без подложки, только цвет */
.display__item__content__voice__box__bottom-class.badge-hot{
    color: #f87171;
}
.display__item__content__voice__box__bottom-class.badge-new{
    color: #c084fc;
}
.display__item__content__voice__box__bottom-class.female::before{
    content: "";
    position: absolute;
    left: 0;
    top: 0px;
    width: 9px;
    height: 12.9px;
    background-image: url("https://apihost.ru/images/icon/revoice/women.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: none;
}
.display__item__content__voice__box__bottom-class.male::before{
    content: "";
    position: absolute;
    left: 0;
    top: 0px;
    width: 10px;
    height: 11px;
    background-image: url("https://apihost.ru/images/icon/revoice/men.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    display: none;
}
/* Группа: пол + иконки фич + плашка */
.voice-badge-group{
    display: flex;
    align-items: center;
    gap: 6px;
}
/* Иконки фич на карточке голоса (эмоции, ударения) */
.voice-feat-icon{
    width: 11px;
    height: 11px;
    opacity: 0.5;
    flex-shrink: 0;
}
.badge-table .voice-feat-icon{
    width: 18px;
    height: 18px;
    opacity: 0.7;
}
.voice-feat-icon.has-emotions{
    opacity: 0.8;
    filter: brightness(0.8) sepia(1) hue-rotate(10deg) saturate(3);
}
.voice-feat-icon.no-stress{
    opacity: 0.8;
    filter: brightness(0.5) sepia(1) hue-rotate(-30deg) saturate(5);
}
/* Иконка пола — отдельный элемент */
.voice-gender-icon{
    display: inline-block;
    flex-shrink: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}
.voice-gender-icon.female{
    width: 9px;
    height: 12.9px;
    background-image: url("https://apihost.ru/images/icon/revoice/women.svg");
}
.voice-gender-icon.male{
    width: 10px;
    height: 11px;
    background-image: url("https://apihost.ru/images/icon/revoice/men.svg");
}
.display__item__content__voice__box__bottom-param{
    width: 33px;
    height: auto;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.display__item__content__voice__box__bottom-param div{
    width: 5px;
    height: 5px;
    border-radius: 1px;
    background-color: #687686;
}
.display__item__content__voice__box__bottom-param div.active{
    background-color: #4e9eff;
}
.display__item__content__value__block{
    width: 100%;
    height: auto;
    float: left;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 16px 0 0 0;
}
.display__item__content__value__block div:nth-child(1){
    width: 20px;
    height: auto;
}
.display__item__content__value__block div:nth-child(2){
    width: calc(100% - 73px);
    height: auto;
}
.display__item__content__value__block div:nth-child(3){
    width: 20px;
    height: auto;
}
.display__item__content__value__block div span{
    width: fit-content;
    height: auto;
    float: left;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.93;
    letter-spacing: normal;
    text-align: left;
    color: #8e99a5;
}
.display__item__content__value__block .inputRange {
    appearance: none;
    width: 100%;
    height: 2px;
    border-radius: 9999px;
    background: linear-gradient(90deg, #ffffff 0%, #616972 0%);
    cursor: pointer;
}
.display__item__content__value__block .inputRange::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    border-radius: 9999px;
    background: #ffffff;
    box-shadow: none;
}
.display__item__content__value__block .inputRange::-moz-range-thumb {
    border: none;
    width: 18px;
    height: 18px;
    border-radius: 9999px;
    background: #ffffff;
    box-shadow: none;
}
.display__item__chatgpt{
    width: 100%;
    height: 100%;
    float: left;
    border-radius: 24px;
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.12);
    border: solid 1px #39424b;
    background-color: #2e3640;
    padding: 0 !important;
    box-sizing: border-box;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
}
.display__item__chatgpt::-webkit-scrollbar {
    width: 4px;
}
.display__item__chatgpt::-webkit-scrollbar-track {
    border-radius: 2px;
    background-color: #353e4a;
}
.display__item__chatgpt::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background-color: #616972;
}
.display__item__chatgpt-close{
    position: absolute;
    right: 25px;
    top: 24px;
    width: 13.5px;
    height: 13.5px;
    background-image: url("https://apihost.ru/images/icon/revoice/close.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: #2e3640;
    border: unset;
    cursor: pointer;
    padding: 0;
}
.display__item__settings__list{
    width: 100%;
    max-width: 498px;
    height: auto;
    float: left;
    margin: 10px 0 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
}
.display__item__settings__box{
    width: 100%;
    height: auto;
    float: left;
    margin: 0;
}
.display__item__settings__box-title{
    width: 100%;
    height: auto;
    float: left;
    font-size: 16px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #8e99a5;
}
.display__item__settings__box-title span{
    color: #FFFFFF;
    margin: 0 0 0 14px;
}
.display__item__settings__block{
    width: 100%;
    height: auto;
    float: left;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 16px 0 0 0;
}
.display__item__settings__block select{
    width: 100%;
    height: auto;
    float: left;
    padding: 12px 20px;
    border-radius: 12px;
    background-color: #3f4752;
    box-sizing: border-box;
    border: unset;
    font-size: 14px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #FFFFFF;
    background-position: calc(100% - 20px) center;
    background-repeat: no-repeat;
    background-image: url("../images/icon/dropdown.svg");
    background-size: 10px;
    cursor: pointer;
}
.display__item__settings__block div:nth-child(1){
    width: 20px;
    height: auto;
}
.display__item__settings__block div:nth-child(2){
    width: calc(100% - 73px);
    height: auto;
}
.display__item__settings__block div:nth-child(3){
    width: 20px;
    height: auto;
}
.display__item__settings__block div span{
    width: fit-content;
    height: auto;
    float: left;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.93;
    letter-spacing: normal;
    text-align: left;
    color: #8e99a5;
}
.inputRange {
    appearance: none;
    width: 100%;
    height: 2px;
    border-radius: 9999px;
    background: linear-gradient(90deg, #ffffff 0%, #616972 0%);
    cursor: pointer;
}
.inputRange::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    border-radius: 9999px;
    background: #ffffff;
    box-shadow: none;
}
.inputRange::-moz-range-thumb {
    border: none;
    width: 18px;
    height: 18px;
    border-radius: 9999px;
    background: #ffffff;
    box-shadow: none;
}
.display__item__settings__format{
    width: 100%;
    height: auto;
    float: left;
}
.display__item__settings__format-title{
    width: 100%;
    height: auto;
    float: left;
    font-size: 16px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #8e99a5;
}
.display__item__settings__format__radios{
    width: 100%;
    height: auto;
    float: left;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    margin: 19px 0 0 0;
}
.display__item__settings__format__radio{
    width: fit-content;
    height: auto;
    float: left;
    margin: 0 12px 0 0;
}
.display__item__settings__format__radio input[type='radio'] {
    display: none;
}
.display__item__settings__format__radio label{
    width: fit-content;
    height: auto;
    float: left;
    font-size: 14px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #FFFFFF;
    border-radius: 12px;
    background-color: #363f4b;
    padding: 9px 16px;
    cursor: pointer;
    border: 1px solid #363f4b;
    box-sizing: border-box;
}
.display__item__settings__format__radio input:checked + label {
    border: 1px solid #4e9eff;
}
.display__item__settings__format-save{
    width: fit-content;
    height: auto;
    float: right;
    font-size: 16px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #FFFFFF;
    margin: -40px 0 0 0;
    border-radius: 12px;
    background-color: #4e9eff;
    padding: 10px 30px 11px;
    border: unset;
    cursor: pointer;
}
.display__item__settings__rule{
    width: 100%;
    max-width: 498px;
    height: auto;
    float: left;
    margin: 30px 0;
}
.display__item__settings__rule-title{
    width: fit-content;
    height: auto;
    float: left;
    font-size: 16px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #8e99a5;
}
.display__item__settings__rule-status{
    width: fit-content;
    height: auto;
    float: right;
    font-size: 16px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: right;
    color: #4e9eff;
	position: relative;
}
.display__item__settings__rule-status input{
	width: 100%;
	height: 100%;
	right: 0;
	top: 0;
	position: absolute;
	opacity: 0;
    cursor: pointer;
    z-index: 1005;
}
.display__item__settings__rule-status p{
	width: fit-content;
	height: auto;
	padding: 0 0 0 25px;
	box-sizing: border-box;
}
.display__item__settings__rule-status p::before{
	content: "";
	position: absolute;
	width: 15px;
	height: 15px;
	border: 1px solid #8f99a6;
	background-color: #3f4752;
	border-radius: 3px;
	left: 0%;
	top: 51%;
	-webkit-transform: translate(0%, -50%);
	transform: translate(0%, -50%);
    background-position: center;
    background-repeat: no-repeat;
    background-size: auto;
}
.display__item__settings__rule-status input:checked + p::before{
	border: 1px solid #4f9ef7;
	background-color: #4f9ef7;
    background-image: url("../images/icon/check.svg");
}
.display__item__settings__rule__list{
    width: 100%;
    height: auto;
    float: left;
    margin: 7px 0 0 0;
}
.display__item__settings__rule__box{
    width: 100%;
    height: auto;
    float: left;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    margin: 12px 0 0 0;
}
.display__item__settings__rule__block:nth-child(1),
.display__item__settings__rule__block:nth-child(3){
    width: calc(50% - 36px);
}
.display__item__settings__rule__block:nth-child(2),
.display__item__settings__rule__block:nth-child(4){
    width: 36px;
    font-size: 16px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #8e99a5;
    font-family: 'Avenir Next Cyr Medium';
}
.display__item__settings__rule__block input{
    width: 100%;
    height: auto;
    float: left;
    padding: 12px 20px;
    border-radius: 12px;
    background-color: #3f4752;
    box-sizing: border-box;
    border: unset;
    font-size: 14px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #FFFFFF;
}
.display__item__settings__rule__block-remove{
    width: 14px;
    height: 16px;
    background-image: url("../images/icon/delet.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    float: right;
    border: unset;
    background-color: unset;
    cursor: pointer;
}
.display__item__settings__rule-add{
    width: calc(100% - 36px);
    height: auto;
    float: left;
    font-size: 16px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #FFFFFF;
    margin: 15px 0 0 0;
    border-radius: 12px;
    background-color: #4e9eff;
    padding: 10px 0 11px;
    border: unset;
    cursor: pointer;
}
.display__item__content__information{
    width: 100%;
    height: auto;
    float: left;
    padding: 16px 32px;
    box-sizing: border-box;
    border-top: 1px solid #39424b;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: center;
    align-items: center;
    margin: 23.5px 0 0 0;
}
.display__item__content__information__box{
    width: 48%;
    max-width: 409px;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: center;
    align-items: center;
}
.display__item__content__information__box p{
    width: fit-content;
    height: auto;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: right;
    color: #8e99a5;
}
.display__item__content__information__box button{
    width: 45%;
    max-width: 226px;
    height: auto;
    padding: 11px 0 11px;
    border-radius: 12px;
    background-color: #4e9eff;
    border: unset;
    cursor: pointer;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.display__item__content__information__box button > span{
    width: fit-content;
    height: auto;
    font-size: 16px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #FFFFFF;
    position: relative;
    padding: 0 0 0 26px;
}
.display__item__content__information__box button > span::before {
    content: "";
    position: absolute;
    width: 17px;
    height: 17px;
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;
    left: 0%;
    top: 50%;
    -webkit-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
    background-image: url("https://apihost.ru/images/icon/revoice/menu-1.svg");
    filter: invert(96%) sepia(0%) saturate(0%) hue-rotate(1deg) brightness(405%) contrast(104%);
}
.display__item__content__playeer{
    width: 100%;
    height: auto;
    float: left;
    padding: 25px 30px 25px 32px;
    border-radius: 0 0 23px 23px;
    background-color: #343d48;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: center;
    align-items: center;
}
.display__item__content__playeer__box:nth-child(1){
    width: 102px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.display__item__content__playeer__box:nth-child(2){
    width: calc(100% - 232px);
}
.display__item__content__playeer__box:nth-child(3){
    width: 65px;
}
.display__item__content__playeer__box-play{
    width: 45px;
    height: 45px;
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.12);
    border: solid 1px #48525d;
    border-radius: 100px;
    background-color: #343d48;
    background-image: url("https://apihost.ru/images/icon/revoice/play.svg");
    background-position: 8px;
    background-repeat: no-repeat;
    background-size: 30px 13px;
    box-sizing: border-box;
    cursor: pointer;
}
.display__item__content__playeer__box-play.playing{
    background-position: 7px;
    background-image: url("https://apihost.ru/images/icon/revoice/pause.svg");
}
.display__item__content__playeer__box-download{
    width: 45px;
    height: 45px;
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.12);
    border: solid 1px #48525d;
    border-radius: 100px;
    background-color: #343d48;
    background-image: url("https://apihost.ru/images/icon/revoice/download.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 15px;
    box-sizing: border-box;
    cursor: pointer;
}
.display__item__content__playeer-timer{
    width: 100%;
    height: auto;
    float: right;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    text-align: right;
    color: #8e99a5;
}
.display__item__history{
    width: 100%;
    height: 100%;
    float: left;
    border-radius: 24px;
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.12);
    border: solid 1px #39424b;
    background-color: #2e3640;
    overflow: hidden;
}
.display__item__mega .display__item__history{
    padding: 0 50px 0 0;
    box-sizing: border-box;
}
.display__item__history-title{
    width: 100%;
    height: auto;
    float: left;
    font-size: 18px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: #FFFFFF;
    padding: 0;
    box-sizing: border-box;
}
.display__item__history-heading {
    width: 100%;
    float: left;
    padding: 40px 32px 20px;
    box-sizing: border-box;
    border-bottom: 1px solid #39424b;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.display__item__history-heading-main{
    min-width: 0;
    flex: 1 1 auto;
}
.display__item__history-subtitle {
    width: 100%;
    float: left;
    font-size: 12px;
    font-family: 'Avenir Next Cyr Medium';
    font-weight: normal;
    color: #8e99a5;
    line-height: 1.4;
    margin-top: 4px;
    text-align: left;
}
.display__item__history-pro{
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 15px;
    border-radius: 12px;
    border: 1px solid rgba(120, 167, 255, 0.34);
    background: linear-gradient(180deg, rgba(110, 150, 230, 0.12) 0%, rgba(110, 150, 230, 0.05) 100%);
    color: #f4f8ff;
    text-decoration: none;
    font-size: 12px;
    font-family: 'Avenir Next Cyr Demi';
    line-height: 1;
    white-space: nowrap;
    letter-spacing: 0.02em;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 8px 20px rgba(0, 0, 0, 0.12);
    transition: background .2s, border-color .2s, opacity .2s;
}
.display__item__history-pro:hover{
    background: linear-gradient(180deg, rgba(120, 164, 245, 0.18) 0%, rgba(120, 164, 245, 0.08) 100%);
    border-color: rgba(140, 184, 255, 0.48);
}
.display__item__mega .display__item__history-title{
    width: calc(100% - 32px);
    padding: 40px 0 40px 32px;
}
.display__item__history__list{
    width: 100%;
    height: calc(100% - 102px);
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}
.display__item__mega .display__item__history__list{
    width: 100%;
    height: calc(100% - 123px);
    float: left;
    padding: 0 27px 0 0;
    box-sizing: border-box;
    overflow-y: scroll;
}
.display__item__history__list::-webkit-scrollbar {
    width: 4px;
}
.display__item__history__list::-webkit-scrollbar-track {
    border-radius: 2px;
    background-color: #353e4a;
}
.display__item__history__list::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background-color: #616972;
}
.display__item__history__box{
    width: 100%;
    height: auto;
    float: left;
    padding: 15.5px 16px;
    box-sizing: border-box;
    border-top: 1px solid #39424b;
    transition: .4s;
}
.display__item__history__box:first-child{
	border-top: unset;
}
.display__item__history__box:hover{
    background-color: #323a45;
    transition: .4s;
}
.display__item__history__box.active{
    background-color: rgb(78, 158, 255, 0.04);
    transition: .4s;
}
.display__item__history__player{
    width: 100%;
    height: auto;
    float: left;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: center;
    align-items: center;
}
.display__item__history__player__block:nth-child(1){
    width: 82px;
    height: auto;
    float: left;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.display__item__history__player__block:nth-child(2){
    width: calc(100% - 190px);
    height: auto;
    overflow: hidden;
}
.display__item__history__player__block:nth-child(3){
    width: 90px;
    height: auto;
    float: left;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    position: relative;
}
.display__item__history__player__block.wave-container,
.display__item__history__player__block.wave-container wave,
.display__item__content__playeer__box wave{
    overflow: hidden !important;
}
.display__item__history__player__block-play{
    width: 35px;
    height: 35px;
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.12);
    border: solid 1px #48525d;
    border-radius: 100px;
    background-color: #2b333c;
    background-image: url("https://apihost.ru/images/icon/revoice/play.svg");
    background-position: 5px;
    background-repeat: no-repeat;
    background-size: 26px 11px;
    box-sizing: border-box;
    cursor: pointer;
}
.display__item__history__player__block-play.playing{
    background-image: url("https://apihost.ru/images/icon/revoice/pause.svg");
    background-position: 4px;
}
.display__item__history__player__block-download{
    width: 35px;
    height: 35px;
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.12);
    border: solid 1px #48525d;
    border-radius: 100px;
    background-color: #2b333c;
    background-image: url("https://apihost.ru/images/icon/revoice/download.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 15px;
    box-sizing: border-box;
    cursor: pointer;
}
.display__item__history__box-description{
    width: 100%;
    height: auto;
    float: left;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.43;
    letter-spacing: normal;
    text-align: left;
    color: #8e99a5;
    padding: 0 28px 0 98px;
    box-sizing: border-box;
    transition: .4s;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 5px 0 0 0;
}
.display__item__history__box:hover .display__item__history__box-description{
    color: #FFFFFF;
    transition: .4s;
}
.display__item__history__box.active .display__item__history__box-description{
    color: #4e9eff;
    transition: .4s;
}

/* === Demo examples === */
.demo-example {
    cursor: pointer;
}
.demo-example__info {
    width: 100%;
    float: left;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 0 0 0;
    box-sizing: border-box;
}
.demo-example__name {
    font-size: 14px;
    font-family: 'Avenir Next Cyr Medium';
    color: #fff;
    line-height: 1;
}
.demo-voice-badge {
    display: inline-block;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 9px;
    letter-spacing: 0.8px;
    font-family: 'Avenir Next Cyr Demi';
    line-height: normal;
    white-space: nowrap;
}
.demo-voice-badge.badge-top {
    color: #22c55e;
    background: rgba(34, 197, 94, 0.12);
    border: 1px solid rgba(34, 197, 94, 0.30);
}
.demo-voice-badge.badge-pro {
    color: #60a5fa;
    background: rgba(96, 165, 250, 0.12);
    border: 1px solid rgba(96, 165, 250, 0.30);
}
.demo-voice-badge.badge-new {
    color: #c084fc;
    background: rgba(192, 132, 252, 0.12);
    border: 1px solid rgba(192, 132, 252, 0.30);
}
.demo-voice-badge.badge-hot {
    color: #f87171;
    background: rgba(248, 113, 113, 0.12);
    border: 1px solid rgba(248, 113, 113, 0.30);
}
.demo-voice-badge.demo-gender {
    color: #8e99a5;
    background: rgba(142, 153, 165, 0.10);
    border: 1px solid rgba(142, 153, 165, 0.20);
    font-size: 9px;
}
.demo-voice-badge.demo-gender.female {
    color: #f472b6;
    background: rgba(244, 114, 182, 0.10);
    border: 1px solid rgba(244, 114, 182, 0.20);
}
.demo-example__desc {
    width: 100%;
    float: left;
    font-size: 12px;
    color: #8e99a5;
    line-height: 1.4;
    margin: 6px 0 0 0;
    padding: 0;
}

/* === Feedback block === */
.feedback-block {
    width: 100%;
    padding: 20px 16px;
    margin-top: auto;
    box-sizing: border-box;
    border-top: 1px solid #39424b;
}
.feedback-block__title {
    font-size: 14px;
    font-family: 'Avenir Next Cyr Medium';
    color: #fff;
    margin: 0 0 4px 0;
}
.feedback-block__desc {
    font-size: 12px;
    color: #8e99a5;
    line-height: 1.4;
    margin: 0 0 12px 0;
}
#feedback_result {
    margin-bottom: 8px;
}
#feedback_result p {
    font-size: 12px;
    line-height: 1.4;
}
#feedback_form input[type="email"],
#feedback_form textarea {
    width: 100%;
    border-radius: 8px;
    border: 1px solid #48525d;
    background-color: #2b333c;
    color: #d1d5db;
    font-size: 13px;
    padding: 8px 10px;
    box-sizing: border-box;
    font-family: 'Avenir Next Cyr', sans-serif;
    resize: vertical;
    outline: none;
    transition: border-color .2s;
}
#feedback_form input[type="email"]:focus,
#feedback_form textarea:focus {
    border-color: #4e9eff;
}
#feedback_form input[type="email"] {
    margin-bottom: 8px;
}
#feedback_form textarea {
    margin-bottom: 10px;
    min-height: 60px;
}
#feedback_form button {
    display: inline-block;
    padding: 7px 18px;
    border-radius: 8px;
    border: none;
    background-color: #4e9eff;
    color: #fff;
    font-size: 13px;
    font-family: 'Avenir Next Cyr Medium';
    cursor: pointer;
    transition: background-color .2s, opacity .2s;
}
#feedback_form button:hover:not(:disabled) {
    background-color: #3b8ee6;
}
#feedback_form button:disabled {
    background-color: #48525d;
    color: #8e99a5;
    opacity: 0.7;
    cursor: not-allowed;
}
.feedback-block__consent {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    cursor: pointer;
}
.feedback-block__consent input[type="checkbox"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
    flex-shrink: 0;
    width: 15px;
    height: 15px;
    background-color: #2b333c;
    border: 1px solid #48525d;
    border-radius: 3px;
    cursor: pointer;
    position: relative;
    transition: background-color .2s, border-color .2s;
}
.feedback-block__consent input[type="checkbox"]:checked {
    background-color: #4e9eff;
    border-color: #4e9eff;
}
.feedback-block__consent input[type="checkbox"]:checked::after {
    content: "";
    position: absolute;
    left: 4px;
    top: 1px;
    width: 5px;
    height: 9px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.feedback-block__consent span {
    font-size: 11px;
    color: #8e99a5;
    line-height: 1.4;
}
.feedback-block__consent a {
    color: #4e9eff;
    text-decoration: none;
}
.feedback-block__consent a:hover {
    text-decoration: underline;
}
/* === /Feedback block === */
.display__item__history__box__parametrs{
    width: 100%;
    height: auto;
    float: left;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 16px 0 0 0;
    padding: 0 0 0 98px;
    box-sizing: border-box;
}
.display__item__history__box__parametrs p{
    width: fit-content;
    height: auto;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #8e99a5;
}
.display__item__history__player__block-timer{
    width: fit-content;
    height: auto;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #8e99a5;
}
.display__item__history__player__block-parametr{
    width: 4px;
    height: 18px;
    background-image: url("https://apihost.ru/images/icon/revoice/parametr.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
    background-color: unset;
    border: unset;
}
.display__item__history__player__block-parametr.active{
    opacity: 0.5;
}
.display__item__history__player__block-dropdown{
    width: 200px;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.12);
    border: solid 1px #39424b;
    background-color: #343d48;
    box-sizing: border-box;
    position: absolute;
    right: 0;
    top: 29px;
    display: none;
}
.display__item__history__player__block-dropdown li{
    width: 100%;
    height: auto;
    float: left;
    padding: 14px 20px;
    box-sizing: border-box;
    border-bottom: 1px solid #39424b;
}
.display__item__history__player__block-dropdown li:last-child{
    border: unset;
}
.display__item__history__player__block-dropdown li > a{
    width: 100%;
    height: auto;
    float: left;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #FFFFFF;
    padding: 0 0 0 24px;
    box-sizing: border-box;
    position: relative;
}
.display__item__history__player__block-dropdown li > a::before{
    content: "";
    position: absolute;
    width: 14px;
    height: 16px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    left: 0%;
    top: 50%;
    -webkit-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
}
.display__item__history__player__block-dropdown li:nth-child(1) a::before{
    background-image: url("https://apihost.ru/images/icon/revoice/edit.svg");
}
.display__item__history__player__block-dropdown li:nth-child(2) a::before{
    background-image: url("https://apihost.ru/images/icon/revoice/delet.svg");
}
.display__item__content__dropdown{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background-color: rgb(46, 54, 64, 0.94);
    display: none;
    flex-wrap: wrap;
    justify-content: center;
    align-content: flex-start;
    padding: 20px 23px 0;
    box-sizing: border-box;
    z-index: 4;
}
.display__item__content__dropdown__section{
    width: 100%;
    height: 100%;
    float: left;
    display: none;
}
.display__item__content__dropdown__section .dropdown-heading{
    width: 100%;
    height: auto;
    display: block;
    float: left;
    font-size: 16px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #8e99a5;
    box-sizing: border-box;
}
.display__item__content__dropdown__section .dropdown-heading > b{
    color: #ffffff;
    font-family: 'Avenir Next Cyr Medium';
}
.display__item__content__dropdown-close{
    position: absolute;
    right: 25px;
    top: 24px;
    width: 13.5px;
    height: 13.5px;
    background-image: url("https://apihost.ru/images/icon/revoice/close.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-color: #2e3640;
    border: unset;
    cursor: pointer;
    padding: 0;
}
.display__item__content__dropdownfilter{
    width: 100%;
    height: auto;
    float: left;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    flex-direction: row;
    gap: 8px;
    margin: 15px 0 0 0;
    padding: 0 26px 0 0;
    box-sizing: border-box;
}
.display__item__content__dropdownfilter div{
    width: 100%;
    height: auto;
    display: flex;
    align-content: center;
    align-items: center;
}
.display__item__content__dropdownfilter div > input{
    width: 100%;
    height: auto;
    float: left;
    padding: 12px 20px;
    border-radius: 12px;
    background-color: #363f4b;
    box-sizing: border-box;
    border: unset;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #FFFFFF;
}
.display__item__content__dropdownfilter div > select{
    width: 100%;
    height: auto;
    float: left;
    padding: 12px 20px;
    border-radius: 12px;
    background-color: #363f4b;
    box-sizing: border-box;
    border: unset;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #FFFFFF;
    background-position: calc(100% - 20px) center;
    background-repeat: no-repeat;
    background-image: url("../images/icon/dropdown.svg");
    background-size: 10px;
    cursor: pointer;
}
.display__item__content__dropdownfilter div > label{
    width: fit-content;
    height: auto;
    float: left;
    font-size: 16px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: right;
    color: #4e9eff;
    position: relative;
}
.display__item__content__dropdownfilter div > label > input{
	width: 100%;
	height: 100%;
	right: 0;
	top: 0;
	position: absolute;
	opacity: 0;
    cursor: pointer;
    z-index: 1005;
}
.display__item__content__dropdownfilter div > label > span{
	width: fit-content;
	height: auto;
	padding: 0 0 0 25px;
	box-sizing: border-box;
}
.display__item__content__dropdownfilter div > label > span::before{
	content: "";
	position: absolute;
	width: 15px;
	height: 15px;
	border: 1px solid #8f99a6;
	background-color: #3f4752;
	border-radius: 3px;
	left: 0%;
	top: 51%;
	-webkit-transform: translate(0%, -50%);
	transform: translate(0%, -50%);
    background-position: center;
    background-repeat: no-repeat;
    background-size: auto;
}
.display__item__content__dropdownfilter div > label > span::before{
	border: 1px solid #4f9ef7;
	background-color: #4f9ef7;
    background-image: url("../images/icon/check.svg");
}
.display__item__content__dropdown__section-loader{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
    padding: 0 5%;
    box-sizing: border-box;
}
.display__item__content__dropdown__section-loader div{
    width: 100%;
    height: 2px;
    float: left;
    border-radius: 1px;
    background-color: #616972;
    margin: 40px 0 0 0;
}
.display__item__content__dropdown__section-loader div > span{
    width: 0%;
    height: 2px;
    float: left;
    background-color: #fff;
    transition: width 0.3s linear;
}
.display__item__content__dropdown__section-loader p {
    width: 100%;
    height: auto;
    float: left;
    font-size: 16px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #FFFFFF;
}
.display__item__content__dropdown__tools{
    width: 100%;
    height: calc(100% - 105px);
    float: left;
    display: flex;
    flex-wrap: wrap;
    margin: 15px 0 0 0;
    padding: 0 18px 0 0;
    box-sizing: border-box;
    overflow-y: auto;
    gap: 8px;
    align-content: flex-start;
    align-items: flex-start;
}
.display__item__content__dropdown__tools .display__item__menu{
    padding: 0;
    margin: 0;
    border: unset;
    border-radius: 0;
    background-color: unset;
    box-shadow: unset;
    display: none;
}
.display__item__content__dropdown__tools .display__item__menu > ul > li {
    margin: 10px 0;
}
.display__item__content__dropdown__tools .display__item__menu > ul > li > .display__item__settingsbar__box.unactive{
    opacity: 1;
}
.display__item__content__dropdown__tools::-webkit-scrollbar {
    width: 4px;
}
.display__item__content__dropdown__tools::-webkit-scrollbar-track {
    border-radius: 2px;
    background-color: #353e4a;
}
.display__item__content__dropdown__tools::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background-color: #616972;
}
.display__item__content__languages__box-checkbox,
.display__item__content__emotions__box-checkbox{
    width: calc(25% - 6px);
    height: auto;
    position: relative;
}
/* === Часто используемые языки === */
.display__item__content__languages-popular{
    width: 100%;
    float: left;
    margin: 0 0 12px 0;
    padding: 0 0 12px 0;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}
.display__item__content__languages-popular-title{
    display: block;
    font-size: 11px;
    font-weight: 500;
    color: #6b7685;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 8px 0;
}
.display__item__content__languages-popular-list{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.display__item__content__languages__box-checkbox input,
.display__item__content__emotions__box-checkbox input{
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    position: absolute;
    opacity: 0;
    cursor: pointer;
    z-index: 1;
}
.display__item__content__languages__box-checkbox label,
.display__item__content__emotions__box-checkbox label{
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    padding: 0 15px;
    line-height: 36px;
    font-size: 13px;
    font-family: 'Avenir Next Cyr Medium';
    color: #FFFFFF;
    background-color: #363f4b;
    border: 1px solid #363f4b;
    border-radius: 12px;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-sizing: border-box;
}
.display__item__content__languages__box-checkbox input:checked + label,
.display__item__content__emotions__box-checkbox input:checked + label {
    border: 1px solid #4e9eff;
    background-color: rgb(78 158 255 / 6%);
}
/* Заблокированные языки (free-версия) */
.display__item__content__languages__box-checkbox.lang-locked {
    opacity: 0.35;
    position: relative;
}
.display__item__content__languages__box-checkbox.lang-locked:hover {
    opacity: 0.55;
}
.display__item__content__languages__box-checkbox.lang-locked label {
    cursor: not-allowed;
}
.display__item__content__languages__box-checkbox.lang-locked input {
    cursor: not-allowed;
}
.display__item__content__emotions__box-checkbox.emotion-locked {
    opacity: 0.35;
    position: relative;
}
.display__item__content__emotions__box-checkbox.emotion-locked:hover {
    opacity: 0.55;
}
.display__item__content__emotions__box-checkbox.emotion-locked label {
    cursor: not-allowed;
}
.display__item__content__emotions__box-checkbox.emotion-locked input {
    cursor: not-allowed;
}
.display__item__content__languages-title {
    width: 100%;
    height: auto;
    float: left;
    font-size: 16px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #8e99a5;
    padding: 0 15px;
    box-sizing: border-box;
}
.display__item__chat{
    width: 100%;
    height: 100%;
    float: left;
    border-radius: 24px;
    box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.12);
    border: solid 1px #39424b;
    background-color: #2B333C;
}
.display__item__chat__header{
    width: 100%;
    height: auto;
    float: left;
    background-color: #343D48;
    padding: 25px 30px;
    box-sizing: border-box;
    border-radius: 24px 24px 0 0;
}
.display__item__chat__assistent{
    width: 100%;
    height: auto;
    float: left;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    align-content: center;
}
.display__item__chat__assistent div:nth-child(1){
    width: 40px;
    height: auto;
}
.display__item__chat__assistent div:nth-child(2){
    width: calc(100% - 60px);
    height: auto;
}
.display__item__chat__assistent div > img{
    width: 40px;
    height: 40px;
    border-radius: 100px;
    object-fit: cover;
    object-position: center;
}
.display__item__chat__assistent div > p{
    width: 100%;
    height: auto;
    float: left;
    font-size: 16px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #FFFFFF;
}
.display__item__chat__assistent div > span{
    width: 100%;
    height: auto;
    float: left;
    font-size: 14px;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #a8adb2;
    margin: 1px 0 0 0;
    padding: 0 0 0 13px;
    box-sizing: border-box;
    position: relative;
}
.display__item__chat__assistent div > span::before{
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 100px;
    background-color: #4ADE80;
    left: 0;
    top: 6.5px;
}
.display__item__chat__main{
    width: 100%;
    height: calc(100% - 188px);
    float: left;
    padding: 25px 30px;
    box-sizing: border-box;
    overflow-y: scroll;
}
.display__item__chat__main::-webkit-scrollbar {
    width: 4px;
}
.display__item__chat__main::-webkit-scrollbar-track {
    border-radius: 2px;
    background-color: #353e4a;
}
.display__item__chat__main::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background-color: #616972;
}
.display__item__chat__box{
    width: 90%;
    height: auto;
    float: left;
    background-color: #21272E;
    border: solid 1px #39424b;
    padding: 21px 75px;
    box-sizing: border-box;
    border-radius: 15px;
    position: relative;
    margin: 0 0 20px;
}
.display__item__chat__box.chating{
    padding: 21px 0px 21px 75px;
    width: 125px;
}
.display__item__chat__box-user{
    width: 30px;
    height: 30px;
    border-radius: 100px;
    object-position: center;
    object-fit: cover;
    position: absolute;
    left: 15px;
    top: 15px;
}
.display__item__chat__box-message{
    width: 100%;
    height: auto;
    float: left;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #FFFFFF;
}
.display__item__chat__box-message span{
    width: 5px;
    height: 5px;
    float: left;
    border-radius: 100px;
    background-color: #a8adb2;
    margin: 5px 5px 5px 0;
    animation: bounce 1.2s infinite ease-in-out;
}
.display__item__chat__box-message a{
    color: #4e9eff;
    text-decoration: un;
}
.display__item__chat__box-message span:nth-child(2) {
    animation-delay: 0.2s;
}
.display__item__chat__box-message span:nth-child(3) {
    animation-delay: 0.4s;
}

@keyframes bounce {
    0%, 80%, 100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-6px); /* вверх */
    }
}
.display__item__chat__box-poster{
    width: 70%;
    height: auto;
    float: left;
    border-radius: 10px;
    margin: 20px 0 0 0;
}
.display__item__chat__box-time{
    width: fit-content;
    height: auto;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: right;
    color: #a8adb2;
    position: absolute;
    right: 0;
    bottom: 22px;
    padding: 0 20px 0 0;
}
.display__item__chat__footer{
    width: 100%;
    height: auto;
    float: left;
    background-color: #343D48;
    padding: 25px 30px;
    box-sizing: border-box;
    border-radius: 0 0 24px 24px;
}
.display__item__chat__footer form{
    width: 100%;
    height: auto;
    float: left;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.display__item__chat__footer form > label{
    width: calc(100% - 160px);
    height: auto;
    float: left;
}
.display__item__chat__footer form > label > textarea{
    width: 100%;
    height: 45px;
    float: left;
    padding: 12px 20px;
    border-radius: 12px;
    background-color: #2B333C;
    box-sizing: border-box;
    border: unset;
    font-size: 14px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #FFFFFF;
    resize: unset;
    box-sizing: border-box;
}
.display__item__chat__footer form > label > textarea::-webkit-scrollbar {
    width: 4px;
}
.display__item__chat__footer form > label > textarea::-webkit-scrollbar-track {
    border-radius: 2px;
    background-color: #353e4a;
}
.display__item__chat__footer form > label > textarea::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background-color: #616972;
}
.display__item__chat__footer form > label > textarea::placeholder{
    color: #8e99a5;
}
.display__item__chat__footer form > button{
    width: fit-content;
    height: auto;
    padding: 11px 20px 11px;
    border-radius: 12px;
    background-color: #4e9eff;
    border: unset;
    cursor: pointer;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    box-sizing: border-box;
    align-content: center;
    align-items: center;
}
.display__item__chat__footer form > button > span{
    width: fit-content;
    height: auto;
    font-size: 15px;
    font-family: 'Avenir Next Cyr Medium';
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #FFFFFF;
    position: relative;
    padding: 0 0 0 26px;
}
.display__item__chat__footer form > button > span::before {
    content: "";
    position: absolute;
    width: 18px;
    height: 18px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    left: 0%;
    top: 50%;
    -webkit-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
    background-image: url("../images/icon/send.svg");
}

/* DISPLAY MODAL */
.display_alert{
    width: fit-content;
    max-width: 300px;
    height: auto;
    position: fixed;
    right: 25px;
    bottom: 25px;
    z-index: 10005;
    border: 0.5px solid #147295;
    background-color: #147295;
    border-radius: 10px;
    font-size: 14px;
    color: #d7d7d7;
    padding: 15px 25px 15px 50px;
    background-position: 18px center;
    background-repeat: no-repeat;
    background-size: 19px;
    display: none;
}
.display_alert[data-type='error']{
    background-image: url("../images/icon/error.svg");
}
.display_alert[data-type='info']{
    border-color: #4e9eff;
    background-color: #1a3a5c;
    background-image: url("../images/icon/error.svg");
}
/* DISPLAY MODAL */

/* BLOCKED */
.page-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0);
    display: none;
    cursor: not-allowed;
    z-index: 100005;
}
/* BLOCKED */

/* SR-ONLY (accessibility helper) */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
/* SR-ONLY */