/* v5.23.27 - Aufgaben-Termine: kompaktes, modernes Editor-Layout */
.task-appointments {
  display: grid;
  gap: 14px;
  margin: 10px 0 16px;
}
.task-appointments > .section-head {
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin: 0;
}
.task-derived-card {
  border: 1px solid var(--outline-variant);
  border-radius: 18px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--surface-container-low) 78%, transparent), color-mix(in srgb, var(--surface) 92%, transparent));
  padding: 16px;
  display: grid;
  gap: 14px;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.05);
}
.task-derived-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.task-derived-head h3 {
  margin: 0 0 4px;
  font-size: 16px;
}
.task-derived-head p {
  margin: 0;
}
.task-derived-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.task-derived-item {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  min-width: 0;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid var(--outline-variant);
  background: color-mix(in srgb, var(--surface-container-high) 82%, transparent);
}
.task-derived-item > .material-symbols-outlined {
  font-size: 20px;
  color: var(--primary);
  margin-top: 1px;
}
.task-derived-item strong,
.task-appointment-row-head strong {
  display: block;
  margin-bottom: 2px;
}
.task-derived-item small,
.task-appointment-row-head p {
  display: block;
  margin: 0;
}
.task-appointment-list {
  display: grid;
  gap: 12px;
}
.task-appointment-row {
  border: 1px solid var(--outline-variant);
  border-radius: 18px;
  background: color-mix(in srgb, var(--surface-container-low) 88%, transparent);
  padding: 14px;
  display: grid;
  gap: 12px;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.04);
}
.task-appointment-row-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.task-appointment-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px 12px;
}
.task-appointment-grid.secondary {
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
}
.task-appointment-row .form-field {
  margin: 0;
}
.task-appointment-row .form-field label {
  margin-bottom: 6px;
}
.task-appointment-delete {
  white-space: nowrap;
}
@media (max-width: 980px) {
  .task-derived-grid,
  .task-appointment-grid,
  .task-appointment-grid.secondary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .task-derived-head,
  .task-appointment-row-head,
  .task-appointments > .section-head {
    flex-direction: column;
    align-items: stretch;
  }
  .task-derived-grid,
  .task-appointment-grid,
  .task-appointment-grid.secondary {
    grid-template-columns: 1fr;
  }
  .task-appointment-delete,
  .task-appointments > .section-head .btn {
    width: 100%;
    justify-content: center;
  }
}

/* v5.23.29 - Termine vertikal statt horizontal */
.task-appointment-list {
  grid-template-columns: 1fr;
}
.task-appointment-row {
  width: 100%;
  max-width: 540px;
}
.task-appointment-grid,
.task-appointment-grid.secondary {
  grid-template-columns: 1fr !important;
}
.task-appointment-row .input,
.task-appointment-row .select,
.task-appointment-row .btn {
  width: 100%;
}
.task-appointment-row-head {
  align-items: flex-start;
}
.task-appointment-row .form-field label {
  font-size: 12px;
  letter-spacing: 0.04em;
}
.task-appointment-delete {
  align-self: flex-start;
}
@media (max-width: 640px) {
  .task-appointment-row {
    max-width: none;
  }
}

/* v5.23.30 - Termin-Kopf vertikal statt horizontal */
.task-appointment-list {
  justify-items: start;
}
.task-appointment-row {
  max-width: 420px;
}
.task-appointment-row-head {
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 8px;
}
.task-appointment-row-head > div {
  width: 100%;
}
.task-appointment-delete {
  align-self: flex-start;
  width: auto;
  justify-content: flex-start;
}
@media (max-width: 640px) {
  .task-appointment-row {
    max-width: 100%;
  }
}

