@font-face {
   font-family: 'Rubik';
   src: url('../fonts/Rubik-Variable/Rubik-Variable.woff2') format('woff2');
   font-weight: 100 1000;
   font-optical-sizing: auto;
   font-stretch: 0% 200%;
   font-style: normal;
   font-display: swap;
}

/* 
custom-checkbox-v2
*/
.custom-checkbox-v2 {
   /* Устанавливаем позицию элемента */
   --custom-checkbox-v2--position: relative;
   /* Устанавливаем отображение элемента */
   --custom-checkbox-v2--display: inline-flex;
   /* Выравнивание по центру по высоте */
   --custom-checkbox-v2--align-items: center;
   /* Устанавливаем курсор */
   --custom-checkbox-v2--cursor: pointer;
   /* Отступ между чекбоксами */
   --custom-checkbox-v2--mb: 20px;
   /* Устанавливаем прозрачность */
   --custom-checkbox-v2--opacity: 0;
   /* Устанавливаем ширину */
   --custom-checkbox-v2--width: 0;
   /* Устанавливаем высоту */
   --custom-checkbox-v2--height: 0;

   /* Устанавливаем ширину для круглого чекбокса */
   --custom-checkbox-v2-round--width: 19px;
   /* Устанавливаем высоту для круглого чекбокса */
   --custom-checkbox-v2-round--height: 19px;
   /* Устанавливаем радиус границы для круглого чекбокса */
   --custom-checkbox-v2-round--border-radius: 50%;

   /* Устанавливаем ширину для квадратного чекбокса */
   --custom-checkbox-v2-square--width: 19px;
   /* Устанавливаем высоту для квадратного чекбокса */
   --custom-checkbox-v2-square--height: 19px;
   /* Устанавливаем содержимое для квадратного чекбокса */
   --custom-checkbox-v2-square--text-content: 'V';
   /* Устанавливаем высоту строки для квадратного чекбокса */
   --custom-checkbox-v2-square--line-height: 19px;
   /* Устанавливаем размер шрифта для квадратного чекбокса */
   --custom-checkbox-v2-square--font-size: 18px;

   /* Размер шрифта для текста метки кастомного чекбокса */
   --custom-checkbox-v2-label-text--font-size: 18px;
   /* Вес шрифта для текста метки кастомного чекбокса */
   --custom-checkbox-v2-label-text--font-weight: 300;
   /* Высота строки для текста метки кастомного чекбокса */
   --custom-checkbox-v2-label-text--line-height: 19px;
   /* Цвет текста метки кастомного чекбокса */
   --custom-checkbox-v2-label-text--color: #000000;

   /* Устанавливаем границу */
   --custom-checkbox-v2--border: 1px solid #00b0ff;
   /* Устанавливаем цвет фона */
   --custom-checkbox-v2--bg-color: #ffffff;
   /* Устанавливаем цвет фона при выборе */
   --custom-checkbox-v2-checked--bg-color: #00b0ff;
   /* Устанавливаем цвет текста при выборе */
   --custom-checkbox-v2-checked--text-color: #ffffff;
   /* Устанавливаем переход */
   --custom-checkbox-v2--transition: background-color 0.3s;
   /* Отступ между элементом и текстом */
   --custom-checkbox-v2--mr: 10px;
   /* Устанавливаем семейство шрифта */
   --custom-checkbox-v2-font-family: "Rubik", Verdana, Geneva, Tahoma, sans-serif;

   /* Устанавливаем позицию элемента */
   position: var(--custom-checkbox-v2--position);
   /* Устанавливаем отображение элемента */
   display: var(--custom-checkbox-v2--display);
   /* Выравнивание по центру по высоте */
   align-items: var(--custom-checkbox-v2--align-items);
   /* Устанавливаем курсор */
   cursor: var(--custom-checkbox-v2--cursor);
   /* Отступ между чекбоксами */
   margin-bottom: var(--custom-checkbox-v2--mb);
}

