@include media-breakpoint-down(lg) {
	#panel {
		background: rgba(17, 14, 21, 0.98);
	}

	ul.categories-list,
	ul.westgate-categories-list {
		padding-left: 0;
	}

	li[component="categories/category"],
	li[component="category/topic"],
	li[component="post"] .post-container {
		padding: var(--wg-space-sm) !important;
	}

	li[component="categories/category"] h2.title {
		font-size: 1.1rem !important;
	}

	.category-children-item > div {
		width: 100%;
	}

	.topic-list-header > .card {
		align-items: stretch !important;
	}

	.topic-list-header [component="category/controls"] {
		width: 100%;
	}

	// keep the guest "Log in to post / reply" CTA on one line
	[component="category/post/guest"],
	[component="topic/reply/guest"] {
		white-space: nowrap;
	}
}

@include media-breakpoint-down(md) {
	.category-header {
		padding: var(--wg-space-sm);
	}

	li[component="post"] .content,
	li[component="post"] .content p,
	.topic-text,
	.post-content {
		font-size: 1rem;
		line-height: 1.58;
	}

	.bottombar-nav {
		box-shadow: 0 -8px 20px rgba(0, 0, 0, 0.28);
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}