/******************
    User custom CSS
    ---------------

    In this file you can add your own custom CSS
    It will be loaded last, so you can override any other property.
    Also, it will never be updated. So if you inheritate a core template and just add here some CSS, you'll still benefit of all the updates
*/
/* VARIABLES START */
:root {
	/* URL */
	--url__banner: url("/surveys/upload/themes/survey/1704_TeDo template main/files/ls-banner.png");
	/* colors */
	--color__blue: #0048f4;
	--color__red: #d73224;
	--color__text: #3c414b;
	/* font */
	--ff__title: "TT Livret Subhead", "Times New Roman", Serif;
	--ff__main: "TT Commons Pro", Arial, Sans-Serif;
	--fw: normal;
	--fs: 16px;
	--lh: 20px;
	/* border radiuses */
	--rd__default: 8px;
	--rd__default_top: 8px 8px 0 0;
	--rd__default_bottom: 0 0 8px 8px;
	--rd__title: 4px 4px 0px 0px;
	/* sizes */
	--size__checkbox_unchecked: 22px;
	--size__checkbox_checked: 20px;
	/* durations */
	--time__transition: 0.1s ease-in-out;
}

/* VARIABLES END */

/*FONTS START*/
/* @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap'); */

#dynamicReloadContainer * {
	font-family: var(--ff__main);
	font-size: var(--fs);
	line-height: var(--lh);
	color: var(--color__text);
}

/* Titles */
#dynamicReloadContainer h1,
#dynamicReloadContainer h2,
#dynamicReloadContainer h3,
#dynamicReloadContainer h4,
#dynamicReloadContainer h5,
#dynamicReloadContainer h6 {
	--ff__main: var(--ff__title) !important;
	--fw: medium;
}

#dynamicReloadContainer h1 {
	--fs: 64px;
	--lh: 68px;
	--fw: normal;
}

#dynamicReloadContainer h2 {
	--fs: 52px;
	--lh: 56px;
}

#dynamicReloadContainer h3 {
	--fs: 40px;
	--lh: 44px;
}

#dynamicReloadContainer h4 {
	--fs: 28px;
	--lh: 32px;
}

#dynamicReloadContainer h5 {
	--fs: 24px;
	--lh: 28px;
}

#dynamicReloadContainer h6 {
	--fs: 20px;
	--lh: 24px;
}

#dynamicReloadContainer .tedo-typography__title_h1,
#dynamicReloadContainer .tedo-typography__title_h2,
#dynamicReloadContainer .tedo-typography__title_h3,
#dynamicReloadContainer .tedo-typography__title_h4,
#dynamicReloadContainer .tedo-typography__title_h5,
#dynamicReloadContainer .tedo-typography__title_h6 {
	--ff__main: var(--ff__title);
	--fw: medium;
}

#dynamicReloadContainer .tedo-typography__title_h1 {
	--fs: 64px;
	--lh: 68px;
	--fw: normal;
}

#dynamicReloadContainer .tedo-typography__title_h2 {
	--fs: 52px;
	--lh: 56px;
}

#dynamicReloadContainer .tedo-typography__title_h3 {
	--fs: 40px;
	--lh: 44px;
}

#dynamicReloadContainer .tedo-typography__title_h4 {
	--fs: 28px;
	--lh: 32px;
}

#dynamicReloadContainer .tedo-typography__title_h5 {
	--fs: 24px;
	--lh: 28px;
}

#dynamicReloadContainer .tedo-typography__title_h6 {
	--fs: 20px;
	--lh: 24px;
}

#dynamicReloadContainer .tedo-typography__subtitle-1,
#dynamicReloadContainer .tedo-typography__subtitle-2 {
	font-family: var(--ff_main);
}

#dynamicReloadContainer .tedo-typography__subtitle-1 {
	--fs: 24px;
	--lh: 30px;
}

#dynamicReloadContainer .tedo-typography__subtitle-2 {
	--fs: 18px;
	--lh: 22px;
}

