/*
KG MAX Path — стили новых блоков пути MAX.
Цвета и шрифт — как у темы kg69design (оранжевый #ff7f00 / кнопка #ff6200, Open Sans).
Подключается: на сайте — wp_enqueue_scripts (includes/ext-teksty.php), на странице входа — login_enqueue_scripts (includes/ext-vhod.php).
*/

/* =01 - Запись на игру: [zapis_mx]
----------------------------------------------------------------------*/
.mx-zapis {
	max-width: 560px;
	margin: 28px auto;
	padding: 22px 24px;
	border: 1px solid #ffd9b3;
	border-radius: 6px;
	background: #fff7ee;
	text-align: center;
}
.mx-zapis .btn { margin: 4px 0; }
.mx-zapis p { margin: 0 0 12px; }
.mx-zapis p:last-child { margin-bottom: 0; }
.mx-zapis-result { margin-top: 10px; color: #ff0000; font-size: 13px; }
.mx-zapis-result:empty { display: none; }


/* =02 - Мелкий и крупный текст блоков
----------------------------------------------------------------------*/
.mx-small {
	color: #777;
	font-size: 12px;
	line-height: 17px;
}
.mx-big {
	color: #000;
	font-size: 20px;
	line-height: 27px;
	font-weight: 600;
}


/* =03 - Полоска «Связь с проектом N из 11»: [svyaz] и блок «дособор»
----------------------------------------------------------------------*/
.mx-svyaz {
	margin: 18px 0;
}
.mx-svyaz-title {
	margin-bottom: 7px;
	font-size: 15px;
}
.mx-svyaz-title b { color: #ff7f00; }
.mx-svyaz-bar {
	height: 10px;
	overflow: hidden;
	border-radius: 5px;
	background: #e6e6e6;
}
.mx-svyaz-bar span {
	display: block;
	height: 100%;
	border-radius: 5px;
	background: #ff7f00;
	background: linear-gradient(to right, #ff9a33, #ff6200);
	-webkit-transition: width .4s;
	transition: width .4s;
}


/* =04 - Блоки после отчёта урока: Е5 (канал MAX) и И1 (дособор связей)
----------------------------------------------------------------------*/
.mx-after {
	clear: both;
	margin: 24px 0;
	padding: 20px 22px;
	border-left: 4px solid #ff8c00;
	border-radius: 0 6px 6px 0;
	background: #fff7ee;
}
.mx-after.mx-wait { display: none; } /* ждёт принятия отчёта: показывает скрипт в ext-teksty.php */
.mx-after p { margin: 0 0 12px; }
.mx-after p:last-child { margin-bottom: 0; }
.mx-after .btn { margin: 2px 0; }

/* Сообщения проверки отчёта (Е4) */
#check-result .mx-checking { border-color: #ff8c00; color: #555; }
#check-result .mx-next { margin-top: 10px; font-weight: 600; }

/* И1 — список недостающего */
.mx-dosbor-list {
	margin: 14px 0 0;
	padding: 0;
	list-style: none;
}
.mx-dosbor-item {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-align-items: center;
	align-items: center;
	padding: 10px 0;
	border-top: 1px solid #f0d5b8;
}
.mx-dosbor-item:first-child { border-top: none; }
.mx-dosbor-name {
	-webkit-flex: 1 1 200px;
	flex: 1 1 200px;
	padding-right: 12px;
	font-weight: 600;
}
.mx-dosbor-actions .btn { margin-right: 8px; }
.mx-skip {
	padding: 0;
	border: none;
	background: none;
	color: #777;
	font: inherit;
	font-size: 12px;
	text-decoration: underline;
	cursor: pointer;
}
.mx-skip:hover { color: #000; }
.mx-skip[disabled] { opacity: .5; cursor: default; }


/* =04a - Пара кнопок «Забрать подарок…» / «Отказаться от подарка…» — одной ширины и высоты (решение Аркадия 22.10)
----------------------------------------------------------------------*/
/* Профиль — подарок дня 1 ([mx_podarok], ext-profil.php): на всю ширину блока.
   Уроки 2 и 4 — кнопки после кодового слова (ext-lestnica.php): по центру, одна ширина до 480px.
   Каждая кнопка в своём <p> (скрипт дня 4 в ext-podarok-vk.php прячет родителя кнопки) — сетка с равными строками
   выравнивает высоту, даже если на телефоне одна надпись переносится на две строки. Цвета и тексты — как у темы. */
.mx-para {
	display: grid;
	grid-template-columns: 100%;
	grid-auto-rows: 1fr;
	grid-row-gap: 8px;
	row-gap: 8px;
	margin: 10px 0 14px;
}
/* Ширина пары — по самой длинной надписи («Отказаться от подарка и начать урок N»), обе кнопки одинаковые
   (Аркадий 22.10: «сильно большие — надо примерно по размеру текста»). На узком экране — на всю ширину. */
.mx-para,
.mx-para-center {
	grid-template-columns: max-content;
	-webkit-justify-content: center;
	justify-content: center;
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
}
body .mx-para > p > .btn { padding-left: 22px; padding-right: 22px; }
@media (max-width: 560px) {
	.mx-para,
	.mx-para-center { grid-template-columns: 100%; }
}
.mx-para > p {
	display: -webkit-flex;
	display: flex;
	margin: 0;
}
body .mx-para > p > .btn {
	display: -webkit-flex;
	display: flex;
	-webkit-flex: 1 1 auto;
	flex: 1 1 auto;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	width: 100%;
	min-height: 44px;
	margin: 0;
	text-align: center;
	white-space: normal;
}

/* Подарок дней 1 и 2 (макеты podarok-centr-2, den2-centr-3, строка 92 решений): «Забрать» 334 на 44, отказ меньше и тише, по ширине текста.
   Равная ширина пары выше остаётся у дня 4. */
.mx-para.mx-para-pod {
	grid-template-columns: 100%;
	grid-auto-rows: auto;
	grid-row-gap: 14px;
	row-gap: 14px;
	max-width: 334px;
}
.mx-para-pod > p {
	-webkit-justify-content: center;
	justify-content: center;
}
body .mx-para.mx-para-pod > p > .btn.btn-light {
	-webkit-flex: 0 1 auto;
	flex: 0 1 auto;
	width: auto;
	min-height: 0;
	padding: 7px 14px 6px;
	font-size: 11px;
	line-height: 15px;
}
/* Экран после нажатия «Забрать подарок» (дни 1, 2) и после старта бота клуба (день 3) */
.mx-pod-sost { text-align: center; }

/* Запасная строка после сдачи отчёта (строка 95 решений): скрипт в ext-teksty.php */
.mx-otchet-sdan {
	margin: 0;
	padding: 10px 16px;
	background: #fff7ee;
	text-align: center;
	font-weight: 600;
}


/* =05 - Страница входа wp-login.php (В5)
----------------------------------------------------------------------*/
body.login { background: #f3f3f3; }
body.login #login { padding-top: 5%; }
body.login .mx-login-head {
	margin: 0 0 18px;
	text-align: center;
}
body.login .mx-login-head .mx-big { margin: 0 0 6px; }
body.login .mx-login-head p { margin: 0; }
body.login form {
	border: none;
	border-radius: 8px;
	box-shadow: 0 2px 12px rgba(0,0,0,.08);
}
body.login label { color: #333; font-size: 14px; }
body.login form .input,
body.login input[type=text],
body.login input[type=password] {
	border-radius: 4px;
	font-size: 17px;
}
body.login .button-primary,
body.login .button-primary:focus {
	width: 100%;
	height: 44px;
	margin-top: 8px;
	border: none;
	border-radius: 4px;
	background: #ff6200;
	box-shadow: none;
	text-shadow: none;
	font-size: 15px;
	font-weight: 600;
}
body.login .button-primary:hover { background: #fa3e00; }
body.login .submit { clear: both; }
body.login #nav { margin: 18px 0 0; font-size: 14px; }
body.login #nav a.mx-forgot {
	display: inline-block;
	padding: 6px 4px;
	color: #ff6200;
	font-weight: 600;
	text-decoration: underline;
}
body.login #backtoblog { margin-top: 6px; }


/* =06 - Узкие экраны
----------------------------------------------------------------------*/
@media (max-width: 600px) {
	.mx-zapis { margin: 20px 0; padding: 18px 16px; }
	.mx-after { padding: 16px; }
	.mx-big { font-size: 18px; line-height: 24px; }
	.mx-dosbor-item { display: block; }
	.mx-dosbor-name { padding: 0 0 8px; }
}

/* Подарок дня 4: шаги столбиком в светлом блоке (строка 96 решений) */
.mx-p4-shagi { counter-reset: mx-p4; list-style: none; max-width: 450px; margin: 20px auto !important; padding: 16px 18px; box-sizing: border-box; background: #fdf3ef; border-radius: 8px; text-align: left; }
.mx-p4-shagi b { font-weight: 700 !important; }
.mx-p4-shagi li { counter-increment: mx-p4; position: relative; min-height: 28px; margin: 0; padding: 12px 0 12px 40px; line-height: 22px; list-style: none; }
.mx-p4-shagi li::before { content: counter(mx-p4); position: absolute; left: 0; top: 9px; width: 28px; height: 28px; border-radius: 50%; background: linear-gradient(#ff8a3c, #ff5f1f); color: #fff; font-weight: 700; line-height: 28px; text-align: center; }

/* Телефон: поля не мельче 16px, иначе iPhone приближает экран при касании (слово Аркадия 1.11). Масштаб пальцами не запрещён; поле кода своё, 24px */
@media (max-width: 1024px), (pointer: coarse) {
	input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]):not([type=file]):not([type=range]):not([name=kod]), select, textarea { font-size: 16px !important; }
}