/* ---------CHECKBOX--------- */

.UNI_checkbox {
    position: relative;
}

.UNI_checkbox .fake {
    position: relative;
    width: 14px;
    height: 14px;
    box-shadow: 0 0 0 1px #d9d9d9;
    background-color: none;
    border-radius: 3px;
    z-index: 1;
}

.UNI_checkbox .fake.sel {
    background-color: #B0CCE7;
}

.UNI_checkbox input[type="radio"]~.fake {
    border-radius: 50%;
}

.UNI_checkbox input {
    position: absolute;
    margin: 0;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 2;
    opacity: 0.0;
    cursor: pointer;
}

.UNI_checkbox input:hover~.fake {
    background-color: #b2cce6;
}

.UNI_checkbox input:checked~.fake {
    background-color: #679ac9;
}

.UNI_checkbox input[type="checkbox"]:checked~.fake {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 400'%3e%3cpath fill='%23fff' d='M102.13 215.21c-9.71,-8.93 -10.34,-24.05 -1.41,-33.76 8.93,-9.71 24.06,-10.34 33.77,-1.41l38.27 35.3 92.3 -89.7c9.45,-9.2 24.57,-8.99 33.77,0.46 9.19,9.45 8.98,24.57 -0.47,33.77l-124.76 121.25 -71.47 -65.91z'/%3e%3c/svg%3e");
}

.UNI_checkbox input[type="radio"]:checked~.fake {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 400'%3e%3cpath fill='%23fff' d='M200 130c38.66,0 70,31.34 70,70 0,38.66 -31.34,70 -70,70 -38.66,0 -70,-31.34 -70,-70 0,-38.66 31.34,-70 70,-70z'/%3e%3c/svg%3e");
}

/* ---------SWITCHER--------- */

.UNI_switcher {
    position: relative;
    width: 37px;
    height: 20px;
}

.UNI_switcher .fake {
    position: absolute;
    border-radius: 10px;
    box-shadow: 0 0 0 1px #cccccc inset;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.UNI_switcher .fake::before {
    content: "";
    position: absolute;
    display: block;
    top: 3px;
    left: 3px;
    right: auto;
    background-color: #cccccc;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    transition: all 0.2s ease;
}

.UNI_switcher input[type="radio"]~.fake::before {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 400'%3e%3cpath fill='%23fff' d='M200 130c38.66,0 70,31.34 70,70 0,38.66 -31.34,70 -70,70 -38.66,0 -70,-31.34 -70,-70 0,-38.66 31.34,-70 70,-70z'/%3e%3c/svg%3e");
}

.UNI_switcher input {
    position: absolute;
    opacity: 0.0;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    margin: 0px;
    cursor: pointer;
    z-index: 4;
}

.UNI_switcher input:nth-child(2) {
    z-index: 3;
}

.UNI_switcher input:nth-child(1):checked~.fake {
    box-shadow: 0 0 0 1px #679ac9 inset;
}

.UNI_switcher input:nth-child(1):checked~.fake::before {
    background-color: #679ac9;
    left: 20px;
}

.UNI_switcher input:checked {
    z-index: 2;
}

/* ---------MULTIPLE--------- */

.UNI_multiple {
    position: relative;
    display: flex;
    height: 20px;
}

.UNI_multiple .fake {
    position: absolute;
    border-radius: 10px;
    box-shadow: 0 0 0 1px #679ac9 inset;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.UNI_multiple .fake::before {
    content: "";
    position: absolute;
    display: block;
    left: 3px;
    top: 50%;
    transform: translate(0, -50%);
    background-color: #679ac9;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    transition: all 0.2s ease;
}

.UNI_multiple input {
    width: 20px;
    margin: 0;
    opacity: 0.0;
    cursor: pointer;
    z-index: 2;
}

.UNI_multiple input:nth-child(1):checked~.fake::before {
    left: 3px;
}

.UNI_multiple input:nth-child(2):checked~.fake::before {
    left: 23px;
}

.UNI_multiple input:nth-child(3):checked~.fake::before {
    left: 43px;
}

.UNI_multiple input:nth-child(4):checked~.fake::before {
    left: 63px;
}

.UNI_multiple input:nth-child(5):checked~.fake::before {
    left: 83px;
}

.UNI_multiple input:nth-child(6):checked~.fake::before {
    left: 103px;
}

.UNI_multiple input:nth-child(7):checked~.fake::before {
    left: 123px;
}

