//
// --------------------------------------------------------------
// Colours and backgrounds for common.css
// --------------------------------------------------------------

html, body {
	color: $text-color;
	background-image: url('./images/pattern.png');
	@if $use-wrapper {
		background-color: $page-background;
		&.simple {
			background-color: $content-background;
		}
	}
	@else {
		background-color: $content-background;
	}
}

h1, p.sitename {
	color: $header-text;
}

h2 {
	color: $page-title-color;
}

h3 {
	color: $stats-title-color;
	.post & {
		color: $block-title-color;
	}
	a {
		color: inherit;
		&:hover {
			color: $link-hover-color;
		}
	}
}

hr {
	border-color: $content-top-border;
	border-top-color: $content-bottom-border;
}

/* Post body links */
.postlink {
	border-bottom-color: $link-color;
	color: $link-color;
}

.postlink:visited {
	border-bottom-color: $muted-color;
	color: $muted-color;
}

.postlink:hover {
	background-color: darken($block-background, 10%);
	color: $link-hover-color;
}

.signature a, .signature a:hover {
	background-color: transparent;
}

// Search box
// ---------------------------------------------

.search-box .inputbox,
.search-box .inputbox:hover,
.search-box .inputbox:focus,
.search-box .button:hover {
	border-color: $search-box-border;
}

.search-box .button {
	&, &:hover {
		background-color: $block-background !important;
		border-color: $search-box-border !important;
	}
	&, &:before, &:after {
		color: $primary-color;
	}
	&:hover, &:hover:before, &:hover:after {
		color: $secondary-color !important;
	}
}

.search-header {
	box-shadow: $search-box-shadow;
	.navbar.with-search & {
		box-shadow: none;
	}
	.inputbox, .button {
		background: $block-background !important;
		border-color: $block-background !important;
	}
	.navbar.with-search & .button {
		&, &:before, &:after {
			color: $link-color;
		}
	}
	.inputbox:hover, .inputbox:focus {
		background-color: $block-background3 !important;
		color: $bold-text-color !important;
		border-color: $block-background !important;
	}
	.button:hover, .button:focus {
		&, &:before, &:after {
			background-color: $secondary-color !important;
			color: #fff !important;
			border-color: $secondary-color !important;
		}
	}
}

// Round cornered boxes and backgrounds
// ----------------------------------------
#wrap {
	@if $use-wrapper {
		background-color: $content-background;
		background-image: url('./images/pattern.png');
		border-color: $content-border-color;
	}
}

.headerbar {
	color: $header-text;
}

// Navigation
.breadcrumbs .crumb:before {
	color: $muted-color;
}

.navbar {
	background-image: none;
	&.secondary {
		color: $link-color;
		> ul > li:hover,
		> ul > li.dropdown-visible {
			&, &:after, &:before {
				color: $secondary-nav-hover-link;
			}
		}
		.dropdown {
			color: $text-color;
		}
	}

	.nav-tabs {
		background-color: $primary-nav-bg;

		.tab {
			color: $primary-nav-color;
			&.selected {
				color: $primary-nav-selected-color;
				background-color: $primary-nav-selected-bg;
			}
			&:hover,
			&.dropdown-visible {
				color: $primary-nav-hover-color;
				background-color: $primary-nav-hover-bg;
			}
			& > strong {
				color: $primary-nav-alert-color;
				background-color: $primary-nav-alert-bg;
				box-shadow: $primary-nav-alert-shadow;
				.arrow {
					border-top-color: $primary-nav-alert-bg;
				}
			}
			.dropdown {
				color: $text-color;
			}
		}
	}

	// Tabbed navigation
	@if $tabbed-navigation {
		&.tabbed.not-static {
			.nav-tabs {
				li.tab {
					// Tabs layout
					color: $link-color;
					background-color: $block-background;

					&.selected {
						@include tabbed-nav-layout-all {
							background-color: $primary-color;
							color: $overlay-color;
						}
					}

					&:hover {
						@include tabbed-nav-layout-all {
							background-color: $secondary-color;
							color: $overlay-color;
						}
					}

					&.dropdown-visible {
						@include tabbed-nav-layout-all {
							background-color: $primary-color;
							color: $overlay-color;
						}
					}
				}
			}

			// Second row
			+ .navbar.secondary {
				background: $primary-color;
				color: $overlay-color;

				> ul > li {
					&, &:after, &:before {
						color: $overlay-color;
					}
				}

				> ul > li:hover,
				> ul > li.dropdown-visible {
					&, &:after, &:before {
						color: $overlay-color;
					}
					background: none;
					box-shadow: none;
					filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
				}
			}
		}
	}
}

.panel {
	background-color: $block-background;
	color: $text-color;
}

.post:target .content {
	color: $bold-text-color;
}

.post:target h3 a {
	color: $bold-text-color;
}

.bg1 {
	background-color: $block-background;
}

table.zebra-list tr:nth-child(odd) td, ul.zebra-list li:nth-child(odd) {
	background-color: $block-background;
}

.bg2 {
	background-color: $block-background2;
}

table.zebra-list tr:nth-child(even) td, ul.zebra-list li:nth-child(even) {
	background-color: $block-background2;
}

