/* News list */

.entry-hero {
	min-height: min(10vh, 30vw);
	background: var(--global-palette7);
	align-content: center;
	.entry-meta {
		justify-content: center;
		.category-link-items a {
			color: var(--primary-color);
		}
	}

	.entry-header {
		margin-block: max(2rem, 5vw);
		min-height: unset !important;
		h1 {
			text-wrap: balance;
		}
	}
}
body.archive.category .content-area {
	.gspb_meta.category {
		display: none;
	}

	.gspb-dynamic-title-element > a {
		margin-top: 0 !important;
	}
}

body.blog,
body.archive,
body.single,
body.search {
	.news_breadcrumbs .gspb-separator-breadcrumbs:last-of-type {
		display: none;
	}
	.content-area {
		padding-top: 2rem;
		article.entry {
			padding-bottom: max(2rem, 5vh);
			* {
				overflow-wrap: break-word;
				word-break: break-all;
			}
			& > div {
				padding: 0;
			}
			.gspb-dynamic-post-image {
				.wp-post-image,
				.gspb_svg_placeholder {
					margin-bottom: 1.5rem;
					border-radius: var(--radius);
					width: 100%;
					height: min(350px, 50vw);
					background-color: var(--gray-lighter);
				}
			}

			.gspb_meta.category .gspb_meta_value {
				display: inline-flex;
				gap: 5px;
				margin-bottom: 0;
				color: #fff;
				user-select: none;
				a {
					color: var(--gray-dark);
					text-decoration: none;
					background-color: var(--gray-lighter);
					border-radius: var(--radius-sm);
					padding: 0.25rem 0.5rem;
				}
			}
			.gspb-dynamic-title-element > a {
				font-size: var(--text-md) !important;
				margin-top: 1rem;

				color: var(--primary-color);
				text-wrap: balance;
				word-break: normal;
				display: block;
			}
		}
		.post-thumbnail {
			margin-bottom: 2rem;
			img {
				width: auto;
				/*width: 100%;*/
				max-width: 100%;
				max-height: max(320px, 45vh);
				border-radius: var(--radius-lg);
			}
		}
	}
	.entry-related-style-wide {
		background-color: var(--gray-lighter);
		.entry-related-inner-content {
			padding-top: 4rem;
			padding-bottom: 6rem;

			.entry-related-carousel {
				--splide-nav-background: rgba(0, 0, 0, 0.5);
				.splide__pagination {
					transform: translateY(2rem);

					.splide__pagination__page.is-active {
						background-color: var(--primary-color);
					}
				}

				@media (width>=1600px) {
					--splide-nav-background: none;
					--splide-nav-color: var(--primary-color);
					.splide__arrow svg {
						width: 2em;
						height: 2em;
					}
					.splide__arrow--next {
						transform: translateX(65px);
					}
					.splide__arrow--prev {
						transform: translateX(-65px);
					}
					.splide__arrow:hover,
					.splide__arrow:focus {
						background: rgba(255, 255, 255, 0.5);
					}
				}

				.splide__slide {
					border-radius: var(--radius);
					border: solid 1px var(--gray-lighter);
					overflow: hidden;
					.entry.loop-entry {
						.post-thumbnail {
							box-shadow: 0px 10px 10px -5px rgba(0, 0, 0, 0.1);

							img {
								width: 100%;
								height: 100%;
								object-fit: cover;
								object-position: center;
							}
						}

						.entry-content-wrap {
							padding-inline: 30px !important;
							.entry-title {
								font-size: var(--test-sm) !important;
							}
							.posted-by {
								display: none;
							}
							.posted-on {
								color: var(--gray);
							}
						}
					}
				}
			}
		}
	}

	@media (width<=768px) {
		.navigation.post-navigation {
			.nav-links {
				display: flex;
				flex-direction: column;
				gap: 2rem;
				.nav-previous:after {
					display: none;
				}
			}
		}
	}

	/* Archive Category Filtes */
	.archive-category-filter {
		display: flex;
		flex-wrap: wrap;
		gap: 15px;
		justify-content: center;
		gap: 0.75rem;
		padding-bottom: 2rem;
		margin-bottom: 4rem;
		border-bottom: 2px solid var(--gray-lighter);
		@media (width<1100px) {
			zoom: 0.8;
		}
		.category-filter-item {
			display: inline-block;
			padding: 0.5rem 1.25rem;
			background-color: #fff;
			border: 1px solid var(--gray-light);
			border-radius: var(--radius, 0.5rem);
			color: var(--gray-light, #666);
			text-decoration: none;
			font-size: var(--text-sm, 0.9rem);
			font-weight: 500;
			transition: all 0.3s ease;
			text-transform: uppercase;
			letter-spacing: 0.5px;
			&:hover {
				background-color: var(--primary-light);
				border-color: var(--primary-light);
				color: #fff;

				box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
			}
			&.active {
				background-color: var(--primary);
				border-color: var(--primary);
				color: #fff;
			}
		}
	}

	@media (max-width: 768px) {
		.archive-category-filter {
			gap: 0.5rem;
			.category-filter-item {
				font-size: 0.85rem;
				padding: 0.4rem 1rem;
			}
		}
	}

	/* Pagination */

	.navigation.pagination {
		text-align: center;
		padding-bottom: 2rem;
	}
}

body.search {
	.archive-category-filter {
		display: none;
	}
	.search-form {
		margin-block: 2rem;
	}
}