/* KnowCore P1.09-E2A – Aufgaben & Projekte */

#mod-tasks {
  min-width: 0;
}

#mod-tasks .kcWorkShellP109E2A {
  display: grid;
  gap: 14px;
  min-width: 0;
}

#mod-tasks .kcWorkMainTabsP109E2A {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 4px 2px 8px;
  scrollbar-width: thin;
}

#mod-tasks .kcWorkMainTabsP109E2A button {
  flex: 0 0 auto;
  border: 1px solid var(--border, #d5dfec);
  border-radius: 12px;
  padding: 9px 14px;
  background: var(--card2, #f5f8fc);
  color: var(--text, #172033);
  cursor: pointer;
  font-weight: 850;
  white-space: nowrap;
}

#mod-tasks .kcWorkMainTabsP109E2A button.active {
  background: var(--card, #fff);
  border-color: var(--kc-accent, #2f7df4);
  color: var(--kc-accent, #235fae);
  box-shadow: 0 5px 16px rgba(22, 46, 82, .08);
}

#mod-tasks [data-work-main-panel] {
  min-width: 0;
}

#mod-tasks [data-work-main-panel][hidden] {
  display: none !important;
}

#mod-tasks .kcWorkContextBarP109E2A,
#mod-tasks .kcProjectToolbarP109E2A,
#mod-tasks .kcWorkSectionHeadP109E2A,
#mod-tasks .kcCalendarHeadP109E2A,
.kcProjectDetailSectionHeadP109E2A {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

#mod-tasks .kcWorkContextBarP109E2A {
  margin-bottom: 12px;
}

#mod-tasks .kcWorkKpisP109E2A {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

#mod-tasks .kcWorkKpisP109E2A button {
  min-height: 95px;
  border: 1px solid var(--border, #d5dfec);
  border-radius: 16px;
  padding: 13px 15px;
  background: var(--card, #fff);
  color: var(--text, #172033);
  text-align: left;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 7px;
}

#mod-tasks .kcWorkKpisP109E2A button:hover,
#mod-tasks .kcWorkKpisP109E2A button:focus-visible {
  border-color: var(--kc-accent, #2f7df4);
  outline: 3px solid rgba(47, 125, 244, .12);
}

#mod-tasks .kcWorkKpisP109E2A button.warn {
  border-color: #e2a640;
}

#mod-tasks .kcWorkKpisP109E2A span {
  color: var(--muted, #64748b);
  font-weight: 800;
  font-size: 13px;
}

#mod-tasks .kcWorkKpisP109E2A b {
  font-size: 30px;
  line-height: 1;
}

#mod-tasks .kcWorkOverviewGridP109E2A,
#mod-tasks .kcCompletedGridP109E2A {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 14px;
}

#mod-tasks .kcWorkCompactListP109E2A,
#mod-tasks .kcWorkTimelineP109E2A,
#mod-tasks .kcCalendarListP109E2A,
.kcProjectGenericListP109E2A {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

#mod-tasks .kcWorkCompactRowP109E2A,
#mod-tasks .kcCalendarRowP109E2A {
  width: 100%;
  border: 1px solid var(--border, #d5dfec);
  border-radius: 13px;
  padding: 10px 12px;
  background: var(--card, #fff);
  color: var(--text, #172033);
  text-align: left;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  cursor: pointer;
}

#mod-tasks .kcWorkCompactRowP109E2A:hover,
#mod-tasks .kcCalendarRowP109E2A:hover {
  border-color: var(--kc-accent, #2f7df4);
}

#mod-tasks .kcWorkCompactRowP109E2A > span,
#mod-tasks .kcCalendarRowP109E2A > span {
  min-width: 0;
  display: grid;
  gap: 3px;
}

#mod-tasks .kcWorkCompactRowP109E2A b,
#mod-tasks .kcCalendarRowP109E2A b {
  overflow-wrap: anywhere;
}

#mod-tasks .kcWorkCompactRowP109E2A small,
#mod-tasks .kcCalendarRowP109E2A small {
  color: var(--muted, #64748b);
}

#mod-tasks .kcWorkCompactRowP109E2A time,
#mod-tasks .kcCalendarRowP109E2A time {
  flex: 0 0 auto;
  color: var(--muted, #64748b);
  font-weight: 800;
}

#mod-tasks .kcWorkTimelineRowP109E2A {
  display: grid;
  grid-template-columns: minmax(110px, 150px) 1fr;
  gap: 14px;
  align-items: start;
  border-bottom: 1px solid var(--border, #e1e7ef);
  padding: 9px 0;
}

#mod-tasks .kcWorkTimelineRowP109E2A:last-child {
  border-bottom: 0;
}

#mod-tasks .kcWorkTimelineRowP109E2A time {
  color: var(--muted, #64748b);
  font-weight: 850;
}

#mod-tasks .kcWorkTimelineRowP109E2A span {
  display: grid;
  gap: 3px;
}

