@import 'variables/colors';

/*--------------------------------------------------------------
Dark CSS
--------------------------------------------------------------*/

h1,
h2,
h3,
h4,
h5,
h6 {
	color: $white;
}
body {
	background-color: $dark-background;
	color: $color_gray_seven;
}

.dark-skin{
	#site-description {
		color: $white;
	}
	#page,
	#header-text-nav-container,
	.news-bar,
	#main,
	#secondary .widget {
		background-color: $dark-page-background;
	}
	.news-bar {
		background-color: $dark-news-background;
	}
	.main-small-navigation {
		li {
			background-color: $color_gray_one;
		}
		a {
			color: $white;
		}
	}
	.date-in-header {
		color: $color_gray_seven;
	}
	
	.breaking-news-latest {
		color: $white;
	}
	.search-form-top {
		background-color: $dark-footer-socket;
		border: 0 none;
	}
	
	.widget_featured_posts {
		.single-article {
			box-shadow: 0 0 0 0 transparent;
		}
		
		.article-content {
			.entry-title {
				a {
					color: $white;
				}
			}
			
			.below-entry-meta {
				.posted-on, 
				.byline,
				.comments {
					.fa {
						color: $light-content;
					}
				}
			}
		}
	}
	
	.posted-on, 
	.byline,
	.comments {
		a {
			color: $light-content;
		}
	}
	
	.comments {
		span {
			color: $light-content;
		}
	}
	
	.thumbnail-slider {
		border-color: $dark-page-background;
	}
	
	#comments {
		border-color: $color_gray_three;
	}
	
	#content {
		.post {
			.article-content {
				.entry-title a {
					color: $white;
				}
				
				.below-entry-meta {
					.byline, 
					.comments, 
					.tag-links,
					.edit-link,
					.posted-on,
					.post-views {
						.fa {
							color: $light-content;
						}
					}
					
					.post-views {
						span {
							color: $light-content;
						}
					}
					
					.edit-link {
						a {
							color: $light-content;
						}
					}
				}
			}
		}
	}
	
	.single-related-posts {
		.article-content {
			.entry-title {
				a {
					color: $white;
				}
			}
			
			.below-entry-meta {
				.posted-on,
				.comments {
					.fa {
						color: $light-content;
					}
				}
			}
		}
	}
	
	.post, 
	.search {
		.entry-title {
			a {
				color: $white;
			}
		}
		
	}
	
	.random_posts_widget_inner_wrap,
	.single-related-posts {
		box-shadow: 0 0 0 0 transparent;
	}
	
	.footer-widgets-wrapper,
	.footer-socket-wrapper {
		border-top: 0 none;
		background-color:$dark-footer-socket;
	}
	
	#colophon .tg-upper-footer-widgets .widget {
		border: 0 none;
	}
	
	input[type="text"], 
	input[type="email"], 
	input[type="password"],
	textarea,
	.comment-content {
		background-color: $dark-page-background;
		color: $color_gray_seven;
		border-color: $color_gray_five;
	}
	.view-all-link {
		background :$dark-page-background;
	}
	
	/*--------------------------------------------------------------
	Header Clean layout CSS
	--------------------------------------------------------------*/
	#masthead {
		&.colormag-header-clean {
			.main-navigation {
				.sub-menu,
				.children {
					background-color: $news-background;
				}
			}
			.main-small-navigation {
				li {
					background-color:$news-background;
				}
			}
		}
		
		&.colormag-header-clean,
		&.colormag-header-classic {
			.breaking-news .newsticker a,
			.social-links i.fa {
				color: $color_gray_seven;
			}
		}
		
		&.colormag-header-classic {
			.is-sticky {
				#site-navigation {
					background-color: $news-background;
				}
				
				.main-small-navigation li {
					background-color: $news-background;
				}
			}
			
			#site-navigation {
				.menu-toggle {
					border-color: $color_gray_seven;
					&::before {
						color:$color_gray_seven;
					}
				}
				
				&.main-navigation {
					ul#menu-primary {
						ul.sub-menu,
						.children {
							background-color: $news-background;
							border-color: $color_gray_three;
							
							li {
								border-color: $color_gray_three;
							}
						}
					}
					a,				
					.random-post a .fa-random {
						color: $white;
					}
				}
				&.main-small-navigation .random-post a .fa-random,
				.fa.search-top {
					color: $white;
				}
			}
		}
	}
	.colormag-footer--classic {
		.footer-widgets-wrapper {
			background-color: $medium-footer-socket;
		}
		.footer-socket-wrapper {
			background-color: $dark-footer-socket;
		}
	}
	.elementor {
		.tg-module-wrapper {
			color: $color_gray_seven;
			
			.tg-module-title {
				color: $white;
			}
			.tg-module-meta {
				.tg-post-auther-name,
				.tg-post-date,
				.tg-module-comments {
					a,
					span {
						color: $light-content;
					}
				}
			}
		}
	}
}