* {
	font-family: 'Inter', 'Roboto', sans-serif;
}

.home {
	min-height: 100svh;
	/* cobre a tela toda */
	color: #fff;

	/* Camadas de gradientes para dar profundidade */
	background:
		/* brilho suave no topo-esquerda */
		radial-gradient(1200px 600px at 20% -10%, #243446 0%, rgba(36, 52, 70, 0) 60%),
		/* brilho suave no canto inferior-direito */
		radial-gradient(900px 500px at 48% 60%, #1a2632 0%, rgba(26, 38, 50, 0) 55%),
		/* base vertical escura */
		linear-gradient(180deg, #121a22 0%, #0c1117 100%);

	background-attachment: fixed;
	/* sensação de profundidade */
}

.tootipwords {
	cursor: pointer;
}

.home::before {
	content: "";
	position: fixed;
	inset: 0;
	pointer-events: none;
	background:
		radial-gradient(80% 60% at 50% -10%, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0));
}

.logo {
	width: 25%;
	height: auto;
}

.btnstart {
	color: #00C2FF;
	text-decoration: none;
	font-size: 2rem;
	transition: .2s all;
}

.btnstart:hover {
	color: #ffffff;
	text-shadow: 0 0 12px #00C2FF;
}

.btnmenu {
	margin-top: 2rem;
	text-align: right;
}

.div-btnmenu {
	text-align: left;
}

.btnmenu img {
	height: 90px;
}

.btnmenu .btnpt {
	padding: 7px 16px;
	font-size: 0.75rem;
	min-width: 85px;
	border-radius: 8px;
}

.btn-languages {
	text-align: right;
	margin-top: 1.5rem;
}

@media (min-width: 1200px) {

	.container,
	.container-lg,
	.container-md,
	.container-sm,
	.container-xl {
		max-width: 1300px;
	}
}

@media (min-width: 1400px) {

	.container,
	.container-lg,
	.container-md,
	.container-sm,
	.container-xl,
	.container-xxl {
		max-width: 1420px;
	}
}

.btnpt {
	background-color: #00C2FF;
	color: #1C1C1C;
	font-weight: 700;
	font-size: 1.2rem;
	padding: 12px 50px;
	border-radius: 15px;
	text-transform: uppercase;
	text-decoration: none;
	transition: all 0.25s ease-in-out;
	display: inline-block;
	border: none;
	box-shadow: 0 4px 14px rgba(0, 194, 255, 0.35);
}

.btnpt:hover {
	background-color: #1C1C1C;
	color: #00C2FF;
	border: 1px solid #00C2FF;
	transform: scale(1.05);
	box-shadow: 0 6px 20px rgba(0, 194, 255, 0.5);
}

.btneng {
	background-color: #7c7c7a;
	padding: 10px 40px;
	color: #fff;
	border-radius: 25px;
	font-size: 1.5rem;
	z-index: 11;
	min-width: 165px;
}

.btneng:hover {
	color: #fff;
	background-color: #607d8b !important;
}

.btnentrar {
	text-align: center;
	margin-top: 1.5rem;
}

#perguntas {
	background-color: #fff;
	background-image: url('../images/fundoperguntas.svg');
	background-repeat: no-repeat;
	background-position-x: left;
	background-position-y: bottom;
	background-position: center;
	background-size: cover;
}

#perguntas-1 {
	background: linear-gradient(to right, #0074d9 0%, #ffffff 100%);
	background-image: url('../images/fundoperguntas.svg');
	background-repeat: no-repeat;
	background-position-x: left;
	background-position-y: bottom;
	background-position: center;
	background-size: cover;
}

.iconeperguntas {
	padding-top: 4rem;
	height: 15rem !important;
}

.questionModal img {
	width: 40px;
	height: 40px;
}

.questionModal input[type="radio"] {
	visibility: hidden;
	opacity: 0;
	position: absolute;
}

#perguntas input[type="radio"] {
	visibility: hidden;
	opacity: 0;
	position: absolute;
}

#perguntas input[type="checkbox"] {
	visibility: hidden;
	opacity: 0;
	position: absolute;
}

#perguntas label {
	font-size: 3rem;
}

#perguntas input[type="radio"]:checked+label {
	color: #fff;
}

#perguntas [type=radio]+img {
	cursor: pointer;
	opacity: 0.5;
	height: 4rem;
}

#perguntas [type=radio]:checked+img {
	opacity: 1;
}

