Improve Table Density and Spacing

WebApp/Components/Features/Events/Index.razor

@@ -14,7 +14,15 @@
     </ActionButtons>
 </PageHeader>
 
-<MudDataGrid T="EventDefinition" ServerData="ServerReload" @ref="_dataGrid" Filterable="true" RowsPerPage="50" >
+<MudPaper Elevation="2" Class="pa-4">
+    <MudDataGrid T="EventDefinition"
+                 ServerData="ServerReload"
+                 @ref="_dataGrid"
+                 Filterable="true"
+                 RowsPerPage="50"
+                 Dense="true"
+                 Striped="true"
+                 Hover="true">
         <Columns>
             <PropertyColumn Property="@(e => e.Name)" Title="Event Name" Sortable="true">
                 <CellTemplate>
@@ -58,6 +66,7 @@
             <MudDataGridPager T="EventDefinition"></MudDataGridPager>
         </PagerContent>
     </MudDataGrid>
+</MudPaper>
 
 @code {
     MudDataGrid<EventDefinition> _dataGrid = null!;

WebApp/Components/Features/Students/Index.razor

@@ -15,7 +15,15 @@
     </ActionButtons>
 </PageHeader>
 
-<MudDataGrid T="Student" ServerData="ServerReload" @ref="_dataGrid" Filterable="true" RowsPerPage="25">
+<MudPaper Elevation="2" Class="pa-4">
+    <MudDataGrid T="Student"
+                 ServerData="ServerReload"
+                 @ref="_dataGrid"
+                 Filterable="true"
+                 RowsPerPage="25"
+                 Dense="true"
+                 Striped="true"
+                 Hover="true">
         <Columns>
             <PropertyColumn Property="@(e => e.LastName)" Title="Name" Sortable="true">
                 <CellTemplate>
@@ -53,6 +61,7 @@
             <MudDataGridPager T="Student"></MudDataGridPager>
         </PagerContent>
     </MudDataGrid>
+</MudPaper>
 
 @code {
     MudDataGrid<Student> _dataGrid = null!;

WebApp/Components/Features/Teams/Index.razor

@@ -14,7 +14,15 @@
     </ActionButtons>
 </PageHeader>
 
-<MudDataGrid T="Team" ServerData="ServerReload" @ref="_dataGrid" Filterable="true" RowsPerPage="35">
+<MudPaper Elevation="2" Class="pa-4">
+    <MudDataGrid T="Team"
+                 ServerData="ServerReload"
+                 @ref="_dataGrid"
+                 Filterable="true"
+                 RowsPerPage="35"
+                 Dense="true"
+                 Striped="true"
+                 Hover="true">
         <Columns>
             <TemplateColumn Title="Event" Sortable="true" SortBy="@(t => t.Event.Name)">
                 <CellTemplate>
@@ -51,6 +59,7 @@
             <MudDataGridPager T="Team"></MudDataGridPager>
         </PagerContent>
     </MudDataGrid>
+</MudPaper>
 
 @code {
     MudDataGrid<Team> _dataGrid = null!;

docs/plans/style-improvements.md

@@ -60,7 +60,7 @@ This document outlines recommended style improvements to enhance the visual desi
 
 ---
 
-### 3. Improve Table Density and Spacing
+### 3. Improve Table Density and Spacing ✅ COMPLETED
 **Locations**: All MudDataGrid components
 
 **Current State**: Tables lack visual distinction between rows and don't have optimal spacing.
@@ -326,8 +326,8 @@ Consider using MudChip components with rank colors for better visual distinction
 
 ### Phase 1: Quick Wins (High Impact, Low Effort)
 1. ✅ Fix logout button (MudBlazor consistency)
-2. Add elevation to data grids and content containers
+2. ✅ Add elevation to data grids and content containers
-3. Add table density and hover properties
+3. ✅ Add table density and hover properties
 
 ### Phase 2: Visual Polish (Medium Impact, Medium Effort)
 4. Audit and ensure button hierarchy consistency