/* Signup v2 — Figma 2122:9811 (выбор профиля), 2122:9685 (форма) */

/* —— Фон левой панели для signup —— */

.signup-v2-page .login-v2__brand-inner {
    position: relative;
    z-index: 1;
}

.signup-v2-page .login-v2__brand {
    background: url("../image/sign_up_bg.webp") no-repeat center center;
    background-size: cover;
}

@media (max-width: 1440px) {
    .signup-v2-page .login-v2__brand {
        background-image: url("../image/sign_up_bg_1440.webp");
    }
}

@media (max-width: 1280px) {
    .signup-v2-page .login-v2__brand {
        background-image: url("../image/sign_up_bg_1280.webp");
    }
}

/* —— Позиционирование контента (1920×1080) —— */

body.signup-v2-page {
    overflow: hidden;
}

body.signup-v2-page .f_container,
body.signup-v2-page .login-v2 {
    height: 100vh;
    min-height: 100vh;
    max-height: 100vh;
    overflow: hidden;
}

.signup-v2-page .login-v2__main {
    height: 100%;
    min-height: 0;
    max-height: 100%;
    overflow: hidden;
}

.signup-v2-page.login-v2-page .login-v2__content--signup {
    align-items: center;
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    padding-left: 32px;
    padding-right: 32px;
}

.signup-v2-page .login-v2__content--signup-picker {
    justify-content: center;
    padding-top: 0;
    padding-bottom: 0;
}

/* Форма по центру между «Сервисы» и футером, как в Figma */
.signup-v2-page .login-v2__content--signup-form {
    justify-content: center;
    padding-top: 92px;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}

.signup-v2-page .login-v2__footer {
    flex-shrink: 0;
    padding-top: 12px;
    padding-bottom: 24px;
}

.signup-v2__card {
    width: 100%;
    max-width: 606px;
    flex-shrink: 0;
}

.signup-v2-page .login-v2__header {
    margin-bottom: 32px;
}

.signup-v2-page .login-v2__title {
    font-family: Commissioner;
    font-weight: 700;
    font-style: Bold;
    font-size: 32px;
    leading-trim: NONE;
    line-height: 90%;
    letter-spacing: 0%;
    vertical-align: middle;
    margin-bottom: 12px;
}

.signup-v2-page .login-v2__subtitle {
    font-family: Commissioner;
    font-weight: 400;
    font-style: Regular;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 90%;
    letter-spacing: 0%;
}

/* —— Шаг 1: карточки профиля (88px, gap 8px) —— */

.signup-v2__profiles {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
    margin: 0;
}

.signup-v2__profile-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    width: 100%;
    height: 88px;
    min-height: 88px;
    border-radius: 16px;
    padding-top: 12px;
    padding-right: 16px;
    padding-bottom: 12px;
    padding-left: 24px;
    background: var(--neutral-white);
    color: var(--blue-plaza-active);
    text-decoration: none;
    transition: background 0.15s ease;
}

.signup-v2__profile-card:hover {
    border: 1px solid var(--primary-blue-50);
    color: var(--blue-plaza-active);
    text-decoration: none;
}

.signup-v2__profile-card-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    padding-right: 16px;
}

.signup-v2__profile-card-title {
    font-family: Commissioner;
    font-weight: 600;
    font-size: 16px;
    line-height: 90%;
    letter-spacing: 0%;    
    color: var(--blue-plaza-active);
}

.signup-v2__profile-card-hint {
    font-family: Commissioner;
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    color: var(--blue-plaza);
}

.signup-v2__profile-card-arrow {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    background: url("../image/arrow_right.svg") no-repeat center / contain;
    opacity: 0.4;
}

/* —— Табы (как login: 293 + 20 + 293) —— */

.signup-v2-page .login-v2__tabs--signup {
    width: 100%;
    margin-bottom: 24px;
    border-bottom: none;
}

/* —— Поля формы (48px, gap 16px) —— */

.signup-v2__form {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}

.signup-v2__form .mb-3,
.signup-v2__form .row {
    margin-bottom: 0 !important;
}

.signup-v2__field,
.signup-v2__form .field-signupform-email,
.signup-v2__form .field-signupform-contactname,
.signup-v2__form .field-signupform-phone,
.signup-v2__form .field-signupform-promo,
.signup-v2 .password-field-wrapper.signup-v2__field--password {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 48px auto;
    margin: 0;
}

/* Ошибка — вторая строка; иконки остаются в строке 48px с инпутом */
.signup-v2__field > .f_error,
.signup-v2__field > .invalid-feedback,
.signup-v2__form .field-signupform-email > .f_error,
.signup-v2__form .field-signupform-contactname > .f_error,
.signup-v2__form .field-signupform-phone > .f_error,
.signup-v2__form .field-signupform-promo > .f_error {
    grid-row: 2;
    grid-column: 1;
}

/* Поля с виджетами — обычный поток, не grid (grid не видит ошибки внутри Yii-обёрток через display:contents) */
.signup-v2__field--country,
.signup-v2__field--inn,
.signup-v2__field--organization {
    display: block !important;
    min-height: 48px;
}

