/* 버전 2 — 4b단계: 개강 일정 보드(#view-tasks) 신규 LMS 모양.
   /v2/ 에서만 불러온다. 모든 규칙은 html[data-ui="v2"] #view-tasks 아래.
   긴급/주의/정상/완료 행 색(.course-row.row-*의 왼쪽 막대·바탕)과 폴더 머리글 상태 색(.f-active 등)은
   의미 색이라 그대로 두고, 모양(둥글기·여백·입력칸·칩)만 바꾼다.
   설계: docs/superpowers/specs/2026-10-13-lms-ux-reskin-design.md */

/* ── 툴바: 검색 + 정렬 + 시트 열기 ───────────────────────────────────────── */
html[data-ui="v2"] #view-tasks .search-bar input,
html[data-ui="v2"] #view-tasks .board-sort select {
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid var(--ds-input);
  border-radius: var(--ds-radius-lg);
  background-color: var(--ds-card);
  color: var(--ds-foreground);
  font-size: 14px;
}
html[data-ui="v2"] #view-tasks .search-bar input {
  padding-left: 38px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 12px center;
}
html[data-ui="v2"] #view-tasks .search-bar input:focus,
html[data-ui="v2"] #view-tasks .board-sort select:focus {
  outline: none;
  border-color: var(--ds-ring);
  box-shadow: 0 0 0 3px var(--ds-primary-soft);
}
html[data-ui="v2"] #view-tasks .board-sort { color: var(--ds-muted-foreground); font-weight: 600; }
html[data-ui="v2"] #view-tasks .tasks-sheet-link {
  display: inline-flex;
  align-items: center;
  box-sizing: border-box;
  height: 40px;
  padding: 0 14px;
  border: 1px solid var(--ds-border);
  border-radius: var(--ds-radius-lg);
  background: var(--ds-card);
  color: var(--ds-card-foreground);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}

/* ── 요약 타일(board-insight) — 카드 + 큰 숫자, 긴급은 의미 색 숫자 유지 ───────── */
html[data-ui="v2"] #view-tasks .board-insight {
  min-height: 60px;
  padding: 12px 16px;
  border-color: var(--ds-border);
  border-radius: var(--ds-radius-xl);
  background: var(--ds-card);
  box-shadow: var(--ds-shadow-card);
}
html[data-ui="v2"] #view-tasks .board-insight:hover { box-shadow: var(--ds-shadow-card-hover); }
html[data-ui="v2"] #view-tasks .board-insight span { color: var(--ds-muted-foreground); font-weight: 600; }
html[data-ui="v2"] #view-tasks .board-insight strong { font-size: 22px; font-weight: 700; }
html[data-ui="v2"] #view-tasks .board-insight.active {
  border-color: var(--ds-primary);
  background: var(--ds-primary-soft);
  box-shadow: 0 0 0 3px var(--ds-primary-soft);
}

/* ── 빠른 필터 = 칩 필터(높이 36 · 둥글기 16, 고른 것은 로즈) ─────────────────── */
html[data-ui="v2"] #view-tasks .board-filter {
  min-height: 36px;
  padding: 0 14px;
  border-color: var(--ds-border);
  border-radius: var(--ds-radius-xl);
  background: var(--ds-card);
  color: var(--ds-card-foreground);
  font-size: 14px;
  font-weight: 600;
}
html[data-ui="v2"] #view-tasks .board-filter:hover { background: var(--ds-muted); border-color: var(--ds-border); }
html[data-ui="v2"] #view-tasks .board-filter strong {
  background: var(--ds-muted);
  color: var(--ds-muted-foreground);
}
html[data-ui="v2"] #view-tasks .board-filter.active {
  border-color: var(--ds-primary);
  background: var(--ds-primary);
  color: var(--ds-primary-foreground);
}
html[data-ui="v2"] #view-tasks .board-filter.active strong {
  background: rgba(255, 255, 255, 0.25);
  color: var(--ds-primary-foreground);
}

/* ── 폴더(진행 중/종료/완료 묶음)와 과정 행 ──────────────────────────────── */
html[data-ui="v2"] #view-tasks .folder {
  border-color: var(--ds-border);
  border-radius: var(--ds-radius-xl);
  background: var(--ds-card);
  box-shadow: var(--ds-shadow-card);
}
html[data-ui="v2"] #view-tasks .group-header { border-bottom-color: var(--ds-border); color: var(--ds-foreground); }
html[data-ui="v2"] #view-tasks .course-row { border-radius: var(--ds-radius-lg); }
html[data-ui="v2"] #view-tasks .undo-toast {
  border-radius: var(--ds-radius-xl);
}