/* ==========================================================================
   Braulk UI — тёмный минималистичный стиль панели
   Подключается ПОСЛЕ sb-admin-2*.css и перекрашивает все bootstrap-компоненты,
   поэтому оформление получают и страницы, которые не переписывались вручную.
   ========================================================================== */

:root,
html[data-theme="dark"] {
	color-scheme: dark;
	--bk-bg: #08080a;
	--bk-surface: #0d0d10;
	--bk-surface-2: #131316;
	--bk-hover: #141417;
	--bk-border: #1c1c20;
	--bk-border-strong: #2a2a30;
	--bk-text: #fafafa;
	--bk-text-2: #c9c9d0;
	--bk-muted: #8a8a94;
	--bk-faint: #5b5b64;
	--bk-primary: #ffffff;
	--bk-primary-fg: #09090b;
	--bk-primary-hover: #e4e4e7;
	--bk-danger: #ff6369;
	--bk-danger-bg: rgba(255, 99, 105, .10);
	--bk-success: #3ddc97;
	--bk-success-bg: rgba(61, 220, 151, .10);
	--bk-warning: #f5c542;
	--bk-warning-bg: rgba(245, 197, 66, .10);
	--bk-info: #6ea8ff;
	--bk-info-bg: rgba(110, 168, 255, .10);
	--bk-grid: rgba(255, 255, 255, .028);
	--bk-card-grad: linear-gradient(180deg, rgba(255, 255, 255, .025), rgba(255, 255, 255, 0) 60%);
	--bk-shadow: 0 24px 60px -24px rgba(0, 0, 0, .8);
	--bk-accent-line: #1fb85a;
}

html[data-theme="light"] {
	color-scheme: light;
	--bk-bg: #f5f5f6;
	--bk-surface: #ffffff;
	--bk-surface-2: #f4f4f5;
	--bk-hover: #f0f0f2;
	--bk-border: #e7e7ea;
	--bk-border-strong: #d4d4d9;
	--bk-text: #0b0b0d;
	--bk-text-2: #3a3a42;
	--bk-muted: #6d6d77;
	--bk-faint: #9b9ba5;
	--bk-primary: #0b0b0d;
	--bk-primary-fg: #ffffff;
	--bk-primary-hover: #2a2a30;
	--bk-danger: #e5383b;
	--bk-danger-bg: rgba(229, 56, 59, .08);
	--bk-success: #12935a;
	--bk-success-bg: rgba(18, 147, 90, .09);
	--bk-warning: #b7791f;
	--bk-warning-bg: rgba(183, 121, 31, .10);
	--bk-info: #2563eb;
	--bk-info-bg: rgba(37, 99, 235, .08);
	--bk-grid: rgba(0, 0, 0, .035);
	--bk-card-grad: none;
	--bk-shadow: 0 20px 50px -26px rgba(0, 0, 0, .25);
	--bk-accent-line: #16a34a;
}

/* ---------- База ---------- */
*, *::before, *::after { box-sizing: border-box; }

