/*region Variables*/
:root {
	/*size*/
	--ui-btn-size-xss: var(--ui-size-lg2);
	--ui-btn-size-xs: var(--ui-size-xl2);
	--ui-btn-size-sm: var(--ui-size-3xl);
	--ui-btn-size-md: var(--ui-size-5xl);
	--ui-btn-size-lg: var(--ui-size-6xl);
	/*default param*/
	--ui-btn-padding: 0 20px;
	--ui-btn-padding-right: 20px;
	--ui-btn-min-width: 80px;
	--ui-btn-height: var(--ui-btn-size-md);
	--ui-btn-font-size: var(--ui-font-size-xs);
	--ui-btn-background: #868d95;
	--ui-btn-background-hover: #5b6573;
	--ui-btn-background-active: #3b506e;
	--ui-btn-border-color: #868d95;
	--ui-btn-border-color-hover: #5b6573;
	--ui-btn-border-color-active: #3b506e;
	--ui-btn-border: 1px solid var(--ui-btn-border-color);
	--ui-btn-opacity-after: var(--ui-opacity-30);
	--ui-btn-colors-after-bg: var(--ui-color-on-primary);
	--ui-btn-colors-before-bg: var(--ui-color-on-primary);
	--ui-btn-color: var(--ui-color-on-primary);
	--ui-btn-color-hover: var(--ui-color-on-primary);
	--ui-btn-color-active: var(--ui-color-on-primary);
	--ui-btn-box-shadow: none;
	--ui-btn-box-shadow-hover: none;
	--ui-btn-box-shadow-active: none;
	--ui-btn-text-shadow: none;
	--ui-btn-text-shadow-hover: none;
	--ui-btn-text-shadow-active: none;
	--ui-btn-margin-left: 12px;
	--ui-btn-radius: var(--ui-border-radius-2xs);
	/**/
	--ui-btn-clock-white: url("data:image/svg+xml;charset=utf-8,%3Csvg width='19' height='19' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3E@keyframes arrow-loader{0%25{transform:rotate(0deg)}to{transform:rotate(360deg)}}%3C/style%3E%3Cg style='animation:arrow-loader 1s infinite linear;transform-origin:center' stroke='%23fff'%3E%3Cpath fill='none' d='M.5 9.475a8.976 8.976 0 0117.95 0 8.976 8.976 0 01-17.95 0z'/%3E%3Cpath d='M9.5 4v5.5'/%3E%3C/g%3E%3Cpath stroke='%23fff' fill='transparent' d='M15 9.5H9.5'/%3E%3C/svg%3E");
	--ui-btn-clock-black: url("data:image/svg+xml;charset=utf-8,%3Csvg width='19' height='19' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3E@keyframes arrow-loader{0%25{transform:rotate(0deg)}to{transform:rotate(360deg)}}%3C/style%3E%3Cg style='animation:arrow-loader 1s infinite linear;transform-origin:center' stroke='%23525C69'%3E%3Cpath fill='none' d='M.5 9.475a8.976 8.976 0 0117.95 0 8.976 8.976 0 01-17.95 0z'/%3E%3Cpath d='M9.5 4v5.5'/%3E%3C/g%3E%3Cpath stroke='%23525C69' d='M15 9.5H9.5'/%3E%3C/svg%3E");
	--ui-btn-wait-white: url("data:image/svg+xml;charset=utf-8,%3Csvg width='21' height='21' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3E@keyframes waitLoader{0%25{transform:rotate(0deg)}to{transform:rotate(360deg)}}%3C/style%3E%3Cg fill='%23fff' style='-moz-transform-origin:50%25;transform-origin:50%25;animation:waitLoader 1s infinite steps(12)'%3E%3Cpath d='M6.434 8.075a1.073 1.073 0 01-1.465.378L2.51 7.004a1.075 1.075 0 01-.378-1.466 1.073 1.073 0 011.465-.378l2.46 1.45c.506.298.676.958.377 1.465' opacity='.1'/%3E%3Cpath d='M8.109 6.415c-.51.294-1.168.119-1.462-.391L5.219 3.553a1.073 1.073 0 01.39-1.462 1.073 1.073 0 011.462.391L8.5 4.952c.294.51.118 1.168-.391 1.463' opacity='.2'/%3E%3Cpath d='M10.43 5.792c-.589 0-1.07-.481-1.07-1.07V1.868c0-.589.481-1.07 1.07-1.07.588 0 1.07.481 1.07 1.07v2.854c0 .589-.482 1.07-1.07 1.07' opacity='.3'/%3E%3Cpath d='M15.32 2.132c.508.3.678.958.379 1.466l-1.45 2.458a1.074 1.074 0 01-1.465.378 1.072 1.072 0 01-.378-1.464l1.45-2.46a1.074 1.074 0 011.465-.378' opacity='.4'/%3E%3Cpath d='M18.768 5.61c.295.509.12 1.167-.39 1.461L15.905 8.5c-.509.295-1.167.12-1.462-.39a1.073 1.073 0 01.392-1.462l2.47-1.429a1.073 1.073 0 011.462.391' opacity='.5'/%3E%3Cpath d='M20.061 10.43c0 .588-.481 1.07-1.07 1.07h-2.854c-.588 0-1.07-.482-1.07-1.07 0-.589.482-1.07 1.07-1.07h2.854c.589 0 1.07.481 1.07 1.07' opacity='.6'/%3E%3Cpath d='M18.727 15.32a1.074 1.074 0 01-1.465.379l-2.459-1.45a1.073 1.073 0 01-.378-1.465 1.072 1.072 0 011.465-.378l2.459 1.45c.507.298.677.957.378 1.465' opacity='.7'/%3E%3Cpath d='M15.25 18.768c-.51.295-1.168.12-1.462-.39l-1.429-2.472a1.073 1.073 0 01.391-1.461 1.073 1.073 0 011.463.39l1.428 2.471c.294.51.119 1.167-.391 1.462' opacity='.8'/%3E%3Cpath d='M10.43 20.061c-.589 0-1.07-.481-1.07-1.07v-2.854c0-.588.481-1.07 1.07-1.07.588 0 1.07.482 1.07 1.07v2.854c0 .589-.482 1.07-1.07 1.07' opacity='.9'/%3E%3Cpath d='M8.075 14.425c.507.299.677.958.378 1.465L7.004 18.35a1.075 1.075 0 01-1.466.378 1.073 1.073 0 01-.378-1.465l1.45-2.46a1.074 1.074 0 011.465-.377' opacity='.95'/%3E%3Cpath d='M5.792 10.43c0 .588-.481 1.07-1.07 1.07H1.868c-.589 0-1.07-.482-1.07-1.07 0-.589.481-1.07 1.07-1.07h2.854c.589 0 1.07.481 1.07 1.07M6.415 12.75c.294.51.119 1.168-.391 1.462l-2.471 1.429a1.074 1.074 0 01-1.463-.391 1.073 1.073 0 01.392-1.462l2.47-1.429a1.073 1.073 0 011.463.391'/%3E%3C/g%3E%3C/svg%3E");
	--ui-btn-wait-black: url("data:image/svg+xml;charset=utf-8,%3Csvg width='21' height='21' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3E@keyframes waitLoader{0%25{transform:rotate(0deg)}to{transform:rotate(360deg)}}%3C/style%3E%3Cg fill='%23535c69' style='-moz-transform-origin:50%25;transform-origin:50%25;animation:waitLoader 1s infinite steps(12)'%3E%3Cpath d='M6.434 8.075a1.073 1.073 0 01-1.465.378L2.51 7.004a1.075 1.075 0 01-.378-1.466 1.073 1.073 0 011.465-.378l2.46 1.45c.506.298.676.958.377 1.465' opacity='.1'/%3E%3Cpath d='M8.109 6.415c-.51.294-1.168.119-1.462-.391L5.219 3.553a1.073 1.073 0 01.39-1.462 1.073 1.073 0 011.462.391L8.5 4.952c.294.51.118 1.168-.391 1.463' opacity='.2'/%3E%3Cpath d='M10.43 5.792c-.589 0-1.07-.481-1.07-1.07V1.868c0-.589.481-1.07 1.07-1.07.588 0 1.07.481 1.07 1.07v2.854c0 .589-.482 1.07-1.07 1.07' opacity='.3'/%3E%3Cpath d='M15.32 2.132c.508.3.678.958.379 1.466l-1.45 2.458a1.074 1.074 0 01-1.465.378 1.072 1.072 0 01-.378-1.464l1.45-2.46a1.074 1.074 0 011.465-.378' opacity='.4'/%3E%3Cpath d='M18.768 5.61c.295.509.12 1.167-.39 1.461L15.905 8.5c-.509.295-1.167.12-1.462-.39a1.073 1.073 0 01.392-1.462l2.47-1.429a1.073 1.073 0 011.462.391' opacity='.5'/%3E%3Cpath d='M20.061 10.43c0 .588-.481 1.07-1.07 1.07h-2.854c-.588 0-1.07-.482-1.07-1.07 0-.589.482-1.07 1.07-1.07h2.854c.589 0 1.07.481 1.07 1.07' opacity='.6'/%3E%3Cpath d='M18.727 15.32a1.074 1.074 0 01-1.465.379l-2.459-1.45a1.073 1.073 0 01-.378-1.465 1.072 1.072 0 011.465-.378l2.459 1.45c.507.298.677.957.378 1.465' opacity='.7'/%3E%3Cpath d='M15.25 18.768c-.51.295-1.168.12-1.462-.39l-1.429-2.472a1.073 1.073 0 01.391-1.461 1.073 1.073 0 011.463.39l1.428 2.471c.294.51.119 1.167-.391 1.462' opacity='.8'/%3E%3Cpath d='M10.43 20.061c-.589 0-1.07-.481-1.07-1.07v-2.854c0-.588.481-1.07 1.07-1.07.588 0 1.07.482 1.07 1.07v2.854c0 .589-.482 1.07-1.07 1.07' opacity='.9'/%3E%3Cpath d='M8.075 14.425c.507.299.677.958.378 1.465L7.004 18.35a1.075 1.075 0 01-1.466.378 1.073 1.073 0 01-.378-1.465l1.45-2.46a1.074 1.074 0 011.465-.377' opacity='.95'/%3E%3Cpath d='M5.792 10.43c0 .588-.481 1.07-1.07 1.07H1.868c-.589 0-1.07-.482-1.07-1.07 0-.589.481-1.07 1.07-1.07h2.854c.589 0 1.07.481 1.07 1.07M6.415 12.75c.294.51.119 1.168-.391 1.462l-2.471 1.429a1.074 1.074 0 01-1.463-.391 1.073 1.073 0 01.392-1.462l2.47-1.429a1.073 1.073 0 011.463.391'/%3E%3C/g%3E%3C/svg%3E");
	--ui-btn-spinner: url("data:image/svg+xml;charset=utf-8,%3Csvg width='19' height='19' viewBox='25 25 50 50' xmlns='http://www.w3.org/2000/svg' style='-webkit-animation:rotate 2s linear infinite;animation:rotate 2s linear infinite;-webkit-transform-origin:center center;transform-origin:center center'%3E%3Cstyle%3E@keyframes rotate{to{transform:rotate(360deg)}}@keyframes dash{0%25{stroke-dasharray:1,200;stroke-dashoffset:0}50%25{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}%3C/style%3E%3Ccircle cx='50' cy='50' r='20' fill='none' stroke-miterlimit='10' style='-webkit-animation:dash 1.5s ease-in-out infinite;animation:dash 1.5s ease-in-out infinite' stroke='rgba(215,220,223,.74)' stroke-width='6' stroke-dasharray='20,200' stroke-linecap='round'/%3E%3C/svg%3E");
}

/*endregion*/

/*region Base style*/
.ui-btn-container {
	margin: 15px 0;
}

.ui-btn-container-center {
	text-align: center;
}

.ui-btn,
.ui-btn-main,
.ui-btn-extra,
.ui-btn-menu {
	box-sizing: border-box;
	margin: 0;
	outline: none;
	height: var(--ui-btn-height);
	border: var(--ui-btn-border);
	border-color: var(--ui-btn-border-color);
	background-color: var(--ui-btn-background);
	box-shadow: var(--ui-btn-box-shadow);
	text-shadow: var(--ui-btn-text-shadow);
	cursor: pointer;
	transition: 160ms linear background-color,
				160ms linear color,
				160ms linear opacity,
				160ms linear box-shadow,
				160ms linear border-color;
}

.ui-btn-menu.--switcher {
	cursor: default;
}

.ui-btn,
.ui-btn-main {
	position: relative;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	padding: var(--ui-btn-padding);
	color: var(--ui-btn-color);
	vertical-align: middle;
	text-align: center;
	-webkit-text-decoration: var(--ui-text-transform-none);
	        text-decoration: var(--ui-text-transform-none);
	text-transform: var(--ui-text-transform-uppercase);
	white-space: nowrap;
	font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
	font-size: var(--ui-btn-font-size);
	line-height: calc(var(--ui-btn-height) - 2px);
	font-weight: var(--ui-font-weight-bold);
	-webkit-user-select: none;
	user-select: none;
}