.bg3 { 
	background-color: $block-background3;
	&.panel {
		background: transparent none;
		background-color: rgba($content-background, .3);
		border-top-color: $tab-selected-background;
		&:before, &:after {
			background: -webkit-linear-gradient(to bottom, $tab-selected-background 0%, rgba($tab-selected-background, 0) 100%);
			background: linear-gradient(to bottom, $tab-selected-background 0%, rgba($tab-selected-background, 0) 100%);
		}
	}
	.section-posting &.panel {
		background-color: $block-background;
		&:before, &:after {
			background: transparent;
		}
	}
}

// Horizontal lists
// ----------------------------------------

ul.navlinks {
	border-top-color: $block-inner-border;
}

// Forums list layout
// ----------------------
.forumtitle {
	.forum_unread &,
	.forum_unread_subforum &,
	.forum_unread_locked & {
		color: $link-hover-color;
	}
}

.topictitle {
	.global_unread &,
	.global_unread_mine &,
	.global_unread_locked &,
	.global_unread_locked_mine &,
	.announce_unread &,
	.announce_unread_mine &,
	.announce_unread_locked &,
	.announce_unread_locked_mine &,
	.sticky_unread &,
	.sticky_unread_mine &,
	.sticky_unread_locked &,
	.sticky_unread_locked_mine &,
	.topic_unread &,
	.topic_unread_mine &,
	.topic_unread_locked &,
	.topic_unread_locked_mine &,
	.topic_unread_hot &,
	.topic_unread_hot_mine &
	{
		color: $link-hover-color;
	}
}

.forum-statistics {
	color: $muted-color;
}

.forum-lastpost {
	color: $muted-color;
	span:before {
		opacity: .5;
	}
}

.forum-description.toggle {
	color: $forum-description-color;
	background-color: fade-out($forum-description-bg, .2);
	a {
		color: inherit !important;
	}
	span.arrow {
		border-right-color: fade-out($forum-description-bg, .2);
	}
	.rtl & span.arrow {
		border-right-color: transparent;
		border-left-color: fade-out($forum-description-bg, .2);
	}
}

.forum-statistics {
	.value {
		color: $bold-text-color;
	}
}

// Table styles
// ----------------------------------------
table.table1 thead th {
	color: $heading-color;
}

table.table1 tbody tr {
	border-color: $block-inner-border;
}

table.table1 tbody tr:hover, table.table1 tbody tr.hover {
	background-color: $block-background3;
	color: $bold-text-color;
}

table.table1 td {
	color: $text-color;
}

table.table1 tbody td {
	border-top-color: $block-inner-border;
}

table.table1 tbody th {
	border-bottom-color: $block-bottom-border;
	color: $bold-text-color;
	background-color: $content-background;
}

table.info tbody th {
	color: $bold-text-color;
}

// Misc layout styles
// ----------------------------------------
dl.details dt {
	color: $bold-text-color;
}

dl.details dd {
	color: $tab-color;
}

.sep {
	color: $primary-color;
}

/* Icon styles
---------------------------------------- */
.icon.icon-blue, a:hover .icon.icon-blue {
	color: #196db5;
}

.icon.icon-green, a:hover .icon.icon-green{
	color: #1b9A1B;
}

.icon.icon-red, a:hover .icon.icon-red{
	color: #BC2A4D;
}

.icon.icon-orange, a:hover .icon.icon-orange{
	color: #FF6600;
}

.icon.icon-bluegray, a:hover .icon.icon-bluegray{
	color: #536482;
}

.icon.icon-gray, a:hover .icon.icon-gray{
	color: #777777;
}

.icon.icon-lightgray, a:hover .icon.icon-lightgray{
	color: #999999;
}

.icon.icon-black, a:hover .icon.icon-black{
	color: #333333;
}

.alert_close .icon:before {
	background-color: #FFFFFF;
}

/* Jumpbox */
.jumpbox .dropdown li {
	border-top-color: $dropdown-heading-top;
}

.jumpbox-cat-link {
	background-color: $dropdown-heading-top;
	color: $dropdown-heading-color;
}

.jumpbox-cat-link:hover {
	background-color: $secondary-color;
	border-top-color: $secondary-color;
	color: $dropdown-heading-link-hover-color;
}

.jumpbox-forum-link {
	background-color: $dropdown-bg;
}

.jumpbox-forum-link:hover {
	background-color: $content-background;
}

.jumpbox .dropdown .pointer-inner {
	border-color: $dropdown-bg transparent;
}

.jumpbox-sub-link {
	background-color: $dropdown-bg;
}

.jumpbox-sub-link:hover {
	background-color: $content-background;
}



// Pagination
// ----------------------------------------

.pagination li a {
	color: $link-color;
	background-color: $block-background;
	border-color: $block-inner-border;
}

.pagination li.ellipsis span {
	background-color: transparent;
	color: $bold-text-color;
}

.pagination li.active span {
	color: $overlay-color;
	background-color: $primary-color;
	border-color: $primary-color;
}

.pagination li a:hover, .pagination .dropdown-visible a.dropdown-trigger, .nojs .pagination .dropdown-container:hover a.dropdown-trigger {
	border-color: $link-hover-color;
	background-color: $link-hover-color;
	color: $overlay-color;
}

