/*
 * Согласия: флажок в формах заявок и баннер о файлах cookie.
 *
 * Флажок согласия на обработку персональных данных в формах заявок (inc/consent.php).
 * Квадрат без заливки со скруглёнными углами и серой рамкой, отметка — галочкой:
 * в светлых формах (kt_discuss_form) синей, во всплывающих окнах .button-form
 * на синем фоне — белой.
 */
.brxe-form .form-group:has(input[name="form-field-ktcons[]"]) {
	grid-column: 1 / -1;
	width: 100%;
}

/* Подпись группы нужна только экранным дикторам */
.brxe-form .form-group:has(input[name="form-field-ktcons[]"]) > .label {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.brxe-form .form-group:has(input[name="form-field-ktcons[]"]) .options-wrapper {
	margin: 0;
	padding: 0;
	list-style: none;
}

.brxe-form .form-group:has(input[name="form-field-ktcons[]"]) li {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0;
}

/* Размеры — с !important: у каждой формы Bricks свои стили полей (ширина, отступы,
   скругление), и они задаются селектором по id формы */
.brxe-form input[name="form-field-ktcons[]"] {
	-webkit-appearance: none;
	appearance: none;
	flex: none;
	width: 22px !important;
	min-width: 0 !important;
	height: 22px !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 1.5px solid #9aa3b2 !important;
	border-radius: 5px !important;
	background-color: transparent !important;
	background-image: none !important;
	background-position: center !important;
	background-size: 14px !important;
	background-repeat: no-repeat !important;
	cursor: pointer;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.brxe-form input[name="form-field-ktcons[]"]:checked {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232a3efa' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4.5 12.5 4.5 4.5L19.5 6.5'/%3E%3C/svg%3E") !important;
}

.brxe-form input[name="form-field-ktcons[]"]:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px rgba(42, 62, 250, 0.25);
}

.brxe-form input[name="form-field-ktcons[]"] + label {
	margin: 0;
	padding: 0;
	font-size: 13px;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: normal;
	text-transform: none;
	color: #6b7280;
	cursor: pointer;
}

.brxe-form input[name="form-field-ktcons[]"] + label a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 2px;
}

@media (hover: hover) {
	.brxe-form input[name="form-field-ktcons[]"] + label a:hover {
		color: #2a3efa;
	}
}

/* Всплывающие окна на синем фоне */
.brxe-form.button-form input[name="form-field-ktcons[]"] {
	border-color: #c9cedb !important;
}

.brxe-form.button-form input[name="form-field-ktcons[]"]:checked {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4.5 12.5 4.5 4.5L19.5 6.5'/%3E%3C/svg%3E") !important;
}

.brxe-form.button-form input[name="form-field-ktcons[]"]:focus-visible {
	box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.45);
}

.brxe-form.button-form input[name="form-field-ktcons[]"] + label {
	color: #fff;
}

@media (hover: hover) {
	.brxe-form.button-form input[name="form-field-ktcons[]"] + label a:hover {
		color: #fff;
		text-decoration-thickness: 2px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.brxe-form input[name="form-field-ktcons[]"] {
		transition: none;
	}
}

/*
 * Баннер о файлах cookie (плагин Cookie Notice; текст и цвета — в его настройках,
 * их задаёт tools/fix-prod-forms.php). Вместо полосы во всю ширину — карточка
 * в левом нижнем углу, на телефоне — по ширине экрана с отступами.
 */
#cookie-notice.cn-position-bottom {
	left: 24px;
	right: auto;
	bottom: 24px;
	min-width: 0;
	width: min(420px, calc(100% - 32px));
	border: 1px solid #e4e9f2;
	border-radius: 16px;
	box-shadow: 0 12px 40px rgba(31, 41, 55, 0.16);
	font-family: inherit;
	text-align: left;
}

/* Закрытый баннер плагин не убирает, а только прячет содержимое — без этого правила
   от карточки остаётся полоска рамки с тенью. После «Понятно» плагин ставит класс
   cookie-revoke-visible, хотя кнопки отзыва согласия в настройках нет — смотрим на неё */
#cookie-notice.cookie-notice-hidden:not(:has(.cookie-revoke-container)) {
	display: none;
}

#cookie-notice .cookie-notice-container {
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 20px 22px;
	text-align: left;
}

#cookie-notice .cn-text-container {
	display: block;
	margin: 0;
	font-size: 14px;
	line-height: 1.5;
}

#cookie-notice .cn-buttons-container {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 20px;
}

#cookie-notice .cn-button:not(.cn-button-custom) {
	margin: 0;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
}

#cookie-notice #cn-accept-cookie {
	padding: 12px 28px;
	border-radius: 10px;
	color: #fff;
	transition: background-color 0.2s ease;
}

#cookie-notice #cn-more-info {
	padding: 4px 0;
	background: none !important;
	color: #2a3efa;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Крестик дублирует «Понятно» и наезжает на текст */
#cookie-notice .cn-close-icon {
	display: none;
}

@media (hover: hover) {
	#cookie-notice #cn-accept-cookie:hover {
		background-color: #1f30d6 !important;
	}

	#cookie-notice #cn-more-info:hover {
		text-decoration-thickness: 2px;
	}
}

@media (max-width: 478px) {
	#cookie-notice.cn-position-bottom {
		left: 16px;
		bottom: 16px;
	}
}