.ffz-channel-avatar {
	.tw-aspect {
		width: 4rem;
	}
}

.ffz-channel-avatar,
.ffz-flags-element,
.ffz-uptime-element {
	pointer-events: all;
}

// TODO: Color variables

.ffz-directory-toggle-thumbnail {
	background: #555 !important;

	&:hover { background: #247324 !important }
	&.active { background: #006700 !important }
}


.ffz-directory-toggle-block {
	background: #555 !important;

	&:hover { background: #a94444 !important }
	&.active { background: #973333 !important }
}


.ffz-hide-thumbnail a[data-a-target="preview-card-image-link"] {
	.ffz-aspect,
	.tw-aspect {
		img {
			filter: blur(2.5rem);
		}
	}
}

.ffz-uptime-element { order: 0; }
.ffz-flags-element { order: 1; }


.ffz-host-menu {
	.scrollable-area {
		max-height: 25vh;
	}

	.ffz-interactable {
		padding: .1rem 0;
	}

	.ffz-channel-avatar {
		width: 3rem;

		img {
			width: 3rem;
			height: 3rem;
		}
	}
}