.pagination li.page-jump a:after {
	color: $link-color;
}

.pagination li.page-jump a:hover:after {
	color: $link-hover-color;
}

// Miscellaneous styles
// ----------------------------------------

.copyright {
	color: $muted-color;
}

.error {
	color: $secondary-color;
}

.reported {
	background-color: $block-background-reported;
	.postprofile, .signature {
		border-color: darken($block-background-reported, 3%);
	}
}

li.reported:hover {
	background-color: $block-background-reported;
}
.sticky, .announce {
	// you can add a background for stickies and announcements
}

div.rules {
	background-color: mix($content-background, $rules-color, 85%);
	color: $rules-color;
}

p.post-notice {
	background-color: mix($block-background, $rules-color, 85%);
	color: $rules-color;
	background-image: none;
}

// Blank FontAwesome replacement
%post-notice {
	font-family: FontAwesome;
}

p.post-notice.deleted:before {
	@extend %post-notice;
	content: '\f057';	// fa-times-circle
	color: $secondary-color;
}

p.post-notice.unapproved:before {
	@extend %post-notice;
	content: '\f059';	// fa-question-circle
	color: $secondary-color;
}

p.post-notice.reported:before, p.post-notice.error:before {
	@extend %post-notice;
	content: '\f071';	// fa-warning
	color: $secondary-color;
}

// Topic status
.topic-status.sticky {
	color: $muted-color;
}

//
// --------------------------------------------------------------
// Colours and backgrounds for links.css
// --------------------------------------------------------------

a { color: $link-color; }
a:hover	{ color: $link-hover-color; }

a.time { 
	color: $faint-color; 
	&:hover {
		color: $link-hover-color;
	}
}

// Links on gradient backgrounds
.forumbg .header a, .forabg .header a, th a {
	color: $heading-link;
}

.forumbg .header a:hover, .forabg .header a:hover, th a:hover {
	color: $heading-link-hover;
}

// Notification mark read link
.dropdown-extended a.mark_read {
	background-color: $dropdown-bg;
}

// Back to top of page
a.top, a.top2 {
	color: $muted-color;
	&:hover {
		color: $link-hover-color;
	}
}

// Arrow links
a.arrow-left:hover {
}

a.arrow-right:hover {
}

a.feed-icon-forum:after {
	color: mix($muted-color, $block-background, 50%);
}

a.feed-icon-forum:hover:after {
	color: $link-hover-color;
}

//
// --------------------------------------------------------------
// Colours and backgrounds for content.css
// --------------------------------------------------------------

ul.forums {
}

ul.topiclist li {
	color: $text-color;
	@if $split-forums == false {
		.forabg &, .forumbg & {
			background: transparent;
		}
	}
}

ul.topiclist li.row dt a.subforum.read {
	@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 1.5dppx)	{
		background-size: 11px 9px;
	}
}

ul.topiclist li.row dt a.subforum.unread {
	@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 1.5dppx)	{
		background-size: 11px 9px;
	}
}

li.row {
	border-top-color: $block-top-border;
	border-bottom-color: $block-bottom-border;
	.forum-lastpost strong,
	.subforums-list strong {
		color: $muted-color;
	}
}

li.row strong {
	color: $bold-text-color;
}

li.row:hover {
}

li.row:hover dd {
}

// Unread forum/topic
.icon-link + .list-inner > a.forumtitle,
.pm_unread .topictitle,
a.subforum.unread {
	color: $secondary-color;
}

// Post body styles
// ----------------------------------------
.postbody {
	color: $post-text-color;
}

// Content container styles
// ----------------------------------------
.content {
	color: $post-text-color;
}

.content h2, .panel h2 {
	color: $panel-title-color;
	border-bottom-color:  $panel-title-border;
}

dl.faq dt {
	color: $post-text-color;
}

.posthilit {
	background-color: $block-background-reported;
	color: if($light, darken($secondary-color, 10%), lighten($secondary-color, 10%));
}

.announce, .unreadpost {
	// Highlight the announcements & unread posts box
}

// Post signature
.signature {
	border-top-color: $block-inner-border;
}

// Post noticies
.notice {
	border-top-color:  $block-inner-border;
}

// BB Code styles
// ----------------------------------------
// Quote block
blockquote {
	background-color: $bbcode-background;
	border-color: $bbcode-outer-border;
	border-left-color: lighten($secondary-color, 15%);
	.rtl & {
		border-left-color: $bbcode-outer-border;
		border-right-color: lighten($secondary-color, 15%);
	}
}

blockquote blockquote,
blockquote .codebox,
blockquote .attachbox {
	// Nested quotes
	background-color: $bbcode-background2;
	background-color: rgba(196, 196, 196, 0.1);
	border-left-color: lighten(desaturate($primary-color, 20%), 20%);
	.rtl & {
		border-left-color: $bbcode-outer-border;
		border-right-color: lighten(desaturate($primary-color, 20%), 20%);
	}
}

blockquote blockquote blockquote,
blockquote blockquote .codebox,
blockquote blockquote .attachbox {
	// Nested quotes
	background-color: $bbcode-background;
	border-left-color: lighten($secondary-color, 15%);
	.rtl & {
		border-left-color: $bbcode-outer-border;
		border-right-color: lighten($secondary-color, 15%);
	}
}

