/* Kurzbeschreibung: Schlankes responsives Layout inkl. Druckansicht. */
/* Änderungslog: */
/* 2026-02-15 - ChatGPT - Mobile-First Styles, Tabellenlayout, Formulare und Druckoptimierung ergänzt. */
/* 2026-02-15 - ChatGPT - Tabellenzelle für Mini-Wachstumsdiagramme der Spielerliste ergänzt. */
/* 2026-02-15 - ChatGPT - Inhaltsbereich auf volle Bildschirmbreite erweitert und Canvas-Elemente für Diagramme auf volle verfügbare Breite gesetzt. */

*{
	box-sizing:border-box;
}

body{
	font-family:Arial,sans-serif;
	background:#f3f5f9;
	margin:0;
	color:#1a1a1a;
}

.kopf{
	background:#152238;
	color:#ffffff;
	padding:12px;
}

.hauptnavigation a{
	display:inline-block;
	margin-right:10px;
	color:#ffffff;
	text-decoration:none;
}

.inhalt{
	width:100%;
	max-width:none;
	margin:0;
	padding:10px;
}

canvas{
	display:block;
	width:100% !important;
}

.karte{
	background:#ffffff;
	border:1px solid #dce1ea;
	border-radius:8px;
	padding:12px;
	margin-bottom:12px;
}

.formular_zeile,
.filterformular{
	display:flex;
	flex-direction:column;
	gap:6px;
	margin-bottom:10px;
}

input,
select,
textarea,
button{
	padding:8px;
	border:1px solid #c2cada;
	border-radius:4px;
}

table{
	width:100%;
	border-collapse:collapse;
}

th,
td{
	border:1px solid #dce1ea;
	padding:8px;
	text-align:left;
}

.meldung_ok{
	color:#1b7f2a;
}

.meldung_fehler{
	color:#b72222;
}

.zelle_verlauf{
	min-width:170px;
}

@media(min-width:900px){
	.formular_zeile,
	.filterformular{
		max-width:420px;
	}
}

@media print{
	.nicht-drucken,
	button,
	form{
		display:none !important;
	}

	.karte{
		border:none;
		padding:0;
		margin:0 0 10px 0;
		page-break-inside:avoid;
	}
}