html, body {
	height: auto;
	min-height: 100%;
	background: var(--bk-bg) !important;
	color: var(--bk-text);
	font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: -0.005em;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

body a { color: var(--bk-text); text-decoration: none; transition: color .15s, background .15s, border-color .15s, opacity .15s; }
body a:hover { color: var(--bk-text); opacity: .8; text-decoration: none; }
body hr { border: 0; border-top: 1px solid var(--bk-border); margin: 1.25rem 0; opacity: 1; }
body ::selection { background: var(--bk-text); color: var(--bk-bg); }

body h1, body h2, body h3, body h4, body h5, body h6,
body .h1, body .h2, body .h3, body .h4, body .h5, body .h6 {
	color: var(--bk-text);
	font-family: inherit;
	font-weight: 650;
	letter-spacing: -0.02em;
}

body .text-gray-100, body .text-gray-200, body .text-gray-300 { color: var(--bk-faint) !important; }
body .text-gray-400, body .text-gray-500, body .text-gray-600, body .text-muted { color: var(--bk-muted) !important; }
body .text-gray-700, body .text-gray-800, body .text-gray-900, body .text-dark { color: var(--bk-text) !important; }
body .text-primary { color: var(--bk-text) !important; }
body .text-success { color: var(--bk-success) !important; }
body .text-danger { color: var(--bk-danger) !important; }
body .text-warning { color: var(--bk-warning) !important; }
body .text-info { color: var(--bk-info) !important; }
body .bg-white, body .bg-light { background: var(--bk-surface) !important; }
body .bg-gradient-primary { background: var(--bk-bg) !important; }
body .shadow, body .shadow-sm, body .shadow-lg { box-shadow: none !important; }
body .small, body small { color: inherit; }

body ::-webkit-scrollbar { width: 10px; height: 10px; }
body ::-webkit-scrollbar-thumb { background: var(--bk-border-strong); border-radius: 10px; border: 2px solid var(--bk-bg); }
body ::-webkit-scrollbar-track { background: transparent; }

/* ---------- Иконки ---------- */
.bk-i {
	width: 18px; height: 18px; flex: 0 0 auto;
	fill: none; stroke: currentColor; stroke-width: 1.8;
	stroke-linecap: round; stroke-linejoin: round;
	vertical-align: -3px;
}
.bk-i.sm { width: 15px; height: 15px; vertical-align: -2px; }
.bk-i.lg { width: 22px; height: 22px; }

/* ==========================================================================
   Каркас
   ========================================================================== */
#wrapper { display: flex; min-height: 100vh; width: 100%; }

.bk-sidebar {
	position: sticky; top: 0; align-self: flex-start;
	width: 271px; flex: 0 0 271px; height: 100vh;
	display: flex; flex-direction: column;
	background: var(--bk-bg);
	border-right: 1px solid var(--bk-border);
	padding: 20px 12px 16px;
	overflow-y: auto;
	z-index: 1040;
}
.bk-brand {
	display: flex; align-items: center; gap: 12px;
	padding: 0 8px 18px;
	color: var(--bk-text) !important;
}
.bk-brand:hover { opacity: 1 !important; }
.bk-brand-mark {
	width: 38px; height: 38px; border-radius: 50%;
	display: grid; place-items: center;
	background: var(--bk-surface-2); border: 1px solid var(--bk-border);
}
.bk-brand-name { font-size: 16px; font-weight: 700; letter-spacing: -0.02em; }
.bk-brand-name small { font-weight: 400; color: var(--bk-muted); font-size: 13px; margin-left: 3px; }

.bk-nav-label {
	margin: 18px 12px 8px;
	font-size: 11px; font-weight: 500; letter-spacing: .09em;
	text-transform: uppercase; color: var(--bk-muted);
}
.bk-nav-label:first-of-type { margin-top: 8px; }
.bk-nav a {
	display: flex; align-items: center; gap: 12px;
	height: 40px; padding: 0 14px; margin: 2px 0;
	border-radius: 999px;
	color: var(--bk-text-2) !important; font-size: 14px; font-weight: 500;
	border: 1px solid transparent;
}
.bk-nav a .bk-i { color: var(--bk-muted); transition: color .15s; }
.bk-nav a:hover { background: var(--bk-hover); color: var(--bk-text) !important; opacity: 1; }
.bk-nav a:hover .bk-i { color: var(--bk-text); }
.bk-nav a.active { background: var(--bk-surface-2); color: var(--bk-text) !important; font-weight: 600; border-color: var(--bk-border); }
.bk-nav a.active .bk-i { color: var(--bk-text); }
.bk-nav .bk-pill {
	margin-left: auto; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px;
	background: var(--bk-danger); color: #fff; font-size: 11px; font-weight: 600;
	display: grid; place-items: center;
}
.bk-sidebar-foot { margin-top: auto; padding: 16px 8px 0; color: var(--bk-faint); font-size: 12px; }

/* перебиваем фон из sb-admin-2 (#wrapper #content-wrapper { background: #f8f9fc }) — иначе в тёмной теме контент светлый */
#wrapper #content-wrapper, #wrapper #content-wrapper.bk-main { background: var(--bk-bg) !important; color: var(--bk-text); }
#wrapper #content-wrapper #content { background: transparent !important; }
.bk-main { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; min-height: 100vh; position: relative; }
.bk-main::before {
	content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
	background-image:
		linear-gradient(var(--bk-grid) 1px, transparent 1px),
		linear-gradient(90deg, var(--bk-grid) 1px, transparent 1px);
	background-size: 56px 56px;
	-webkit-mask-image: linear-gradient(180deg, #000 0, transparent 520px);
	mask-image: linear-gradient(180deg, #000 0, transparent 520px);
}
#content { position: relative; z-index: 1; flex: 1 0 auto; min-width: 0; width: 100%; }

/* ---------- Верхняя панель ---------- */
.bk-topbar {
	position: sticky; top: 0; z-index: 1030;
	height: 68px; display: flex; align-items: center; gap: 10px;
	padding: 0 24px;
	background: color-mix(in srgb, var(--bk-bg) 82%, transparent);
	-webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
	border-bottom: 1px solid var(--bk-border);
}
.bk-topbar-spacer { flex: 1; }
.bk-burger { display: none; }

.bk-chip, .bk-iconbtn, .bk-user {
	display: inline-flex; align-items: center; gap: 8px;
	height: 40px; border-radius: 999px;
	background: var(--bk-surface); border: 1px solid var(--bk-border);
	color: var(--bk-text) !important; font-size: 13px; font-weight: 500;
	cursor: pointer; transition: border-color .15s, background .15s;
	font-family: inherit;
}
.bk-chip:hover, .bk-iconbtn:hover, .bk-user:hover { border-color: var(--bk-border-strong); background: var(--bk-surface-2); opacity: 1 !important; }
.bk-chip { padding: 0 14px; }
.bk-chip .bk-i { color: var(--bk-muted); }
.bk-chip b { font-weight: 700; }
.bk-iconbtn { width: 40px; justify-content: center; padding: 0; position: relative; }
.bk-iconbtn .bk-i { color: var(--bk-text-2); }
.bk-dot {
	position: absolute; top: -3px; right: -3px; min-width: 18px; height: 18px; padding: 0 5px;
	border-radius: 999px; background: var(--bk-danger); color: #fff;
	font-size: 10px; font-weight: 700; display: grid; place-items: center;
	border: 2px solid var(--bk-bg);
}
html[data-theme="dark"] .bk-theme .i-moon, html:not([data-theme]) .bk-theme .i-moon { display: none; }
html[data-theme="light"] .bk-theme .i-sun { display: none; }

.bk-user { padding: 0 12px 0 6px; height: 46px; gap: 10px; border-radius: 16px; }
.bk-avatar {
	width: 34px; height: 34px; border-radius: 9px; flex: 0 0 auto;
	display: grid; place-items: center; overflow: hidden;
	background: var(--bk-primary); color: var(--bk-primary-fg);
	font-size: 12px; font-weight: 700; letter-spacing: 0;
}
.bk-avatar img { width: 100%; height: 100%; object-fit: cover; }
.bk-user-meta { display: flex; flex-direction: column; line-height: 1.15; text-align: left; }
.bk-user-meta b { font-size: 13px; font-weight: 650; }
.bk-user-meta span { font-size: 11px; color: var(--bk-muted); }
.bk-user .bk-i { color: var(--bk-muted); }

/* ---------- Выпадающие меню ---------- */
.bk-dd { position: relative; }
.bk-dd-menu {
	position: absolute; right: 0; top: calc(100% + 10px);
	min-width: 240px; max-width: min(92vw, 340px);
	padding: 8px; border-radius: 18px;
	background: var(--bk-surface); border: 1px solid var(--bk-border-strong);
	box-shadow: var(--bk-shadow);
	display: none; z-index: 1100;
}
.bk-dd.open > .bk-dd-menu { display: block; animation: bkpop .14s ease-out; }
@keyframes bkpop { from { opacity: 0; transform: translateY(-4px) scale(.98); } to { opacity: 1; transform: none; } }
.bk-dd-head { padding: 10px 12px 12px; border-bottom: 1px solid var(--bk-border); margin-bottom: 6px; }
.bk-dd-head b { display: block; font-size: 14px; }
.bk-dd-head span { font-size: 12px; color: var(--bk-muted); word-break: break-all; }
.bk-dd-title { padding: 8px 12px 6px; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--bk-muted); font-weight: 500; }
.bk-dd-item {
	display: flex; align-items: center; gap: 10px; width: 100%;
	padding: 10px 12px; border-radius: 12px; border: 0; background: none;
	color: var(--bk-text-2) !important; font: inherit; font-size: 13.5px; font-weight: 500;
	text-align: left; cursor: pointer;
}
.bk-dd-item:hover { background: var(--bk-hover); color: var(--bk-text) !important; opacity: 1; }
.bk-dd-item .bk-i { color: var(--bk-muted); }
.bk-dd-item.danger, .bk-dd-item.danger .bk-i { color: var(--bk-danger) !important; }
.bk-dd-item.danger:hover { background: var(--bk-danger-bg); }
.bk-dd-item small { display: block; color: var(--bk-muted); font-size: 11.5px; font-weight: 400; }
.bk-dd-empty { padding: 22px 12px; text-align: center; color: var(--bk-muted); font-size: 13px; }
.bk-dd-list { max-height: 340px; overflow-y: auto; width: 320px; max-width: 100%; }

/* ---------- Контент ---------- */
body .container-fluid {
	width: 100%; max-width: 1200px; margin: 0 auto;
	padding: 36px 24px 56px;
}
.bk-page-head { display: flex; align-items: center; gap: 16px; margin-bottom: 28px; }
.bk-page-head .ico {
	width: 48px; height: 48px; border-radius: 50%; flex: 0 0 auto;
	display: grid; place-items: center;
	background: var(--bk-surface); border: 1px solid var(--bk-border);
}
.bk-page-head h1 { margin: 0; font-size: 28px; line-height: 1.15; }
.bk-page-head p { margin: 4px 0 0; color: var(--bk-muted); font-size: 15px; }
body .container-fluid > h1.h3, body .container-fluid > .h3.mb-4 { font-size: 28px; margin-bottom: 24px !important; }

.bk-section-label {
	margin: 34px 0 14px; font-size: 12px; font-weight: 500;
	letter-spacing: .09em; text-transform: uppercase; color: var(--bk-muted);
}

/* ==========================================================================
   Карточки / плитки
   ========================================================================== */
body .card, .bk-card {
	background: var(--bk-surface) var(--bk-card-grad);
	border: 1px solid var(--bk-border);
	border-radius: 22px;
	color: var(--bk-text);
	overflow: visible;
	min-width: 0;
}
body .card[class*="border-bottom-"], body .card[class*="border-left-"] { border-width: 1px; }
body .card-header, body .card-footer {
	background: transparent !important; border-color: var(--bk-border) !important;
	padding: 18px 22px; color: var(--bk-text);
}
body .card-header:first-child { border-radius: 22px 22px 0 0; }
body .card-header h6, body .card-header .h6 { font-size: 14px !important; font-weight: 650; color: var(--bk-text) !important; margin: 0; text-transform: none; letter-spacing: -0.01em; }
body .card-body { padding: 22px; min-width: 0; overflow-wrap: anywhere; }
body .card-title { font-weight: 650; }
body .card-img-top { border-radius: 22px 22px 0 0; }

.bk-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.bk-stat { padding: 20px 22px; border-radius: 22px; background: var(--bk-surface) var(--bk-card-grad); border: 1px solid var(--bk-border); }
.bk-stat-top { display: flex; align-items: center; justify-content: space-between; color: var(--bk-muted); font-size: 14px; }
.bk-stat-top .bk-i { color: var(--bk-faint); }
.bk-stat-val { margin-top: 8px; font-size: 28px; font-weight: 700; letter-spacing: -0.03em; line-height: 1.2; }

.bk-row-card {
	display: flex; align-items: center; gap: 16px; padding: 20px;
	border-radius: 22px; background: var(--bk-surface) var(--bk-card-grad); border: 1px solid var(--bk-border);
}
.bk-row-card + .bk-row-card { margin-top: 16px; }
.bk-row-ico {
	width: 46px; height: 46px; border-radius: 50%; flex: 0 0 auto;
	display: grid; place-items: center;
	background: var(--bk-surface-2); border: 1px solid var(--bk-border); color: var(--bk-text);
}
.bk-row-body { flex: 1; min-width: 0; }
.bk-row-body h3 { margin: 0; font-size: 16px; font-weight: 650; }
.bk-row-body p { margin: 2px 0 0; color: var(--bk-muted); font-size: 14px; }
.bk-row-body .bonus { margin-top: 4px; font-size: 12.5px; font-weight: 600; color: var(--bk-warning); display: flex; align-items: center; gap: 6px; }
.bk-row-body .bk-k { font-size: 12.5px; color: var(--bk-muted); }
.bk-row-body .bk-v { font-size: 20px; font-weight: 700; letter-spacing: -0.02em; word-break: break-all; }
.bk-row-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }

.bk-code {
	display: inline-flex; align-items: center; gap: 10px; height: 46px; padding: 0 18px;
	border-radius: 999px; background: var(--bk-surface-2); border: 1px solid var(--bk-border);
	font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 14px; font-weight: 700; letter-spacing: .06em; color: var(--bk-text);
}
.bk-code button { background: none; border: 0; color: var(--bk-muted); cursor: pointer; padding: 0; display: grid; place-items: center; }
.bk-code button:hover { color: var(--bk-text); }

.bk-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.bk-action {
	display: flex; align-items: center; gap: 14px; padding: 20px;
	border-radius: 22px; background: var(--bk-surface) var(--bk-card-grad); border: 1px solid var(--bk-border);
	color: var(--bk-text) !important; transition: border-color .15s, transform .15s;
}
.bk-action:hover { border-color: var(--bk-border-strong); opacity: 1 !important; transform: translateY(-1px); }
.bk-action .bk-row-body { flex: 1; }
.bk-action > .bk-i { color: var(--bk-faint); }

/* ==========================================================================
   Кнопки
   ========================================================================== */
body .btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	height: 40px; padding: 0 18px; border-radius: 999px;
	font-family: inherit; font-size: 13.5px; font-weight: 600; letter-spacing: -0.005em;
	border: 1px solid var(--bk-border-strong); background: var(--bk-surface); color: var(--bk-text);
	box-shadow: none !important; line-height: 1; white-space: nowrap; cursor: pointer;
	transition: background .15s, border-color .15s, color .15s, opacity .15s, transform .1s;
}
body .btn:hover { background: var(--bk-surface-2); border-color: var(--bk-faint); color: var(--bk-text); opacity: 1; }
body .btn:active { transform: scale(.98); }
body .btn:disabled, body .btn.disabled { opacity: .5; pointer-events: none; }
body .btn-sm, body .btn-xs { height: 34px; padding: 0 14px; font-size: 12.5px; }
body .btn-lg { height: 48px; padding: 0 26px; font-size: 15px; }
body .btn-block { display: flex; width: 100%; }
body .btn-primary, body .btn-success, body .btn-light, .bk-btn-primary {
	background: var(--bk-primary); border-color: var(--bk-primary); color: var(--bk-primary-fg) !important;
}
body .btn-primary:hover, body .btn-success:hover, body .btn-light:hover, .bk-btn-primary:hover {
	background: var(--bk-primary-hover); border-color: var(--bk-primary-hover); color: var(--bk-primary-fg) !important;
}
body .btn-secondary, body .btn-dark, body .btn-outline-primary, body .btn-outline-secondary, body .btn-link {
	background: var(--bk-surface); color: var(--bk-text); border-color: var(--bk-border-strong);
}
body .btn-info { background: var(--bk-info-bg); border-color: transparent; color: var(--bk-info); }
body .btn-warning { background: var(--bk-warning-bg); border-color: transparent; color: var(--bk-warning); }
body .btn-danger, body .btn-outline-danger { background: var(--bk-danger-bg); border-color: transparent; color: var(--bk-danger); }
body .btn-danger:hover, body .btn-outline-danger:hover { background: var(--bk-danger); color: #fff; border-color: var(--bk-danger); }
body .btn-circle { width: 40px; padding: 0; }
body .btn-icon-split .icon { background: transparent; }

/* ==========================================================================
   Формы
   ========================================================================== */
body label { font-size: 13px; font-weight: 500; color: var(--bk-text-2); margin-bottom: 8px; }
body .form-group { margin-bottom: 18px; }
body .form-control, body .custom-select, body .form-select, body select, body textarea, body input[type="text"], body input[type="password"],
body input[type="email"], body input[type="number"], body input[type="search"], body input[type="url"], body input[type="tel"] {
	height: 46px; padding: 0 16px; border-radius: 14px;
	background-color: var(--bk-surface); color: var(--bk-text);
	border: 1px solid var(--bk-border); font-family: inherit; font-size: 14px; font-weight: 500;
	box-shadow: none !important; transition: border-color .15s, background .15s;
}
body textarea, body textarea.form-control { height: auto; min-height: 110px; padding: 12px 16px; line-height: 1.5; }
body .form-control:focus, body .custom-select:focus, body .form-select:focus, body select:focus, body textarea:focus, body input:focus {
	background-color: var(--bk-surface); color: var(--bk-text); border-color: var(--bk-faint); outline: 0;
}
body .form-control::placeholder, body input::placeholder, body textarea::placeholder { color: var(--bk-faint); }
body .form-control:disabled, body .form-control[readonly], body input:disabled { background: var(--bk-surface-2); color: var(--bk-muted); opacity: 1; cursor: not-allowed; }
body select, body .custom-select, body .form-select {
	appearance: none; -webkit-appearance: none; padding-right: 40px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238a8a94' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: right 14px center;
}
body select option { background: var(--bk-surface); color: var(--bk-text); }
body .input-group-text { background: var(--bk-surface-2); border: 1px solid var(--bk-border); color: var(--bk-muted); border-radius: 14px; }
body .input-group > .form-control { height: 46px; }
body .custom-control-label { color: var(--bk-text-2); font-weight: 500; }
body .custom-control-input:checked ~ .custom-control-label::before { background-color: var(--bk-primary); border-color: var(--bk-primary); }
body .custom-control-input:checked ~ .custom-control-label::after { filter: invert(1); }
body .custom-control-label::before { background: var(--bk-surface); border: 1px solid var(--bk-border-strong); box-shadow: none !important; }
body input[type="checkbox"], body input[type="radio"] { height: auto; accent-color: var(--bk-primary); }
body input[type="file"] { height: auto; padding: 10px 14px; }
body .form-text, body .help-block { color: var(--bk-muted); font-size: 12.5px; }
body .is-invalid { border-color: var(--bk-danger) !important; }

/* ==========================================================================
   Таблицы / DataTables
   ========================================================================== */
body .table-responsive { border-radius: 16px; }
body .table { color: var(--bk-text-2); margin-bottom: 0; background: transparent; border-collapse: separate; border-spacing: 0; }
body .table th, body .table td { border-color: var(--bk-border) !important; padding: 14px 16px; vertical-align: middle; }
body .table thead th {
	border-top: 0; border-bottom: 1px solid var(--bk-border) !important;
	font-size: 11.5px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--bk-muted); background: transparent;
}
body .table-bordered, body .table-bordered th, body .table-bordered td { border-left: 0 !important; border-right: 0 !important; }
body .table-bordered { border: 0; }
body .table-striped tbody tr:nth-of-type(odd), body .table-hover tbody tr:hover { background: var(--bk-hover); color: var(--bk-text); }
body .table tbody tr:hover { background: var(--bk-hover); }
body .dataTables_wrapper { color: var(--bk-muted); font-size: 13px; }
body .dataTables_wrapper .dataTables_length select, body .dataTables_wrapper .dataTables_filter input { height: 38px; border-radius: 999px; margin: 0 8px; }
body .dataTables_wrapper .dataTables_info { padding-top: 16px; }
body table.dataTable thead .sorting:before, body table.dataTable thead .sorting:after { opacity: .25; }