blockquote:before {
	color: $muted-color;
}

// Code block
.codebox {
	background-color: $bbcode-background;
	border-color: $bbcode-outer-border;
	border-left-color: lighten(desaturate($primary-color, 20%), 20%);
	.rtl & {
		border-left-color: $bbcode-outer-border;
		border-right-color: lighten(desaturate($primary-color, 20%), 20%);
	}
}

.codebox p {
	border-bottom-color:  $bbcode-inner-border;
}

.codebox code {
	color: $bbcode-code-color;
}

// Attachments
// ----------------------------------------
.attachbox {
	background-color: $bbcode-background;
	border-color:  $bbcode-outer-border;
	border-left-color: lighten(desaturate($primary-color, 20%), 20%);
	.rtl & {
		border-left-color: $bbcode-outer-border;
		border-right-color: lighten(desaturate($primary-color, 20%), 20%);
	}
}

.attachbox dd {
	border-top-color: $bbcode-inner-border;
}

.attachbox p {
	color: $bbcode-heading-text;
}

.attachbox p.stats {
	color: $bbcode-heading-text;
}

// Inline image thumbnails

dl.file dd {
	color: $bbcode-heading-text;
}

dl.thumbnail img {
	border-color: $bbcode-inner-border;
	background-color: $block-background;
}

dl.thumbnail dd {
	color: $bbcode-heading-text;
}

// Post poll styles
// ----------------------------------------

fieldset.polls dl {
	border-top-color: $block-top-border;
	border-bottom-color: $block-bottom-border;
	color: $text-color;
}

fieldset.polls dl.voted {
	color: $bold-text-color;
}

fieldset.polls dd div {
	color: $overlay-color;
}

%pollbar {
	box-shadow: 0 5px 5px -5px rgba(0, 0, 0, 0.2);
}

.pollbar1 {
	@extend %pollbar;
	background-color: desaturate($secondary-color, 30%);
}

.pollbar2 {
	@extend %pollbar;
	background-color: desaturate($secondary-color, 25%);
}

.pollbar3 {
	@extend %pollbar;
	background-color: desaturate($secondary-color, 20%);
}

.pollbar4 {
	@extend %pollbar;
	background-color: desaturate($secondary-color, 10%);
}

.pollbar5 {
	@extend %pollbar;
	background-color: $secondary-color;
}

// Poster profile block
// ----------------------------------------
.postprofile {
	color: $text-color;
	border-color: $block-inner-border;
}

.postprofile strong {
	color: $bold-text-color;
}

.online-ribbon span {
	background-color: $secondary-color;
	color: #fff;
}

dd.profile-warnings {
	color: #BC2A4D;
}

.no-avatar .avatar-container {
	background-image: url("./images/no_avatar.png");
	@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 1.5dppx) {
		background-image: url("./images/no_avatar_hd.png");
	}
}

.postbody .content::-webkit-scrollbar, #topicreview::-webkit-scrollbar, #post_details::-webkit-scrollbar, .codebox code::-webkit-scrollbar, .attachbox dd::-webkit-scrollbar, .attach-image::-webkit-scrollbar, .dropdown-extended ul::-webkit-scrollbar {
	background: rgba(0, 0, 0, .1);
}

.postbody .content::-webkit-scrollbar-thumb, #topicreview::-webkit-scrollbar-thumb, #post_details::-webkit-scrollbar-thumb, .codebox code::-webkit-scrollbar-thumb, .attachbox dd::-webkit-scrollbar-thumb, .attach-image::-webkit-scrollbar-thumb, .dropdown-extended ul::-webkit-scrollbar-thumb {
	background: rgba(0, 0, 0, .3);
}

//
// --------------------------------------------------------------
// Colours and backgrounds for buttons.css
// --------------------------------------------------------------
.button {
	&, .buttons > &.locked-icon {
		border-color: $button-border;
		background-color: $button-bg;
		color: $button-text;
		box-shadow: none;
	}


	&:after, &:before {
	}
	.buttons > &.locked-icon {
		color: $button-icon;
		&:after, &:before {
			color: $button-icon !important;
		}
		&:hover {
			box-shadow: none;
		}
	}

	& > strong {
	}

	.buttons > &, &.report-icon, &.delete-icon {
		border-color: $primary-color;
		background-color: $primary-color;
		color: $overlay-color;

		&:after, &:before {
			color: mix($overlay-color, $primary-color, 85%) !important;
		}

		& > strong {
		}
	}
	&.report-icon, &.delete-icon {
		border-color: $secondary-color;
		background-color: $secondary-color;

		&:after, &:before {
			color: mix($overlay-color, $secondary-color, 85%) !important;
		}
	}
}

.dropdown-select {
	.buttons > & {
		color: $muted-color;
	}
}

.dropdown-select:after { 
	border-color: mix($button-bg, $content-background, 60%);
}
.dropdown-select:hover	{ 
	border-color: $button-border; 
}

.dropdown-select:hover:after, .dropdown-visible .dropdown-select:after, .nojs .dropdown-container:hover .dropdown-select:after	{ 
	border-color: mix($secondary-color, $content-background, 90%);
}

