/* Полировка поверх Metronic. Шрифт - штатный Metronic, без уникализации. */

/* --- размер текста ---
   Metronic рассчитан на 13px, а здесь страницу читают долго и вдумчиво:
   сверяют цифры с документами. Вся типографика Metronic задана в rem, поэтому
   одна базовая величина поднимает и заголовки, и таблицы, и подписи. */
html,
body {
	font-size: 15px !important;
}
@media (max-width: 991.98px) {
	html,
	body {
		font-size: 14px !important;
	}
}

:root {
	--wb-radius: 0.85rem;
	--wb-shadow: 0 4px 18px rgba(24, 28, 50, 0.06);
	--wb-grid: rgba(24, 28, 50, 0.09);
	--wb-c-line: #2a78d6;
	--wb-c-area: rgba(42, 120, 214, 0.10);
	--wb-c-alarm: #d03b3b;
	--wb-c-ink: #52514e;
	--wb-c-muted: #898781;
	--wb-c-surface: #ffffff;
	--wb-step-line: #e4e6ef;
	--wb-soft: #f9f9f9;
	--wb-side: #0d1b2a;
	--wb-side-line: rgba(255, 255, 255, 0.08);
	--wb-side-active: rgba(0, 158, 247, 0.18);
}

[data-bs-theme="dark"] {
	--wb-shadow: 0 4px 18px rgba(0, 0, 0, 0.35);
	--wb-grid: rgba(255, 255, 255, 0.10);
	--wb-step-line: #2b2b40;
	/* Приглушенные блоки должны быть на тон светлее карточки и того же
	   нейтрального оттенка: штатный сине-фиолетовый Metronic на нейтральном
	   темном фоне читается как посторонний. */
	--wb-soft: #1d2027;
	--wb-c-line: #3987e5;
	--wb-c-area: rgba(57, 135, 229, 0.14);
	--wb-c-ink: #c3c2b7;
	--wb-c-surface: #15171c;
}

.card.card-flush {
	border-radius: var(--wb-radius);
	box-shadow: var(--wb-shadow);
	border: 0;
}

/* --- шапка --- */
.app-header {
	background: var(--bs-body-bg);
	border-bottom: 1px solid var(--bs-border-color);
	min-height: 68px;
}

/* --- меню слева ---
   Темная панель идет в комплекте Metronic, ее включает data-kt-app-layout на
   body. Здесь только акцент на текущем разделе: штатно он отличается лишь чуть
   более светлым фоном, а меню должно читаться с одного взгляда. Селекторы
   повторяют штатные - иначе не перебить их по весу. */
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link {
	padding: 0.7rem 1rem;
}
/* Кегль меню оставлен прежним: подрос основной текст, а не навигация.
   0.95rem от базовых 15px дает те же 14px, что штатные 1.1rem от 13px. */