#perguntas [type="checkbox"]+img {
	cursor: pointer;
	opacity: 0.5;
	height: 176px;
}

#perguntas [type="checkbox"]:checked+img {
	opacity: 1;
}

#perguntas [type="checkbox"]:checked+img+h3 {
	opacity: 1;
}

.questionModal [type="radio"]+img {
	cursor: pointer;
	opacity: 0.5;
}

.questionModal [type="radio"]:checked+img {
	opacity: 1;
}

.questionModal [type="radio"]:checked+img+h3 {
	opacity: 1;
}

.custom-radio input[type="radio"] {
	display: none;
}

.tooltip-inner {
	max-width: 500px;
	/* width: 350px;  */
	text-align: left;
	padding-top: 20px;
}

.tooltip {
	max-width: 500px !important;
	/* Define a largura máxima do tooltip */
}

/* Estilo para o span que vai mostrar os parênteses e o "X" */
.custom-radio .radio-mark {
	display: inline-block;
	vertical-align: middle;
	margin-right: 5px;
	font-size: 18px;
	cursor: pointer;
}

/* Quando o input está selecionado, adiciona o "X" dentro dos parênteses */
.custom-radio input[type="radio"]:checked+.radio-mark::before {
	content: '( ✓ ';
	position: absolute;
	margin-right: 0;
	pointer-events: none;
	font-size: 18px;
}

.custom-radio {
	font-size: 18px;
	margin-right: 10px;
	position: relative;
}

.questionModal h3 {
	font-size: 20px;
}

.portugues {
	display: block;
	max-width: 300px;
	margin: 0 auto;
	background: rgb(163, 206, 255);
	background: linear-gradient(180deg, rgba(163, 206, 255, 1) 0%, rgba(66, 160, 199, 1) 100%);
	border: 1px solid #5B9BD5;
	margin-bottom: 1rem;
}

.ingles {
	display: block;
	max-width: 300px;
	margin: 0 auto;
	background: rgb(255, 218, 163);
	background: linear-gradient(180deg, rgba(255, 218, 163, 1) 0%, rgba(199, 128, 66, 1) 100%);
	border: 1px solid #FFC000;
}

.imagealgoritmo {
	width: 100%;
}

.iconealgoritmo {
	cursor: pointer;
	position: absolute;
	top: 15px;
	right: 15px;
}

.iconealgoritmo img {
	height: 100px;
}

.yes {
	margin-right: 2rem;
	color: #a6fd47;
}

.no {
	color: red;
}

.texticones {
	background-color: #2A2A2A;
	border-radius: 15px;
	color: #00C2FF;
	width: 50%;
	margin: 0 auto;
	padding: 0.5rem;
	margin-top: 1rem;
	border: 1px solid rgba(0, 194, 255, 0.2);
}

.texticonesselecionaveis {
	border-radius: 15px;
	color: #1C1C1C;
	width: 100%;
	margin: 0 auto;
	padding: 0.5rem;
	margin-top: 1rem;
	border: 0px;
	opacity: 0.5;
}

.texticonesselecionaveis2 {
	border-radius: 15px;
	color: #E0E0E0;
	width: 100%;
	margin: 0 auto;
	padding: 0.5rem;
	margin-top: 1rem;
	border: 1px solid rgba(0, 194, 255, 0.25);
	opacity: 0.6;
	background-color: #2A2A2A;
	cursor: pointer;
}

#perguntas [type="checkbox"] .texticonesselecionaveis2:checked {
	opacity: 1;
}

#perguntas [type="checkbox"] .texticonesselecionaveis:checked {
	opacity: 1;
}

#pontuacao {
	padding-top: 5rem;
}

#pontuacao h1 {
	margin-bottom: 5rem;
	font-size: 4rem;
}

#pontuacao h2 {
	background-color: #1C1C1C;
	color: #00C2FF;
	padding: 1rem;
	display: inline-block;
	margin-bottom: 2rem;
	font-size: 3rem;
	border-left: 4px solid #00C2FF;
}

#pontuacao p {
	margin-bottom: 3rem;
}

#pontuacao img {
	padding-top: 7rem;
	height: 23rem;
}

.iconesobre {
	padding-top: 1rem;
	height: 10rem;
}

#sobre {
	padding-top: 1rem;
}

#sobre a {
	color: #000;
}

.modalalgoritmo {
	display: table;
}

