.disabled
  color: var(--gray-400)

// icons style on daemon tabs (when active and not)
.icon-not-monitored
  color: var(--gray-400)

:host ::ng-deep .p-tabview-selected .icon-not-monitored
  color: var(--gray-200)

.icon-not-active
  color: var(--red-500)

:host ::ng-deep .p-tabview-selected .icon-not-active
  color: var(--red-300)

.icon-ok
  color: var(--green-500)

:host ::ng-deep .p-tabview-selected .icon-ok
  color: var(--green-300)

// remove padding from daemon tabs panels so grey bar sticks to borders
:host ::ng-deep .daemon-tabs.p-tabview .p-tabview-panels
  padding-left: 0
  padding-right: 0

@keyframes p-progress-spinner-color
  0%
    stroke: var(--gray-400)
  100%
    stroke: var(--gray-400)

:host ::ng-deep .app-rename-spinner
  margin-left: 15px

// Custom style for divs displaying hook names.
// It adds clickable UX (pointer cursor and hover effect).
.hook-name
  cursor: pointer
  &:hover
    background: var(--surface-hover)

// Overwrite default display: inline-block; rule to center-align the switch vertically.
:host ::ng-deep .p-inputswitch
  display: block
