/**
 * Created: 		03/21/2025
 * Updated:			03/26/2025
 * Description:		Styles for blogs
 * ✅				Functions that are working
 * ❌				Functions that are not working
 */

body.rsgdx-active .rsgdx-blogs {
	width: 100%;
}
body.rsgdx-active .rsgdx-max-container {
	max-width: 1600px; margin: 0 auto;
}

/*******************************************
 * SECTIONS -- BLOG ARCHIVE
*******************************************/
body.rsgdx-active .rsgdx-blogs.rsgdx-archive {
	width: 100%; background-color: var(--site_secondary_color); color: var(--site_shade_5); min-height: 100vh; font-size: 15px;
}
body.rsgdx-active section.rsgdx-section-blog-featured {
	padding-top: 40px; padding-bottom: 40px; margin-bottom: 30px;
}
body.rsgdx-active section.rsgdx-section-blog-posts-container {
	max-width: 100%; background-color: var(--site_shade_1); padding: 0; display: flex; justify-content: center; align-items: center; position: relative; overflow: hidden;
}
body.rsgdx-active section.rsgdx-section-blog-posts-container .rsgdx-section-blog-posts {
	max-width: 1600px; width: 100%; padding: 60px 30px;
}
body.rsgdx-active .rsgdx-section-blog-posts-filters {
	display: flex; flex-direction: row; gap: 20px; flex-wrap: wrap; align-items: center; margin: 40px 0;
}
body.rsgdx-active .rsgdx-section-blog-posts-filters a {
	color: var(--site_shade_5); background-color: var(--site_shade_2); border-radius: 20px; display: inline-block; position: relative; padding: 5px 20px;
}
body.rsgdx-active .rsgdx-section-blog-posts-filters a:hover, body.rsgdx-active .rsgdx-section-blog-posts-filters a.rsgdx-active {
	background-color: var(--site_primary_color);
}
body.rsgdx-active .rsgdx-section-blog-posts-search {
	margin: 40px 0; position: relative; z-index: 1;
}
body.rsgdx-active .rsgdx-section-blog-posts-loader {
	position: absolute; z-index: 2; top: 400px; left: 45%;
}
body.rsgdx-active .rsgdx-section-blog-posts-grid-container {
	min-height: 300px;
}


/*******************************************
 * DIV - IMAGE LEFT CONTENT RIGHT -- BLOGS FEATURED CONTENT
*******************************************/
body.rsgdx-active .rsgdx-section-blog-featured-content {
	display: flex; flex-direction: column; gap: 20px;
}
body.rsgdx-active .rsgdx-section-blog-featured-content-categories {
	display: flex; flex-direction: row; gap: 20px;
}
body.rsgdx-active .rsgdx-section-blog-featured-content-categories a {
	color: var(--site_shade_5); background-color: var(--site_shade_2); border-radius: 20px; display: inline-block; position: relative; padding: 5px 20px;
}
body.rsgdx-active .rsgdx-section-blog-featured-content-categories a:hover {
	background-color: var(--site_primary_color);
}

/*******************************************
 * BOXES - Blogs
*******************************************/
body.rsgdx-active .rsgdx-grid-boxes {
	display: flex; flex-direction: row; flex-wrap: wrap; gap: 20px;
}
body.rsgdx-active .rsgdx-grid-box {
	width: 32.2%; background-color: var(--site_secondary_color); border-radius: 20px; padding: 20px; position: relative; overflow: hidden; padding-bottom: 80px;
}
body.rsgdx-active .rsgdx-grid-box-img img {
	height: 300px; width: 100%; border-radius: 20px; margin-bottom: 20px; object-fit: cover;
}
body.rsgdx-active .rsgdx-grid-box-highlights {
	margin-bottom: 20px; display: flex; flex-wrap: wrap; gap: 20px; flex-direction: row;
}
body.rsgdx-active .rsgdx-grid-box-highlights a {
	color: var(--site_shade_5); background-color: var(--site_shade_2); border-radius: 20px; display: inline-block; position: relative; padding: 5px 20px; font-size: smaller;
}
body.rsgdx-active .rsgdx-grid-box-highlights a:hover {
	background-color: var(--site_primary_color);
}
body.rsgdx-active .rsgdx-grid-box-title {
	margin-bottom: 20px; font-size: 20px;
}
body.rsgdx-active .rsgdx-grid-box-perma {
	position: absolute; bottom: 20px;
}
@media only screen and (max-width: 1236px) {
	body.rsgdx-active .rsgdx-grid-box {
		width: 32.1%;
	}
}
@media only screen and (max-width: 1140px) {
	body.rsgdx-active .rsgdx-grid-box {
		width: 32%;
	}
}
@media only screen and (max-width: 1060px) {
	body.rsgdx-active .rsgdx-grid-boxes {
		gap: 1%;
	}
	body.rsgdx-active .rsgdx-grid-box {
		width: 49%;
		padding: 30px 30px 80px 30px;
		margin-bottom: 1%;
	}
}
@media only screen and (max-width: 700px) {
	body.rsgdx-active .rsgdx-grid-boxes {
		gap: 20px;
	}
	body.rsgdx-active .rsgdx-grid-box {
		width: 100%;
		padding: 30px;
		margin-bottom: 0;
	}
	body.rsgdx-active .rsgdx-grid-box-perma {
		position: relative;
		bottom: 0;
		margin-top: 30px;
	}
}