.ui-btn,
.ui-btn-split {
	line-height: calc(var(--ui-btn-height) - 2px);
	vertical-align: middle;
}

.ui-btn {
	border-radius: var(--ui-btn-radius)
}

.ui-btn-min {
	min-width: var(--ui-btn-min-width);
}

.ui-btn-split {
	position: relative;
	display: inline-flex;
	align-items: stretch;
	border-radius: var(--ui-btn-radius);
}

.ui-btn-main {
	padding-right: var(--ui-btn-padding-right);
	border-right: none !important;
	border-radius: var(--ui-btn-radius) 0 0 var(--ui-btn-radius);
	max-width: 100%;
	min-width: 0;
}

.ui-btn-extra,
.ui-btn-menu {
	position: relative;
	left: 0;
	top: 0;
	display: flex;
	flex-direction: row;
	align-items: center;
	min-width: var(--ui-btn-height);
	border-left: none !important;
	border-radius: 0 var(--ui-btn-radius) var(--ui-btn-radius) 0;
}

.ui-btn:hover,
a.ui-btn:focus,
.ui-btn-main:hover,
.ui-btn-main:focus,
.ui-btn-extra:hover,
.ui-btn-menu:not(.--switcher):hover,
.ui-btn.ui-btn-hover,
.ui-btn-hover .ui-btn-main,
.ui-btn-hover .ui-btn-extra,
.ui-btn-hover .ui-btn-menu,
.ui-btn-main-hover .ui-btn-main,
.ui-btn-extra-hover .ui-btn-extra,
.ui-btn-menu-hover .ui-btn-menu {
	border-color: var(--ui-btn-border-color-hover);
	background-color: var(--ui-btn-background-hover);
	box-shadow: var(--ui-btn-box-shadow-hover);
	color: var(--ui-btn-color-hover);
	-webkit-text-decoration: var(--ui-text-transform-none);
	        text-decoration: var(--ui-text-transform-none);
	text-shadow: var(--ui-btn-text-shadow-hover);
}

.ui-btn:active,
a.ui-btn:focus,
a.ui-btn-split:focus,
.ui-btn-main:active,
.ui-btn-menu:not(.--switcher):active,
.ui-btn-extra:active,
.ui-btn-wait.ui-btn,
.ui-btn-wait .ui-btn-main,
.ui-btn-clock.ui-btn,
.ui-btn-clock .ui-btn-main,
.ui-btn-active.ui-btn,
.ui-btn-active .ui-btn-main,
.ui-btn-active .ui-btn-menu,
.ui-btn-active .ui-btn-extra,
.ui-btn-main-active .ui-btn-main,
.ui-btn-menu-active .ui-btn-menu,
.ui-btn-extra-active .ui-btn-extra,
.ui-btn-wait.ui-btn:hover,
.ui-btn-wait .ui-btn-main:hover,
.ui-btn-clock.ui-btn:hover,
.ui-btn-clock .ui-btn-main:hover,
.ui-btn-active.ui-btn:hover,
.ui-btn-active .ui-btn-main:hover,
.ui-btn-active .ui-btn-menu:not(.--switcher):hover,
.ui-btn-active .ui-btn-extra:hover,
.ui-btn-main-active .ui-btn-main:hover,
.ui-btn-menu-active .ui-btn-menu:not(.--switcher):hover,
.ui-btn-extra-active .ui-btn-extra:hover {
	outline: none;
	border-color: var(--ui-btn-border-color-active);
	background-color: var(--ui-btn-background-active);
	box-shadow: var(--ui-btn-box-shadow-active);
	color: var(--ui-btn-color-active);
	text-shadow: var(--ui-btn-text-shadow-active);
}

.ui-btn-extra:after,
.ui-btn-menu:after {
	position: absolute;
	top: 7px;
	bottom: 6px;
	left: 0;
	width: 1px;
	background-color: var(--ui-btn-colors-after-bg);
	content: '';
	opacity: var(--ui-btn-opacity-after);
}

.ui-btn-extra:before,
.ui-btn-menu:before {
	position: absolute;
	top: 50%;
	left: 50%;
	box-sizing: border-box;
	margin-top: -2px;
	margin-left: -4px;
	width: 8px;
	border: 4px solid var(--ui-color-background-transparent);
	border-top-color: var(--ui-btn-colors-before-bg);
	background: none;
	content: '';
	transition: 160ms background-color linear, 160ms color linear, 160ms opacity linear, 160ms border-color linear;
}

.ui-btn-menu.--switcher::before {
	content: none;
}

.ui-btn ~ .ui-btn,
.ui-btn ~ .ui-btn-split,
.ui-btn ~ .ui-ctl,
.ui-btn-split ~ .ui-btn-split,
.ui-btn-split ~ .ui-btn,
.ui-btn-split ~ .ui-ctl,
.ui-ctl ~ .ui-btn,
.ui-ctl ~ .ui-btn-split,
.ui-ctl ~ .ui-ctl {
	margin-left: var(--ui-btn-margin-left);
}

.ui-btn-text {
	overflow: hidden;
	max-width: 100%;
	white-space: nowrap;
	text-overflow: ellipsis;
	display: block;
}

/*endregion*/

/*region Size*/
.ui-btn-md {
	--ui-btn-padding: 0 19px;
	--ui-btn-padding-right: 12px;
	--ui-btn-min-width: 80px;
	--ui-btn-height: var(--ui-btn-size-md);
	--ui-btn-font-size: var(--ui-font-size-xs);
}

.ui-btn-lg {
	--ui-btn-padding: 0 26px;
	--ui-btn-padding-right: 12px;
	--ui-btn-min-width: 90px;
	--ui-btn-height: var(--ui-btn-size-lg);
	--ui-btn-font-size: var(--ui-font-size-xs);
}

.ui-btn-sm {
	--ui-btn-padding: 0 17px;
	--ui-btn-padding-right: 10px;
	--ui-btn-min-width: 70px;
	--ui-btn-height: var(--ui-btn-size-sm);
	--ui-btn-font-size: var(--ui-font-size-xs);
}

.ui-btn-xs {
	--ui-btn-padding: 0 15px;
	--ui-btn-padding-right: 9px;
	--ui-btn-min-width: 66px;
	--ui-btn-height: var(--ui-btn-size-xs);
	--ui-btn-font-size: var(--ui-font-size-3xs);
}

.ui-btn-xss {
	--ui-btn-padding: 0 15px;
	--ui-btn-padding-right: 9px;
	--ui-btn-min-width: 66px;
	--ui-btn-height: var(--ui-btn-size-xss);
	--ui-btn-font-size: var(--ui-font-size-3xs);
}

.ui-btn-split.ui-btn-lg {
	padding-right: 33px;
}

.ui-btn-lg.ui-btn:not(.ui-btn-round) {
	--ui-btn-radius: var(--ui-border-radius-2xs);
}

.ui-btn-lg:not(.ui-btn-round) .ui-btn-main {
	--ui-btn-radius: var(--ui-border-radius-2xs);
}

.ui-btn-lg.ui-btn-split {
	/*padding-right: 34px;*/
}

.ui-btn-lg .ui-btn-extra,
.ui-btn-lg .ui-btn-menu {
	min-width: 34px;
}

.ui-btn-lg:not(.ui-btn-round) .ui-btn-extra,
.ui-btn-lg:not(.ui-btn-round) .ui-btn-menu {
	--ui-btn-radius: var(--ui-border-radius-2xs);
}

.ui-btn-sm.ui-btn-split {
	/*padding-right: 28px;*/
}

.ui-btn-sm .ui-btn-extra,
.ui-btn-sm .ui-btn-menu {
	min-width: 28px;
}

.ui-btn-sm:not(.ui-btn-round) .ui-btn-extra,
.ui-btn-sm:not(.ui-btn-round) .ui-btn-menu {
	--ui-btn-radius: var(--ui-border-radius-2xs);
}

.ui-btn-lg .ui-btn-extra:before,
.ui-btn-lg .ui-btn-menu:before {
	margin-top: -3px;
}

.ui-btn-lg .ui-btn-extra:after,
.ui-btn-lg .ui-btn-menu:after {
	top: 11px;
	bottom: 10px;
	opacity: .25;
}

/*endregion*/

/*region Colors*/
/*region Color Variables*/
.ui-btn-default { /* default variables */ }

.ui-btn-success {
	--ui-btn-background: #bbed21;
	--ui-btn-background-hover: #d2f95f;
	--ui-btn-background-active: #b2e232;
	--ui-btn-border-color: #bbed21;
	--ui-btn-border-color-hover: #d2f95f;
	--ui-btn-border-color-active: #b2e232;
	--ui-btn-opacity-after: var(--ui-opacity-20);
	--ui-btn-colors-after-bg: var(--ui-color-base-90);
	--ui-btn-colors-before-bg: var(--ui-color-base-90);
	--ui-btn-color: var(--ui-color-base-90);
	--ui-btn-color-hover: var(--ui-color-base-90);
	--ui-btn-color-active: var(--ui-color-base-90);
}

.ui-btn-success-light {
	--ui-btn-background: rgba(223, 238, 175, var(--ui-opacity-80));
	--ui-btn-background-hover: #eaf5c5;
	--ui-btn-background-active: #d3e59a;
	--ui-btn-border-color: rgba(223, 238, 175, var(--ui-opacity-80));
	--ui-btn-border-color-hover: #eaf5c5;
	--ui-btn-border-color-active: #d3e59a;
	--ui-btn-opacity-after: var(--ui-opacity-20);
	--ui-btn-colors-after-bg: var(--ui-color-text-primary);
	--ui-btn-colors-before-bg: #a3bf63;
	--ui-btn-color: #668d13;
	--ui-btn-color-hover: #668d13;
	--ui-btn-color-active: #668d13;
}

.ui-btn-success-dark {
	--ui-btn-background: #86a732;
	--ui-btn-background-hover: #a2bf54;
	--ui-btn-background-active: #a2bf54;
	--ui-btn-border-color: #86a732;
	--ui-btn-border-color-hover: #a2bf54;
	--ui-btn-border-color-active: #a2bf54;
	--ui-btn-opacity-after: var(--ui-opacity-20);
	--ui-btn-colors-after-bg: var(--ui-color-on-primary);
	--ui-btn-colors-before-bg: #a3bf63;
	--ui-btn-color: var(--ui-color-on-primary);
	--ui-btn-color-hover: var(--ui-color-on-primary);
	--ui-btn-color-active: var(--ui-color-on-primary);
}

.ui-btn-danger {
	--ui-btn-background: #f1361a;
	--ui-btn-background-hover: #cc1c00;
	--ui-btn-background-active: #d24430;
	--ui-btn-border-color: #f1361a;
	--ui-btn-border-color-hover: #cc1c00;
	--ui-btn-border-color-active: #d24430;
	--ui-btn-opacity-after: var(--ui-opacity-30);
	--ui-btn-color: var(--ui-color-on-primary);
	--ui-btn-color-hover: var(--ui-color-on-primary);
	--ui-btn-color-active: var(--ui-color-on-primary);
}

.ui-btn-danger-dark {
	--ui-btn-background: #a21429;
	--ui-btn-background-hover: #c43d51;
	--ui-btn-background-active: #851021;
	--ui-btn-border-color: #a21429;
	--ui-btn-border-color-hover: #c43d51;
	--ui-btn-border-color-active: #851021;
	--ui-btn-opacity-after: var(--ui-opacity-30);
	--ui-btn-color: var(--ui-color-on-primary);
	--ui-btn-color-hover: var(--ui-color-on-primary);
	--ui-btn-color-active: var(--ui-color-on-primary);
}

.ui-btn-danger-light {
	--ui-btn-background: rgba(253, 202, 200, var(--ui-opacity-80));
	--ui-btn-background-hover: #ffdcdb;
	--ui-btn-background-active: #f2b6b3;
	--ui-btn-border-color: rgba(253, 202, 200, var(--ui-opacity-80));
	--ui-btn-border-color-hover: #ffdcdb;
	--ui-btn-border-color-active: #f2b6b3;
	--ui-btn-opacity-after: var(--ui-opacity-20);
	--ui-btn-colors-after-bg: var(--ui-color-text-primary);
	--ui-btn-colors-before-bg: #eb8783;
	--ui-btn-color: #d7413c;
	--ui-btn-color-hover: #d7413c;
	--ui-btn-color-active: #d7413c;
}

.ui-btn-primary {
	--ui-btn-background: #3bc8f5;
	--ui-btn-background-hover: #3eddff;
	--ui-btn-background-active: #12b1e3;
	--ui-btn-border-color: #3bc8f5;
	--ui-btn-border-color-hover: #3eddff;
	--ui-btn-border-color-active: #12b1e3;
	--ui-btn-color: var(--ui-color-on-primary);
	--ui-btn-color-hover: var(--ui-color-on-primary);
	--ui-btn-color-active: var(--ui-color-on-primary);
}

