/* Экран входа почты в стиле экрана входа ЕСПО (frontend/src/index.css, «Экран
   входа»). Цвета заданы здесь, а не токенами elastic: экран тёмный всегда,
   и в светлой, и в тёмной теме. */

@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 400; font-display: swap;
	src: url(../fonts/ibm-plex-sans-cyrillic-400-normal.woff2) format('woff2');
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 400; font-display: swap;
	src: url(../fonts/ibm-plex-sans-latin-400-normal.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 600; font-display: swap;
	src: url(../fonts/ibm-plex-sans-cyrillic-600-normal.woff2) format('woff2');
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 600; font-display: swap;
	src: url(../fonts/ibm-plex-sans-latin-600-normal.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 700; font-display: swap;
	src: url(../fonts/ibm-plex-sans-cyrillic-700-normal.woff2) format('woff2');
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 700; font-display: swap;
	src: url(../fonts/ibm-plex-sans-latin-700-normal.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

html, body.task-login { height: 100%; background: #081627; }
body.task-login #layout { display: block; height: 100%; }

.espo-login {
	display: flex;
	min-height: 100vh;
	font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	background: #081627;
}

/* Слева пока пусто: ровная панель на тон светлее окна входа */
.espo-login__stage {
	flex: 1 1 58%;
	background: linear-gradient(160deg, #173451 0%, #11294a 55%, #0f243d 100%);
}

.espo-login__auth {
	flex: 0 0 480px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 40px 30px;
	background: linear-gradient(160deg, #0e2338 0%, #081524 100%);
	border-left: 1px solid rgba(255, 255, 255, 0.06);
	box-shadow: inset 26px 0 54px -34px rgba(0, 0, 0, 0.85);
	overflow: auto;
}

#login-form.espo-authcard {
	box-sizing: border-box;
	width: 100%;
	max-width: 356px;
	margin: 0;
	/* elastic сдвигает форму входа вниз (top: 165px) — у нас центр задаёт панель */
	position: static;
	top: auto;
}

/* Таблицу loginform разворачиваем в столбец полей */
#login-form table,
#login-form tbody,
#login-form tr,
#login-form td { display: block; width: 100%; padding: 0; margin: 0; border: 0; background: none; }
#login-form tr.form-group { margin: 0 0 18px !important; }
#login-form td.title { display: block !important; margin-bottom: 8px; }
#login-form .input-group-prepend { display: none; }

#login-form label {
	display: block;
	margin: 0;
	font-size: 13px;
	font-weight: 600;
	color: rgba(224, 233, 244, 0.9);
}

#login-form .input-group { display: block; }
#login-form .input-group input.form-control {
	box-sizing: border-box;
	width: 100%;
	height: auto;
	font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 15px;
	line-height: 1.5;
	color: #f3f7fb;
	background: rgba(255, 255, 255, 0.055);
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: 10px !important;
	padding: 13px 14px;
	box-shadow: none;
	transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}
#login-form .input-group input.form-control::placeholder { color: rgba(199, 214, 230, 0.42); }
#login-form .input-group input.form-control:focus {
	outline: none;
	background: rgba(255, 255, 255, 0.08);
	border-color: #c8a24a;
	box-shadow: 0 0 0 3px rgba(200, 162, 74, 0.18);
}
/* Автозаполнение браузера не должно красить поле в белое */
#login-form input.form-control:-webkit-autofill {
	-webkit-text-fill-color: #f3f7fb;
	-webkit-box-shadow: 0 0 0 40px #12283f inset;
	caret-color: #f3f7fb;
}

#login-form .formbuttons { margin: 28px 0 0; padding: 0; text-align: left; }
#login-form #rcmloginsubmit {
	display: block;
	width: 100%;
	margin: 0;
	cursor: pointer;
	font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.5;
	text-transform: none;
	letter-spacing: normal;
	color: #0a1828;
	background: linear-gradient(180deg, #e2b968 0%, #c8a24a 100%);
	border: 0;
	border-radius: 10px;
	padding: 15px;
	box-shadow: 0 12px 26px -12px rgba(200, 162, 74, 0.7);
	transition: transform 0.18s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.18s ease, filter 0.18s ease;
}
/* elastic на широком экране вешает на кнопку text-uppercase (с !important) */
#login-form #rcmloginsubmit.text-uppercase { text-transform: none !important; }
#login-form #rcmloginsubmit:hover:not(:disabled) {
	transform: translateY(-2px);
	box-shadow: 0 18px 34px -14px rgba(200, 162, 74, 0.8);
	filter: brightness(1.04);
}
#login-form #rcmloginsubmit:active:not(:disabled) { transform: translateY(0); box-shadow: 0 8px 18px -12px rgba(200, 162, 74, 0.7); }
#login-form #rcmloginsubmit:disabled { cursor: default; filter: grayscale(0.35) brightness(0.9); box-shadow: none; }

/* Узкий экран: левой панели нет, окно входа на весь экран */
@media (max-width: 1023.98px) {
	.espo-login__stage { display: none; }
	.espo-login__auth { flex: 1 1 100%; width: 100%; min-width: 0; box-sizing: border-box; border-left: 0; box-shadow: none; padding: 32px 16px; }
}