/* ============================================================
   glass.css — «Refined Glass» для разделов /adm/fin и /adm/budget
   Подключается секциями fin и budget (functions.php) и автономной
   страницей /adm/fin/tracker/, поэтому глобальные селекторы
   (body, .card, .modal-*, .btn-*) здесь безопасны.

   Шрифты идут с cdn.jsdelivr.net: fonts.googleapis.com запрещён
   политикой CSP (header.php + .htaccess).
   Outfit не имеет кириллицы — латиница и цифры рисуются им,
   кириллица подхватывается следующим в стеке Manrope.
   ============================================================ */

@import url('https://cdn.jsdelivr.net/npm/@fontsource/outfit@5/600.css');
@import url('https://cdn.jsdelivr.net/npm/@fontsource/manrope@5/600.css');
@import url('https://cdn.jsdelivr.net/npm/@fontsource/inter@5/400.css');
@import url('https://cdn.jsdelivr.net/npm/@fontsource/inter@5/500.css');
@import url('https://cdn.jsdelivr.net/npm/@fontsource/jetbrains-mono@5/400.css');
@import url('https://cdn.jsdelivr.net/npm/@fontsource/jetbrains-mono@5/700.css');

/* ===== Design tokens ===== */
:root {
	/* База */
	--g-bg: #050505;

	/* Стекло: градиент сверху вниз + размытие подложки */
	--g-glass: linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.02));
	--g-glass-soft: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.015));
	--g-blur: blur(35px) saturate(150%);

	/* Плоские заливки — для вложенных элементов, без размытия */
	--g-fill: rgba(255, 255, 255, 0.04);
	--g-fill-hi: rgba(255, 255, 255, 0.07);
	--g-fill-hover: rgba(255, 255, 255, 0.09);

	/* Границы и внутренний хайлайт */
	--g-border: rgba(255, 255, 255, 0.10);
	--g-border-hi: rgba(255, 255, 255, 0.18);
	--g-inner: inset 0 1px 0 rgba(255, 255, 255, 0.14);

	/* Текст */
	--g-text: #ffffff;
	--g-muted: #94a3b8;
	--g-faint: rgba(148, 163, 184, 0.65);

	/* Акценты */
	--g-blue: #3b82f6;
	--g-blue-hi: #60a5fa;
	--g-blue-soft: rgba(59, 130, 246, 0.15);
	--g-emerald: #10b981;
	--g-emerald-soft: rgba(16, 185, 129, 0.15);
	--g-rose: #f43f5e;
	--g-rose-soft: rgba(244, 63, 94, 0.15);

	/* Типографика */
	--g-fh: 'Outfit', 'Manrope', system-ui, sans-serif;
	--g-fb: 'Inter', system-ui, -apple-system, sans-serif;
	--g-fm: 'JetBrains Mono', ui-monospace, 'SF Mono', monospace;
	--g-track: -0.025em;

	/* Движение */
	--g-ease: cubic-bezier(0.16, 1, 0.3, 1);
	--g-dur: 0.3s;
	--g-dur-l: 0.5s;

	/* Радиусы */
	--g-r-card: 16px;
	--g-r-input: 10px;
	--g-r-pill: 999px;
}

/* ===== База и зерно =====
   Фон живёт на html, зерно — отдельным фиксированным слоем под
   контентом (z-index:-1), иначе шум сядет поверх текста. */
html {
	background-color: var(--g-bg);
}

body {
	background-color: transparent !important;
	color: var(--g-text);
	font-family: var(--g-fb);
	font-weight: 400;
}

body::before {
	content: '';
	position: fixed;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	opacity: 0.35;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}

/* ===== Примитив стекла ===== */
.g-glass {
	background: var(--g-glass);
	backdrop-filter: var(--g-blur);
	-webkit-backdrop-filter: var(--g-blur);
	border: 1px solid var(--g-border);
	box-shadow: var(--g-inner);
	border-radius: var(--g-r-card);
}

/* Без поддержки backdrop-filter стекло вырождается в плотную панель */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.g-glass,
	.card,
	.modal-content,
	#navbar,
	footer.bg-dark {
		background: rgba(20, 20, 22, 0.94);
	}
}

/* ===== Типографика ===== */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.modal-title,
.navbar-brand {
	font-family: var(--g-fh);
	font-weight: 600;
	letter-spacing: var(--g-track);
	color: var(--g-text);
}

/* Числовые значения: моноширинный с табличными цифрами,
   чтобы суммы не «прыгали» при пересчёте */
.g-num {
	font-family: var(--g-fm);
	font-variant-numeric: tabular-nums;
}

/* ===== Bootstrap: карточки ===== */
.card {
	background: var(--g-glass);
	backdrop-filter: var(--g-blur);
	-webkit-backdrop-filter: var(--g-blur);
	border: 1px solid var(--g-border);
	box-shadow: var(--g-inner);
	border-radius: var(--g-r-card);
	color: var(--g-text);
}

