/* ============================================

   ЧЕКБОКСЫ СОГЛАСИЯ — ГЛОБАЛЬНЫЕ СТИЛИ

   ============================================ */

.rkn-consent-wrapper {

  display: flex;

  flex-direction: column;

  gap: 12px;

  margin-bottom: 16px;

  width: 100%;

}

.rkn-consent-item {

  display: flex;

  align-items: flex-start;

  gap: 10px;

  cursor: pointer;

  user-select: none;

}

/* Скрываем стандартный чекбокс */

.rkn-consent-item input[type="checkbox"] {

  position: absolute;

  opacity: 0;

  width: 0;

  height: 0;

  margin: 0;

}

/* Кастомный чекбокс */

.rkn-consent-box {

  display: flex;

  align-items: center;

  justify-content: center;

  flex-shrink: 0;

  width: 20px;

  height: 20px;

  margin-top: 2px;

  border: 2px solid #cccccc;    /* ← ЗАМЕНИТЕ на цвет вашего бренда */

  border-radius: 4px;

  background-color: #ffffff;

  transition: all 0.2s ease;

}

/* Галочка внутри чекбокса */

.rkn-consent-box::after {

  content: '';

  display: none;

  width: 5px;

  height: 9px;

  border: 2px solid #ffffff;

  border-top: none;

  border-left: none;

  transform: rotate(45deg) translateY(-1px);

}

/* Состояние: отмечено */

.rkn-consent-item input[type="checkbox"]:checked + .rkn-consent-box {

  background-color: #000000;    /* ← ЗАМЕНИТЕ на акцентный цвет вашего бренда */

  border-color: #000000;        /* ← ЗАМЕНИТЕ на акцентный цвет вашего бренда */

}

.rkn-consent-item input[type="checkbox"]:checked + .rkn-consent-box::after {

  display: block;

}

/* Состояние: ошибка (не отмечен при попытке отправки) */

.rkn-consent-item.rkn-error .rkn-consent-box {

  border-color: #e53935;        /* ← цвет ошибки, можно изменить */

  background-color: #fff5f5;

}

/* Текст рядом с чекбоксом */

.rkn-consent-text {

  font-size: 13px;              /* ← ЗАМЕНИТЕ на размер шрифта вашего сайта */

  line-height: 1.5;

  color: #555555;               /* ← ЗАМЕНИТЕ на цвет текста вашего сайта */

  font-family: inherit;

}

/* Ссылки внутри текста */

.rkn-consent-text a {

  color: #000000;               /* ← ЗАМЕНИТЕ на цвет ссылок вашего сайта */

  text-decoration: underline;

  transition: opacity 0.2s ease;

}

.rkn-consent-text a:hover {

  opacity: 0.7;

}

/* Текст ошибки под чекбоксом */

.rkn-consent-error-msg {

  display: none;

  font-size: 12px;

  color: #e53935;               /* ← цвет ошибки, можно изменить */

  margin-top: 4px;

  margin-left: 30px;

}

.rkn-consent-item.rkn-error + .rkn-consent-error-msg {

  display: block;

}

/* Чекбоксы снаружи формы — добавляем отступы */

.t-rec + .rkn-consent-wrapper,

form + .rkn-consent-wrapper {

  margin-top: 16px;

  margin-bottom: 16px;

  padding: 0 16px;

}