/* v5.23.31 - Termin-Karten vollbreit/horizontal, Termine bleiben untereinander */
.task-appointment-list {
  display: grid !important;
  grid-template-columns: 1fr !important;
  justify-items: stretch !important;
  gap: 14px !important;
  width: 100% !important;
}
.task-appointment-row {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}
.task-appointment-row-head {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  width: 100% !important;
}
.task-appointment-row-head > div {
  width: auto !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
}
.task-appointment-delete {
  align-self: flex-start !important;
  width: auto !important;
  flex: 0 0 auto !important;
  justify-content: center !important;
  white-space: nowrap !important;
}
.task-appointment-grid {
  display: grid !important;
  grid-template-columns: minmax(150px, 1fr) minmax(105px, .7fr) minmax(105px, .7fr) minmax(190px, 1.15fr) !important;
  gap: 12px !important;
  align-items: end !important;
  width: 100% !important;
}
.task-appointment-grid.secondary {
  display: grid !important;
  grid-template-columns: minmax(220px, 1.2fr) minmax(220px, 1fr) !important;
  gap: 12px !important;
  width: 100% !important;
}
.task-appointment-row .input,
.task-appointment-row .select {
  width: 100% !important;
  min-width: 0 !important;
}
.task-appointment-row .btn:not(.task-appointment-delete) {
  width: auto !important;
}
@media (max-width: 900px) {
  .task-appointment-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .task-appointment-grid.secondary {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 560px) {
  .task-appointment-row-head {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .task-appointment-delete {
    width: 100% !important;
    justify-content: center !important;
  }
  .task-appointment-grid,
  .task-appointment-grid.secondary {
    grid-template-columns: 1fr !important;
  }
}

/* v5.23.32 - Planungskachel und Termine über volle Breite */
.task-appointments {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  min-width: 0 !important;
}
.task-derived-card {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}
.task-derived-head {
  width: 100% !important;
}
.task-derived-head > div {
  flex: 1 1 auto;
  min-width: 0;
}
.task-derived-grid {
  width: 100% !important;
  grid-template-columns: repeat(3, minmax(170px, 1fr)) !important;
  align-items: stretch;
}
.task-derived-item {
  min-width: 0 !important;
}
.task-derived-item > div {
  min-width: 0;
}
.task-derived-item small {
  overflow-wrap: anywhere;
  line-height: 1.35;
}
.task-appointment-row {
  overflow: hidden;
}
@media (max-width: 900px) {
  .task-derived-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 560px) {
  .task-derived-grid {
    grid-template-columns: 1fr !important;
  }
}

/* v5.23.33 - Projektbudget aus gebuchten Zeiten */
.project-budget-mini {
  display: grid;
  gap: 6px;
  border: 1px solid var(--outline-variant);
  border-radius: 14px;
  background: color-mix(in srgb, var(--surface-container-low) 78%, transparent);
  padding: 10px;
}
.project-budget-mini strong,
.project-budget-cell strong {
  color: var(--on-surface);
}
.project-budget-mini.over,
.project-budget-mini.risk {
  border-color: color-mix(in srgb, var(--error, #ba1a1a) 35%, var(--outline-variant));
  background: color-mix(in srgb, var(--error-container, #ffdad6) 32%, var(--surface));
}
.budget-progress {
  width: 100%;
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--surface-container-high);
  border: 1px solid var(--outline-variant);
}
.budget-progress i {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: var(--primary);
}
.budget-progress.big {
  height: 12px;
  margin-top: 6px;
}
.budget-progress.warn i,
.budget-progress.risk i {
  background: var(--tertiary, #f59e0b);
}
.budget-progress.over i {
  background: var(--error, #ba1a1a);
}
.project-budget-panel {
  display: grid;
  gap: 12px;
  border: 1px solid var(--outline-variant);
  border-radius: 18px;
  padding: 16px;
  margin: 16px 0;
  background: color-mix(in srgb, var(--surface-container-low) 82%, transparent);
}
.project-budget-panel .section-head {
  margin: 0;
  align-items: flex-start;
}
.project-budget-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
}
.project-budget-grid > div,
.project-budget-breakdown > div {
  border: 1px solid var(--outline-variant);
  border-radius: 14px;
  background: var(--surface);
  padding: 10px 12px;
}
.project-budget-grid strong,
.project-budget-grid small,
.project-budget-breakdown span,
.project-budget-breakdown strong,
.project-budget-breakdown small,
.project-budget-cell small {
  display: block;
}
.project-budget-grid small,
.project-budget-breakdown small,
.project-budget-cell small {
  color: var(--on-surface-variant);
  font-size: 12px;
  margin-top: 2px;
}
.project-budget-breakdown {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}
.project-budget-breakdown > div {
  display: grid;
  gap: 2px;
}
.project-budget-cell {
  min-width: 150px;
}
.project-overview-table th:nth-child(6),
.project-overview-table td:nth-child(6) {
  min-width: 170px;
}

/* v5.23.34 - Ressourcenplanung Woche/Monat ohne horizontale Scroll-Leiste */
.resource-planner-v2.resource-scale-week .resource-calendar-main,
.resource-planner-v2.resource-scale-month .resource-calendar-main,
.resource-planner-v2.resource-scale-week .occupancy-week,
.resource-planner-v2.resource-scale-month .occupancy-month {
  overflow-x: hidden !important;
  max-width: 100% !important;
}
.resource-planner-v2.resource-scale-week .timeline-scroll-control.resource-scroll-control,
.resource-planner-v2.resource-scale-month .timeline-scroll-control.resource-scroll-control {
  display: none !important;
}
.resource-planner-v2.resource-scale-week .occupancy-week-head,
.resource-planner-v2.resource-scale-week .occupancy-week-row,
.resource-planner-v2.resource-scale-week .occupancy-week-row.occupancy-week-row-timeline {
  min-width: 0 !important;
  width: 100% !important;
}
.resource-planner-v2.resource-scale-week .occupancy-week-head,
.resource-planner-v2.resource-scale-week .occupancy-week-row {
  grid-template-columns: minmax(130px, 170px) repeat(var(--occ-days, 5), minmax(0, 1fr)) !important;
}
.resource-planner-v2.resource-scale-week .occupancy-week-row.occupancy-week-row-timeline {
  grid-template-columns: minmax(130px, 170px) minmax(0, 1fr) !important;
}
.resource-planner-v2.resource-scale-week .occupancy-week-lane {
  grid-template-columns: repeat(var(--occ-days, 5), minmax(0, 1fr)) !important;
}
.resource-planner-v2.resource-scale-month .occupancy-month-head,
.resource-planner-v2.resource-scale-month .occupancy-month-grid {
  min-width: 0 !important;
  width: 100% !important;
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
}
.resource-planner-v2.resource-scale-month .occupancy-month-cell {
  min-width: 0 !important;
  padding: 8px !important;
}
.resource-planner-v2.resource-scale-month .occupancy-chip.compact {
  min-width: 0 !important;
  overflow: hidden;
}
.resource-planner-v2.resource-scale-month .occupancy-chip.compact strong,
.resource-planner-v2.resource-scale-month .occupancy-chip.compact span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (max-width: 760px) {
  .resource-planner-v2.resource-scale-week .occupancy-week-head,
  .resource-planner-v2.resource-scale-week .occupancy-week-row,
  .resource-planner-v2.resource-scale-week .occupancy-week-row.occupancy-week-row-timeline {
    min-width: 0 !important;
  }
}

/* v5.23.35 - Ressourcenplanung: Tag/Woche/Monat ohne horizontales Scrollen */
.resource-planner-v2 .resource-calendar-main,
.resource-planner-v2.resource-scale-day .resource-calendar-main,
.resource-planner-v2.resource-scale-week .resource-calendar-main,
.resource-planner-v2.resource-scale-month .resource-calendar-main,
.resource-planner-v2.resource-scale-day .occupancy-day,
.resource-planner-v2.resource-scale-week .occupancy-week,
.resource-planner-v2.resource-scale-month .occupancy-month {
  overflow-x: hidden !important;
  max-width: 100% !important;
  width: 100% !important;
  min-width: 0 !important;
}
.resource-planner-v2 .timeline-scroll-control.resource-scroll-control {
  display: none !important;
}
.resource-planner-v2.resource-scale-day .occupancy-day-head,
.resource-planner-v2.resource-scale-day .occupancy-day-row,
.resource-planner-v2.resource-scale-day .occupancy-day-row.occupancy-day-row-timeline,
.resource-planner-v2.resource-scale-week .occupancy-week-head,
.resource-planner-v2.resource-scale-week .occupancy-week-row,
.resource-planner-v2.resource-scale-week .occupancy-week-row.occupancy-week-row-timeline,
.resource-planner-v2.resource-scale-month .occupancy-month-head,
.resource-planner-v2.resource-scale-month .occupancy-month-grid {
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}
.resource-planner-v2.resource-scale-day .occupancy-day-head {
  grid-template-columns: minmax(105px, 150px) repeat(var(--occ-cols), minmax(0, 1fr)) !important;
}
.resource-planner-v2.resource-scale-day .occupancy-day-row.occupancy-day-row-timeline {
  grid-template-columns: minmax(105px, 150px) minmax(0, 1fr) !important;
}
.resource-planner-v2.resource-scale-day .occupancy-day-lane {
  grid-template-columns: repeat(var(--occ-cols), minmax(0, 1fr)) !important;
}
.resource-planner-v2.resource-scale-day .occupancy-hour-bg,
.resource-planner-v2.resource-scale-day .occupancy-day-event {
  min-width: 0 !important;
}
.resource-planner-v2.resource-scale-day .occupancy-day-head > *,
.resource-planner-v2.resource-scale-day .occupancy-day-row > * {
  min-width: 0 !important;
  padding-left: 6px !important;
  padding-right: 6px !important;
}
.resource-planner-v2.resource-scale-day .occupancy-day-head strong,
.resource-planner-v2.resource-scale-day .occupancy-day-head small,
.resource-planner-v2.resource-scale-week .occupancy-week-head strong,
.resource-planner-v2.resource-scale-week .occupancy-week-head small,
.resource-planner-v2.resource-scale-month .occupancy-month-head strong,
.resource-planner-v2.resource-scale-month .occupancy-month-head small {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
@media (max-width: 760px) {
  .resource-planner-v2.resource-scale-day .occupancy-day-head {
    grid-template-columns: minmax(82px, 108px) repeat(var(--occ-cols), minmax(0, 1fr)) !important;
  }
  .resource-planner-v2.resource-scale-day .occupancy-day-row.occupancy-day-row-timeline {
    grid-template-columns: minmax(82px, 108px) minmax(0, 1fr) !important;
  }
  .resource-planner-v2.resource-scale-day .occupancy-member {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
}

/* v5.23.36 - Ressourcenplanung: Toolbar in Tag/Woche/Monat identisch anordnen */
.resource-planner-v2 .occupancy-head {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: start !important;
  justify-content: stretch !important;
}
.resource-planner-v2 .occupancy-head > div:first-child,
.resource-planner-v2 .resource-calendar-toolbar {
  width: 100% !important;
  min-width: 0 !important;
}
.resource-planner-v2 .resource-calendar-toolbar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  gap: 8px !important;
}
.resource-planner-v2 .resource-view-switch {
  flex: 0 0 auto;
}
.resource-planner-v2 .resource-calendar-toolbar > .btn {
  flex: 0 0 auto;
  min-height: 38px;
}
.resource-planner-v2 .resource-toolbar-field {
  display: grid;
  gap: 4px;
  min-width: 190px;
  max-width: 260px;
  flex: 0 1 220px;
  margin: 0;
}
.resource-planner-v2 .resource-toolbar-field > span {
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--on-surface-variant);
}
.resource-planner-v2 .resource-toolbar-field .compact-select {
  width: 100%;
  min-width: 0;
}
@media (max-width: 760px) {
  .resource-planner-v2 .resource-calendar-toolbar > .segmented,
  .resource-planner-v2 .resource-calendar-toolbar > .btn,
  .resource-planner-v2 .resource-toolbar-field {
    width: 100%;
    max-width: none;
    flex: 1 1 100%;
  }
  .resource-planner-v2 .resource-calendar-toolbar > .btn {
    justify-content: center;
  }
}

/* v5.23.39 - Mehrfach-Termine stabilisieren + Vorlageneditor */
.resource-unassigned-task .resource-unassigned-kind {
  display: inline-flex;
  align-items: center;
  width: max-content;
  max-width: 100%;
  padding: 2px 8px;
  margin-bottom: 6px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--primary) 12%, var(--surface-container-high));
  color: var(--primary);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .03em;
}
.resource-unassigned-task small + small {
  margin-top: 3px;
}
.template-editor-card {
  cursor: default;
  display: grid;
  gap: 10px;
  align-content: start;
}
.template-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.template-card-top > .material-symbols-outlined {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: color-mix(in srgb, var(--primary) 12%, var(--surface-container-high));
  color: var(--primary);
  font-size: 24px;
}
.template-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
}
.template-actions .btn {
  flex: 1 1 auto;
  justify-content: center;
}
.template-editor-hero {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 14px;
  border: 1px solid var(--outline-variant);
  border-radius: 16px;
  background: color-mix(in srgb, var(--surface-container-low) 85%, transparent);
}
.template-editor-hero > .material-symbols-outlined {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: color-mix(in srgb, var(--primary) 13%, var(--surface));
  color: var(--primary);
  font-size: 25px;
}
.template-editor-hero h3,
.template-editor-hero p {
  margin: 0;
}
.template-task-lines {
  min-height: 220px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  line-height: 1.45;
}
.modal-foot.inline {
  margin: 0;
  padding: 0;
  border: 0;
  justify-content: flex-end;
}
@media (max-width: 640px) {
  .template-actions,
  .modal-foot.inline {
    flex-direction: column;
  }
  .template-actions .btn,
  .modal-foot.inline .btn {
    width: 100%;
  }
}

/* v5.23.40 - Mehrfachtermine: unzugeteilte Termin-Details klar anzeigen */
.resource-unassigned-task .resource-unassigned-details {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 3px 8px;
  margin-top: 8px;
  padding: 8px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--surface-container-high) 72%, transparent);
  color: var(--on-surface-variant);
  font-size: 11px;
  line-height: 1.25;
  text-align: left;
}
.resource-unassigned-task .resource-unassigned-details b {
  color: var(--on-surface);
  font-weight: 800;
}
.timeline-bar-new.appointment,
.timeline-bar-new.locked[draggable="false"] {
  cursor: pointer;
}


/* v5.23.41 - Ressourcenplanung: doppelte Unassigned-Termin-Details entfernt */
.resource-unassigned-task .resource-unassigned-details {
  display: none !important;
}

/* v5.23.42 - Unassigned-Termin-Karten: klarere Typografie */
.resource-unassigned-task .resource-unassigned-kind {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  padding: 4px 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--primary) 18%, transparent);
  color: var(--primary);
  font-weight: 700;
  font-size: 12px;
  line-height: 1.1;
  margin-bottom: 8px;
}
.resource-unassigned-task .resource-unassigned-task-title {
  display: block;
  font-size: 16px;
  line-height: 1.25;
  margin-bottom: 4px;
  color: var(--on-surface);
}
.resource-unassigned-task .resource-unassigned-project,
.resource-unassigned-task .resource-unassigned-subtitle,
.resource-unassigned-task .resource-unassigned-meta {
  display: block;
  margin-top: 2px;
}
.resource-unassigned-task .resource-unassigned-project {
  font-size: 14px;
  color: var(--on-surface);
  opacity: 0.92;
}
.resource-unassigned-task .resource-unassigned-subtitle {
  font-size: 13px;
  color: var(--on-surface-variant);
}
.resource-unassigned-task .resource-unassigned-meta {
  font-size: 13px;
  line-height: 1.45;
  color: var(--on-surface-variant);
  margin-top: 8px;
}

/* v5.25.50 - Ressourcenplanung: unzugeordnete Termine ohne Überlappung */
.resource-planner-v2 .resource-unassigned-list {
  display: flex !important;
  flex-wrap: wrap;
  align-items: flex-start;
  align-content: flex-start;
  gap: 10px;
  grid-template-columns: none !important;
  grid-auto-rows: auto !important;
}
.resource-planner-v2 .resource-unassigned-task {
  box-sizing: border-box;
  display: flex !important;
  flex: 1 1 260px;
  flex-direction: column;
  align-items: flex-start;
  align-self: flex-start;
  gap: 4px;
  height: auto !important;
  min-height: fit-content;
  min-width: 0;
  overflow: visible;
  padding: 12px 38px 12px 12px;
  white-space: normal;
}
.resource-planner-v2 .resource-unassigned-task > * {
  min-width: 0;
  max-width: 100%;
}
.resource-planner-v2 .resource-unassigned-task-title,
.resource-planner-v2 .resource-unassigned-project,
.resource-planner-v2 .resource-unassigned-subtitle,
.resource-planner-v2 .resource-unassigned-meta {
  overflow-wrap: anywhere;
  word-break: normal;
}
.resource-planner-v2 .resource-unassigned-meta {
  margin-top: 6px;
}