/* Tambahan Tahap 2: kalender, form & tabel peminjaman. Warna mengikuti web OSIS. */

/* FullCalendar disesuaikan dengan aksen web OSIS */
#calendar {
    --fc-button-bg-color: #0000FF;
    --fc-button-border-color: #0000FF;
    --fc-button-hover-bg-color: #0000cc;
    --fc-button-hover-border-color: #0000cc;
    --fc-button-active-bg-color: #00008f;
    --fc-button-active-border-color: #00008f;
    --fc-today-bg-color: rgba(252, 192, 0, .12);
    --fc-event-border-color: #0000FF;
    font-size: 13px;
}
#calendar .fc-toolbar-title { font: 700 18px "Montserrat", sans-serif; }
#calendar .fc-event { cursor: pointer; border-left-width: 4px; }
#calendar .fc-daygrid-day-number, #calendar .fc-col-header-cell-cushion { color: #333; text-decoration: none; }
.fc-ev { display: flex; align-items: center; gap: 4px; overflow: hidden; white-space: nowrap; padding: 0 2px; }
.fc-ev-dot { flex: 0 0 8px; width: 8px; height: 8px; border-radius: 50%; background: #fff; border: 1px solid rgba(0,0,0,.25); }
.fc-ev-text { overflow: hidden; text-overflow: ellipsis; }

/* Filter fasilitas & legenda */
.cal-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.cal-chip {
    border: 1px solid #ccc; background: #fff; border-radius: 50px;
    padding: 3px 12px; font: 600 12px "Montserrat", sans-serif; color: #444;
}
.cal-chip:hover { border-color: #0000FF; color: #0000FF; }
.cal-chip.active { background: #0000FF; border-color: #0000FF; color: #fff; }
.cal-legend { display: flex; flex-wrap: wrap; gap: 16px; font-size: 12px; color: #555; }

/* Panel slot kosong */
.avail-title { font: 700 12px "Montserrat", sans-serif; text-transform: uppercase; letter-spacing: .5px; color: #333; margin-bottom: 4px; }
.avail-row {
    display: flex; justify-content: space-between; align-items: center; gap: 8px;
    padding: 5px 8px; margin-bottom: 4px; border-radius: 4px; font-size: 13px;
}
.avail-row.free { background: #eafaf1; border-left: 3px solid #18d26e; }
.avail-row.busy { background: #fff8e1; border-left: 3px solid #fcc000; }

/* Form booking */
.cek-hasil { display: none; }
.cek-hasil.show { display: block; }
.form-hint { font-size: 12px; color: #777; }
.info-strip { background: #f0f0ff; border-left: 4px solid #fcc000; border-radius: 4px; padding: 10px 14px; font-size: 13px; }

/* Tabel */
.table-booking th { font: 700 12px "Montserrat", sans-serif; text-transform: uppercase; letter-spacing: .4px; white-space: nowrap; }
.table-booking td { vertical-align: middle; font-size: 13px; }
.fac-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 6px; }
.detail-row { display: flex; padding: 8px 0; border-bottom: 1px solid #eee; font-size: 14px; }
.detail-row .k { flex: 0 0 180px; color: #777; }
@media (max-width: 576px) { .detail-row { flex-direction: column; } .detail-row .k { flex-basis: auto; } }