.custom-checkbox-v2.mr-20px {
   --custom-checkbox-v2--mr: 20px;
}

.custom-checkbox-v2 input {
   /* Устанавливаем прозрачность */
   opacity: var(--custom-checkbox-v2--opacity);
   /* Устанавливаем ширину */
   width: var(--custom-checkbox-v2--width);
   /* Устанавливаем высоту */
   height: var(--custom-checkbox-v2--height);
}

.custom-checkbox-v2__checkmark {
   /* Устанавливаем отображение элемента */
   display: inline-block;
   /* Устанавливаем границу */
   border: var(--custom-checkbox-v2--border);
   /* Устанавливаем цвет фона */
   background-color: var(--custom-checkbox-v2--bg-color);
   /* Устанавливаем переход */
   transition: var(--custom-checkbox-v2--transition);
   /* Отступ между элементом и текстом */
   margin-right: var(--custom-checkbox-v2--mr);
}

/* Для круглого чекбокса */
.custom-checkbox-v2__round .custom-checkbox-v2__checkmark {
   /* Устанавливаем ширину */
   min-width: var(--custom-checkbox-v2-round--width);
   max-width: var(--custom-checkbox-v2-round--width);
   width: var(--custom-checkbox-v2-round--width);
   /* Устанавливаем высоту */
   min-height: var(--custom-checkbox-v2-round--height);
   max-height: var(--custom-checkbox-v2-round--height);
   height: var(--custom-checkbox-v2-round--height);
   /* Устанавливаем радиус границы */
   border-radius: var(--custom-checkbox-v2-round--border-radius);
}

.custom-checkbox-v2__round input:checked+.custom-checkbox-v2__checkmark {
   /* Устанавливаем цвет фона при выборе */
   background-color: var(--custom-checkbox-v2-checked--bg-color);
}

/* Для квадратного чекбокса */
.custom-checkbox-v2__square .custom-checkbox-v2__checkmark {
   /* Устанавливаем ширину */
   min-width: var(--custom-checkbox-v2-square--width);
   max-width: var(--custom-checkbox-v2-square--width);
   width: var(--custom-checkbox-v2-square--width);
   /* Устанавливаем высоту */
   min-height: var(--custom-checkbox-v2-square--height);
   max-height: var(--custom-checkbox-v2-square--height);
   height: var(--custom-checkbox-v2-square--height);

   /* Устанавливаем семейство шрифта */
   font-family: var(--custom-checkbox-v2-font-family);
}

.custom-checkbox-v2__square input:checked+.custom-checkbox-v2__checkmark {
   /* Устанавливаем цвет фона при выборе */
   background-color: #00B0FF;
   /* Устанавливаем цвет текста */
   color: var(--custom-checkbox-v2-checked--text-color);
   /* Устанавливаем выравнивание текста */
   text-align: center;
   /* Устанавливаем высоту строки */
   line-height: var(--custom-checkbox-v2-square--line-height);
   /* Устанавливаем размер шрифта */
   font-size: var(--custom-checkbox-v2-square--font-size);
   /* Устанавливаем содержимое */
   content: var(--custom-checkbox-v2-square--text-content);
   /* Устанавливаем семейство шрифта */
   font-family: var(--custom-checkbox-v2-font-family);
}

.custom-checkbox-v2__square input:checked+.custom-checkbox-v2__checkmark:before {
   /* Устанавливаем семейство шрифта */
   font-family: var(--custom-checkbox-v2-font-family);
   /* Устанавливаем содержимое */
   content: var(--custom-checkbox-v2-square--text-content);
   /* Устанавливаем отображение элемента */
   display: inline-block;
}

.custom-checkbox-v2__label-text {
   font-family: var(--custom-checkbox-v2-font-family);
   font-size: var(--custom-checkbox-v2-label-text--font-size);
   line-height: var(--custom-checkbox-v2-label-text--line-height);
   font-weight: var(--custom-checkbox-v2-label-text--font-weight);
   color: var(--custom-checkbox-v2-label-text--color);
}