/**
 * global_link - ready for var
 * @version	1.2.0
 * @release	22-05-2024
 * @author	msolowski Marcin Sołowski
 * @website	msolowski.pl
 */

.global_link
{
	--global_link_font_family:			var(--root_font_family);
	--global_link_font_size:			var(--global_font_size_h5);
	--global_link_font_weight:			400;
	--global_link_line_height:			1.1;
	--global_link_color:				var(--root_color_lead);
	--global_link_background_color:		var(--root_color_lead);
	--global_link_border_color:			var(--root_color_lead);
	--global_link_border_width:			2px;
	--global_link_outline_color:		var(--root_color_lead);
	--global_link_outline_width:		2px;
	--global_link_border_radius:		8px;
	--global_link_transition:			var(--global_transition);

	/**********************************************************************************/

	--min_global_link_padding_tb: 12;
	--max_global_link_padding_tb: 12;
	--global_link_padding_top_bottom:
		clamp(calc(var(--min_global_link_padding_tb) * 1px),
		calc((((-1 * var(--global_scm_var)) * ((var(--max_global_link_padding_tb) - var(--min_global_link_padding_tb)) / (var(--global_sc_var) - var(--global_scm_var))) + var(--min_global_link_padding_tb)) * 1px)
		+ ((var(--max_global_link_padding_tb) - var(--min_global_link_padding_tb)) / (var(--global_sc_var) - var(--global_scm_var)) * 100vw)),
		calc(var(--max_global_link_padding_tb) * 1px));

	--min_global_link_padding_lr: 0;
	--max_global_link_padding_lr: 0;
	--global_link_padding_left_right:
		clamp(calc(var(--min_global_link_padding_lr) * 1px),
		calc((((-1 * var(--global_scm_var)) * ((var(--max_global_link_padding_lr) - var(--min_global_link_padding_lr)) / (var(--global_sc_var) - var(--global_scm_var))) + var(--min_global_link_padding_lr)) * 1px)
		+ ((var(--max_global_link_padding_lr) - var(--min_global_link_padding_lr)) / (var(--global_sc_var) - var(--global_scm_var)) * 100vw)),
		calc(var(--max_global_link_padding_lr) * 1px));

	/**********************************************************************************/

	--global_link_color_h:				var(--root_color_grey);
	--global_link_background_color_h:	var(--root_color_grey);
	--global_link_border_color_h:		var(--root_color_grey);
	--global_link_outline_color_h:		var(--root_color_grey);

	/**********************************************************************************/

	font-family: var(--global_link_font_family);
	font-size: var(--global_link_font_size);
	font-weight: var(--global_link_font_weight);
	line-height: var(--global_link_line_height);
	color: var(--global_link_color);
/*	background-color: var(--global_link_background_color);
	border-style: solid;
	border-color: var(--global_link_border_color);
	border-width: var(--global_link_border_width);
	outline-style: solid;
	outline-color: var(--global_link_outline_color);
	outline-width: var(--global_link_outline_width);
	border-radius: var(--global_link_border_radius); */
	display: inline-flex;
	padding-top: var(--global_link_padding_top_bottom);
	padding-right: var(--global_link_padding_left_right);
	padding-bottom: var(--global_link_padding_top_bottom);
	padding-left: var(--global_link_padding_left_right);
	align-items: center;
	justify-content: center;
	cursor: pointer;
	position: relative;
	transition: var(--global_link_transition);
	letter-spacing: normal;
	text-align: left;
/*	overflow: hidden; */
/*	white-space: nowrap; */
/*	dopisac obsluge background dark dla section */
}

:not(section).is_background_dark .global_link,
section.is_background_dark .section_contener > .link .global_link
{
	--global_link_color:				var(--root_color_white);
	--global_link_color_h:				var(--root_color_white);
}

.global_link:hover
{
	color: var(--global_link_color_h);
}

.global_link:active
{
/*	transform: scale(0.95, 0.95); */
}

/**********************************************************************************/

.global_link.gl_before::before
{
	content: '';
	display: inline-flex;
	margin-right: 10px;
	width: 25px;
	height: 24px;
	pointer-events: none;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='25px' height='24px' viewBox='0 0 25 24' enable-background='new 0 0 25 24' xml:space='preserve'%3e%3crect x='5.554' y='11.416' width='19.446' height='1.207'/%3e%3cpath d='M10.004,0.265l0.823,0.882L3.271,8.19c-0.066,0.055-1.953,1.509-2.06,3.599c-0.068,1.358,0.625,2.725,2.06,4.063l7.508,7 l-0.823,0.883l-7.508-7c-1.712-1.597-2.532-3.285-2.44-5.019C0.148,9.061,2.4,7.338,2.497,7.268L10.004,0.265z'/%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: 100% auto;
	transition: var(--global_transition);
}