.ui-btn-primary-dark {
	--ui-btn-background: #399fc2;
	--ui-btn-background-hover: #37aed4;
	--ui-btn-background-active: #328ba9;
	--ui-btn-border-color: #399fc2;
	--ui-btn-border-color-hover: #37aed4;
	--ui-btn-border-color-active: #328ba9;
	--ui-btn-color: var(--ui-color-on-primary);
	--ui-btn-color-hover: var(--ui-color-on-primary);
	--ui-btn-color-active: var(--ui-color-on-primary);
}

.ui-btn-secondary {
	--ui-btn-background: #c5e7f4;
	--ui-btn-background-hover: #d1eef9;
	--ui-btn-background-active: #aee0f2;
	--ui-btn-border-color: #aee0f2;
	--ui-btn-border-color-hover: #aee0f2;
	--ui-btn-border-color-active: #aee0f2;
	--ui-btn-opacity-after: var(--ui-opacity-30);
	--ui-btn-colors-after-bg: var(--ui-color-base-90);
	--ui-btn-colors-before-bg: var(--ui-color-base-90);
	--ui-btn-color: var(--ui-color-base-90);
	--ui-btn-color-hover: var(--ui-color-base-90);
	--ui-btn-color-active: var(--ui-color-base-90);
}

.ui-btn-secondary-light {
	--ui-btn-background: rgba(182, 237, 255, var(--ui-opacity-80));
	--ui-btn-background-hover: #d1eef9;
	--ui-btn-background-active: #aee0f2;
	--ui-btn-border-color: rgba(182, 237, 255, var(--ui-opacity-80));
	--ui-btn-border-color-hover: rgba(182, 237, 255, var(--ui-opacity-80));
	--ui-btn-border-color-active: rgba(182, 237, 255, var(--ui-opacity-80));
	--ui-btn-opacity-after: var(--ui-opacity-30);
	--ui-btn-colors-after-bg: var(--ui-color-base-90);
	--ui-btn-colors-before-bg: var(--ui-color-base-90);
	--ui-btn-color: #0aa0d0;
	--ui-btn-color-hover: #0aa0d0;
	--ui-btn-color-active: #0aa0d0;
}

.ui-btn-warning-light {
	--ui-btn-background: rgba(237, 218, 123, var(--ui-opacity-80));
	--ui-btn-background-hover: rgba(255, 169, 0, .65);
	--ui-btn-background-active: #eba51c;
	--ui-btn-border-color: rgba(237, 218, 123, var(--ui-opacity-80));
	--ui-btn-border-color-hover: rgba(237, 218, 123, var(--ui-opacity-80));
	--ui-btn-border-color-active: rgba(237, 218, 123, var(--ui-opacity-80));
	--ui-btn-opacity-after: var(--ui-opacity-30);
	--ui-btn-colors-after-bg: var(--ui-color-base-90);
	--ui-btn-colors-before-bg: var(--ui-color-base-90);
	--ui-btn-color: #a07f27;
	--ui-btn-color-hover: #a07f27;
	--ui-btn-color-active: #a07f27;
}

.ui-btn-link {
	--ui-btn-background: var(--ui-color-background-transparent);
	--ui-btn-background-hover: var(--ui-color-background-transparent);
	--ui-btn-background-active: var(--ui-color-background-transparent);
	--ui-btn-border-color: var(--ui-color-background-transparent);
	--ui-btn-border-color-hover: var(--ui-color-background-transparent);
	--ui-btn-border-color-active: var(--ui-color-background-transparent);
	--ui-btn-opacity-after: var(--ui-opacity-30);
	--ui-btn-colors-after-bg: var(--ui-color-base-90);
	--ui-btn-colors-before-bg: var(--ui-color-base-90);
	--ui-btn-color: var(--ui-color-base-90);
	--ui-btn-color-hover: #80868e;
	--ui-btn-color-active: var(--ui-color-base-90);
}

.ui-btn-light {
	--ui-btn-background: var(--ui-color-background-transparent);
	--ui-btn-background-hover: #f6f8f9;
	--ui-btn-background-active: #d6f1fb;
	--ui-btn-border-color: var(--ui-color-background-transparent);
	--ui-btn-border-color-hover: #f6f8f9;
	--ui-btn-border-color-active: #d6f1fb;
	--ui-btn-opacity-after: var(--ui-opacity-30);
	--ui-btn-colors-after-bg: var(--ui-color-base-90);
	--ui-btn-colors-before-bg: var(--ui-color-base-90);
	--ui-btn-color: var(--ui-color-base-90);
	--ui-btn-color-hover: var(--ui-color-text-primary);
	--ui-btn-color-active: var(--ui-color-base-solid);
	--ui-btn-padding: 0 6px;
	/*--ui-btn-margin-left: 18px;*/
}

.ui-btn-light-border {
	--ui-btn-background: var(--ui-color-background-transparent);
	--ui-btn-background-hover: #cfd4d8;
	--ui-btn-background-active: #dde2e5;
	--ui-btn-border-color: #c6cdd3;
	--ui-btn-border-color-hover: #c6cdd3;
	--ui-btn-border-color-active: #9fa4ab;
	--ui-btn-opacity-after: var(--ui-opacity-30);
	--ui-btn-colors-after-bg: var(--ui-color-base-90);
	--ui-btn-colors-before-bg: var(--ui-color-base-90);
	--ui-btn-color: var(--ui-color-base-90);
	--ui-btn-color-hover: var(--ui-color-base-90);
	--ui-btn-color-active: var(--ui-color-base-90);
}

.ui-btn-color-ai {
	--ui-btn-backgroud-color-ai: #935BEC;
	--ui-btn-backgroud-color-ai-hover: #A977FA;
	--ui-btn-backgroud-color-ai-active: #8447E4;
	--ui-btn-background: var(--ui-btn-backgroud-color-ai);
	--ui-btn-background-hover: var(--ui-btn-backgroud-color-ai-hover);
	--ui-btn-background-active: var(--ui-btn-backgroud-color-ai-active);
	--ui-btn-border-color: var(--ui-btn-backgroud-color-ai);
	--ui-btn-border-color-hover: var(--ui-btn-backgroud-color-ai-hover);
	--ui-btn-border-color-active: var(--ui-btn-backgroud-color-ai-active);
	--ui-btn-opacity-after: var(--ui-opacity-30);
	--ui-btn-colors-after-bg: var(--ui-color-on-primary);
	--ui-btn-colors-before-bg: var(--ui-color-on-primary);
	--ui-btn-color: var(--ui-color-on-primary);
	--ui-btn-color-hover: var(--ui-color-on-primary);
	--ui-btn-color-active: var(--ui-color-on-primary);
}

.ui-btn-base-light {
	--ui-btn-background: var(--ui-color-base-20);
	--ui-btn-background-hover: #cfd4d8;
	--ui-btn-background-active: #dde2e5;
	--ui-btn-border-color: var(--ui-color-base-20);
	--ui-btn-border-color-hover: #c6cdd3;
	--ui-btn-border-color-active: #9fa4ab;
	--ui-btn-opacity-after: var(--ui-opacity-30);
	--ui-btn-colors-after-bg: var(--ui-color-base-80);
	--ui-btn-colors-before-bg: var(--ui-color-base-80);
	--ui-btn-color: var(--ui-color-base-80);
	--ui-btn-color-hover: var(--ui-color-base-80);
	--ui-btn-color-active: var(--ui-color-base-80);
}

.ui-btn-collab {
	--ui-btn-background: #19CC45;
	--ui-btn-background-hover: #6BE860;
	--ui-btn-background-active: #00A94E;
	--ui-btn-border-color: var(--ui-color-background-transparent);
	--ui-btn-border-color-hover: var(--ui-color-background-transparent);
	--ui-btn-border-color-active: var(--ui-color-background-transparent);
	--ui-btn-color: var(--ui-color-palette-white-base);
	--ui-btn-color-hover: var(--ui-color-palette-white-base);
	--ui-btn-color-active: var(--ui-color-palette-white-base);
}

.ui-btn-primary-curtain {
	--ui-btn-background: #34B6DF;
	--ui-btn-background-hover: #37aed4;
	--ui-btn-background-active: #328ba9;
	--ui-btn-border-color: rgba(255, 255, 255, 0.8);
	--ui-btn-border-color-hover: rgba(255, 255, 255, 1);
	--ui-btn-border-color-active: rgba(255, 255, 255, 1);
	--ui-btn-color: var(--ui-color-on-primary);
	--ui-btn-color-hover: var(--ui-color-on-primary);
	--ui-btn-color-active: var(--ui-color-on-primary);
}

.ui-btn-primary-warning {
	--ui-btn-background: rgba(255, 255, 255, 0.15);
	--ui-btn-background-hover: rgba(255, 255, 255, 0.44);
	--ui-btn-background-active: rgba(255, 255, 255, 0.6);
	--ui-btn-border-color: rgba(255, 255, 255, 0.44);
	--ui-btn-border-color-hover: rgba(255, 255, 255, 1);
	--ui-btn-border-color-active: rgba(255, 255, 255, 1);
	--ui-btn-color: rgba(255, 255, 255, 1);
	--ui-btn-color-hover: rgba(255, 255, 255, 1);
	--ui-btn-color-active: rgba(255, 255, 255, 1);
}

.ui-btn-primary-border {
	--ui-btn-background: var(--ui-color-background-transparent);
	--ui-btn-background-hover: #cfd4d8;
	--ui-btn-background-active: #dde2e5;
	--ui-btn-border-color: var(--ui-color-primary);
	--ui-btn-border-color-hover: #c6cdd3;
	--ui-btn-border-color-active: #9fa4ab;
	--ui-btn-opacity-after: var(--ui-opacity-30);
	--ui-btn-colors-after-bg: var(--ui-color-base-90);
	--ui-btn-colors-before-bg: var(--ui-color-base-90);
	--ui-btn-color: var(--ui-color-base-90);
	--ui-btn-color-hover: var(--ui-color-base-90);
	--ui-btn-color-active: var(--ui-color-base-90);
}

/* hack for preloading icon */
.ui-btn-split.ui-btn-icon-ai .ui-btn-main::before:hover,
.ui-btn.ui-btn-icon-ai::before:hover {
	background-image: url(images/ui-btn-ai-waiting.gif?3);
}

.ui-btn-split.ui-btn-icon-ai .ui-btn-main::before,
.ui-btn.ui-btn-icon-ai::before {
	content: '';
	width: 100%;
	height: 24px;
	position: absolute;
	top: 0;
	left: 0;
	background-position: 5px center;
	background-repeat: no-repeat;
	background-size: 17px;
	background-color: transparent;
	opacity: 0;
	animation: fade-out-animated-icon 0.5s;
	animation-fill-mode: both;
	background-image: none;
}

@keyframes fade-out-animated-icon {
	0% {
		opacity: 1;
		transform: translateX(calc(50% - 12px));
		background-image: url(images/ui-btn-ai-waiting.gif?1);
	}

	90% {
		opacity: 0;
		transform: translateX(0);
		background-image: url(images/ui-btn-ai-waiting.gif?1);
	}

	100% {
		opacity: 0;
		transform: translateX(0);
		background-image: none;
	}
}

.ui-btn-split.ui-btn-icon-ai.ui-btn-ai-waiting .ui-btn-main::before,
.ui-btn.ui-btn-icon-ai.ui-btn-ai-waiting::before {
	animation: fade-in-animated-icon 0.5s both;
}

@keyframes fade-in-animated-icon {
	0% {
		left: 5px;
		opacity: 1;
		transform: translateX(0);
		background-image: url(images/ui-btn-ai-waiting.gif?3);
	}

	90% {
		left: 5px;
		opacity: 1;
		transform: translateX(calc(50% - 17px));
		background-image: url(images/ui-btn-ai-waiting.gif?3);
	}
	100% {
		left: 5px;
		opacity: 1;
		transform: translateX(calc(50% - 17px));
		background-image: url(images/ui-btn-ai-waiting.gif?3);
	}
}

.ui-btn-split.ui-btn-icon-ai.ui-btn-color-ai .ui-btn-main::after,
.ui-btn.ui-btn-icon-ai.ui-btn-color-ai::after {
	animation: fade-in-static-icon 0.5s forwards;
}

@keyframes fade-in-static-icon {
	0% {
		opacity: 0;
		transform: translateX(-50%) translateY(-50%);
		left: 50%;
	}

	90% {
		opacity: 1;
		left: 5px;
		transform: translateX(0) translateY(-50%);
	}

	100% {
		opacity: 1;
		left: 5px;
		transform: translateX(0) translateY(-50%);
	}
}

.ui-btn-split.ui-btn-icon-ai.ui-btn-ai-waiting .ui-btn-main::after,
.ui-btn.ui-btn-icon-ai.ui-btn-ai-waiting::after {
	animation: fade-out-static-icon 0.5s forwards;
}

@keyframes fade-out-static-icon {
	0% {
		opacity: 0;
		left: 5px;
		transform: translateX(0) translateY(-50%);
	}

	90% {
		opacity: 0;
		left: 50%;
		transform: translateX(-50%) translateY(-50%);
	}
	100% {
		opacity: 0;
		left: 50%;
		transform: translateX(-50%) translateY(-50%);
	}
}

