:root {
--body-color: #e4e9f7;
--sidebar-color: #144431;
--primary-color: #12C67C;
--primary-color-light: #23EB98;
--toggle-color: #ddd;
--text-color: #707070;
--tran-03: all 0.2s ease;
--tran-03: all 0.3s ease;
--tran-04: all 0.3s ease;
--tran-05: all 0.3s ease;
--Electric-Violet-lineral_blue: linear-gradient(180deg, #DEF2FF 0%, #FEFEFE 100%);
}
body {margin: 0;padding: 0 0 150px 0;box-sizing: border-box;min-height: 100vh;transition: var(--tran-05);font-family: 'Inter', sans-serif; height:100%;}
/* kleuren reminder, later optimaliseren of naar root */
.g0txt {color:#05774E;}
.g1txt {color:#0091F0;}
.g2txt {color:#D99334;}
.g3txt {color:#8930DE;}
.graytxt {color:#828282;}
/* filters boxen en input for sorting */
.filterbox {border-radius: 16px;background: var(--Electric-Violet-bg, #F7F7F7);padding: 30px;}
.filterbox-out {border-radius: 16px;border: 2px solid var(--Electric-Violet-bg, #F7F7F7);padding: 30px;}
.tt-input-group {width: 606px;}
.tt-input-group .form-control {height: 36px;}
.tt-input-group .input-group-text {background-color: white;border-right: 0;height: 36px;padding-right:0px;}
.tt-input-group .form-control, .tt-input-group .input-group-text {border-right: 0;}
.tt-input-group .form-control:focus {box-shadow: none;border-color: #ced4da;outline: 0;}
.connect {border-left:0}
.form-check-input {width: 20px;height: 20px;border-radius: 4px;}        
.form-check-input:checked {background-color: var(--Emerald-500, #11BB76);border-color: var(--Emerald-500, #11BB76);}
.tt-dd .dropdown-toggle::after {display: none;}
.tt-dd .dropdown-toggle {border: none;background-color: transparent;}
.tt-dd .dropdown-toggle:focus {box-shadow: none;outline: none;}
.tt-c .collapse-arrow {display: inline-block;transform: rotate(0);transition: transform 0.3s ease;}
.collapsed > .tt-c .collapse-arrow {transform: rotate(90deg);}
.trans td, .trans th {background-color: transparent;}
.trans tr td {border-bottom: none!important;}
.trans tbody {border-top: 1px solid #F2F2F2;font-size:12px;font-weight:400;color:#4F4F4F;}
.trans thead tr th{color:#4F4F4F;font-size:11px;font-weight:300;}
.tt-prof-menu .row>* {padding-right: 0!important;}
.noteblock {border-radius: 16px;background: var(--Apache-50, #FFF8E8);}
.fl {display: flex;flex-wrap: wrap;}
.fl > .col-7, .fl > .col-5 {display: flex;flex-direction: column;}
.noteblock, .mainbox {flex-grow: 1;}
.onboard {background: var(--Emerald-500, #11BB76);}
.g1finbox,.g2finbox,.g3finbox{border-radius: 16px;font-size: 12px;font-style: normal;font-weight: 500;line-height: 16px;width:180px;height: 54px;padding: 6px 8px;align-items: center;}
.g1finbox {border: 1px solid var(--Dodger-Blue-400, #8CD0FD);background: var(--Dodger-Blue-100, #DEF2FF);color:#065F9A}
.g2finbox {border: 1px solid var(--Apache-400, #F5C76C);background: var(--Apache-100, #FDF2D1);color:#9E661A}
.g3finbox {border: 1px solid var(--Electric-Violet-400, #C189FF);background: var(--Electric-Violet-100, #EBDBFD);color:#591E8D}
.text-bg-g1 {background:#DEF2FF;color:#333333;}
.text-bg-g2 {background:#FDF2D1;color:#333333;}
.text-bg-g3 {background:#EBDBFD;color:#333333;}
/* doelenoverzicht */
.tt-goal-list .active{border-bottom: 2px solid var(--Emerald-500, #11BB76);color:#022C1F;font-weight: 800;}
.tt-goal-list .nav-link{color:#022C1F;}
/* table */
.tt-table-goals {font-size:14px;}
tbody, td, tfoot, th, thead, tr {border-style:none;}
.tt-table-goals thead th {border-bottom: 1px solid #F2F2F2;color:#828282;font-size:11px;font-weight:400;}
.tt-table-goals tbody tr:nth-child(1) td {border-bottom: 1px solid #F2F2F2;}
.tt-table-goals th, .table td {border-top: none;}
.tt-table-goals tbody tr:last-child td {border-bottom: none;}
/*current goals */
.clickable-row {cursor: pointer;}
.clickable-row:hover {background-color: #f2f2f2;}
.tt-a .accordion-item:first-child {
border-top-left-radius: 14px;
border-top-right-radius: 14px;
}
.tt-a .accordion-item:first-child .accordion-button {
border-top-left-radius: 14px;
border-top-right-radius: 14px;
}
.tt-a .accordion-item:last-child {
border-bottom-left-radius: 14px;
border-bottom-right-radius: 14px;
}
.tt-a .accordion-item:last-child .accordion-button.collapsed {
border-bottom-left-radius: 14px;
border-bottom-right-radius: 14px;
}
.tt-a .accordion-button:not(.collapsed) {background-color:white;box-shadow:none;}
.tt-a .inactive {--bs-accordion-btn-icon: none;}
.disabled .g1txt {color:#8CD0FD}
.disabled .g2txt {color:#F5C76C}
.disabled .g3txt {color:#EBDBFD}
/* multiselect dropdown */
.dropdown-item.selected {
    background-color: #f0f0f0;
}
.dropdown-cur {
	display: block;
    width: 100%;
    padding: 0.375rem 2.25rem 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    background-color: var(--bs-body-bg);
    background-clip: padding-box;
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
}
.dropdown-menu:hover {color:#333;}
.dropdown-menu {color:#333;}
.dropdown-item:hover {
    color: #000; /* Keeps text color black for contrast */
    background-color: #808080; /* Gray background on hover */
}



#havoVwoCurriculumDropdown:hover, #vmboCurriculumDropdown:hover, #havoVwoCurriculumDropdown:active, #vmboCurriculumDropdown:active {
    background-color: #FFF;
	color:#333;
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
}
#havoVwoCurriculumDropdown:after, #vmboCurriculumDropdown:after {
    display: none; 
}
#havoVwoCurriculumDropdown, #vmboCurriculumDropdown{
    text-align: left;
}
/* sentiment */
.sen1{background-color:#23EB98;}
.sen2{background-color:#8CD0FD;}
.sen3{background-color:#F19078;}
.sen4{background-color:#C189FF;}
.sen5{background-color:#F5C76C;}
/* corrected order */
.st1{background-color:#23EB98}
.st2{background-color:#8CD0FD;}
.st3{background-color:#C189FF;}
.st4{background-color:#F5C76C}
.st5{background-color:#F19078;}
.pg {flex-grow: 1;}
.progress-container {display: flex;}
.progress-text {white-space: nowrap; width:150px}
.progress-bar {width: 100%;}
.fineline{border: none;height: 2px;background-color: #E0E0E0;margin: 0;}
.tt-chart {
max-height: 200px;
width: 100%;
}
.g1txt .nav-link.active {text-decoration:underline;}
/* table taken*/
.tt-table-taken {font-size:14px;border-style:none;}
.gt1 {color:#0091F0!important;font-weight:400;}
/* not in de figma file .gt2 {color:#0091F0!important;font-weight:400;} */
.tt-table-taken thead th {border-bottom: 1px solid #F2F2F2;color:#828282;font-weight:400;}
.tt-table-taken tbody tr:nth-child(1) td {border-bottom: 1px solid #F2F2F2;}
.tt-table-taken th, .table td {border-top: none;}
.tt-table-taken tr:last-child td {border-bottom: none;}
.tt-table-taken td, .tt-table-taken th {padding-top: 15px;padding-bottom: 15px;}
.g1 .accordion-button:not(.collapsed) {background-color: transparent!important; box-shadow: none;color:#0091F0;}
.g2 .accordion-button:not(.collapsed) {background-color: transparent!important; box-shadow: none;color:#D99334;}
.g3 .accordion-button:not(.collapsed) {background-color: transparent!important; box-shadow: none;color:#8930DE;}
/* feedback slider */

.tt-next, .tt-previous {
    background-color: #EEA440;
    width: 36px;
    height: 36px; 
    border-radius: 12px;
	border:0px;
}
.tt-next {padding-right:5px}
.tt-next.disabled, .tt-previous.disabled {
    background-color: #BDBDBD;
}
.tt-next:after, .tt-previous:after {
    content: ' '; 
}
.fmt-3 {margin-top:5%}
.deafult{background-color: var(--body-color);color: var(--Black-Gray-1, #333);}
.default h2{font-size: 28px;font-style: normal;font-weight: 700;line-height: normal;}
.default h4 {font-size: 22px;font-style: normal;font-weight: 600;line-height: normal;}
.mainbox {border-radius: 14px;background: var(--Black-White, #FEFEFE);}
.gbox{border-radius: 16px;border: 1px solid var(--Dodger-Blue-400, #B3DEFA);background: var(--Dodger-Blue-50, #E8F6FF);box-shadow: 0px 0.6px 3px 0px rgba(0, 0, 0, 0.12);}
.g1box {border-radius: 16px;border: 1px solid var(--Dodger-Blue-400, #B3DEFA);background: var(--Dodger-Blue-50, #E8F6FF);box-shadow: 0px 0.6px 3px 0px rgba(0, 0, 0, 0.12);}
.g2box{border-radius: 16px;border: 1px solid var(--Apache-400, #DAA845);background: var(--Apache-100, #F6ECCF);box-shadow: 0px 0.6px 3px 0px rgba(0, 0, 0, 0.12);}
.g3box{border-radius: 16px;border: 1px solid var(--Electric-Violet-400, #BD83FD);background: var(--Electric-Violet-100, #F3E8FF);box-shadow: 0px 0.6px 3px 0px rgba(0, 0, 0, 0.12);}
.gboxing{border-radius: 16px;padding:8px;height:48px;width:48px;}
.bulb{background: var(--Dodger-Blue-700, #1B9FF6);color: #fff}
.bulb2{background: var(--Apache-500, #E69C39);color: #fff}
.bulb3{background-color: #A454F8;color: #fff}
.telescope{color:#fff;background: var(--Apache-500, #D18C2F);}
.roos{color:#FFF;background: var(--Electric-Violet-500, #A454F8);}
.c-mw{max-width:1112px;}
.c-mh{max-height:153px}
::selection {background-color: var(--primary-color);color: #fff;}
.txt333{color:#333}
table .transparent-table {background-color: transparent!important}
.transparent-table {background-color: transparent!important;border-collapse: collapse;width: 100%;}
.transparent-table th, .transparent-table td {border: none;padding: 8px;text-align: left;}
.transparent-table thead {background-color: transparent!important;}
.transparent-table tbody {background-color: transparent!important;}
.goalsvg {max-height:80px;max-width:110px}
.gmscreen {max-width:520px;}
.goalsvgmain {max-height:162px;max-width:196px}
.goaltxtmain {max-height:auto;max-width:292px;font-size: 50px;font-style: normal;font-weight: 600;line-height: normal;}
.g1txtmain {color: var(--Dodger-Blue-700, #1B9FF6)}
.g2txtmain {color: var(--Apache-500, #E69C39)}
.g3txtmain {color: #8930DE}
.fms {margin-left:20%}
.bc{color: var(--Dodger-Blue-500, #59B3EF);font-size: 16px;font-style: normal;font-weight: 500;line-height: normal;}
.bc2{color: var(--Apache-500, #E69C39);font-size: 16px;font-style: normal;font-weight: 500;line-height: normal;}
.bc3{color: #8930D;;font-size: 16px;font-style: normal;font-weight: 500;line-height: normal;}
.btn {border-radius: font-size:14px;font-weight:500;}
.gone{display:none}
/* overzicht coach */
.tt-table-coach th, .tt-table-coach td {
    vertical-align: middle;
    text-align: left;
    font-weight: 400;
    color: #333;
    box-shadow: none !important;
    background-color: transparent !important; 
}
.tt-table-coach th {
    font-size: 13px;
    font-weight: 300;
}
.tt-table-coach td {
    font-size: 14px;
}
.tt-table-coach tr {
	padding: 0px 20px;
}
.tt-table-coach {
    --bs-table-bg: transparent;
    --bs-table-striped-bg: transparent;
    --bs-table-hover-bg: transparent;
}
.tt-table-coach tr.gb {
    background-color: #F2F2F2 !important;
}
.tt-table-coach tr.gb td:first-child, .tt-table-coach tr.gb td:last-child {
    border-radius: 0 !important;
}
.tt-table-coach tr.gb td:first-child {
    border-top-left-radius: 16px !important;
    border-bottom-left-radius: 16px !important;
}
.tt-table-coach tr.gb td:last-child {
    border-top-right-radius: 16px !important;
    border-bottom-right-radius: 16px !important;
}
.tt-table-coach .collapse-arrow svg {
    fill: #4F4F4F;
}
.tt-table-coach .collapse .table, .tt-table-coach .collapse .table tr {
    border: none;
}
.tt-table-coach .collapse .table tr:last-child {
    border-bottom: 1px solid #dee2e6;
}
.tt-table-coach .collapse .table td, .tt-table-coach .collapse .table th {
    border-left: none;
    border-right: none;
}
.tt-table-coach > tbody > tr:first-child td:first-child,
.tt-table-coach > tbody > tr:last-child td:first-child,
.tt-table-coach > tbody > tr:first-child td:last-child,
.tt-table-coach > tbody > tr:last-child td:last-child {
    border-radius: 16px !important;
}
.note, .note td, .note th, .note tbody, .note tbody tr {border-radius: 16px;background: var(--Apache-50, #FFF8E8);}
.fs-12 {font-size:12px;}
.fs-14 {font-size:14px;}
.dropdown-menu {
    display: none;
}
.dropdown-menu.show {
    display: block;
}
/* dataTables */
.table .col-sm {
    flex: 0 0 auto;
    width: auto;
}
.dataTables_filter label {
    display: flex;
    align-items: center;
}
.dataTables_filter input[type="search"] {
    margin-left: 0.5em;
    margin-top: 0;
}
.dataTables_length {
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 10px; 
}
.dataTables_length label {
    display: flex;
    align-items: center;
    white-space: nowrap; 
}
.dataTables_length label select {
    margin-right: 1em; 
}

.dataTables_paginate {
    float: right; 
}

.pagination .page-item.active .page-link {
    background-color: #A8F9CE;
    border-color: #A8F9CE;
}

.pagination .page-item .page-link:hover {
    background-color: #96f2d7;
}
table.dataTable thead {font-size:12px}
table.dataTable thead .sorting::after,
table.dataTable thead .sorting_asc::after,
table.dataTable thead .sorting_desc::after {
    display: inline;
    width: 11px;
    height: 11px;
	font-weight:200;
    margin-left: 8px;
	padding: 0 5px;
    background-repeat: no-repeat;
    background-position: center;
    content: "";
}

table.dataTable thead .sorting::after {
    background-image: url('svg/sort.svg');
	color: #022C1F; 
}

table.dataTable thead .sorting_asc::after {
    background-image: url('svg/sort_up.svg');
	color: #022C1F;
}

table.dataTable thead .sorting_desc::after {
    background-image: url('svg/sort_down.svg');
	color: #022C1F;
}

table.dataTable thead th {
    font-size: 1rem;
    color: #022C1F;
}

table.dataTable {font-size:12px;}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    color: #022C1F; !important;
}

.pagination a{color:#022C1F}

/* clndr */
#tt-calendar {max-width: 900px;}
#tt-calendar-prof, .fc-col-header {min-width: 900px;width:100%!important;font-size:12px}
.round-white{margin: 10px auto 0px auto;background-color: white;border-radius: 16px;padding:20px;}
.round-green {border-radius: 16px;background: var(--Emerald-50, #ECFDF4);color: var(--Emerald-700, #05774E);font-size: 18px;font-style: normal;font-weight: 500;line-height: normal;}
.round-green-cent {border-radius: 16px;background: var(--Emerald-50, #ECFDF4);color: var(--Emerald-700, #05774E);font-size: 16px;font-style: normal;font-weight: 300;line-height: normal;display: flex;justify-content: center; align-items: center; text-align: center; height: 100px; border: 1px solid var(--Black-Gray-2, #4F4F4F); flex-direction: column; margin: 5px;}
.box {padding:20px;max-width:90%;}
.fc-header-toolbar {
	background-color: #fff;
	border-bottom: 0px;
}

.fc-toolbar-title {
	font-size: 24px;
	color: #333;
}

.fc-button {
	background-color: #fff;
	color: #333;
	border: 1px solid #ddd;
	padding: 4px 8px;
	margin: 4px;
	border-radius: 4px;
	cursor: pointer;
}
.fc-prev-button {padding:0;font-size:12px;}
.fc-button-primary {
	background-color: #007bff;
	color: white;
}

.fc-button-primary:not(:disabled):hover {
	background-color: #0056b3;
}

.fc-button-active {
	box-shadow: inset 0 3px 5px rgba(0,0,0,0.125);
}
.fc-event-main-frame {
	min-height: 80px;
	height: auto;
	overflow: hidden;
}
.fc-event-title, .fc-event-body {
	white-space: normal; 
	overflow: hidden; 
	text-overflow: ellipsis;
	padding: 5px 10px!important;
	font-size: 12px;
	font-style: normal;
	font-weight: 600;
	line-height: 15px;
}
.fc-timegrid-divider .fc-cell-shaded{display:none!important;}
.fc .fc-timegrid-divider {display:none!important;}
.fc .fc-scrollgrid-section {height:0px!important;}

.fc-theme-standard td, .fc-theme-standard th {
	border: 0px !important;
	border-right: 1px solid var(--fc-border-color) !important;
}

.fc-col-header-cell {
	padding-top: 5px;
}
.fc-h-event {border:0;border-radius:16px;margin:5px;}

.fc-theme-standard tr > :last-child {
	border-right: 0px !important;
}
	
.fc .fc-button-primary {
	background-color: #F7F7F7!important;
	border-color: #BDBDBD!important;
	color: #333333!important;
	border-radius: 16px;
	padding: 5px 10px;
	font-size: 12px;
}

.fc-col-header-cell-cushion {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-decoration:none;
	color:#333333;
	font-family: 'Lato', sans-serif; 
}

.fc .fc-day-today .fc-col-header-cell-cushion{
	color: #11BB76!important; 
}
.fc .fc-timegrid-col.fc-day-today, .fc .fc-daygrid-day.fc-day-today  {
	background-color: transparent!important;
}

.fc-theme-standard .fc-scrollgrid {border: 0px !important; border-left: 0px!important;}

.custom-weeks-container {
display: flex;
justify-content: space-between;
max-width: 900px;
}

.week-column {
flex: 0 0 18%;
padding: 10px;
border-right: 1px solid #ddd;
margin: 0 1%;
display: flex;
flex-direction: column;
}

.week-title {
font-weight: bold;
margin-bottom: 10px;
}

.event {
padding: 5px;
margin-bottom: 5px;
}

.calendar-header {
display: flex;
/*justify-content: space-between;*/
align-items: center;
padding: 10px;
background-color: #fff;
}

.calendar-header .btn {
padding: 5px 10px;
border: 1px solid #ccc;
background-color: #fff;
cursor: pointer;
}
.clickable-event {
cursor: pointer;
}
input[type="radio"].si {
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
width: 0;
height: 0;
margin: 0;
padding: 0;
position: absolute;
}
input[type="radio"].si:focus + label {
outline: 1px dashed blue;
}
.tt-today{color: #11BB76!important;}
/* WYSIWYG editor */
trix-toolbar [data-trix-button-group="file-tools"] {
	display: none;
}    

trix-toolbar {
	background-color: #F7F7F7;
	border-radius: 10px 10px 0 0;
	padding: 10px;
}
trix-toolbar .trix-button:not(:first-child) {
	border-left: none!important;
}
trix-toolbar .trix-button {
border-bottom: none!important;
}
/* suggestion en autofil voor studenten en coaches */
.suggestion-box {
	border: 0px;
	position: absolute;
	background-color: white;
	max-width:350px;
	min-width: 200px;
}
.suggestion-box div {
	padding: 5px;
	cursor: pointer;
}
.suggestion-box div:hover {
	background-color: #F5C76C;
}

/* tooltip bootstrap for tt */
.tt-tooltip {
background-color: #A95EF8;
--bs-tooltip-bg: var(--bd-violet-bg);
--bs-tooltip-color: var(--bs-white);
}

/* Verberg alle toolbar-items die je niet wilt tonen */
.trix-button-group--file-tools,
.trix-button-group--block-tools,
.trix-button-group--history-tools{
	display: none!important;
}

/* Stijlen om de toolbar-buttons minder button-achtig te maken */
trix-toolbar .trix-button-group--text-tools {
	border: none;
	background: none;
	box-shadow: none; 
}
trix-toolbar .trix-button-group {
	display: flex;
	margin-bottom: 0!important;
	border: none!important;
	border-radius: 3px;
}
trix-toolbar .button_group .button:hover {
	background-color: #EAEAEA;
}
/* add_task form */
.modal-dialog {
	border-radius: 16px;
	display: flex;
	align-items: center;
	min-height: calc(100% - (.5rem * 2));
}
.modal-content {box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);}
.add_task_form .input-group, .add_task_form .form-control, .add_task_form .form-select{
   border-radius: 12px; 
}

/* reflection */
.sc {border-radius: 20px;width:200px;height:50px;padding:10px;}
.scorecard1 {border: 1px solid var(--Dodger-Blue-500, #2DA5F4);background: var(--Dodger-Blue-50, #EAF7FF);}
.scorecard2 {border: 1px solid var(--Apache-500, #EEA440);background: var(--Apache-50, #FFF8E6);}
.scorecard3 {border: 1px solid var(--Electric-Violet-500, #A95EF8);background: var(--Electric-Violet-50, #FAF5FF);}
.scorecard0 {border: 1px solid var(--Emerald-500, #11BB76);background: var(--Emerald-50, #ECFDF4);}
.d-none {display: none;}
.scv {color: #333333;}
input[type="radio"].sc1:checked + label {background-color: #2DA5F4;color:#FFF}
input[type="radio"].sc2:checked + label {background-color: #EEA440;color:#FFF}
input[type="radio"].sc3:checked + label {background-color: #A95EF8;color:#FFF}
input[type="radio"].sc0:checked + label {background-color: #11BB76;color:#FFF}
#confirmationModal {border-radius: 24px;background: var(--Black-White, #FEFEFE);box-shadow: 0px 6px 30px 0px rgba(0, 0, 0, 0.18);position: fixed;left: 50%;top: 50%;transform: translate(-50%, -50%);z-index: 1000;display: flex;width: 536px;padding: 30px 0px;align-items: center;z-index:999}
.custom-modal {border-radius: 24px;background: var(--Black-White, #FEFEFE);box-shadow: 0px 6px 30px 0px rgba(0, 0, 0, 0.18);position: fixed;left: 50%;top: 50%;transform: translate(-50%, -50%);z-index: 1000;display: flex;width: 536px;padding: 30px 0px;align-items: center;}

.lr {padding:5px 10px;border: 1px solid #ccc;background-color: #fff;cursor: pointer;margin:0;}

.rotate-90 {
    transform: rotate(45deg);
    transition: transform 0.3s ease;
}

.tt-txtarea {border-radius: 16px;border: 1px solid var(--Black-Gray-4, #BDBDBD);color: var(--Black-Gray-3, #828282);font-size: 14px;font-style: normal;font-weight: 300;line-height: normal;}
/* goal form */
.small {font-weight: 400;}
.gf1header {color:#1B9FF6;font-size: 22px;font-style: normal;font-weight: 600;line-height: normal;margin-bottom:10px}
.gf2header {color:#E69C39;font-size: 22px;font-style: normal;font-weight: 600;line-height: normal;margin-bottom:10px}
.gf3header {color:#8930DE;font-size: 22px;font-style: normal;font-weight: 600;line-height: normal;margin-bottom:10px}
.gf1required {color: var(--Burnt-Sienna-red, #EF542D);font-style: normal;font-weight: 600;line-height: normal;}
.gf1p {color: var(--Black-Gray-1, #333);font-size: 14px;font-style: normal;font-weight: 500;line-height: normal;}
.gf2p {color: var(--Apache-500, #E69C39);font-size: 14px;font-style: normal;font-weight: 500;line-height: normal;}
.gf3p {color:#8930DE;font-size: 14px;font-style: normal;font-weight: 500;line-height: normal;}
.btn-gf {border-radius: 16px;background: var(--Emerald-400, #23EB98);color:#022C1F;border:1px solid #11BB76;}
.btn-gf:hover {background: var(--Emerald-500, #11BB76);color:#022C1F;)}
.btn-gfbck{border-color:#4F4F4F;font-size:14px}
.btn2-gfbck{border-color:#4F4F4F;font-size:14px}
.btn3-gfbck{border-color:#8930DE;;font-size:14px}
.btn-check:hover{border-color:#4F4F4F}
.btn-bck {border-radius: 16px;background: var(--Black-Gray-5, #E0E0E0);}
.btn-check {background-color: var(--Black-Gray-5, #E0E0E0);border-color:#4F4F4F;font-size:14px;}
.btn-check.se:checked + label {
	border-radius: 9px;
	background: var(--Apache-100, #FDF2D1);
	border: none;
}

.btn2-check {background-color: var(--Apache-500, #E69C39);border-color: #4F4F4F;font-size: 14px;}
.btn3-check {background-color: #A454F8;border-color: #FAF5FF;font-size: 14px;}
.g1 input:checked + label {background-color: #1B9FF6!important;color:#FFFFFF!important;border-color:#4F4F4F}
.g2 input:checked + label {background-color: #E69C39!important;color:#FFFFFF!important;}
.g3 input:checked + label {background-color: #A454F8!important;color:#FFFFFF!important;}
input[type="checkbox"].sels {opacity: 0;position: absolute;width: 0;height: 0;margin: 0;cursor: pointer;}
input[type="checkbox"].sels + label {
border-radius: 50px;
border: 1px solid var(--Black-Gray-1, #333);
background: var(--Black-White, #FEFEFE);
padding: 5px 10px;
cursor: pointer;
display: inline-block;
position: relative;
margin:10px 10px 0 0;
}

input[type="checkbox"].sels:checked + label {
border-radius: 50px;
border: 1px solid var(--Emerald-500, #11BB76);
background: var(--Emerald-100, #D1FAE2);
}
.btn-man-events{border: 1px solid #ccc;width:32px;height:32px;padding:4px;}
.btn-gfns{border-radius: 16px; border-color: var(--Black-Gray-5, #E0E0E0);border:1px}
.step{display:none;}
.selectWrapper {margin-bottom: 10px;}
.selectWrapper .textLabel {margin-right: 10px;}
.selectWrapper .dynamicInput {margin-right: 5px;flex-grow: 1;}
.selectWrapper .btn {margin-left: 5px;}

/* talent tree side bar */
.sidebar {
position: fixed;
top: 0;
left: 0;
height: 100vh;
width: 248px;
padding: 10px 5px;
background: var(--sidebar-color);
transition: var(--tran-05);
z-index: 100;
border-radius: 0px 12px 12px 0px;
}
.sb {border-radius: 8px;background: var(--Emerald-700, #05774E);padding:10px 0}
.dropdown-item:hover {color: white!important;)
}
#reflectDropdown::after {
    display: none;
}

.sidebar.close {
width: 92px;
}
.txt-mw{max-width:464px;}
.btn-mw{max-width:68px;}
.sidebar.close .txt {
opacity: 0;
}
.sidebar .toggle {
position: absolute;
top: 40px;
right: -14px;
transform: translateY(-50%) rotate(180deg);
height: 28px;
width: 28px;
padding: 6px;
background-color: var(--primary-color);
color: #11BB76;
display: flex;
align-items: center;
justify-content: center;
font-size: 12px;
cursor: pointer;
transition: var(--tran-05);
border-radius: 8px;
border: 1px solid var(--emerald-500, #11BB76);
background: var(--emerald-800, #144431);
}
/* Media query voor kleinere schermen */
@media screen and (max-width: 768px) {
.sidebar .toggle {
right: -14px; /* Aangepaste positie voor betere zichtbaarheid */
height: 30px; /* Nog groter voor gemakkelijke interactie */
width: 30px;
top: 40px;
position: absolute;
}
}
.profile {
border-radius: 15px;
background: var(--emerald-500, #11BB76);
width:42px;
height:42px;
padding: 10px 7px 9px 7px;
justify-content: center;
align-items: center;
flex-shrink: 0;
color: #FFFFFF;
font-size: 14px;
}
.menu_txt {
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: normal;
color:#FEFEFE;
margin: 5px;
padding: 10px 5px;}
.sidebar.close .mx-3 {margin:0!important}
.top_tt{max-width:45px;}
.f_name{color:#23EB98;}
.inline{display:inline;}
.sidebar.close .gones{
display:none;
}
@media screen and (max-width: 768px) {
.gone {display:none;}
}
/*last col in menu, position at end */
.c-bttm{position:absolute;bottom:5%;height:80px}
@media screen and (max-width: 768px) {
.c-bttm{height:140px}
}
.tt_divider {
border: none;
color: #23EB98;
background-color: #23EB98;
height: 2px;
border-radius: 2px;
width: 80%;
padding: 0 20px;
margin:20px 0 20px 20px;
}
.sidebar.close .tt_divider {
width: 50px;
margin:20px 0 20px 15px;
}
.icon {
height:24px;
width:24px;
color: #23EB98;	
}
.icon_s {
height:18px;
width:18px;
color: #212529;
padding-bottom:2px;
}
.sidebar.close .toggle {
transform: translateY(-50%) rotate(0deg);
}
.sidebar.close ~ .main {
left: 78px;
height: 100vh;
width: calc(100% - 78px);
}
.main {
position: absolute;
top: 0;
top: 0;
left: 248px;
height: 100vh;
width: calc(100% - 250px);
transition: var(--tran-05);
padding: 12px 42px;
}
.init{background: var(--Black-bg, #F7F7F7);}
.tt_header {color: var(--Emerald-500, #11BB76);font-size: 42px;font-style: normal;font-weight: 600;line-height: normal;}
.tt_action_btn{background-color:#23EB98;color: #333333;}
.tt_form {color:#3A5F4A}
.form-s {max-width: 450px;padding: 1rem;}
.mt-q {margin-top:25%;}
.mt-h {margin-top:50%;}
.he100 {min-height:900px;}
svg {width: 100%;height: auto;display: block;}
.bg-body-dark-olive {background-color: #074A2F!important;}
.nav-pills .nav-link.active {background-color: #063B26;}
.nav-pills .nav-link {color:#FFF;}

/*Goals*/
/*General settings */

/*Goal type 1*/
.g1{background-color:#E8F6FF;color:#1B9FF6;}
.g2{background-color:#FFF8E6;color:#E69C39;}
.g3{background-color:#FAF5FF;color:#8930DE;}
/*Goal type 2*/

/*Goal type 3*/