/* 可預約月曆 —— 場域詳情頁與預約頁共用(原內聯於 courses/detail.html)。 */
.availability-calendar {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 8px;
}
.availability-calendar-weekday {
    padding: 2px 0 4px;
    text-align: center;
    color: #607565;
    font-size: 0.78rem;
    font-weight: 700;
}
.availability-calendar-day {
    min-height: 68px;
    border: 1px solid #e1e8dc;
    background: #f8faf5;
    padding: 7px 5px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
}
.availability-calendar-day.is-empty {
    border-color: transparent;
    background: transparent;
}
/* 三態要一眼分得出來:可預約=實心綠、不可預約=實心灰、已過期=淡斜紋(消失感) */
.availability-calendar-day.is-available {
    border-color: #5fb886;
    background: #dff3e6;
}
.availability-calendar-day.is-available .availability-calendar-day-number {
    color: #12643a;
}
.availability-calendar-day.is-available .availability-calendar-status {
    color: #1b7a45;
}
.availability-calendar-day.is-unavailable {
    border-color: #cfd6dd;
    background: #e9edf1;
    color: #6b7580;
}
.availability-calendar-day.is-past {
    border-color: #e0e2e5;
    background: repeating-linear-gradient(-45deg, #f4f5f6, #f4f5f6 5px, #e8eaec 5px, #e8eaec 10px);
    color: #a6adb4;
    opacity: 0.8;
}
.availability-calendar-day-number {
    color: #173226;
    font-weight: 800;
    line-height: 1;
}
.availability-calendar-day.is-past .availability-calendar-day-number {
    color: #aab0b6;
}
.availability-calendar-day.is-unavailable .availability-calendar-day-number {
    color: #8a939c;
}
.availability-calendar-status {
    font-size: 0.68rem;
    font-weight: 700;
    line-height: 1.3;
    word-break: keep-all;
}
.availability-calendar-link {
    text-decoration: none;
}
/* 暫停營業:整天暫停用紅斜紋;部分暫停用左上角橘點 */
.availability-calendar-day.is-blackout {
    background: repeating-linear-gradient(-45deg, #fef2f2, #fef2f2 6px, #fee2e2 6px, #fee2e2 12px);
    border-color: #f2b3b3;
    color: #b91c1c;
}
.availability-calendar-day.is-blackout .availability-calendar-day-number {
    color: #b91c1c;
}
.availability-calendar-day.is-blackout .availability-calendar-status {
    color: #b91c1c;
    font-weight: 800;
}
.availability-calendar-day.is-blackout-partial {
    position: relative;
}
.availability-calendar-day.is-blackout-partial::after {
    content: '';
    position: absolute;
    top: 5px; left: 5px;
    width: 7px; height: 7px;
    border-radius: 50%;
    background: #f59e0b;
}
@media (max-width: 420px) {
    .availability-calendar {
        gap: 5px;
    }
    .availability-calendar-day {
        padding: 5px 3px;
    }
    .availability-calendar-status {
        font-size: 0.62rem;
    }
}