/*******************************************
 * BOXES PAGINATION - Blogs
*******************************************/
body.rsgdx-active .rsgdx-grid-boxes-pagination {
	display: flex; text-align: center; align-items: center; justify-content: flex-start; flex-direction: row; width: 100%; margin: 40px 0; gap: 5px;
}
body.rsgdx-active .rsgdx-grid-boxes-pagination a {
	background: var(--site_shade_2); padding: 10px; width: 45px; color: var(--site_shade_5); border-radius: 10px;
}
body.rsgdx-active .rsgdx-grid-boxes-pagination a.rsgdx-active, body.rsgdx-active .rsgdx-grid-boxes-pagination a:hover {
	background-color: var(--site_primary_color); color: var(--site_shade_5) !important;
}


/*******************************************
 * Blog Single
*******************************************/
	/*******************************************
	 * Blog Single - Images
	*******************************************/
	body.rsgdx-active.single-post figure.wp-block-image,
	body.rsgdx-active.single-post figure.wp-block-image a,
	body.rsgdx-active.single-post figure.wp-block-image img,
	body.rsgdx-active.single-post figure.wp-block-image a img {
		width: 100%; min-width: 100%; margin: 0;
	}
	body.rsgdx-active.single-post figure.wp-block-image img {
		border-radius: 20px; margin: 10px 0 40px 0; max-height: 500px; object-fit: cover;
	}
	/*******************************************
	 * Blog Single - Headers
	*******************************************/
	body.rsgdx-active.single-post h2.wp-block-heading {
		font-size: 25px;
	}
	body.rsgdx-active.single-post h3.wp-block-heading {
		font-size: 22px;
	}
	body.rsgdx-active.single-post .wp-block-heading {
		margin: 30px 0;
	}
	/*******************************************
	 * Blog Single - Banner
	*******************************************/
	body.rsgdx-active.single-post .rsgdx-single-banner {
		padding: 60px 20px 60px;
	}
	body.rsgdx-active.single-post .rsgdx-single-meta {
		display: flex; flex-direction: row; align-items: center; gap: 20px; font-size: 12px;
	}
	body.rsgdx-active.single-post div.rsgdx-section-left-image.rsgdx-single-banner > div:nth-child(1) {
		width: 60%;
	}
	body.rsgdx-active.single-post div.rsgdx-section-left-image.rsgdx-single-banner > div:nth-child(2) {
		width: 40%;
	}
	body.rsgdx-active.single-post div.rsgdx-section-left-image.rsgdx-single-banner img {
		max-height: 400px;
	}
	/*******************************************
	 * Blog Single - Content
	*******************************************/
	body.rsgdx-active.single-post .rsgdx-single-contents {
		background-color: var(--site_shade_1); padding: 60px 20px;
	}
	body.rsgdx-active.single-post .rsgdx-single-contents .rsgdx-max-container {
		display: flex; flex-direction: row; gap: 30px;
	}
	body.rsgdx-active.single-post .rsgdx-single-content {
		width: 70%;
	}
	/*******************************************
	 * Blog Single - Sidebar
	*******************************************/
	body.rsgdx-active.single-post .rsgdx-single-sidebar {
		width: 30%; border-radius: 20px; background: var(--site_secondary_color); padding: 30px;
	}
	body.rsgdx-active.single-post .rsgdx-single-sidebar .widget_search {
		display: none;
	}
	body.rsgdx-active.single-post .rsgdx-single-sidebar li img {
		width: 100%; max-width: 100%!important; max-height: 300px!important; object-fit: cover; border-radius: 20px;
	}
	body.rsgdx-active.single-post .rsgdx-single-sidebar li a.wp-block-latest-posts__post-title {
		font-size: 20px; color: var(--site_shade_5); margin: 30px 0 20px; display: block;
	}
	body.rsgdx-active.single-post .rsgdx-single-sidebar li a.wp-block-latest-posts__post-title:hover {
		color: var(--site_primary_color);
	}
	body.rsgdx-active.single-post .rsgdx-single-sidebar li a.wp-block-latest-posts__read-more {
		margin-top: 20px; border: 1px solid var(--site_primary_color); display: block;
	}
	body.rsgdx-active.single-post .rsgdx-single-sidebar li a.wp-block-latest-posts__read-more:hover {
		color: var(--site_shade_5); background-color: var(--site_secondary_color);
	}
	@media only screen and (max-width: 992px) {
		body.rsgdx-active.single-post .rsgdx-single-contents .rsgdx-max-container {
			flex-direction: column;
		}
		body.rsgdx-active.single-post .rsgdx-single-contents .rsgdx-max-container > div {
			width: 100%;
		}
	}