.ui-btn-icon-ai .ui-btn-main .ui-btn-text,
.ui-btn-icon-ai .ui-btn-text {
	transition: 0.1s ease-in-out opacity;
	transition-delay: 0.4s;
}

.ui-btn-ai-waiting .ui-btn-main .ui-btn-text,
.ui-btn-ai-waiting .ui-btn-text {
	transition-delay: 0s;
	opacity: 0;
}

.ui-btn-ai-waiting .ui-btn-main,
.ui-btn-ai-waiting .ui-btn-menu,
.ui-btn-ai-waiting {
	opacity: 0.85;
	pointer-events: none;
}
/*endregion*/

/*region Button Color*/
/*region Link button*/
.ui-btn-link.ui-btn {
	padding-right: 0;
	padding-left: 0;
}

.ui-btn-link .ui-btn-main {
	padding-left: 0;
}

/*endregion*/

/*region Light-border button*/
/*region Fix for Themes*/
.bitrix24-light-theme .ui-btn-themes.ui-btn-link:not(.--air) {
	--ui-btn-color: #ebebeb;
	--ui-btn-color-hover: var(--ui-color-on-primary);
	--ui-btn-color-active: var(--ui-color-on-primary);
}

.bitrix24-light-theme .ui-btn-themes.ui-btn-light:not(.--air),
.bitrix24-light-theme .ui-btn-themes.ui-btn-light-border:not(.--air) {
	--ui-btn-background: rgba(var(--ui-color-on-primary-rgb), .15);
	--ui-btn-background-hover: rgba(var(--ui-color-on-primary-rgb), var(--ui-opacity-30));
	--ui-btn-background-active: rgba(var(--ui-color-on-primary-rgb), var(--ui-opacity-40));
	--ui-btn-colors-after-bg: var(--ui-color-on-primary);
	--ui-btn-colors-before-bg: var(--ui-color-on-primary);
	--ui-btn-color: var(--ui-color-on-primary);
	--ui-btn-color-hover: var(--ui-color-on-primary);
	--ui-btn-color-active: var(--ui-color-on-primary);
}

.bitrix24-light-theme .ui-btn-themes.ui-btn-light-border:not(.--air) {
	--ui-btn-border-color: rgba(var(--ui-color-on-primary-rgb), var(--ui-opacity-40));
}

.bitrix24-dark-theme .ui-btn-themes.ui-btn-link:not(.--air) {
	--ui-btn-color: rgba(var(--ui-color-base-default-rgb), var(--ui-opacity-80));
	--ui-btn-color-hover: rgba(var(--ui-color-base-default-rgb), var(--ui-opacity-80));
	--ui-btn-color-active: rgba(var(--ui-color-base-default-rgb), var(--ui-opacity-80));
}

.bitrix24-dark-theme .ui-btn-themes.ui-btn-light:not(.--air),
.bitrix24-dark-theme .ui-btn-themes.ui-btn-light-border:not(.--air) {
	--ui-btn-background: rgba(var(--ui-color-base-solid-rgb), .07);
	--ui-btn-background-hover: rgba(var(--ui-color-base-solid-rgb), var(--ui-opacity-10));
	--ui-btn-background-active: rgba(var(--ui-color-base-solid-rgb), .15);
	--ui-btn-colors-after-bg: rgba(var(--ui-color-base-default-rgb), var(--ui-opacity-80));
	--ui-btn-colors-before-bg: rgba(var(--ui-color-base-default-rgb), var(--ui-opacity-80));
	--ui-btn-color: rgba(var(--ui-color-base-default-rgb), var(--ui-opacity-80));
	--ui-btn-color-hover: rgba(var(--ui-color-base-default-rgb), var(--ui-opacity-80));
	--ui-btn-color-active: rgba(var(--ui-color-base-default-rgb), var(--ui-opacity-80));
}

.bitrix24-dark-theme .ui-btn-themes.ui-btn-light-border:not(.--air) {
	--ui-btn-border-color: rgba(var(--ui-color-base-solid-rgb), .06);
}

/*endregion*/

/*endregion*/

/*endregion*/

/*endregion*/

/*region Others*/
.ui-btn-round {
	--ui-btn-radius: calc(var(--ui-btn-height) / 2);
}

.ui-btn-no-caps,
.ui-btn-no-caps .ui-btn-main {
	text-transform: none;
}

.ui-btn-no-caps,
.ui-btn-no-caps .ui-btn-main {
	font-size: calc(var(--ui-btn-font-size) + 2px);
	font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
	font-weight: var(--ui-font-weight-semi-bold);
}


.ui-btn-shadow,
.ui-btn-shadow:hover,
.ui-btn-shadow.ui-btn-hover {
	box-shadow: 0 1px 2px 0 rgba(var(--ui-color-base-solid-rgb), .18);
}

.ui-btn-shadow:active,
.ui-btn-shadow.ui-btn-active {
	box-shadow: 0 0 1px 0 rgba(var(--ui-color-base-solid-rgb), .18);
}

/*region Counter*/
.ui-btn-counter {
	display: inline-block;
	padding: 0 8px;
	border-radius: var(--ui-border-radius-md);
	background-color: #f34829;
	color: var(--ui-color-on-primary);
	vertical-align: middle;
	font-family: var(--ui-font-family-secondary, var(--ui-font-family-open-sans));
	font-size: 11px;
	line-height: 19px;
	font-weight: var(--ui-font-weight-regular);
}

.ui-btn-text + .ui-btn-counter {
	margin-left: 12px;
}

.ui-btn-lg .ui-btn-counter {
	margin-left: 15px;
}

/*endregion*/

/*region Dropdown*/
.ui-btn.ui-btn-dropdown,
.ui-btn-dropdown .ui-btn-main {
	padding-right: 29px;
}

.ui-btn.ui-btn-dropdown:before,
.ui-btn-dropdown .ui-btn-main:before {
	position: absolute;
	top: 50%;
	right: 13px;
	display: block;
	box-sizing: border-box;
	margin-top: -1.5px;
	width: 8px;
	height: 8px;
	border-bottom: 2px solid;
	border-left: 2px solid;
	content: '';
	transform: translateY(-50%) rotate(-45deg);
}

.ui-btn.ui-btn-dropdown:before,
.ui-btn-dropdown .ui-btn-main:before {
	border-color: var(--ui-btn-color);
}

.ui-btn.ui-btn-empty.ui-btn-dropdown:before,
.ui-btn.ui-btn-collapsed.ui-btn-dropdown::before,
.ui-btn-empty.ui-btn-dropdown .ui-btn-main:before,
.ui-btn-collapsed.ui-btn-dropdown .ui-btn-main:before {
	right: auto;
	transform: translate(-50%, -50%) rotate(-45deg);
	left: 50%;
}

.ui-btn.ui-btn-empty.ui-btn-dropdown[class*="ui-btn-icon-"]:before,
.ui-btn.ui-btn-collapsed.ui-btn-dropdown[class*="ui-btn-icon-"]:before,
.ui-btn-empty.ui-btn-dropdown[class*="ui-btn-icon-"] .ui-btn-main:before,
.ui-btn-collapsed.ui-btn-dropdown[class*="ui-btn-icon-"] .ui-btn-main:before {
	right: 12px;
	transform: translateY(-50%) rotate(-45deg);
	left: auto;
}

/*endregion*/

/*region Disabled*/
.ui-btn.ui-btn-disabled,
.ui-btn.ui-btn-disabled:hover,
.ui-btn.ui-btn-disabled:active,
.ui-btn[disabled],
.ui-btn[disabled]:hover,
.ui-btn[disabled]:active,
.ui-btn-disabled .ui-btn-main,
.ui-btn-disabled .ui-btn-main:hover,
.ui-btn-disabled .ui-btn-main:active,
.ui-btn-disabled .ui-btn-extra,
.ui-btn-disabled .ui-btn-extra:hover,
.ui-btn-disabled .ui-btn-extra:active,
.ui-btn-disabled .ui-btn-menu,
.ui-btn-disabled .ui-btn-menu:hover,
.ui-btn-disabled .ui-btn-menu:active,
.ui-btn-main-disabled .ui-btn-main,
.ui-btn-main-disabled .ui-btn-main:hover,
.ui-btn-main-disabled .ui-btn-main:active,
.ui-btn-extra-disabled .ui-btn-extra,
.ui-btn-extra-disabled .ui-btn-extra:hover,
.ui-btn-extra-disabled .ui-btn-extra:active,
.ui-btn-menu-disabled .ui-btn-menu,
.ui-btn-menu-disabled .ui-btn-menu:hover,
.ui-btn-menu-disabled .ui-btn-menu:active {
	opacity: var(--ui-opacity-40);
	cursor: not-allowed;
	background-color: var(--ui-btn-background);
	border-color: var(--ui-btn-border-color);
}

/*endregion*/

/*region Wait*/
.ui-btn.ui-btn-wait,
.ui-btn-wait .ui-btn-main {
	background-position: center !important;
	background-repeat: no-repeat !important;
	color: transparent !important;
}

.ui-btn.ui-btn-wait:after,
.ui-btn-wait .ui-btn-main:after {
	opacity: 0;
}

.ui-btn-wait,
.ui-btn-wait.ui-btn-danger,
.ui-btn-wait.ui-btn-primary,
.ui-btn-wait.ui-btn-default,
.ui-btn-wait.ui-btn-danger-dark,
.ui-btn-wait.ui-btn-success-dark,
.ui-btn-wait.ui-btn-primary-dark {
	--ui-btn-wait-loader: var(--ui-btn-wait-white);
}

.ui-btn-wait.ui-btn-link,
.ui-btn-wait.ui-btn-secondary,
.ui-btn-wait.ui-btn-light,
.ui-btn-wait.ui-btn-success,
.ui-btn-wait.ui-btn-light-border,
.ui-btn-wait.ui-btn-link {
	--ui-btn-wait-loader: var(--ui-btn-wait-black);
}

.ui-btn.ui-btn-wait,
.ui-btn-wait .ui-btn-main {
	background-image: var(--ui-btn-wait-loader);
}

/*endregion*/

/*region Clock*/
.ui-btn.ui-btn-clock,
.ui-btn-split.ui-btn-clock .ui-btn-main {
	background-position: center !important;
	background-repeat: no-repeat !important;
	color: transparent !important;
}

.ui-btn.ui-btn-clock:after,
.ui-btn-split.ui-btn-clock .ui-btn-main:after {
	opacity: 0;
}

.ui-btn-clock,
.ui-btn-clock.ui-btn-danger,
.ui-btn-clock.ui-btn-primary,
.ui-btn-clock.ui-btn-default,
.ui-btn-clock.ui-btn-danger-dark,
.ui-btn-clock.ui-btn-success-dark,
.ui-btn-clock.ui-btn-primary-dark {
	--ui-btn-clock-loader: var(--ui-btn-clock-white);
}

.ui-btn-clock.ui-btn-link,
.ui-btn-clock.ui-btn-secondary,
.ui-btn-clock.ui-btn-light,
.ui-btn-clock.ui-btn-success,
.ui-btn-clock.ui-btn-light-border,
.ui-btn-clock.ui-btn-link {
	--ui-btn-clock-loader: var(--ui-btn-clock-black);
}

.ui-btn.ui-btn-clock,
.ui-btn-clock .ui-btn-main {
	background-image: var(--ui-btn-clock-loader);
}

/*endregion*/

/* region Loading spinner */

.ui-btn.ui-btn-spinner,
.ui-btn-split.ui-btn-spinner .ui-btn-main {
	background-position: center !important;
	background-repeat: no-repeat !important;
	color: transparent !important;
}

.ui-btn.ui-btn-spinner:after,
.ui-btn-split.ui-btn-spinner .ui-btn-main:after {
	opacity: 0;
}

.ui-btn-spinner,
.ui-btn-spinner.ui-btn-danger,
.ui-btn-spinner.ui-btn-primary,
.ui-btn-spinner.ui-btn-default,
.ui-btn-spinner.ui-btn-danger-dark,
.ui-btn-spinner.ui-btn-success-dark,
.ui-btn-spinner.ui-btn-primary-dark {
	--ui-btn-clock-loader: var(--ui-btn-spinner);
}

.ui-btn-spinner.ui-btn-link,
.ui-btn-spinner.ui-btn-secondary,
.ui-btn-spinner.ui-btn-light,
.ui-btn-spinner.ui-btn-success,
.ui-btn-spinner.ui-btn-light-border,
.ui-btn-spinner.ui-btn-link {
	--ui-btn-clock-loader: var(--ui-btn-spinner);
}

.ui-btn.ui-btn-spinner,
.ui-btn-spinner .ui-btn-main {
	background-image: var(--ui-btn-spinner);
}

/*endregion*/

/*endregion*/

/*region Links*/
:root {
	--ui-link-color: #216bb6;
	--ui-link-border-color: #216bb6;
}

.ui-link,
*.ui-link:hover {
	cursor: pointer;
	font-family: var(--ui-font-family-primary, var(--ui-font-family-helvetica));
	font-size: 13px;
	line-height: 22px;
	color: var(--ui-link-color);
	transition: 250ms linear color, 250ms linear border-color;
}

