21:T5a0,## `group-*` Стилі дочірнього елемента від стану **батьківського** з класом `group`. ```html

Card title

Card description

``` Hover на всій картці - змінюється текст усередині. --- ## `peer-*` Стилі залежать від стану **сусіднього** елемента з класом `peer`. `peer` має йти **перед** тим, що стилізуєш. ```html ``` Валідація: ```html ``` --- ## `has-*` Стилі батька, якщо всередині є дочірній елемент або стан. ```html Pro plan ``` ```html

``` Зручно для radio cards, custom checkbox UI, форм. 22:T5a0,## `group-*` Стилі дочірнього елемента від стану **батьківського** з класом `group`. ```html

Card title

Card description

``` Зручно для radio cards, custom checkbox UI, форм. 23:T448,## `data-*` ```html ``` ```html

Content

``` Часто з Radix UI, shadcn/ui, Headless UI. --- ## `aria-*` ```html ``` Tabs, accordions, dropdowns, toggle buttons. --- ## `dark:` ```html

Dark mode content

``` --- ## Комбінування variants ```html ``` Порядок: responsive → dark → state → utility. 24:T448,## `data-*` ```html

State Variants

State Variants