feat: add enable/disable toggle for chore scheduling in ScheduleModal

- Introduced a toggle button to enable or disable chores in the scheduler.
- The toggle will be available in both types of schedulers.
- Added UI design proposal and considerations for mobile dimensions.
- Included E2E tests to ensure toggle state persistence and correct behavior in child view.

frontend/vue-app/e2e/mode_parent/chore-scheduler/parent-vs-child.spec.ts

@@ -0,0 +1,130 @@
+// spec: e2e/plans/chore-scheduler.plan.md — Section 7: Parent vs Child Mode Comparison
+
+import { test, expect } from '@playwright/test'
+import {
+  createChild,
+  createChoreTask,
+  assignChore,
+  deleteSchedule,
+  setDaysSchedule,
+  choreCard,
+  choreSection,
+  todayDayIndex,
+  nonTodayDayIndex,
+  goToChildView,
+} from './helpers'
+
+const CHILD_NAME = 'CompareChild'
+const VISIBLE_BOTH = 'VisibleBothChore'
+const PARENT_ONLY = 'ParentOnlyChore'
+
+test.describe('Parent vs Child Mode Comparison', () => {
+  test.describe.configure({ mode: 'serial' })
+
+  let childId = ''
+  let visibleBothId = ''
+  let parentOnlyId = ''
+
+  test.beforeAll(async ({ request }) => {
+    childId = await createChild(request, CHILD_NAME)
+    visibleBothId = await createChoreTask(request, VISIBLE_BOTH)
+    parentOnlyId = await createChoreTask(request, PARENT_ONLY)
+
+    await assignChore(request, childId, [visibleBothId, parentOnlyId])
+
+    const today = todayDayIndex()
+    const nonToday = nonTodayDayIndex()
+
+    // VisibleBothChore: scheduled for today (visible everywhere)
+    await setDaysSchedule(request, childId, visibleBothId, [today], { hour: 23, minute: 59 })
+
+    // ParentOnlyChore: scheduled for a non-today day (grayed/hidden)
+    await setDaysSchedule(request, childId, parentOnlyId, [nonToday], { hour: 8, minute: 0 })
+  })
+
+  test.afterAll(async ({ request }) => {
+    if (childId) await request.delete(`/api/child/${childId}`)
+    if (visibleBothId) await request.delete(`/api/task/${visibleBothId}`)
+    if (parentOnlyId) await request.delete(`/api/task/${parentOnlyId}`)
+  })
+
+  test('7.1 Parent mode shows all chores including off-day ones', async ({ page }) => {
+    await page.goto(`/parent/${childId}`)
+
+    const visibleCard = choreCard(page, VISIBLE_BOTH)
+    const parentOnlyCard = choreCard(page, PARENT_ONLY)
+
+    await visibleCard.waitFor()
+    await parentOnlyCard.waitFor()
+
+    // Both visible in parent mode
+    await expect(visibleCard).toBeVisible()
+    await expect(parentOnlyCard).toBeVisible()
+
+    // parentOnly is grayed out (off-day), visible is not
+    await expect(parentOnlyCard).toHaveClass(/chore-inactive/)
+    await expect(visibleCard).not.toHaveClass(/chore-inactive/)
+  })
+
+  test('7.2 Child mode hides off-day chores', async ({ page }) => {
+    await goToChildView(page, childId)
+
+    const visibleCard = choreCard(page, VISIBLE_BOTH)
+    await expect(visibleCard).toBeVisible()
+
+    // Off-day chore is hidden entirely
+    await expect(
+      choreSection(page).locator('.item-card').filter({ hasText: PARENT_ONLY }),
+    ).toHaveCount(0)
+  })
+
+  test('7.3 Adding a schedule via parent mode hides chore in child mode on wrong day', async ({
+    page,
+    request,
+  }) => {
+    const nonToday = nonTodayDayIndex()
+
+    // Remove today's schedule from VisibleBothChore and set it to non-today
+    await setDaysSchedule(request, childId, visibleBothId, [nonToday], { hour: 8, minute: 0 })
+
+    await goToChildView(page, childId)
+
+    // VisibleBothChore is now off-day — should be hidden in child mode
+    await expect(
+      choreSection(page).locator('.item-card').filter({ hasText: VISIBLE_BOTH }),
+    ).toHaveCount(0)
+  })
+
+  test('7.4 Removing a schedule via parent mode shows chore in child mode again', async ({
+    page,
+    request,
+  }) => {
+    // Delete the schedule via API (acts as if saved with no days)
+    await deleteSchedule(request, childId, visibleBothId)
+
+    await goToChildView(page, childId)
+
+    // No schedule = always visible in child mode
+    const card = choreCard(page, VISIBLE_BOTH)
+    await expect(card).toBeVisible()
+  })
+
+  test('7.5 Paused schedule — chore visible in both modes', async ({ page, request }) => {
+    // Re-add a non-today schedule, but paused (enabled=false)
+    await setDaysSchedule(request, childId, parentOnlyId, [nonTodayDayIndex()], {
+      enabled: false,
+    })
+
+    // Parent mode: visible and NOT grayed out (paused = acts unscheduled)
+    await page.goto(`/parent/${childId}`)
+    const parentCard = choreCard(page, PARENT_ONLY)
+    await parentCard.waitFor()
+    await expect(parentCard).toBeVisible()
+    await expect(parentCard).not.toHaveClass(/chore-inactive/)
+
+    // Child mode: also visible (paused = shows every day)
+    await goToChildView(page, childId)
+    const childCard = choreCard(page, PARENT_ONLY)
+    await expect(childCard).toBeVisible()
+  })
+})