:not(section).is_background_dark .global_link.gl_before::before,
section.is_background_dark .section_contener > .link .global_link.gl_before::before
{
	filter: invert(100%);
}

.global_link.gl_before:hover::before
{
	transform: translateX(-10px);
}

/**********************************************************************************/

.global_link.gl_after::after
{
	content: '';
	display: inline-flex;
	margin-left: 10px;
	width: 25px;
	height: 24px;
	pointer-events: none;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='25px' height='24px' viewBox='0 0 25 24' enable-background='new 0 0 25 24' xml:space='preserve'%3e%3crect y='11.377' width='19.446' height='1.207'/%3e%3cpath d='M14.996,23.735l-0.823-0.882l7.557-7.044c0.066-0.055,1.953-1.509,2.06-3.599c0.068-1.358-0.625-2.725-2.06-4.063l-7.508-7 l0.823-0.883l7.508,7c1.712,1.597,2.532,3.285,2.44,5.019c-0.142,2.656-2.394,4.379-2.49,4.449L14.996,23.735z'/%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: 100% auto;
	transition: var(--global_transition);
}

:not(section).is_background_dark .global_link.gl_after::after,
section.is_background_dark .section_contener > .link .global_link.gl_after::after
{
	filter: invert(100%);
}

.global_link.gl_after:hover::after
{
	transform: translateX(10px);
}

/**********************************************************************************/

.global_link.gl_fill
{
	--global_link_color:				var(--root_color_white);
	--global_link_color_h:				var(--root_color_white);
	--min_global_link_padding_lr:		20;
	--max_global_link_padding_lr:		20;
	background-color: var(--global_link_background_color);
}

.contener .global_link.gl_fill.gl_before::before
{
	filter: invert(100%);
}

.contener .global_link.gl_fill.gl_after::after
{
	filter: invert(100%);
}

:not(section).is_background_dark .global_link.gl_fill,
section.is_background_dark .section_contener > .link .global_link.gl_fill
{
	--global_link_color:				var(--root_color_black);
	--global_link_color_h:				var(--root_color_black);
	--global_link_background_color:		var(--root_color_white);
	--global_link_background_color_h:	var(--root_color_white);
}

:not(section).is_background_dark .global_link.gl_fill.gl_before::before,
section.is_background_dark .section_contener > .link .global_link.gl_fill.gl_before::before
{
	filter: none;
}

:not(section).is_background_dark .global_link.gl_fill.gl_after::after,
section.is_background_dark .section_contener > .link .global_link.gl_fill.gl_after::after
{
	filter: none;
}

.global_link.gl_fill:hover
{
	background-color: var(--global_link_background_color_h);
}

/**********************************************************************************/

.global_link.gl_outline
{
	--min_global_link_padding_lr:		20;
	--max_global_link_padding_lr:		20;
	border-style: solid;
	border-color: var(--global_link_border_color);
	border-width: var(--global_link_border_width);
}

:not(section).is_background_dark .global_link.gl_outline,
section.is_background_dark .section_contener > .link .global_link.gl_outline
{
	--global_link_color:				var(--root_color_white);
	--global_link_color_h:				var(--root_color_white);
	--global_link_border_color:			var(--root_color_white);
	--global_link_border_color_h:		var(--root_color_white);
}

.global_link.gl_outline:hover
{
	border-color: var(--global_link_border_color_h);
}

/**********************************************************************************/

.global_link.gl_radius
{
	border-radius: var(--global_link_border_radius);
}

/**********************************************************************************/

.global_link.gl_underline::before
{
	content: '';
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 1px;
	background-color: var(--global_link_background_color);
	transition: var(--global_transition);
}

:not(section).is_background_dark .global_link.gl_underline,
section.is_background_dark .section_contener > .link .global_link.gl_underline
{
	--global_link_background_color:		var(--root_color_white);
	--global_link_background_color_h:	var(--root_color_white);
}

.global_link.gl_underline:hover::before
{
	background-color: var(--global_link_background_color_h);
}

/**********************************************************************************/

@media screen and (max-width: 1680px)
{
}

@media screen and (max-width: 1600px)
{
}

@media screen and (max-width: 1440px)
{
}

@media screen and (max-width: 1366px)
{
}

@media screen and (max-width: 1300px)
{
}

@media screen and (max-width: 1200px)
{
}

@media screen and (max-width: 1024px)
{
}

@media screen and (max-width: 800px)
{
}

@media screen and (max-width: 640px)
{
}

@media screen and (max-width: 480px)
{
	.global_link.gl_w_100_mobile
	{
		width: 100%;
	}
}

@media screen and (max-width: 360px)
{
}