@import 'bootstrap/css/bootstrap.min.css';
@import "font.css";
@import "buttons.css";
@import "bootstrap-icons/bootstrap-icons.css";



/* base */

*, *::before, *::after {
    font-family: Gotham Rounded, sans-serif;
}

html {
    font-size: 12px;
}

html,
body,
#app {
	height: 100%;
}

#ui-root {
	flex: 1 0 auto;
}

.multiline-text {
	white-space: pre-wrap;
}

.kairos-footer {
	background-color: rgb(233, 236, 239);
}



/* nav */

nav {
	font-size: 1.25rem;
}



/* breadcrumb */

.breadcrumb {
	font-size: 1.25rem;
}


/* components */

/* login */
.form-signin {
	max-width: 330px;
	padding: 15px;
	margin: 0 auto;
}
.form-signin .form-signin-heading,
.form-signin .checkbox {
	margin-bottom: 10px;
}
.form-signin .checkbox {
	font-weight: 400;
}
.form-signin .form-control {
	position: relative;
	box-sizing: border-box;
	height: auto;
	padding: 10px;
	font-size: 16px;
}
.form-signin .form-control:focus {
	z-index: 2;
}
.form-signin input[type="email"] {
	margin-bottom: -1px;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
}
.form-signin input[type="password"] {
	margin-bottom: 10px;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}
.form-signin .btn {
	width: 100%;
	font-size: 16px;
}

/* imprint and privacy */
.datenschutz,
.impressum {
	max-width: 600px;
}

/* password changer */
.change-password {
	width: 400px;
}

/* as admin */
.trainer-list,
.client-list {
	max-height: 28vh;
	overflow-x: hidden;
}

/* as trainer */
.trainer-root .client-list {
	max-height: 70vh;
}


/* team-member csv editor */
.csv-editor {
	height: 25vh;
}


/* client team member list */

th.surname {
	width: 23%;
}

th.name {
	width: 17%;
}

th.gender {
	width: 10%;
}

th.birthday {
	width: 10%;
}

td #birthday.form-control {
	width: 85%;
}

th.function {
	width: 23%;
}

th.focusPerson {
	width: 6%;
}

th.buttons {
	width: 11%;
}

.tab-content {
	border: 1px;
}


/* analysis view overlay */

.analysis-image {
	width: 60%;
	align-self: center;
}

@media screen {
	.analysis-view {
		width: 67%;
		max-width: none !important;
	}

	.analysis-image {
		object-fit: contain;
		max-height: 80vh;
	}

	#kairos-clock {

	}

	#generation-field {

	}

	#life-phases {
		width: 55%;
	}
}

@media print {
	#kairos-clock {

	}

	#generation-field {

	}

	#life-phases {
		width: 55%;
	}

	.break-after {
		break-after: page;
	}
}