.calendar {
    width: 100%;
}

.calendar-header,
.calendar-grid {
    display: grid;
    grid-template-columns: 60px repeat(7, 1fr);
}

    .calendar-header div {
        font-weight: bold;
        text-align: center;
        padding: 5px;
    }

.week-header
{
    text-align: center;
    font-weight: bold;
    background: #f0f0f0;
    /*border: 1px solid #ccc;*/
    padding: 5px;
}
.week-number {
    text-align: center;
    font-weight: bold;
    background: #f0f0f0;
    border: 1px solid #ccc;
    padding: 5px;
}

.week-number {
    font-size: 12px;
}

.day {
    border: 1px solid #ccc;
    min-height: 120px;
    padding: 4px;
    box-sizing: border-box;
}

    .day.empty {
        background: #fafafa;
    }

    .day.today {
        background: #bcd7fd;
        border: 2px solid #0a58ca;
    }

.day-number {
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 4px;
}

.sessions {
    display: grid;
    grid-template-columns: 1fr; /* ide jöhet később több oszlop */
    gap: 3px;
    cursor: pointer;
}

.session {
    background: #e3f2fd;
    border-left: 3px solid #1976d2;
    padding: 3px;
    font-size: 12px;
}

    .session:hover {
        border-left: 3px solid blue;
        border-right: 3px solid blue;
        color: blue;
    }