@font-face {
    font-family: "Euclid Circular A";
    src: url("/wp-content/plugins/website-chat-button-kommo-integration/main/plugin_page/fonts/Euclid-Circular-A-Light.ttf");
    font-weight: 300;
}
@font-face {
    font-family: "Euclid Circular A";
    src: url("/wp-content/plugins/website-chat-button-kommo-integration/main/plugin_page/fonts/Euclid-Circular-A-Regular.ttf");
    font-weight: 400;
}
@font-face {
    font-family: "Euclid Circular A";
    src: url("/wp-content/plugins/website-chat-button-kommo-integration/main/plugin_page/fonts/Euclid-Circular-A-Medium.ttf");
    font-weight: 500;
}
@font-face {
    font-family: "Euclid Circular A";
    src: url("/wp-content/plugins/website-chat-button-kommo-integration/main/plugin_page/fonts/Euclid-Circular-A-SemiBold.ttf");
    font-weight: 600;
}
@font-face {
    font-family: "Euclid Circular A";
    src: url("/wp-content/plugins/website-chat-button-kommo-integration/main/plugin_page/fonts/Euclid-Circular-A-Bold.ttf");
    font-weight: 700;
}
.preloader-redirect {
    display: none;
}
.preloader-redirect.active {
    display: block;
}
body{
    top: 0;
    margin: 0;
}
.trial-frame *{
    margin: 0;
    padding: 0;
    font-family:'Euclid Circular A';
}
.overlay-block *{
    margin: 0;
    padding: 0;
    font-family:'Euclid Circular A';
}
.content-home-page *{
    margin: 0;
    padding: 0;
    font-family:'Euclid Circular A';
}
#wpwrap {
    background: #F3EFFF;
    padding-bottom: unset;
}
#wpcontent {
    padding-left: unset;
}
#wpbody-content{
    padding-bottom: unset;
}
#wpfooter{
    display: none;
}
.notice.update-nag{
    display: none;
}
#hover-element-click, #close-button{
    cursor: pointer;
}
.element-cursor-pointer:hover{
    cursor: pointer;
}
/*-----------*/
.error-window{
    text-align: center;
}
.error-window .img{
    margin: 92px 0 0 0;
}
.error-window h1{
    color: #0E0142;
    margin: 40px 0 0 0;
    font-size: 56px;
    font-style: normal;
    font-weight: 700;
    line-height: 110%;
}
.error-window h3{
    color: #0E0142;
    margin: 8px 0 0 0;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
}
.error-window button{
    border: none;
    margin: 40px 0 0 0;
    height: 50px;
    padding: 18px 40px;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    border-radius: 100px;
    background: #0E0142;
    color: #FFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 90%;
}
/* ---------- */
.trial-frame{
    display: none;
}
.trial-frame.active{
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.trial-frame.active h3{
    margin: 0;
    color: #FFFFFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
}
.trial-frame.active span{
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 27px;
    height: 27px;
    border-radius: 5px;
    background: #FFF;
    margin-right: 8px;
    font-size: 15px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}
.trial-frame.active a{
    color: #FFFFFF;
}
/*-----------*/
.content-home-page{
    width: -webkit-fill-available;
    background: #ffffff;
    padding: 0 0 69px;
    min-height: calc(100vh - 32px - 69px);
}

.overlay-block h5,
.overlay-block h3,
.overlay-block h1,
.overlay-block p,
.overlay-block button,
.overlay-block a,
.overlay-block span,
.content-home-page h5,
.content-home-page h3,
.content-home-page h1,
.content-home-page p,
.content-home-page button,
.content-home-page a,
.content-home-page span{
    color: #0E0142;
}
.content-home-page a:focus,
.trial-frame a:focus,
.overlay-block a:focus{
    color: unset;
    box-shadow: unset;
    outline: unset;
}
button a{
    display: flex;
    align-items: center;
    text-decoration: none;
}
.content-home-page a:hover{
    color: #0E0142;
}
hr{
    border-top: 1px solid #E7E6EC;
    border-bottom: 1px solid #E7E6EC;
}
.display-padding{
    padding: 0 calc(50% - 504px);
}
.element-to-line{
    display: flex;
}
/* -------- */
.head-block{
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 24px;
    padding-top: 21px;
}
.logo-mobile{
    display: none;
}
.head-block .client-id h5{
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
    margin: 0;
}
/* -------- */
.item-block-1{
    display: flex;
    padding: 28px 56px;
    height: calc(320px - (28px*2));
    background: #F3EFFF;
    border-radius: 20px;
    margin: 24px 0 22px;
}
.item-block-1 .text-block{
    width: 50%;
    margin-right: 11px;
}
.item-block-1 .img-block{
    width: 50%;
    margin-left: 11px;
}
.item-block-1 .img-block img{
    width: 437px;
}
.item-block-1 .text-block h3{
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
    margin: 0;
}
.item-block-1 .text-block .counter-block-1{
    position: absolute;
    top: -1px;
    left: 25px;
    border-radius: 100px;
    display: none;
    background: #D63638;
    padding: 1px;
    color: #FFFFFF;
    width: 15px;
    height: 15px;
    font-size: 10px;
    align-items: center;
    justify-content: center;
}
.item-block-1 .text-block p{
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
    margin: 16px 0 24px;
    width: 381px;
}
.item-block-1 .text-block .element-to-line{
    margin-bottom: 16px;
    position: relative;
    align-items: center;
}
.item-block-1 .text-block .element-to-line svg{
    width: 42px;
}
.item-block-1 .text-block .element-to-line p{
    padding-left: 6px;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 21px;
    margin: 0;
}
.item-block-1 .text-block .element-to-line h5{
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
}
.item-block-1 .text-block .element-to-line h5 div{
    font-weight: 500;
}
.item-block-1 .text-block .element-to-line p a{
    color: #5F44D1;
}
.item-block-1 .text-block .go-to-inbox-href{
    display: contents;
    width: 192px;
}
.item-block-1 .text-block .go-to-inbox{
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 90%;
    cursor: pointer;
    display: flex;
    height: 50px;
    padding: 18px 40px;
    justify-content: center;
    align-items: center;
    border-radius: 100px;
    background: #0E0142;
    color: #fff;
    border: none;
}
/* -------- */
.item-block-2-3-element{
    position: relative;
    background: #F3EFFF;
    border-radius: 20px;
    padding: 28px 56px 56px 56px;
    height: calc(624px - 28px - 56px);
}
.item-block-2-3-element img{
    width: 100%;
    max-width: 381px;
    height: 264px;
}
.item-block-2-3-element h3{
    height: 108px;
    margin: 32px 0 16px;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    width: 372px;
}
.item-block-2-3-element p{
    margin: 0 0 55px;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
}
.item-block-2-3-element button{
    position: absolute;
    bottom: 56px;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
    background: none;
}
.item-block-2{
    margin-right: 11px;
}
.item-block-3{
    margin-left: 11px;
}
/* -------- */
.navigate-block{
    display: flex;
    justify-content: space-between;
    margin: 22px 0 21px;
}
.navigate-block .info-block .element-to-line{
    align-items: center;
    padding: 5.75px 0;
}
.navigate-block .info-block span{
    display: block;
    margin-left: 8px;
    margin-right: 22px;
}
.navigate-block .info-block a{
    text-decoration: none;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}
.navigate-block .social-block .social-url{
    justify-content: end;
    margin-bottom: 15px;
}
.navigate-block .info-block svg{
    width: 20px;
    height: 20px;
}
.navigate-block .social-block .app-url{
    justify-content: end;
}
.navigate-block .social-block .app-url svg{
    margin-left: 8px;
    width: 126px;
    height: 38px;
}
.navigate-block .social-block .social-url svg{
    width: 20px;
    height: 20px;
    margin-left: 22px;
}
/* -------- */
.footer-block{
    display: flex;
    justify-content: space-between;
    margin-top: 21px;
}
.footer-block a{
    text-decoration: none;
}
.footer-block .log-out{
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-left: 10px;
}
.footer-block .checkbox-text{
    display: none;
    color: #8680A0;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}
.footer-block .element-to-line{
    align-items: center;
}
.checkbox-slider {
    display: flex;
    align-items: center;
    height: 28px;
    line-height: 28px;
    margin-right: 10px;
    position: relative;
    vertical-align: middle;
    font-size: 14px;
    -webkit-user-select: none;
    user-select: none;
}
.checkbox-slider .checkbox-slider-switch {
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    width: 27px;
    height: 13.5px;/*-----*/
    border-radius: 25%/50%;
    background: #E7E6EC;
    transition: .2s;
}
.checkbox-slider .checkbox-slider-switch:before {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    display: inline-block;
    width: 10px;
    height: 10px;/*-----*/
    border-radius: 50%;
    background: rgba(14, 1, 66, 0.3);
    transition: .15s;
}
.checkbox-slider input[type=checkbox] {
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    z-index: -1;
    opacity: 0;
}
.checkbox-slider input[type=checkbox]:checked + .checkbox-slider-switch {
    background: #5F44D1;
}
.checkbox-slider input[type=checkbox]:checked + .checkbox-slider-switch:before {
    transform:translateX(13px);
    background: #ffffff;
}

/* Hover */
.checkbox-slider input[type="checkbox"]:not(:disabled) + .checkbox-slider-switch {
    cursor: pointer;
}

/* Disabled */
.checkbox-slider input[type=checkbox]:disabled + .checkbox-slider-switch {
    filter: grayscale(70%);
}
.checkbox-slider input[type=checkbox]:disabled + .checkbox-slider-switch:before {
    background: #eee;
}

/* owerlay */

.overlay-block{
    display: none;
}
.overlay-block.active{
    display: block;
    width: 100%;
    position: absolute;
    height: calc(100vh - 32px);
    z-index: 50;
    background: rgba(14, 1, 66, 0.60);
}
.overlay-block .display-padding{
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* overlay */
.welcome-frame{
    display:none;
}
.welcome-frame.active{
    display: flex;
    z-index: 55;
    width: 100%;
    max-width: 800px;
    background: #F3EFFF;
    border-radius: 20px;
    margin: 0 120px;
}
.welcome-frame .img-frame{
    width: 40%;
    padding: 16px;

}
.welcome-frame .img-frame img{
    width: 320px;
    height: 347px;
    border-radius: 40px;
}
.welcome-frame .text-frame{
    width: 60%;
}
.welcome-frame .text-frame .close-button svg{
    position: absolute;
    right: 0;
    margin: 20px;
}
.welcome-frame .text-frame .close-button{
    position: relative;
}
.welcome-frame .text-frame .all-text{
    margin: 32px 16px;
    width: 85%;
}
.welcome-frame .text-frame .all-text h3{
    margin: 0 0 16px;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
}
.welcome-frame .text-frame .all-text h5{
    margin: 0 0 8px;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 160%;
}
.welcome-frame .text-frame .all-text p{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin: 0 0 15px;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
}
.welcome-frame .text-frame .all-text p span{
    margin-right: 8px;
}
.welcome-frame .text-frame .all-text .welcome-frame-got-it{
    display: inline-flex;
    margin: 25px 0 0;
    height: 50px;
    padding: 18px 40px;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    border-radius: 100px;
    border: 2px solid var(--tolopea-0-e-0142, #0E0142);
    background: none;
    color: #0E0142;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 90%;
}
.welcome-frame .img-frame{
    display: flex;
    justify-content: center;
    align-items: center;
}
.welcome-frame .img-frame .default{
    display: block;
}
.welcome-frame .img-frame .mobile{
    display: none;
}
/*------------*/
.exit-frame{
    display: none;
}

.exit-frame.active .buttons {
    display: flex;
    align-items: center;
}

.exit-frame.active{
    width: 320px;
    position: relative;
    border-radius: 20px;
    background: #F3EFFF;
    display: flex;
    padding: 60px 40px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;

}
.exit-frame.active .close-button{
    position: absolute;
    top: 0;
    right: 0;
    margin: 24px;
}
.exit-frame.active h3{
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
    margin: 0 0 21px;
}
.exit-frame.active h5{
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
    margin: 0 0 41px;
}
.exit-frame.active button{
    width: 138px;
    height: 50px;
    padding: 18px 40px;
    justify-content: center;
    align-items: center;
    border-radius: 100px;
    border: none;
}
.exit-frame.active .exit-frame-log-out,
.exit-frame.active .exit-frame-cancel{
    display: inline-flex;
}
.exit-frame.active .exit-frame-log-out{
    background: #0E0142;
    color: #FFFFFF;
    margin-right: 12px;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 90%;
}
.exit-frame.active .exit-frame-cancel{
    border: 2px solid #0E0142;
    color: #0E0142;
    background: #F3EFFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 90%;
}
/*---------*/
.select-plan-frame{
    display: none;
}
.select-plan-frame.active{
    position: relative;
    display: flex;
    width: 800px;
    height: 315px;
    flex-shrink: 0;
    border-radius: 20px;
    background: var(--gainsborough-f-3-efff, #F3EFFF);
}
.select-plan-frame.active .img-frame{
    width: 45%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.select-plan-frame.active .img-frame img{
    width: 176px;
    height: 223px;
}
.select-plan-frame.active .text-frame{
    width: 55%;
    margin: 32px;
}
.select-plan-frame.active .text-frame .close-button{
    position: absolute;
    top: 0;
    right: 0;
    margin: 24px;
}
.select-plan-frame.active .text-frame h3{
    margin: 0 0 22px;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
}
.select-plan-frame.active .text-frame h5{
    padding-bottom: 72px;
    margin: 0 0;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
    /* width: 351px; */
}
.select-plan-frame.active .text-frame button{
    display: inline-flex;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 90%;
    position: absolute;
    bottom: 0;
    margin-bottom: 32px;
    height: 50px;
    padding: 18px 40px;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    border-radius: 100px;
    background: #0E0142;
    border: none;
    color: #FFFFFF;
}
/*------------*/
.off-button-frame{
    display: none;
}
.exit-frame{
    display: none;
}
.off-button-frame.active{
    width: 320px;
    position: relative;
    border-radius: 20px;
    background: #F3EFFF;
    display: flex;
    padding: 60px 40px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;

}
.off-button-frame.active .close-button{
    position: absolute;
    top: 0;
    right: 0;
    margin: 24px;
}
.off-button-frame.active h3{
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
    margin: 0 0 8px;
}
.off-button-frame.active h5{
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
    margin: 0 0 26px;
}
.off-button-frame.active button{
    display: inline-flex;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 90%;
    width: 142px;
    height: 50px;
    padding: 18px 40px;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    border-radius: 100px;
    border: none;
}
.off-button-frame.active .off-button-frame-turn-off{
    background: #0E0142;
    color: #FFFFFF;
    margin-right: 12px;
}
.off-button-frame.active .off-button-frame-cancel{
    border: 2px solid #0E0142;
    color: #0E0142;
    background: #F3EFFF;
}
/*-----------*/
.error-delete-button-user{
    display: none;
}
.error-delete-button-user.active{
    width: 320px;
    position: relative;
    border-radius: 20px;
    background: #F3EFFF;
    display: flex;
    padding: 60px 40px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;

}
.error-delete-button-user.active .close-button{
    position: absolute;
    top: 0;
    right: 0;
    margin: 24px;
}
.error-delete-button-user.active h3{
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
    margin: 0 0 8px;
}
.error-delete-button-user.active h5{
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
    margin: 0 0 26px;
}
.error-delete-button-user.active button{
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 90%;
    width: 138px;
    height: 50px;
    padding: 18px 40px;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    border-radius: 100px;
    border: none;
}
.error-delete-button-user.active .error-delete-button-user-log-out{
    background: #0E0142;
    color: #FFFFFF;
}
/*-----------*/
.error-delete-frame{
    display: none;
}
.error-delete-frame.active{
    width: 320px;
    position: relative;
    border-radius: 20px;
    background: #F3EFFF;
    display: flex;
    padding: 60px 40px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;

}
.error-delete-frame.active .close-button{
    position: absolute;
    top: 0;
    right: 0;
    margin: 24px;
}
.error-delete-frame.active h3{
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
    margin: 0 0 8px;
}
.error-delete-frame.active h5{
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
    margin: 0 0 26px;
}
.error-delete-frame.active button{
    width: 138px;
    height: 50px;
    padding: 18px 40px;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    border-radius: 100px;
    border: none;
}
.error-delete-frame.active .error-delete-frame-log-out{
    background: #0E0142;
    color: #FFFFFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 90%;
}
/*-----------*/
.error-log-frame{
    display: none;
}
.error-log-frame.active{
    z-index: 99;
    margin: 0 10%;
    width: 80%;
    position: absolute;
    border-radius: 20px;
    background: #F3EFFF;
    display: flex;
    padding: 100px 40px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;

}
.error-log-frame.active .close-button{
    position: absolute;
    top: 0;
    right: 0;
    margin: 24px;
}
.error-log-frame.active h3{
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
    margin: 0 0 8px;
}
.error-log-frame.active h5{
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
    margin: 0 0 26px;
}
/*---------*/
.error-ajax-frame{
    display: none;
}
/*---------*/
.add-button-frame{
    display: none;
}
.add-button-frame.active{
    position: relative;
    top: -50px;
    display: flex;
    width: 800px;
    height: 379px;
    border-radius: 20px;
    background: var(--gainsborough-f-3-efff, #F3EFFF);
}
.add-button-frame.active .img-frame{
    width: 45%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.add-button-frame.active .img-frame img{
    width: 324px;
    height: 347px;
}
.add-button-frame.active .text-frame{
    width: 55%;
    margin: 32px;
}
.add-button-frame.active .text-frame h3{
    margin: 0 0 22px;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
    width: 315px;
}
.add-button-frame.active .text-frame h5{
    margin: 0 0 8px;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
    width: 375px;
}
.add-button-frame.active .text-frame .dropdown-select{
    width: 308px;
}
.add-button-frame.active .text-frame .buttons-frame-dropdown-select svg{
    rotate: 180deg;
    transition: 0.5s;
}
.add-button-frame.active .text-frame .buttons-frame-dropdown-select{
    cursor: pointer;
    display: flex;
    width: calc(100% - 26px);
    padding: 15px 10px 15px 16px;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    border-radius: 10px;
    border: 2px solid #0E0142;
    background: #FFF;
    color: #0E0142;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}
.add-button-frame.active .text-frame .button-frame-dropdown-item{
    display: none;
}
.add-button-frame.active .text-frame .button-frame-dropdown-item.active{
    display: block;
    overflow: auto;
    position: relative;
    top: 16px;
    z-index: 100;
    padding: 15px 10px 15px 16px;
    width: calc(100% - 26px);
    border-radius: 10px;
    border: 2px solid #0E0142;
    background: #FFF;
}
.button-frame-dropdown-item.active::-webkit-scrollbar {
    width: 12px;
}

.button-frame-dropdown-item.active::-webkit-scrollbar-track {
    background: none;        /* цвет зоны отслеживания */
}

.button-frame-dropdown-item.active::-webkit-scrollbar-thumb {
    background-color: rgba(95, 67, 208, 0.15);    /* цвет бегунка */
    border-radius: 20px;       /* округлось бегунка */
    border: 3px solid #FFF;

}
.add-button-frame.active .text-frame .button-frame-dropdown-item.active .item-dropdown{
    cursor: pointer;
    margin: 4px 0;
    border-radius: 4px;
    display: flex;
    padding: 12px 14px;
    align-items: center;
    align-self: stretch;
    color: #0E0142;
    transition: 0.5s;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 120%;
}
.add-button-frame.active .text-frame .button-frame-dropdown-item.active .item-dropdown:hover{
    background: #0E0142;
    color: #FFFFFF;
    transition: 0.5s;
}
.add-button-frame.active .text-frame .add-button-frame-dropdown{
    display: flex;
    width: 312px;
    padding: 15px 10px 15px 16px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    border-radius: 10px;
    border: 2px solid #0E0142;
    background: #FFF;
    color: #0E0142;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}
.add-button-frame.active .text-frame .buttons button{
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 90%;
}
.add-button-frame.active .text-frame .buttons{
    position: absolute;
    bottom: 0;
    margin-bottom: 32px;
    display: flex;
    width: 55%;
}

.add-button-frame.active .text-frame .buttons .add-button-frame-next{
    display: none;
    justify-content: center;
    align-items: center;
    width: 120px;
    height: 50px;
    padding: 18px 40px;
    border-radius: 100px;
    background: #0E0142;
    border: none;
    color: #FFFFFF;
}
.add-button-frame.active .text-frame .buttons .add-button-frame-next-disable{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 120px;
    height: 50px;
    padding: 18px 40px;
    border-radius: 100px;
    background: #dedde2;
    border: none;
    color: #F3EFFF;
}
.add-button-frame.active .text-frame .buttons .add-button-frame-next-load{
    display: none;
    justify-content: center;
    align-items: center;
    width: 120px;
    height: 50px;
    padding: 18px 40px;
    border-radius: 100px;
    background: #e9e6f3;
    /* background: #eae9ee; */
    border: none;
}
.add-button-frame.active .text-frame .buttons .add-button-frame-create-new{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;
    padding: 18px 24px;
    border-radius: 100px;
    background: none;
    border: none;
    color: #0E0142;
}
.add-button-frame.active .text-frame .buttons .add-button-frame-create-new-load{
    display: none;
    justify-content: center;
    align-items: center;
    height: 50px;
    padding: 18px 40px;
    border-radius: 100px;
    background: none;
    border: none;
    color: #cac4dc;
    /* color: #ccc; */
}
.add-button-frame.active .text-frame .buttons .add-button-frame-create-new svg,
.add-button-frame.active .text-frame .buttons .add-button-frame-create-new-load svg{
    margin-left: 8px;
}
button.error-delete-button-user-log-out-load{
    background: #e9e6f3;
    color: #f6f6f7;
}
.error-delete-button-user-log-out-load{
    display: none;
}
button.error-delete-frame-log-out-load{
    background: #e9e6f3;
    color: #f6f6f7;
}
.error-delete-frame-log-out-load{
    display: none;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 90%;
}
button.exit-frame-log-out-load{
    background: #e9e6f3;
    color: #f6f6f7;
}
.exit-frame-log-out-load{
    display: none;
    margin-right: 12px;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 90%;
}