/* The BB24 timeline, unit filters and source connections, with example data. */
.bb24-calendar-filters { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-bottom:17px; font-size:12px; }
.bb24-calendar-filters label { font-weight:700; }.bb24-calendar-filters select,.sources-panel select { border:1px solid #d4dfe9; border-radius:7px; background:#fff; padding:9px 12px; color:#284866; font:inherit; font-size:12px; max-width:100%; }
.bb24-calendar-filters > span { margin-left:auto; color:#6f849b; font-size:11px; }
.bb24-calendar-layout { display:grid; grid-template-columns:minmax(0,1fr); gap:18px; }
.calendar-panel,.sources-panel { border:1px solid #dce5ef; border-radius:14px; background:#fff; padding:22px; min-width:0; }
#calendar { min-width:0; }
#calendar .fc-toolbar { flex-wrap:wrap; gap:12px; margin-bottom:20px; }
#calendar .fc-toolbar-title { font-size:21px; letter-spacing:-.5px; }
#calendar .fc-button { font-size:10px; border-radius:6px; border:0; padding:8px 10px; box-shadow:none; }
#calendar .fc-button-primary { background:#38aaf5; }
#calendar .fc-button-primary:hover { background:#168fe0; }
#calendar .fc-button-active { background:#111827; }
#calendar .fc-today-button { background:#64748b; }
#calendar .fc-scrollgrid { border:1px solid #e1e7ee; border-radius:11px; overflow:hidden; }
#calendar .fc-timeline-header-row th { background:#f8fafc; }
#calendar .fc-datagrid-cell-main { font-size:11px; color:#475569; }
#calendar .fc-timeline-slot-cushion { font-size:10px; text-decoration:none; color:#42698f; }
#calendar .fc-timeline-slot-frame { min-height:36px; }
#calendar .fc-resource-timeline-divider { width:3px; background:#e5e7eb; }
#calendar .fc-event { border:0; border-radius:7px; padding:4px 7px; min-height:25px; cursor:pointer; }
#calendar .fc-event-title { font-size:10px; font-weight:700; }.fc-license-message { font-size:10px; }
#calendar .fc-day-today { background:#38bdf810; }
.calendar-panel .micro { font-size:11px; }.calendar-note { font-size:10px; color:#7f93a7; border-top:1px solid #e5ebf2; padding-top:12px; }
.sources-panel .demo-section-heading h3 { font-size:18px; }
#calendar-sources { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; list-style:none; padding:0; margin:20px 0; }
#calendar-sources li { border:1px solid #e0e7ef; padding:15px; border-radius:8px; }
.source-label { display:flex; gap:7px; align-items:center; font-size:12px; font-weight:700; cursor:pointer; }
.source-color { width:8px; height:8px; flex-shrink:0; border-radius:50%; }.source-label input { accent-color:#1c4587; width:16px; height:16px; }
.source-detail { display:block; font-size:10px; color:#7f93aa; margin-top:7px; }.source-remove { padding:4px 0; background:none; border:0; color:#5e7b97; text-decoration:underline; cursor:pointer; font-size:10px; }
.add-source summary { font-size:13px; }.add-source form { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; align-items:end; }.add-source .field { margin-top:12px; }.add-source input { font-size:12px; }.add-source select { width:100%; }.add-source .button { font-size:12px; min-height:44px; }
.import-source { font-size:12px; margin:20px 0; }.import-source input { display:block; margin-top:10px; max-width:100%; font-size:11px; }.reset-demo { border:0; background:none; color:#5a7694; text-decoration:underline; cursor:pointer; font-size:11px; }
@media(max-width:760px) { .calendar-panel { padding:17px 12px; } #calendar .fc-toolbar-title { font-size:18px; } #calendar .fc-toolbar-chunk { max-width:100%; } .sources-panel { padding:18px; } .add-source form { grid-template-columns:minmax(0,1fr); } }
@media(max-width:480px) { #calendar .fc-toolbar { align-items:flex-start; flex-direction:column; } #calendar-sources { grid-template-columns:minmax(0,1fr); } .bb24-calendar-filters > span { margin-left:0; } .bb24-calendar-filters select { width:100%; } }