#mod-tasks .kcWorkTimelineRowP109E2A small {
  color: var(--muted, #64748b);
}

#mod-tasks .kcWorkEmptyP109E2A,
#mod-tasks .kcWorkErrorP109E2A,
.kcWorkEmptyP109E2A,
.kcWorkErrorP109E2A {
  border: 1px dashed var(--border, #ccd7e4);
  border-radius: 13px;
  padding: 16px;
  color: var(--muted, #64748b);
  background: var(--card2, #f8fafc);
}

#mod-tasks .kcWorkErrorP109E2A,
.kcWorkErrorP109E2A {
  border-color: #e0a0a0;
  background: #fff2f2;
  color: #9a2828;
}

#mod-tasks .kcProjectToolbarP109E2A {
  margin-bottom: 12px;
  align-items: end;
}

#mod-tasks .kcProjectFiltersP109E2A {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(180px, .45fr);
  gap: 10px;
  flex: 1 1 600px;
}

#mod-tasks .kcProjectFiltersP109E2A label {
  display: grid;
  gap: 5px;
  color: var(--muted, #64748b);
  font-weight: 800;
}

#mod-tasks .kcProjectToolbarActionsP109E2A {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

#mod-tasks .kcProjectListP109E2A {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
  gap: 12px;
}

#mod-tasks .kcProjectCardP109E2A {
  min-width: 0;
  border: 1px solid var(--border, #d5dfec);
  border-left: 5px solid var(--kc-accent, #2f7df4);
  border-radius: 17px;
  padding: 14px;
  background: var(--card, #fff);
  color: var(--text, #172033);
  text-align: left;
  cursor: pointer;
  box-shadow: 0 7px 20px rgba(20, 45, 80, .055);
}

#mod-tasks .kcProjectCardP109E2A:hover,
#mod-tasks .kcProjectCardP109E2A:focus-visible {
  border-color: var(--kc-accent, #2f7df4);
  outline: 3px solid rgba(47, 125, 244, .11);
  transform: translateY(-1px);
}

#mod-tasks .kcProjectCardHeadP109E2A {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

#mod-tasks .kcProjectCardHeadP109E2A > div {
  min-width: 0;
  display: grid;
  gap: 4px;
}

#mod-tasks .kcProjectCardHeadP109E2A strong {
  font-size: 17px;
  overflow-wrap: anywhere;
}

#mod-tasks .kcProjectNumberP109E2A {
  color: var(--muted, #64748b);
  font-size: 12px;
  font-weight: 850;
}

#mod-tasks .kcProjectStatusP109E2A {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  min-height: 27px;
  padding: 4px 9px;
  border-radius: 999px;
  background: #edf4ff;
  color: #275ea5;
  font-size: 12px;
  font-weight: 850;
}

#mod-tasks .kcProjectStatusP109E2A.status-completed,
#mod-tasks .kcProjectStatusP109E2A.status-closed {
  background: #eaf8f0;
  color: #1d754d;
}

#mod-tasks .kcProjectStatusP109E2A.status-blocked,
#mod-tasks .kcProjectStatusP109E2A.status-cancelled {
  background: #fff0f0;
  color: #9d3131;
}

#mod-tasks .kcProjectMetaGridP109E2A {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin-top: 13px;
}

#mod-tasks .kcProjectMetaGridP109E2A > span {
  min-width: 0;
  display: grid;
  gap: 3px;
}

#mod-tasks .kcProjectMetaGridP109E2A small {
  color: var(--muted, #64748b);
}

