@bg-body-dark: #000;
@bg-primary-dark: #0a0a0a;

@border-primry-dark: #272727;

@color-primary-dark: #ffffff;
@color-secondary-dark: #dadada;

@border-highlight: #171717;

html[dark="true"],
html[data-initial-dark="true"] {
	body {
		background-color: @bg-body-dark;
		color: @color-primary-dark;
	}

	a:not(.btn-default) {
		color: @color-primary-dark;
	}

	hr {
		border-top-color: @border-primry-dark;
	}

	.categories-title {
		color: @color-primary-dark;
	}

	.form-control,
	textarea,
	.input-group-addon,
	.input-group-btn .btn,
	.users-list-menu .btn,
	.btn-group-vertical .btn,
	.list-group .list-group-item,
	.nav-tabs .active a,
	.nav-tabs li a:hover,
	.pagination li:not(.active) > a {
		background-color: @bg-primary-dark;
		border-color: @border-primry-dark;
		color: @color-secondary-dark;
	}

	#blacklist-rules {
		border-color: @border-primry-dark !important;
	}

	.navbar-nav {
		.navigation-link::before {
			border-color: @color-secondary-dark !important;
		}

		.active a,
		.open > a,
		.open > label,
		.open > label:hover,
		.open > label:focus {
			color: @color-secondary-dark !important;
			background-color: @border-primry-dark !important;
		}
	}

	.navbar-default {
		background-color: @bg-primary-dark;
		border-color: transparent;

		.navbar-brand {
			color: @color-primary-dark;
		}

		.navbar-nav > li > a {
			color: @color-secondary-dark;
		}
	}

	.panel,
	.profile-card {
		background-color: @bg-body-dark;
		border-color: @border-primry-dark;

		&.panel-default {
			border-color: @border-primry-dark;
		}

		.data-item {
			border-bottom-color: @border-primry-dark;
		}

		.card-info {
			.fullname {
				color: @color-primary-dark !important;
			}

			.account-stats .stat {
				border-color: rgba(255, 255, 255, 0.2);
			}
		}

		.panel-heading,
		.card-title,
		.panel-footer {
			color: @color-primary-dark;
			background-color: @bg-primary-dark;
			border-color: @border-primry-dark;
		}
	}

	.modal-content {
		background-color: @bg-body-dark;
		border-color: @border-primry-dark;

		.modal-header,
		.modal-footer {
			border-color: @border-primry-dark;
		}

		.modal-header {
			background-color: @bg-primary-dark;

			.close {
				color: @color-primary-dark;
			}
		}
	}

	.category li:not(.unread) {
		.mobile-stat a,
		.title a {
			color: @color-secondary-dark;
		}
	}

	.category-details {
		background-color: @bg-primary-dark;
		border-color: @border-primry-dark;

		.show-separator {
			.description,
			.timeago {
				color: @color-secondary-dark !important;
			}
		}

		.show-separator,
		.category-children {
			border-color: @border-primry-dark !important;
		}

		.stats {
			color: @color-primary-dark !important;

			small {
				color: @color-secondary-dark !important;
			}
		}

		.box-footer {
			border-color: @border-primry-dark;
		}
	}

	.users {
		.joindate,
		.post-count,
		.reputation {
			color: @color-secondary-dark;
		}
	}

	.dropdown-menu {
		background-color: @bg-primary-dark;
		border-color: @border-primry-dark;

		.divider {
			background-color: @border-primry-dark;
		}

		.notif-action-buttons {
			border-color: @border-primry-dark;
		}
	}

	.topic,
	.posts,
	.posts-list {
		.topic-header {
			border-color: @border-primry-dark;

			.pin-item {
				background-color: @border-primry-dark !important;
			}
		}

		&::before,
		[component="post/replies"]::before {
			background-color: @border-primry-dark !important;
		}

		.postFlagged,
		[component="post"] {
			&.highlight > .content {
				box-shadow: 0 0 0 3px @border-highlight;

				&::before {
					-webkit-filter: drop-shadow(-0.25em 0 0 @border-highlight);
					filter: drop-shadow(-0.25em 0 0 @border-highlight);
				}
			}

			.content {
				background-color: @bg-body-dark;
				border-color: @border-primry-dark;

				&::before {
					border-right-color: @border-primry-dark;
				}

				&::after {
					border-right-color: @bg-primary-dark;
				}

				.post-author {
					background-color: @bg-primary-dark;
					border-color: @border-primry-dark;

					.permalink {
						color: @color-secondary-dark;
					}
				}

				.post-signature {
					border-color: @border-primry-dark;
				}
			}

			&:last-child,
			.post-footer [component="post/replies"] > li:last-child {
				background-color: @bg-body-dark;
			}

			.post-footer {
				.post-tools,
				.votes {
					a,
					span {
						color: @color-secondary-dark;
					}
				}
			}
		}
	}

	code,
	kbd,
	pre,
	samp {
		background-color: @border-primry-dark !important;
		color: @color-primary-dark !important;
	}

	.plugin-mentions-user,
	.account-fab button {
		background-color: @border-primry-dark !important;
	}

	[component="post/parent"] {
		color: @color-secondary-dark !important;
	}

	.post-bar .topic-main-buttons,
	[component="post/parent"],
	.oxide-usercard,
	.well {
		background-color: @bg-primary-dark;
		border-color: @border-primry-dark !important;
	}

	.quick-search-results {
		.quick-search-item {
			border-color: @border-primry-dark !important;

			a:hover {
				background-color: @border-primry-dark !important;
			}

			.quick-search-title,
			.quick-search-info {
				color: @color-primary-dark !important;
			}

			.quick-search-content {
				color: @color-secondary-dark !important;
			}
		}
	}

	.chat-content,
	[component="chat/nav-wrapper"] {
		background-color: @bg-body-dark;
		border-color: @border-primry-dark;
	}

	[component="chat/header"],
	.chat-search {
		background-color: @bg-primary-dark;
		border-color: @border-primry-dark;
	}

	[component="chat/nav-wrapper"] {
		.chat-search {
			background-color: @bg-primary-dark;
			border-color: @border-primry-dark;

			.search-input input {
				background-color: @bg-body-dark !important;
				color: @color-secondary-dark;

				&::before {
					color: @color-secondary-dark;
				}
			}
		}
	}

	[component="chat/recent/room"].bg-info {
		background-color: @border-highlight;
	}

	.chats-list .room-name,
	.expanded-chat .title {
		color: @color-primary-dark !important;
	}

	.expanded-chat .chat-menu .close {
		color: @color-secondary-dark;
		text-shadow: unset;
		opacity: unset;
	}

	.composer {
		background-color: @bg-primary-dark;

		.title {
			color: @color-primary-dark;
		}

		.formatting-group li {
			color: @color-secondary-dark;

			&:hover,
			&:focus {
				background-color: transparent !important;
				color: @color-primary-dark !important;
			}
		}

		.write,
		.preview {
			background-color: @bg-body-dark;
			border-color: @border-primry-dark !important;
		}

		.write:focus,
		.write:hover {
			box-shadow: 0 0 0 3px @border-highlight !important;
			border-color: @border-primry-dark !important;
		}
	}

	.emoji-dialog {
		background-color: @bg-primary-dark;
		border-color: @border-primry-dark;

		.top-bar {
			background-color: @bg-primary-dark;
		}

		.nav-tabs {
			border-color: @border-primry-dark;
		}
	}

	.tag {
		.tag-item::after {
			background-color: @bg-body-dark !important;
		}
	}

	.bootstrap-tagsinput {
		background-color: @bg-primary-dark;
		color: @color-secondary-dark;
		border-color: @border-primry-dark;
	}

	tbody > tr {
		&:not(:hover):nth-of-type(odd) {
			background-color: @bg-primary-dark;
		}

		&:hover {
			background-color: @border-primry-dark;
		}
	}

	.header {
		.notification-list {
			li:nth-child(even) {
				background-color: rgba(255, 255, 255, 0.03) !important;
			}

			li:nth-child(odd) {
				background-color: rgba(255, 255, 255, 0.06) !important;
			}
		}

		.notif-action-buttons a {
			background-color: @border-primry-dark;
		}
	}

	.notifications-list {
		li {
			border-color: @border-primry-dark;
			background-color: @bg-primary-dark;
		}
	}

	.cookie-consent {
		background-color: @bg-primary-dark !important;
		color: @color-secondary-dark;

		.btn-primary {
			color: @color-secondary-dark;
			background-color: @bg-primary-dark !important;
			border-color: @border-highlight !important;
		}
	}

	.categories,
	[component="category"],
	[component="category/topic"] {
		.permalink {
			border-top-color: @border-primry-dark !important;
		}

		.highlight .category-details {
			box-shadow: 0 0 0 3px @border-highlight !important;
			border-color: @border-primry-dark !important;
		}
	}
}
