Use feather icons in sidebar header

app/components/icon.gjs

@@ -10,6 +10,8 @@ import navigation from 'feather-icons/dist/icons/navigation.svg?raw';
 import phone from 'feather-icons/dist/icons/phone.svg?raw';
 import user from 'feather-icons/dist/icons/user.svg?raw';
 import settings from 'feather-icons/dist/icons/settings.svg?raw';
+import arrowLeft from 'feather-icons/dist/icons/arrow-left.svg?raw';
+import x from 'feather-icons/dist/icons/x.svg?raw';
 
 const ICONS = {
   clock,
@@ -20,7 +22,9 @@ const ICONS = {
   navigation,
   phone,
   user,
-  settings
+  settings,
+  'arrow-left': arrowLeft,
+  x
 };
 
 export default class IconComponent extends Component {

app/components/places-sidebar.gjs

@@ -5,6 +5,7 @@ import { on } from '@ember/modifier';
 import { fn } from '@ember/helper';
 import or from 'ember-truth-helpers/helpers/or';
 import PlaceDetails from './place-details';
+import Icon from './icon';
 
 export default class PlacesSidebar extends Component {
   @service storage;
@@ -123,7 +124,7 @@ export default class PlacesSidebar extends Component {
             type="button"
             class="back-btn"
             {{on "click" this.clearSelection}}
-          >←</button>
+          ><Icon @name="arrow-left" @size={{20}} @color="#333" /></button>
         {{else}}
           <h2>Nearby Places</h2>
         {{/if}}
@@ -131,7 +132,7 @@ export default class PlacesSidebar extends Component {
           type="button"
           class="close-btn"
           {{on "click" @onClose}}
-        >×</button>
+        ><Icon @name="x" @size={{20}} @color="#333" /></button>
       </div>
 
       <div class="sidebar-content">

app/styles/app.css

@@ -62,20 +62,26 @@ body {
   padding: 1rem;
 }
 
-.close-btn {
-  background: none;
-  border: none;
-  font-size: 1.5rem;
-  cursor: pointer;
-  padding: 0 0.5rem;
-}
-
 .back-btn {
   background: none;
   border: none;
-  font-size: 1.2rem;
   cursor: pointer;
-  margin-right: 0.5rem;
+  padding: 0 0.5rem;
+  margin-left: -0.5rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.close-btn {
+  background: none;
+  border: none;
+  cursor: pointer;
+  padding: 0 0.5rem;
+  margin-right: -0.5rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 
 .place-details {