#dynamicReloadContainer .tedo-typography__text_main {
	--fs: 16px;
	--lh: 20px;
}

#dynamicReloadContainer .tedo-typography__text_small {
	--fs: 14px;
	--lh: 18px;
}

@media (max-width: 768px) {
	#dynamicReloadContainer h1 {
		--fs: 34px;
		--lh: 40px;
	}

	#dynamicReloadContainer h2 {
		--fs: 32px;
		--lh: 36px;
	}

	#dynamicReloadContainer h3 {
		--fs: 30px;
		--lh: 38px;
	}

	#dynamicReloadContainer h4 {
		--fs: 26px;
		--lh: 30px;
	}

	#dynamicReloadContainer h5 {
		--fs: 22px;
		--lh: 26px;
	}

	#dynamicReloadContainer h6 {
		--fs: 20px;
		--lh: 24px;
	}

	#dynamicReloadContainer .tedo-typography__title_h1 {
		--fs: 34px;
		--lh: 40px;
	}

	#dynamicReloadContainer .tedo-typography__title_h2 {
		--fs: 32px;
		--lh: 36px;
	}

	#dynamicReloadContainer .tedo-typography__title_h3 {
		--fs: 30px;
		--lh: 38px;
	}

	#dynamicReloadContainer .tedo-typography__title_h4 {
		--fs: 26px;
		--lh: 30px;
	}

	#dynamicReloadContainer .tedo-typography__title_h5 {
		--fs: 22px;
		--lh: 26px;
	}

	#dynamicReloadContainer .tedo-typography__title_h6 {
		--fs: 20px;
		--lh: 24px;
	}

	#dynamicReloadContainer .tedo-typography__subtitle-1,
	#dynamicReloadContainer .tedo-typography__subtitle-2 {
		font-family: var(--ff_main);
	}

	#dynamicReloadContainer .tedo-typography__subtitle-1 {
		--fs: 21px;
		--lh: 26px;
	}

	#dynamicReloadContainer .tedo-typography__subtitle-2 {
		--fs: 17px;
		--lh: 22px;
	}

	#dynamicReloadContainer .tedo-typography__text_main {
		--fs: 16px;
		--lh: 20px;
	}

	#dynamicReloadContainer .tedo-typography__text_small {
		--fs: 14px;
		--lh: 18px;
	}
}

/*FONTS END*/

/* HEADER START */
/* Bg img */
/* set bg img styles */
#banner-bg {
	position: absolute;
	background-image: var(--url__banner);
	background-repeat: no-repeat;
	background-size: cover;
	z-index: -1;
}

/* Navbar */
/* unset bg colors */
.navbar,
.navbar-default {
	--color__text: white;
	box-shadow: unset;
	margin: unset;
	padding: 40px;
}

.fruity .navbar {
	background-color: rgba(255, 255, 255, 0.69) !important;
	backdrop-filter: blur(8px) !important;
	-webkit-backdrop-filter: blur(8px) !important;
}

.navbar-header {
	width: 100%;
}

@media (max-width: 640px) {
	.navbar-header {
		display: flex;
		flex-direction: column;
	}
}

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:focus,
.navbar-default .navbar-nav > .open > a:hover {
	background-color: transparent;
}

.nav .open > a,
.nav .open > a:focus,
.nav .open > a:hover {
	border: none;
}

a:hover span.caret {
	color: white !important;
}

.nav.navbar-nav.navbar-action-link.navbar-right
	.language_change_container.dropdown-menu
	.index-item {
	--color__text: #3c414b !important;
}

.language_change_container {
	height: auto;
	overflow: hidden !important;
}

@media (max-width: 767px) {
	.navbar-nav .open .dropdown-menu {
		background-color: white;
	}
}

.nav-link {
	--color__text: var(--color__blue);
}

@media screen and (min-width: 768px) {
	.nav-link {
		padding-top: 0 !important;
	}

	.navbar-collapse {
		padding-top: 0 !important;
	}
}

