@import "../../../base/less/mixins";

@nav_color_hex: #FFFFFF;
@nav_size: 25;
@nav_align: right;

// Layout.
@vertically_align: false;
// Layout Desktop.
@slide_height: default;
@slide_padding: 50px;
@slide_padding_extra_top: 0px;
@slide_padding_sides: 10px;
@slide_width: 1280px;

// Layout Mobile.
@responsive_breakpoint: 780px;
@slide_height_responsive: default;
@slide_padding_responsive: default;
@slide_padding_extra_top_responsive: default;
@slide_padding_sides_responsive: default;

// Design.
@heading_size: 38px;
@text_size: 16px;
@text_color: #F6F6F6;
@text_shadow: 0.25;
@text_font: default;
@text_font_weight: 500;
@text_font_style: default;
@link_color: default;
@link_color_hover: default;
@heading_font: default;
@heading_font_weight: 400;
@heading_font_style: default;
@heading_color: #FFFFFF;
@heading_shadow: 50;

// "Pre-fill" hero widget area if height is set
& when ( isnumber( @slide_height ) ) {
	@media (min-width: @responsive_breakpoint) {
		min-height: @slide_height;
	}
}

& when ( isnumber( @slide_height_responsive ) ) {
	@media (max-width: @responsive_breakpoint) {
		min-height: @slide_height_responsive;
	}
}

.sow-slider-base {

	ul.sow-slider-images {
		@media ( max-width: @responsive_breakpoint ) {
			min-height: 0 !important;
		}

		.sow-slider-image-wrapper {
			padding: ~"calc( @{slide_padding} + @{slide_padding_extra_top} )" @slide_padding_sides @slide_padding @slide_padding_sides;

			max-width: @slide_width;
			height: @slide_height;

			& when (@vertically_align = true) {
				display: flex;
				flex-direction: column;
				justify-content: center;
			}

			& when ( isnumber( @responsive_breakpoint ) ) {
				@media (max-width: @responsive_breakpoint) {			
					height: @slide_height_responsive;
					& when not ( @slide_padding_responsive = default ) and not ( @slide_padding_extra_top_responsive = default ) {
						padding-top: ~"calc( @{slide_padding_responsive} + @{slide_padding_extra_top_responsive} )";
					}
					padding-right: @slide_padding_sides_responsive;
					padding-left: @slide_padding_sides_responsive;
					& when not ( @slide_padding_responsive = 0 ) {
						padding-bottom: @slide_padding_responsive;
					}
				}
			}

			h1,h2,h3,h4,h5,h6{
				line-height: 1.375em;
				color: @heading_color;
				& when not ( @heading_shadow = 0 ) {
					text-shadow: 0 2px 2px rgba( 0, 0, 0, @heading_shadow/100 );
				}
				margin: 0.1em 0;

				.font(@heading_font, @heading_font_weight);
				font-style: @heading_font_style;
			}

			h1 {
				font-size: @heading_size;
			}

			h2 {
				font-size: @heading_size * 0.85;
			}

			h3 {
				font-size: @heading_size * 0.7;
			}

			h4 {
				font-size: @heading_size * 0.6;
			}

			h5 {
				font-size: @heading_size * 0.5;
			}

			h6 {
				font-size: @heading_size * 0.4;
			}

			a {
				color: @link_color;
				&:hover {
					color: @link_color_hover;
				}
			}

			p {
				color: @text_color;
				& when not ( @text_shadow = 0 ) {
					text-shadow: 0 2px 2px rgba( 0, 0, 0, @text_shadow / 100 );
				}
				margin: 1em 0;
				font-size: @text_size;

				.font(@text_font, @text_font_weight);
				font-style: @text_font_style;
			}

			.sow-hero-buttons {
				margin-top: 3em;
				padding-bottom: 0.2em;

				.so-widget-sow-button {
					display: inline-block;
					margin: 3px 6px 0;
				}

			}
		}
	}

	.sow-slider-pagination {
		text-align: @nav_align;

		li a {
			background: @nav_color_hex;
		}
	}

	.sow-slide-nav {

		font-size: ~"@{nav_size}px";

		a {
			color: @nav_color_hex;
		}
	}

}