.dropdown-visible .dropdown-select, .dropdown-visible .dropdown-select:hover, .nojs .dropdown-container:hover .dropdown-select,
.buttons > .button:hover,
.button:hover, .dropdown-visible .dropdown-select, .nojs .dropdown-container:hover .dropdown-select {
	border-color: $secondary-color !important;
	background-color: $secondary-color;
	color: $overlay-color;

	&:after, &:before {
		color: $overlay-color !important;
	}
}

.contact-icons a		{ border-color: $block-inner-border; }

// Small icons
%icon-button {
	color: $button-icon;
	&:hover {
		color: $button-icon-hover;
	}
}

%icon-button-visible {
	.dropdown-visible &,
	.nojs .dropdown-container:hover & {
		color: $button-icon-hover;
	}
}

.jabber-icon:after {
	color: #c90000;
}

.phpbb_icq-icon:after {
	color: #60ff00;
	text-shadow: 0 0 1px #000, 0 0 2px #000;
}

.phpbb_wlm-icon:after {
	color: #75afd3;
}

.phpbb_aol-icon:after {
	color: #ffd800;
	text-shadow: 0 0 1px #000, 0 0 2px #000;
}

// Icon images
// ----------------------------------------
%icon-image {
	&:after {
		color: $link-color;
	}
	&:hover:after {
		color: $link-hover-color;
	}
}

%icon-search-new {
	&:after {
		color: $secondary-color;
	}
}

%icon-search-misc {
	&:after {
		color: $faint-color;
	}
}

.icon-home {
	&.breadcrumbs:after {
		color: $link-color;
	}
}

.icon-notification, .icon-pm {
	&.non-zero:after {
		color: $secondary-color;
	}
}

.icon-time {
	&:after {
		color: $faint-color;
	}
}

/* Profile & navigation icons */
.pm-icon							{ background-position: 0 0; }
.email-icon							{ background-position: -21px 0; }
.jabber-icon						{ background-position: -80px 0; }
.phpbb_icq-icon						{ background-position: -61px 0 ; }
.phpbb_wlm-icon						{ background-position: -182px 0; }
.phpbb_aol-icon						{ background-position: -244px 0; }
.phpbb_website-icon					{ background-position: -40px 0; }
.phpbb_youtube-icon					{ background-position: -98px 0; }
.phpbb_facebook-icon				{ background-position: -119px 0; }
.phpbb_googleplus-icon				{ background-position: -140px 0; }
.phpbb_skype-icon					{ background-position: -161px 0; }
.phpbb_twitter-icon					{ background-position: -203px 0; }
.phpbb_yahoo-icon					{ background-position: -224px 0; }

// Forum icons & Topic icons
.global_read													{ background-image: url("./images/announce_read.png"); }
.global_read_mine												{ @extend .global_read; }
.global_read_locked												{ background-image: url("./images/announce_read_locked.png"); }
.global_read_locked_mine										{ @extend .global_read_locked; }
.global_unread													{ background-image: url("./images/announce_unread.png"); }
.global_unread_mine												{ @extend .global_unread; }
.global_unread_locked											{ background-image: url("./images/announce_unread_locked.png"); }
.global_unread_locked_mine										{ @extend .global_unread_locked; }

.announce_read													{ @extend .global_read; }
.announce_read_mine												{ @extend .global_read_mine; }
.announce_read_locked											{ @extend .global_read_locked; }
.announce_read_locked_mine										{ @extend .global_read_locked_mine; }
.announce_unread												{ @extend .global_unread; }
.announce_unread_mine											{ @extend .global_unread_mine; }
.announce_unread_locked											{ @extend .global_unread_locked; }
.announce_unread_locked_mine									{ @extend .global_unread_locked_mine; }

.forum_link														{ background-image: url("./images/forum_link.png"); }
.forum_read														{ background-image: url("./images/forum_read.png"); }
.forum_read_locked												{ background-image: url("./images/forum_read_locked.png"); }
.forum_read_subforum											{ background-image: url("./images/forum_read_subforum.png"); }
.forum_unread													{ background-image: url("./images/forum_unread.png"); }
.forum_unread_locked											{ background-image: url("./images/forum_unread_locked.png"); }
.forum_unread_subforum											{ background-image: url("./images/forum_unread_subforum.png"); }

.sticky_read													{ @extend .topic_read; }
.sticky_read_mine												{ @extend .topic_read_mine; }
.sticky_read_locked												{ @extend .topic_read_locked; }
.sticky_read_locked_mine										{ @extend .topic_read_locked_mine; }
.sticky_unread													{ @extend .topic_unread; }
.sticky_unread_mine												{ @extend .topic_unread_mine; }
.sticky_unread_locked											{ @extend .topic_unread_locked; }
.sticky_unread_locked_mine										{ @extend .topic_unread_locked_mine; }