.fruity .navbar .navbar-nav .nav-item:after {
	background-color: var(--color__blue);
}

/* logo */
.navbar {
	padding: 0 !important;
	/*gap: 0 !important;*/
}

.logo-container {
	margin: 10px 20px;
}

.logo-container > img {
	max-height: 80px !important;
}

@media (max-width: 767px) {
	.navbar-brand {
		display: block !important;
		max-width: 180px !important;
		order: -1 !important;
		margin: 0 !important;
		margin-right: auto !important;
	}

	.logo {
		padding: 10px !important;
	}
}

/* Hide right buttons */
.collapse.navbar-collapse.navbar-nav-scroll.pt-2,
.navbar-toggler {
	display: none !important;
}

/* Main title */
.title-strip__wrapper {
	margin-bottom: 20px;
}

.title-strip .title-strip__heading {
	min-height: 20px;
	--color__text: white;
	margin-bottom: 20px;
}

.row:has(header) {
	width: 100%;
}

/* hide double */
.survey-name {
	display: none;
}

/* hide white space */
.top-container {
	display: none;
}

/* Description */
/* set text position */
.survey-description {
	margin-top: 40px;
	text-align: left;
}

.well {
	background-color: unset;
	border: unset;
	box-shadow: unset;
}

.group-title.space-col {
	margin-bottom: 1em;
}

/* HEADER END */

/* BODY START */
/* unset body padding */
body {
	padding: unset;
}

/* Question titles */
/* set titles bg color */
.question-title-container {
	background-color: var(--color__blue);
	border-radius: var(--rd__title);
}

/* set titles color */
.ls-label-question,
.question-number {
	--color__text: white;
}

/* .question-text .ls-label-question {
	--color__text: #3c414b;
} */

/* icons */
/* .mdi {
  margin: 0 5px;
} */
.ls-questionhelp {
	margin: 0 10px;
}
.button-item .ls-icon {
	display: inline-block;
}

/* style tips and warnings */
.question-container
	.question-valid-container:has(.ls-question-help > .ls-question-message),
.question-container .question-help-container {
	background-color: transparent !important;
}

.question-container .question-valid-container:has(> div) {
	--fs: 14px;
	margin-top: 10px;
}

.question-valid-container > div,
.ls-em-tip {
	display: flex;
	align-items: center;
}

.question-valid-container span {
	width: 20px;
	text-align: center;
}

/* tips */
.ls-question-help,
.ls-questionhelp {
	--color__text: var(--color__blue);
	--fs: 14px;
}

/* .fa-exclamation-circle {
  margin-right: 10px;
}

.fa-exclamation-circle:before {
  content: "🛈";
  font-size: 22px;
} */

/* warnings */
.ls-question-mandatory {
	--color__text: var(--color__red);
}
/* .ls-question-mandatory .fa-exclamation-circle:before {
  content: "!";
} */
.alert-warning {
	border-color: var(--color__red);
}

/* INPUTS */
#dynamicReloadContainer .form-control {
	box-sizing: border-box;
	height: 100%;
	padding: 14px 16px;
	border-radius: 8px !important;
}

.fruity .form-control:focus {
	border: 1px solid var(--color__blue);
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),
		0 0 8px rgba(0, 72, 244, 0.6);
}

/* CHECKBOXES */
/* type checkbox */
.checkbox-item label {
	padding-left: 10px;
}

.checkbox-item label::before {
	width: var(--size__checkbox_unchecked);
	height: var(--size__checkbox_unchecked);
	border: 2px solid var(--color__blue);
}

.checkbox-item label::after {
	width: var(--size__checkbox_checked);
	height: var(--size__checkbox_checked);
	background-image: url("/surveys/upload/themes/survey/1704_TeDo template main/files/check.png");
	background-repeat: no-repeat;
	background-size: 14px;
	background-position: left 3px center;
}

.checkbox-item input[type="checkbox"]:checked + label::after,
.checkbox-item input[type="radio"]:checked + label::after {
	content: "";
	background-color: var(--color__blue);
}

