@responsive_breakpoint: 780px;
@author: default;

// Post.
@post_border_color: default;
@post_background: default;

// Post Title.
@title_color: default;
@title_color_hover: default;
@title_font: default;
@title_font_style: default;
@title_font_weight: default;
@title_font_size: default;

// Meta.
@meta_color: default;
@meta_color_hover: default;
@meta_font: default;
@meta_font_style: default;
@meta_font_size: default;
@meta_font_weight: default;

// Content.
@content_color: default;
@content_font: default;
@content_font_style: default;
@content_font_weight: default;
@content_font_size: default;
@content_link: default;
@content_link_hover: default;

// Pagination.
@pagination_background: default;
@pagination_background_hover: default;
@pagination_border_color: default;
@pagination_border_color_hover: default;
@pagination_border_radius: default;
@pagination_font: default;
@pagination_font_size: default;
@pagination_font_style: default;
@pagination_font_weight: default;
@pagination_height: default;
@pagination_link_color: default;
@pagination_link_margin: default;
@pagination_link_margin_offset: default;
@pagination_link_color_hover: default;
@pagination_dots_color: default;
@pagination_top_margin: default;
@pagination_width: default;

// Offset Post Meta.
@offset_post_meta_color: default;
@offset_post_meta_font: default;
@offset_post_meta_font_size: default;
@offset_post_meta_font_style: default;
@offset_post_meta_font_weight: default;
@offset_post_meta_link_color: default;
@offset_post_meta_link_color_hover: default;
@offset_post_meta_link_font_size: default;

.sow-blog-layout-offset {

	.sow-blog-posts article {

		.sow-blog-entry-offset {
			color: @offset_post_meta_color;
			font-family: @offset_post_meta_font;
			font-size: @offset_post_meta_font_size;
			font-style: @offset_post_meta_font_style;
			font-weight: @offset_post_meta_font_weight;

			@media (max-width: @responsive_breakpoint) {
				margin-bottom: 15px;
				width: 100% !important;
			}

			a {
				color: @offset_post_meta_link_color;
				font-size: @offset_post_meta_link_font_size;

				&:hover,
				&:focus {
					color: @offset_post_meta_link_color_hover;
				}
			}

			& when( @author = 1 ) {

				.sow-entry-author-avatar {
					display: block;
					line-height: 0;

					.avatar {
						border-radius: 50%;
						height: auto;
						max-width: 100%;
						width: 70px;
					}
				}
			}
		}

		.sow-blog-entry {

			@media (max-width: @responsive_breakpoint) {
				width: 100% !important;
			}
		}

		.sow-blog-content-wrapper {
			background: @post_background;
			border: 1px solid @post_border_color;
		}

		.sow-entry-header {

			.sow-entry-title {
				font-family: @title_font;
				font-size: @title_font_size;
				font-style: @title_font_style;
				font-weight: @title_font_weight;

				a {
					color: @title_color;

					&:hover,
					&:focus {
						color: @title_color_hover;
					}
				}
			}

			.sow-entry-meta {
				font-family: @meta_font;
				font-size: @meta_font_size;
				font-style: @meta_font_style;
				font-weight: @meta_font_weight;

				span {
					color: @meta_color;

					a {
						color: @meta_color;

						&:hover,
						&:focus {
							color: @meta_color_hover;
						}
					}
				}

				&:not(:last-child)::after {
					font-size: @meta_font_size;
				}
			}
		}

		.sow-entry-content {
			color: @content_color;
			font-family: @content_font;
			font-size: @content_font_size;
			font-style: @content_font_style;
			font-weight: @content_font_weight;

			a {
				color: @content_link;

				&:hover,
				&:focus {
					color: @content_link_hover;
				}
			}
		}

		.sow-more-link {
			font-family: @content_font;
			font-size: @content_font_size;
			font-style: @content_font_style;
			font-weight: @content_font_weight;
		}
	}

	.sow-post-navigation {

		.sow-nav-links {
			margin-top: @pagination_top_margin;
		}

		.page-numbers {
			align-items: center;
			display: flex;
			height: @pagination_height;
			justify-content: center;
			width: @pagination_width;

			&:not(.dots) {
				background: @pagination_background;
				border: 1px solid @pagination_border_color;
				border-radius: @pagination_border_radius;
				color: @pagination_link_color;
				font-family: @pagination_font;
				font-size: @pagination_font_size;
				font-style: @pagination_font_style;
				font-weight: @pagination_font_weight;
				margin-right: @pagination_link_margin;

				&:last-child {
					margin-right: 0;
				}

				&.current,
				&:hover,
				&:focus {
					background: @pagination_background_hover;
					color: @pagination_link_color_hover;
					border-color: @pagination_border_color_hover;
				}
			}
		}

		.dots {
			color: @pagination_dots_color;
			margin-left: @pagination_link_margin_offset;
		}
	}
}