/* Раздел «Задачи»: список, строка задачи (используется и на «Главной», и в проекте), карточка, форма. */

/* Панель над списком: вкладки + фильтр по проекту */
.toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  margin-bottom: 1.1rem;
}
.toolbar .tabs { margin: 0; }

.tasks-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
}
.tasks-filter-label { margin: 0; color: var(--muted); font-weight: 600; }
.tasks-filter select { width: auto; flex: 1 1 12rem; max-width: 20rem; }
@media (max-width: 559px) {
  .tasks-filter { width: 100%; }
  .tasks-filter-label { flex-basis: 100%; }
}

/* Список */
.task-list {
  list-style: none;
  margin: 0;
  padding: 0;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  overflow: hidden;
}
/* Внутри карточки — без второй рамки */
.card .task-list { border: 0; box-shadow: none; border-radius: 0; margin: 0 -0.5rem; background: transparent; }

.task-row {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  padding: 0.8rem 1rem;
  border-bottom: 1px solid var(--border);
  min-width: 0;
  position: relative;
  transition: background-color 0.12s;
}
.card .task-row { padding: 0.75rem 0.5rem 0.75rem 0.75rem; }
.task-row:last-child { border-bottom: 0; }
.task-row:hover { background: var(--surface-2); }
.task-row.is-overdue { box-shadow: inset 3px 0 0 var(--state-overdue); }
.task-row.is-done .task-title { color: var(--muted); text-decoration: line-through; }

.task-check { margin: 0; flex: 0 0 auto; padding-top: 0.05rem; }
.task-check-btn {
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 50%;
  border: 2px solid var(--border-strong);
  background: var(--surface);
  color: transparent;
  font-weight: 700;
  font-size: 0.85rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: border-color 0.12s, background-color 0.12s, color 0.12s;
}
.task-check-btn:hover,
.task-check-btn:focus-visible { border-color: var(--state-done); color: var(--state-done); background: #effaf3; outline: none; }
.task-check-btn:disabled { opacity: 0.5; }

.task-main { flex: 1 1 auto; min-width: 0; }
.task-title {
  display: block;
  color: var(--text);
  font-weight: 600;
  text-decoration: none;
  line-height: 1.35;
}
.task-title:hover { color: var(--accent); text-decoration: none; }

.task-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.3rem 0.55rem;
  margin-top: 0.3rem;
  font-size: 0.84rem;
}
.task-meta-lg { margin: 0.55rem 0 0; font-size: 0.9rem; }
.task-due { color: #43536a; font-variant-numeric: tabular-nums; }
.is-overdue .task-due { color: var(--state-overdue); font-weight: 600; }
.task-repeat { color: var(--muted); }
.task-project {
  color: #43536a;
  text-decoration: none;
  background: #edf1f6;
  border-radius: 6px;
  padding: 0.05rem 0.45rem;
  font-size: 0.8rem;
}
.task-project:hover { background: var(--accent-soft); color: var(--accent); text-decoration: none; }

.list-more { margin: 0.75rem 0 0; }

/* Страница задачи */
.task-layout { display: grid; grid-template-columns: 1fr; gap: 0 1.25rem; align-items: start; }
@media (min-width: 1000px) {
  .task-layout { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }
}
.task-facts {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.1rem 1.25rem;
  margin: 0 0 1rem;
}
.task-facts dt { color: var(--muted); font-size: 0.85rem; }
.task-facts dd { margin: 0 0 0.5rem; font-weight: 500; }
@media (min-width: 560px) {
  .task-facts { grid-template-columns: max-content 1fr; }
  .task-facts dt { font-size: 0.92rem; padding: 0.15rem 0; }
  .task-facts dd { padding: 0.15rem 0; }
}
.task-notes {
  white-space: pre-wrap;
  margin: 0 0 1.1rem;
  padding: 0.8rem 1rem;
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}
.task-page .actions form { margin: 0; }
.task-card > .actions { padding-top: 1rem; border-top: 1px solid var(--border); }

/* Форма: показываем только поля выбранного вида повтора (без JS, через :has) */
.task-form fieldset { border: 0; margin: 0 0 1rem; padding: 0; min-width: 0; }
.task-form legend { font-weight: 600; font-size: 0.9rem; margin-bottom: 0.35rem; padding: 0; color: #2c3a4d; }
.weekday-picks { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.weekday-pick {
  margin: 0;
  padding: 0.35rem 0.7rem;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  background: var(--surface);
  cursor: pointer;
}
.weekday-pick:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); color: #1a68bd; font-weight: 600; }
.rf-repeat {
  padding: 1rem 1rem 0.1rem;
  margin-bottom: 1rem;
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}
.rf-hint { margin-bottom: 0.9rem; }

@supports selector(:has(*)) {
  .task-form .rf { display: none; }
  .task-form:has(#repeat option[value=""]:checked) .rf-once { display: block; }
  .task-form:not(:has(#repeat option[value=""]:checked)) .rf-repeat { display: block; }
  .task-form:has(#repeat option[value="weekly"]:checked) .rf-weekly { display: block; }
  .task-form:has(#repeat option[value="monthly"]:checked) .rf-monthly { display: block; }
  .task-form:has(#repeat option[value="yearly"]:checked) .rf-yearly { display: grid; }
  .task-form:has(#repeat option[value="interval"]:checked) .rf-interval { display: grid; }
  .task-form:has(#repeat option[value="monthly"]:checked) .rf-early,
  .task-form:has(#repeat option[value="yearly"]:checked) .rf-early,
  .task-form:has(#repeat option[value="interval"]:checked) .rf-early { display: block; }
}

.task-repeat { display: inline-flex; align-items: center; gap: 0.25rem; }
.task-repeat .icon, .badge-repeat .icon { width: 14px; height: 14px; }
.badge-repeat { background: #e0f4f6; color: #0f6f86; }