<UserControl x:Class="PerformanceMonitorDashboard.Controls.ServerHealthCard"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             mc:Ignorable="d"
             d:DesignHeight="220" d:DesignWidth="320"
             Background="Transparent"
             MouseLeftButtonDown="Card_MouseLeftButtonDown"
             Cursor="Hand">
    <UserControl.ContextMenu>
        <ContextMenu>
            <MenuItem Header="Open in New Tab" Click="OpenInNewTab_Click">
                <MenuItem.Icon><TextBlock Text="&#x1F5C2;"/></MenuItem.Icon>
            </MenuItem>
            <MenuItem Header="Edit Server..." Click="EditServer_Click">
                <MenuItem.Icon><TextBlock Text="&#x270F;"/></MenuItem.Icon>
            </MenuItem>
            <MenuItem Header="Check Server Version" Click="CheckVersion_Click">
                <MenuItem.Icon><TextBlock Text="&#x1F504;"/></MenuItem.Icon>
            </MenuItem>
        </ContextMenu>
    </UserControl.ContextMenu>
    <UserControl.Resources>
        <ResourceDictionary>
            <!-- Severity to color converter -->
            <Style x:Key="SeverityIndicator" TargetType="Ellipse">
                <Setter Property="Width" Value="10"/>
                <Setter Property="Height" Value="10"/>
                <Setter Property="VerticalAlignment" Value="Center"/>
                <Setter Property="Margin" Value="0,0,6,0"/>
            </Style>

            <Style x:Key="MetricLabel" TargetType="TextBlock">
                <Setter Property="Foreground" Value="{DynamicResource ForegroundBrush}"/>
                <Setter Property="FontSize" Value="11"/>
                <Setter Property="VerticalAlignment" Value="Center"/>
                <Setter Property="Width" Value="62"/>
            </Style>

            <Style x:Key="MetricValue" TargetType="TextBlock">
                <Setter Property="Foreground" Value="{DynamicResource ForegroundBrush}"/>
                <Setter Property="FontSize" Value="11"/>
                <Setter Property="VerticalAlignment" Value="Center"/>
                <Setter Property="FontWeight" Value="SemiBold"/>
                <Setter Property="Margin" Value="0,0,8,0"/>
            </Style>

            <Style x:Key="MetricDetail" TargetType="TextBlock">
                <Setter Property="Foreground" Value="{DynamicResource ForegroundBrush}"/>
                <Setter Property="FontSize" Value="11"/>
                <Setter Property="VerticalAlignment" Value="Center"/>
                <Setter Property="Margin" Value="6,0,0,0"/>
            </Style>
        </ResourceDictionary>
    </UserControl.Resources>

    <Border x:Name="CardBorder"
            Background="{DynamicResource BackgroundLightBrush}"
            BorderBrush="{DynamicResource BorderBrush}"
            BorderThickness="2"
            CornerRadius="6"
            Padding="16"
            Margin="6">
        <Border.Style>
            <Style TargetType="Border">
                <Style.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="BorderBrush" Value="{DynamicResource AccentBrush}"/>
                    </Trigger>
                </Style.Triggers>
            </Style>
        </Border.Style>

        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>

            <!-- Header: Server Name + Overall Status -->
            <Grid Grid.Row="0" Margin="0,0,0,8">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="Auto"/>
                </Grid.ColumnDefinitions>

                <TextBlock x:Name="ServerNameText"
                           Grid.Column="0"
                           Text="{Binding DisplayName}"
                           FontSize="14"
                           FontWeight="Bold"
                           Foreground="{DynamicResource ForegroundBrush}"
                           TextTrimming="CharacterEllipsis"
                           ToolTip="{Binding ServerName}"/>

                <!-- Overall status indicator -->
                <Ellipse x:Name="OverallStatusIndicator"
                         Grid.Column="1"
                         Width="12"
                         Height="12"
                         VerticalAlignment="Center"/>
            </Grid>

            <!-- Connection Status -->
            <TextBlock x:Name="ConnectionStatusText"
                       Grid.Row="1"
                       Text="{Binding ConnectionStatusText}"
                       FontSize="11"
                       Foreground="{DynamicResource ForegroundMutedBrush}"
                       Margin="0,0,0,8"/>

            <!-- Metrics Grid -->
            <Grid Grid.Row="2" x:Name="MetricsGrid">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                </Grid.RowDefinitions>

                <!-- CPU (combined SQL + Other) -->
                <Ellipse x:Name="CpuIndicator" Grid.Row="0" Grid.Column="0" Style="{StaticResource SeverityIndicator}" Margin="0,2,6,2"/>
                <TextBlock Grid.Row="0" Grid.Column="1" Text="CPU:" Style="{StaticResource MetricLabel}"/>
                <TextBlock Grid.Row="0" Grid.Column="2" Text="{Binding CpuDisplayText}" Style="{StaticResource MetricValue}"/>
                <TextBlock Grid.Row="0" Grid.Column="3" Text="{Binding CpuDetailText}" Style="{StaticResource MetricDetail}"/>

                <!-- Threads -->
                <Ellipse x:Name="ThreadsIndicator" Grid.Row="1" Grid.Column="0" Style="{StaticResource SeverityIndicator}" Margin="0,2,6,2"/>
                <TextBlock Grid.Row="1" Grid.Column="1" Text="Threads:" Style="{StaticResource MetricLabel}"/>
                <TextBlock Grid.Row="1" Grid.Column="2" Text="{Binding ThreadsDisplayText}" Style="{StaticResource MetricValue}"/>
                <TextBlock Grid.Row="1" Grid.Column="3" Text="{Binding ThreadsDetailText}" Style="{StaticResource MetricDetail}"/>

                <!-- Memory -->
                <Ellipse x:Name="MemoryIndicator" Grid.Row="2" Grid.Column="0" Style="{StaticResource SeverityIndicator}" Margin="0,2,6,2"/>
                <TextBlock Grid.Row="2" Grid.Column="1" Text="Memory:" Style="{StaticResource MetricLabel}"/>
                <TextBlock Grid.Row="2" Grid.Column="2" Text="{Binding MemoryDisplayText}" Style="{StaticResource MetricValue}"/>
                <TextBlock Grid.Row="2" Grid.Column="3" Text="{Binding MemoryDetailText}" Style="{StaticResource MetricDetail}"/>

                <!-- Blocking -->
                <Ellipse x:Name="BlockingIndicator" Grid.Row="3" Grid.Column="0" Style="{StaticResource SeverityIndicator}" Margin="0,2,6,2"/>
                <TextBlock Grid.Row="3" Grid.Column="1" Text="Blocking:" Style="{StaticResource MetricLabel}"/>
                <TextBlock Grid.Row="3" Grid.Column="2" Text="{Binding BlockingDisplayText}" Style="{StaticResource MetricValue}"/>
                <TextBlock Grid.Row="3" Grid.Column="3" Text="{Binding BlockingDetailText}" Style="{StaticResource MetricDetail}"/>

                <!-- Deadlocks -->
                <Ellipse x:Name="DeadlockIndicator" Grid.Row="4" Grid.Column="0" Style="{StaticResource SeverityIndicator}" Margin="0,2,6,2"/>
                <TextBlock Grid.Row="4" Grid.Column="1" Text="Deadlocks:" Style="{StaticResource MetricLabel}"/>
                <TextBlock Grid.Row="4" Grid.Column="2" Text="{Binding DeadlockDisplayText}" Style="{StaticResource MetricValue}"/>
                <TextBlock Grid.Row="4" Grid.Column="3" Text="{Binding DeadlockDetailText}" Style="{StaticResource MetricDetail}"/>

                <!-- Collectors -->
                <Ellipse x:Name="CollectorIndicator" Grid.Row="5" Grid.Column="0" Style="{StaticResource SeverityIndicator}" Margin="0,2,6,2"/>
                <TextBlock Grid.Row="5" Grid.Column="1" Text="Collectors:" Style="{StaticResource MetricLabel}"/>
                <TextBlock Grid.Row="5" Grid.Column="2" Text="{Binding CollectorDisplayText}" Style="{StaticResource MetricValue}"/>
                <TextBlock Grid.Row="5" Grid.Column="3" Text="{Binding CollectorDetailText}" Style="{StaticResource MetricDetail}"/>
            </Grid>

            <!-- Footer: Last Updated + Loading indicator -->
            <Grid Grid.Row="3" Margin="0,8,0,0">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="Auto"/>
                </Grid.ColumnDefinitions>

                <TextBlock x:Name="LastUpdatedText"
                           Grid.Column="0"
                           Text="{Binding LastUpdatedDisplay, StringFormat='Updated: {0}'}"
                           FontSize="10"
                           Foreground="{DynamicResource ForegroundDimBrush}"/>

                <!-- Loading spinner -->
                <TextBlock x:Name="LoadingIndicator"
                           Grid.Column="1"
                           Text="⟳"
                           FontSize="12"
                           Foreground="{DynamicResource AccentBrush}"
                           Visibility="Collapsed">
                    <TextBlock.Style>
                        <Style TargetType="TextBlock">
                            <Style.Triggers>
                                <DataTrigger Binding="{Binding IsLoading}" Value="True">
                                    <Setter Property="Visibility" Value="Visible"/>
                                </DataTrigger>
                            </Style.Triggers>
                        </Style>
                    </TextBlock.Style>
                    <TextBlock.RenderTransform>
                        <RotateTransform x:Name="LoadingRotation" CenterX="6" CenterY="6"/>
                    </TextBlock.RenderTransform>
                    <TextBlock.Triggers>
                        <EventTrigger RoutedEvent="Loaded">
                            <BeginStoryboard>
                                <Storyboard RepeatBehavior="Forever">
                                    <DoubleAnimation
                                        Storyboard.TargetName="LoadingRotation"
                                        Storyboard.TargetProperty="Angle"
                                        From="0" To="360"
                                        Duration="0:0:1"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </EventTrigger>
                    </TextBlock.Triggers>
                </TextBlock>
            </Grid>

            <!-- Offline overlay -->
            <Border x:Name="OfflineOverlay"
                    Grid.RowSpan="4"
                    Background="#80000000"
                    CornerRadius="4"
                    Visibility="Collapsed">
                <StackPanel VerticalAlignment="Center" HorizontalAlignment="Center">
                    <TextBlock Text="✗"
                               FontSize="24"
                               Foreground="#E57373"
                               HorizontalAlignment="Center"/>
                    <TextBlock Text="Offline"
                               FontSize="12"
                               Foreground="#E57373"
                               HorizontalAlignment="Center"
                               Margin="0,4,0,0"/>
                </StackPanel>
            </Border>
        </Grid>
    </Border>
</UserControl>
