diff --git a/src/main/resources/sbu/javafx/App-view.fxml b/src/main/resources/sbu/javafx/App-view.fxml
index e5e0599..e7449d2 100644
--- a/src/main/resources/sbu/javafx/App-view.fxml
+++ b/src/main/resources/sbu/javafx/App-view.fxml
@@ -5,37 +5,46 @@
 <?import javafx.scene.control.Label?>
 <?import javafx.scene.control.Button?>
 
-<VBox xmlns:fx="http://javafx.com/fxml" alignment="TOP_LEFT" spacing="12" fx:controller="sbu.javafx.MusicController" styleClass="root-pane">
+<VBox styleClass="main-container" xmlns:fx="http://javafx.com/fxml" fx:controller="sbu.javafx.MusicController">
 
-    <HBox spacing="30" alignment="CENTER_LEFT" styleClass="header-row">
-        <Label fx:id="TrackLable" text="Track" styleClass="header-label"/>
-        <Button fx:id="PlayListButton" text="Playlist" onAction="#openPlaylistWindow" styleClass="primary-button"/>
+    <HBox styleClass="header-row" alignment="CENTER_LEFT" fx:id="header">
+        <Label text="Track" minWidth="190" prefWidth="190"/>
+        <Label text="Artist" minWidth="205" prefWidth="205"/>
+        <Label text="Duration" minWidth="120" prefWidth="120"/>
+        <Label text="Play" minWidth="90" prefWidth="90"/>
+        <Label text="Add to Playlist" minWidth="150" prefWidth="150"/>
+        <Button fx:id="themeToggle" text="Switch to Dark Mode" onAction="#toggleTheme"/>
     </HBox>
 
-
-
-    <HBox spacing="10" alignment="CENTER_LEFT" styleClass="song-row">
-        <Label fx:id="Name1" text="Song of Dawn" styleClass="song-title"/>
-        <Label fx:id="Singer1" text="Alice Johnson" styleClass="song-artist"/>
-        <Label fx:id="Duration1" text="03:45" styleClass="song-duration"/>
-        <Button fx:id="play1" text="Play" onAction="#handlePlayAction" styleClass="play-button"/>
-        <Button fx:id="AddToPlaylist1" text="Add to Playlist" onAction="#addToPlaylist" styleClass="secondary-button"/>
+    <HBox styleClass="track-row" alignment="CENTER_LEFT" fx:id="song1">
+        <Label fx:id="Name1" text="Song of Dawn" minWidth="180" prefWidth="180"/>
+        <Label fx:id="Singer1" text="Alice Johnson" minWidth="200" prefWidth="200"/>
+        <Label fx:id="Duration1" text="03:45" minWidth="100" prefWidth="100"/>
+        <Button fx:id="play1" text="Play" onAction="#handlePlayAction" minWidth="90" prefWidth="90"/>
+        <Button fx:id="AddToPlaylist1" text="Add to Playlist" onAction="#addToPlaylist" minWidth="150" prefWidth="150"/>
     </HBox>
 
-    <HBox spacing="10" alignment="CENTER_LEFT" styleClass="song-row">
-        <Label fx:id="Name2" text="Echoes of You" styleClass="song-title"/>
-        <Label fx:id="Singer2" text="Luna Sky" styleClass="song-artist"/>
-        <Label fx:id="Duration2" text="05:08" styleClass="song-duration"/>
-        <Button fx:id="play2" text="Play" onAction="#handlePlayAction" styleClass="play-button"/>
-        <Button fx:id="AddToPlaylist2" text="Add to Playlist" onAction="#addToPlaylist" styleClass="secondary-button"/>
+    <HBox styleClass="track-row" alignment="CENTER_LEFT" fx:id="song2">
+        <Label fx:id="Name2" text="Echoes of You" minWidth="180" prefWidth="180"/>
+        <Label fx:id="Singer2" text="Luna Sky" minWidth="200" prefWidth="200"/>
+        <Label fx:id="Duration2" text="05:08" minWidth="100" prefWidth="100"/>
+        <Button fx:id="play2" text="Play" onAction="#handlePlayAction" minWidth="90" prefWidth="90"/>
+        <Button fx:id="AddToPlaylist2" text="Add to Playlist" onAction="#addToPlaylist" minWidth="150" prefWidth="150"/>
     </HBox>
 
-    <HBox spacing="10" alignment="CENTER_LEFT" styleClass="song-row">
-        <Label fx:id="Name3" text="Midnight Drive" styleClass="song-title"/>
-        <Label fx:id="Singer3" text="The Night Owls" styleClass="song-artist"/>
-        <Label fx:id="Duration3" text="04:12" styleClass="song-duration"/>
-        <Button fx:id="play3" text="Play" onAction="#handlePlayAction" styleClass="play-button"/>
-        <Button fx:id="AddToPlaylist3" text="Add to Playlist" onAction="#addToPlaylist" styleClass="secondary-button"/>
+    <HBox styleClass="track-row" alignment="CENTER_LEFT" fx:id="song3">
+        <Label fx:id="Name3" text="Midnight Drive" minWidth="180" prefWidth="180"/>
+        <Label fx:id="Singer3" text="The Night Owls" minWidth="200" prefWidth="200"/>
+        <Label fx:id="Duration3" text="04:12" minWidth="100" prefWidth="100"/>
+        <Button fx:id="play3" text="Play" onAction="#handlePlayAction" minWidth="90" prefWidth="90"/>
+        <Button fx:id="AddToPlaylist3" text="Add to Playlist" onAction="#addToPlaylist" minWidth="150" prefWidth="150"/>
     </HBox>
 
+    <HBox styleClass="footer-row" alignment="CENTER_LEFT" fx:id="playingBox">
+        <Label text = "Playing: " fx:id="nowPlayingLabel" minWidth="300" prefWidth="300"/> <!-- تنظیم عرض برای هم‌ترازی -->
+        <Label fx:id="nowPlayingSong" text = " " prefWidth="300"/>
+    </HBox>
+
+    <Button styleClass="playlist-button" fx:id="PlayListButton" text = "Playlist" onAction="#openPlaylistWindow" />
+
 </VBox>