<UserControl x:Class="NexusShell.Views.NexusMediaView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:conv="clr-namespace:NexusShell.Converters"
             xmlns:models="clr-namespace:NexusShell.Models"
             FontFamily="Segoe UI Variable Display, Segoe UI">
    <UserControl.Resources>
        <conv:BoolToVisibilityConverter x:Key="BoolToVisibility"/>
        <Style x:Key="NmGlassButton" TargetType="Button">
            <Setter Property="Background" Value="#2200D9FF"/>
            <Setter Property="Foreground" Value="#E8F4FF"/>
            <Setter Property="BorderBrush" Value="#4400D9FF"/>
            <Setter Property="BorderThickness" Value="1"/>
            <Setter Property="Padding" Value="10,6"/>
            <Setter Property="Cursor" Value="Hand"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}"
                                BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="10"
                                Padding="{TemplateBinding Padding}">
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Background" Value="#338A4FFF"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="NmIconButton" TargetType="Button" BasedOn="{StaticResource NmGlassButton}">
            <Setter Property="Width" Value="36"/>
            <Setter Property="Height" Value="36"/>
            <Setter Property="Padding" Value="0"/>
        </Style>
        <Style x:Key="NmNavButton" TargetType="Button">
            <Setter Property="Background" Value="Transparent"/>
            <Setter Property="BorderThickness" Value="0"/>
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Setter Property="Padding" Value="10,8"/>
            <Setter Property="Cursor" Value="Hand"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border x:Name="Root" CornerRadius="10" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}">
                            <ContentPresenter/>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter TargetName="Root" Property="Background" Value="#2200D9FF"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="200"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="280"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>

        <!-- LEFT NAV -->
        <Border Grid.Column="0" Grid.Row="0" Grid.RowSpan="3" Margin="0,0,8,0"
                Background="#18081228" CornerRadius="16" BorderBrush="#3300D9FF" BorderThickness="1" Padding="8">
            <StackPanel>
                <TextBlock Text="Nexus Media" FontSize="14" FontWeight="SemiBold" Foreground="#FFFFFF" Margin="8,4,8,12"/>
                <ItemsControl ItemsSource="{Binding NavItems}">
                    <ItemsControl.ItemTemplate>
                        <DataTemplate DataType="{x:Type models:NexusMediaNavItem}">
                            <Button Style="{StaticResource NmNavButton}" Margin="0,2"
                                    Command="{Binding DataContext.NavigateCommand, RelativeSource={RelativeSource AncestorType=UserControl}}"
                                    CommandParameter="{Binding Section}">
                                <StackPanel Orientation="Horizontal">
                                    <Path Data="{Binding IconPath}" Stroke="#00D9FF" StrokeThickness="1.6"
                                          Fill="Transparent" Width="16" Height="16" Stretch="Uniform" Margin="0,0,10,0"/>
                                    <TextBlock Text="{Binding Label}" Foreground="#C8D8F0" FontSize="12.5" VerticalAlignment="Center"/>
                                </StackPanel>
                            </Button>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>
            </StackPanel>
        </Border>

        <!-- CENTER -->
        <Grid Grid.Column="1" Grid.Row="0" Margin="0,0,8,0">
            <Border Background="#14081228" CornerRadius="16" BorderBrush="#2A00D9FF" BorderThickness="1" Padding="14">
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <DockPanel Grid.Row="0" Margin="0,0,0,12">
                        <TextBlock Text="{Binding SectionTitle}" FontSize="18" FontWeight="SemiBold" Foreground="#FFFFFF" DockPanel.Dock="Left"/>
                        <StackPanel Orientation="Horizontal" HorizontalAlignment="Right" DockPanel.Dock="Right">
                            <TextBox Text="{Binding SearchText, UpdateSourceTrigger=PropertyChanged}" Width="200" Margin="0,0,8,0"
                                     Background="#22000000" Foreground="#E8F4FF" BorderBrush="#4400D9FF" Padding="8,6"/>
                            <Button Style="{StaticResource NmGlassButton}" Content="Opdater" Command="{Binding RefreshCommand}"/>
                        </StackPanel>
                    </DockPanel>

                    <!-- Home -->
                    <ScrollViewer Grid.Row="1" VerticalScrollBarVisibility="Auto"
                                  Visibility="{Binding ShowHome, Converter={StaticResource BoolToVisibility}}">
                        <ItemsControl ItemsSource="{Binding HomeSections}">
                            <ItemsControl.ItemTemplate>
                                <DataTemplate DataType="{x:Type models:NexusMediaHomeSection}">
                                    <StackPanel Margin="0,0,0,18">
                                        <StackPanel Orientation="Horizontal" Margin="0,0,0,8">
                                            <Path Data="{Binding IconPath}" Stroke="#8A4FFF" StrokeThickness="1.6" Width="16" Height="16" Margin="0,0,8,0"/>
                                            <TextBlock Text="{Binding Title}" FontSize="14" FontWeight="SemiBold" Foreground="#D0E4FF"/>
                                        </StackPanel>
                                        <ItemsControl ItemsSource="{Binding Items}">
                                            <ItemsControl.ItemsPanel>
                                                <ItemsPanelTemplate>
                                                    <WrapPanel/>
                                                </ItemsPanelTemplate>
                                            </ItemsControl.ItemsPanel>
                                            <ItemsControl.ItemTemplate>
                                                <DataTemplate DataType="{x:Type models:NexusMediaGridItem}">
                                                    <Border Width="220" Margin="0,0,12,12" CornerRadius="14" Background="#22000000"
                                                            BorderBrush="#3300D9FF" BorderThickness="1" Cursor="Hand"
                                                            MouseLeftButtonUp="VideoCard_OnClick">
                                                        <Border.InputBindings>
                                                            <MouseBinding MouseAction="LeftDoubleClick"
                                                                          Command="{Binding DataContext.PlayItemCommand, RelativeSource={RelativeSource AncestorType=UserControl}}"
                                                                          CommandParameter="{Binding}"/>
                                                        </Border.InputBindings>
                                                        <Grid>
                                                            <Border Height="140" CornerRadius="14,14,0,0" Background="#2A102040">
                                                                <Grid>
                                                                    <Path Data="M8,6 L18,12 L8,18 Z" Fill="#668A4FFF" Stretch="Uniform" Width="36" Height="36"
                                                                          HorizontalAlignment="Center" VerticalAlignment="Center"/>
                                                                </Grid>
                                                            </Border>
                                                            <StackPanel VerticalAlignment="Bottom" Margin="10,0,10,10">
                                                                <TextBlock Text="{Binding Item.Title}" Foreground="#FFFFFF" FontWeight="SemiBold" TextTrimming="CharacterEllipsis"/>
                                                                <TextBlock Foreground="#8CA3C7" FontSize="11">
                                                                    <Run Text="{Binding Item.DurationLabel}"/>
                                                                    <Run Text=" · "/>
                                                                    <Run Text="{Binding Item.ResolutionLabel}"/>
                                                                </TextBlock>
                                                            </StackPanel>
                                                        </Grid>
                                                    </Border>
                                                </DataTemplate>
                                            </ItemsControl.ItemTemplate>
                                        </ItemsControl>
                                    </StackPanel>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </ScrollViewer>

                    <!-- Video grid -->
                    <ScrollViewer Grid.Row="1" VerticalScrollBarVisibility="Auto"
                                  Visibility="{Binding ShowVideoGrid, Converter={StaticResource BoolToVisibility}}">
                        <ItemsControl ItemsSource="{Binding VideoItems}">
                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <WrapPanel/>
                                </ItemsPanelTemplate>
                            </ItemsControl.ItemsPanel>
                            <ItemsControl.ItemTemplate>
                                <DataTemplate DataType="{x:Type models:NexusMediaGridItem}">
                                    <Border Width="200" MinWidth="180" MaxWidth="260" Margin="0,0,12,12" CornerRadius="14"
                                            Background="#22000000" BorderBrush="#3300D9FF" BorderThickness="1" Cursor="Hand"
                                            MouseLeftButtonUp="VideoCard_OnClick">
                                        <Border.InputBindings>
                                            <MouseBinding MouseAction="LeftDoubleClick"
                                                          Command="{Binding DataContext.PlayItemCommand, RelativeSource={RelativeSource AncestorType=UserControl}}"
                                                          CommandParameter="{Binding}"/>
                                        </Border.InputBindings>
                                        <Grid>
                                            <Border Height="120" CornerRadius="14,14,0,0" Background="#2A102040">
                                                <Path Data="M4,6 L20,6 L20,18 L4,18 Z M8,6 L8,18 M16,6 L16,18" Stroke="#668A4FFF"
                                                      StrokeThickness="1.4" Stretch="Uniform" Width="40" Height="40"
                                                      HorizontalAlignment="Center" VerticalAlignment="Center"/>
                                            </Border>
                                            <StackPanel Margin="10,124,10,10">
                                                <TextBlock Text="{Binding Item.Title}" Foreground="#FFFFFF" FontWeight="SemiBold" TextTrimming="CharacterEllipsis"/>
                                                <TextBlock Foreground="#8CA3C7" FontSize="11">
                                                    <Run Text="{Binding Item.DurationLabel}"/>
                                                    <Run Text=" · "/>
                                                    <Run Text="{Binding Item.ResolutionLabel}"/>
                                                </TextBlock>
                                            </StackPanel>
                                        </Grid>
                                    </Border>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </ScrollViewer>

                    <!-- Music list -->
                    <ListView Grid.Row="1" ItemsSource="{Binding MusicItems}" BorderThickness="0" Background="Transparent"
                              Visibility="{Binding ShowMusicList, Converter={StaticResource BoolToVisibility}}"
                              MouseDoubleClick="MusicList_OnDoubleClick" SelectionChanged="MusicList_OnSelectionChanged">
                        <ListView.ItemContainerStyle>
                            <Style TargetType="ListViewItem">
                                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                                <Setter Property="Padding" Value="0"/>
                                <Setter Property="Margin" Value="0,0,0,4"/>
                                <Setter Property="Template">
                                    <Setter.Value>
                                        <ControlTemplate TargetType="ListViewItem">
                                            <Border x:Name="Bd" CornerRadius="10" Background="#18000000" Padding="10,8"
                                                    BorderBrush="#2200D9FF" BorderThickness="1">
                                                <ContentPresenter/>
                                            </Border>
                                            <ControlTemplate.Triggers>
                                                <Trigger Property="IsMouseOver" Value="True">
                                                    <Setter TargetName="Bd" Property="Background" Value="#2800D9FF"/>
                                                </Trigger>
                                                <Trigger Property="IsSelected" Value="True">
                                                    <Setter TargetName="Bd" Property="BorderBrush" Value="#8800D9FF"/>
                                                </Trigger>
                                            </ControlTemplate.Triggers>
                                        </ControlTemplate>
                                    </Setter.Value>
                                </Setter>
                            </Style>
                        </ListView.ItemContainerStyle>
                        <ListView.View>
                            <GridView>
                                <GridViewColumn Header="Titel" Width="220" DisplayMemberBinding="{Binding Item.Title}"/>
                                <GridViewColumn Header="Kunstner" Width="160" DisplayMemberBinding="{Binding Item.Artist}"/>
                                <GridViewColumn Header="Album" Width="160" DisplayMemberBinding="{Binding Item.Album}"/>
                                <GridViewColumn Header="Varighed" Width="80" DisplayMemberBinding="{Binding Item.DurationLabel}"/>
                            </GridView>
                        </ListView.View>
                    </ListView>

                    <!-- Folders -->
                    <ScrollViewer Grid.Row="1" VerticalScrollBarVisibility="Auto"
                                  Visibility="{Binding ShowFolderList, Converter={StaticResource BoolToVisibility}}">
                        <ItemsControl ItemsSource="{Binding FolderSummaries}">
                            <ItemsControl.ItemTemplate>
                                <DataTemplate DataType="{x:Type models:NexusMediaFolderSummary}">
                                    <Button Style="{StaticResource NmNavButton}" Margin="0,0,0,6"
                                            Command="{Binding DataContext.OpenFolderCommand, RelativeSource={RelativeSource AncestorType=UserControl}}"
                                            CommandParameter="{Binding}">
                                        <Grid>
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="*"/>
                                                <ColumnDefinition Width="Auto"/>
                                            </Grid.ColumnDefinitions>
                                            <StackPanel>
                                                <TextBlock Text="{Binding Label}" Foreground="#FFFFFF" FontWeight="SemiBold"/>
                                                <TextBlock Foreground="#8CA3C7" FontSize="11">
                                                    <Run Text="{Binding ItemCount}"/>
                                                    <Run Text=" medier"/>
                                                </TextBlock>
                                            </StackPanel>
                                            <Path Grid.Column="1" Data="M10,6 L16,12 L10,18" Stroke="#00D9FF" StrokeThickness="1.6"
                                                  Width="14" Height="14" Stretch="Uniform" VerticalAlignment="Center"/>
                                        </Grid>
                                    </Button>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </ScrollViewer>

                    <!-- Playlists -->
                    <ScrollViewer Grid.Row="1" VerticalScrollBarVisibility="Auto"
                                  Visibility="{Binding IsPlaylistsSection, Converter={StaticResource BoolToVisibility}}">
                        <StackPanel>
                            <Button Style="{StaticResource NmGlassButton}" Content="Ny afspilningsliste" HorizontalAlignment="Left"
                                    Margin="0,0,0,12" Command="{Binding CreatePlaylistCommand}"/>
                            <ItemsControl ItemsSource="{Binding PlaylistSummaries}">
                                <ItemsControl.ItemTemplate>
                                    <DataTemplate DataType="{x:Type models:NexusMediaPlaylistSummary}">
                                        <Button Style="{StaticResource NmNavButton}" Margin="0,0,0,6"
                                                Command="{Binding DataContext.PlayPlaylistCommand, RelativeSource={RelativeSource AncestorType=UserControl}}"
                                                CommandParameter="{Binding}">
                                            <Grid>
                                                <StackPanel>
                                                    <TextBlock Text="{Binding Playlist.Name}" Foreground="#FFFFFF" FontWeight="SemiBold"/>
                                                    <TextBlock Text="{Binding ItemCountLabel}" Foreground="#8CA3C7" FontSize="11"/>
                                                </StackPanel>
                                            </Grid>
                                        </Button>
                                    </DataTemplate>
                                </ItemsControl.ItemTemplate>
                            </ItemsControl>
                        </StackPanel>
                    </ScrollViewer>
                </Grid>
            </Border>

            <!-- Video player overlay -->
            <Border Background="#EE020712" CornerRadius="16" BorderBrush="#6600D9FF" BorderThickness="1"
                    Visibility="{Binding IsVideoPlayerVisible, Converter={StaticResource BoolToVisibility}}">
                <Grid Background="#000000">
                    <MediaElement x:Name="VideoSurface" LoadedBehavior="Manual" UnloadedBehavior="Manual"
                                  Stretch="Uniform"/>
                    <Border VerticalAlignment="Bottom" Background="#CC081428" Padding="14,10">
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                            </Grid.RowDefinitions>
                            <TextBlock Text="{Binding NowPlayingTitle}" Foreground="#FFFFFF" FontWeight="SemiBold" FontSize="15"/>
                            <StackPanel Grid.Row="1" Orientation="Horizontal" Margin="0,10,0,0">
                                <Button Style="{StaticResource NmIconButton}" Command="{Binding PlayPauseCommand}" Margin="0,0,6,0">
                                    <Path Data="M8,6 L18,12 L8,18 Z" Fill="#00D9FF" Stretch="Uniform" Width="14" Height="14"
                                          Visibility="{Binding ShowPlayIcon, Converter={StaticResource BoolToVisibility}}"/>
                                </Button>
                                <Button Style="{StaticResource NmIconButton}" Command="{Binding PlayPauseCommand}" Margin="0,0,6,0">
                                    <Path Data="M8,6 L8,18 M16,6 L16,18" Stroke="#00D9FF" StrokeThickness="2" Stretch="Uniform" Width="14" Height="14"
                                          Visibility="{Binding ShowPauseIcon, Converter={StaticResource BoolToVisibility}}"/>
                                </Button>
                                <Button Style="{StaticResource NmIconButton}" Command="{Binding StopCommand}" Margin="0,0,6,0">
                                    <Path Data="M7,7 L17,7 L17,17 L7,17 Z" Fill="#8CA3C7" Stretch="Uniform" Width="12" Height="12"/>
                                </Button>
                                <Slider Width="200" Minimum="0" Maximum="1" Value="{Binding SeekFraction, Mode=TwoWay}"
                                        Margin="8,0" VerticalAlignment="Center"
                                        ValueChanged="SeekSlider_OnValueChanged"/>
                                <TextBlock Text="{Binding PositionLabel}" Foreground="#8CA3C7" VerticalAlignment="Center" Margin="8,0"/>
                                <TextBlock Foreground="#8CA3C7" VerticalAlignment="Center" Margin="8,0">
                                    <Run Text="{Binding SelectedMetadata.ResolutionLabel}"/>
                                </TextBlock>
                                <Button Style="{StaticResource NmIconButton}" Command="{Binding ToggleFullscreenCommand}" Margin="8,0,0,0">
                                    <Path Data="M6,6 L18,6 L18,18 L6,18 Z" Stroke="#00D9FF" StrokeThickness="1.6" Stretch="Uniform" Width="14" Height="14"/>
                                </Button>
                                <Button Style="{StaticResource NmGlassButton}" Content="Luk" Margin="8,0,0,0"
                                        Command="{Binding CloseVideoPlayerCommand}"/>
                            </StackPanel>
                        </Grid>
                    </Border>
                </Grid>
            </Border>
        </Grid>

        <!-- RIGHT: Metadata + Queue -->
        <Border Grid.Column="2" Grid.Row="0" Background="#18081228" CornerRadius="16" BorderBrush="#3300D9FF" BorderThickness="1" Padding="12">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>
                <TextBlock Text="Nu afspilles" FontSize="13" FontWeight="SemiBold" Foreground="#00D9FF" Margin="0,0,0,10"/>
                <ScrollViewer Grid.Row="1" VerticalScrollBarVisibility="Auto">
                    <StackPanel>
                        <Border Height="120" CornerRadius="12" Background="#2A102040" Margin="0,0,0,10">
                            <Path Data="M12,4 L12,16 M12,16 A3,3 0 1,0 15,16 A3,3 0 1,0 12,16 M12,4 L18,6 L18,12"
                                  Stroke="#8A4FFF" StrokeThickness="1.6" Stretch="Uniform" Width="42" Height="42"
                                  HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        </Border>
                        <TextBlock Text="{Binding NowPlayingTitle}" Foreground="#FFFFFF" FontWeight="SemiBold" TextWrapping="Wrap"/>
                        <TextBlock Text="{Binding NowPlayingSubtitle}" Foreground="#8CA3C7" FontSize="11" Margin="0,2,0,12" TextWrapping="Wrap"/>

                        <TextBlock Text="Metadata" FontSize="12" FontWeight="SemiBold" Foreground="#8A4FFF" Margin="0,0,0,6"/>
                        <TextBlock Foreground="#8CA3C7" FontSize="11" TextWrapping="Wrap" Margin="0,0,0,2">
                            <Run Text="Format: "/><Run Text="{Binding SelectedMetadata.Format}" Foreground="#D0E4FF"/>
                        </TextBlock>
                        <TextBlock Foreground="#8CA3C7" FontSize="11" Margin="0,0,0,2">
                            <Run Text="Varighed: "/><Run Text="{Binding SelectedMetadata.DurationLabel}" Foreground="#D0E4FF"/>
                        </TextBlock>
                        <TextBlock Foreground="#8CA3C7" FontSize="11" Margin="0,0,0,2">
                            <Run Text="Opløsning: "/><Run Text="{Binding SelectedMetadata.ResolutionLabel}" Foreground="#D0E4FF"/>
                        </TextBlock>
                        <TextBlock Foreground="#8CA3C7" FontSize="11" Margin="0,0,0,2">
                            <Run Text="Bitrate: "/><Run Text="{Binding SelectedMetadata.BitrateLabel}" Foreground="#D0E4FF"/>
                        </TextBlock>
                        <TextBlock Foreground="#8CA3C7" FontSize="11" Margin="0,0,0,2">
                            <Run Text="Codec: "/><Run Text="{Binding SelectedMetadata.CodecLabel}" Foreground="#D0E4FF"/>
                        </TextBlock>
                        <TextBlock Foreground="#8CA3C7" FontSize="11" Margin="0,0,0,2">
                            <Run Text="Kunstner: "/><Run Text="{Binding SelectedMetadata.ArtistLabel}" Foreground="#D0E4FF"/>
                        </TextBlock>
                        <TextBlock Foreground="#8CA3C7" FontSize="11" Margin="0,0,0,12">
                            <Run Text="Album: "/><Run Text="{Binding SelectedMetadata.AlbumLabel}" Foreground="#D0E4FF"/>
                        </TextBlock>

                        <StackPanel Orientation="Horizontal" Margin="0,0,0,12">
                            <Button Style="{StaticResource NmGlassButton}" Content="Favorit" Command="{Binding ToggleFavoriteCommand}" Margin="0,0,6,0"/>
                            <Button Style="{StaticResource NmGlassButton}" Content="Til kø" Command="{Binding AddToQueueCommand}"/>
                        </StackPanel>

                        <TextBlock Text="Kø" FontSize="12" FontWeight="SemiBold" Foreground="#00D9FF" Margin="0,0,0,6"/>
                        <ItemsControl ItemsSource="{Binding QueueItems}">
                            <ItemsControl.ItemTemplate>
                                <DataTemplate DataType="{x:Type models:NexusMediaQueueItem}">
                                    <Border Background="#14000000" CornerRadius="8" Padding="8,6" Margin="0,0,0,4">
                                        <DockPanel>
                                            <StackPanel DockPanel.Dock="Left">
                                                <TextBlock Text="{Binding Media.Title}" Foreground="#E8F4FF" FontSize="11" TextTrimming="CharacterEllipsis"/>
                                                <TextBlock Text="{Binding Media.DurationLabel}" Foreground="#8CA3C7" FontSize="10"/>
                                            </StackPanel>
                                            <Button DockPanel.Dock="Right" Style="{StaticResource NmIconButton}" Width="28" Height="28"
                                                    Command="{Binding DataContext.RemoveFromQueueCommand, RelativeSource={RelativeSource AncestorType=UserControl}}"
                                                    CommandParameter="{Binding}">
                                                <Path Data="M8,8 L16,16 M16,8 L8,16" Stroke="#8CA3C7" StrokeThickness="1.4" Stretch="Uniform" Width="10" Height="10"/>
                                            </Button>
                                        </DockPanel>
                                    </Border>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </StackPanel>
                </ScrollViewer>
            </Grid>
        </Border>

        <!-- Audio player bar -->
        <Border Grid.Column="1" Grid.ColumnSpan="2" Grid.Row="1" Margin="0,8,0,0"
                Background="#CC081428" CornerRadius="14" BorderBrush="#4400D9FF" BorderThickness="1" Padding="12,8"
                Visibility="{Binding IsAudioBarVisible, Converter={StaticResource BoolToVisibility}}">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="Auto"/>
                </Grid.ColumnDefinitions>
                <Border Width="48" Height="48" CornerRadius="10" Background="#2A102040" Margin="0,0,12,0">
                    <Path Data="M12,4 L12,16 M12,16 A3,3 0 1,0 15,16 A3,3 0 1,0 12,16 M12,4 L18,6 L18,12"
                          Stroke="#8A4FFF" StrokeThickness="1.6" Stretch="Uniform" Width="22" Height="22"
                          HorizontalAlignment="Center" VerticalAlignment="Center"/>
                </Border>
                <StackPanel Grid.Column="1" VerticalAlignment="Center">
                    <TextBlock Text="{Binding NowPlayingTitle}" Foreground="#FFFFFF" FontWeight="SemiBold"/>
                    <TextBlock Text="{Binding NowPlayingSubtitle}" Foreground="#8CA3C7" FontSize="11"/>
                </StackPanel>
                <StackPanel Grid.Column="2" Orientation="Horizontal" VerticalAlignment="Center">
                    <Button Style="{StaticResource NmIconButton}" Command="{Binding PreviousCommand}" Margin="0,0,4,0">
                        <Path Data="M8,6 L8,18 M14,6 L20,12 L14,18 Z" Stroke="#00D9FF" StrokeThickness="1.6" Stretch="Uniform" Width="14" Height="14"/>
                    </Button>
                    <Button Style="{StaticResource NmIconButton}" Command="{Binding PlayPauseCommand}" Margin="0,0,4,0">
                        <Path Data="M8,6 L18,12 L8,18 Z" Fill="#00D9FF" Stretch="Uniform" Width="14" Height="14"
                              Visibility="{Binding ShowPlayIcon, Converter={StaticResource BoolToVisibility}}"/>
                    </Button>
                    <Button Style="{StaticResource NmIconButton}" Command="{Binding PlayPauseCommand}" Margin="0,0,4,0">
                        <Path Data="M8,6 L8,18 M16,6 L16,18" Stroke="#00D9FF" StrokeThickness="2" Stretch="Uniform" Width="14" Height="14"
                              Visibility="{Binding ShowPauseIcon, Converter={StaticResource BoolToVisibility}}"/>
                    </Button>
                    <Button Style="{StaticResource NmIconButton}" Command="{Binding NextCommand}" Margin="0,0,4,0">
                        <Path Data="M10,6 L16,12 L10,18 Z M16,6 L16,18" Stroke="#00D9FF" StrokeThickness="1.6" Stretch="Uniform" Width="14" Height="14"/>
                    </Button>
                    <Button Style="{StaticResource NmIconButton}" Command="{Binding ToggleShuffleCommand}" Margin="0,0,4,0">
                        <Path Data="M16,4 L20,8 L16,12 M4,8 L10,8" Stroke="#8CA3C7" StrokeThickness="1.6" Stretch="Uniform" Width="14" Height="14"/>
                    </Button>
                    <Button Style="{StaticResource NmIconButton}" Command="{Binding CycleRepeatCommand}">
                        <Path Data="M6,8 L6,6 L18,6 L18,16 L16,16" Stroke="#8CA3C7" StrokeThickness="1.6" Stretch="Uniform" Width="14" Height="14"/>
                    </Button>
                </StackPanel>
            </Grid>
        </Border>

        <TextBlock Grid.Column="1" Grid.ColumnSpan="2" Grid.Row="2" Text="{Binding StatusMessage}" Foreground="#8CA3C7"
                   FontSize="11" Margin="4,6,0,0"
                   Visibility="{Binding HasStatusMessage, Converter={StaticResource BoolToVisibility}}"/>
    </Grid>
</UserControl>
