/*
 * landing2027 / django-bindings.css
 *
 * ЕДИНСТВЕННЫЙ файл в этой папке, которого нет в архиве дизайнера. Остальные
 * (theme-lending, reset, header, hero, main, footer, queries2) — побайтовые
 * копии архивных, чтобы следующий архив можно было просто раскатать поверх.
 *
 * Как обновлять архивные файлы:
 *   cd <распакованный архив>/static/css
 *   for f in theme-lending.css reset.css header.css hero.css main.css \
 *            footer.css queries2.css; do
 *       sed -e 's#\.\./\.\./static/img/#../img/#g' \
 *           -e 's#/static/img/#../img/#g' "$f" > <repo>/.../css/"$f"
 *   done
 * Единственная правка — пути к картинкам: у нас css/ и img/ лежат рядом
 * внутри static_2/landing2027/, в архиве — css/ и static/img/ через корень.
 * queries.css, aside.css, theme-dark.css, theme-light.css не переносим:
 * первый дизайнер просил выбросить, остальные пустые.
 *
 * Здесь — только то, чего в архиве нет и быть не может: живые формы вместо
 * заглушек с action="#". Подключается последним. Держать файл коротким:
 * всё, что дизайнер способен нарисовать сам, должно приезжать архивом.
 */

/* --- Hero: форма вместо статичного блока ---------------------------------
 * У дизайнера .hero__module-a — div, а .hero__module-subtitle внутри него —
 * div с текстом-заглушкой. У нас это форма на onboarding:register с реальным
 * <input>, поэтому нужны свои правила: .hero__module — колонка с
 * align-items:flex-start, без width форма и поле сжимаются по содержимому, а
 * у input'а остаются рамка, фон и собственные отступы. Типографика —
 * архивная, здесь только то, что относится к полю ввода. */
.hero__module-a{
    display: block;
    width: 100%;
}
input.hero__module-subtitle{
    display: block;
    width: 100%;
    padding: 6px 0;
    background: transparent;
    border: none;
}
input.hero__module-subtitle::placeholder{
    color: var(--text-placeholder);
}

/* --- Ссылки в шкуре кнопок ------------------------------------------------
 * У дизайнера это <button> и <div> с заглушками. Там, где элемент обязан
 * вести на реальный адрес (якорь #x-contact, {% url 'base' %},
 * {% url 'user_logout' %}, «/» на логотипе), у нас <a> — а в reset.css нет
 * сброса оформления ссылок, поэтому они приезжают с подчёркиванием.
 * Геометрия и цвета — архивные. */
a.logo{
    text-decoration: none;
}
a.hero__module-btn1,
a.card-btn,
a.login,
a.signup,
a.loginm,
a.signupm{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}
a.login,
a.signup{
    font-size: 11px;
}
a.hero__module-btn1{
    justify-content: flex-start;
}

/* --- Инверсия иконки мобильного меню --------------------------------------
 * Архив инвертирует по .over-dark шапку, логотип, пункты меню и кнопки
 * (header.css), но не бургер: его иконки светлые и теряются на светлых
 * секциях Customers / FAQ. landing.js добавляет .mobile-btn в тот же список
 * элементов, правило ниже — то, чего в архиве нет. */
.mobile-btn.over-dark .menu-close,
.mobile-btn.over-dark .menu-open{
    filter: invert(1);
}

/* --- Модалка: мгновенный показ -------------------------------------------
 * Архивный `visibility .2s ease` ломает фокус: Chrome для дискретных свойств
 * отдаёт новое значение только в конце перехода, поэтому первые 200мс
 * модалка остаётся visibility:hidden, её поля нефокусируемы и landing.js не
 * может поставить курсор в первое поле. Показываем сразу, прячем с
 * задержкой на всю длину затухания. */
.auth-modal{
    transition: opacity .2s ease, visibility 0s linear .2s;
}
.auth-modal.is-open{
    transition: opacity .2s ease, visibility 0s linear 0s;
}

