Rollen Chunk 6: Team-Tab mit Matrix-Kalender und Genehmigungen

src/app/globals.css

@@ -1412,3 +1412,114 @@ section[aria-label="Feiertage"] h3 {
 .backup-delete {
   margin: 0.25rem 0 0;
 }
+
+/* Team-Matrix */
+.team-nav {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0.75rem;
+  margin: 0.75rem 0;
+}
+
+.team-matrix-wrap {
+  overflow-x: auto;
+  border: 1px solid var(--line);
+  border-radius: var(--radius);
+}
+
+.team-matrix {
+  border-collapse: collapse;
+  width: 100%;
+  min-width: 52rem;
+  font-size: 0.8rem;
+}
+
+.team-matrix th,
+.team-matrix td {
+  border: 1px solid var(--line);
+  padding: 0.25rem 0.3rem;
+  text-align: center;
+}
+
+.team-matrix thead th {
+  position: sticky;
+  top: 0;
+  background: var(--paper);
+  font-weight: 650;
+}
+
+.team-matrix tbody th[scope="row"] {
+  text-align: left;
+  font-weight: 650;
+  white-space: nowrap;
+}
+
+.team-rest {
+  display: block;
+  font-weight: 400;
+  color: var(--muted);
+  font-size: 0.72rem;
+}
+
+.tcell {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 2rem;
+  height: 1.6rem;
+  border-radius: 4px;
+  font-size: 0.72rem;
+  font-weight: 650;
+}
+
+.tcell-bestaetigt {
+  background: var(--sea-tint);
+  color: var(--sea);
+}
+
+.tcell-beantragt {
+  background: var(--gold-tint);
+  color: var(--harbor);
+  border: 1px dashed var(--sea);
+}
+
+.tcell-krank {
+  background: var(--sick-tint);
+  color: var(--sick);
+}
+
+.tcell-feiertag {
+  background: var(--signal-tint);
+  color: var(--signal);
+}
+
+.tcell-wochenende {
+  background: var(--fog);
+  color: var(--muted);
+}
+
+.tcell-summary {
+  font-variant-numeric: tabular-nums;
+  color: var(--harbor);
+  font-weight: 650;
+}
+
+:root[data-theme="dark"] .team-matrix thead th {
+  background: var(--paper);
+}
+
+.offene-liste li {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.75rem;
+  padding: 0.4rem 0;
+  border-top: 1px solid var(--line);
+}
+
+.offene-liste {
+  list-style: none;
+  margin: 0 0 0.75rem;
+  padding: 0;
+}