#mod-tasks .kcProjectMetaGridP109E2A b {
  overflow-wrap: anywhere;
}

#mod-tasks .kcBoardNoticeP109E2A,
.kcBoardNoticeP109E2A {
  display: grid;
  gap: 4px;
  border: 1px solid #cdd9e8;
  border-radius: 13px;
  padding: 11px 13px;
  background: #f6f9fd;
  color: #31465f;
  margin-bottom: 12px;
}

#mod-tasks .kcBoardGridP109E2A {
  display: grid;
  grid-template-columns: repeat(5, minmax(230px, 1fr));
  gap: 10px;
  min-width: 0;
  overflow-x: auto;
  padding-bottom: 8px;
}

#mod-tasks .kcBoardColumnP109E2A {
  min-width: 230px;
  border: 1px solid var(--border, #d5dfec);
  border-radius: 15px;
  background: var(--card2, #f6f8fb);
  overflow: hidden;
}

#mod-tasks .kcBoardColumnP109E2A > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 11px 12px;
  border-bottom: 1px solid var(--border, #d5dfec);
  background: var(--card, #fff);
}

#mod-tasks .kcBoardColumnP109E2A > header span {
  min-width: 27px;
  height: 27px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  background: #edf2f8;
  font-size: 12px;
  font-weight: 850;
}

#mod-tasks .kcBoardColumnBodyP109E2A {
  display: grid;
  gap: 8px;
  padding: 9px;
}

#mod-tasks .kcBoardTaskP109E2A {
  border: 1px solid var(--border, #d5dfec);
  border-radius: 12px;
  padding: 10px;
  background: var(--card, #fff);
  color: var(--text, #172033);
  text-align: left;
  cursor: pointer;
  display: grid;
  gap: 5px;
}

#mod-tasks .kcBoardTaskP109E2A:hover {
  border-color: var(--kc-accent, #2f7df4);
}

#mod-tasks .kcBoardTaskNoP109E2A {
  color: var(--muted, #64748b);
  font-size: 11px;
  font-weight: 850;
}

#mod-tasks .kcBoardTaskP109E2A small {
  color: var(--muted, #64748b);
}

#mod-tasks .kcCalendarRowP109E2A {
  display: grid;
  grid-template-columns: minmax(115px, 160px) 1fr;
  justify-content: initial;
}

.kcProjectModalOpenP109E2A {
  overflow: hidden;
}

.kcProjectModalP109E2A {
  position: fixed;
  inset: 0;
  z-index: 15000;
  display: grid;
  place-items: center;
  padding: 14px;
}

.kcProjectModalP109E2A[hidden] {
  display: none !important;
}

.kcProjectModalBackdropP109E2A {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, .48);
  backdrop-filter: blur(3px);
}

.kcProjectModalBoxP109E2A {
  position: relative;
  width: min(1180px, calc(100vw - 28px));
  max-height: calc(100dvh - 28px);
  overflow: auto;
  border: 1px solid #cdd7e4;
  border-radius: 18px;
  padding: 20px;
  background: #f8fafc;
  color: #172033;
  box-shadow: 0 28px 90px rgba(15, 23, 42, .34);
}

.kcProjectModalHeadP109E2A {
  position: sticky;
  top: -20px;
  z-index: 4;
  margin: -20px -20px 16px;
  padding: 18px 20px 14px;
  border-bottom: 1px solid #d9e2ee;
  background: #f8fafc;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.kcProjectFormP109E2A {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.kcProjectFormP109E2A label {
  display: grid;
  gap: 6px;
  color: #475569;
  font-weight: 800;
}

.kcProjectFormP109E2A .span2 {
  grid-column: 1 / -1;
}

.kcProjectFormP109E2A textarea {
  resize: vertical;
}

.kcProjectFormMessageP109E2A {
  min-height: 22px;
  color: #9a3d2e;
  font-weight: 750;
}

.kcProjectModalActionsP109E2A {
  display: flex;
  justify-content: flex-end;
  gap: 9px;
  flex-wrap: wrap;
}

.kcProjectDetailTabsP109E2A {
  display: flex;
  flex-wrap: nowrap;
  gap: 7px;
  overflow-x: auto;
  padding-bottom: 8px;
  margin-bottom: 14px;
}

