diff --git a/static/css/style.css b/static/css/style.css index c4b45f4..d547642 100644 --- a/static/css/style.css +++ b/static/css/style.css @@ -65,6 +65,35 @@ body { background-color: var(--color-background); } +/* Focus indicators for accessibility */ +a:focus, +button:focus, +input:focus, +.btn:focus, +.btn-nav:focus, +.btn-icon-nav:focus { + outline: 3px solid var(--color-primary); + outline-offset: 2px; +} + +/* Focus visible for modern browsers (shows focus only on keyboard navigation) */ +a:focus-visible, +button:focus-visible, +input:focus-visible, +.btn:focus-visible, +.btn-nav:focus-visible, +.btn-icon-nav:focus-visible { + outline: 3px solid var(--color-primary); + outline-offset: 2px; +} + +/* Ensure disabled buttons don't show interactive focus */ +.btn-disabled:focus, +.btn-icon-disabled:focus { + outline: 2px solid var(--color-disabled); + outline-offset: 2px; +} + .container { max-width: var(--container-max-width); margin: 0 auto;