<UserControl x:Class="NexusShell.Views.NotificationCenterOverlay"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             x:Name="Root"
             Background="#66040810"
             MouseDown="Overlay_OnMouseDown">
    <UserControl.Resources>
        <Style x:Key="NcSectionTitleStyle" TargetType="TextBlock">
            <Setter Property="FontSize" Value="10"/>
            <Setter Property="FontWeight" Value="Bold"/>
            <Setter Property="Foreground" Value="#8CA3C7"/>
            <Setter Property="Margin" Value="4,0,0,10"/>
        </Style>
        <Style x:Key="NcCardStyle" TargetType="Border">
            <Setter Property="CornerRadius" Value="20"/>
            <Setter Property="Padding" Value="16"/>
            <Setter Property="Margin" Value="0,0,0,16"/>
            <Setter Property="Background" Value="#C7051428"/>
            <Setter Property="BorderBrush" Value="#3800D9FF"/>
            <Setter Property="BorderThickness" Value="1"/>
            <Setter Property="Effect">
                <Setter.Value>
                    <DropShadowEffect Color="#00D9FF" BlurRadius="18" ShadowDepth="0" Opacity="0.12"/>
                </Setter.Value>
            </Setter>
        </Style>
        <Style x:Key="NcQuickTileStyle" TargetType="Button">
            <Setter Property="Width" Value="74"/>
            <Setter Property="Height" Value="74"/>
            <Setter Property="Margin" Value="0,0,8,8"/>
            <Setter Property="Cursor" Value="Hand"/>
            <Setter Property="Background" Value="#C7051428"/>
            <Setter Property="BorderBrush" Value="#3800D9FF"/>
            <Setter Property="BorderThickness" Value="1"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border x:Name="Tile" CornerRadius="16"
                                Background="{TemplateBinding Background}"
                                BorderBrush="{TemplateBinding BorderBrush}"
                                BorderThickness="{TemplateBinding BorderThickness}">
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter TargetName="Tile" Property="Background" Value="#408A4FFF"/>
                                <Setter TargetName="Tile" Property="BorderBrush" Value="#6600D9FF"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>

    <Border x:Name="PanelHost"
            Width="410"
            HorizontalAlignment="Right"
            VerticalAlignment="Stretch"
            Margin="0,84,28,115"
            CornerRadius="24"
            BorderThickness="1"
            BorderBrush="#598A4FFF"
            MouseDown="Panel_OnMouseDown"
            RenderTransformOrigin="1,0.5">
        <Border.RenderTransform>
            <TranslateTransform X="438"/>
        </Border.RenderTransform>
        <Border.Background>
            <SolidColorBrush Color="#C7051428"/>
        </Border.Background>
        <Border.Effect>
            <DropShadowEffect Color="#00D9FF" BlurRadius="45" ShadowDepth="0" Opacity="0.22"/>
        </Border.Effect>

        <ScrollViewer VerticalScrollBarVisibility="Auto" Padding="20,20,20,24">
            <StackPanel>
                <Grid Margin="0,0,0,16">
                    <TextBlock Text="Notification Center" FontSize="18" FontWeight="SemiBold"
                               Foreground="#FFFFFF"/>
                    <Button Content="Ryd alle"
                            HorizontalAlignment="Right"
                            Style="{StaticResource NexusGlassButtonStyle}"
                            Command="{Binding ClearNotificationsCommand}"/>
                </Grid>

                <TextBlock Text="SYSTEMSTATUS" Style="{StaticResource NcSectionTitleStyle}"/>
                <Border Style="{StaticResource NcCardStyle}">
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto"/>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>
                        <Grid Width="118" Height="118" Margin="0,0,14,0">
                            <Ellipse Width="118" Height="118" Stroke="#3322C55E" StrokeThickness="8"/>
                            <Ellipse Width="118" Height="118" Stroke="#22C55E" StrokeThickness="8"
                                     StrokeDashArray="3.5 1.5" RenderTransformOrigin="0.5,0.5">
                                <Ellipse.RenderTransform>
                                    <RotateTransform Angle="-90"/>
                                </Ellipse.RenderTransform>
                                <Ellipse.Effect>
                                    <DropShadowEffect Color="#22C55E" BlurRadius="16" ShadowDepth="0" Opacity="0.65"/>
                                </Ellipse.Effect>
                            </Ellipse>
                            <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
                                <TextBlock Text="{Binding HealthPercent, StringFormat={}{0}%}"
                                           FontSize="26" FontWeight="SemiBold" Foreground="#FFFFFF"
                                           HorizontalAlignment="Center"/>
                                <TextBlock Text="Sundhed" FontSize="11" Foreground="#8CA3C7" HorizontalAlignment="Center"/>
                            </StackPanel>
                        </Grid>
                        <StackPanel Grid.Column="1" VerticalAlignment="Center">
                            <TextBlock Text="✓  Tjenester" FontSize="13" Foreground="#FFFFFF" Margin="0,0,0,10"/>
                            <TextBlock Text="✓  Netværk" FontSize="13" Foreground="#FFFFFF" Margin="0,0,0,10"/>
                            <TextBlock Text="✓  Sikkerhed" FontSize="13" Foreground="#FFFFFF" Margin="0,0,0,10"/>
                            <TextBlock Text="✓  Opdateringer" FontSize="13" Foreground="#FFFFFF"/>
                        </StackPanel>
                    </Grid>
                </Border>

                <TextBlock Text="HURTIG ADGANG" Style="{StaticResource NcSectionTitleStyle}"/>
                <WrapPanel Margin="0,0,0,8">
                    <Button Style="{StaticResource NcQuickTileStyle}" Command="{Binding OpenSettingsCommand}"
                            ToolTip="Settings">
                        <Path Data="M12,8 C13.7,8 15,9.3 15,11 C15,12.7 13.7,14 12,14 C10.3,14 9,12.7 9,11 C9,9.3 10.3,8 12,8 Z"
                              Fill="#8CA3C7" Stretch="Uniform" Width="24" Height="24"/>
                    </Button>
                    <Button Style="{StaticResource NcQuickTileStyle}" Command="{Binding OpenDiagnosticsCommand}"
                            ToolTip="Diagnostics">
                        <Path Data="M4,14 L8,14 L10,8 L14,18 L16,14 L20,14"
                              Stroke="#8CA3C7" StrokeThickness="1.8" Stretch="Uniform" Width="28" Height="24"/>
                    </Button>
                    <Button Style="{StaticResource NcQuickTileStyle}" Command="{Binding OpenUpdateInfoCommand}"
                            ToolTip="Updates">
                        <Path Data="M12,4 L12,12 M12,12 L16,8 M12,12 L8,8"
                              Stroke="#8CA3C7" StrokeThickness="1.6" Stretch="Uniform" Width="24" Height="24"/>
                    </Button>
                    <Button Style="{StaticResource NcQuickTileStyle}" Command="{Binding OpenLauncherCommand}"
                            ToolTip="App Hub">
                        <UniformGrid Rows="2" Columns="2" Width="24" Height="24">
                            <Rectangle Fill="#8A4FFF" RadiusX="1" RadiusY="1" Margin="1"/>
                            <Rectangle Fill="#00D9FF" RadiusX="1" RadiusY="1" Margin="1"/>
                            <Rectangle Fill="#00D9FF" RadiusX="1" RadiusY="1" Margin="1"/>
                            <Rectangle Fill="#8A4FFF" RadiusX="1" RadiusY="1" Margin="1"/>
                        </UniformGrid>
                    </Button>
                </WrapPanel>

                <TextBlock Text="NOTIFIKATIONER" Style="{StaticResource NcSectionTitleStyle}"/>
                <Border Style="{StaticResource NcCardStyle}"
                        Visibility="{Binding HasNoNotifications, Converter={StaticResource BoolToVisibility}}">
                    <TextBlock Text="Ingen notifikationer" Foreground="#8CA3C7" FontSize="13"/>
                </Border>
                <ItemsControl ItemsSource="{Binding Notifications}" Margin="0,0,0,16">
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                            <Border Style="{StaticResource NcCardStyle}" Padding="12,10" Margin="0,0,0,0">
                                <Grid>
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="Auto"/>
                                        <ColumnDefinition Width="*"/>
                                        <ColumnDefinition Width="Auto"/>
                                    </Grid.ColumnDefinitions>
                                    <Border Width="38" Height="38" CornerRadius="12" Margin="0,0,12,0">
                                        <Border.Style>
                                            <Style TargetType="Border">
                                                <Setter Property="Background" Value="#3300D9FF"/>
                                                <Style.Triggers>
                                                    <DataTrigger Binding="{Binding Tone}" Value="success">
                                                        <Setter Property="Background" Value="#3322C55E"/>
                                                    </DataTrigger>
                                                    <DataTrigger Binding="{Binding Tone}" Value="accent">
                                                        <Setter Property="Background" Value="#338A4FFF"/>
                                                    </DataTrigger>
                                                </Style.Triggers>
                                            </Style>
                                        </Border.Style>
                                        <Ellipse Width="8" Height="8" Fill="#FFFFFF" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                                    </Border>
                                    <TextBlock Grid.Column="1" Text="{Binding Title}" FontSize="13"
                                               Foreground="#FFFFFF" TextWrapping="Wrap" VerticalAlignment="Center"/>
                                    <TextBlock Grid.Column="2" Text="{Binding Time}" FontSize="10"
                                               Foreground="#8CA3C7" VerticalAlignment="Top"/>
                                </Grid>
                            </Border>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>

                <TextBlock Text="KALENDER" Style="{StaticResource NcSectionTitleStyle}"/>
                <Border Style="{StaticResource NcCardStyle}" Margin="0">
                    <StackPanel>
                        <TextBlock Text="{Binding CalendarDateText}" FontSize="24" FontWeight="Light" Foreground="#FFFFFF"/>
                        <TextBlock Text="{Binding CalendarDayText}" FontSize="12" Foreground="#8CA3C7" Margin="0,4,0,10"/>
                        <TextBlock Text="Ingen kommende begivenheder" FontSize="12" Foreground="#8CA3C7" Opacity="0.8"/>
                    </StackPanel>
                </Border>
            </StackPanel>
        </ScrollViewer>
    </Border>
</UserControl>
