Что такое :focus-within?

Question

Accepted Answer

## Поведение

`:focus-within` стилизует элемент, если **он сам или потомок** имеет фокус. Удобно для подсветки целой карточки/поля при фокусе в input.

```css
.field:focus-within {
  border-color: var(--focus);
  box-shadow: 0 0 0 3px rgb(0 100 255 / 0.25);
}
.menu:focus-within .submenu { display: block; } /* осторожно с a11y */
```

Не заменяет `:focus-visible` на самом контроле. Для меню учитывайте клавиатуру и Escape — чистый CSS-only dropdown часто неполон.

## Итог

`:focus-within` — стили родителя при фокусе внутри; идеален для group-полей и карточек.