/* --- Global Scrollbar Styling --- */

/* 1. Track (The background area) */
::-webkit-scrollbar {
	width: 12px;
	/* Vertical scrollbar width */
	height: 12px;
	/* Horizontal scrollbar height */
}

::-webkit-scrollbar-track {
	background: transparent;
	/* Keep it invisible to maintain the glass look */
}

/* 2. Thumb (The draggable part) */
::-webkit-scrollbar-thumb {
	background: var(--border-glass);
	/* Subtle white-transparent */
	backdrop-filter: blur(4px);
	border-radius: 10px;
	border: 10px solid transparent;
	/* Creates padding around the thumb */
	background-clip: content-box;
	/* Ensures the border acts as a gap */
	transition: background 0.3s ease;
}

/* 3. Hover State */
::-webkit-scrollbar-thumb:hover {
	background: var(--accent-primary);
	/* Indigo glow on hover */
	background-clip: content-box;
}

/* 4. Firefox Support (Modern standard) */
* {
	scrollbar-width: thin;
	scrollbar-color: var(--border-glass) transparent;
}