/* Small extras for the light login stub (not present as-is in Vue dump). */

/*
 * server.css normally sets :root { font-size: var(--default-font-size) }.
 * guest.css then uses body { font-size: .875em } → ~13.1px.
 * Without that root rule, .875em is based on the browser 16px → ~14px (footer too big).
 */
:root {
	font-size: var(--default-font-size);
	line-height: var(--default-line-height);
}

/*
 * Подписи нижней части: visual match к скринам (regular-medium).
 * guest.css button{font-weight:bold} перебиваем; 400 выглядел слишком тонко.
 */
.login-box .button-vue.button-vue--text-only.button-vue--vue-tertiary,
.login-box .button-vue.button-vue--text-only.button-vue--tertiary,
.login-box .button-vue.button-vue--text-only.button-vue--vue-tertiary .button-vue__text,
.login-box .button-vue.button-vue--text-only.button-vue--tertiary .button-vue__text {
	font-family: var(--font-face) !important;
	font-weight: 500 !important;
	font-size: var(--default-font-size) !important;
	line-height: normal !important;
	letter-spacing: normal;
	color: var(--color-main-text, #222222);
}

.login-box .checkbox-content__text,
.login-box .checkbox-radio-switch__text {
	font-family: var(--font-face);
	font-weight: 500;
	font-size: var(--default-font-size);
	line-height: normal;
	color: var(--color-main-text, #222222);
}

/* Neutralize leftover guest.css rules that fight Vue input/button layout.
   Do not reset padding — Vue floating labels need padding-block/inline. */
.login-form .input-field__input {
	width: 100%;
	max-width: 100%;
	margin: 0;
	box-sizing: border-box;
	font-family: var(--font-face);
	font-size: var(--default-font-size);
	font-weight: normal;
	color: var(--color-main-text);
	/* Unitless: overrides body { line-height: 1.6em } absolute inheritance */
	line-height: var(--default-line-height);
	padding-block: 0;
	padding-inline: var(--input-padding-start) var(--input-padding-end);
}

/* Vue sets appearance:textfield !important on all inputs; that mis-sizes password bullets */
.login-form .input-field__input[type="password"] {
	-webkit-appearance: none !important;
	-moz-appearance: none !important;
	appearance: none !important;
}

/*
 * guest.css: button { display:inline-block; width:auto; padding:… }.
 * Не трогаем padding:unset — Vue padding должен остаться.
 */
.login-form .button-vue,
.login-box .button-vue {
	font-family: var(--font-face);
	background-image: none;
	margin-inline: 0;
	max-width: 100%;
}

/* fieldset min-width:min-content раздувает форму → кнопка визуально уезжает вправо */
.login-form__fieldset {
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}

/*
 * У primary wide асимметричный padding-inline (4px 8px) сдвигает
 * «→ Войти» вправо. На полной ширине — симметричный padding.
 * border-bottom:2px + стрелка дают лёгкий оптический уход вправо.
 * Живой NC: подпись кнопки medium (500), не bold (700) из старого Vue dump.
 */
.login-form .button-vue.button-vue--wide.button-vue--vue-primary,
.login-form .button-vue.button-vue--wide.button-vue--vue-primary .button-vue__text {
	font-family: var(--font-face);
	font-weight: 500;
}

.login-form .button-vue.button-vue--wide.button-vue--vue-primary {
	padding-inline: var(--button-padding-default);
	border-width: 1px;
}

.login-form .button-vue.button-vue--wide.button-vue--vue-primary .button-vue__wrapper {
	/* оптическая компенсация стрелки (вес слева) */
	transform: translateX(-2px);
}

/* Пустой блок alternative-logins всё равно участвует в flex gap → лишний низ */
.login-box__alternative-logins:empty {
	display: none;
}

#message.login-error {
	display: block;
	color: var(--color-text-error, #bf0000);
	text-align: center;
	font-weight: 600;
	margin: 0 0 0.25rem;
}

#message.login-error .float-spinner {
	display: none;
}

#nojavascript {
	max-width: 28rem;
	margin: 2rem auto;
	padding: 1rem;
	background: var(--color-main-background-blur, rgba(255, 255, 255, 0.8));
	color: var(--color-main-text, #222);
	border-radius: var(--border-radius-container, 12px);
}

/* Keep footer readable on themed background */
footer.guest-box a.entity-name {
	color: inherit;
}