/* ==========================================================================
   Horde calendar theme – FullCalendar v4 (lokaal) + v5 (CDN)
   ========================================================================== */

:root {
  --h-bg:         #0c0807;
  --h-card:       #181010;
  --h-card-2:     #1f1513;
  --h-border:     #2e1e1a;
  --h-iron:       #3d2d28;
  --h-red:        #c62a1f;
  --h-red-bright: #ef4a35;
  --h-red-deep:   #7d140f;
  --h-ember:      #f08a24;
  --h-ember-soft: #ffb25c;
  --h-bone:       #efe6d8;
  --h-text:       #d8cfc3;
  --h-muted:      #9c8d80;
  --h-faint:      #4d3d37;
  --h-today:      rgba(198, 42, 31, 0.14);
}

/* Meerregelige eventtitels */
.fc-title, .fc-time {
  white-space: normal;
}

/* --- Base --- */
html, body,
#calendar-container {
  background-color: transparent !important;
  color: var(--h-text) !important;
}

/* --- Borders --- */
.fc-unthemed th,
.fc-unthemed td,
.fc-unthemed thead,
.fc-unthemed tbody,
.fc-unthemed .fc-divider,
.fc-unthemed .fc-row,
.fc-unthemed .fc-content,
.fc-unthemed .fc-popover,
.fc-unthemed .fc-list-view,
.fc-unthemed .fc-list-heading td,
.fc-theme-standard th,
.fc-theme-standard td,
.fc-theme-standard .fc-scrollgrid,
.fc-theme-standard .fc-list,
.fc td,
.fc th {
  border-color: var(--h-border) !important;
}

/* --- View containers --- */
.fc-view-container,
.fc-view,
.fc-scrollgrid,
.fc-daygrid,
.fc-timegrid,
.fc-list,
.fc-view-harness,
.fc-scroller,
.fc-scroller-liquid-absolute,
#calendar .fc-view-container {
  background-color: transparent !important;
}

/* --- Weekdag-koppen --- */
.fc-unthemed thead,
.fc-unthemed .fc-head td,
.fc-unthemed .fc-head,
.fc th,
.fc-col-header,
.fc-col-header-cell,
.fc-day-header,
.fc thead,
.fc .fc-col-header-cell {
  background-color: var(--h-card-2) !important;
  color: var(--h-ember) !important;
}

.fc-col-header-cell-cushion,
.fc-day-header,
.fc th span,
.fc-col-header-cell a {
  color: var(--h-ember) !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  font-size: 0.8rem;
  letter-spacing: 0.5px;
  text-decoration: none !important;
}

/* --- Dagcellen --- */
.fc td,
.fc-daygrid-day,
.fc-day,
.fc-unthemed td,
.fc .fc-bg table td,
.fc-bg td,
.fc-row .fc-bg td,
.fc-row .fc-bgevent-skeleton td {
  background-color: var(--h-bg) !important;
}

/* --- Vandaag --- */
.fc-day-today,
.fc-unthemed td.fc-today,
td.fc-today,
.fc-daygrid-day.fc-day-today,
.fc .fc-day-today .fc-daygrid-day-frame,
.fc-row .fc-bg .fc-today,
.fc .fc-bg table .fc-today {
  background-color: var(--h-today) !important;
}

/* --- Dagnummers --- */
.fc-daygrid-day-number,
.fc-day-number,
.fc-daygrid-day-top a,
.fc td .fc-day-number {
  color: var(--h-text) !important;
  text-decoration: none !important;
}

.fc-day-today .fc-daygrid-day-number,
.fc-day-today .fc-day-number,
td.fc-today .fc-day-number {
  color: var(--h-red-bright) !important;
  font-weight: bold;
}

/* --- Andere maand --- */
.fc-day-other .fc-daygrid-day-number,
.fc-other-month .fc-day-number,
.fc-other-month {
  color: var(--h-faint) !important;
}

.fc-other-month,
.fc-day-other,
.fc-unthemed .fc-other-month,
.fc-day-other .fc-daygrid-day-frame,
.fc-row .fc-bg .fc-other-month {
  background-color: rgba(12, 8, 7, 0.7) !important;
}

.fc-unthemed .fc-disabled-day {
  background: var(--h-card) !important;
  opacity: 0.5;
}

.fc-unthemed .fc-divider,
.fc-unthemed .fc-popover .fc-header {
  background: var(--h-card-2) !important;
}

/* --- Events --- */
.fc-event,
.fc-daygrid-event,
.fc-h-event,
.fc-v-event,
.fc-timegrid-event,
.fc-event-main,
a.fc-event,
.fc-list-event {
  background-color: var(--h-red) !important;
  border-color: var(--h-red-deep) !important;
  color: #fff !important;
  border-radius: 3px !important;
  font-weight: 600;
  font-size: 0.8rem;
}

