
/* Schritt 299 v2: gezielte Fixes für öffentliche Stundenplanansicht */



.sp-shell {

  width: min(1660px, calc(100vw - 48px)) !important;

}



.tt-card,

.tt-card * {

  box-sizing: border-box !important;

}



.tt-card {

  overflow: visible !important;

}



.alias-note,

.plan-actions,

.plan-meta,

.lesson-more,

a[href*="pdf-stundenplaene"],

a[href*=".pdf"] {

  display: none !important;

}



.tt-head h2 {

  font-size: clamp(28px, 2.4vw, 42px) !important;

  line-height: 1.05 !important;

  letter-spacing: -0.04em !important;

  margin: 0 !important;

}



.tt-head p {

  margin: 6px 0 0 0 !important;

  color: #425166 !important;

  font-weight: 820 !important;

}



.tt-controls {

  display: grid !important;

  grid-template-columns: minmax(270px, 1fr) auto minmax(270px, 1fr) !important;

  align-items: center !important;

  gap: 14px !important;

  min-height: 58px !important;

  padding: 10px 12px !important;

  margin: 18px 0 0 0 !important;

  border: 1px solid #d7e0ea !important;

  border-radius: 18px 18px 0 0 !important;

  background: linear-gradient(180deg, #f8fafc 0%, #edf2f7 100%) !important;

}



.tt-view-buttons,

.tt-week-nav {

  display: flex !important;

  gap: 8px !important;

  flex-wrap: wrap !important;

  align-items: center !important;

}



.tt-view-buttons {

  justify-content: flex-start !important;

}



.tt-week-nav {

  justify-content: flex-end !important;

}



.tt-current {

  min-width: 170px !important;

  text-align: center !important;

  font-size: 18px !important;

  line-height: 1 !important;

  font-weight: 900 !important;

  letter-spacing: -0.02em !important;

  color: #111827 !important;

  white-space: nowrap !important;

}



.tt-view-buttons button,

.tt-week-nav button {

  min-height: 36px !important;

  padding: 0 14px !important;

  border-radius: 999px !important;

  border: 1px solid #d2dbe6 !important;

  background: #ffffff !important;

  color: #101827 !important;

  font-family: inherit !important;

  font-size: 13px !important;

  font-weight: 850 !important;

  cursor: pointer !important;

  box-shadow: 0 7px 16px rgba(15,23,42,0.06) !important;

  transition: transform .16s ease, box-shadow .16s ease, background .16s ease, color .16s ease, border-color .16s ease !important;

}



.tt-view-buttons button:hover,

.tt-week-nav button:hover {

  transform: translateY(-1px) !important;

  border-color: #b7c5d6 !important;

  background: #f8fafc !important;

  box-shadow: 0 11px 24px rgba(15,23,42,0.11) !important;

}



.tt-view-buttons button.active {

  background: #101827 !important;

  border-color: #101827 !important;

  color: #ffffff !important;

}



.tt-week-single,

.tt-week-pair {

  margin-top: 0 !important;

}



.tt-week-single {

  display: block !important;

}



.tt-week-pair {

  display: grid !important;

  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

  gap: 18px !important;

  align-items: start !important;

  width: 100% !important;

  overflow: visible !important;

  margin-bottom: 18px !important;

}



.tt-week {

  min-width: 0 !important;

  width: 100% !important;

  border: 1px solid #cbd5e1 !important;

  background: #e9e9e9 !important;

  overflow: hidden !important;

  border-radius: 0 0 16px 16px !important;

}



.tt-mode-double .tt-week,

.tt-mode-semester .tt-week {

  border-radius: 16px !important;

}



.tt-week-title {

  height: 34px !important;

  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  background: linear-gradient(180deg, #c9c9c9 0%, #b6b6b6 100%) !important;

  color: #333 !important;

  font-size: 15px !important;

  font-weight: 880 !important;

}



.tt-mode-week .tt-week-title {

  display: none !important;

}



.tt-grid {

  display: grid !important;

  grid-template-columns: 58px repeat(5, minmax(0, 1fr)) 58px !important;

  gap: 8px !important;

  padding: 16px !important;

  align-items: stretch !important;

  min-width: 0 !important;

  width: 100% !important;

}



.tt-mode-double .tt-grid,

.tt-mode-semester .tt-grid {

  grid-template-columns: 42px repeat(5, minmax(0, 1fr)) 42px !important;

  gap: 5px !important;

  padding: 10px !important;

}



.tt-day {

  min-height: 48px !important;

  text-align: center !important;

  display: flex !important;

  flex-direction: column !important;

  justify-content: center !important;

  color: #222 !important;

  min-width: 0 !important;

}



.tt-day strong {

  font-size: 13px !important;

  font-weight: 850 !important;

}



.tt-day span {

  margin-top: 2px !important;

  font-size: 11px !important;

  font-weight: 720 !important;

  color: #3d3d3d !important;

}



.tt-time {

  min-height: 78px !important;

  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  text-align: center !important;

  color: #111827 !important;

  font-size: 12px !important;

  font-weight: 850 !important;

  line-height: 1.22 !important;

  min-width: 0 !important;

}



.tt-cell {

  min-height: 78px !important;

  display: flex !important;

  min-width: 0 !important;

  overflow: visible !important;

}



.tt-empty {

  border: 1px dashed rgba(148,163,184,0.34) !important;

  border-radius: 12px !important;

  background: rgba(255,255,255,0.70) !important;

}



.tt-lesson {

  position: relative !important;

  width: 100% !important;

  min-width: 0 !important;

  min-height: 78px !important;

  border-radius: 12px !important;

  padding: 10px 8px !important;

  display: flex !important;

  flex-direction: column !important;

  align-items: center !important;

  justify-content: center !important;

  text-align: center !important;

  color: #ffffff !important;

  box-shadow: inset 0 -1px 0 rgba(0,0,0,0.16), 0 10px 18px rgba(15,23,42,0.10) !important;

  transition: transform .16s ease, box-shadow .16s ease, filter .16s ease !important;

}



.tt-lesson:hover {

  transform: translateY(-2px) !important;

  box-shadow: inset 0 -1px 0 rgba(0,0,0,0.16), 0 16px 28px rgba(15,23,42,0.18) !important;

  filter: brightness(1.04) !important;

  z-index: 20 !important;

}



.tt-subject {

  font-size: 12.6px !important;

  line-height: 1.16 !important;

  font-weight: 850 !important;

  letter-spacing: -0.01em !important;

  max-width: 100% !important;

  overflow-wrap: anywhere !important;

}



.tt-teacher,

.tt-room,

.tt-type {

  margin-top: 3px !important;

  font-size: 10.8px !important;

  line-height: 1.15 !important;

  font-weight: 760 !important;

  letter-spacing: -0.005em !important;

  opacity: .96 !important;

  max-width: 100% !important;

  overflow-wrap: anywhere !important;

}



.tt-type {

  font-size: 10px !important;

  opacity: .90 !important;

}



.tt-lesson.blue {

  background: #2d84bf !important;

}



.tt-lesson.grey {

  background: #a4a4a4 !important;

  color: #101827 !important;

}



.tt-lesson.green {

  background: #4f8d3a !important;

}



.tt-lesson.yellow {

  background: #fff200 !important;

  color: #101827 !important;

}



.tt-lesson.is-sol {

  background: #8198b8 !important;

  color: #101827 !important;

}



.tt-break {

  grid-column: 2 / 7 !important;

  min-height: 18px !important;

  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  border-radius: 999px !important;

  background: rgba(255,255,255,0.82) !important;

  color: #334155 !important;

  font-size: 11px !important;

  font-weight: 850 !important;

  letter-spacing: .5em !important;

  white-space: nowrap !important;

}



.tt-break-space {

  min-height: 18px !important;

}



.tt-corner {

  min-height: 48px !important;

}



.tt-mode-double .tt-time,

.tt-mode-semester .tt-time,

.tt-mode-double .tt-cell,

.tt-mode-double .tt-empty,

.tt-mode-double .tt-lesson,

.tt-mode-double .tt-closed,

.tt-mode-double .tt-closed-box,

.tt-mode-semester .tt-cell,

.tt-mode-semester .tt-empty,

.tt-mode-semester .tt-lesson,

.tt-mode-semester .tt-closed,

.tt-mode-semester .tt-closed-box {

  min-height: 66px !important;

}



.tt-mode-double .tt-subject,

.tt-mode-semester .tt-subject {

  font-size: 10.8px !important;

  font-weight: 820 !important;

}



.tt-mode-double .tt-teacher,

.tt-mode-double .tt-room,

.tt-mode-double .tt-type,

.tt-mode-semester .tt-teacher,

.tt-mode-semester .tt-room,

.tt-mode-semester .tt-type {

  font-size: 9.4px !important;

  font-weight: 720 !important;

}



.tt-mode-double .tt-day,

.tt-mode-semester .tt-day {

  min-height: 42px !important;

}



.tt-mode-double .tt-day strong,

.tt-mode-semester .tt-day strong {

  font-size: 11.2px !important;

}



.tt-mode-double .tt-day span,

.tt-mode-semester .tt-day span {

  font-size: 9.5px !important;

}



.tt-mode-double .tt-break,

.tt-mode-semester .tt-break {

  min-height: 16px !important;

  font-size: 9px !important;

  letter-spacing: .34em !important;

}



.tt-tooltip {

  position: absolute !important;

  left: 50% !important;

  bottom: calc(100% + 10px) !important;

  transform: translateX(-50%) translateY(6px) !important;

  width: max-content !important;

  max-width: 300px !important;

  display: none !important;

  flex-direction: column !important;

  gap: 4px !important;

  padding: 10px 12px !important;

  border-radius: 12px !important;

  background: #111827 !important;

  color: #ffffff !important;

  box-shadow: 0 16px 40px rgba(15,23,42,0.28) !important;

  font-size: 12px !important;

  line-height: 1.25 !important;

  z-index: 100 !important;

}



.tt-tooltip strong {

  font-weight: 850 !important;

}



.tt-tooltip span {

  font-weight: 700 !important;

}



.tt-lesson:hover .tt-tooltip {

  display: flex !important;

}



.tt-day.is-closed {

  color: #166534 !important;

}



.tt-closed,

.tt-closed-continuation {

  min-height: 78px !important;

  border-radius: 12px !important;

  display: flex !important;

  align-items: stretch !important;

  justify-content: stretch !important;

  min-width: 0 !important;

}



.tt-closed-continuation {

  background: rgba(255,255,255,0.42) !important;

  border: 1px solid rgba(148,163,184,0.12) !important;

}



.tt-closed-box {

  width: 100% !important;

  min-height: 78px !important;

  border-radius: 12px !important;

  border: 1px solid rgba(22,101,52,0.22) !important;

  background: linear-gradient(180deg, #ecfdf3 0%, #dcfce7 100%) !important;

  color: #14532d !important;

  display: flex !important;

  flex-direction: column !important;

  align-items: center !important;

  justify-content: center !important;

  text-align: center !important;

  padding: 8px !important;

  box-shadow: inset 0 1px 0 rgba(255,255,255,0.9) !important;

}



.tt-closed-box strong {

  font-size: 13px !important;

  line-height: 1.15 !important;

  font-weight: 850 !important;

}



.tt-closed-box span {

  margin-top: 4px !important;

  font-size: 11px !important;

  line-height: 1.15 !important;

  font-weight: 760 !important;

  text-transform: uppercase !important;

  letter-spacing: .04em !important;

}



.tt-closed-feiertag .tt-closed-box {

  background: linear-gradient(180deg, #e8f7ec 0%, #d8f0dd 100%) !important;

  color: #14532d !important;

}



.tt-closed-ferien .tt-closed-box {

  background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%) !important;

  border-color: rgba(37,99,235,0.22) !important;

  color: #1e3a8a !important;

}



.tt-closed-sondertag .tt-closed-box {

  background: linear-gradient(180deg, #fff7ed 0%, #ffedd5 100%) !important;

  border-color: rgba(234,88,12,0.25) !important;

  color: #7c2d12 !important;

}



.tt-closed-sondertag .tt-closed-box span {

  display: none !important;

}



.room-pill span {

  font-weight: 820 !important;

}



@media (max-width: 1180px) {

  .tt-week-pair {

    grid-template-columns: 1fr !important;

  }



  .tt-week {

    overflow-x: auto !important;

  }



  .tt-grid {

    min-width: 980px !important;

  }



  .tt-controls {

    grid-template-columns: 1fr !important;

    justify-items: center !important;

  }



  .tt-current {

    order: -1 !important;

  }



  .tt-view-buttons,

  .tt-week-nav {

    justify-content: center !important;

  }

}