.ui-link + .ui-link,
.ui-link + script + .ui-link {
	margin-left: 12px;
}

.ui-link,
.ui-link-primary {
	--ui-link-color: #216bb6;
	--ui-link-border-color: #216bb6
}

.ui-link:hover,
.ui-link-primary:hover {
	--ui-link-color: #2067b0;
	--ui-link-border-color: #2067b0
}

.ui-link-secondary {
	--ui-link-color: #80868e;
	--ui-link-border-color: #d8d8d8
}

.ui-link-secondary:hover {
	--ui-link-color: #333;
	--ui-link-border-color: #333
}

.ui-link-dark {
	--ui-link-color: #333;
	--ui-link-border-color: #333
}

.ui-link-dark:hover {
	--ui-link-color: #000;
	--ui-link-border-color: #000
}

.ui-link-solid {
	border-bottom: 1px solid var(--ui-link-border-color);
}

.ui-link-dashed {
	border-bottom: 1px dashed var(--ui-link-border-color);
}

.ui-link-dotted {
	border-bottom: 1px dotted var(--ui-link-border-color);
}

.ui-button__shimmer {
	position: absolute;
	inset: 0;
	z-index: 0;
	border-radius: var(--ui-btn-radius);
	overflow: hidden;
	pointer-events: none;
}

.ui-button__shimmer::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	height: var(--ui-btn-height);
	width: 110px;
	transform: translateX(-110px);
	background: linear-gradient(128deg, rgba(255, 255, 255, 0) 34.39%, #FFFFFF 48.22%, rgba(255, 255, 255, 0) 62.72%);
	opacity: var(--ui-opacity-40);
	animation: ui-button-shimmer 4s linear 0s 1, ui-button-shimmer 4s linear 8s 10;
}

.ui-btn-collapsed .ui-button__shimmer::before {
	animation: ui-button-shimmer 7s linear 0s 1, ui-button-shimmer 7s linear 8s 10;
}

@keyframes ui-button-shimmer {
	0% {
		transform: translateX(-110px);
	}
	20% {
		transform: translateX(calc(100% + 110px));
	}
	100% {
		transform: translateX(calc(100% + 110px));
	}
}

/*endregion*/

.ui-btn.--air,
.ui-btn-split.--air,
.ui-btn-split.--air .ui-btn-main,
.ui-btn-split.--air .ui-btn-menu {
	/*size*/
	--ui-btn-size-xss: 20px;
	--ui-btn-size-xs: 24px;
	--ui-btn-size-sm: 28px;
	--ui-btn-size-md: 34px;
	--ui-btn-size-lg: 38px;
	--ui-btn-size-xl: 46px;

	--ui-btn-letter-spacing: -0.05;

	/*default param*/
	--ui-btn-icon-size: 20px;

	--ui-btn-title-comensation: -1px;
	--ui-btn-padding: 0 var(--ui-btn-padding-right) 0 var(--ui-btn-padding-left);
	--ui-btn-min-width: 80px;
	--ui-btn-background: #868d95;
	--ui-btn-background-hover: color-mix(in srgb, var(--ui-btn-background) 100%, var(--ui-color-bg-state-hover-default-hex) var(--ui-color-bg-state-hover-default-opacity));
	--ui-btn-background-active: color-mix(in srgb, var(--ui-btn-background) 100%, var(--ui-color-bg-state-click-default-hex) var(--ui-color-bg-state-click-default-opacity));
	--ui-btn-border-color: var(--ui-btn-background);
	--ui-btn-border-color-hover: color-mix(in srgb, var(--ui-btn-border-color) 100%, var(--ui-color-bg-state-hover-default-hex) var(--ui-color-bg-state-hover-default-opacity));
	--ui-btn-border-color-active: color-mix(in srgb, var(--ui-btn-border-color) 100%, var(--ui-color-bg-state-click-default-hex) var(--ui-color-bg-state-click-default-opacity));
	--ui-btn-border-width: 0px;
	--ui-btn-border: var(--ui-btn-border-width) solid var(--ui-btn-border-color);
	--ui-btn-opacity-after: var(--ui-opacity-30);
	--ui-btn-colors-after-bg: var(--ui-color-on-primary);
	--ui-btn-colors-before-bg: var(--ui-color-on-primary);
	--ui-btn-color: var(--ui-color-on-primary);
	--ui-btn-color-hover: var(--ui-btn-color);
	--ui-btn-color-active: var(--ui-btn-color);
	--ui-btn-box-shadow: none;
	--ui-btn-box-shadow-hover: none;
	--ui-btn-box-shadow-active: none;
	--ui-btn-text-shadow: none;
	--ui-btn-text-shadow-hover: none;
	--ui-btn-text-shadow-active: none;
	--ui-btn-margin-left: 12px;
	/**/
	--ui-btn-clock-white: url("data:image/svg+xml;charset=utf-8,%3Csvg width='19' height='19' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3E@keyframes arrow-loader{0%25{transform:rotate(0deg)}to{transform:rotate(360deg)}}%3C/style%3E%3Cg style='animation:arrow-loader 1s infinite linear;transform-origin:center' stroke='%23fff'%3E%3Cpath fill='none' d='M.5 9.475a8.976 8.976 0 0117.95 0 8.976 8.976 0 01-17.95 0z'/%3E%3Cpath d='M9.5 4v5.5'/%3E%3C/g%3E%3Cpath stroke='%23fff' fill='transparent' d='M15 9.5H9.5'/%3E%3C/svg%3E");
	--ui-btn-clock-black: url("data:image/svg+xml;charset=utf-8,%3Csvg width='19' height='19' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3E@keyframes arrow-loader{0%25{transform:rotate(0deg)}to{transform:rotate(360deg)}}%3C/style%3E%3Cg style='animation:arrow-loader 1s infinite linear;transform-origin:center' stroke='%23525C69'%3E%3Cpath fill='none' d='M.5 9.475a8.976 8.976 0 0117.95 0 8.976 8.976 0 01-17.95 0z'/%3E%3Cpath d='M9.5 4v5.5'/%3E%3C/g%3E%3Cpath stroke='%23525C69' d='M15 9.5H9.5'/%3E%3C/svg%3E");
	--ui-btn-wait-white: url("data:image/svg+xml;charset=utf-8,%3Csvg width='21' height='21' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3E@keyframes waitLoader{0%25{transform:rotate(0deg)}to{transform:rotate(360deg)}}%3C/style%3E%3Cg fill='%23fff' style='-moz-transform-origin:50%25;transform-origin:50%25;animation:waitLoader 1s infinite steps(12)'%3E%3Cpath d='M6.434 8.075a1.073 1.073 0 01-1.465.378L2.51 7.004a1.075 1.075 0 01-.378-1.466 1.073 1.073 0 011.465-.378l2.46 1.45c.506.298.676.958.377 1.465' opacity='.1'/%3E%3Cpath d='M8.109 6.415c-.51.294-1.168.119-1.462-.391L5.219 3.553a1.073 1.073 0 01.39-1.462 1.073 1.073 0 011.462.391L8.5 4.952c.294.51.118 1.168-.391 1.463' opacity='.2'/%3E%3Cpath d='M10.43 5.792c-.589 0-1.07-.481-1.07-1.07V1.868c0-.589.481-1.07 1.07-1.07.588 0 1.07.481 1.07 1.07v2.854c0 .589-.482 1.07-1.07 1.07' opacity='.3'/%3E%3Cpath d='M15.32 2.132c.508.3.678.958.379 1.466l-1.45 2.458a1.074 1.074 0 01-1.465.378 1.072 1.072 0 01-.378-1.464l1.45-2.46a1.074 1.074 0 011.465-.378' opacity='.4'/%3E%3Cpath d='M18.768 5.61c.295.509.12 1.167-.39 1.461L15.905 8.5c-.509.295-1.167.12-1.462-.39a1.073 1.073 0 01.392-1.462l2.47-1.429a1.073 1.073 0 011.462.391' opacity='.5'/%3E%3Cpath d='M20.061 10.43c0 .588-.481 1.07-1.07 1.07h-2.854c-.588 0-1.07-.482-1.07-1.07 0-.589.482-1.07 1.07-1.07h2.854c.589 0 1.07.481 1.07 1.07' opacity='.6'/%3E%3Cpath d='M18.727 15.32a1.074 1.074 0 01-1.465.379l-2.459-1.45a1.073 1.073 0 01-.378-1.465 1.072 1.072 0 011.465-.378l2.459 1.45c.507.298.677.957.378 1.465' opacity='.7'/%3E%3Cpath d='M15.25 18.768c-.51.295-1.168.12-1.462-.39l-1.429-2.472a1.073 1.073 0 01.391-1.461 1.073 1.073 0 011.463.39l1.428 2.471c.294.51.119 1.167-.391 1.462' opacity='.8'/%3E%3Cpath d='M10.43 20.061c-.589 0-1.07-.481-1.07-1.07v-2.854c0-.588.481-1.07 1.07-1.07.588 0 1.07.482 1.07 1.07v2.854c0 .589-.482 1.07-1.07 1.07' opacity='.9'/%3E%3Cpath d='M8.075 14.425c.507.299.677.958.378 1.465L7.004 18.35a1.075 1.075 0 01-1.466.378 1.073 1.073 0 01-.378-1.465l1.45-2.46a1.074 1.074 0 011.465-.377' opacity='.95'/%3E%3Cpath d='M5.792 10.43c0 .588-.481 1.07-1.07 1.07H1.868c-.589 0-1.07-.482-1.07-1.07 0-.589.481-1.07 1.07-1.07h2.854c.589 0 1.07.481 1.07 1.07M6.415 12.75c.294.51.119 1.168-.391 1.462l-2.471 1.429a1.074 1.074 0 01-1.463-.391 1.073 1.073 0 01.392-1.462l2.47-1.429a1.073 1.073 0 011.463.391'/%3E%3C/g%3E%3C/svg%3E");
	--ui-btn-wait-black: url("data:image/svg+xml;charset=utf-8,%3Csvg width='21' height='21' xmlns='http://www.w3.org/2000/svg'%3E%3Cstyle%3E@keyframes waitLoader{0%25{transform:rotate(0deg)}to{transform:rotate(360deg)}}%3C/style%3E%3Cg fill='%23535c69' style='-moz-transform-origin:50%25;transform-origin:50%25;animation:waitLoader 1s infinite steps(12)'%3E%3Cpath d='M6.434 8.075a1.073 1.073 0 01-1.465.378L2.51 7.004a1.075 1.075 0 01-.378-1.466 1.073 1.073 0 011.465-.378l2.46 1.45c.506.298.676.958.377 1.465' opacity='.1'/%3E%3Cpath d='M8.109 6.415c-.51.294-1.168.119-1.462-.391L5.219 3.553a1.073 1.073 0 01.39-1.462 1.073 1.073 0 011.462.391L8.5 4.952c.294.51.118 1.168-.391 1.463' opacity='.2'/%3E%3Cpath d='M10.43 5.792c-.589 0-1.07-.481-1.07-1.07V1.868c0-.589.481-1.07 1.07-1.07.588 0 1.07.481 1.07 1.07v2.854c0 .589-.482 1.07-1.07 1.07' opacity='.3'/%3E%3Cpath d='M15.32 2.132c.508.3.678.958.379 1.466l-1.45 2.458a1.074 1.074 0 01-1.465.378 1.072 1.072 0 01-.378-1.464l1.45-2.46a1.074 1.074 0 011.465-.378' opacity='.4'/%3E%3Cpath d='M18.768 5.61c.295.509.12 1.167-.39 1.461L15.905 8.5c-.509.295-1.167.12-1.462-.39a1.073 1.073 0 01.392-1.462l2.47-1.429a1.073 1.073 0 011.462.391' opacity='.5'/%3E%3Cpath d='M20.061 10.43c0 .588-.481 1.07-1.07 1.07h-2.854c-.588 0-1.07-.482-1.07-1.07 0-.589.482-1.07 1.07-1.07h2.854c.589 0 1.07.481 1.07 1.07' opacity='.6'/%3E%3Cpath d='M18.727 15.32a1.074 1.074 0 01-1.465.379l-2.459-1.45a1.073 1.073 0 01-.378-1.465 1.072 1.072 0 011.465-.378l2.459 1.45c.507.298.677.957.378 1.465' opacity='.7'/%3E%3Cpath d='M15.25 18.768c-.51.295-1.168.12-1.462-.39l-1.429-2.472a1.073 1.073 0 01.391-1.461 1.073 1.073 0 011.463.39l1.428 2.471c.294.51.119 1.167-.391 1.462' opacity='.8'/%3E%3Cpath d='M10.43 20.061c-.589 0-1.07-.481-1.07-1.07v-2.854c0-.588.481-1.07 1.07-1.07.588 0 1.07.482 1.07 1.07v2.854c0 .589-.482 1.07-1.07 1.07' opacity='.9'/%3E%3Cpath d='M8.075 14.425c.507.299.677.958.378 1.465L7.004 18.35a1.075 1.075 0 01-1.466.378 1.073 1.073 0 01-.378-1.465l1.45-2.46a1.074 1.074 0 011.465-.377' opacity='.95'/%3E%3Cpath d='M5.792 10.43c0 .588-.481 1.07-1.07 1.07H1.868c-.589 0-1.07-.482-1.07-1.07 0-.589.481-1.07 1.07-1.07h2.854c.589 0 1.07.481 1.07 1.07M6.415 12.75c.294.51.119 1.168-.391 1.462l-2.471 1.429a1.074 1.074 0 01-1.463-.391 1.073 1.073 0 01.392-1.462l2.47-1.429a1.073 1.073 0 011.463.391'/%3E%3C/g%3E%3C/svg%3E");
	--ui-btn-spinner: url("data:image/svg+xml;charset=utf-8,%3Csvg width='19' height='19' viewBox='25 25 50 50' xmlns='http://www.w3.org/2000/svg' style='-webkit-animation:rotate 2s linear infinite;animation:rotate 2s linear infinite;-webkit-transform-origin:center center;transform-origin:center center'%3E%3Cstyle%3E@keyframes rotate{to{transform:rotate(360deg)}}@keyframes dash{0%25{stroke-dasharray:1,200;stroke-dashoffset:0}50%25{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}%3C/style%3E%3Ccircle cx='50' cy='50' r='20' fill='none' stroke-miterlimit='10' style='-webkit-animation:dash 1.5s ease-in-out infinite;animation:dash 1.5s ease-in-out infinite' stroke='rgba(215,220,223,.74)' stroke-width='6' stroke-dasharray='20,200' stroke-linecap='round'/%3E%3C/svg%3E");
}

