src/renderer/src/components/App/Controls/DeviceSelector/DeviceSelectorItem/DeviceSelectorItem.css
@layer components {
  .device-selector-item-icon-container {
    @apply h-8 w-8 bg-white rounded-full flex items-center justify-center mr-3 flex-shrink-0;
  }
  .device-selector-item {
    @apply h-14 flex w-full items-center p-1.5 border-b;
    border-color: #242424;
  }

  .app-controls-overlay.overlay-open
    > #device-panel
    > .device-selector-item:hover {
    background-color: #242424;
  }

  .device-selector-item.selected-device,
  .device-selector-item:hover {
    @apply cursor-pointer;
  }

  .device-selector-item-details-container {
    @apply w-full;
  }

  .item-details-name {
    @apply text-white text-sm font-semibold truncate w-full;
  }

  .item-details-info {
    @apply text-white text-xs;
  }

  .device-selector-menu-btn-container {
    @apply h-5 w-10 flex items-center justify-center text-sm;
    color: #424242;
  }

  .device-selector-menu-btn-container:hover {
    color: #3e3e3e;
  }

  .device-selector-menu-btn {
    @apply h-full w-full;
  }

  .device-selector-menu-btn:hover {
    @apply text-white;
  }

  .device-selector-menu {
    @apply relative;
  }

  .device-selector-menu-items-dropdown-container {
    @apply absolute top-4 w-48 rounded border shadow;
    background-color: #121212;
    border-color: #242424;
  }

  .device-select-menu-dropdown-item {
    @apply text-xs text-white text-center w-full px-2 py-1;
  }

  .device-select-menu-dropdown-item:hover {
    background-color: #242424;
  }
}
