/* ==========================================================================
   Портал 1535 — экраны входа и активации (модуль Identity, E2-T7, E2-T8; образец «Геометрия v3» — форма входа
   прототипа b-geometriya, раздел 36 «Вход»): подсказка логина с примером моноширинным, «Забыли пароль?» справа от
   подписи поля, поле пароля с кнопкой «Показать пароль», поля кода (крупно моноширинным), «Как восстановить доступ»
   (<details>), текстовая кнопка «Сменить тему». Каркас экрана, плоскость, ромбы шагов и карточка «Первый раз в
   портале?» — макет без оболочки модуля Ui (bare.css); здесь — только своё. Кнопки работают через login.js; без
   JavaScript их нет (hidden). Только контракт --p-*.
   ========================================================================== */

/* Подсказка логина: строка поля — для чтения с экрана (aria-describedby), на экране — она же под полем с примерами
   моноширинным (.login-sample, aria-hidden) */
.login-field > .hint[id] {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}
.login-field { position: relative; }
.login-examples { display: block; }
.login-example { font-family: var(--p-font-mono); font-size: var(--p-fs-sm); white-space: nowrap; color: var(--p-text); }

/* «Забыли пароль?» — в строке подписи поля, справа (образец .lrow + .linkbtn): ссылка к «Как восстановить доступ» */
.login-pwfield { grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: var(--p-space-3); }
.login-pwfield > .label { grid-column: 1; }
.login-pwfield > .login-forgot { grid-column: 2; grid-row: 1; }
.login-pwfield > :not(.label, .login-forgot) { grid-column: 1 / -1; }
.login-forgot {
  display: inline-flex; align-items: center; min-height: var(--p-target-min); color: var(--p-link);
  font-size: var(--p-fs-sm); line-height: var(--p-lh-sm); font-weight: var(--p-fw-semibold);
}

/* Поле пароля: кнопка-значок — внутри поля у правого края, цель — квадрат высотой поля; текст до неё не доходит */
.pw-field { position: relative; display: block; min-width: 0; }
.pw-field > .input { width: 100%; padding-right: calc(var(--p-control-height) + var(--p-space-1)); }
.pw-toggle {
  position: absolute; top: 0; right: 0; display: inline-grid; place-items: center; width: var(--p-control-height); height: 100%;
  padding: 0; border: 0; border-radius: var(--p-radius-sm); background: none; color: var(--p-text);
}
.pw-toggle:hover { background: var(--p-hover); }
.pw-toggle[aria-pressed="true"] { color: var(--p-link); }

/* Коды: из приложения (6 цифр или резервный) и активации — крупно моноширинным с разрядкой (образец .otp, .acode) */
.login-otp, .login-acode { max-width: calc(var(--p-space-16) * 4 + var(--p-space-1)); font-family: var(--p-font-mono); }
.login-otp { font-size: var(--p-fs-xl); letter-spacing: 0.24em; }
.login-acode { font-size: var(--p-fs-lg); letter-spacing: 0.14em; text-transform: uppercase; }
.login-otp::placeholder, .login-acode::placeholder { letter-spacing: normal; }

/* «Как восстановить доступ» — ссылкой; раскрывается без JavaScript */
.login-more > summary {
  display: inline-flex; align-items: center; min-height: var(--p-target-min); color: var(--p-link);
  font-weight: var(--p-fw-semibold); text-decoration: underline; text-underline-offset: 0.2em; cursor: pointer; list-style: none;
}
.login-more > summary::-webkit-details-marker { display: none; }
.login-more > summary:hover { text-decoration-thickness: var(--p-line-strong); }
.login-more > p { max-width: var(--p-measure); padding: var(--p-space-1) 0 var(--p-space-2); color: var(--p-text); }
/* «Вопросы по входу» на телефоне — под формой; от 760 px они на плоскости (строка внизу) */
@container bare (min-width: 760px) {
  .login-questions { display: none; }
}
/* «Сменить тему» — кнопка видом ссылки (действие на странице, а не переход) */
.login-textbtn {
  display: inline-flex; align-items: center; justify-self: start; min-height: var(--p-target-min); padding: 0; border: 0; background: none;
  color: var(--p-link); font-size: inherit; text-decoration: underline; text-underline-offset: 0.2em; cursor: pointer;
}
.login-textbtn:hover { text-decoration-thickness: var(--p-line-strong); }

/* Блок «Вы не сотрудник школы?» (E42-T1): ссылки столбцом, подписи могут переноситься – x-ui::more-link по умолчанию не переносит и на телефоне вылезает за край */
[data-login-external] { display: grid; justify-items: start; }
[data-login-external] .linkmore { white-space: normal; }