.topic_moved													{ background-image: url("./images/topic_moved.png"); }
.topic_read														{ background-image: url("./images/topic_read.png"); }
.topic_read_mine												{ background-image: url("./images/topic_read_mine.png"); }
.topic_read_hot													{ background-image: url("./images/topic_read_hot.png"); }
.topic_read_hot_mine											{ background-image: url("./images/topic_read_hot_mine.png"); }
.topic_read_locked												{ background-image: url("./images/topic_read_locked.png"); }
.topic_read_locked_mine											{ background-image: url("./images/topic_read_locked_mine.png"); }
.topic_unread,													{ background-image: url("./images/topic_unread.png"); }
.topic_unread_mine												{ background-image: url("./images/topic_unread_mine.png"); }
.topic_unread_hot												{ background-image: url("./images/topic_unread_hot.png"); }
.topic_unread_hot_mine											{ background-image: url("./images/topic_unread_hot_mine.png"); }
.topic_unread_locked											{ background-image: url("./images/topic_unread_locked.png"); }
.topic_unread_locked_mine										{ background-image: url("./images/topic_unread_locked_mine.png"); }

.pm_read														{ @extend .topic_read; }
.pm_unread														{ @extend .topic_unread; }

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 1.5dppx)
{
	.global_read, .global_read_locked, .global_unread, .global_unread_locked,
	.forum_link, .forum_read, .forum_read_locked, .forum_read_subforum, .forum_unread, .forum_unread_locked, .forum_unread_subforum,
	.topic_moved, .topic_read, .topic_read_mine, .topic_read_hot, .topic_read_hot_mine, .topic_read_locked, .topic_read_locked_mine,
	.topic_unread, .topic_unread_mine, .topic_unread_hot, .topic_unread_hot_mine, .topic_unread_locked, .topic_unread_locked_mine
	{
		background-size: 36px 36px;
	}

	.global_read												{ background-image: url("./images/announce_read_hd.png"); }
	.global_read_locked											{ background-image: url("./images/announce_read_locked_hd.png"); }
	.global_unread												{ background-image: url("./images/announce_unread_hd.png"); }
	.global_unread_locked										{ background-image: url("./images/announce_unread_locked_hd.png"); }

	.forum_link													{ background-image: url("./images/forum_link_hd.png"); }
	.forum_read													{ background-image: url("./images/forum_read_hd.png"); }
	.forum_read_locked											{ background-image: url("./images/forum_read_locked_hd.png"); }
	.forum_read_subforum										{ background-image: url("./images/forum_read_subforum_hd.png"); }
	.forum_unread												{ background-image: url("./images/forum_unread_hd.png"); }
	.forum_unread_locked										{ background-image: url("./images/forum_unread_locked_hd.png"); }
	.forum_unread_subforum										{ background-image: url("./images/forum_unread_subforum_hd.png"); }

	.topic_moved												{ background-image: url("./images/topic_moved_hd.png"); }
	.topic_read													{ background-image: url("./images/topic_read_hd.png"); }
	.topic_read_mine											{ background-image: url("./images/topic_read_mine_hd.png"); }
	.topic_read_hot												{ background-image: url("./images/topic_read_hot_hd.png"); }
	.topic_read_hot_mine										{ background-image: url("./images/topic_read_hot_mine_hd.png"); }
	.topic_read_locked											{ background-image: url("./images/topic_read_locked_hd.png"); }
	.topic_read_locked_mine										{ background-image: url("./images/topic_read_locked_mine_hd.png"); }
	.topic_unread												{ background-image: url("./images/topic_unread_hd.png"); }
	.topic_unread_mine											{ background-image: url("./images/topic_unread_mine_hd.png"); }
	.topic_unread_hot											{ background-image: url("./images/topic_unread_hot_hd.png"); }
	.topic_unread_hot_mine										{ background-image: url("./images/topic_unread_hot_mine_hd.png"); }
	.topic_unread_locked										{ background-image: url("./images/topic_unread_locked_hd.png"); }
	.topic_unread_locked_mine									{ background-image: url("./images/topic_unread_locked_mine_hd.png"); }
}

//
// --------------------------------------------------------------
// Colours and backgrounds for cp.css
// --------------------------------------------------------------

// Main CP box
// ----------------------------------------

.panel-container h3, .panel-container hr, #cp-menu hr {
}

.panel-container .panel li.row {
}

ul.cplist {
}

.panel-container .panel li.header dd, .panel-container .panel li.header dt {
	color: $bold-text-color;
}

.panel-container table.table1 thead th {
	color: $post-text-color;
	border-bottom-color: $block-inner-border;
}

#cp-main .pm-message {
	border-color: $block-border;
	background-color: $block-background;
}

// CP tabbed menu
// ----------------------------------------
#tabs .tab > a {
	background: $tab-background;
	color: $tab-color;
}

#tabs .tab > a:hover {
	background: $tab-hover-background;
	color: $tab-hover-color;
}

#tabs .activetab > a,
#tabs .activetab > a:hover {
	background: $tab-selected-background;
	box-shadow: 0 5px 5px -5px $tab-selected-background;
	border-color: $tab-selected-background;
	color: $tab-selected-color;
}

#tabs .activetab > a:hover {
}

// Mini tabbed menu used in MCP
// ----------------------------------------
#minitabs .tab > a {
	background-color: $block-background2;
}

#minitabs .activetab > a,
#minitabs .activetab > a:hover {
	background-color: #F9F9F9;
	color: #333333;
}

// Responsive tabs
// ----------------------------------------
.responsive-tab .responsive-tab-link:before {
	color: $tab-color;
}

// UCP navigation menu
// ----------------------------------------

