$arrow_size: 45px;
.cms-slider-arrows-container{
	@media(min-width: $screen-xl-min){
		//max-width: 1200px;
	}
	@media(min-width: 1366px){
		//max-width: 1320px;
	}
}
.cms-swiper-arrow{
	font-size: 40px;
	width: $arrow_size;
	height: $arrow_size;
	line-height: $arrow_size;
	display: block;
	z-index: 2;
	text-align: center;
	cursor: pointer;
	color: $accent_color;
	@include opacity(1);
	@include transition(background 300ms linear 0ms);
	&:before{
		display: block;
		line-height: $arrow_size;
		@include transition(font-size 300ms linear 0ms);
	}
	&:hover{
		@include opacity(1);
	}
	&.swiper-button-disabled{
		@include opacity(0.5);
		cursor: not-allowed;
	}
}
.cms-swiper-arrow-next:before{
	content: '\e95a';
}
.cms-swiper-arrow-prev:before{
	content: '\e959';
}
// Outline 
.cms-swiper-nav-outline-yes{
	.cms-swiper-arrow{
		@include box-shadow(0 0 0 2px #bcbcbc inset);
		&:hover{
			@include box-shadow(0 0 0 2px transparent inset);
		}
	}
}
// Show/Hide Nav
.cms-swiper-arrows-false{
	.cms-swiper-arrows,
	.cms-swiper-arrow{
		display: none;
	}
}
@media (max-width: $screen-md-max){
	.cms-swiper-arrows-tablet-false{
		.cms-swiper-arrows,
		.cms-swiper-arrow{
			display: none;
		}
	}
	.cms-swiper-arrows-tablet-true{
		.cms-swiper-arrows{
			display: flex;
		}
		.cms-swiper-arrow{
			display: block;
		}
	}
}
@media (max-width: $screen-sm-max){
	.cms-swiper-arrows-mobile-false{
		.cms-swiper-arrows,
		.cms-swiper-arrow{
			display: none;
		}
	}
	.cms-swiper-arrows-mobile-true{
		.cms-swiper-arrows{
			display: flex;
		}
		.cms-swiper-arrow{
			display: block;
		}
	}
}
// Nav position
$in-vertical-offset: 40px;
$out-vertical-offset: -100px;
.cms-swiper-nav-in-vertical,
.cms-swiper-nav-out-vertical{
	.cms-swiper-arrow{
		position: absolute;
		top: 50%;
		@include transform(translateY(-50%));
	}
}
.cms-swiper-nav-in-vertical{
	.cms-swiper-arrow-prev{
		left: $in-vertical-offset;
		[dir="rtl"] &{
			left: auto;
			right: $in-vertical-offset;
			&:before{
				@include flip();
			}
		}
	}
	.cms-swiper-arrow-next{
		right: $in-vertical-offset;
		[dir="rtl"] &{
			right: auto;
			left: $in-vertical-offset;
			&:before{
				@include flip();
			}
		}
	}
}
.cms-swiper-nav-out-vertical{
	.cms-swiper-arrow-prev{
		left: $out-vertical-offset;
		[dir="rtl"] &{
			left: auto;
			right: $out-vertical-offset;
			&:before{
				@include flip();
			}
		}
	}
	.cms-swiper-arrow-next{
		right: $out-vertical-offset;
		[dir="rtl"] &{
			right: auto;
			left: $out-vertical-offset;
			&:before{
				@include flip();
			}
		}
	}
}
// Nav Position
.cms-swiper-nav-top-,
.cms-swiper-nav-bottom-{
	&right{
		.cms-swiper-arrows{
			justify-content: end;
		}
	}
	&center{
		.cms-swiper-arrows{
			justify-content: center;
		}
	}
}
.cms-swiper-nav-pos-inside{
	.cms-swiper-arrows{
		position: absolute;
		left: 0;
		right: 0;
		@media (min-width: $screen-xxl-min){
			left: 150px;
			right: 150px;
		}
	}
	&[class*="cms-swiper-nav-top-"]{
		.cms-swiper-arrows{
			top: 75px;
		}
	}
	&[class*="cms-swiper-nav-bottom-"]{
		.cms-swiper-arrows{
			bottom: 75px;
		}
	}
}
// Nav Left Side 
$nav-side-w: 60px;
.cms-swiper-nav-left-side{
	.cms-swiper-container{
		overflow: visible;
	}
	.cms-swiper-slider-wrap{
		position: relative;
		.cms-swiper-arrows{
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			align-items: center;
		}
		.cms-link a{
			font-weight: 700;
			padding-bottom: 3px;
			padding-right: 40px;
			border-bottom: 3px solid;
			@each $name, $color in $cms_theme_colors{
				&.text-#{$name}{
					border-bottom-color: #{$color};
				}
				&.text-hover-#{$name}:hover {
					border-bottom-color: #{$color}
				}
			}
		}
		@media (min-width: $screen-xxl-min){
			margin-left: $nav-side-w*-1;
			[dir="rtl"] &{
				margin-left: 0;
				margin-right: $nav-side-w*-1;
			} 
		}
		@media (min-width: $screen-lg-min){
			padding-left: $nav-side-w;
			[dir="rtl"] &{
				padding-left: 0;
				padding-right: $nav-side-w;
			}
			.cms-swiper-arrows{
				width: $nav-side-w;
				position: absolute;
				top: 0;
				bottom:0;
				left: $nav-side-w*-1;
				z-index: 1;
				margin: 0;
				[dir="rtl"] &{
					left: auto;
					right: $nav-side-w*-1;
				}
			}
			.cms-swiper-arrows-arrow{
				flex-basis: 0;
			    flex-grow: 1;
			    max-width: 100%;
			}
			.cms-swiper-arrow{
				width: 100%;
				flex: 0 0 100%;
				text-align: start;
				margin: 0;
				padding: 40px 0;
				height: auto!important;
			}
			.cms-swiper-arrows-additional{
				flex: 0 0 auto;
			    width: auto;
			    max-width: 100%;
			    padding-bottom: 60px;
				> *{
					@include transform(rotate(90deg) translate(0, 20px));
				}
			}
			// Custom dots
			.cms-swiper-dots{
				max-width: $desktop-screen;
			}
		}
		@media(max-width: $screen-md-max){
			.cms-swiper-arrows{
				align-items:center;
				padding-top: 40px;
			}
			.cms-swiper-arrows-arrow{
				display: flex;
				flex-wrap: wrap;
			}
		}
	}
	&.cms-swiper-arrows-false{
		.cms-swiper-slider-wrap{
			.cms-swiper-arrows{
				display: none;
			}
			@media (min-width: $screen-lg-min){
				padding-left: 0!important;
				padding-right: 0!important;
			}
		}
	}
}
// Nav icon
$nav_icons : (
	'chevron' : (
		'next' : (
			'regular' :'\e95a',
			'hover': '\e95a'
		),
		'prev' : (
			'regular' :  '\e959',
			'hover'	:  '\e959'
		)
	),
	'arrow'   : (
		'next' : (
			'regular' :'\e90d',
			'hover': '\e90d'
		),
 		'prev' : (
 			'regular' : '\e90c',
 			'hover' : '\e90c'
 		)
	)
);
@each $nav_icons_name, $nav_icons_icons in $nav_icons {
	.cms-swiper-arrows-icon-#{$nav_icons_name}{
		@each $name, $icon in $nav_icons_icons{
			.cms-swiper-arrow-#{$name}{
				&:before{
					content:map-get($icon,'regular');
				}
				&:hover:before{
					content:map-get($icon,'hover');
				}
			}
			.cms-swiper-arrow-#{$name}{
				&:before{
					content:map-get($icon,'regular');
				}
				&:hover:before{
					content:map-get($icon,'hover');
				}
			}
		}
	}
}
// Nav Color
@each $name, $color in $cms_theme_colors{
	.cms-swiper-nav-color-#{$name}{
		.cms-swiper-arrow{
			color: #{$color};
		}
	}
	.cms-swiper-nav-color-hover-#{$name}{
		.cms-swiper-arrow:hover{
			color: #{$color};
		}
	}
}
@each $name, $color in $cms_theme_colors{
	.cms-swiper-nav-bg-color-#{$name}{
		.cms-swiper-arrow{
			background-color: #{$color};
		}
	}
	.cms-swiper-nav-bg-color-hover-#{$name}{
		.cms-swiper-arrow:hover{
			background-color: #{$color};
		}
	}
}
// Nav style
.cms-swiper-arrows{
	display: flex;
	margin: 0 -5px;
	align-items: center;
	.cms-swiper-arrow{
		margin: 0 5px;
	}
}