/* type radio */
.radio-item label {
	padding-left: 10px;
}

.radio-item label::before {
	width: 22px;
	height: 22px;
	left: 0;
	top: 0;
	border: 2px solid var(--color__blue);
}

.radio-item label::after {
	width: 10px;
	height: 10px;
	left: 6px;
	top: 6px;
}

body .answer-item label::after {
	background-color: var(--color__blue);
}

/* in massives */
.radio-item .ls-label-xs-visibility,
.checkbox-item .ls-label-xs-visibility {
	width: var(--size__checkbox_unchecked);
	height: var(--size__checkbox_unchecked);
	background-color: transparent;
}

/* LINKS */
/* set hover state */
/* a span {
  transition: color var(--time__transition);
} */

a:hover span {
	color: var(--color__blue) !important;
}

/* BTN */
#dynamicReloadContainer button {
	border-radius: var(--rd__default) !important;
	--fw: 600;
}

.ls-move-next-btn,
.ls-move-submit-btn,
.btn-primary {
	--color__text: white;
}

.btn-default {
	--color__text: var(--color__blue);
	border: 2px solid currentColor;
}

.ls-move-next-btn,
.ls-move-submit-btn,
.btn-primary,
.btn-primary.upload {
	background-color: var(--color__blue) !important;
	border: none !important;
}

.ls-move-next-btn:hover,
.ls-move-submit-btn:hover,
.btn-primary:hover,
.btn-primary.upload:hover {
	background-color: #4076f7 !important;
}

.btn-default:hover {
	border-color: currentColor;
}

.btn:focus,
.btn:focus-visible,
.btn-primary:focus,
.btn-primary:focus-visible,
.btn-default:focus,
.btn-default:focus-visible {
	outline: none !important;
	outline-color: unset !important;
	border-color: currentColor !important;
}

.btn-primary.active,
.btn-primary:active,
.open > .dropdown-toggle.btn-primary {
	background-color: #000f9b !important;
}

.btn-outline-secondary {
	border-color: var(--color__blue) !important;
}

.btn-outline-secondary:hover {
	background-color: rgba(0, 72, 244, 0.25) !important;
}

.btn-outline-secondary:active {
	background-color: rgba(0, 72, 244, 0.1) !important;
}

.btn-outline-secondary:focus,
.btn-outline-secondary:focus-visible {
	border: none !important;
	outline: none !important;
}

.fruity .modal-footer .btn-outline-secondary {
	color: var(--color__text) !important;
}

/* MODAL */

.upload-button {
	margin-bottom: 20px;
}

.upload-div {
	margin-bottom: 20px;
}

.upload-div button {
	color: var(--color__blue);
}

/* .upload-div button:hover {
  background-color: #000F9B !important;
} */

.fruity .btn-outline-secondary {
	border-color: var(--color__blue);
}

.alert.alert-info.uploadmsg {
	color: var(--color__blue);
	border-color: var(--color__blue);
}

.uploadstatus.alert.alert-warning {
	color: var(--color__red);
	border-color: var(--color__red);
}

.btn-success {
	background-color: var(--color__blue);
	border: none;
}

.btn-success:hover {
	background-color: #000f9b !important;
	border: none;
}

.btn-danger {
	background-color: var(--color__red);
	border: none;
}

.btn-danger:hover span,
.btn-primary:hover span {
	color: white !important;
}

.fa.fa-pencil {
	display: none;
}

@media (max-width: 768px) {
	#navigator-container {
		padding-right: 15px;
		padding-left: 15px;
	}
}

/* SCALES */
.tooltip-inner {
	--color__text: white;
}

.slider.slider-untouched .slider-handle {
	background-color: var(--color__blue);
}

/* CALENDAR */
.day.active {
	--color__text: white;
}

.fa-trash-o:before {
	content: "Очистить выбор";
}

.fa.fa-chevron-right::before {
	content: "\276F";
}

.fa.fa-chevron-left::before {
	content: "\276E";
}

