/* =============================================================
   MCT – css/mod_dashboard.css
   Grundlayout für das Dashboard und seine Kacheln
   ============================================================= */

#dashboard {
	display:               grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap:                   1rem;
}

.dashboard-kachel {
	position:      relative;
	padding:       1rem 1.2rem;
	border:        1px solid var(--border);
	border-radius: var(--radius);
	background:    var(--bg-panel);
	box-shadow:    var(--shadow-sm);
}

.dashboard-kachel-schliessen {
	position:    absolute;
	top:         .4rem;
	right:       .6rem;
	cursor:      pointer;
	font-size:   .9rem;
	line-height: 1;
	opacity:     .65;
}

.dashboard-kachel-schliessen:hover {
	opacity: 1;
}

@media (max-width: 640px) {
	#dashboard {
		grid-template-columns: 1fr;
	}

	.dashboard-kachel {
		min-width: 0;
		width:     100%;
		max-width: 100%;
		padding:   .6rem .7rem;
		font-size: .85rem;
	}

	.dashboard-kachel h2 {
		font-size:     1.1rem;
		margin-bottom: .3rem;
	}

	.dashboard-kachel h3 {
		font-size:     1rem;
		margin-bottom: .3rem;
	}

	/* Tabellen innerhalb einer Dashboard-Kachel: müssen in die Kachel
	   passen statt zu scrollen – daher kein .table-wrap, sondern
	   schrumpfende Spalten mit Umbruch.
	   Die globale Regel „table.data-tabelle { min-width: 600px }"
	   (siehe style.css, für .table-wrap-Tabellen mit Scrollen gedacht)
	   wird hier für Dashboard-Kacheln gezielt außer Kraft gesetzt. */
	.dashboard-kachel table.data-tabelle {
		width:     100%;
		max-width: 100%;
		min-width: 0;
		font-size: .8rem;
		table-layout: fixed;
	}

	.dashboard-kachel table.data-tabelle th,
	.dashboard-kachel table.data-tabelle td {
		padding:       .3rem .35rem;
		white-space:   normal;
		overflow-wrap: anywhere;
	}
}

/* -------------------------------------------------------------
   Modul "Aktuell zu erledigen" (SuS): kompakte Eintragsliste,
   gleichermaßen für Desktop und Smartphone geeignet
   ------------------------------------------------------------ */
.dashboard-erledigen-liste {
	list-style: none;
	margin:     0 0 .5rem;
	padding:    0;
	display:    flex;
	flex-direction: column;
	gap:        .4rem;
}

.dashboard-erledigen-eintrag {
	display:        flex;
	align-items:    center;
	justify-content: space-between;
	gap:            .5rem;
	padding:        .4rem .5rem;
	border:         1px solid var(--border);
	border-radius:  var(--radius);
	background:     var(--bg-page);
}

.dashboard-erledigen-info {
	display:        flex;
	flex-direction: column;
	min-width:      0;
}

.dashboard-erledigen-titel {
	font-weight: bold;
}

.dashboard-erledigen-detail {
	font-size: .8rem;
	color:     var(--text-muted);
}

.dashboard-erledigen-leer,
.dashboard-erledigen-weitere {
	font-size: .85rem;
	color:     var(--text-muted);
	margin:    0 0 .6rem;
}