.signup-v2__field--country .f_error,
.signup-v2__field--inn .f_error,
.signup-v2__field--organization .f_error {
    position: static;
    margin-top: 6px;
    padding-left: 16px;
    font-size: 12px;
}

.signup-v2__field > label,
.signup-v2__field > .signup-v2__field-icon,
.signup-v2__field > .f_input,
.signup-v2__form .field-signupform-email > label,
.signup-v2__form .field-signupform-email > .signup-v2__field-icon,
.signup-v2__form .field-signupform-email > .f_input,
.signup-v2__form .field-signupform-contactname > label,
.signup-v2__form .field-signupform-contactname > .signup-v2__field-icon,
.signup-v2__form .field-signupform-contactname > .f_input,
.signup-v2__form .field-signupform-phone > label,
.signup-v2__form .field-signupform-phone > .signup-v2__field-icon,
.signup-v2__form .field-signupform-phone > .f_input {
    grid-row: 1;
    grid-column: 1;
}

.signup-v2 .password-field-wrapper.signup-v2__field--password .field-signupform-password {
    display: contents;
}

.signup-v2 .password-field-wrapper.signup-v2__field--password .field-signupform-password .f_input {
    grid-row: 1;
    grid-column: 1;
}

.signup-v2 .password-field-wrapper.signup-v2__field--password .field-signupform-password .f_error,
.signup-v2 .password-field-wrapper.signup-v2__field--password .field-signupform-password .invalid-feedback {
    grid-row: 2;
    grid-column: 1;
}

.signup-v2__field .f_input,
.signup-v2 .password-field-wrapper .f_input {
    width: 100%;
    height: 48px;
    margin: 0;
    padding: 0 16px 0 42px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: var(--white-smoke-light);
    font-family: "Inter", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: var(--blue-plaza-activei);
    box-sizing: border-box;
    box-shadow: none;
    outline: none;
    font-family: Commissioner;
    font-weight: 400;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
}

.signup-v2__field .f_input::placeholder,
.signup-v2 .password-field-wrapper .f_input::placeholder {
    color: #70768e;
}

.signup-v2__field .f_input:focus,
.signup-v2 .password-field-wrapper .f_input:focus {
    outline: 2px solid rgba(72, 110, 181, 0.35);
    outline-offset: 0;
}

.signup-v2__field-icon {
    position: absolute;
    left: 16px;
    top: 24px;
    transform: translateY(-50%);
    width: 18px;
    height: 18px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 0.45;
    pointer-events: none;
    z-index: 1;
}

.signup-v2__field--email .signup-v2__field-icon {
    background-image: url("../image/mail.svg");
}

.signup-v2__field--country .signup-v2__field-icon {
    background-image: url("../image/flag.svg");
}

.signup-v2__field--country > label {
    position: relative;
}

.signup-v2__field--country label::after {
    content: "";
    position: absolute;
    right: 16px;
    top: 50%;
    width: 16px;
    height: 16px;
    transform: translateY(-50%);
    background: url("../image/t_arrow_down.svg") no-repeat center / contain;
    opacity: 0.55;
    pointer-events: none;
}

.signup-v2__field--country .f_input {
    padding-right: 40px;
}

.signup-v2__field--inn .signup-v2__field-icon {
    background-image: url("../image/59.svg");
}

.signup-v2__field--organization .signup-v2__field-icon {
    background-image: url("../image/city.svg");
}

.signup-v2__field--contactname .signup-v2__field-icon {
    background-image: url("../image/anketa.svg");
}

.signup-v2__field--phone .signup-v2__field-icon {
    background-image: url("../image/phone.svg");
}

.signup-v2__field--password .signup-v2__field-icon {
    display: block;
    background-image: url("../image/lock.svg");
    color: #70768e;
}

.signup-v2__field--password .f_input,
.signup-v2 .password-field-wrapper.signup-v2__field--password .f_input {
    padding-left: 42px;
    padding-right: 48px;
}

.signup-v2__field--promo .signup-v2__field-icon {
    display: none;
}

.signup-v2__field--promo .f_input {
    padding-left: 16px;
}

.signup-v2__field .f_error {
    margin-top: 6px;
    padding-left: 16px;
    font-size: 12px;
}

.signup-v2 .password-field-wrapper.signup-v2__field--password > .password-toggle-icon {
    position: absolute;
    top: 24px;
    right: 16px;
    transform: translateY(-50%);
}

body.signup-v2-page #signup-form .password-field-wrapper.signup-v2__field--password .password-toggle-icon,
body.signup-v2-page .login-v2__form-card .password-field-wrapper.signup-v2__field--password .password-toggle-icon {
    top: 24px;
    transform: translateY(-50%);
}

.signup-v2 .password-field-wrapper .field-signupform-password {
    margin: 0;
}

/* —— Согласия (16×16, gap 8px, текст 12/15) —— */

.signup-v2__consents {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 0;
    width: 100%;
}