/* QUESTION HELPERS */
.boilerplate.question-container .question-title-container {
	background-color: transparent !important;
	border: 1px solid var(--color__text) !important;
	border-radius: 4px !important;
}

.boilerplate.question-container .question-title-container .ls-label-question,
.ls-label-question em,
.ls-label-question strong,
.ls-label-question u {
	--color-text: #3c414b;
	color: var(--color-text) !important;
}

.ls-label-question strong {
	--color-text: #ffffff;
	color: var(--color-text) !important;
}

.boilerplate.question-container .question-title-container .ls-label-question * {
	--color-text: #3c414b;
	color: var(--color-text) !important;
}

/* SAVE SURVEY PAGE */
.save-message {
	margin-bottom: 40px !important;
}

.save-survey-form .save-survey-row {
	margin-bottom: 20px !important;
}

.save-survey-form .load-survey-row {
	margin-bottom: 30px !important;
}

.save-survey-form .load-survey-label,
.save-survey-form .save-survey-label {
	margin-bottom: 10px !important;
}

.save-survey-form .asterisk {
	display: none !important;
}

.save-survey-form .save-survey-row.save-survey-submit {
	display: flex !important;
	justify-content: center !important;
	margin-bottom: 30px !important;
}

.url-wrapper.url-wrapper-survey-return {
	text-align: center !important;
}

/* text */
.fruity .text-info,
.fruity .text-primary,
.fruity .text-success {
	color: var(--color__blue) !important;
}

/* Required question mark */
.fa-asterisk:before {
	content: "*" !important;
	font-size: 24px !important;
	color: white !important;
	font-weight: 700 !important;
}

.question-title-container {
	padding-top: 16px !important;
	padding-bottom: 16px !important;
}

/* Выравнивание текста в клектах влево */
.ls-answers tbody .answertext {
	text-align: left !important;
}

/* Скрыть кнопку Добавить строку */
/*.col-12.text-end {*/
/*    display: none !important;*/
/*}*/

/* Подвинуть вниз контейнер с благодарностью за прохождение опроса */
.completed-wrapper {
	padding-top: 30px !important;
}

/* Расположить подсказки в столбик, а не в строку */
.ls-questionhelp {
	display: grid !important;
}

/* Стилизация баннера с куки */
#customCookieBanner,
#customCookieBanner *,
#customCookieBanner ::after,
#customCookieBanner ::before {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
#customCookieBanner {
	position: fixed;
	bottom: -500px;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	max-width: 1200px;
	display: flex;
	justify-content: center;
	padding: 0 15px;
	transition: bottom 0.3s ease;
	z-index: 99999;
}
#customCookieBanner.active {
	bottom: 30px;
}
#customCookieBanner .content-wrapper {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 30px;
	padding: 30px;
	background-color: #fff;
	border: 1px solid var(--color__blue);
	border-radius: var(--rd__default);
}
@media screen and (min-width: 768px) {
	#customCookieBanner .content-wrapper {
		flex-direction: row;
		justify-content: space-around;
		align-items: center;
	}
}
#customCookieBanner .content-wrapper p {
	color: var(--color__text);
}
#customCookieBanner .content-wrapper p a,
#customCookieBanner .content-wrapper p a:active,
#customCookieBanner .content-wrapper p a:hover {
	--color__text: var(--color__blue);
	color: var(--color__blue) !important;
}
#customCookieBanner .content-wrapper button {
	--color__text: white;
	width: 100%;
	height: 45px;
	color: #fff !important;
	font-weight: 700;
	background-color: var(--color__blue);
	border: none;
	border-radius: var(--rd__default);
	transition: background-color 200ms ease;
}
@media screen and (min-width: 768px) {
	#customCookieBanner .content-wrapper button {
		max-width: 100px;
	}

	#customCookieBanner .content-wrapper button:hover {
		background-color: #2f6cff;
	}
}
/* BODY END */

/*# sourceMappingURL=style.css.map */