.app-sidebar-menu .menu > .menu-item > .menu-link > .menu-title {
	font-size: 0.95rem;
}
@media (min-width: 992px) {
	.app-sidebar-menu .menu > .menu-item > .menu-link > .menu-title {
		font-size: 0.95rem;
	}
}
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-icon i {
	color: #7f8194;
}
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active {
	background-color: var(--wb-side-active);
	box-shadow: inset 3px 0 0 var(--bs-primary);
}
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active .menu-icon i {
	color: var(--bs-primary);
}
.app-sidebar-footer {
	border-top: 1px solid var(--wb-side-line);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
}
.wb-side-user span { line-height: 1.3; }
.wb-side-exit {
	flex: 0 0 auto;
	color: #9a9cae;
	background: rgba(255, 255, 255, 0.06);
}
.wb-side-exit:hover { color: #fff; background: rgba(255, 255, 255, 0.12); }
/* Свернутое меню - только иконки: подпись под них не помещается. */
@media (min-width: 992px) {
	[data-kt-app-sidebar-minimize="on"] .app-sidebar .wb-side-user { display: none; }
	[data-kt-app-sidebar-minimize="on"] .app-sidebar .app-sidebar-footer { justify-content: center; }
}
.wb-logo {
	display: block;
	width: 38px;
	height: 38px;
	flex: 0 0 38px;
}

/* --- страница входа ---
   Раскладка creative из комплекта Metronic: слева представление, справа
   карточка с формой. Фоновой картинки из демо у нас нет и заводить ее незачем -
   градиент под цвет логотипа дает то же самое и ничего не весит. */
.wb-auth {
	background: radial-gradient(120% 120% at 15% 10%, #c1121f 0%, #7a0b14 45%, #2a0508 100%);
	background-attachment: fixed;
}
[data-bs-theme="dark"] .wb-auth {
	background: radial-gradient(120% 120% at 15% 10%, #7a0b14 0%, #3d070c 45%, #120203 100%);
}
.wb-auth-logo { width: 96px; height: 96px; }

/* --- показатели --- */
.wb-stat { border: 1px solid var(--bs-border-color); }
.wb-stat-accent { border-color: rgba(0, 158, 247, 0.35); }
.wb-mini {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 0.6rem 0.85rem;
	background: var(--wb-soft);
	border-radius: 0.6rem;
}
.wb-mini span { font-size: 0.9rem; color: var(--bs-text-muted); }
.wb-mini b { font-size: 1.25rem; color: var(--bs-gray-900); }

/* --- пользователи в служебном разделе --- */
.wb-avatar {
	flex: 0 0 40px;
	width: 40px;
	height: 40px;
	border-radius: 0.6rem;
	background: var(--wb-soft);
	color: var(--bs-gray-700);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
}
/* Отключенная запись остается в списке, но не притворяется рабочей. */
.wb-user-off .wb-avatar,
.wb-user-off td > div:first-child { opacity: 0.55; }

/* --- таблица товаров --- */
.wb-table th { white-space: nowrap; }
.wb-table td { vertical-align: middle; }
/* Крупный шрифт съедает ширину, а колонок здесь девять. Место возвращается за
   счет отступов в ячейках, а не за счет размера цифр - их и надо читать. */
.wb-table th,
.wb-table td { padding-left: 0.55rem; padding-right: 0.55rem; }
.wb-name { max-width: 280px; }
.wb-row { cursor: pointer; }
.wb-row:hover { background: var(--wb-soft); }
.wb-sort { color: inherit; text-decoration: none; }
.wb-sort:hover { color: var(--bs-primary); }
.wb-badge-note {
	display: inline-block;
	margin-top: 3px;
	font-size: 0.85rem;
	color: var(--bs-warning);
}
.wb-filters .form-label { margin-bottom: 0.25rem; }
.badge.wb-badge-disputed { background: rgba(255, 199, 0, 0.16); color: #b58500; }
.badge.wb-badge-excluded { background: rgba(241, 65, 108, 0.14); color: #d9214e; }
.wb-row-loss { background: rgba(241, 65, 108, 0.06); }

/* --- пошаговая трассировка расчета --- */
.wb-step { display: flex; gap: 1rem; padding: 1rem 0; border-bottom: 1px dashed var(--wb-step-line); }
.wb-step:last-child { border-bottom: 0; }
.wb-step-no {
	flex: 0 0 32px;
	height: 32px;
	border-radius: 50%;
	background: var(--wb-soft);
	color: var(--bs-gray-700);
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 0.85rem;
}
.wb-step-body { flex: 1 1 auto; min-width: 0; }
.wb-step-head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 1rem;
	flex-wrap: wrap;
}
.wb-step-head > span { color: var(--bs-gray-800); }
.wb-step-head > b { font-size: 1.1rem; white-space: nowrap; }
.wb-step-result .wb-step-no,
.wb-step-final .wb-step-no { background: rgba(0, 158, 247, 0.14); color: var(--bs-primary); }
.wb-step-final { background: var(--wb-soft); border-radius: var(--wb-radius); padding: 1rem; margin-top: 0.5rem; }
.wb-src { font-size: 0.85rem; color: var(--bs-text-muted); margin-top: 2px; word-break: break-word; }
.wb-note { color: var(--bs-text-muted); margin-top: 6px; }
.wb-formula {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 0.9rem;
	color: var(--bs-gray-700);
	background: var(--wb-soft);
	border-radius: 0.5rem;
	padding: 0.4rem 0.7rem;
	margin-top: 6px;
	display: inline-block;
}
.wb-code {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 0.9rem;
	white-space: pre-wrap;
	background: var(--wb-soft);
	border-radius: 0.6rem;
	padding: 1rem;
	color: var(--bs-gray-800);
}

/* --- карточка товара из фида магазина --- */
.wb-thumb {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	flex: 0 0 44px;
	border-radius: 0.5rem;
	object-fit: contain;
	background: var(--wb-soft);
	border: 1px solid var(--bs-border-color);
}
.wb-thumb-lg { width: 84px; height: 84px; flex-basis: 84px; border-radius: 0.75rem; }
.wb-thumb-empty { color: var(--bs-gray-500); }
.wb-no-card { color: var(--bs-gray-500); cursor: help; }

.wb-feed {
	background: var(--wb-soft);
	border-radius: var(--wb-radius);
	padding: 1rem 1.15rem;
}

/* --- пояснения под знаком вопроса ---
   Раскрываются щелчком и висят, пока не закроешь: текст в них читают, а не
   подглядывают, и внутри бывают ссылки. Выравнивание по левому краю - штатное
   у Bootstrap центрирует, и абзац из пяти строк так читать невозможно. */
.wb-hint-wrap { display: inline-block; }
.wb-hint {
	font-size: 0.95rem;
	color: var(--bs-gray-500);
	cursor: pointer;
	vertical-align: baseline;
}
.wb-hint:hover,
.wb-hint[aria-describedby] { color: var(--bs-primary); }
.wb-hint:focus-visible { outline: 2px solid var(--bs-primary); outline-offset: 2px; border-radius: 2px; }
.popover.wb-hint-pop {
	max-width: 420px;
	border: 1px solid var(--bs-border-color);
	border-radius: var(--wb-radius);
	box-shadow: var(--wb-shadow);
}
.popover.wb-hint-pop .popover-body {
	text-align: left;
	text-transform: none;
	letter-spacing: normal;
	font-size: 0.95rem;
	font-weight: 400;
	line-height: 1.5;
	color: var(--bs-gray-700);
	padding: 0.9rem 1rem 0.6rem;
}
.popover.wb-hint-pop .popover-body b { color: var(--bs-gray-900); }
.wb-hint-close {
	margin-top: 0.7rem;
	padding-top: 0.6rem;
	border-top: 1px solid var(--bs-border-color);
	color: var(--bs-primary);
	font-weight: 600;
	cursor: pointer;
	text-align: right;
}

/* --- пояснение к спорным позициям --- */
.wb-explain {
	max-width: 68ch;
	font-size: 0.95rem;
	color: var(--bs-gray-700);
	background: var(--wb-soft);
	border-left: 3px solid var(--bs-primary);
	border-radius: 0.5rem;
	padding: 0.7rem 0.9rem;
}
.wb-explain b { color: var(--bs-gray-900); }
.wb-explain-warn { border-left-color: var(--bs-warning); max-width: none; }
.wb-explain ul { padding-left: 1.1rem; }
.wb-explain li + li { margin-top: 0.4rem; }
.wb-disputed { color: var(--bs-gray-600); cursor: help; }

/* --- находки --- */
.wb-finding { padding: 0.9rem 0; border-bottom: 1px dashed var(--wb-step-line); }
.wb-finding:last-of-type { border-bottom: 0; }
.wb-impact { color: var(--bs-primary); }
.alert.wb-alert-ok { background: rgba(80, 205, 137, 0.12); border: 0; border-radius: var(--wb-radius); }
.alert.wb-alert-warn { background: rgba(255, 199, 0, 0.14); border: 0; border-radius: var(--wb-radius); }
.alert.wb-alert-err { background: rgba(241, 65, 108, 0.12); border: 0; border-radius: var(--wb-radius); }

/* --- полоса подмены пользователя --- */
.wb-impersonate {
	background: #ffc700;
	color: #3f4254;
	font-size: 0.95rem;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.wb-impersonate b { color: #181c32; }

/* --- график ---
   Палитра проверена валидатором на контраст и различимость при дальтонизме,
   отдельно для светлой и темной темы. Насыщенные голубой и желтый из комплекта
   давали резь в глазах: желтый на белом это 1.8:1, читать невозможно. Данные
   несет одна линия, все остальное - служебная графика приглушенным серым.
   Цветом выделена только веха утраты. */
.wb-chart {
	position: relative;
	width: 100%;
	overflow: hidden;
	outline: none;
}
.wb-chart svg { display: block; }
.wb-chart:focus-visible { box-shadow: 0 0 0 2px var(--wb-c-line); border-radius: 0.4rem; }
.wb-c-grid { stroke: var(--wb-grid); stroke-width: 1; shape-rendering: crispEdges; }
.wb-c-axis { font-size: 12px; fill: var(--wb-c-muted); }
.wb-c-line { fill: none; stroke: var(--wb-c-line); stroke-width: 2; stroke-linejoin: round; }
.wb-c-area { fill: var(--wb-c-area); stroke: none; }
.wb-c-rule { fill: none; stroke: var(--wb-c-muted); stroke-width: 1; stroke-dasharray: 3 4; opacity: 0.7; }
.wb-c-mark { fill: var(--wb-c-muted); stroke: var(--wb-c-surface); stroke-width: 2; }
.wb-c-evlabel {
	font-size: 12px;
	fill: var(--wb-c-ink);
	stroke: var(--wb-c-surface);
	stroke-width: 3;
	paint-order: stroke fill;
}
.wb-c-rule.wb-c-alarm { stroke: var(--wb-c-alarm); opacity: 1; }
.wb-c-mark.wb-c-alarm { fill: var(--wb-c-alarm); }
.wb-c-evlabel.wb-c-alarm { fill: var(--wb-c-alarm); }
.wb-c-hover { opacity: 0; }
.wb-c-hover.on { opacity: 1; }
.wb-c-cursor { stroke: var(--wb-c-ink); stroke-width: 1; opacity: 0.35; shape-rendering: crispEdges; }
.wb-c-dot { fill: var(--wb-c-line); stroke: var(--wb-c-surface); stroke-width: 2; }
.wb-c-tip {
	position: absolute;
	left: 0;
	top: 0;
	display: none;
	pointer-events: none;
	white-space: nowrap;
	background: var(--wb-c-surface);
	border: 1px solid var(--bs-border-color);
	border-radius: 0.5rem;
	box-shadow: var(--wb-shadow);
	padding: 0.35rem 0.6rem;
	line-height: 1.35;
}
.wb-c-tip.on { display: block; }
.wb-c-tip b { display: block; font-size: 1rem; color: var(--bs-gray-900); }
.wb-c-tip span { display: block; font-size: 0.85rem; color: var(--wb-c-muted); }
.wb-c-tip .wb-c-tip-ev { color: var(--wb-c-ink); }
.wb-c-tip .wb-c-tip-ev.wb-c-alarm { color: var(--wb-c-alarm); }

/* --- печать: страница уходит юристу и в приложение к претензии --- */
@media print {
	.app-header, .app-footer, .app-sidebar, .card-toolbar, .wb-filters, .btn { display: none !important; }
	.wb-c-tip, .wb-c-hover { display: none !important; }
	/* Знаки вопроса и постраничная навигация на бумаге бессмысленны:
	   подсказку не раскроешь, на страницу не перейдешь. */
	.wb-hint-wrap, .popover, .pagination { display: none !important; }
	.app-wrapper, .app-main { margin: 0 !important; padding: 0 !important; }
	.card { box-shadow: none !important; border: 1px solid #ddd !important; break-inside: avoid; }
	.wb-step { break-inside: avoid; }
	body { background: #fff !important; }
}