.UNI_multiple input:nth-child(8):checked~.fake::before {
    left: 143px;
}

.UNI_multiple input:nth-child(9):checked~.fake::before {
    left: 163px;
}

/* ---------MULTIPLE--------- */

.UNI_clip {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 100%;
    transform: translate(-50%, -50%);
    background-color: #999;
}

.UNI_clip.trash {
    clip-path: polygon(76.5% 26.66%, 76.5% 45.68%, 59.11% 45.68%, 56.58% 43.15%, 50% 49.73%, 43.42% 43.15%, 38.36% 48.21%, 44.94% 54.79%, 38.36% 61.37%, 43.42% 66.44%, 50% 59.86%, 56.58% 66.44%, 61.64% 61.37%, 55.06% 54.79%, 61.64% 48.21%, 59.11% 45.68%, 76.5% 45.68%, 76.5% 82%, 71.5% 87%, 28.5% 87%, 23.5% 82%, 23.5% 26.66%, 74.5% 26.66%, 74.5% 24.06%, 17.12% 24.06%, 17.12% 19.25%, 20.12% 16.25%, 42.9% 16.25%, 44.42% 13%, 50% 13%, 55.58% 13%, 57.1% 16.25%, 79.88% 16.25%, 82.88% 19.25%, 82.88% 24.06%, 76.5% 24.06%);
}

.UNI_clip.copyin {
    clip-path: polygon(34.53% 15%, 80% 15%, 85% 20%, 85% 65.47%, 80% 70.47%, 70.47% 70.47%, 62.74% 70.47%, 62.74% 39.25%, 60.74% 37.25%, 46.59% 37.25%, 46.59% 58.63%, 53.87% 51.36%, 59.33% 56.82%, 46.59% 69.55%, 38.87% 69.55%, 26.14% 56.82%, 31.6% 51.36%, 38.87% 58.63%, 38.87% 37.25%, 24.72% 37.25%, 22.72% 39.25%, 22.72% 75.28%, 24.72% 77.28%, 60.74% 77.28%, 62.74% 75.28%, 62.74% 72.47%, 70.47% 72.47%, 70.47% 80%, 65.47% 85%, 20% 85%, 15% 80%, 15% 34.53%, 20% 29.53%, 29.53% 29.53%, 29.53% 20%);
}

.UNI_clip.copy {
    clip-path: polygon(34.53% 15%, 80% 15%, 85% 20%, 85% 65.47%, 80% 70.47%, 70.47% 70.47%, 62.74% 70.47%, 62.74% 39.25%, 60.74% 37.25%, 24.72% 37.25%, 22.72% 39.25%, 22.72% 75.28%, 24.72% 77.28%, 60.74% 77.28%, 62.74% 75.28%, 62.74% 72.47%, 70.47% 72.47%, 70.47% 80%, 65.47% 85%, 20% 85%, 15% 80%, 15% 34.53%, 20% 29.53%, 29.53% 29.53%, 29.53% 20%);
}

/* ---------SELECTOR--------- */

.UNI_select {
    position: relative;
    display: inline-block;
    height: 20px;
    border-radius: 10px;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8IS0tIENyZWF0b3I6IENvcmVsRFJBVyAyMDE5ICg2NC1CaXQpIC0tPg0KPD94bWwtc3R5bGVzaGVldCBocmVmPSJzdmcuY3NzIiB0eXBlPSJ0ZXh0L2NzcyI/Pg0KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIHdpZHRoPSIyMHB4IiBoZWlnaHQ9IjIwcHgiIHZlcnNpb249IjEuMSIgc3R5bGU9InNoYXBlLXJlbmRlcmluZzpnZW9tZXRyaWNQcmVjaXNpb247IHRleHQtcmVuZGVyaW5nOmdlb21ldHJpY1ByZWNpc2lvbjsgaW1hZ2UtcmVuZGVyaW5nOm9wdGltaXplUXVhbGl0eTsgZmlsbC1ydWxlOmV2ZW5vZGQ7IGNsaXAtcnVsZTpldmVub2RkIg0Kdmlld0JveD0iMCAwIDIwIDIwIg0KIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIg0KIHhtbG5zOnhvZG09Imh0dHA6Ly93d3cuY29yZWwuY29tL2NvcmVsZHJhdy9vZG0vMjAwMyINCiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyNCAyNCINCiBkYXRhLW5hbWU9IsOQwqHDkMK7w5DCvsOQwrkgMSI+DQogPGcgaWQ9IkxheWVyX3gwMDIwXzEiPg0KICA8bWV0YWRhdGEgaWQ9IkNvcmVsQ29ycElEXzBDb3JlbC1MYXllciIvPg0KICA8cGF0aCBjbGFzcz0iZmlsMCIgZD0iTTEwLjc1IDkuOTFsMi4xMyAtMi4xNGMwLjI5LC0wLjI4IDAuNzYsLTAuMjggMS4wNSwwIDAuMjksMC4yOSAwLjI5LDAuNzYgMCwxLjA1bC0zLjQxIDMuNDFjLTAuMjksMC4yOCAtMC43NSwwLjI4IC0xLjA0LDBsLTMuNDEgLTMuNDFjLTAuMjksLTAuMjkgLTAuMjksLTAuNzYgMCwtMS4wNSAwLjI5LC0wLjI4IDAuNzYsLTAuMjggMS4wNSwwbDIuMTQgMi4xNGMwLjc0LDAuNzQgMC43NCwwLjc0IDEuNDksMHoiLz4NCiA8L2c+DQo8L3N2Zz4NCg==) no-repeat;
    background-position: right 5px top;
    background-color: #DDD;
}

