/**
 * Фирменный стиль публичных страниц: вход, витрина, портал.
 *
 * Подключается хуком web_include_css и НЕ действует на рабочий стол — там своя
 * тема Frappe, и перекрашивать её целиком значит воевать с фреймворком при
 * каждом обновлении. Публичные страницы — то, что видит человек до входа, и
 * именно они должны выглядеть нашими.
 *
 * Палитра взята из знака: глубокий синий — основной, светлые оттенки для
 * заливок и наведения. Нейтральные тона оставлены фраппевские: они уже
 * согласованы со светлой и тёмной темой, и подменять их незачем.
 */

:root {
	--nasiya-blue: #0021CF;
	--nasiya-blue-bright: #0553F1;
	--nasiya-blue-light: #5793F2;
	--nasiya-blue-tint: #eef2ff;

	/* Frappe красит кнопки и ссылки через эти переменные — переопределяем их,
	   а не каждый класс: так фирменный цвет доходит и до элементов, которые
	   появятся во фреймворке позже. */
	--primary: var(--nasiya-blue);
	--primary-color: var(--nasiya-blue);
	--text-on-primary: #fff;
}

:root[data-theme="dark"],
:root[data-theme-mode="dark"] {
	/* На тёмном глубокий синий почти сливается — берём яркий. */
	--primary: var(--nasiya-blue-bright);
	--primary-color: var(--nasiya-blue-bright);
	--nasiya-blue-tint: rgba(5, 83, 241, .14);
}

/* --------------------------------------------------------------------------
   Кнопки
   -------------------------------------------------------------------------- */

.btn-primary,
.btn-login.btn-primary,
.btn-login-with-email-link.btn-primary {
	background-color: var(--primary);
	border-color: var(--primary);
	color: #fff;
	font-weight: 600;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-login.btn-primary:hover {
	background-color: var(--nasiya-blue-bright);
	border-color: var(--nasiya-blue-bright);
	color: #fff;
}

.btn-primary:focus-visible,
.btn:focus-visible,
a:focus-visible {
	outline: 2px solid var(--primary);
	outline-offset: 2px;
	box-shadow: none;
}

/* --------------------------------------------------------------------------
   Ссылки
   -------------------------------------------------------------------------- */

a,
.page-content a:not(.btn) {
	color: var(--primary);
	text-underline-offset: 2px;
}

a:hover {
	color: var(--nasiya-blue-bright);
}

/* --------------------------------------------------------------------------
   Страница входа

   Карточка Frappe по умолчанию плоская и прижата к верху. Поднимаем на ней
   логотип, даём воздух и мягкую тень — это первое, что видит мерчант.
   -------------------------------------------------------------------------- */

.login-content.page-card {
	border: 1px solid var(--border-color, #e5e7eb);
	border-radius: 14px;
	box-shadow: 0 10px 30px rgba(0, 33, 207, .07);
	padding: 2rem 1.75rem;
	max-width: 400px;
}

.login-content .page-card-head .indicator {
	font-weight: 600;
}

/* Логотип на входе задаётся в настройках сайта (app_logo). Здесь только
   размер: без ограничения он растягивается во всю карточку. */
.login-content .page-card-head img,
.for-login .page-card-head img {
	max-height: 34px;
	width: auto;
	margin-bottom: .75rem;
}

.form-signin .form-control:focus {
	border-color: var(--nasiya-blue-light);
	box-shadow: 0 0 0 3px var(--nasiya-blue-tint);
}

/* --------------------------------------------------------------------------
   Шапка и подвал портала
   -------------------------------------------------------------------------- */

.navbar {
	border-bottom: 1px solid var(--border-color, #e5e7eb);
	box-shadow: none;
}

.navbar .navbar-brand img {
	max-height: 26px;
	width: auto;
}

.web-footer,
.footer-powered {
	color: var(--text-muted, #9ca3af);
	font-size: .82rem;
}

/* --------------------------------------------------------------------------
   Витрина /demo

   Разметка страницы своя (www/demo.html), здесь — только то, что относится к
   бренду и должно пережить правку разметки: подсветка выбранного языка и
   поведение главной кнопки.
   -------------------------------------------------------------------------- */

.nasiya-demo-cta {
	background: var(--primary);
	color: #fff;
	transition: background-color .15s ease, transform .12s ease;
}

.nasiya-demo-cta:hover {
	background: var(--nasiya-blue-bright);
	color: #fff;
	transform: translateY(-1px);
}

.nasiya-demo-secondary:hover {
	border-color: var(--nasiya-blue-light);
	color: var(--primary);
}

@media (prefers-reduced-motion: reduce) {
	.nasiya-demo-cta { transition: none; }
	.nasiya-demo-cta:hover { transform: none; }
}
