/*
Первая форма
Простая разбитая на два блока
*/
.form-two-block {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gap-rahmat-medium);
    padding: 2rem;
    border-radius: 35px;
    background-color: var(--color-primary-accent);
}
.form-two-block .form-box {
    height: 100%;
    padding-top: 30px;
    padding-left: 20px;
    padding-right: 20px;
}
.form-two-block .form-white-block {
    padding: 2rem;
    border-radius: 35px;
    background-color: var(--color-primary-accent);
}
.form-two-block .form-block__left img {
    width: 100%;
    border-radius: 30px;
}
.form-two-block .form-steps__right {
    border-radius: 30px;
    background: #ffffff;
}
.form-two-block .form-box .b24-form-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
@media (max-width: 960px) {
    .form-two-block {
        padding: 1.5rem;
        grid-template-columns: repeat(1, 1fr);
    }
}
/*Конец первой формы*/


/*
Вторая форма
На белом фоне
*/
.form-white-block {
    padding: 2rem;
    border-radius: 35px;
    background-color: var(--color-primary-accent);
}
.form-white-block .form-box {
    height: 100%;
    padding-top: 30px;
    padding-left: 20px;
    padding-right: 20px;
}
.form-white-block .form-white-block {
    padding: 2rem;
    border-radius: 35px;
    background-color: var(--color-primary-accent);
}
.form-white-block .bg-form {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gap-rahmat-medium);
    padding: 15px;
    border-radius: 35px;
    background: #fff;
}
.form-white-block .form-block__left img {
    width: 100%;
    border-radius: 30px;
}
.form-white-block .form-steps__right {
    border-radius: 30px;
    background: #ffffff;
}
.form-white-block .form-box .b24-form-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
@media (max-width: 960px) {
    .form-white-block {
        padding: 1rem;
    }
    .form-white-block .bg-form {
        padding: 1.5rem;
        grid-template-columns: repeat(1, 1fr);
    }
}
/*Конец второй формы*/

/*
Третья форма
Крассная форма
*/
.form-red {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gap-rahmat-medium);
    padding: 2rem;
    border-radius: var(--medium-border-radius);
    background: var(--color-primary);
}
.form-red .h2 {
    color: #fff;
    line-height: 20px;
    font-weight: 500 !important;
}
.form-red p {
    color: #fff;
}
.form-red .form-box {
    height: 100%;
    padding: 19px 20px 19px;
    border-radius: var(--medium-border-radius);
    background: #fff;
}
.form-red .form-steps__left img {
    width: 100%;
    border-radius: var(--medium-border-radius);
}

@media (max-width: 960px) {
    .form-red {
        padding: 1.5rem;
        grid-template-columns: repeat(1, 1fr);
    }
    .form-red .form-box {
        padding-left: 10px;
        padding-right: 10px;
    }
}
/*Конец третей формы*/


/*
Четвертая форма
Серая форма
*/
.form-grey {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gap-rahmat-medium);
    padding: 2rem;
    border-radius: var(--medium-border-radius);
    background-color: var(--color-primary-accent);
}
.form-grey .h2 {
    font-size: var(--font-h1-size);
    color: var(--text-primary-color);
    line-height: var(--h2-line-height);
}
.form-grey p {
    color: var(--font-body-l-color);
    line-height: 20px;
    font-weight: 500 !important;
}
.form-grey .form-box {
    height: 100%;
    padding: 19px 20px 19px;
    border-radius: var(--medium-border-radius);
    background: #fff;
}
.form-grey .form-steps__left img {
    width: 100%;
    border-radius: var(--medium-border-radius);
}
@media (max-width: 960px) {
    .form-grey {
        padding: 1.5rem;
        grid-template-columns: repeat(1, 1fr);
    }
}
/*Конец четвертой формы*/

