/* =========================================================
   NIMBUS STUNDENPLAN – site=6
   Tagesansicht / Listenansicht für Webseite
   ========================================================= */


/* =========================================================
   Grunddesign
   ========================================================= */

body {
  background: #b0b0b0 !important;
  font-family: Arial, sans-serif !important;
  color: #111 !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
  font-weight: normal !important;
  overflow-x: hidden !important;
}

/* Überschrift */
h1 {
  font-size: 28px !important;
  font-weight: 900 !important;
  margin: 18px 0 18px 0 !important;
  color: #111 !important;
}

h1 small {
  color: rgba(0,0,0,0.35) !important;
  font-weight: 700 !important;
}

/* Kopfbereich */
.page-heading {
  background: transparent !important;
  border: 0 !important;
  padding: 0 18px !important;
  margin: 0 auto !important;
  max-width: 980px !important;
}

/* Buttonbereich oben */
.options {
  text-align: right !important;
  margin-bottom: 12px !important;
}

/* Tagespfeile */
.btn-default,
.fc-button {
  background: #f67024 !important;
  border: 0 !important;
  border-radius: 999px !important;
  color: #111 !important;
  font-weight: 700 !important;
  padding: 9px 13px !important;
  box-shadow: none !important;
  margin-left: 6px !important;
}

/* Wochen-Button ausblenden */
.btn-primary {
  display: none !important;
}

/* Hover für Tagespfeile */
.btn-default:hover,
.fc-button:hover {
  background: #fab550 !important;
  color: #111 !important;
}


/* =========================================================
   Kalender-/Containerbereich
   ========================================================= */

#public-timetable-container {
  width: 100% !important;
  max-width: 980px !important;
  margin: 0 auto !important;
  background: #b0b0b0 !important;
  overflow-x: hidden !important;
}

.fc,
.fc-view-container,
.fc-view {
  background: #b0b0b0 !important;
  border: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* Leere Fläche unten reduzieren */
.fc-scroller,
.fc-list-view,
.fc-view-container {
  height: auto !important;
  min-height: 0 !important;
}


/* =========================================================
   LISTENANSICHT – wird aktiv, wenn iframe unter 1000px breit ist
   ========================================================= */

.fc-list-view {
  border: 0 !important;
  background: #fbcd60 !important;
}

.fc-list-table {
  background: transparent !important;
  border-collapse: separate !important;
  border-spacing: 0 6px !important;
  font-size: 16px !important;
  width: 100% !important;
}

/* Tagesüberschrift, z. B. Sonntag */
.fc-list-heading td {
  background: rgba(255,255,255,0.65) !important;
  color: #111 !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  padding: 14px 16px !important;
  border: 0 !important;
}

/* Kurszeilen */
.fc-list-event,
.fc-list-item {
  background: rgba(255,255,255,0.72) !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 7px rgba(0,0,0,0.08) !important;
}

/* Zellen */
.fc-list-event td,
.fc-list-item td {
  padding: 13px 14px !important;
  border: 0 !important;
  vertical-align: middle !important;
}

/* Uhrzeit */
.fc-list-event-time,
.fc-list-item-time {
  color: #f67024 !important;
  font-weight: 900 !important;
  white-space: nowrap !important;
  width: 150px !important;
  font-size: 16px !important;
}

/* Kursname */
.fc-list-event-title,
.fc-list-item-title {
  color: #111 !important;
  font-weight: 800 !important;
  font-size: 16px !important;
}

/* Farbpunkt */
.fc-list-event-dot {
  border-width: 5px !important;
}

/* Links nicht blau/unterstrichen */
.fc-list-event a,
.fc-list-item a,
.fc-list-event-title a,
.fc-list-item-title a {
  color: #111 !important;
  text-decoration: none !important;
}


/* =========================================================
   FALLBACK: Tages-Raumansicht, falls iframe über 1000px breit ist
   ========================================================= */

/* Header der Zeitachse */
.fc-widget-header,
.fc-day-header {
  background: rgba(255,255,255,0.5) !important;
  color: #222 !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  padding: 8px 4px !important;
}

/* Räume-/Zeitspalten */
.fc-axis,
.fc-resource-area,
.fc-resource-area td,
.fc-time,
.fc-widget-content .fc-axis {
  font-size: 13px !important;
  color: #222 !important;
  font-weight: 700 !important;
}

/* Raster dezenter */
.fc-widget-content,
.fc-slats td {
  border-color: rgba(255,255,255,0.42) !important;
}

/* Kurskarten */
.fc-event,
.fc-time-grid-event,
.fc-v-event,
.fc-timeline-event {
  border: none !important;
  border-radius: 10px !important;
  padding: 7px 9px !important;
  margin: 2px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.14) !important;
  font-size: 13px !important;
  line-height: 1.25 !important;
  min-height: 34px !important;
  color: #fff !important;
}

/* Text nicht abschneiden */
.fc-event .fc-content,
.fc-event .fc-title,
.fc-event .fc-time,
.fc-title,
.fc-sticky {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
}

/* Kurstitel */
.fc-event .fc-title,
.fc-title,
.fc-sticky {
  display: block !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
}

/* Uhrzeit, falls in bestimmter Ansicht vorhanden */
.fc-time::before {
  content: attr(data-full);
  display: block;
  font-size: 11px;
  font-weight: 900;
  color: #fff;
  margin-bottom: 2px;
}


/* =========================================================
   Tooltip schöner machen
   ========================================================= */

.tooltipster-base,
.tooltipster-box,
.tooltipster-content,
.tooltip-inner {
  font-size: 14px !important;
  line-height: 1.35 !important;
  max-width: 340px !important;
  font-weight: 700 !important;
}

.tooltipster-sidetip .tooltipster-box,
.customer-info-card .tooltipster-box {
  background: #fff !important;
  border: 0 !important;
  border-radius: 10px !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.25) !important;
}

.tooltipster-sidetip .tooltipster-content,
.customer-info-card .tooltipster-content {
  color: #111 !important;
  padding: 10px 12px !important;
}


/* =========================================================
   Mobile Optimierung
   ========================================================= */

@media screen and (max-width: 768px) {

  body {
    font-size: 14px !important;
    line-height: 1.35 !important;
  }

  .page-heading {
    padding: 0 10px !important;
  }

  h1 {
    font-size: 23px !important;
    margin: 14px 0 !important;
  }

  .btn-default,
  .fc-button {
    padding: 8px 11px !important;
    margin-left: 4px !important;
  }

  #public-timetable-container {
    max-width: 100% !important;
  }

  .fc-list-table {
    font-size: 14px !important;
    border-spacing: 0 5px !important;
  }

  .fc-list-heading td {
    font-size: 16px !important;
    padding: 11px 12px !important;
  }

  .fc-list-event td,
  .fc-list-item td {
    padding: 11px 10px !important;
  }

  .fc-list-event-time,
  .fc-list-item-time {
    width: 120px !important;
    font-size: 14px !important;
  }

  .fc-list-event-title,
  .fc-list-item-title {
    font-size: 14px !important;
  }
}


/* =========================================================
   Sehr schmale Smartphones
   ========================================================= */

@media screen and (max-width: 480px) {

  h1 {
    font-size: 21px !important;
  }

  .fc-list-event-time,
  .fc-list-item-time {
    width: 105px !important;
    font-size: 13px !important;
  }

  .fc-list-event-title,
  .fc-list-item-title {
    font-size: 13px !important;
  }

  .fc-list-event td,
  .fc-list-item td {
    padding: 10px 8px !important;
  }
}