.calendar {
    color: var(--calendar-color-text);
}

.calendar .calendar-header .cal-nav,
.calendar .cal-cell {
    border: 1px solid var(--calendar-color-border);
    border-radius: var(--size-radius, 5px);
    background: var(--calendar-color-bg);
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.calendar .calendar-header .cal-nav {
    border-color: transparent;
}

.calendar .calendar-header .cal-nav:hover,
.calendar .cal-cell:hover {
    border-color: var(--calendar-color-accent);
    background: var(--calendar-color-hover);
}

.calendar .cal-cell:focus-visible,
.calendar .calendar-header button:focus-visible {
    outline: 2px solid var(--calendar-color-focus);
    outline-offset: 1px;
}

.calendar .other-month {
    background: var(--calendar-color-other-bg);
    color: var(--calendar-color-muted);
}

.calendar .today {
    border: 2px solid var(--calendar-color-today);
    font-weight: 700;
}

.calendar .today-dot {
    background: var(--calendar-color-today);
}

.calendar .event-dot.holiday {
    background: var(--calendar-color-holiday);
}

.calendar .event-dot.task {
    background: var(--calendar-color-task);
}

.calendar .event-dot.meeting {
    background: var(--calendar-color-meeting);
}

.calendar .event-dot.default {
    background: var(--calendar-color-event);
}