/*
====================================================
SECTION: FLATPCIKR CALENDAR STYLES
====================================================
*/

/* Tema dasar untuk kalender agar terlihat modern */
.flatpickr-calendar {
    background: #ffffff;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}
.flatpickr-months .flatpickr-month,
.flatpickr-current-month .flatpickr-monthDropdown-months {
    color: #333333;
    fill: #333333;
}
.flatpickr-day { color: #393939; }
.flatpickr-day:hover { background: #f0f0f0; }
.flatpickr-day.today { border-color: #007bff; }
.flatpickr-day.selected, .flatpickr-day.startRange, .flatpickr-day.endRange { background: #007bff; border-color: #007bff; color: white; }
.flatpickr-weekday { color: #6c757d; }
.flatpickr-months .flatpickr-prev-month, .flatpickr-months .flatpickr-next-month { fill: #333333; }

/* CSS khusus untuk penanda event di kalender */
/* PERBAIKAN: Kembalikan style dasar sebagai fallback. */
/* JavaScript akan menimpa warna ini jika ada data di database. */
.flatpickr-day.event-day {
    background: #fff0f1; /* Latar belakang pink muda */
    border-color: #ffb8bf; /* Border pink yang lebih gelap */
    font-weight: bold;
    color: #c7254e; /* Warna teks merah tua */
}

/* PERBAIKAN: Kembalikan efek hover untuk interaksi pengguna yang lebih baik. */
.flatpickr-day.event-day:hover {
    background: #ffe0e3;
    border-color: #ff9aa2;
}

/* PERBAIKAN: Pastikan warna event tetap ada meskipun tanggalnya dipilih. */
/* Aturan ini lebih spesifik dan akan menimpa gaya .selected bawaan. */
.flatpickr-day.event-day.selected {
    background: #c7254e; /* Latar belakang merah tua saat dipilih */
    border-color: #c7254e;
    color: #ffffff; /* Warna teks putih agar mudah dibaca */
}