MainWindow.xaml

<Window x:Class="SonicBoard.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="SonicBoard"
        Width="800" Height="600"
        MinWidth="650" MinHeight="450"
        WindowStartupLocation="CenterScreen"
        Background="{StaticResource BgDarkestBrush}"
        Foreground="{StaticResource TextPrimaryBrush}"
        FontFamily="Segoe UI"
        Icon="Assets/logo.png"
        Loaded="Window_Loaded"
        Closing="Window_Closing"
        AllowDrop="True"
        Drop="Window_Drop"
        DragOver="Window_DragOver">

    <Window.Resources>
        <!-- ListView item container style for sound list rows -->
        <Style x:Key="SoundListItemStyle" TargetType="ListViewItem">
            <Setter Property="Background" Value="Transparent"/>
            <Setter Property="Foreground" Value="{StaticResource TextPrimaryBrush}"/>
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Setter Property="Padding" Value="4,6"/>
            <Setter Property="FontSize" Value="12"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ListViewItem">
                        <Border x:Name="Bd"
                                Background="{TemplateBinding Background}"
                                BorderBrush="Transparent"
                                BorderThickness="0,0,0,1"
                                Padding="{TemplateBinding Padding}">
                            <GridViewRowPresenter VerticalAlignment="Center"/>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter TargetName="Bd" Property="Background" Value="{StaticResource BgMediumBrush}"/>
                            </Trigger>
                            <Trigger Property="IsSelected" Value="True">
                                <Setter TargetName="Bd" Property="Background" Value="{StaticResource BgLightBrush}"/>
                                <Setter TargetName="Bd" Property="BorderBrush" Value="{StaticResource AccentBlueBrush}"/>
                                <Setter TargetName="Bd" Property="BorderThickness" Value="2,0,0,0"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <Style x:Key="OrangeButton" TargetType="Button" BasedOn="{StaticResource DarkButton}">
            <Setter Property="Background" Value="{StaticResource AccentOrangeBrush}"/>
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="BorderBrush" Value="Transparent"/>
            <Setter Property="FontWeight" Value="SemiBold"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border x:Name="border"
                                Background="{TemplateBinding Background}"
                                BorderThickness="0"
                                CornerRadius="4"
                                Padding="{TemplateBinding Padding}">
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter TargetName="border" Property="Opacity" Value="0.9"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>  <!-- Title Bar -->
            <RowDefinition Height="Auto"/>  <!-- Admin Warning Banner -->
            <RowDefinition Height="Auto"/>  <!-- Toolbar -->
            <RowDefinition Height="*"/>     <!-- Main Content -->
            <RowDefinition Height="Auto"/>  <!-- Bottom Action Bar -->
            <RowDefinition Height="Auto"/>  <!-- Status Bar -->
        </Grid.RowDefinitions>

        <!-- ══════════════════════════════════════════════════════
             ROW 0: Custom Title Bar
             ══════════════════════════════════════════════════════ -->
        <Border Grid.Row="0" Background="{StaticResource BgDarkBrush}"
                BorderBrush="{StaticResource BorderBrush}" BorderThickness="0,0,0,1"
                Padding="12,8" MouseLeftButtonDown="TitleBar_MouseLeftButtonDown">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="Auto"/>
                </Grid.ColumnDefinitions>

                <!-- App Title -->
                <StackPanel Grid.Column="0" Orientation="Horizontal" VerticalAlignment="Center">
                    <Image Source="Assets/logo.png" Width="28" Height="28" Margin="0,0,8,0" VerticalAlignment="Center" RenderOptions.BitmapScalingMode="HighQuality"/>
                    <TextBlock Text="SONIC" FontSize="18" FontWeight="Bold"
                               Foreground="{StaticResource AccentRedBrush}" VerticalAlignment="Center"/>
                    <TextBlock Text="BOARD" FontSize="18" FontWeight="Light"
                               Foreground="{StaticResource TextPrimaryBrush}" VerticalAlignment="Center"/>
                    <TextBlock Text="  v1.0" FontSize="10" Foreground="{StaticResource TextDimBrush}"
                               VerticalAlignment="Bottom" Margin="0,0,0,2"/>
                </StackPanel>

                <!-- Search Bar -->
                <Border Grid.Column="1" HorizontalAlignment="Right" Margin="20,0,10,0" MaxWidth="250">
                    <Grid>
                        <TextBox x:Name="txtSearch" Style="{StaticResource DarkTextBox}"
                                 Width="220" TextChanged="SearchBox_TextChanged"
                                 VerticalAlignment="Center"/>
                        <TextBlock Text="🔍 Search Sounds..." FontSize="11"
                                   Foreground="{StaticResource TextDimBrush}"
                                   VerticalAlignment="Center" Margin="10,0,0,0"
                                   IsHitTestVisible="False"
                                   x:Name="txtSearchPlaceholder"/>
                    </Grid>
                </Border>

                <!-- View Toggle + Profile selector -->
                <StackPanel Grid.Column="2" Orientation="Horizontal" VerticalAlignment="Center">
                    <!-- Profile selector -->
                    <ComboBox x:Name="cmbProfiles" Width="120" Margin="0,0,8,0"
                              Style="{StaticResource DarkComboBox}"
                              SelectionChanged="ProfileSelector_Changed"
                              ToolTip="Switch Profile"/>

                    <!-- View Toggle Buttons -->
                    <Button x:Name="btnListView" Content="☰" FontSize="16"
                            Style="{StaticResource DarkButton}" Padding="8,4"
                            Click="ToggleListView_Click" ToolTip="List View"
                            Margin="0,0,2,0"/>
                    <Button x:Name="btnGridView" Content="▦" FontSize="16"
                            Style="{StaticResource DarkButton}" Padding="8,4"
                            Click="ToggleGridView_Click" ToolTip="Button Grid View"/>
                </StackPanel>
            </Grid>
        </Border>

        <!-- ══════════════════════════════════════════════════════
             ROW 1: Admin Warning Banner (only visible if not running as admin)
             ══════════════════════════════════════════════════════ -->
        <Border x:Name="borderAdminWarning" Grid.Row="1" Background="#1AFF8800"
                BorderBrush="{StaticResource AccentOrangeBrush}" BorderThickness="0,0,0,1"
                Padding="12,6" Visibility="Collapsed">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="Auto"/>
                </Grid.ColumnDefinitions>
                <StackPanel Orientation="Horizontal" VerticalAlignment="Center">
                    <TextBlock Text="⚠️" Margin="0,0,8,0" VerticalAlignment="Center" FontSize="14"/>
                    <TextBlock Text="Keybinds will not work in games (like BGMI emulator) unless run as Administrator."
                               VerticalAlignment="Center" Foreground="#FFFFBB55" FontSize="11" TextWrapping="Wrap" FontWeight="SemiBold"/>
                </StackPanel>
                <Button Grid.Column="1" Content="🛡️ Run as Administrator" Click="RunAsAdmin_Click"
                        Style="{StaticResource OrangeButton}"
                        Padding="10,4" Margin="10,0,0,0" VerticalAlignment="Center" FontSize="11"/>
            </Grid>
        </Border>

        <!-- ══════════════════════════════════════════════════════
             ROW 2: Quick Action Toolbar
             ══════════════════════════════════════════════════════ -->
        <Border Grid.Row="2" Background="{StaticResource BgDarkBrush}" Padding="12,6"
                BorderBrush="{StaticResource BorderBrush}" BorderThickness="0,0,0,1">
            <StackPanel Orientation="Horizontal">
                <Button Content="⏹ Stop All" Style="{StaticResource AccentButton}"
                        Click="StopAll_Click" Padding="12,6" Margin="0,0,6,0"
                        ToolTip="Stop all playing sounds (Ctrl+S)"/>
                <Button Content="⏸ Pause All" Style="{StaticResource DarkButton}"
                        Click="PauseAll_Click" Padding="12,6" Margin="0,0,6,0"
                        x:Name="btnPauseAll"/>
                <Button Content="🎲 Random" Style="{StaticResource DarkButton}"
                        Click="PlayRandom_Click" Padding="12,6" Margin="0,0,6,0"
                        ToolTip="Play a random sound"/>

                <Separator Background="{StaticResource BorderBrush}" Width="1" Margin="6,2"/>

                <Button Content="➕ Add Sound" Style="{StaticResource GreenButton}"
                        Click="AddSound_Click" Padding="12,6" Margin="6,0,6,0"/>
                <Button Content="🗑 Delete" Style="{StaticResource DarkButton}"
                        Click="DeleteSound_Click" Padding="12,6" Margin="0,0,6,0"/>

                <Separator Background="{StaticResource BorderBrush}" Width="1" Margin="6,2"/>

                <Button Content="💾 Save" Style="{StaticResource DarkButton}"
                        Click="SaveProfile_Click" Padding="12,6" Margin="6,0,6,0"
                        ToolTip="Save current profile"/>
                <Button Content="📁 New Profile" Style="{StaticResource DarkButton}"
                        Click="NewProfile_Click" Padding="12,6" Margin="0,0,6,0"/>
            </StackPanel>
        </Border>

        <!-- ══════════════════════════════════════════════════════
             ROW 3: Main Content Area
             ══════════════════════════════════════════════════════ -->
        <Grid Grid.Row="3">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>        <!-- Sound List / Grid -->
                <ColumnDefinition Width="220"/>      <!-- Device Panel -->
            </Grid.ColumnDefinitions>

            <!-- ─── Left: Sound List View ─────────────────────── -->
            <ListView x:Name="lvSounds" Grid.Column="0"
                      Style="{StaticResource DarkListView}"
                      ItemContainerStyle="{StaticResource SoundListItemStyle}"
                      SelectionMode="Extended"
                      MouseDoubleClick="SoundList_DoubleClick"
                      BorderThickness="0"
                      Margin="0">
                <ListView.View>
                    <GridView>
                        <GridView.ColumnHeaderContainerStyle>
                            <Style TargetType="GridViewColumnHeader">
                                <Setter Property="Background" Value="{StaticResource BgMediumBrush}"/>
                                <Setter Property="Foreground" Value="{StaticResource TextSecondaryBrush}"/>
                                <Setter Property="BorderBrush" Value="{StaticResource BorderBrush}"/>
                                <Setter Property="BorderThickness" Value="0,0,1,1"/>
                                <Setter Property="Padding" Value="10,6"/>
                                <Setter Property="FontSize" Value="11"/>
                                <Setter Property="FontWeight" Value="SemiBold"/>
                            </Style>
                        </GridView.ColumnHeaderContainerStyle>

                        <GridViewColumn Header="▶" Width="30">
                            <GridViewColumn.CellTemplate>
                                <DataTemplate>
                                    <Ellipse Width="8" Height="8" Margin="4,0"
                                             Fill="{Binding IsPlaying, Converter={StaticResource IsPlayingToColor}}"/>
                                </DataTemplate>
                            </GridViewColumn.CellTemplate>
                        </GridViewColumn>

                        <GridViewColumn Header="Name" Width="160"
                                        DisplayMemberBinding="{Binding Name}"/>

                        <GridViewColumn Header="File" Width="180"
                                        DisplayMemberBinding="{Binding FileName}"/>

                        <GridViewColumn Header="Hot Key" Width="130"
                                        DisplayMemberBinding="{Binding HotkeyDisplay}"/>

                        <GridViewColumn Header="Vol" Width="50">
                            <GridViewColumn.CellTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding Volume, Converter={StaticResource VolumeToPercent}}"
                                               Foreground="{StaticResource TextSecondaryBrush}" FontSize="11"/>
                                </DataTemplate>
                            </GridViewColumn.CellTemplate>
                        </GridViewColumn>

                        <GridViewColumn Header="🔁" Width="35">
                            <GridViewColumn.CellTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding Loop}" FontSize="10"
                                               Foreground="{StaticResource TextDimBrush}"/>
                                </DataTemplate>
                            </GridViewColumn.CellTemplate>
                        </GridViewColumn>
                    </GridView>
                </ListView.View>
            </ListView>

            <!-- ─── Left: Button Grid View (hidden by default) ── -->
            <ScrollViewer x:Name="gridViewPanel" Grid.Column="0"
                          VerticalScrollBarVisibility="Auto"
                          Visibility="Collapsed"
                          Background="{StaticResource BgDarkBrush}">
                <WrapPanel x:Name="wpButtons" Margin="8"
                           HorizontalAlignment="Left"/>
            </ScrollViewer>

            <!-- ─── Right: Device & Volume Panel ──────────────── -->
            <Border Grid.Column="1" Background="{StaticResource BgDarkBrush}"
                    BorderBrush="{StaticResource BorderBrush}" BorderThickness="1,0,0,0"
                    Padding="12,8">
                <StackPanel>
                    <!-- Volume Controls -->
                    <TextBlock Text="V O L U M E" FontSize="10" FontWeight="Bold"
                               Foreground="{StaticResource TextDimBrush}" Margin="0,0,0,8"/>

                    <!-- Local Volume -->
                    <StackPanel Margin="0,0,0,12">
                        <Grid Margin="0,0,0,4">
                            <TextBlock Text="🔊 Local" FontSize="11"
                                       Foreground="{StaticResource TextSecondaryBrush}"/>
                            <TextBlock x:Name="lblLocalVol" Text="80%" FontSize="11"
                                       Foreground="{StaticResource AccentBlueBrush}"
                                       HorizontalAlignment="Right"/>
                        </Grid>
                        <Slider x:Name="sliderLocalVolume" Style="{StaticResource DarkSlider}"
                                Value="80" Minimum="0" Maximum="100"
                                ValueChanged="LocalVolume_Changed"/>
                    </StackPanel>

                    <!-- Virtual Mic Volume -->
                    <StackPanel Margin="0,0,0,16">
                        <Grid Margin="0,0,0,4">
                            <TextBlock Text="🎤 Virtual Mic" FontSize="11"
                                       Foreground="{StaticResource TextSecondaryBrush}"/>
                            <TextBlock x:Name="lblMicVol" Text="80%" FontSize="11"
                                       Foreground="{StaticResource AccentRedBrush}"
                                       HorizontalAlignment="Right"/>
                        </Grid>
                        <Slider x:Name="sliderMicVolume" Style="{StaticResource RedSlider}"
                                Value="80" Minimum="0" Maximum="100"
                                ValueChanged="MicVolume_Changed"/>
                    </StackPanel>

                    <Separator Background="{StaticResource BorderBrush}" Margin="0,0,0,12"/>

                    <!-- Device List -->
                    <Grid Margin="0,0,0,8">
                        <TextBlock Text="DEVICES" FontSize="10" FontWeight="Bold"
                                   Foreground="{StaticResource TextDimBrush}"/>
                        <Button Content="🔄" Style="{StaticResource DarkButton}" Padding="4,2"
                                HorizontalAlignment="Right" FontSize="10"
                                Click="RefreshDevices_Click" ToolTip="Refresh device list"/>
                    </Grid>

                    <ScrollViewer MaxHeight="250" VerticalScrollBarVisibility="Auto">
                        <StackPanel x:Name="spDevices"/>
                    </ScrollViewer>

                    <Separator Background="{StaticResource BorderBrush}" Margin="0,12,0,12"/>

                    <!-- Options -->
                    <TextBlock Text="OPTIONS" FontSize="10" FontWeight="Bold"
                               Foreground="{StaticResource TextDimBrush}" Margin="0,0,0,8"/>
                    <CheckBox x:Name="chkOverlap" Content="Allow Overlap"
                              Style="{StaticResource DarkCheckBox}" Margin="0,0,0,6"
                              IsChecked="True"
                              Checked="OverlapToggle_Changed" Unchecked="OverlapToggle_Changed"/>
                    <CheckBox x:Name="chkMinTray" Content="Minimize to Tray"
                              Style="{StaticResource DarkCheckBox}" Margin="0,0,0,6"
                              IsChecked="True"/>
                    <CheckBox x:Name="chkAutoMuteMic" Content="Auto-Mute Mic"
                              Style="{StaticResource DarkCheckBox}" Margin="0,0,0,6"
                              IsChecked="False"
                              Checked="AutoMuteMicToggle_Changed" Unchecked="AutoMuteMicToggle_Changed"
                              ToolTip="Automatically mutes your default physical microphone when playing soundboard audio, and unmutes it when finished."/>
                    <CheckBox x:Name="chkSuppressHotkeys" Content="Block Hotkey Keypress"
                              Style="{StaticResource DarkCheckBox}" Margin="0,0,0,6"
                              IsChecked="False"
                              Checked="SuppressHotkeysToggle_Changed" Unchecked="SuppressHotkeysToggle_Changed"
                              ToolTip="If checked, global hotkey combinations will not be passed to active applications (e.g. they won't type in games/chat)."/>
                </StackPanel>
            </Border>
        </Grid>

        <!-- ══════════════════════════════════════════════════════
             ROW 4: Bottom Bar - Hotkey Capture + Sound Config
             ══════════════════════════════════════════════════════ -->
        <Border Grid.Row="4" Background="{StaticResource BgDarkBrush}"
                BorderBrush="{StaticResource BorderBrush}" BorderThickness="0,1,0,0"
                Padding="12,8">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="Auto"/>
                </Grid.ColumnDefinitions>

                <!-- Hotkey Capture -->
                <StackPanel Grid.Column="0" Orientation="Horizontal" VerticalAlignment="Center">
                    <TextBlock Text="Hotkey:" FontSize="11" Foreground="{StaticResource TextSecondaryBrush}"
                               VerticalAlignment="Center" Margin="0,0,6,0"/>
                    <TextBox x:Name="txtHotkey" Style="{StaticResource DarkTextBox}"
                             Width="130" IsReadOnly="True" TextAlignment="Center"
                             PreviewKeyDown="HotkeyCapture_KeyDown"
                             GotFocus="HotkeyCapture_GotFocus"
                             LostFocus="HotkeyCapture_LostFocus"
                             ToolTip="Click and press key combination to set hotkey"/>
                    <Button Content="Set" Style="{StaticResource GreenButton}"
                            Click="SetHotkey_Click" Padding="10,4" Margin="4,0,0,0"/>
                    <Button Content="Clear" Style="{StaticResource DarkButton}"
                            Click="ClearHotkey_Click" Padding="10,4" Margin="4,0,0,0"/>
                </StackPanel>

                <!-- Per-sound Volume -->
                <StackPanel Grid.Column="1" Orientation="Horizontal" VerticalAlignment="Center"
                            Margin="20,0,0,0">
                    <TextBlock Text="Sound Vol:" FontSize="11"
                               Foreground="{StaticResource TextSecondaryBrush}"
                               VerticalAlignment="Center" Margin="0,0,6,0"/>
                    <Slider x:Name="sliderSoundVolume" Style="{StaticResource DarkSlider}"
                            Width="100" Value="100" Minimum="0" Maximum="100"
                            ValueChanged="SoundVolume_Changed"/>
                    <TextBlock x:Name="lblSoundVol" Text="100%" FontSize="11"
                               Foreground="{StaticResource AccentBlueBrush}"
                               VerticalAlignment="Center" Margin="6,0,0,0"/>
                </StackPanel>

                <!-- Loop Toggle -->
                <CheckBox Grid.Column="2" x:Name="chkLoop" Content="🔁 Loop"
                          Style="{StaticResource DarkCheckBox}"
                          VerticalAlignment="Center" Margin="20,0,0,0"
                          Checked="LoopToggle_Changed" Unchecked="LoopToggle_Changed"/>

                <!-- Drag & Drop hint -->
                <TextBlock Grid.Column="3" Text="📂 Drag audio files here to add"
                           FontSize="10" Foreground="{StaticResource TextDimBrush}"
                           VerticalAlignment="Center" FontStyle="Italic"/>
            </Grid>
        </Border>

        <!-- ══════════════════════════════════════════════════════
             ROW 5: Status Bar
             ══════════════════════════════════════════════════════ -->
        <Border Grid.Row="5" Background="{StaticResource BgDarkestBrush}"
                Padding="12,4">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                
                <TextBlock Grid.Column="0" x:Name="lblStatus" Text="Ready" FontSize="10"
                           Foreground="{StaticResource TextDimBrush}"/>
                           
                <StackPanel Grid.Column="1" Orientation="Horizontal" HorizontalAlignment="Center">
                    <TextBlock x:Name="lblAdminStatus" Text="🛡️ Admin Mode" FontSize="10" FontWeight="SemiBold" Foreground="{StaticResource AccentGreenBrush}" Margin="0,0,12,0" ToolTip="Running with administrator privileges. Global keybinds will work in elevated games like BGMI. Note: Drag &amp; drop files is disabled by Windows in admin mode. Use the 'Add Sound' button instead." Visibility="Collapsed"/>
                    <TextBlock Text="Made by " FontSize="10" Foreground="{StaticResource TextDimBrush}"/>
                    <TextBlock Text="Kunal Choudhary" FontSize="10" FontWeight="SemiBold" Foreground="{StaticResource AccentRedBrush}"/>
                </StackPanel>
                
                <TextBlock Grid.Column="2" x:Name="lblSoundCount" Text="0 sounds"
                           FontSize="10" Foreground="{StaticResource TextDimBrush}"
                           HorizontalAlignment="Right"/>
            </Grid>
        </Border>
    </Grid>
</Window>