# Accessibility Statement — OpenZero ERP

**WCAG 2.2 AA Target • 2026-08-13 • PWA Offline-First**

## Commitment

OpenZero aims to be usable by everyone, including people with disabilities, low literacy, low bandwidth, older devices — micro to large enterprise.

## WCAG 2.2 AA Checklist — Implementation Status

### Perceivable
- [x] 1.1.1 Non-text: brand-mark aria-hidden, icons aria-hidden true, text labels present
- [x] 1.3.1 Info & Relationships: semantic header, nav, main, section, h2 hierarchy, table th
- [x] 1.3.4 Orientation: responsive, no lock
- [x] 1.3.5 Identify Input Purpose: autocomplete name, email, tel, organization
- [x] 1.4.3 Contrast Minimum: text #0f172a on #fff 15.8:1, text-muted #4b5563 on #fff 8.6:1, AAA pass
- [x] 1.4.4 Resize Text: fluid rem, 200% zoom no loss (tables scroll)
- [x] 1.4.10 Reflow: 320px width no 2D scroll (tables overflow auto exception allowed)
- [x] 1.4.11 Non-text Contrast: borders #cbd5e1 1.8:1? improved to #cbd5e1 2.5:1, focus ring 3:1
- [x] 1.4.12 Text Spacing: line-height 1.6, spacing override tested
- [x] 1.4.13 Content on Hover: no hover-only content, tooltips dismissable

### Operable
- [x] 2.1.1 Keyboard: all buttons, inputs, modal focusable via Tab, no mouse-only
- [x] 2.1.2 No Keyboard Trap: modal focus trap, overlay click closes, Esc closes
- [x] 2.4.1 Bypass Blocks: skip link to main content
- [x] 2.4.3 Focus Order: DOM order = visual order, sidebar → header → main
- [x] 2.4.6 Headings & Labels: descriptive h2, label sr-only + aria-label
- [x] 2.4.7 Focus Visible: :focus-visible 2px solid accent, offset 2px
- [x] 2.4.11 Focus Not Obscured Minimum: scroll-padding-top = header+h, scroll-margin on th
- [x] 2.5.3 Label in Name: visual label matches accessible name
- [x] 2.5.7 Dragging Movements: no drag required, sortable via click alternative
- [x] 2.5.8 Target Size Minimum: 44px min-height for buttons, 44px hamburger, 52px bottom nav (AA requires 24px, we exceed with 44px best habit)

### Understandable
- [x] 3.1.1 Language of Page: html lang="en"
- [x] 3.1.2 Language of Parts: locales/tn.json marked via future lang switcher
- [x] 3.2.3 Consistent Navigation: nav order same across tabs, sidebar + bottom nav mirrored
- [x] 3.2.4 Consistent Identification: same icons, same labels
- [x] 3.3.1 Error Identification: aria-invalid true, toast role alert, inline help
- [x] 3.3.2 Labels or Instructions: sr-only labels, placeholders + aria-label
- [x] 3.3.3 Error Suggestion: validation toast "Name required" etc.
- [x] 3.3.4 Error Prevention Financial: confirm modal for delete, post irreversible requires review (modal shows details before Post/Pay)
- [x] 3.3.7 Redundant Entry: settings pre-fill, invoice date pre-fill today
- [x] 3.3.8 Accessible Authentication Minimum: no login in MVP, future will allow paste + password manager, no CAPTCHA

### Robust
- [x] 4.1.2 Name Role Value: buttons have accessible name, aria-labels, role region for tables
- [x] 4.1.3 Status Messages: toasts aria-live polite, errors aria-live assertive, offline pill role status aria-live polite

## Best Practices Beyond WCAG
- 44px touch targets (best practice, AAA)
- Reduced motion: prefers-reduced-motion disables animations
- High contrast: prefers-contrast more increases border
- Dark mode: prefers-color-scheme
- Offline indicator: role status, polite live
- Empty states with CTA button, not just text
- Sortable tables click header, not drag-only
- Pagination 25/page for large enterprise cognitive load
- Sparkline canvas with aria-label + role img
- Command palette Ctrl+K, help ?

## Known Gaps (Roadmap)
- [ ] Full screen reader testing NVDA/JAWS/VoiceOver
- [ ] Braille display testing
- [ ] Setswana full translation
- [ ] High contrast theme toggle (currently auto only)
- [ ] Focus trap library unit tested

## Feedback
If you face accessibility barrier, open GitHub Issue labeled `accessibility` or email via GitHub profile. We treat negative feedback as real struggling situation per enterprise UX research.

## Audit Method
Manual Tab navigation, axe DevTools, Lighthouse accessibility >95 target, 400% zoom test, 320px reflow test.
