/*
	Gestaltung des Seitennavigation
	- Definititon der allg. gueltigen Variablen und Einstellungen fuer Massangeben und Farben
- */


.tp-main {
	padding: 1.5rem 2rem;
	/* color: var(--bs-gray-700); */
}

.tp-main h1 {
	font-size: 2rem;
}

.tp-main h2 {
	font-size: 1.75rem;
}

.tp-main h3 {
	font-size: 1.5rem;
}

.tp-main h4 {
	font-size: 1.25rem;
}

.tp-main p {
	font-size: 1rem;
}

.tp-main blockquote {
	background-color: var(--color-white);
	border-left: 10px solid var(--color-red-1);
	margin: 1.5rem 0px;
	padding: 20px;
	quotes: "\275D""\275D";
}

.tp-main blockquote:before {
	color: #ccc;
	content: open-quote;
	font-size: 2.8rem;
	line-height: 0.1rem;
	margin-right: 0.5rem;
	vertical-align: -0.6rem;
  }

.tp-main blockquote p {
	display: inline;
}

.table-scroll {
  overflow-x: auto;
  max-width: 100%;
}

.table-scroll table {
  width: max-content;
  min-width: 100%;
}


.tp-main table:not(.download-table) {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	background: #fff;
	border-radius: 0.1rem;
	overflow: hidden;
	box-shadow: 0 8px 20px rgba(16, 24, 40, 0.08), 0 2px 6px rgba(16, 24, 40, 0.04);
	font-size: 0.95rem;
	transition: transform 0.15s ease;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.tp-main table:not(.download-table) th {
	padding: 0.85em 1.25em;
	background-color: var(--color-red-1);
	color: #fff;
	text-transform: uppercase;
	font-size: 0.85em;
	letter-spacing: 0.06em;
	font-weight: 600;
	text-align: left;
	border-bottom: 1px solid rgba(0,0,0,0.06);
	/*white-space: nowrap;*/
}

.tp-main table:not(.download-table) td {
	padding: 0.85em 1.25em;
	background-color: #fff;
	border-bottom: 1px solid rgba(16,24,40,0.06);
	vertical-align: middle;
	/*white-space: nowrap;*/
	transition: background-color 0.2s ease, transform 0.12s ease;
}

/* zebra rows with subtle contrast */
.tp-main table:not(.download-table) tbody tr:nth-child(even) td {
	background-color: #fbfbfb;
}

/* row hover */
.tp-main table:not(.download-table) tbody tr:hover td {
	background-color: rgba(240, 244, 248, 0.9);
	transform: translateZ(0);
}

/* rounded corners for top header and bottom row */
.tp-main table:not(.download-table) th:first-child {
	border-top-left-radius: 0.1rem;
}

.tp-main table:not(.download-table) th:last-child {
	border-top-right-radius: 0.1rem;
}

.tp-main table:not(.download-table) tbody tr:last-child td:first-child {
	border-bottom-left-radius: 0.1rem;
}

.tp-main table:not(.download-table) tbody tr:last-child td:last-child {
	border-bottom-right-radius: 0.1rem;
}

.tp-main table:not(.download-table) th,
.tp-main table:not(.download-table) td {
	box-sizing: border-box;
}

/* Styles für Fahrzeugcheck Navigation*/
.tp-main .btn-primary,.bg-primary {
	color: var(--color-white);
	background-color: var(--color-red-1);
	border-color: var(--color-red-1);
}

.tp-main .btn-primary:hover {
	color: var(--color-white);
	background-color: var(--color-red-2);
}

.tp-main .btn-outline-primary {
	color: var(--color-red-1);
	background-color: transparent;
	border-color: var(--color-red-1);
}

.tp-main .btn-outline-primary:hover {
	color: var(--color-white);
	background-color: var(--color-red-1);
	border-color: var(--color-red-1);
}

.logout-btn {
	color: var(--color-white);
	background-color: var(--color-red-1);
}

.logout-btn:hover {
	color: var(--color-white);
	background-color: var(--color-red-2);
}

.changepass-btn {
	color: var(--color-red-1);
	border: 1px solid var(--color-red-1);
}
.changepass-btn:hover {
	color: var(--color-red-2);
	border: 1px solid var(--color-red-2);
}

.spinner {
	display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 10px;
    align-content: center;
    align-items: center;
    font-size: 1.5rem;
	img {
		width: 26px;
	}
}

/*
.tp-main pre {
	padding: 1rem;
	background-color: white;
	border: 1px solid var(--bs-border-color);
}
*/


/*.styled-scrollbars {
   Foreground, Background 
  scrollbar-color: #999 #444343; 
}*/