/* =============================================================== */
/*      CASHIVA DARK THEME - v5.0 (Unified Table Panel Design)     */
/* =============================================================== */

:root {
	--color-background: #121217;
	--color-text-primary: #EAEAEFd4;
	--color-accent: #8166d2;
	--color-accent-dark: #8166d2e6;
	--color-accent-light: #EAEAEF;
	--color-button-text: #FFFFFF;
	--color-card-background: #000000; /* Уровень 1: Панели */
	--color-header-bg: rgba(30, 30, 36, 0.85); /* Уровень 3: Шапка/Подвал */
	--border-color: #333333;
	--gradient-button: linear-gradient(135deg, var(--color-accent-dark), var(--color-accent));
}

body {
	--background-image: linear-gradient(135deg, #0d0d10 0%, #121217 50%, #1a1a21 100%);
	background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('img/6220196.jpg');
	background-attachment: fixed, fixed;
	--background-size: cover, cover;
	color: var(--color-text-primary);
	font-family: 'Inter', sans-serif;
}

	body::before {
		display: none !important;
	}

/* 2. Типографика и кнопки (без изменений) */
h1, h2, h3, h4, h5, h6 {
	font-family: 'Inter', sans-serif;
	color: var(--color-text-primary) !important;
}

section h2 {
	/* 1. Задаем фон в виде градиента с вашего основного сайта */
	background: linear-gradient(90deg, var(--color-accent-light) 0%, var(--color-accent-dark) 15%, var(--color-accent-dark) 100%);
	/* 2. Обрезаем фон по форме текста (ключевой момент) */
	-webkit-background-clip: text;
	-moz-background-clip: text;
	background-clip: text;
	/* 3. Делаем сам текст прозрачным, чтобы фон был виден */
	color: transparent !important;
	/* 4. Убираем любые тени, которые могут помешать */
	text-shadow: none;
}

a {
	color: var(--color-accent);
	text-decoration: none;
}

	a:hover {
		color: var(--color-accent-light);
	}

/* =============================================================== */
/*              ПРАВИЛЬНЫЕ СТИЛИ ДЛЯ РАЗНЫХ КНОПОК                  */
/* =============================================================== */

/* --- СТИЛЬ ДЛЯ ОСНОВНОЙ КНОПКИ (.btn-primary) --- */

/* ОБЫЧНОЕ состояние: залита градиентом */
.btn-primary {
	color: var(--color-button-text) !important;
	background: var(--gradient-button) !important;
	border: 1px solid transparent !important; /* Прозрачная рамка для стабильности */
	border-radius: 3px !important;
	transition: all .3s cubic-bezier(.4,0,.2,1) !important;
	transform: scale(1);
	box-shadow: 0 4px 15px rgba(129, 102, 210, 0.4) !important;
	will-change: transform;
}

	/* НАВЕДЕНИЕ: увеличение */
	.btn-primary:hover {
		opacity: 0.9;
		transform: scale(1.05);
	}

	/* НАЖАТИЕ: уменьшение и свечение */
	.btn-primary:active {
		transform: scale(0.95) !important;
		box-shadow: 0 0 20px rgba(234, 234, 239, 0.7) !important;
	}


/* --- СТИЛЬ ДЛЯ КОНТУРНОЙ КНОПКИ (.btn-outline-primary) --- */

/* ОБЫЧНОЕ состояние: прозрачный фон, фиолетовая рамка и текст */
.btn-outline-primary {
	color: var(--color-accent) !important;
	background: transparent !important;
	border: 1px solid var(--color-accent) !important;
	border-radius: 3px !important;
	transition: all .3s cubic-bezier(.4,0,.2,1) !important;
	transform: scale(1);
	box-shadow: none !important;
	will-change: transform, background, color;
}

	/* НАВЕДЕНИЕ: кнопка "заливается" цветом и увеличивается */
	.btn-outline-primary:hover {
		color: var(--color-button-text) !important;
		background: var(--gradient-button) !important;
		border-color: transparent !important;
		transform: scale(1.05);
	}

	/* НАЖАТИЕ: ведет себя так же, как и основная кнопка */
	.btn-outline-primary:active {
		transform: scale(0.95) !important;
		box-shadow: 0 0 20px rgba(234, 234, 239, 0.7) !important;
	}


/* 3. ОБНОВЛЕНИЕ: Дизайн таблицы как единой панели */

/* Создаем контейнер-панель для всей таблицы */
.table-responsive {
	background-color: var(--color-card-background); /* Самый темный цвет! */
	border-radius: 12px; /* Скругляем углы как у карточек */
	padding: 1.5rem; /* Внутренние отступы */
	border: 1px solid var(--border-color);
}

/* Делаем фон самой таблицы и ее частей ПРОЗРАЧНЫМ, чтобы был виден фон панели */
.table,
.table td,
.table thead th,
tr.token-header > td {
	background-color: transparent !important;
}

/* Стилизуем внутренние элементы */
.table {
	border: none; /* Убираем внешнюю рамку таблицы, она теперь на панели */
	color: var(--color-text-primary);
}

	.table thead th {
		color: var(--color-text-primary);
		border-bottom: 2px solid var(--border-color);
	}

	.table td, .table th {
		border-color: var(--border-color);
	}

.table-hover > tbody > tr:hover > * {
	background-color: #252525 !important;
	color: var(--color-text-primary);
}

/* Заголовки токенов внутри панели */
tr.token-header > td {
	color: var(--color-text-primary) !important;
	/* Добавляем верхнюю границу, чтобы отделить один токен от другого */
	border-top: 2px solid var(--border-color);
	border-bottom: 1px solid var(--border-color);
	padding-top: 1.5rem;
	padding-bottom: 1rem;
}
/* Убираем верхнюю границу у самого первого заголовка */
tbody tr.token-header:first-child > td {
	border-top: none;
}


/* Исправление читаемости для "muted" текста */
.table .text-muted, .table .text-secondary {
	color: rgba(234, 234, 239, 0.7) !important;
}


/* 4. Шапка, подвал и прочие компоненты (без изменений) */
header, .navbar, footer {
	background-color: var(--color-header-bg) !important;
	backdrop-filter: blur(10px);
	border-color: var(--border-color) !important;
}

.navbar {
	border-bottom-width: 1px !important;
}

footer {
	border-top-width: 1px !important;
}

.alert-warning {
	background-color: #332b00;
	color: #ffc107;
	border-color: #4d401a;
}

section.border-bottom {
	border-bottom: 1px solid var(--border-color) !important;
}