.kalendar-page{min-width:0}

.kalendar-hero-inner{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);text-align:center}
.kalendar-hero-text{max-width:600px;margin-inline:auto}
.kalendar-hero-controls{display:flex;gap:var(--space-2);flex-wrap:wrap;justify-content:center}

.kalendar-views-text{max-width:700px}
.kalendar-view-switcher{display:flex;gap:var(--space-2);flex-wrap:wrap;margin-top:var(--space-3)}
.view-btn{padding:0.6rem 1rem;border-radius:var(--radius-sm);background:var(--color-bg-alt)}
.view-btn.active{background:var(--color-accent-gold)}

.kalendar-filter-card{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-3);padding:var(--space-4);background:var(--color-bg-paper);border-radius:var(--radius-md);box-shadow:var(--shadow-soft)}
.filter-col{min-width:0;display:flex;flex-direction:column;gap:var(--space-2)}
.filter-options{display:flex;flex-direction:column;gap:var(--space-1)}

.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:var(--space-2);margin-top:var(--space-4)}
.calendar-grid div{background:var(--color-bg-alt);padding:var(--space-2);border-radius:var(--radius-sm);min-height:100px}

.kalendar-table table thead{position:sticky;top:0}

.type-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3)}

.kalendar-tips-inner{max-width:650px}

.kalendar-disclaimer-box{background:var(--color-bg-alt);padding:var(--space-4);border-radius:var(--radius-md)}

@media(max-width:1024px){
.kalendar-filter-card{grid-template-columns:repeat(2,minmax(0,1fr))}
.type-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:768px){
 .kalendar-hero-inner{align-items:stretch;gap:var(--space-3);text-align:left}
 .kalendar-hero-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 .kalendar-hero-controls .btn{width:100%}
 .kalendar-view-switcher{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 .view-btn{width:100%}
 .kalendar-filter-card{grid-template-columns:1fr;padding:1.25rem}
 .calendar-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-2);margin-top:var(--space-3)}
 .calendar-grid div{min-height:72px;padding:var(--space-2)}
 .type-grid{grid-template-columns:1fr}
 .kalendar-disclaimer-box{padding:1.25rem}
}
