diff --git a/projects/aca-content/src/lib/components/details/details.component.scss b/projects/aca-content/src/lib/components/details/details.component.scss
index 873bfb1bc3..778bead773 100644
--- a/projects/aca-content/src/lib/components/details/details.component.scss
+++ b/projects/aca-content/src/lib/components/details/details.component.scss
@@ -5,6 +5,12 @@ app-details-manager {
outline: none;
border-radius: 4px;
+ &:focus {
+ background-color: var(--theme-selected-background-color);
+ outline: 2px solid var(--theme-blue-button-color);
+ border-radius: 4px;
+ }
+
&:focus-visible {
outline: 2px solid var(--theme-blue-button-color);
border-radius: 4px;
diff --git a/projects/aca-content/src/lib/components/toolbar/toggle-info-drawer/toggle-info-drawer.component.ts b/projects/aca-content/src/lib/components/toolbar/toggle-info-drawer/toggle-info-drawer.component.ts
index 5d3d51f2eb..d9dae1918c 100644
--- a/projects/aca-content/src/lib/components/toolbar/toggle-info-drawer/toggle-info-drawer.component.ts
+++ b/projects/aca-content/src/lib/components/toolbar/toggle-info-drawer/toggle-info-drawer.component.ts
@@ -44,9 +44,19 @@ import { MatIconModule } from '@angular/material/icon';
[attr.title]="'APP.ACTIONS.DETAILS' | translate"
(click)="onClick()"
>
- menu_open
+ view_sidebar
`,
+ styles: [
+ `
+ .app-toggle-info-drawer button:focus {
+ border: 2px solid var(--theme-blue-button-color);
+ border-radius: 6px;
+ outline: none;
+ background-color: var(--theme-selected-background-color);
+ }
+ `
+ ],
encapsulation: ViewEncapsulation.None,
host: { class: 'app-toggle-info-drawer' }
})