/* ---------- Пагинация ---------- */
body .pagination { gap: 6px; flex-wrap: wrap; }
body .page-link, body .pagination > li > a, body .pagination > li > span {
	height: 36px; min-width: 36px; padding: 0 12px; display: inline-flex; align-items: center; justify-content: center;
	border-radius: 999px !important; background: var(--bk-surface); border: 1px solid var(--bk-border); color: var(--bk-text-2); font-size: 13px; font-weight: 500;
}
body .page-link:hover, body .pagination > li > a:hover { background: var(--bk-surface-2); color: var(--bk-text); border-color: var(--bk-border-strong); }
body .page-item.active .page-link, body .pagination > .active > a, body .pagination > .active > span {
	background: var(--bk-primary); border-color: var(--bk-primary); color: var(--bk-primary-fg);
}
body .page-item.disabled .page-link { opacity: .4; background: var(--bk-surface); }

/* ==========================================================================
   Бейджи / алерты / табы / прочее
   ========================================================================== */
body .badge {
	display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 999px;
	font-size: 11.5px; font-weight: 600; letter-spacing: 0; border: 1px solid transparent;
}
body .badge-primary, body .badge-secondary, body .badge-dark, body .badge-light { background: var(--bk-surface-2); color: var(--bk-text-2); border-color: var(--bk-border); }
body .badge-success, body .label-success { background: var(--bk-success-bg); color: var(--bk-success); }
body .badge-danger, body .label-danger { background: var(--bk-danger-bg); color: var(--bk-danger); }
body .badge-warning, body .label-warning { background: var(--bk-warning-bg); color: var(--bk-warning); }
body .badge-warning font, body .badge-warning font[color] { color: var(--bk-warning) !important; }
body .badge-info { background: var(--bk-info-bg); color: var(--bk-info); }
body .badge-counter { position: absolute; transform: scale(.85); transform-origin: top right; margin-top: -.25rem; }

