diff --git a/web/src/components/RolePicker.vue b/web/src/components/RolePicker.vue
index 507f50c..d5a0bba 100644
--- a/web/src/components/RolePicker.vue
+++ b/web/src/components/RolePicker.vue
@@ -52,7 +52,7 @@ const items = computed(() =>
 		color="primary"
 		:aria-label="label"
 		:ui="{
-			item: 'rounded-none has-data-[state=checked]:border-primary has-data-[state=checked]:bg-(--rc-sand) has-data-[state=checked]:text-(--rc-on-sand)',
+			item: 'rounded-none has-data-[state=checked]:border-primary has-data-[state=checked]:bg-(--rc-sand) has-data-[state=checked]:text-(--rc-on-sand) has-data-[state=checked]:**:text-(--rc-on-sand)',
 			fieldset: 'gap-2',
 			description: 'text-xs',
 		}"