@layer components {
  .route-page .toolbar,
  .route-page .compact-toolbar,
  .route-page .dashboard-toolbar,
  .route-page .product-center-toolbar,
  #modal .toolbar,
  #modal .compact-toolbar,
  #modal .dashboard-toolbar,
  #modal .product-center-toolbar {
    min-height: var(--toolbar-height);
    display: flex;
    align-items: center;
    gap: 8px;
    row-gap: 8px;
    flex-wrap: wrap;
  }
}