.fc-event:hover,
.fc-daygrid-event:hover,
a.fc-event:hover {
  background-color: var(--h-red-bright) !important;
  box-shadow: 0 0 10px rgba(239, 74, 53, 0.4);
}

.fc-event .fc-title,
.fc-event .fc-time,
.fc-event .fc-content,
.fc-event-title,
.fc-event-time,
.fc-event-main-frame,
.fc-h-event .fc-event-title,
.fc-h-event .fc-event-time,
.fc-list-event-title,
.fc-list-event-title a,
.fc-list-event-time {
  color: #fff !important;
}

.fc-event-dot,
.fc-list-event-dot {
  border-color: var(--h-red-bright) !important;
}

/* --- Toolbar --- */
.fc-toolbar,
.fc-header-toolbar {
  color: var(--h-bone) !important;
}

.fc-toolbar h2,
.fc-toolbar-title {
  color: var(--h-bone) !important;
  font-weight: 700;
  font-size: 1.3rem;
}

.fc-button,
.fc-button-primary,
.fc button {
  background-color: var(--h-card) !important;
  border-color: var(--h-border) !important;
  color: var(--h-ember) !important;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 0.8rem;
  box-shadow: none !important;
}

.fc-button:hover,
.fc-button-primary:hover,
.fc button:hover {
  background-color: var(--h-card-2) !important;
  border-color: var(--h-red-bright) !important;
  color: var(--h-ember-soft) !important;
}

.fc-button:focus,
.fc-button-primary:focus {
  box-shadow: 0 0 0 2px rgba(239, 74, 53, 0.3) !important;
}

.fc-button-active,
.fc-button-primary:not(:disabled).fc-button-active,
.fc-button-primary:not(:disabled):active,
.fc-state-active {
  background-color: var(--h-red) !important;
  border-color: var(--h-red-bright) !important;
  color: #fff !important;
}

.fc-button:disabled,
.fc-button-primary:disabled {
  background-color: var(--h-bg) !important;
  border-color: var(--h-border) !important;
  color: var(--h-faint) !important;
  opacity: 0.6;
}

/* --- "More" link --- */
.fc-more,
.fc-daygrid-more-link,
.fc-more-link {
  color: var(--h-ember) !important;
  font-weight: 600;
}

/* --- Popover --- */
.fc-popover,
.fc-more-popover {
  background-color: var(--h-card) !important;
  border-color: var(--h-border) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6) !important;
}

.fc-popover .fc-header,
.fc-popover-header {
  background-color: var(--h-card-2) !important;
  color: var(--h-ember) !important;
}

.fc-popover-title,
.fc-popover .fc-header .fc-title {
  color: var(--h-ember) !important;
}

.fc-popover .fc-header .fc-close {
  color: var(--h-text) !important;
}

.fc-popover-body {
  background-color: var(--h-card) !important;
}

/* --- Lijstweergave (v4 + v5) --- */
.fc-list-view,
.fc-unthemed .fc-list-view,
.fc-list-empty,
.fc-unthemed .fc-list-empty {
  background-color: var(--h-bg) !important;
  border-color: var(--h-border) !important;
}

.fc-list-heading td,
.fc-unthemed .fc-list-heading td,
.fc-list-day-cushion {
  background-color: var(--h-card-2) !important;
  color: var(--h-ember) !important;
  font-weight: 700;
}

.fc-list-heading-main,
.fc-list-heading-alt,
.fc-list-day-text,
.fc-list-day-side-text {
  color: var(--h-ember) !important;
}

.fc-list-table td,
.fc-list-item td {
  background-color: var(--h-bg) !important;
  border-color: var(--h-border) !important;
  color: var(--h-text) !important;
}

.fc-list-item:hover td,
.fc-list-event:hover td {
  background-color: var(--h-today) !important;
}

.fc-list-item-title a,
.fc-list-event-graphic {
  color: var(--h-text) !important;
}

.fc-list-item-time,
.fc-list-empty {
  color: var(--h-muted) !important;
}

.fc-nonbusiness,
.fc-bgevent {
  background: rgba(31, 21, 19, 0.5) !important;
}

.fc-highlight {
  background: rgba(239, 74, 53, 0.18) !important;
}

.fc-week-number {
  color: var(--h-faint) !important;
}

/* --- Scrollbar --- */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--h-bg); }
::-webkit-scrollbar-thumb { background: var(--h-iron); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--h-red); }

/* --- Mobiel --- */
@media (max-width: 767.98px) {
  .fc-toolbar {
    background-color: transparent !important;
  }

  .fc-toolbar h2 {
    color: var(--h-bone) !important;
  }
}