// Link styles for the sub-section links
#navigation a {
	color: $text-color;
	background: $block-background;
	box-shadow: 0 2px 2px -2px rgba(0, 0, 0, .1);
}

#navigation a:hover {
	background: $block-background2;
	color: $link-hover-color;
}

#navigation #active-subsection a {
	background: $primary-color;
	color: $overlay-color;
}

#navigation #active-subsection a:hover {
	background-color: $secondary-color;
}

#navigation > hr {
	border-top-color: $block-background2;
}

// Preferences pane layout
// ----------------------------------------
.panel-container h2 {
	color: $post-text-color;
}

.panel-container .panel {
	background: mix($content-background, $block-background3, 60%);
	box-shadow: none;
	border-width: 0;
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
	& > .inner > h3:first-child {
		@include section-heading-cp;
	}
	&:before, &:after {
		background: transparent;
	}
}

#cp-main .pm {
	background-color: $block-background;
}

// Friends list
.cp-mini {
	background-color: $block-background2;
}

dl.mini dt {
}

// PM Styles
// ----------------------------------------
// PM Message history
.current {
	color: $bold-text-color !important;
}

// PM marking colours
.pmlist li.pm_message_reported_colour, .pm_message_reported_colour {
	border-left-color: #BC2A4D;
	border-right-color: #BC2A4D;
}

.pmlist li.pm_marked_colour, .pm_marked_colour {
	border-color: #FF6600;
}

.pmlist li.pm_replied_colour, .pm_replied_colour {
	border-color: #A9B8C2;
}

.pmlist li.pm_friend_colour, .pm_friend_colour {
	border-color: #5D8FBD;
}

.pmlist li.pm_foe_colour, .pm_foe_colour {
	border-color: #000000;
}

// Avatar gallery
#gallery label {
	background: $block-background2;
	border-color: $block-inner-border;
}

#gallery label:hover {
	background-color: $block-background3;
}

//
// --------------------------------------------------------------
// Colours and backgrounds for forms.css
// --------------------------------------------------------------

// General form styles
// ----------------------------------------
select {
	border-color: $input-border;
	background-color: $input-bg;
	color: $input-text;
}

label {
	color: $text-color;
}

option.disabled-option {
	color: $muted-color;
}

// Definition list layout for forms
// ----------------------------------------
dd label {
	color: $post-text-color;
}

fieldset.fields1 {
	background-color: transparent;
}

// Hover effects
fieldset dl:hover dt label {
	color: $bold-text-color;
}

fieldset.fields2 dl:hover dt label {
	color: inherit;
}

// Quick-login on index page
fieldset.quick-login input.inputbox {
}

// Posting page styles
// ----------------------------------------

#message-box textarea {
	color: $input-text;
}

#message-box textarea.drag-n-drop {
	outline-color: rgba($faint-color, 0.5);
}

#message-box textarea.drag-n-drop-highlight {
	outline-color: rgba($muted-color, 0.5);
}

// Input field styles
// ----------------------------------------
.inputbox, select {
	background-color: $input-bg;
	border-color: $input-border;
	color: $input-text;
}

.inputbox {
	@include placeholder {
		color: mix($input-text, $input-bg, 70%);
	}
}

.inputbox:hover, select:hover {
	background-color: $input-hover-bg;
	border-color: $input-hover-border;
	color: $input-hover-text;
}

.inputbox:focus, select:focus {
	background-color: $input-focus-bg;
	border-color: $input-focus-border;
	color: $input-focus-text;
}

.inputbox:hover {
	@include placeholder {
		color: $input-hover-text;
	}
}

.inputbox:focus {
	@include placeholder {
		color: transparent;
	}
}


// Form button styles
// ----------------------------------------

a.button1, input.button1, input.button3, a.button2, input.button2 {
	color: $button-text;
	border-color: $button-border;
	background-color: $button-bg;
}

a.button1, input.button1 {
	border-color: $primary-color;
	background-color: $primary-color;
	color: $overlay-color;
}

input.button3 {
	background-image: none;
}

// Hover states
a.button1:hover, input.button1:hover, a.button2:hover, input.button2:hover, input.button3:hover {
	border-color: $secondary-color;
	background-color: $secondary-color;
	color: $overlay-color;
}

// Focus states
input.button1:focus, input.button2:focus, input.button3:focus {
	border-color: $secondary-color;
	background-color: $secondary-color;
	color: $overlay-color;
}

input.disabled {
	color: $muted-color;
}

// jQuery popups
// ----------------------------------------
.phpbb_alert {
	background-color: $content-background;
	border-color: $block-inner-border;
}
.phpbb_alert .alert_close:before {
	color: $link-color;
}
.phpbb_alert .alert_close:hover:before {
	color: $link-hover-color;
}
.phpbb_alert .alert_close:after {
	color: $content-background;
}
.darken {
	background-color: #000;
}

.loading_indicator {
	background-color: #000;
	background-image: url("./images/loading.gif");
}

.dropdown-extended ul li {
	border-top-color: $block-inner-border;
}

.dropdown-extended ul li:hover {
	background-color: $block-background2;
	color: $bold-text-color;
}

.dropdown-extended .header, .dropdown-extended .footer {
	border-color: $block-inner-border;
	color: $bold-text-color;
}