.UNI_select.board {
    box-shadow: 0 0 0 1px #679ac9;
}

.UNI_select .fake {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    font-size: 13px;
    padding: 3px 48px 0px 12px;
    text-wrap: nowrap;
    z-index: 1;
}

.UNI_select select {
    outline: 0;
    border: 0 !important;
    box-shadow: none;
    opacity: 0;
    padding: 0;
    z-index: 2;
}

.UNI_select select option {
    line-height: 1.5;
}


/* радиокнопки в виде переключателей с подписями */
:root{
  --UNI_toggle_btns_color: #171717;
  --UNI_toggle_btns_bgr: #FFF;
  --UNI_toggle_btns_color_active: #171717;
  --UNI_toggle_btns_bgr_active: #D9DADA;
  --UNI_toggle_btns_border-color: #D9DADA;
  --UNI_toggle_btns_height: 32px;
  --UNI_toggle_btns_border_radius: 25px;
  --UNI_toggle_btns_font-size: 13px;
}


.UNI_toggle_btns {
	display: inline-block;
	overflow: hidden;
	background-color: var(--UNI_toggle_btns_bgr);
	border-radius: var(--UNI_toggle_btns_border_radius);
	border: 1px solid var(--UNI_toggle_btns_border-color);
	color: var(--UNI_toggle_btns_color);
}
.UNI_toggle_btns .group-item {
	display: inline-block;
	/*
	float: left; 
*/	
}
.UNI_toggle_btns input[type=radio] {
	display: none;
}
.UNI_toggle_btns label.item_txt {
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
	cursor: pointer;
	padding: 5px 10px;
	height: var(--UNI_toggle_btns_height);
}
.UNI_toggle_btns label.item_txt .label_txt {
	font-size: var(--UNI_toggle_btns_font-size);
}
 
.UNI_toggle_btns .group-item:first-child label.item_txt {

}
.UNI_toggle_btns .group-item:last-child label.item_txt {

}
 
/* Checked */
.UNI_toggle_btns input[type=radio]:checked + label.item_txt {
	border-radius: var(--UNI_toggle_btns_border_radius);
	color: var(--UNI_toggle_btns_color_active);
	background: var(--UNI_toggle_btns_bgr_active);
}
.UNI_toggle_btns .group-item:first-child input[type=radio]:checked + label.item_txt {
	border-right: 1px solid var(--UNI_toggle_btns_border-color);
}
.UNI_toggle_btns .group-item:last-child input[type=radio]:checked + label.item_txt {
	border-left: 1px solid var(--UNI_toggle_btns_border-color);
}
.UNI_toggle_btns .group-item:not(:first-child):not(:last-child) input[type=radio]:checked + label.item_txt { /*не первый и не последний элемент*/
	border-right: 1px solid var(--UNI_toggle_btns_border-color);
	border-left: 1px solid var(--UNI_toggle_btns_border-color);
}
 
/* Hover */
.UNI_toggle_btns label.item_txt:hover {
	/*color: #666;*/
}
 
/* Disabled */
.UNI_toggle_btns input[type=radio]:disabled + label.item_txt {
	background: #efefef;
	color: #666;
}
/* радиокнопки в виде переключателей с подписями */