diff --git a/panel/modals/RolesModal.tsx b/panel/modals/RolesModal.tsx
index fd8351e8..db9c9434 100644
--- a/panel/modals/RolesModal.tsx
+++ b/panel/modals/RolesModal.tsx
@@ -288,37 +288,8 @@ const UserEditModal: Component<UserEditModalProps> = (props) => {
                       background: isAdminRole && isSelected ? 'rgba(245, 158, 11, 0.1)' : undefined,
                       border: isAdminRole && isSelected ? '1px solid rgba(245, 158, 11, 0.3)' : undefined
                     }}
-                    onClick={() => !isDisabled && handleRoleToggle(role.id)} // Добавляем обработчик клика
+                    onClick={() => !isDisabled && handleRoleToggle(role.id)}
                   >
-                    <div
-                      style={{
-                        width: '20px',
-                        height: '20px',
-                        'border-radius': '50%',
-                        border: `2px solid ${isSelected ? '#3b82f6' : '#a1a1aa'}`,
-                        'background-color': isSelected ? '#3b82f6' : 'transparent',
-                        display: 'flex',
-                        'align-items': 'center',
-                        'justify-content': 'center',
-                        cursor: isDisabled ? 'not-allowed' : 'pointer'
-                      }}
-                    >
-                      <Show when={isSelected}>
-                        <svg
-                          xmlns="http://www.w3.org/2000/svg"
-                          width="12"
-                          height="12"
-                          viewBox="0 0 24 24"
-                          fill="none"
-                          stroke="white"
-                          stroke-width="3"
-                          stroke-linecap="round"
-                          stroke-linejoin="round"
-                        >
-                          <polyline points="20 6 9 17 4 12"></polyline>
-                        </svg>
-                      </Show>
-                    </div>
                     <div class={formStyles.roleHeader}>
                       <span class={formStyles.roleName}>
                         <span style={{ 'margin-right': '0.5rem', 'font-size': '1.1rem' }}>
@@ -350,9 +321,8 @@ const UserEditModal: Component<UserEditModalProps> = (props) => {
                           'justify-content': 'center',
                           cursor: isDisabled ? 'not-allowed' : 'pointer'
                         }}
-                        onClick={() => !isDisabled && handleRoleToggle(role.id)}
                       >
-                        {isSelected && (
+                        <Show when={isSelected}>
                           <svg
                             xmlns="http://www.w3.org/2000/svg"
                             width="12"
@@ -366,7 +336,7 @@ const UserEditModal: Component<UserEditModalProps> = (props) => {
                           >
                             <polyline points="20 6 9 17 4 12"></polyline>
                           </svg>
-                        )}
+                        </Show>
                       </div>
                     </div>
                     <div class={formStyles.roleDescription}>{role.description}</div>