/*
 * Стили формы регистрации — код с fintablo.ru без изменений.
 * Правила .t868 относились к попапу Tilda; их аналог для нашего попапа — в main.css (.ft-popup__window--regform).
 */
    .t868 .t-popup.t-popup_show {
        z-index: 9999999999;
    }
    .t868 .t-popup__block-close-button{
        display:none;
    }
    .t868__code-wrap{
        height: 100%;
    }
    .t868 .t-popup__container{
        width: 475px;
        max-width: 98%;
        background: #FEFEFE;
        border-radius: 15px;
        left:2px;
        right:2px;
    }
    .regform {
        --bg: #F4F7FF;
        --surface: #FFFFFF;
        --dark: #091A4E;
        --primary: #2951CA;
        --primary-hover: #1C3C9B;
        --fg: #404C72;
        --fg-muted: #818696;
        --fg-secondary: #5A76C9;
        --light-blue: #DDE6FF;
        --border: #DDE6FF;
        --accent-yellow: #FFFDB5;
        --green: #01B554;
        --red: #FF3A1D;
        --radius: 8px;
        --radius-sm: 6px;
        --font: 'Lab Grotesque', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
    }
    .regform .close-modal{
        color: #999;
        cursor: pointer;
        font-size: 31px;
        line-height: 20px;
        -webkit-transition: all ease 0.25s;
        transition: all ease 0.25s;
    }
    .regform .close-modal:hover{
        color: #000000;
    }
    .regform *{
        box-sizing: border-box;
    }
    .regform .iti{
        display: block;
        margin-bottom: 10px;
    }
    .regform{
        font-family: var(--font);
        padding: 40px 50px;
        display: flex;
        flex-direction: column;
        height:100%;
    }
    .regform .input-field {
        margin-bottom: 14px;
    }
    .regform .form-fields label {
        display: block;
        font-size: 13px;
        font-weight: 600;
        color: #404C72;
        margin-bottom: 6px;
    }
    .regform .checks {
        margin: 16px 0 18px;
        display: flex;
        flex-direction: column;
        gap: 12px;
    }
    .regform .check {
        display: flex;
        gap: 10px;
        align-items: center;
        cursor: pointer;
        min-height: 24px;
    }
    .regform .check .txt {
        font-size: 12.5px;
        color: var(--fg-muted);
        line-height: 1.4;
    }
    .regform .check .box.req {
        border-color: var(--primary);
    }
    .regform .check .txt a {
        color: var(--primary);
        text-decoration: underline;
    }
    .regform .check input {
        display:none;
    }
    .regform .check .box {
        flex-shrink: 0;
        width: 22px;
        height: 22px;
        border: 1px solid #B6BECF;
        border-radius: 5px;
        background: #fff;
        position: relative;
        margin-top: 1px;
    }
    .regform .check input:checked + .box {
        background: var(--primary);
    }
    .regform .check input:checked + .box::after {
        content: "";
        position: absolute;
        width: 20px;
        height: 20px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='20' viewBox='0 -960 960 960' width='20' stroke='%23FFFFFF' stroke-width='20' fill='%23FFFFFF'%3E%3Cpath d='M382-240 154-468l57-57 171 171 367-367 57 57-424 424Z'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
    }
    .regform .req-star {
        color: var(--red);
        font-weight: 700;
    }
    .regform .opt {
        color: var(--fg-muted);
        font-weight: 400;
    }
    .regform .hint {
        font-size: 12px;
        color: var(--fg-secondary);
        margin-top: 6px;
        display: flex;
        gap: 5px;
        align-items: flex-start;
    }
    .regform .form-top{
        font-size: 14px;
        color: var(--fg-muted);
        margin-top: 8px;
        margin-bottom: 20px;
    }
    .regform .form-h {
        font-size: 25px;
        font-weight: 700;
        color: var(--dark);
        letter-spacing: -0.01em;
        line-height: 1.2;
    }
    .regform .form-fields input:not([type="checkbox"]):focus {
        outline: none;
        border-color: var(--primary);
    }
    .regform .form-fields input:not([type="checkbox"]) {
        width: 100%;
        height: 52px;
        border: 1.5px solid var(--border);
        border-radius: var(--radius);
        padding: 0 14px;
        font-family: var(--font);
        font-size: 16px;
        color: var(--fg);
        background: #fff;
        transition: border-color .15s;
    }
    .regform .btn{
        width: 100%;
        height: 56px;
        background: var(--primary);
        color: #fff;
        border: none;
        border-radius: var(--radius);
        font-family: var(--font);
        font-size: 17px;
        font-weight: 600;
        cursor: pointer;
        transition: background .15s;
        margin-top: 4px;
        -webkit-transition: all ease 0.25s;
        transition: all ease 0.25s;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .regform .check .txt a {
        color: var(--primary);
        text-decoration: underline;
    }
    .regform .btn:hover{
        background: var(--primary-hover);
    }
    .regform .btn.loading-state:hover{
        background: #2951CA;
    }
    .regform .error-massage{
        font-family: LabGrotesque,Arial,sans-serif;
        font-style: normal;
        font-weight: normal;
        font-size: 14px;
        line-height: 17px;
        color: #797979;
        width: 290px;
        max-width: 100%;
        text-align:left;
    }
    .regform .phone-error-message {
        color: #ee2c2c;
        font-size: 14px;
    }
    .regform .form-fields input:not([type="checkbox"]).has-error{
        background: #FAF0FF;
    }
    .regform .privacy-note {
        font-size: 11px;
        color: var(--fg-muted);
        margin-top: 12px;
        text-align: center;
        line-height: 1.4;
    }
    .regform .yandex-oauth-btn{
        display: flex;
        gap:15px;
        border: 1px solid #DADDE7;
        background: #EAEEFF;
        padding: 7px 15px;
        width: 100%;
        border-radius: 5px;
        justify-content: center;
        align-items: center;
        -webkit-transition: all ease 0.5s;
        transition: all ease 0.5s;
        cursor: pointer;
        margin-bottom: 10px;
    }
    .regform .yandex-oauth-btn:hover{
        border-color: #5A76C9;
        background: #D4DFFF;
    }

    .regform .register-type-select {
        border-radius: 10px;
        background: rgba(241, 242, 247, 0.80);
        padding: 4px 0 5px;
        position: relative;
        margin-bottom:24px;
    }
    .regform .register-type-select .items {
        display: flex;
        z-index: 2;
        position: relative;
    }
    .regform .register-type-select .handle {
        position: absolute;
        top:4px;
        left:4px;
        border-radius: 8px;
        background: #FFF;
        box-shadow: 0 2px 7.2px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
        width: 50%;
        height: calc(100% - 8px);
        z-index: 1;
    }
    .regform .register-type-select .items > span {
        flex-basis: 50%;
        padding: 7px;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #787C80;
        gap:10px;
        cursor: pointer;
    }
    .regform .register-type-select .items > span.active{
        color: #333333;
    }

    .regform .yandex-oauth-info {
        border-radius: 10px;
        background: rgba(241, 242, 247, 0.80);
        padding: 8px;
        text-align: center;
        margin-bottom:24px;
    }
    .regform .block-h{
        font-size: 20px;
        font-weight: 700;
        color: var(--dark);
        margin-bottom: 8px;
    }
    .regform .block-hint{
        text-align: center;
        font-size: 14px;
        color: var(--fg-muted);
        margin-top: 8px;
        margin-bottom: 20px;
    }
    .regform .message{
        text-align: center;
        font-size: 14px;
        margin-top: 8px;
        margin-bottom: 20px;
    }

    .regform .ty-icon {
        width: 64px;
        height: 64px;
        border-radius: 50%;
        background: var(--green);
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 18px;
    }

    .regform .err-icon {
        width: 64px;
        height: 64px;
        border-radius: 50%;
        background: var(--red);
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 18px;
    }
    .regform .state-block {
        text-align: center;
        height: 100%;
        align-items: center;
        justify-content: center;
        display: flex;
        flex-direction: column;
    }
    .regform .state-block .button {
        height: 46px;
        background: var(--primary);
        color: #fff;
        border: none;
        border-radius: var(--radius);
        font-family: var(--font);
        font-size: 15px;
        font-weight: 400;
        cursor: pointer;
        transition: background .15s;
        margin-top: 4px;
        -webkit-transition: all ease 0.25s;
        transition: all ease 0.25s;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #fff !important;
        width: auto;
        padding: 10px 40px;
    }
    .regform .state-block .button:hover{
        background: var(--primary-hover);
    }

    #form243154173 .js-successbox{
        display:none!important;
    }
    #form262266642 .js-successbox{
        display:none!important;
    }
    .loading-state{
        position: relative;
    }
    .loading-state, .loading-state *{
        color: transparent !important;
    }
    .loading-indicator{
        content: "";
        display: block;
        position: absolute;
        top:50%;
        left:50%;
        width: 34px;
        height: 40px;
        margin-top: -20px;
        margin-left: -17px;
    }
    .loading-indicator div {
        display: inline-block;
        position: absolute;
        left: 0px;
        width: 10px;
        background: #455BED7D;
        animation: lds-facebook 1.2s cubic-bezier(0, 0.5, 0.5, 1) infinite;
        z-index:3;
    }
    .regform .loading-indicator div {
        background: #FFFFFF;
    }
    .regform .loading-indicator.primary div {
        background: var(--primary);
    }
    .loading-indicator div:nth-child(1) {
        left: 0px;
        animation-delay: -0.24s;
    }
    .loading-indicator div:nth-child(2) {
        left: 12px;
        animation-delay: -0.12s;
    }
    .loading-indicator div:nth-child(3) {
        left: 24px;
        animation-delay: 0;
    }
    @keyframes lds-facebook {
        0% {
            top: 0px;
            height: 40px;
        }
        50%, 100% {
            top: 12px;
            height: 16px;
        }
    }
    @media all and (min-width:451px) {
        .regform .mobile-only {
            display:none;
        }
    }
    @media all and (max-width:450px) {
        .regform { padding: 20px; }
        .t868 .t-popup__container {
            width: 100%;
            max-width: 100%;
            left: 0;
            height: 100%;
            border-radius: 0;
        }
        .regform .form-h {
            font-size: 21px;
            margin-top: 25px;
        }
        .regform .desktop-only {
            display:none;
        }
        .regform .t-popup__close {
            top: 15px;
        }
    }