.dropdown-extended .footer {
	border-top-style: solid;
	border-top-width: 1px;
}

.dropdown-extended .header {
	background: $dropdown-heading-top;
	// background-image: -webkit-linear-gradient(top, $dropdown-heading-top 0, $dropdown-heading-bottom 100%);
	// background-image: linear-gradient(to bottom, $dropdown-heading-top 0, $dropdown-heading-bottom 100%);
	// filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($dropdown-heading-top)}', endColorstr='#{ie-hex-str($dropdown-heading-top)}');
	color: $dropdown-heading-color;
	a {
		color: $dropdown-heading-link-color;
		&:hover {
			color: $dropdown-heading-link-hover-color;
		}
	}
}

ul.linklist li.responsive-menu a.responsive-menu-link:before {
	color: $link-color;
}

ul.linklist li.responsive-menu a.responsive-menu-link:hover:before, ul.linklist li.responsive-menu.visible a.responsive-menu-link:before {
	color: $link-hover-color;
}

.dropdown .dropdown-contents {
	background: $dropdown-bg;
	border-color: $dropdown-border;
	box-shadow: $dropdown-shadow;
}

.dropdown-up .dropdown-contents {
	box-shadow: $dropdown-shadow-up;
}

.dropdown li, .dropdown li li {
	border-color: $dropdown-inner-border;
}

.dropdown li.separator {
	border-color: $dropdown-inner-border;
}

// Notifications
// ----------------------------------------
.notification_list li {
	&.notification-reported strong, &.notification-disapproved strong {
		color: $secondary-color;
	}

	&.dropdown-notification {
		background-color: $dropdown-notification-bg;
		color: $dropdown-notification-color;
		&, .panel-container & {
			border-top-color: lighten($dropdown-notification-bg, 10%);
			border-bottom-color: darken($dropdown-notification-bg, 10%);
		}
		strong {
			color: $dropdown-notification-strong-color;
		}
		a {
			color: inherit;
		}
		p.notification-time, p.notifications_time {
			color: desaturate(mix($dropdown-notification-bg, $dropdown-notification-color, 30%), 25%);
		}
		a.mark_read {
			background-color: desaturate(if(lightness($dropdown-notification-bg) < 50%, darken($dropdown-notification-bg, 30%), lighten($dropdown-notification-bg, 30%)), 100%);
			&, &:after {
				color: $dropdown-notification-strong-color;
				&:hover {
					color: $dropdown-notification-color;
				}
			}
		}
	}

	&.bg3 {
		// Unread
		background-color: $notification-unread-bg;
		color: $notification-unread-color;
		&, .panel-container & {
			border-top-color: lighten($notification-unread-bg, 10%);
			border-bottom-color: darken($notification-unread-bg, 10%);
		}
		strong {
			color: $notification-unread-strong-color;
		}
		a {
			color: inherit;
		}
		p.notification-time, p.notifications_time {
			color: desaturate(mix($notification-unread-bg, $notification-unread-color, 30%), 25%);
		}
		a.mark_read {
			background-color: desaturate(if(lightness($notification-unread-bg) < 50%, darken($notification-unread-bg, 30%), lighten($notification-unread-bg, 30%)), 100%);
			&, &:after {
				color: $notification-unread-strong-color;
				&:hover {
					color: $notification-unread-color;
				}
			}
		}
	}

	&.dropdown-notification:hover {
		background-color: $dropdown-notification-hover-bg;
		color: $dropdown-notification-color;
		&, .panel-container & {
			border-top-color: lighten($dropdown-notification-hover-bg, 10%);
			border-bottom-color: darken($dropdown-notification-hover-bg, 10%);
		}
		strong {
			color: $dropdown-notification-strong-color;
		}
		a {
			color: inherit;
		}
		p.notification-time, p.notifications_time {
			color: desaturate(mix($dropdown-notification-hover-bg, $dropdown-notification-color, 30%), 25%);
		}
		a.mark_read {
			background-color: desaturate(if(lightness($dropdown-notification-hover-bg) < 50%, darken($dropdown-notification-hover-bg, 30%), lighten($dropdown-notification-hover-bg, 30%)), 100%);
			&, &:after {
				color: $dropdown-notification-strong-color;
				&:hover {
					color: $dropdown-notification-color;
				}
			}
		}
	}
}


//
// --------------------------------------------------------------
// Colours and backgrounds for imageset.css
// --------------------------------------------------------------
// .imageset.icon_post_target_unread {
// 	&:after {
// 		color: #D31141;
// 	}
// }

.imageset.icon_post_target {
	background-image: url("./images/icon_post_target.png");
	@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 1.5dppx)	{
		background-image: url("./images/icon_post_target_hd.png");
	}
}
.imageset.icon_post_target_unread {
	background-image: url("./images/icon_post_target_unread.png");
	@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 1.5dppx)	{
		background-image: url("./images/icon_post_target_unread_hd.png");
	}
}

.imageset.icon_topic_attach {
	&:after {
		color: $muted-color;
	}
}

%imageset-secondary-color {
	&:after {
		color: $secondary-color;
	}
}

.imageset.icon_topic_poll {
	&:after {
		color: desaturate(mix($primary-color, $block-background, 80%), 30%);
	}
}