/* ===== Bootstrap: формы ===== */
.form-control,
.form-select {
	background-color: var(--g-fill);
	color: var(--g-text);
	border-color: var(--g-border);
	border-radius: var(--g-r-input);
	transition: background-color var(--g-dur) var(--g-ease),
		border-color var(--g-dur) var(--g-ease),
		box-shadow var(--g-dur) var(--g-ease);
}

.form-control::placeholder {
	color: var(--g-faint);
}

.form-control:focus,
.form-select:focus {
	background-color: var(--g-fill-hi);
	color: var(--g-text);
	border-color: var(--g-blue);
	box-shadow: 0 0 0 3px var(--g-blue-soft);
}

.form-check-input {
	background-color: var(--g-fill);
	border-color: var(--g-border-hi);
}

.form-check-input:checked {
	background-color: var(--g-blue);
	border-color: var(--g-blue);
}

.form-check-input:focus {
	border-color: var(--g-blue);
	box-shadow: 0 0 0 3px var(--g-blue-soft);
}

.form-label,
label {
	color: var(--g-muted);
	font-weight: 500;
}

/* ===== Bootstrap: кнопки ===== */
.btn {
	font-family: var(--g-fb);
	font-weight: 500;
	border-radius: var(--g-r-input);
	transition: background-color var(--g-dur) var(--g-ease),
		border-color var(--g-dur) var(--g-ease),
		color var(--g-dur) var(--g-ease),
		transform var(--g-dur) var(--g-ease);
}

.btn:active {
	transform: scale(0.97);
}

/* Акцентная (единственная primary) кнопка раздела.
   Живёт здесь, а не в fin.css: нужна и автономной странице трекера. */
.fin-btn-accent {
	background-color: var(--g-blue);
	border-color: var(--g-blue);
	color: #ffffff;
	font-weight: 500;
}

.fin-btn-accent:hover,
.fin-btn-accent:focus {
	background-color: var(--g-blue-hi);
	border-color: var(--g-blue-hi);
	color: #ffffff;
}

.btn-close-white {
	filter: none;
	opacity: 0.6;
	transition: opacity var(--g-dur) var(--g-ease);
}

.btn-close-white:hover {
	opacity: 1;
}

/* ===== Bootstrap: дропдауны ===== */
.dropdown-menu {
	background: var(--g-glass);
	backdrop-filter: var(--g-blur);
	-webkit-backdrop-filter: var(--g-blur);
	border: 1px solid var(--g-border);
	box-shadow: var(--g-inner);
	border-radius: var(--g-r-card);
	color: var(--g-text);
}

.dropdown-item {
	color: var(--g-text);
	transition: background-color var(--g-dur) var(--g-ease);
}

.dropdown-item:hover,
.dropdown-item:focus {
	background-color: var(--g-fill-hi);
	color: var(--g-text);
}

.dropdown-header {
	color: var(--g-muted);
	font-family: var(--g-fh);
	letter-spacing: var(--g-track);
}

.dropdown-divider {
	border-color: var(--g-border);
}

/* ===== Bootstrap: алерты ===== */
.alert {
	border-radius: var(--g-r-input);
	border-width: 1px;
}

.alert-success {
	background-color: var(--g-emerald-soft);
	border-color: rgba(16, 185, 129, 0.35);
	color: var(--g-emerald);
}

.alert-danger {
	background-color: var(--g-rose-soft);
	border-color: rgba(244, 63, 94, 0.35);
	color: var(--g-rose);
}

/* ===== Navbar и футер (только на страницах fin) ===== */
#navbar.bg-dark {
	background: rgba(255, 255, 255, 0.04) !important;
	backdrop-filter: var(--g-blur);
	-webkit-backdrop-filter: var(--g-blur);
	border-bottom: 1px solid var(--g-border);
	box-shadow: var(--g-inner);
}

#navbar .nav-link {
	color: var(--g-muted);
	transition: color var(--g-dur) var(--g-ease);
}

#navbar .nav-link:hover,
#navbar .nav-link.show {
	color: var(--g-text);
}

footer.bg-dark {
	background: rgba(255, 255, 255, 0.03) !important;
	backdrop-filter: var(--g-blur);
	-webkit-backdrop-filter: var(--g-blur);
	border-top: 1px solid var(--g-border);
	color: var(--g-muted) !important;
}

footer.bg-dark .link-light {
	color: var(--g-muted) !important;
	transition: color var(--g-dur) var(--g-ease);
}

footer.bg-dark .link-light:hover {
	color: var(--g-text) !important;
}

/* ===== Скроллбар ===== */
::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

::-webkit-scrollbar-track {
	background: transparent;
}

::-webkit-scrollbar-thumb {
	background: rgba(255, 255, 255, 0.12);
	border-radius: var(--g-r-pill);
}

::-webkit-scrollbar-thumb:hover {
	background: rgba(255, 255, 255, 0.2);
}

/* ===== Движение ===== */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}
}