/* --- Блокировка скролла фона ---------------------------------------------
 * Вместо архивного body.auth-modal-open{overflow:hidden}: тот не держит
 * overscroll и тач, из-за чего фон на мобильных всё равно уезжает.
 * Класс ставит и снимает landing.js, он же гасит колесо/тач/клавиши. */
html.auth-scroll-locked,
body.auth-scroll-locked{
    overflow: hidden;
    overscroll-behavior: none;
}
body.auth-scroll-locked{
    touch-action: none;
}

/* --- Показ/скрытие пароля -------------------------------------------------
 * В архиве одна статичная иконка глаза. У нас две — открытый и перечёркнутый
 * глаз, landing.js переключает их классом .is-visible. */
.auth-form__toggle-password .password-toggle-hide{
    display: none;
}
.auth-form__toggle-password.is-visible .password-toggle-show{
    display: none;
}
.auth-form__toggle-password.is-visible .password-toggle-hide{
    display: block;
}

/* --- Ошибки и состояния форм ----------------------------------------------
 * .error-msg используют модалки (серверные auth_error/signup_error и ответы
 * AJAX-логина) и форма обратной связи в футере. Состояния .auth-form.is-*
 * ставит landing.js на время запроса и по его результату. */
.error-msg{
    margin: 0 0 16px 0;
    padding: 12px 16px;
    border: 1px solid var(--border-hero);
    border-radius: 16px;
    color: var(--text-placeholder);
    font-family: 'Satoshi';
    font-size: 13px;
}
.sign-state{
    margin-bottom: 16px;
}
.sign-state-error{
    border-color: rgba(255, 103, 124, .42);
    background: rgba(255, 103, 124, .08);
    color: #ff8fa0;
}
.sign-state-success{
    border-color: rgba(105, 242, 180, .42);
    background: rgba(105, 242, 180, .08);
    color: #9af7c8;
}
.auth-form.is-loading input:not([type=submit]){
    opacity: .72;
}
.auth-form.is-loading .auth-form__submit{
    cursor: wait;
    animation: authButtonPulse 1.1s ease-in-out infinite;
}
.auth-form.is-error input{
    border-color: rgba(255, 103, 124, .72);
    box-shadow: 0 10px 34px rgba(255, 80, 112, .12);
}
.auth-form.is-success input{
    border-color: rgba(105, 242, 180, .72);
    box-shadow: 0 10px 34px rgba(105, 242, 180, .1);
}
.auth-form.is-success .auth-form__submit{
    color: rgba(183, 255, 222, .95);
    box-shadow: 0 0 0 1px rgba(105, 242, 180, .16), 0 18px 42px rgba(105, 242, 180, .14);
}
@keyframes authButtonPulse {
    0%, 100%{
        box-shadow: 0 0 0 0 rgba(179, 184, 214, .12);
    }
    50%{
        box-shadow: 0 0 0 8px rgba(179, 184, 214, .05);
    }
}

/* --- prefers-reduced-motion ----------------------------------------------
 * Архив гасит только иконки аккордеонов, переход фона и зерно (main.css).
 * Добавляем остальное: меню, аккордеоны, модалки и бегущую строку.
 * Ambient-видео продолжают воспроизводиться циклически. */
@media (prefers-reduced-motion: reduce){
    .mobile-btn .menu-close,
    .mobile-btn .menu-open,
    .nav-list-open,
    .acc-content,
    .auth-form.is-loading .auth-form__submit,
    .auth-modal,
    .auth-modal.is-open,
    .auth-modal__dialog{
        animation: none !important;
        transition: none !important;
    }
    /* Ленту партнёров останавливает и landing.js (раздел 4); правило страхует
       случай, когда скрипт не отработал и трек едет на CSS-анимации. */
    .partner__track{
        animation: none !important;
    }
}