.ui-btn.--wide {
	width: 100%;
}

.ui-btn.--air.--remove-left-corners {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

.ui-btn.--air.--remove-right-corners {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}

.ui-btn.--air,
.ui-btn-split.--air .ui-btn-main,
.ui-btn-split.--air .ui-btn-menu,
.ui-btn-split.--air .ui-btn-extra {
	transition-duration: 0s;
	font-family: var(--ui-font-family-primary);
	border-radius: var(--ui-btn-radius);
	background-image: none;
}

.ui-btn.--air,
.ui-btn-split.--air {
	-webkit-backdrop-filter: var(--ui-bg-blur-content);
	        backdrop-filter: var(--ui-bg-blur-content);
}

.ui-btn-split.--air .ui-btn-main {
	border-right: none;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}

.ui-btn-split.--air .ui-btn-menu {
	border-left: none;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}

.ui-btn.--air,
.ui-btn.--air[class*="ui-btn-icon-"],
.ui-btn.--air[class*="ui-btn-icon-"]:not(.--with-collapsed-icon),
.ui-btn-split.--air .ui-btn-main,
.ui-btn-split.--air[class*="ui-btn-icon-"] .ui-btn-main,
.ui-btn-split.--air[class*="ui-btn-icon-"]:not(.--with-collapsed-icon) .ui-btn-main {
	background-image: none;
	margin-left: 0;
	font-weight: var(--ui-btn-font-weight);
	font-size: var(--ui-btn-font-size);
	line-height: var(--ui-btn-height);
	padding-left: var(--ui-btn-padding-left);
	padding-right: var(--ui-btn-padding-right);
}

.ui-btn.--air ~ .ui-btn.--air,
.ui-btn.--air ~ .ui-btn-split.--air,
.ui-btn.--air ~ .ui-ctl.--air,
.ui-btn-split.--air ~ .ui-btn-split.--air,
.ui-btn-split.--air ~ .ui-btn.--air,
.ui-btn-split.--air ~ .ui-ctl.--air,
.ui-ctl.--air ~ .ui-btn.--air,
.ui-ctl.--air ~ .ui-btn-split.--air,
.ui-ctl.--air ~ .ui-ctl.--air {
	margin-left: 0;
}

.ui-btn-split.--air:not(.ui-btn-dropdown),
.ui-btn-split.--air .ui-btn-menu:not(.ui-btn-dropdown) {
	content: none;
}

/*region Size*/

.ui-btn.--air.ui-btn-xl,
.ui-btn-split.--air.ui-btn-xl,
.ui-btn-split.--air.ui-btn-xl .ui-btn-main,
.ui-btn-split.--air.ui-btn-xl .ui-btn-menu {
	--ui-btn-padding-right: 23px;
	--ui-btn-padding-left: 23px;
	--ui-btn-icon-compensation: 8px;
	--ui-btn-radius: var(--ui-border-radius-md);
	--ui-btn-font-size: var(--ui-font-size-xl);
	--ui-btn-icon-size: 28px;
	--ui-btn-icon-space: 4px;
	--ui-btn-dropdown-icon-size: 22px;
	--ui-btn-dropdown-icon-inline-space: 6px;
	--ui-btn-dropdown-icon-compensation: 6px;
	--ui-btn-height: var(--ui-btn-size-xl);
	--ui-btn-wait-icon-size: 24px;
	--ui-btn-split-divider-height: 26px;
	--ui--btn-width-with-only-icon: var(--ui-btn-height);
	--ui-btn-corner-counter-inline-shift: 13px;
	--ui-btn-counter-inline-space: 8px;
}

.ui-btn-split.--air.ui-btn-xl .ui-btn-menu.--switcher {
	padding-left: 14px;
	padding-right: 14px;
}

/* default button size */
.ui-btn.--air.ui-btn-lg,
.ui-btn-split.--air.ui-btn-lg,
.ui-btn-split.--air.ui-btn-lg .ui-btn-main,
.ui-btn-split.--air.ui-btn-lg .ui-btn-menu {
	--ui-btn-padding-right: 17px;
	--ui-btn-padding-left: 17px;
	--ui-btn-icon-compensation: 10px;
	--ui-btn-radius: var(--ui-border-radius-md);
	--ui-btn-font-size: var(--ui-font-size-lg);
	--ui-btn-icon-size: 28px;
	--ui-btn-icon-space: 4px;
	--ui-btn-dropdown-icon-size: 20px;
	--ui-btn-dropdown-icon-inline-space: 6px;
	--ui-btn-dropdown-icon-compensation: 6px;
	--ui-btn-height: var(--ui-btn-size-lg);
	--ui-btn-wait-icon-size: 22px;
	--ui-btn-split-divider-height: 22px;
	--ui-btn-letter-spacing: -0.1px;
	--ui--btn-width-with-only-icon: var(--ui-btn-height);
	--ui-btn-corner-counter-inline-shift: 12px;
	--ui-btn-counter-inline-space: 8px;
}

.ui-btn-split.--air.ui-btn-lg .ui-btn-menu.--switcher {
	padding-left: 12px;
	padding-right: 12px;
}

.ui-btn.--air,
.ui-btn-split.--air,
.ui-btn-split.--air .ui-btn-main,
.ui-btn-split.--air .ui-btn-menu,
.ui-btn.--air.ui-btn-md,
.ui-btn-split.--air.ui-btn-md,
.ui-btn-split.--air.ui-btn-md .ui-btn-main,
.ui-btn-split.--air.ui-btn-md .ui-btn-menu {
	--ui-btn-padding-right: 13px;
	--ui-btn-padding-left: 13px;
	--ui-btn-icon-compensation: 6px;
	--ui-btn-radius: var(--ui-border-radius-md);
	--ui-btn-font-size: var(--ui-font-size-md);
	--ui-btn-font-weight: var(--ui-font-weight-medium);
	--ui-btn-icon-size: 24px;
	--ui-btn-icon-space: 2px;
	--ui-btn-dropdown-icon-size: 18px;
	--ui-btn-dropdown-icon-inline-space: 4px;
	--ui-btn-dropdown-icon-compensation: 4px;
	--ui-btn-height: var(--ui-btn-size-md);
	--ui-btn-wait-icon-size: 20px;
	--ui-btn-split-divider-height: 18px;
	--ui--btn-width-with-only-icon: var(--ui-btn-height);
	--ui-btn-corner-counter-inline-shift: 13px;
	--ui-btn-counter-inline-space: 6px;
}

.ui-btn-split.--air.ui-btn-md .ui-btn-menu.--switcher {
	padding-left: 10px;
	padding-right: 10px;
}

.ui-btn.--air.ui-btn-sm,
.ui-btn-split.--air.ui-btn-sm,
.ui-btn-split.--air.ui-btn-sm .ui-btn-main,
.ui-btn-split.--air.ui-btn-sm .ui-btn-menu {
	--ui-btn-padding-right: 9px;
	--ui-btn-padding-left: 9px;
	--ui-btn-icon-compensation: 4px;
	--ui-btn-radius: var(--ui-border-radius-sm);
	--ui-btn-font-size: var(--ui-font-size-sm);
	--ui-btn-font-weight: var(--ui-font-weight-normal);
	--ui-btn-icon-size: 20px;
	--ui-btn-icon-space: 4px;
	--ui-btn-dropdown-icon-size: 16px;
	--ui-btn-dropdown-icon-inline-space: 3px;
	--ui-btn-dropdown-icon-compensation: 3px;
	--ui-btn-height: var(--ui-btn-size-sm);
	--ui-btn-wait-icon-size: 16px;
	--ui-btn-letter-spacing: -0.15px;
	--ui-btn-split-divider-height: 14px;
	--ui--btn-width-with-only-icon: 34px;
	--ui-btn-corner-counter-inline-shift: 13px;
	--ui-btn-counter-inline-space: 6px;
}

.ui-btn-split.--air.ui-btn-sm .ui-btn-menu.--switcher {
	padding-left: 8px;
	padding-right: 8px;
}

.ui-btn.--air.ui-btn-xs,
.ui-btn-split.--air.ui-btn-xs,
.ui-btn-split.--air.ui-btn-xs .ui-btn-main,
.ui-btn-split.--air.ui-btn-xs .ui-btn-menu {
	--ui-btn-padding-right: 7px;
	--ui-btn-padding-left: 7px;
	--ui-btn-icon-compensation: 2px;
	--ui-btn-radius: var(--ui-border-radius-xs);
	--ui-btn-font-size: var(--ui-font-size-xs);
	--ui-btn-font-weight: var(--ui-font-weight-normal);
	--ui-btn-icon-size: 14px;
	--ui-btn-icon-space: 4px;
	--ui-btn-dropdown-icon-size: 14px;
	--ui-btn-dropdown-icon-inline-space: 4px;
	--ui-btn-dropdown-icon-compensation: 2px;
	--ui-btn-height: var(--ui-btn-size-xs);
	--ui-btn-wait-icon-size: 14px;
	--ui-btn-letter-spacing: -0.1px;
	--ui-btn-split-divider-height: 12px;
	--ui--btn-width-with-only-icon: 28px;
	--ui-btn-corner-counter-inline-shift: 11px;
	--ui-btn-counter-inline-space: 6px;
}

.ui-btn-split.--air.ui-btn-xs .ui-btn-menu.--switcher {
	padding-left: 6px;
	padding-right: 6px;
}

.ui-btn.--air.ui-btn-xss,
.ui-btn-split.--air.ui-btn-xss,
.ui-btn-split.--air.ui-btn-xss .ui-btn-main,
.ui-btn-split.--air.ui-btn-xss .ui-btn-menu {
	--ui-btn-padding-right: 7px;
	--ui-btn-padding-left: 8px;
	--ui-btn-icon-compensation: 5px;
	--ui-btn-radius: 5px;
	--ui-btn-font-size: var(--ui-font-size-4xs);
	--ui-btn-font-weight: var(--ui-font-weight-normal);
	--ui-btn-icon-size: 14px;
	--ui-btn-icon-space: 4px;
	--ui-btn-dropdown-icon-size: 12px;
	--ui-btn-dropdown-icon-inline-space: 2px;
	--ui-btn-dropdown-icon-compensation: 2px;
	--ui-btn-height: var(--ui-btn-size-xss);
	--ui-btn-wait-icon-size: 12px;
	--ui--btn-width-with-only-icon: 24px;
	--ui-btn-corner-counter-inline-shift: 10px;
	--ui-btn-letter-spacing: 0.1px;
	--ui-btn-split-divider-height: 10px;
	--ui-btn-counter-inline-space: 6px;
}

.ui-btn-split.--air.ui-btn-xss .ui-btn-menu.--switcher {
	padding-left: 4px;
	padding-right: 4px;
}

.ui-btn.--air.--with-right-icon,
.ui-btn.--air.--with-right-icon[class*="ui-btn-icon-"],
.ui-btn-dropdown.--air,
.ui-btn-split.--air .ui-btn-main,
.ui-btn-split.--air.--with-right-icon[class*="ui-btn-icon-"] .ui-btn-main,
.ui-btn.--air.--with-right-counter {
	padding-right: calc(var(--ui-btn-padding-right) + 1px);
}

.ui-btn.--air.--with-right-icon:not(.--with-left-icon),
.ui-btn.ui-btn-lg.--air.--with-right-icon:not(.--with-left-icon),
.ui-btn-split.--air.--with-right-icon:not(.--with-left-icon) .ui-btn-main,
.ui-btn-split.ui-btn-lg.--air.--with-right-icon:not(.--with-left-icon) .ui-btn-main {
	padding-left: var(--ui-btn-padding-left);
}

.ui-btn.--air.--with-left-icon,
.ui-btn.ui-btn-lg.--air.--with-left-icon,
.ui-btn.--air.--with-left-icon[class*="ui-btn-icon-"],
.ui-btn.--air.--with-left-counter,
.ui-btn-split.--air.--with-left-icon .ui-btn-main,
.ui-btn-split.--air.--with-left-icon[class*="ui-btn-icon-"] .ui-btn-main,
.ui-btn-split.--air.--with-left-counter .ui-btn-main {
	padding-left: calc(var(--ui-btn-padding-left) + 1px);
}

.ui-btn.--air:not(.--with-left-icon):not(.--with-right-icon):not(.--with-icon),
.ui-btn-split.--air:not(.--with-left-icon):not(.--with-right-icon) .ui-btn-main {
	--ui-btn-icon-compensation: 0px;
}

.ui-btn.--air:not(.ui-btn-dropdown) {
	--ui-btn-dropdown-icon-compensation: 0px;
}

.ui-btn.--air.--with-left-icon[class*="ui-btn-icon-"],
.ui-btn.--air.--with-icon,
.ui-btn.ui-btn-lg.--air.--with-left-icon[class*="ui-btn-icon-"],
.ui-btn-split.--air.--with-left-icon[class*="ui-btn-icon-"] .ui-btn-main,
.ui-btn-split.ui-btn-lg.--air.--with-left-icon[class*="ui-btn-icon-"] .ui-btn-main {
	padding-left: calc(var(--ui-btn-padding-left) - var(--ui-btn-icon-compensation));
}

.ui-btn.--air.--with-right-icon[class*="ui-btn-icon-"],
.ui-btn-split.--air.--with-right-icon[class*="ui-btn-icon-"] .ui-btn-main {
	padding-right: calc(var(--ui-btn-padding-right) - var(--ui-btn-icon-compensation));
}

.ui-btn.--air.ui-btn-dropdown {
	padding-right: calc(var(--ui-btn-padding-right) - var(--ui-btn-dropdown-icon-compensation));
}

/*endregion*/

/* default button color */
.ui-btn.--air,
.ui-btn-split.--air .ui-btn-main,
.ui-btn-split.--air .ui-btn-menu,
.ui-btn.--air.--style-filled,
.ui-btn-split.--air.--style-filled .ui-btn-main,
.ui-btn-split.--air.--style-filled .ui-btn-menu {
	--ui-btn-background: var(--ui-color-design-filled-bg);
	--ui-btn-border-color: var(--ui-color-design-filled-stroke);
	--ui-btn-border-width: var(--ui-design-filled-stroke-weight);
	--ui-btn-color: var(--ui-color-design-filled-content);
	--ui-btn-split-divider-color: var(--ui-color-design-filled-content-divider);
}

.ui-btn.--air.--style-tinted,
.ui-btn-split.--air.--style-tinted .ui-btn-main,
.ui-btn-split.--air.--style-tinted .ui-btn-menu {
	--ui-btn-background: var(--ui-color-design-tinted-bg);
	--ui-btn-border-color: var(--ui-color-design-tinted-stroke);
	--ui-btn-border-width: var(--ui-design-tinted-stroke-weight);
	--ui-btn-color: var(--ui-color-design-tinted-content);
	--ui-btn-split-divider-color: var(--ui-color-design-tinted-content-divider);
}

.ui-btn.--air.--style-tinted-alert,
.ui-btn-split.--air.--style-tinted-alert .ui-btn-main,
.ui-btn-split.--air.--style-tinted-alert .ui-btn-menu {
	--ui-btn-background: var(--ui-color-design-tinted-alert-bg);
	--ui-btn-border-color: var(--ui-color-design-tinted-alert-stroke);
	--ui-btn-border-width: var(--ui-design-tinted-alert-stroke-weight);
	--ui-btn-color: var(--ui-color-design-tinted-alert-content);
	--ui-btn-split-divider-color: var(--ui-color-design-tinted-alert-content-divider);
}

.ui-btn.--air.--style-outline-accent-1,
.ui-btn-split.--air.--style-outline-accent-1 .ui-btn-main,
.ui-btn-split.--air.--style-outline-accent-1 .ui-btn-menu {
	--ui-btn-background: var(--ui-color-design-outline-a1-bg);
	--ui-btn-border-color: var(--ui-color-design-outline-a1-stroke);
	--ui-btn-border-width: var(--ui-design-outline-a1-stroke-weight);
	--ui-btn-color: var(--ui-color-design-outline-a1-content);
	--ui-btn-split-divider-color: var(--ui-color-design-outline-a1-content-divider);
}

.ui-btn.--air.--style-outline-accent-2,
.ui-btn-split.--air.--style-outline-accent-2 .ui-btn-main,
.ui-btn-split.--air.--style-outline-accent-2 .ui-btn-menu {
	--ui-btn-background: var(--ui-color-design-outline-a2-bg);
	--ui-btn-border-color: var(--ui-color-design-outline-a2-stroke);
	--ui-btn-border-width: var(--ui-design-outline-a2-stroke-weight);
	--ui-btn-color: var(--ui-color-design-outline-a2-content);
	--ui-btn-split-divider-color: var(--ui-color-design-outline-a2-content-divider);
}

.ui-btn.--air.--style-outline,
.ui-btn-split.--air.--style-outline .ui-btn-main,
.ui-btn-split.--air.--style-outline .ui-btn-menu {
	--ui-btn-background: var(--ui-color-design-outline-bg);
	--ui-btn-border-color: var(--ui-color-design-outline-stroke);
	--ui-btn-border-width: var(--ui-design-outline-stroke-weight);
	--ui-btn-color: var(--ui-color-design-outline-content);
	--ui-btn-split-divider-color: var(--ui-color-design-outline-content-divider);
}

.ui-btn.--air.--style-outline-no-accent,
.ui-btn-split.--air.--style-outline-no-accent .ui-btn-main,
.ui-btn-split.--air.--style-outline-no-accent .ui-btn-menu {
	--ui-btn-background: var(--ui-color-design-outline-na-bg);
	--ui-btn-border-color: var(--ui-color-design-outline-na-stroke);
	--ui-btn-border-width: var(--ui-design-outline-na-stroke-weight);
	--ui-btn-color: var(--ui-color-design-outline-na-content);
	--ui-btn-split-divider-color: var(--ui-color-design-outline-na-content-divider);
}

.ui-btn.--air.--style-plain-accent,
.ui-btn-split.--air.--style-plain-accent .ui-btn-main,
.ui-btn-split.--air.--style-plain-accent .ui-btn-menu {
	--ui-btn-background: var(--ui-color-design-plain-a-bg);
	--ui-btn-border-color: var(--ui-color-design-plain-a-stroke);
	--ui-btn-border-width: var(--ui-design-plain-a-stroke-weight);
	--ui-btn-color: var(--ui-color-design-plain-a-content);
	--ui-btn-split-divider-color: var(--ui-color-design-plain-a-content-divider);
}

.ui-btn.--air.--style-plain,
.ui-btn-split.--air.--style-plain .ui-btn-main,
.ui-btn-split.--air.--style-plain .ui-btn-menu {
	--ui-btn-background: var(--ui-color-design-plain-bg);
	--ui-btn-border-color: var(--ui-color-design-plain-stroke);
	--ui-btn-border-width: var(--ui-design-plain-stroke-weight);
	--ui-btn-color: var(--ui-color-design-plain-content);
	--ui-btn-split-divider-color: var(--ui-color-design-plain-content-divider);
}

.ui-btn.--air.--style-plain-no-accent,
.ui-btn-split.--air.--style-plain-no-accent .ui-btn-main,
.ui-btn-split.--air.--style-plain-no-accent .ui-btn-menu {
	--ui-btn-background: var(--ui-color-design-plain-na-bg);
	--ui-btn-border-color: var(--ui-color-design-plain-na-stroke);
	--ui-btn-border-width: var(--ui-design-plain-na-stroke-weight);
	--ui-btn-color: var(--ui-color-design-plain-na-content);
	--ui-btn-split-divider-color: var(--ui-color-design-plain-na-content-divider);
}

.ui-btn.--air.--style-selection,
.ui-btn-split.--air.--style-selection .ui-btn-main,
.ui-btn-split.--air.--style-selection .ui-btn-menu {
	--ui-btn-background: var(--ui-color-design-selection-bg);
	--ui-btn-border-color: var(--ui-color-design-selection-stroke);
	--ui-btn-border-width: var(--ui-design-selection-stroke-weight);
	--ui-btn-color: var(--ui-color-design-selection-content);
	--ui-btn-split-divider-color: var(--ui-color-design-selection-content-divider);
}

.ui-btn.--air.--style-filled-copilot,
.ui-btn-split.--air.--style-filled-copilot .ui-btn-main,
.ui-btn-split.--air.--style-filled-copilot .ui-btn-menu {
	--ui-btn-background: var(--ui-color-design-filled-copilot-bg);
	--ui-btn-border-color: var(--ui-color-design-filled-copilot-stroke);
	--ui-btn-border-width: var(--ui-design-filled-copilot-stroke-weight);
	--ui-btn-color: var(--ui-color-design-filled-copilot-content);
	--ui-btn-split-divider-color: var(--ui-color-design-filled-copilot-content-divider);
}

.ui-btn.--air.--style-filled-success,
.ui-btn-split.--air.--style-filled-success .ui-btn-main,
.ui-btn-split.--air.--style-filled-success .ui-btn-menu {
	--ui-btn-background: var(--ui-color-design-filled-success-bg);
	--ui-btn-border-color: var(--ui-color-design-filled-success-stroke);
	--ui-btn-border-width: var(--ui-design-filled-success-stroke-weight);
	--ui-btn-color: var(--ui-color-design-filled-success-content);
	--ui-btn-split-divider-color: var(--ui-color-design-filled-success-content-divider);
}

.ui-btn.--air.--style-filled-alert,
.ui-btn-split.--air.--style-filled-alert .ui-btn-main,
.ui-btn-split.--air.--style-filled-alert .ui-btn-menu {
	--ui-btn-background: var(--ui-color-design-filled-alert-bg);
	--ui-btn-border-color: var(--ui-color-design-filled-alert-stroke);
	--ui-btn-border-width: var(--ui-design-filled-success-stroke-weight);
	--ui-btn-color: var(--ui-color-design-filled-alert-content);
	--ui-btn-split-divider-color: var(--ui-color-design-filled-alert-content-divider);
}

.ui-btn-split.--air .ui-btn-menu::before {
	content: '';
	position: relative;
	left: 1px;
	top: auto;
	margin: 0;
	padding: 0;
	width: var(--ui-btn-dropdown-icon-size);
	height: var(--ui-btn-dropdown-icon-size);
	border: none;
	-webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.505 9.505a.7.7 0 01.99 0L12 15.01l5.505-5.505a.7.7 0 01.99.99l-6 6a.7.7 0 01-.99 0l-6-6a.7.7 0 010-.99z' fill='%23333'/%3E%3C/svg%3E");
	        mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.505 9.505a.7.7 0 01.99 0L12 15.01l5.505-5.505a.7.7 0 01.99.99l-6 6a.7.7 0 01-.99 0l-6-6a.7.7 0 010-.99z' fill='%23333'/%3E%3C/svg%3E");
	-webkit-mask-position: center center;
	        mask-position: center center;
	-webkit-mask-repeat: no-repeat;
	        mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	        mask-size: contain;
	background-color: var(--ui-btn-color);
}

.ui-btn-split.--air .ui-btn-menu.--switcher::before {
	content: none;
}

.ui-btn.--air[disabled]:not(.ui-btn-wait):not(.ui-btn-clock),
.ui-btn-disabled.--air:not(.ui-btn-wait):not(.ui-btn-clock),
.ui-btn-split.--air[disabled]:not(.ui-btn-wait):not(.ui-btn-clock) .ui-btn-main,
.ui-btn-split.--air.ui-btn-disabled:not(.ui-btn-wait):not(.ui-btn-clock) .ui-btn-main,
.ui-btn-split.--air[disabled]:not(.ui-btn-wait):not(.ui-btn-clock) .ui-btn-menu,
.ui-btn-split.--air.ui-btn-disabled:not(.ui-btn-wait):not(.ui-btn-clock) .ui-btn-menu {
	--ui-btn-background: var(--ui-color-design-disabled-bg);
	--ui-btn-border-color: var(--ui-color-design-disabled-stroke);
	--ui-btn-color: var(--ui-color-design-disabled-content);

	opacity: 1;
}

.ui-btn-split[disabled].--air .ui-btn-main,
.ui-btn-split[disabled].--air .ui-btn-main:hover,
.ui-btn-split[disabled].--air .ui-btn-main:active,
.ui-btn-split[disabled].--air .ui-btn-menu,
.ui-btn-split[disabled].--air .ui-btn-menu:hover,
.ui-btn-split[disabled].--air .ui-btn-menu:active,
.ui-btn-split.ui-btn-disabled.--air .ui-btn-main,
.ui-btn-split.ui-btn-disabled.--air .ui-btn-main:hover,
.ui-btn-split.ui-btn-disabled.--air .ui-btn-main:active,
.ui-btn-split.ui-btn-disabled.--air .ui-btn-menu,
.ui-btn-split.ui-btn-disabled.--air .ui-btn-menu:hover,
.ui-btn-split.ui-btn-disabled.--air .ui-btn-menu:active {
	opacity: initial;
	cursor: not-allowed;
	background-color: var(--ui-btn-background);
	border-color: var(--ui-btn-border-color);
}

.ui-btn.--air:not(.ui-btn-dropdown)::after,
.ui-btn-split.--air:not(.ui-btn-dropdown) .ui-btn-main::after,
.ui-btn-split.--air.ui-btn-collapsed:not(.ui-btn-dropdown) .ui-btn-main:after {
	display: none;
}

/*.ui-btn.--air.--with-left-icon:not(.ui-btn-dropdown)::after,*/
/*.ui-btn-split.--air.--with-left-icon:not(.ui-btn-dropdown) .ui-btn-main::after {*/
/*	display: none;*/
/*}*/

.ui-btn.--air.--with-left-icon .ui-btn-text::before,
.ui-btn.--air.--with-right-icon .ui-btn-text::after,
.ui-btn.--air.--with-collapsed-icon .ui-btn-text::before,
.ui-btn-split.--air.--with-left-icon .ui-btn-main .ui-btn-text::before,
.ui-btn-split.--air.--with-right-icon .ui-btn-main .ui-btn-text::after,
.ui-btn-split.--air.--with-collapsed-icon .ui-btn-main .ui-btn-text::before {
	content: '';
	position: relative;
	top: 0;
	display: inline-block;
	width: var(--ui-btn-icon-size);
	min-width: var(--ui-btn-icon-size);
	height: var(--ui-btn-icon-size);
	background-color: var(--ui-btn-color);
	-webkit-mask-image: var(--ui-btn-icon);
	        mask-image: var(--ui-btn-icon);
	-webkit-mask-repeat: no-repeat;
	        mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	        mask-size: contain;
	-webkit-mask-position: center center;
	        mask-position: center center;
	vertical-align: middle;
}

.ui-btn.--air.--with-left-icon .ui-btn-text::before,
.ui-btn-split.--air.--with-left-icon .ui-btn-main .ui-btn-text::before {
	margin-right: var(--ui-btn-icon-space);
}

.ui-btn.--air.--with-right-icon .ui-btn-text::after,
.ui-btn-split.--air.--with-right-icon .ui-btn-main .ui-btn-text::after {
	margin-left: var(--ui-btn-icon-space);
}

.ui-btn.--air.--with-collapsed-icon .ui-btn-text::before,
.ui-btn-split.--air.--with-collapsed-icon .ui-btn-main .ui-btn-text::before {
	display: none;
}

.ui-btn.ui-btn-dropdown.--air::after {
	content: '';
	position: relative;
	display: inline-block;
	top: auto;
	left: auto;
	width: var(--ui-btn-dropdown-icon-size);
	min-width: var(--ui-btn-dropdown-icon-size);
	height: var(--ui-btn-dropdown-icon-size);
	margin-left: var(--ui-btn-dropdown-icon-inline-space);
	-webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.505 9.505a.7.7 0 01.99 0L12 15.01l5.505-5.505a.7.7 0 01.99.99l-6 6a.7.7 0 01-.99 0l-6-6a.7.7 0 010-.99z' fill='%23333'/%3E%3C/svg%3E");
	        mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='24' height='24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.505 9.505a.7.7 0 01.99 0L12 15.01l5.505-5.505a.7.7 0 01.99.99l-6 6a.7.7 0 01-.99 0l-6-6a.7.7 0 010-.99z' fill='%23333'/%3E%3C/svg%3E");
	-webkit-mask-position: center center;
	        mask-position: center center;
	-webkit-mask-repeat: no-repeat;
	        mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	        mask-size: contain;
	background-color: var(--ui-btn-color);
	background-image: none;
	transform: none;
	transition: none;
}

.ui-btn-dropdown.--air:not(.ui-btn-wait)::before,
.ui-btn-dropdown.--air:not(.ui-btn-clock)::before,
.ui-btn-dropdown.--air:not(.ui-btn-wait) .ui-btn-main::before,
.ui-btn-dropdown.--air:not(.ui-btn-clock) .ui-btn-main::before{
	content: none;
}

.ui-btn-dropdown.--with-right-icon.--air::after {
	margin-left: calc((var(--ui-btn-dropdown-icon-inline-space) - var(--ui-btn-icon-compensation)));
}

.ui-btn.--air .ui-btn-text,
.ui-btn-split.--air .ui-btn-main .ui-btn-text {
	height: var(--ui-btn-height);
	max-width: 100%;
	display: inline-flex;
	align-items: center;
	overflow: unset;
	white-space: unset;
	text-overflow: unset;
	letter-spacing: var(--ui-btn-letter-spacing);
}

.ui-btn.--air .ui-btn-text-inner,
.ui-btn-split.--air .ui-btn-main .ui-btn-text-inner {
	overflow: hidden;
	max-width: 100%;
	white-space: nowrap;
	text-overflow: ellipsis;
	display: inline-block;
	margin-top: var(--ui-btn-title-comensation);
}

.ui-btn.--air.ui-btn-dropdown .ui-btn-text {
	max-width: calc(100% - var(--ui-btn-dropdown-icon-size));
}

.ui-btn-wait.--air[disabled],
.ui-btn-clock.--air[disabled],
.ui-btn-split.--air[disabled] .ui-btn-main,
.ui-btn-split.--air[disabled] .ui-btn-menu,
.ui-btn-split.--air[disabled] .ui-btn-main,
.ui-btn-split.--air[disabled] .ui-btn-menu,
.ui-btn-split.--air.ui-btn-disabled .ui-btn-main,
.ui-btn-split.--air.ui-btn-disabled .ui-btn-menu {
	opacity: 1;
}

.ui-btn.--air.ui-btn-wait,
.ui-btn-wait.--air .ui-btn-main,
.ui-btn.--air.ui-btn-clock,
.ui-btn-clock.--air .ui-btn-main{
	background-image: none;
}

.ui-btn.ui-btn-wait.--air::before,
.ui-btn.ui-btn-clock.--air::before,
.ui-btn-split.ui-btn-wait.--air .ui-btn-main::before,
.ui-btn-split.ui-btn-clock.--air .ui-btn-main::before {
	content: '';
	display: inline-block;
	position: absolute;
	top: 0;
	left: 0;
	right: auto;
	width: 100%;
	height: 100%;
	margin: 0;
	transform: none;
	background-color: var(--ui-btn-color);
	-webkit-mask-size: var(--ui-btn-wait-icon-size);
	        mask-size: var(--ui-btn-wait-icon-size);
	-webkit-mask-position: center center;
	        mask-position: center center;
	-webkit-mask-repeat: no-repeat;
	        mask-repeat: no-repeat;
	border: none;
}

.ui-btn.ui-btn-wait.--air::before,
.ui-btn-split.ui-btn-wait.--air .ui-btn-main::before {
	-webkit-mask-image: var(--ui-btn-wait-loader);
	        mask-image: var(--ui-btn-wait-loader);
}

.ui-btn.ui-btn-clock.--air::before,
.ui-btn-split.ui-btn-clock.--air .ui-btn-main::before {
	-webkit-mask-image: var(--ui-btn-clock-loader);
	        mask-image: var(--ui-btn-clock-loader);
}

.ui-btn-wait.--air .ui-btn-text,
.ui-btn-clock.--air .ui-btn-text {
	color: transparent;
}

.ui-btn-wait.--air .ui-btn-text::before,
.ui-btn-clock.--air .ui-btn-text::before,
.ui-btn-wait.--air::after,
.ui-btn-clock.--air::after,
.ui-btn-wait.--air .ui-btn-text::after,
.ui-btn-clock.--air .ui-btn-text::after,
.ui-btn-wait.--air:not(.ui-btn-collapsed) .ui-btn-left-counter,
.ui-btn-clock.--air:not(.ui-btn-collapsed) .ui-btn-left-counter,
.ui-btn-wait.--air:not(.ui-btn-collapsed) .ui-btn-right-counter,
.ui-btn-clock.--air:not(.ui-btn-collapsed) .ui-btn-right-counter {
	opacity: 0;
}

.ui-btn-split.--air .ui-btn-menu {
	min-width: var(--ui-btn-height);
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	padding: 0;
}

.ui-btn-split.--air .ui-btn-menu::after {
	height: var(--ui-btn-split-divider-height);
	top: auto;
	bottom: auto;
	background: var(--ui-btn-split-divider-color);
	opacity: 1;
}

.ui-btn-split.--air {
	padding-right: 0;
}

.ui-btn-split.--air .ui-btn-menu {
	position: relative;
	top: auto;
	left: auto;
}

.ui-btn.--air .ui-btn-left-counter,
.ui-btn.--air .ui-btn-right-counter,
.ui-btn-split.--air .ui-btn-main .ui-btn-left-counter,
.ui-btn-split.--air .ui-btn-main .ui-btn-right-counter {
	display: inline-flex;
	height: var(--ui-btn-height);
	vertical-align: top;
}

.ui-btn-left-counter {
	margin-right: var(--ui-btn-counter-inline-space);
}

.ui-btn-right-counter {
	margin-left: var(--ui-btn-counter-inline-space);
}

.ui-btn.--air.ui-btn-collapsed,
.ui-btn-split.--air.ui-btn-collapsed .ui-btn-main {
	--ui-btn-padding-right: 0px;
	--ui-btn-padding-left: 0px;

	width: var(--ui--btn-width-with-only-icon);
	min-width: var(--ui--btn-width-with-only-icon);
}

.ui-btn.--air.ui-btn-collapsed .ui-btn-text,
.ui-btn-split.--air.ui-btn-collapsed .ui-btn-main .ui-btn-text {
	font-size: 0;
}

.ui-btn.--air.ui-btn-collapsed .ui-btn-right-counter,
.ui-btn.--air.ui-btn-collapsed .ui-btn-left-counter {
	position: absolute;
	top: 3px;
	margin-left: 0;
	margin-right: 0;
	pointer-events: none;
}

.ui-btn.--air.ui-btn-collapsed .ui-btn-left-counter {
	transform: translate(-100%, -50%);
	left: var(--ui-btn-corner-counter-inline-shift);
}

.ui-btn.--air.ui-btn-collapsed .ui-btn-right-counter {
	transform: translate(100%, -50%);
	right: var(--ui-btn-corner-counter-inline-shift);
}

.ui-btn.--air.--with-left-icon.ui-btn-collapsed .ui-btn-text::before,
.ui-btn.--air.--with-icon.ui-btn-collapsed,
.ui-btn.--air.--with-right-icon.ui-btn-collapsed .ui-btn-text::after,
.ui-btn.--air.--with-collapsed-icon.ui-btn-collapsed .ui-btn-text::before,
.ui-btn-split.--air.--with-left-icon.ui-btn-collapsed .ui-btn-main .ui-btn-text::before,
.ui-btn-split.--air.--with-right-icon.ui-btn-collapsed .ui-btn-main .ui-btn-text::after,
.ui-btn-split.--air.--with-collapsed-icon.ui-btn-collapsed .ui-btn-main .ui-btn-text::before {
	--ui-btn-icon-space: 0px;
}

.ui-btn.--air.--with-collapsed-icon.ui-btn-collapsed .ui-btn-text::before,
.ui-btn-split.--air.--with-collapsed-icon.ui-btn-collapsed .ui-btn-main .ui-btn-text::before {
	display: inline-block;
}

.ui-btn.--air.--with-left-icon.ui-btn-collapsed .ui-btn-text::before,
.ui-btn.--air.--with-right-icon.ui-btn-collapsed .ui-btn-text::after,
.ui-btn.--air.--with-collapsed-icon.ui-btn-collapsed .ui-btn-text::before,
.ui-btn-split.--air.--with-left-icon.ui-btn-collapsed .ui-btn-main .ui-btn-text::before,
.ui-btn-split.--air.--with-right-icon.ui-btn-collapsed .ui-btn-main .ui-btn-text::after,
.ui-btn-split.--air.--with-collapsed-icon.ui-btn-collapsed .ui-btn-main .ui-btn-text::before {
	top: 0;
}

.ui-btn-left-counter-inner {
	display: inline-flex;
}

.ui-btn .ui-icon-set {
	--ui-icon-set__icon-size: var(--ui-btn-icon-size);
	--ui-icon-set__icon-color: var(--ui-btn-color);
	margin-right: var(--ui-btn-icon-space);
	transition: none;
}

.ui-btn-ai-waiting .ui-icon-set,
.ui-btn-clock .ui-icon-set,
.ui-btn-wait .ui-icon-set {
	opacity: 0;
}