body .alert {
	border-radius: 16px; border: 1px solid var(--bk-border); background: var(--bk-surface);
	color: var(--bk-text-2); padding: 14px 18px;
}
body .alert a { text-decoration: underline; text-underline-offset: 3px; }
body .alert-info { background: var(--bk-info-bg); border-color: color-mix(in srgb, var(--bk-info) 25%, transparent); color: var(--bk-text-2); }
body .alert-success { background: var(--bk-success-bg); border-color: color-mix(in srgb, var(--bk-success) 25%, transparent); color: var(--bk-text-2); }
body .alert-warning { background: var(--bk-warning-bg); border-color: color-mix(in srgb, var(--bk-warning) 25%, transparent); color: var(--bk-text-2); }
body .alert-danger { background: var(--bk-danger-bg); border-color: color-mix(in srgb, var(--bk-danger) 25%, transparent); color: var(--bk-text-2); }

/* Табы -> «сегментированная» плашка */
body .nav-tabs, .bk-tabs {
	display: flex; flex-wrap: wrap; gap: 4px; padding: 6px; margin: 0;
	border: 1px solid var(--bk-border) !important; border-radius: 22px; background: var(--bk-surface);
}
body .nav-tabs .nav-item { margin: 0 !important; }
body .nav-tabs .nav-link, .bk-tabs a {
	display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 18px;
	border: 0 !important; border-radius: 16px !important; background: transparent;
	color: var(--bk-muted) !important; font-size: 13.5px; font-weight: 500; white-space: nowrap; line-height: 1;
}
body .nav-tabs .nav-link:hover, .bk-tabs a:hover { color: var(--bk-text) !important; background: var(--bk-hover); }
body .nav-tabs .nav-link.active, body .nav-tabs .nav-item.show .nav-link, .bk-tabs a.active {
	background: var(--bk-surface-2) !important; color: var(--bk-text) !important; font-weight: 600;
}
body .card-header .card-toolbar { margin: 0; }
body .card-header:has(.nav-tabs) { padding: 0; border: 0 !important; margin-bottom: 16px; }
body .card:has(> .card-header .nav-tabs) { background: transparent; border: 0; }
body .card:has(> .card-header .nav-tabs) > .card-body { padding: 0; }
body .tab-content { padding-top: 0; }

