/* Categories */

/* Functions:
wpj_display_blog_categories
wpj_display_blog_post_categories
wpj_display_blog_tags
wpj_display_subcategories_list_of_current_category
*/

.category-listing,
.subcategory-listing,
.blog-tags {
	ul {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		list-style-type: none;
		padding: 0;
		margin: 0;

		li {
			list-style-type: none;
			margin-right: 6px;
			margin-bottom: 6px;

			@include mobile {
				margin-right: 4px;
				margin-bottom: 4px;
			}

			a {
				@include default-shape();

				border: 2px solid $headlinesColor2;
				padding: 8px 12px;
				font-weight: 600;
				font-size: 14px;
				color: $categoriesColor;
				display: block;

				@include mobile {
					font-size: 13px;
					padding: 8px 10px;
				}

				&:hover {
					background: $grayBackground;
				}
			}
		}
	}

	&.small {
		ul {
			li {
				a {
					padding: 6px 10px;
				}
			}
		}
	}
}

.subcategory-listing {
	&.subcategory-listing-slider {
		ul {
			display: flex;
			justify-content: space-between;
			flex-wrap: nowrap;

			li {
				margin: 0 ! important;
				display: none;

				a {
					white-space: nowrap;
					text-align: center;
				}
			}
		}

		.arrows-wrapper {
			position: absolute;
			right: 0;
			top: -50px;
			display: flex;
			gap: 10px;

			.category-direction {
				display: inline-block;
				border-radius: 50%;
				border: 1px solid #d4d8ef;
				text-align: center;
				width: 30px;
				height: 30px;
				line-height: 30px;
				cursor: pointer;

				i {
					font-size: 15px;
					margin: 0;
					color: #978888;
				}
			}
		}
	}
}

.general-tags-wrapper {
	display: flex;
	flex-wrap: wrap;

	a {
		@include default-shape();

		border: 2px solid $headlinesColor2;
		padding: 8px 12px;
		font-weight: 600;
		font-size: 14px;
		color: $categoriesColor;
		display: inline-block;
		background: none;
		margin-right: 4px;
		margin-bottom: 4px;

		@include mobile {
			font-size: 13px;
			padding: 8px 10px;
		}

		&:hover {
			background: $grayBackground;
		}
	}
}