/* #TEST GROUP STYLE */
.TTTG1 .btn_score-test {
  background-color: #6aa84f;       /* fresh green */
  color: #ffffff;                  /* white text */
  border: 3px solid #38761d;       /* darker green border */
  border-radius: 12px;
  font-size: var(--font-large);
  font-weight: bold;
  padding: 1.5rem 2rem;
  cursor: pointer;
  /*box-shadow: 2px 2px 6px rgba(0,0,0,0.2);*/
  transition: background-color 0.2s, transform 0.2s;
}

.TTTG1 .btn_score-test:hover {
  background-color: #93c47d;       /* lighter green on hover */
  transform: scale(1.05);
}

.TTTG1 .btn_score-test:active {
  background-color: #38761d;       /* darkest green on click */
  transform: scale(0.95);
}
.TTTG1 .test-group__name{
	font-weight: bold;
	font-size: var(--font-x-large);
	margin: 0 0 30px 0;
}
.TTTG1 .exercise__statement, .workspace__statement {
	font-size: 1.2rem;
}
.TTTG1 .workspace__area p{
	font-size: 2rem;
}
.TTTG1 .input--1D{
	font-size: 2rem;
	/*-webkit-appearance: none;
	appearance: none;*/
	padding: 0 0 0 2px;
	border-radius: 5px;
	border: 1px solid grey;
	text-align: left;
}
.TTTG1 .exercise__subject-title {
	font-size: var(--font-large);
	font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
	font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}
.TTTG1 .exercise__current-number {
	height: 2.5rem;
	width: 3rem;
	border-radius: 0.2rem;
	font-size: var(--font-medium);
	background-color: #ffd966; /* bright yellow */
	color: #380368; /* dark grey for good contrast */	
	border: 2px solid white;
	outline: 2px solid #ff9900;
}

.TTTG1 .tracker__item {
	height: 2rem;
	width: 2rem;
	background-color: #bd9ee0;
	background-color: #d7c0f2;
	border-radius: 0.2rem;
	font-size: var(--font-x-small);
	color: #4a4a4a;
	text-decoration: none;
	cursor: pointer;
	border: 3px solid white;
}
.TTTG1 .tracker__item--selected {
	background-color: #ffd966; /* bright yellow */
	/* color: #4a4a4a; dark grey for good contrast */
	transition: transform 0.2s, background-color 0.2s;
	outline: 2px solid #ff9900;
}
.TTTG1 .tracker__item--submitted {
	background-color: #d9d9d9;  /* light gray to indicate "done" */
	color: #666666;             /* darker gray text */
	opacity: 0.8;
	transform: none;            /* remove hover/selected effects */
}

.TTTG1 .exercise__current-number--correct, .TTTG1 .tracker__item--correct {	
	background-color: #92D050;
	color:white;
}
.TTTG1 .exercise__current-number--incorrect, .TTTG1 .tracker__item--incorrect {	
	background-color: #FF0000;
	color: white;
}
.TTTG1 .exercise__current-number--unanswered, .TTTG1 .tracker__item--unanswered {	
	background-color: grey;
	color: white;
}
/* #endregion */

.TTTG1 .score__word {
	font-size: 3rem;
	font-weight: bold;
	letter-spacing:0.1rem;
}
.TTTG1 .score__word--A, .TTTG1 .score__word--B {
	color: #92D050;
}
.TTTG1 .score__word--C {
	color: #FFC000;
}
.TTTG1 .score__word--D, .TTTG1 .score__word--F {
	color: #FF0000;
}
.TTTG1 .score__svg-letter{
	font-size: 84px;
	font-weight: bold;
	fill: white;
  	stroke-width: 4;
	font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
.TTTG1 .score__letter--A, .TTTG1 .score__letter--B {
  stroke:  #00F2A9;
  stroke:  #00B050;
  fill:  #d4edda;
  fill:  #92D050;
}
.TTTG1 .score__letter--C {
  fill: #FFFF00;
  stroke: #FFC000;
}

.TTTG1 .score__letter--D, .TTTG1 .score__letter--F  {
  fill: #FF0000;
  stroke: #C00000;
}
.TTTG1 .workspace__area {
	justify-self: start;
}
.TTTG1 .exercise__statement, .TGT1	 .workspace__statement {
	font-size: var(--font-medium)
}
.TTTG1 .workspace__count-item {
	width: 6rem;
}

.TTTG1 .workspace__user-answers {
	display: grid;
	gap:15px;
	align-items: start;
}
.TTTG1 .input--small {
	display: inline-block;
	width: 6rem;
	font-size: 2rem;
}
.TTTG1 .input--medium {
	display: inline-block;
	width: 9rem;
	font-size: 2rem;
}
/* #endregion */

.bkg_0 {
	background-color: hsl(0, 0%, 100%);     
}
.bkg_1{
	background-color: hsl(0, 100%, 60%);
}
.bkg_2{
	background-color:hsl(40, 100%, 55%) ;
}
.bkg_3{
	background-color:hsl(60, 100%, 50%) ;
}
.bkg_4{
	background-color:hsl(120, 80%, 45%);
}
.bkg_5{
	background-color:hsl(200, 100%, 55%) ;
}
.bkg_6{
	background-color:hsl(330, 100%, 70%) ;
}
.bkg_7{
	background-color:hsl(45, 100%, 70%) ;
}
.bkg_8{
	background-color:hsl(160, 70%, 60%);
}
.bkg_9{
	background-color:hsl(210, 100%, 70%)	 ;
}
.bkg_10{
	background-color:hsl(270, 100%, 70%) ;
}
.bkg_11{
	background-color: hsl(70, 90%, 55%);
}
.bkg_12{
	background-color:hsl(50, 100%, 55%) ;
}
.bkg_13{
	background-color:hsl(200, 60%, 40%) ;
}
.bkg_14{
	background-color:hsl(220, 100%, 50%) ;
}
.bkg_15{
	background-color:hsl(290, 90%, 60%);
}
.bkg_16 {
	background-color: hsl(25, 100%, 65%);   /* tangerine */
}
.bkg_17 {
	background-color: hsl(95, 90%, 50%);    /* lime green */
}
.bkg_18 {
	background-color: hsl(185, 90%, 55%);   /* turquoise */
}
.bkg_19 {
	background-color: hsl(320, 100%, 65%);  /* bright magenta */
}
.bkg_20 {
	background-color: hsl(260, 100%, 55%);  /* deep purple */
}
.bkg_21 {
	background-color: hsl(0, 85%, 70%);     /* strawberry pink */
}