body .list-group-item { background: var(--bk-surface); border-color: var(--bk-border); color: var(--bk-text-2); }
body .list-group-item.active { background: var(--bk-surface-2); border-color: var(--bk-border-strong); color: var(--bk-text); }
body .progress { height: 8px; border-radius: 999px; background: var(--bk-surface-2); }
body .progress-bar { background: var(--bk-primary); border-radius: 999px; }
body .breadcrumb { background: transparent; padding: 0; }
body .close { color: var(--bk-muted); text-shadow: none; opacity: 1; font-weight: 300; }
body .close:hover { color: var(--bk-text); }
body code { color: var(--bk-text); background: var(--bk-surface-2); border: 1px solid var(--bk-border); padding: 2px 7px; border-radius: 8px; font-size: .9em; }
body pre { background: var(--bk-surface-2); border: 1px solid var(--bk-border); border-radius: 14px; color: var(--bk-text-2); padding: 14px; }
body blockquote { border-left: 2px solid var(--bk-border-strong); color: var(--bk-muted); padding-left: 14px; }
body img.img-profile { border: 1px solid var(--bk-border); }

/* ---------- Модальные окна ---------- */
body .modal-content {
	background: var(--bk-surface); border: 1px solid var(--bk-border-strong); border-radius: 24px;
	box-shadow: var(--bk-shadow); color: var(--bk-text);
}
body .modal-header, body .modal-footer { border-color: var(--bk-border); padding: 20px 24px; }
body .modal-body { padding: 24px; }
body .modal-title { font-size: 17px; font-weight: 650; }
body .modal-backdrop.show { opacity: .7; background: #000; }

/* Старые bootstrap-выпадающие списки (админка и пр.) */
body .dropdown-menu {
	background: var(--bk-surface); border: 1px solid var(--bk-border-strong); border-radius: 16px;
	padding: 8px; box-shadow: var(--bk-shadow); color: var(--bk-text-2);
}
body .dropdown-item { border-radius: 10px; padding: 9px 12px; color: var(--bk-text-2); font-weight: 500; font-size: 13.5px; }
body .dropdown-item:hover, body .dropdown-item:focus { background: var(--bk-hover); color: var(--bk-text); }
body .dropdown-divider { border-color: var(--bk-border); }
body .dropdown-header { color: var(--bk-muted); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
body .tooltip-inner { background: var(--bk-text); color: var(--bk-bg); border-radius: 8px; font-weight: 500; }

/* ==========================================================================
   Каталог
   ========================================================================== */
.bk-shop-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 20px; }
.bk-product {
	display: flex; flex-direction: column; overflow: hidden;
	background: var(--bk-surface) var(--bk-card-grad); border: 1px solid var(--bk-border); border-radius: 22px;
	transition: border-color .15s, transform .15s;
}
.bk-product:hover { border-color: var(--bk-border-strong); transform: translateY(-2px); }
.bk-product-media {
	position: relative; aspect-ratio: 16 / 9; overflow: hidden;
	background: var(--bk-surface-2); border-bottom: 1px solid var(--bk-border);
}
.bk-product-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease; }
.bk-product:hover .bk-product-media img { transform: scale(1.03); }
.bk-tag {
	position: absolute; top: 12px; height: 26px; padding: 0 11px; border-radius: 999px;
	display: inline-flex; align-items: center; gap: 6px;
	font-size: 12px; font-weight: 600; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
	background: rgba(10, 10, 12, .72); border: 1px solid rgba(255, 255, 255, .12); color: #fafafa;
}
.bk-tag.left { left: 12px; }
.bk-tag.right { right: 12px; font-weight: 500; color: #d4d4d8; }
.bk-product-body { display: flex; flex-direction: column; flex: 1; padding: 20px 20px 20px; }
.bk-product-title { margin: 0; font-size: 16px; font-weight: 650; letter-spacing: -0.015em; }
.bk-product-desc { margin: 8px 0 18px; color: var(--bk-muted); font-size: 13.5px; line-height: 1.5; min-height: 20px; }
.bk-product-desc * { color: inherit; }
.bk-product-foot { margin-top: auto; display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
.bk-price-old { display: block; font-size: 12px; color: var(--bk-faint); text-decoration: line-through; line-height: 1.2; }
.bk-price { font-size: 22px; font-weight: 700; letter-spacing: -0.03em; line-height: 1.2; }

/* ==========================================================================
   Профиль
   ========================================================================== */
.bk-profile { display: grid; grid-template-columns: 380px minmax(0, 1fr); gap: 20px; align-items: start; }
.bk-kv { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 9px 0; font-size: 14px; }
.bk-kv span { color: var(--bk-muted); }
.bk-kv b { font-weight: 600; text-align: right; word-break: break-all; }
.bk-card-title { margin: 0 0 14px; font-size: 12px; font-weight: 500; letter-spacing: .09em; text-transform: uppercase; color: var(--bk-muted); }
.bk-divider { height: 1px; background: var(--bk-border); margin: 16px 0; }
.bk-profile-avatar { display: flex; align-items: center; gap: 16px; margin-bottom: 8px; }
.bk-profile-avatar img { width: 72px; height: 72px; border-radius: 20px; object-fit: cover; }

/* ==========================================================================
   Подвал
   ========================================================================== */
.bk-footer { position: relative; z-index: 1; padding: 22px 24px 28px; text-align: center; color: var(--bk-faint); font-size: 12.5px; border-top: 1px solid var(--bk-border); }
body .scroll-to-top { background: var(--bk-surface-2); border: 1px solid var(--bk-border-strong); color: var(--bk-text); border-radius: 999px; width: 42px; height: 42px; line-height: 40px; }

/* ==========================================================================
   Адаптив
   ========================================================================== */
@media (max-width: 1100px) {
	.bk-profile { grid-template-columns: 1fr; }
}
@media (max-width: 991.98px) {
	.bk-sidebar {
		position: fixed; left: 0; top: 0; bottom: 0; transform: translateX(-102%);
		transition: transform .25s ease; box-shadow: var(--bk-shadow); background: var(--bk-bg);
	}
	body.bk-nav-open .bk-sidebar { transform: none; }
	body.bk-nav-open::after { content: ""; position: fixed; inset: 0; background: rgba(0, 0, 0, .6); z-index: 1035; }
	.bk-burger { display: inline-flex; }
	.bk-stats, .bk-actions { grid-template-columns: 1fr; }
	.bk-user-meta, .bk-user > .bk-i { display: none; }
	.bk-user { padding: 0 6px; }
}
@media (max-width: 640px) {
	.bk-topbar { padding: 0 14px; gap: 8px; }
	.bk-chip .lbl { display: none; }
	body .container-fluid { padding: 24px 14px 44px; }
	.bk-row-card { flex-wrap: wrap; }
	.bk-row-actions { width: 100%; justify-content: flex-start; }
	.bk-page-head h1, body .container-fluid > h1.h3 { font-size: 24px; }
	.bk-shop-grid { grid-template-columns: 1fr; }
	.bk-dd-menu { position: fixed; left: 12px; right: 12px; top: 76px; max-width: none; }
	.bk-dd-list { width: 100%; }
}

/* ==========================================================================
   Новости на главной
   ========================================================================== */
.bk-news { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.bk-news-card {
	display: flex; flex-direction: column; overflow: hidden;
	background: var(--bk-surface) var(--bk-card-grad); border: 1px solid var(--bk-border); border-radius: 22px;
	color: var(--bk-text) !important; transition: border-color .15s, transform .15s;
}
.bk-news-card:hover { border-color: var(--bk-border-strong); transform: translateY(-2px); opacity: 1 !important; }
.bk-news-img { aspect-ratio: 16 / 8; overflow: hidden; background: var(--bk-surface-2); border-bottom: 1px solid var(--bk-border); display: block; }
.bk-news-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bk-news-body { display: flex; flex-direction: column; gap: 6px; padding: 16px 18px 18px; }
.bk-news-body b { font-size: 15px; font-weight: 650; letter-spacing: -0.01em; }
.bk-news-date { font-size: 12px; color: var(--bk-faint); }
.bk-news-text { font-size: 13.5px; color: var(--bk-muted); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* ==========================================================================
   Страницы входа / регистрации / восстановления
   ========================================================================== */
body.bk-auth { min-height: 100vh; display: block; position: relative; }
body.bk-auth::before {
	content: ""; position: fixed; inset: 0; pointer-events: none;
	background-image: linear-gradient(var(--bk-grid) 1px, transparent 1px), linear-gradient(90deg, var(--bk-grid) 1px, transparent 1px);
	background-size: 56px 56px;
	-webkit-mask-image: radial-gradient(ellipse at 50% 0, #000, transparent 70%);
	mask-image: radial-gradient(ellipse at 50% 0, #000, transparent 70%);
}
body.bk-auth > * { position: relative; }
body.bk-auth .bk-auth-brand { justify-content: center; padding: 44px 0 0; }
body.bk-auth #content.container { max-width: 520px; padding: 0 16px 48px; }
body.bk-auth #content > .row { display: block; margin: 0; }
body.bk-auth #content > .row > .alert { margin: 24px 0 0 !important; font-size: 13.5px; }
body.bk-auth #content > .row > [class*="col-"] { max-width: 100%; flex: 0 0 100%; padding: 0; }
body.bk-auth .bg-login-image, body.bk-auth .bg-register-image, body.bk-auth .bg-password-image { display: none !important; }
body.bk-auth .card.o-hidden { margin: 20px 0 0 !important; border-radius: 26px; }
body.bk-auth .card-body > .row > [class*="col-lg-"] { flex: 0 0 100%; max-width: 100%; }
body.bk-auth .p-5 { padding: 34px 30px !important; }
body.bk-auth h1.h4 { font-size: 24px; font-weight: 700; color: var(--bk-text) !important; margin-bottom: 24px !important; }
body.bk-auth .form-control-user { height: 48px; border-radius: 14px; padding: 0 16px; font-size: 14px; }
body.bk-auth .btn-user { height: 48px; border-radius: 999px; font-size: 14.5px; }
body.bk-auth .text-center .small, body.bk-auth a.small { font-size: 13px; color: var(--bk-muted); display: inline-block; margin-top: 4px; }
body.bk-auth a.small:hover { color: var(--bk-text); opacity: 1; }
body.bk-auth .custom-control.small { font-size: 13px; }

/* ==========================================================================
   Совместимость: страницы со старыми inline-стилями (тикеты, комментарии, покупки)
   ========================================================================== */
body .container_messages {
	background: var(--bk-surface) !important; border: 1px solid var(--bk-border) !important;
	border-radius: 18px !important; padding: 14px !important; margin: 12px 0 !important; color: var(--bk-text-2);
}
body .container_messages.darker { background: var(--bk-surface-2) !important; border-color: var(--bk-border-strong) !important; }
body .container_messages img { border-radius: 12px !important; max-width: 48px !important; }
body .time-right, body .time-left { color: var(--bk-faint) !important; font-size: 12px; }
body .card-block, body .gifts-detail-comments { background: var(--bk-surface) !important; border: 1px solid var(--bk-border); border-radius: 22px; color: var(--bk-text-2); }
body .gifts-detail-comments .comment, body .comment-parent { border-color: var(--bk-border) !important; }
body .comment-text, body .comment-panel-title, body .comment-reply, body .comment-username .label { color: var(--bk-text-2) !important; }

/* старые карточки новостей (страница /news) */
body .news-card { border-radius: 22px !important; border: 1px solid var(--bk-border) !important; box-shadow: none !important; }
body .news-card__title, body .news-card__post-date, body .news-card__excerpt, body .news-card__read-more { color: #fafafa !important; }

/* fontawesome-иконки внутри старых страниц наследуют цвет */
body .fa, body .fas, body .far, body .fab { color: inherit; }

/* ===== Фиксы тем (светлая / тёмная) ===== */

/* старые админ-блоки (bootstrap 3 .panel / .content-box) были жёстко белыми */
body .content-box,
body section.panel,
body .panel,
body .panel-default,
body .panel-body,
body .panel-heading {
	background: var(--bk-surface) !important;
	color: var(--bk-text);
	border-color: var(--bk-border) !important;
}
body section.panel, body .panel { box-shadow: none; }
body .panel-heading { border-bottom: 1px solid var(--bk-border) !important; }
body .caption-subject, body .font-blue-madison, body .panel .bold { color: var(--bk-text) !important; }
body .content-box p, body .panel p { color: var(--bk-text-2); }
body .content-box h1, body .content-box h2, body .content-box h3, body .content-box h4, body .content-box h5,
body .panel h1, body .panel h2, body .panel h3, body .panel h4, body .panel h5 { color: var(--bk-text); }

/* DataTables: подписи «Show / entries» в одну строку */
body .dataTables_wrapper .dataTables_length label,
body .dataTables_wrapper .dataTables_filter label { display: inline-flex; align-items: center; gap: 6px; margin: 0; white-space: nowrap; }
body .dataTables_wrapper .dataTables_filter { text-align: right; }

/* маленькие кнопки в шапке страниц: текст по центру */
body .btn.btn-sm { padding: 8px 16px !important; line-height: 1.3 !important; height: auto; }
/* цветные заголовки карточек в админке — белый текст в обеих темах */
body .content-box .content-box-header, body .content-box h3.content-box-header { color: #fff !important; }

/* свёрнутое боковое меню на компьютере (кнопка-бургер): узкая полоска с иконками */
@media (min-width: 992px) {
	html.bk-collapsed .bk-sidebar { width: 76px; flex: 0 0 76px; padding: 20px 10px 16px; overflow-x: hidden; }
	html.bk-collapsed .bk-brand { justify-content: center; padding: 0 0 18px; }
	html.bk-collapsed .bk-brand-name { display: none; }
	html.bk-collapsed .bk-nav-label { height: 1px; margin: 14px 12px; padding: 0; font-size: 0; line-height: 0; overflow: hidden; background: var(--bk-border); }
	html.bk-collapsed .bk-nav a {
		position: relative; width: 44px; height: 44px; margin: 4px auto; padding: 0; gap: 0;
		justify-content: center; font-size: 0; line-height: 0;
	}
	html.bk-collapsed .bk-nav .bk-pill {
		position: absolute; top: 2px; right: 0; margin: 0; min-width: 16px; height: 16px; padding: 0 4px;
		font-size: 10px; line-height: 1;
	}
	html.bk-collapsed .bk-sidebar-foot { display: none; }
}
body .button1, body .button1.small { color: #fff !important; }