.kalender-switch { text-align: center; margin-bottom: 1rem; }
.kalender-legende { display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem; margin-bottom: 2rem; }
.farbfeld { display: inline-block; width: 1em; height: 1em; margin-right: 0.3em; border: 1px solid #0003; }
.farbfeld.rot { background: rgba(255, 100, 100, 0.6); }
.farbfeld.halb-links { background: linear-gradient(to bottom right, rgba(255, 100, 100, 0.6) 0% 50%, transparent 50%); }
.farbfeld.halb-rechts { background: linear-gradient(to top left, transparent 0% 50%, rgba(255, 100, 100, 0.6) 50%); }
.farbfeld.diagonal { background: linear-gradient(135deg, rgba(255, 100, 100, 0.6) 49.5%, transparent 49.5% 50.5%, rgba(255, 100, 100, 0.6) 50.5%); }
#kalender-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; }
.kalender-monat { border: 1px solid #ccc; border-radius: 6px; padding: 0.5rem; background: #fdfdfd; }
.kalender-monat h4 { font-size: 1rem; text-align: center; margin-bottom: 0.3rem; }
.kalender-header { display: grid; grid-template-columns: repeat(7, 1fr); text-align: center; font-weight: bold; font-size: 0.75rem; margin-bottom: 2px; }
.kalender-wtag { padding: 2px 0; }
.kalender-raster { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.kalender-tag { aspect-ratio: 1 / 1; background: #f0f0f0; text-align: center; font-size: 0.8rem; border-radius: 4px; position: relative; display: flex; align-items: center; justify-content: center; }
.kalender-tag.leer { background: transparent; visibility: hidden; }
.kalender-tag.rot { background: rgba(255, 100, 100, 0.6); }
.kalender-tag.diagonal { background: linear-gradient(135deg, rgba(255, 100, 100, 0.6) 49.5%, transparent 49.5% 50.5%, rgba(255, 100, 100, 0.6) 50.5%); }
.kalender-tag.halb-links { background: linear-gradient(to bottom right, rgba(255, 100, 100, 0.6) 0% 50%, transparent 50%); }
.kalender-tag.halb-rechts { background: linear-gradient(to top left, transparent 0% 50%, rgba(255, 100, 100, 0.6) 50%); }
@media (max-width: 600px) {
  #kalender-container { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
  .kalender-monat h4 { font-size: 0.9rem; }
  .kalender-tag { font-size: 0.7rem; }
}