.section-cs {
	margin-bottom: 2rem;
	text-align: left;
}

.section-cs h3 {
	font-size: 1.5rem;
	margin-bottom: 1rem;
	font-weight: 600;
}

.check-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
	gap: .5rem;
	text-align: left;
}

/* Result layout */
.resultado-cs>* {
	margin-bottom: 1.5rem;
	font-size: 20px;
}

.resultado-cs .score-block {
	background-color: #1C1C1C;
	border: 1px solid rgba(0, 194, 255, 0.3);
	border-radius: 10px;
	padding-top: 1rem;
	padding-bottom: 1rem;
	margin: 5px;
	color: #00C2FF;
}

.resultado-cs .conduta-block {
	background-color: #2A2A2A;
	border: 1px solid rgba(0, 194, 255, 0.2);
	border-radius: 10px;
	padding-left: .5rem;
	padding-top: 2rem;
	padding-bottom: 2rem;
	text-align: left !important;
	color: #E0E0E0;
}

.fadein-animacao {
	-webkit-animation: fadein 1s ease-in-out;
	-moz-animation: fadein 1s ease-in-out;
	-o-animation: fadein 1s ease-in-out;
	animation: fadein 1s ease-in-out;
}

.is-invalid {
	border: 1px solid red;
}

.invalid-feedback {
	color: red;
	font-size: 0.875em;
	text-align: right;
}

@keyframes fadein {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

/* Firefox < 16 */
@-moz-keyframes fadein {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

/* Internet Explorer */
@-ms-keyframes fadein {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

.hintsandtips {
	color: #121212;
	text-decoration: none;
	transition: all .2s;
}

.img-languages {
	height: 40px;
	width: 40px;
	cursor: pointer;
}

.questionModal table,
td {
	border: 1px solid #000;
}

.width-input {
	width: 50%;
}

.table-responsive .col-description {
	text-align: left;
	width: 80%;
}

.table-responsive .col-checkbox {
	width: 20%;
	align-content: center
}

.table-responsive .col-checkbox input[type="checkbox"] {
	display: block;
	margin: 0 auto;
	cursor: pointer;
	transform: scale(1.5);
	-webkit-transform: scale(1.5);
}

.next-btn {
	cursor: pointer;
}

.div-medicamentos h3 {
	font-size: 20px;
	text-align: center;
	border: 1px solid rgba(0, 194, 255, 0.3);
	margin: 0;
	padding: 3px 0px;
	cursor: pointer;
	background-color: #1C1C1C;
	color: #00C2FF;
	letter-spacing: 0.5px;
}

.medicamentos-amarelo {
	background-color: #2A2A2A !important;
	color: #00C2FF !important;
	border-left: 3px solid #00C2FF !important;
}

.medicamentos-vinho {
	background-color: #1C1C1C !important;
	cursor: pointer;
	color: #ff6b6b !important;
	border-left: 3px solid #ff6b6b !important;
}

.medicamentos-vermelho {
	background-color: #1C1C1C !important;
	cursor: pointer;
	color: #ff4444 !important;
	border-left: 3px solid #ff4444 !important;
}

.prev-btn {
	cursor: pointer;
	transform: scaleX(-1);
	-webkit-transform: scaleX(-1);
}

#texto-home {
	font-size: 1.5rem;
	color: #E0E0E0;
	margin-top: 0.5rem;
	line-height: 1.5;
	letter-spacing: 0.5px;
}

@media (max-width: 700px) {
	.medicamentosModal .modal-body {
		height: 100vh;
		overflow-y: auto;
	}

	.colmd6mobile50wd {
		max-width: 50%;
	}

	.colmd6mobile50wd img {
		height: 10rem;
	}

	.colmd6mobile50wd .texticones {
		width: 100%;
	}

	.iconealgoritmo img {
		height: 50px;
	}

	.width-input {
		width: 100%;
	}

	.modal-body {
		max-width: 100%;
		overflow-x: auto;
	}

	.div-logo {
		margin-bottom: 1rem;
	}

	.logo {
		width: 65%;
		height: auto;
	}

	#texto-home {
		font-size: 19px;
		margin-top: 0;
	}

	.tooltip {
		max-width: 350px !important;
		/* Define a largura máxima do tooltip */
		margin-left: 13px !important;
	}

	.btnmenu {
		/* margin-top: 1rem; */
		text-align: right;
	}

	.div-btnmenu {
		text-align: center;
	}

}