.kcProjectDetailTabsP109E2A button {
  flex: 0 0 auto;
  border: 1px solid #d1dbe8;
  border-radius: 11px;
  padding: 8px 11px;
  background: #eef3f8;
  color: #475569;
  cursor: pointer;
  font-weight: 820;
}

.kcProjectDetailTabsP109E2A button.active {
  border-color: #7ea8dc;
  background: #fff;
  color: #1f5fa8;
}

.kcProjectDetailPanelP109E2A {
  min-width: 0;
}

.kcProjectOverviewGridP109E2A {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.kcProjectFactP109E2A {
  border: 1px solid #d6e0eb;
  border-radius: 13px;
  padding: 11px 12px;
  background: #fff;
  display: grid;
  gap: 4px;
}

.kcProjectFactP109E2A small {
  color: #64748b;
}

.kcProjectDescriptionP109E2A {
  margin-top: 14px;
  border: 1px solid #d6e0eb;
  border-radius: 13px;
  padding: 13px;
  background: #fff;
}

.kcProjectDescriptionP109E2A p {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.kcProjectGenericRowP109E2A {
  border: 1px solid #d6e0eb;
  border-radius: 12px;
  padding: 10px 12px;
  background: #fff;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 5px 10px;
}

.kcProjectGenericRowP109E2A b,
.kcProjectGenericRowP109E2A small {
  overflow-wrap: anywhere;
}

.kcProjectGenericRowP109E2A span {
  color: #64748b;
}

.kcProjectGenericRowP109E2A small {
  grid-column: 1 / -1;
  color: #64748b;
}

.kcProjectDetailSectionHeadP109E2A.top-gap {
  margin-top: 18px;
}

.kcProjectToastP109E2A {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 16000;
  display: none;
  max-width: min(460px, calc(100vw - 28px));
  border: 1px solid #95d6b9;
  border-radius: 13px;
  padding: 11px 14px;
  background: #edf9f3;
  color: #146a47;
  box-shadow: 0 15px 45px rgba(15, 23, 42, .20);
  font-weight: 800;
}

.kcProjectToastP109E2A.is-open {
  display: block;
}

.kcProjectToastP109E2A.is-error {
  border-color: #e0a0a0;
  background: #fff0f0;
  color: #9d2929;
}

@media (max-width: 1180px) {
  #mod-tasks .kcWorkKpisP109E2A {
    grid-template-columns: repeat(2, minmax(140px, 1fr));
  }

  #mod-tasks .kcProjectListP109E2A {
    grid-template-columns: repeat(2, minmax(260px, 1fr));
  }

  .kcProjectOverviewGridP109E2A {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  #mod-tasks .kcWorkOverviewGridP109E2A,
  #mod-tasks .kcCompletedGridP109E2A {
    grid-template-columns: 1fr;
  }

  #mod-tasks .kcProjectFiltersP109E2A {
    grid-template-columns: 1fr;
  }

  #mod-tasks .kcProjectListP109E2A {
    grid-template-columns: 1fr;
  }

  #mod-tasks .kcProjectMetaGridP109E2A {
    grid-template-columns: 1fr 1fr;
  }

  .kcProjectFormP109E2A,
  .kcProjectOverviewGridP109E2A {
    grid-template-columns: 1fr;
  }

  .kcProjectFormP109E2A .span2 {
    grid-column: auto;
  }
}

@media (max-width: 600px) {
  #mod-tasks .kcWorkKpisP109E2A {
    grid-template-columns: 1fr;
  }

  #mod-tasks .kcWorkCompactRowP109E2A {
    align-items: flex-start;
    flex-direction: column;
  }

  #mod-tasks .kcCalendarRowP109E2A {
    grid-template-columns: 1fr;
  }

  #mod-tasks .kcProjectMetaGridP109E2A {
    grid-template-columns: 1fr;
  }

  .kcProjectModalP109E2A {
    padding: 5px;
  }

  .kcProjectModalBoxP109E2A {
    width: calc(100vw - 10px);
    max-height: calc(100dvh - 10px);
    border-radius: 14px;
    padding: 14px;
  }

  .kcProjectModalHeadP109E2A {
    top: -14px;
    margin: -14px -14px 13px;
    padding: 14px;
  }
}
