/* Dark theme for FullCalendar, scoped to .fc-dark to match the app's aesthetic. */ .fc-dark { --fc-border-color: rgba(255, 255, 255, 0.06); --fc-page-bg-color: transparent; --fc-neutral-bg-color: rgba(255, 255, 255, 0.02); --fc-neutral-text-color: rgba(255, 255, 255, 0.5); --fc-today-bg-color: rgba(99, 102, 241, 0.1); --fc-now-indicator-color: #6366f1; --fc-list-event-hover-bg-color: rgba(255, 255, 255, 0.04); --fc-highlight-color: rgba(99, 102, 241, 0.15); } .fc-dark .fc { color: rgba(255, 255, 255, 0.85); font-family: inherit; } /* Toolbar */ .fc-dark .fc .fc-toolbar.fc-header-toolbar { margin-bottom: 1rem; flex-wrap: wrap; gap: 0.5rem; } .fc-dark .fc .fc-toolbar-title { font-size: 1.05rem; font-weight: 700; color: #fff; } .fc-dark .fc .fc-button { background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.08); color: rgba(255, 255, 255, 0.7); box-shadow: none; text-transform: none; font-size: 0.78rem; font-weight: 500; padding: 0.35rem 0.7rem; border-radius: 0.55rem; } .fc-dark .fc .fc-button:hover { background: rgba(255, 255, 255, 0.1); color: #fff; border-color: rgba(255, 255, 255, 0.14); } .fc-dark .fc .fc-button:focus, .fc-dark .fc .fc-button:active { box-shadow: none !important; outline: none; } .fc-dark .fc .fc-button-primary:not(:disabled).fc-button-active, .fc-dark .fc .fc-button-primary:not(:disabled):active { background: #4f46e5; border-color: #4f46e5; color: #fff; } .fc-dark .fc .fc-button:disabled { opacity: 0.4; } .fc-dark .fc .fc-button-group > .fc-button { margin: 0; } /* Grid headers + cells */ .fc-dark .fc .fc-col-header-cell-cushion { color: rgba(255, 255, 255, 0.4); font-size: 0.68rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; padding: 0.6rem 0.4rem; } .fc-dark .fc .fc-daygrid-day-number { color: rgba(255, 255, 255, 0.5); font-size: 0.78rem; padding: 0.4rem 0.5rem; } .fc-dark .fc .fc-day-today .fc-daygrid-day-number { color: #a5b4fc; font-weight: 700; } .fc-dark .fc .fc-daygrid-day.fc-day-other { background: rgba(255, 255, 255, 0.012); } .fc-dark .fc .fc-daygrid-day.fc-day-other .fc-daygrid-day-number { opacity: 0.35; } /* Events */ .fc-dark .fc .fc-event { border-radius: 6px; border: none; font-size: 0.72rem; font-weight: 500; padding: 1px 5px; cursor: pointer; } .fc-dark .fc .fc-event:hover { filter: brightness(1.12); } .fc-dark .fc .fc-daygrid-event .fc-event-title { font-weight: 500; } .fc-dark .fc .fc-daygrid-more-link { color: rgba(255, 255, 255, 0.4); font-size: 0.68rem; font-weight: 600; } .fc-dark .fc .fc-daygrid-more-link:hover { color: #fff; } .fc-dark .fc .fc-popover { background: #16161f; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 0.75rem; box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5); } .fc-dark .fc .fc-popover-header { background: rgba(255, 255, 255, 0.04); color: #fff; } /* Time grid (week/day) */ .fc-dark .fc .fc-timegrid-slot-label-cushion, .fc-dark .fc .fc-timegrid-axis-cushion { color: rgba(255, 255, 255, 0.35); font-size: 0.68rem; } /* List / agenda view */ .fc-dark .fc .fc-list { border-color: var(--fc-border-color); } .fc-dark .fc .fc-list-day-cushion { background: rgba(255, 255, 255, 0.03); color: #fff; } .fc-dark .fc .fc-list-event:hover td { background: rgba(255, 255, 255, 0.04); } .fc-dark .fc .fc-list-event-title, .fc-dark .fc .fc-list-event-time { color: rgba(255, 255, 255, 0.8); } .fc-dark .fc .fc-list-empty { background: transparent; color: rgba(255, 255, 255, 0.3); }