/*
Пятая форма дефолтная
Простая разбитая на два блока
*/
.form-default {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--gap-rahmat-medium);
    padding: 2rem;
    border-radius: 35px;
    background-color: var(--color-primary-accent);
}
.form-default .form-box {
    height: 100%;
    padding-top: 30px;
    padding-left: 20px;
    padding-right: 20px;
}
.form-default .form-white-block {
    padding: 2rem;
    border-radius: 35px;
    background-color: var(--color-primary-accent);
}
.form-default .form-default__left img {
    width: 100%;
    border-radius: 30px;
}
.form-default .form-default__right {
    border-radius: 30px;
    background: #ffffff;
}
.form-default .form-box .b24-form-content {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
@media (max-width: 960px) {
    .form-default {
        padding: 1.5rem;
        grid-template-columns: repeat(1, 1fr);
    }
}
/*Конец пятой формы*/


/*
Для всех CRM форм
*/
/*.form_reg .form-box .b24-form,
.form_reg .form-box .b24-form-style-modern,
.form_reg .form-box .b24-form-wrapper,
.form_reg .form-box .b24-form-content,
.form_reg .form-box form
{
    height: 100%;
}*/
.form_reg .form-box input[name="name"]:focus-visible,
.form_reg .form-box input[type="string"]:focus-visible,
.form_reg .form-box input[name="phone"]:focus-visible,
.form_reg .form-box input[type="text"]:focus-visible,
.form_reg .form-box textarea.b24-form-control:focus-visible
{
    outline: 0 transparent !important;
}
.form_reg .form-box .b24-form-field-name input[name="name"].b24-form-control,
.form_reg .form-box .b24-form-field-company-name input[type="string"].b24-form-control,
.form_reg .form-box .b24-form-field-phone input[name="phone"].b24-form-control,
.form_reg .form-box .b24-form-field-text textarea.b24-form-control,
.form_reg .form-box .b24-form-field-list input[type="text"].b24-form-control
{
    height: 50px;
    border: solid 0 !important;
    padding: 15px !important;
    border-radius: 8px !important;
    background: rgb(0%, 0%, 0%, 04%) !important;
}
.form_reg .form-box .b24-form-field-text textarea.b24-form-control {
    height: 123px;
    resize: none !important;
}
.form_reg .form-box .b24-form-field,
.form_reg .form-box .b24-form-control-alert,
.form_reg .form-box .b24-form-field-phone .b24-form-control-container
{
    margin-bottom: 42px !important;
}
.form_reg .form-box .b24-form-control:focus + .b24-form-control-label
{
    transform: inherit !important;
}
.form_reg .form-box .b24-form-control-list .b24-form-control-label,
.form_reg .form-box .b24-form-control-string .b24-form-control-label,
.form_reg .form-box .b24-form-control-text .b24-form-control-label,
.form_reg .form-box .b24-form-field-list .b24-form-control-label
{
    -webkit-transform: inherit !important;
    -ms-transform: inherit !important;
    transform: inherit !important;
    top: -22px !important;
    left: -9px !important;
}
.form_reg .form-box .b24-form-field-agreement .b24-form-control-desc {
    opacity: 1;
}
.form_reg .form-box .b24-form-field-agreement-link {
    font-size: var(--font-body-l-size);
    font-weight: var(--font-body-l-weight);
    color: var(--font-body-l-color);
}
/*Скрываем стандартный чекбокс */
.form_reg .form-box label.b24-form-control-container input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}
.form_reg .form-box label.b24-form-control-container .b24-form-control-desc::before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 2px solid #ccc;
    border-radius: 4px;
    vertical-align: middle;
    margin-right: 10px;
}
.form_reg .form-box label.b24-form-control-container input:checked + .b24-form-control-desc::before {
    background-color: var(--color-additional-1);
    border-color: var(--color-additional-1);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='white' stroke-width='2'%3E%3Cpath d='M3 8l3 3 7-7'/%3E%3C/svg%3E");
}
/*
Конец
*/