.signup-v2__consents .field-signupform-user_agreement,
.signup-v2__consents .field-signupform-personal,
.signup-v2__consents .field-signupform-notice {
    margin: 0;
}

.signup-v2__consents .user-consents {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 0;
    margin: 0;
    font-size: 12px;
    line-height: 15px;
    color: #2e343b;
}

.signup-v2__consents .form-check {
    display: flex;
    align-items: center;
    gap: 8px;
}

.signup-v2__consents .form-check-input {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    margin: 0;
    border-radius: 4px;
    border: 1px solid #e5e8f1;
    background-color: #fff;
    box-shadow: none;
}

.signup-v2__consents .form-check-input:checked {
    background-color: #486eb5;
    border-color: #486eb5;
}

.signup-v2__consents .form-check-input:focus {
    box-shadow: none;
    border-color: #486eb5;
}

.signup-v2__consents .form-check-label,
.signup-v2__consents .form-check-label-wrapper {
    padding: 0;
    margin: 0;
    color: var(--blue-plaza);
    transform: none;
    font-family: Commissioner;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    letter-spacing: 0%;
}

.signup-v2__consents .form-check-label a {
    color: var(--blue-plaza);
    text-decoration: underline;
    text-decoration-style: solid;
    text-underline-offset: 0%;
    text-decoration-thickness: 0%;
    text-decoration-skip-ink: auto;
}

.signup-v2__consents .form-check-label a:hover {
    text-decoration: underline;
}

.signup-v2__consents .f_error {
    margin: 4px 0 0 24px;
    padding: 0;
}

/* —— Кнопка и ссылка —— */

.signup-v2__submit.f_btn {
    width: 100%;
    height: 48px;
    margin: 4px 0 0;
    padding: 0 24px;
    border: none;
    border-radius: 8px;
    background: var(--blue-plaza-active);
    color: var(--neutral-white);
    font-family: Commissioner;
    font-weight: 400;
    font-style: Regular;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: 0%;
    cursor: pointer;
    box-shadow: none;
}

.signup-v2__submit.f_btn:hover:not(:disabled) {
    background: #3a4048;
    color: #fff;
    box-shadow: none;
}

.signup-v2__submit.f_btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.signup-v2__login-link {
    display: block;
    width: 100%;
    margin-top: 16px;
    text-align: center;
    font-family: Commissioner;
    font-weight: 500;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0%;
    text-align: center;
    text-decoration: underline;
    text-decoration-style: solid;
    text-underline-offset: 36.25%;
    text-decoration-thickness: 0%;
    text-decoration-skip-ink: auto;
    color: var(--primary-blue);
}

.signup-v2__login-link:hover {
    color: #263f6c;
    text-decoration: underline;
}

.signup-v2__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;
}

/* Перебить глобальные стили формы внутри signup */

.signup-v2-page .signup-v2__field .f_input,
.signup-v2-page .signup-v2 .password-field-wrapper .f_input {
    display: flex;
    align-items: center;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    height: 48px !important;
    padding: 14px 16px 14px 42px !important;
    border: 1px solid var(--blue-plaza-border) !important;
    border-radius: 12px !important;
    color: var(--blue-plaza-active) !important;
    font-family: Commissioner !important;
    font-weight: 400 !important;
    font-size: 16px !important;
    line-height: 100% !important;
    letter-spacing: 0% !important;
}

.signup-v2-page .signup-v2__field .f_input::placeholder {
    color: var(--blue-plaza-active) !important;
}

.signup-v2-page #signup-form .password-field-wrapper label {
    width: 100%;
}

@media (max-width: 991px) {
    body.signup-v2-page {
        overflow: auto;
    }

    body.signup-v2-page .f_container,
    body.signup-v2-page .login-v2 {
        height: auto;
        max-height: none;
        overflow: visible;
    }

    .signup-v2-page .login-v2__main {
        height: auto;
        max-height: none;
        min-height: 100vh;
        overflow: visible;
    }

    .signup-v2-page .login-v2__content--signup-picker,
    .signup-v2-page .login-v2__content--signup-form {
        padding-top: 24px;
        padding-bottom: 24px;
        justify-content: flex-start;
    }

}

/* На низких экранах чуть плотнее, чтобы влезало без скролла */
@media (max-height: 900px) and (min-width: 992px) {
    .signup-v2-page .login-v2__header {
        margin-bottom: 24px;
    }

    .signup-v2-page .login-v2__tabs--signup {
        margin-bottom: 20px;
    }

    .signup-v2__form {
        gap: 10px;
    }

    .signup-v2__consents {
        gap: 5px;
    }

    .signup-v2__login-link {
        margin-top: 12px;
    }
}

@media (max-width: 576px) {
    .signup-v2__profile-card {
        height: auto;
        min-height: 72px;
        padding: 16px;
    }

    .signup-v2-page .login-v2__tabs--signup {
        gap: 12px;
    }

    .signup-v2-page .login-v2__tabs--signup a.login-v2__tab {
        max-width: none;
    }
}