/*******************************************
 * Blog Category
*******************************************/
body.rsgdx-active .rsgdx-blogs.rsgdx-archive-category {
	background-color: var(--site_secondary_color);
}
body.rsgdx-active .rsgdx-blogs.rsgdx-archive-category .rsgdx-section-blog-posts-container {
	background-color: var(--site_secondary_color);
}
body.rsgdx-active .rsgdx-blogs.rsgdx-archive-category .rsgdx-section-blog-posts {
	padding-top: 30px;
}


/*******************************************
 * FILTERS - Click on desktop then dropdown on mobile
*******************************************/
body.rsgdx-active .rsgdx-click-filters-dropdown {
	display: flex; flex-direction: row; gap: 20px; flex-wrap: wrap; align-items: center; margin: 40px 0; position: relative;
}
body.rsgdx-active .rsgdx-click-filters-dropdown a {
	color: var(--site_shade_5); background-color: var(--site_shade_2); border-radius: 20px; display: inline-block; position: relative; padding: 5px 20px;
}
body.rsgdx-active .rsgdx-click-filters-dropdown a:hover, body.rsgdx-active .rsgdx-click-filters-dropdown a.rsgdx-active {
	background-color: var(--site_primary_color);
}
body.rsgdx-active .rsgdx-click-filters-dropdown-mobile-tigger {
	display: none; position: relative; z-index: 3; font-size: 20px; left: -40px; width: 100%; max-width: 80px; padding: 10px 20px 10px 30px; background: var(--site_shade_3); border-radius: 30px; border-top-left-radius: 0; border-bottom-left-radius: 0; align-items: center; flex-direction: row; 
}
body.rsgdx-active .rsgdx-click-filters-dropdown-mobile-tigger.rsgdx-active {
	max-width: 200%; width: 150%; border-radius: 0; padding-top: 20px; 
}
body.rsgdx-active .rsgdx-click-filters-dropdown-mobile-tigger span {
	display: none; font-size: 15px; padding-left: 20px;
}
body.rsgdx-active .rsgdx-click-filters-dropdown-mobile-tigger.rsgdx-active span {
	display: inline-block;
}
@media only screen and (max-width: 767px) {
	body.rsgdx-active .rsgdx-click-filters-dropdown-mobile-tigger {
		display: flex;
	}
	body.rsgdx-active .rsgdx-click-filters-dropdown {
		gap: 10px; position: absolute; z-index: 2; background: red; margin: 0; padding: 20px; left: 0; background: var(--site_shade_3); opacity: 0; pointer-events: none; transition: ease .3s;
	}
	body.rsgdx-active .rsgdx-click-filters-dropdown.rsgdx-active {
		opacity: 1; pointer-events: auto; transition: ease .3s;
	}
	body.rsgdx-active .rsgdx-click-filters-dropdown a {
		width: 100%;
	}
}


/*******************************************
 * Blog Authors
*******************************************/
body.archive.author #primary {
	max-width: 1600px; margin: 0 auto;
}
body.archive.author #primary #main {
	padding: 30px;
}
body.archive.author #primary .ast-pagination {
	padding-bottom: 2em;
}
body.archive.author #primary img {
	object-fit: cover;
}
body.archive.author #primary a:hover,
body.archive.author #primary .author-name:hover {
	color: var(--site_primary_color);
}
body.rsgdx-active.single-post .rsgdx-single-contents-author {
	padding: 0 60px 60px;
}
body.rsgdx-active.single-post .rsgdx-single-contents-author .rsgdx-share-buttons {
	display: flex; flex-direction: row; gap: 10px; margin: 20px 0 30px;
}
body.rsgdx-active.single-post .rsgdx-single-contents-author .rsgdx-share-buttons a {
	background: var(--site_primary_color);
	width: 50px;
	height: 50px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	color: var(--site_shade_5);
	font-size: 25px;
	border-radius: 10px;
}
body.rsgdx-active.single-post .rsgdx-single-contents-author .rsgdx-author-box {
	display: flex;
	align-items: center;
	gap: 15px;
	margin: 20px 0;
	flex-direction: row;
}
body.rsgdx-active.single-post .rsgdx-single-contents-author .rsgdx-author-bio {
	width: 90%;
}
body.rsgdx-active.single-post .rsgdx-single-contents-author .rsgdx-author-avatar {
	width: 100px;
}
body.rsgdx-active.single-post .rsgdx-single-contents-author .rsgdx-author-avatar img {
	border-radius: 100%;
	width: 90px;
	height: 90px;
}
@media only screen and (max-width: 767px) {
	body.rsgdx-active.single-post .rsgdx-single-contents-author {
		padding: 0 30px 60px;
	}
	body.rsgdx-active.single-post .rsgdx-single-contents-author .rsgdx-author-box {
		align-items: flex-start; flex-direction: column;
	}
}