$nav_sizes: (
	'default' : 45,
	'34' : 34,
	'44' : 44,
	'58' : 58
);
.cms-swiper-arrows-icon-arrow{
	.cms-swiper-arrow{
		display: block;
		&:before{
			font-size: 12px;
		}
	}
}
@each $name, $size in $nav_sizes{
	.cms-swiper-nav-size-#{$name}{
		.cms-swiper-arrow{
			height: #{$size}px;
			line-height: #{$size}px;
			&:before{
				line-height: #{$size}px;
			}
		}
		.cms-swiper-nav-size-#{$name}:not(.cms-swiper-nav-shape-default){
			width: #{$size}px;
		}
		// Icon arrow
		&.cms-swiper-arrows-icon-arrow{
			.cms-swiper-arrow{
				width: #{$size}px;
			}
		}
		// Icon chevron
		&.cms-swiper-arrows-icon-chevron{
			.cms-swiper-arrow{
				&:before{
					font-size: #{$size}px;
				}
			}
		}
	}
}
$nav_shape: (
	'default' : '0',
	'square' : '0',
	'rounded' : '12px',
	'circle' : '50%'
);
@each $name, $shape in $nav_shape{
	.cms-swiper-nav-shape-#{$name}{
		.cms-swiper-arrow{
			@include border-radius($shape);
		}
	}
}