/* Seiten-Anordnung Aufgaben: nur Layout, Komponenten kommen aus app.css. */
.task-li .meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s1) var(--s3); margin-top: var(--s1); color: var(--text-2); font-size: var(--fs-ui); }
.task-li .meta .il .ic { font-size: 14px; color: var(--text-3); }
.task-li .right { display: flex; flex-direction: column; align-items: flex-end; gap: var(--s2); }
.due-late, .due-late .ic { color: var(--bad) !important; }
.prog { display: inline-flex; align-items: center; gap: var(--s2); font-size: var(--fs-sm); color: var(--text-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.prog .bar-in { width: 64px; height: 4px; border-radius: 2px; background: var(--surface-3); overflow: hidden; }
.prog .bar-in i { display: block; height: 100%; background: var(--ok); border-radius: 2px; }
.ck-list { display: flex; flex-direction: column; }
.ck-list .cb { padding: var(--s3) 0; border-top: 1px solid var(--line); width: 100%; }
.ck-list .cb:first-child { border-top: 0; }
.ck-list .cb input:checked ~ .txt .lt { color: var(--text-3); text-decoration: line-through; text-decoration-color: var(--line-2); }
.task-desc { white-space: pre-wrap; margin: var(--s4) 0 0; }
.item-rows { display: flex; flex-direction: column; gap: var(--s2); }
.item-edit { display: flex; align-items: center; gap: var(--s2); }
.item-edit .input { flex: 1 1 auto; min-width: 0; }
@media (max-width: 520px) { .task-li .right .prog { display: none; } }
@media (max-width: 767px) {
  .page-aufgaben .bar .seg { flex: 1 1 auto; }
  .page-aufgaben .bar .seg button { flex: 1; justify-content: center; }
}