Added gray boxes around HP

app/src/main/java/com/github/nacabaro/vbhelper/screens/BattlesScreen.kt

@@ -731,6 +731,17 @@ fun MiddleBattleView(
             }
             */
 
+            // Enemy HP bar and text with background box
+            Box(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .background(
+                        color = Color.Gray.copy(alpha = 0.6f),
+                        shape = androidx.compose.foundation.shape.RoundedCornerShape(8.dp)
+                    )
+                    .padding(8.dp)
+            ) {
+                Column {
                     // Enemy HP bar (top)
                     LinearProgressIndicator(
                         progress = battleSystem.opponentHP / (opponentCharacter?.baseHp?.toFloat() ?: 100f),
@@ -741,6 +752,8 @@ fun MiddleBattleView(
                         trackColor = Color.Gray
                     )
 
+                    Spacer(modifier = Modifier.height(4.dp))
+
                     // Enemy HP display numbers
                     Text(
                         text = "Enemy HP: ${battleSystem.opponentHP.toInt()}/${opponentCharacter?.baseHp ?: 100}",
@@ -754,6 +767,8 @@ fun MiddleBattleView(
                             )
                         )
                     )
+                }
+            }
 
             Spacer(modifier = Modifier.height(16.dp))
 
@@ -956,6 +971,17 @@ fun MiddleBattleView(
 
             Spacer(modifier = Modifier.height(6.dp))
 
+            // Player HP bar and text with background box
+            Box(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .background(
+                        color = Color.Gray.copy(alpha = 0.6f),
+                        shape = androidx.compose.foundation.shape.RoundedCornerShape(8.dp)
+                    )
+                    .padding(8.dp)
+            ) {
+                Column {
                     // Player HP bar
                     LinearProgressIndicator(
                         progress = battleSystem.playerHP / (activeCharacter?.baseHp?.toFloat() ?: 100f),
@@ -966,6 +992,8 @@ fun MiddleBattleView(
                         trackColor = Color.Gray
                     )
 
+                    Spacer(modifier = Modifier.height(4.dp))
+
                     // Player HP display numbers
                     Text(
                         text = "HP: ${battleSystem.playerHP.toInt()}/${activeCharacter?.baseHp ?: 100}",
@@ -979,6 +1007,8 @@ fun MiddleBattleView(
                             )
                         )
                     )
+                }
+            }
 
             Spacer(modifier = Modifier.height(6.dp))
 
@@ -1161,6 +1191,17 @@ fun PlayerBattleView(
             }
             */
 
+            // Health bar and text with background box
+            Box(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .background(
+                        color = Color.Gray.copy(alpha = 0.6f),
+                        shape = androidx.compose.foundation.shape.RoundedCornerShape(8.dp)
+                    )
+                    .padding(8.dp)
+            ) {
+                Column {
                     // Health bar
                     LinearProgressIndicator(
                         progress = battleSystem.playerHP / (activeCharacter?.baseHp?.toFloat() ?: 100f),
@@ -1171,6 +1212,8 @@ fun PlayerBattleView(
                         trackColor = Color.Gray
                     )
 
+                    Spacer(modifier = Modifier.height(4.dp))
+
                     // Health display numbers
                     Text(
                         text = "HP: ${battleSystem.playerHP.toInt()}/${activeCharacter?.baseHp ?: 100}",
@@ -1185,6 +1228,8 @@ fun PlayerBattleView(
                         )
                     )
                 }
+            }
+        }
 
         // Middle section: Player Digimon only
         Box(
@@ -1474,6 +1519,17 @@ fun EnemyBattleView(
                 .fillMaxWidth()
                 .padding(16.dp)
         ) {
+            // Enemy HP bar and text with background box
+            Box(
+                modifier = Modifier
+                    .fillMaxWidth()
+                    .background(
+                        color = Color.Gray.copy(alpha = 0.6f),
+                        shape = androidx.compose.foundation.shape.RoundedCornerShape(8.dp)
+                    )
+                    .padding(8.dp)
+            ) {
+                Column {
                     // Enemy HP bar
                     LinearProgressIndicator(
                         progress = battleSystem.opponentHP / (activeCharacter?.baseHp?.toFloat() ?: 100f),
@@ -1484,6 +1540,8 @@ fun EnemyBattleView(
                         trackColor = Color.Gray
                     )
 
+                    Spacer(modifier = Modifier.height(4.dp))
+
                     // Enemy HP display numbers
                     Text(
                         text = "Enemy HP: ${battleSystem.opponentHP.toInt()}/${activeCharacter?.baseHp ?: 100}",
@@ -1498,6 +1556,8 @@ fun EnemyBattleView(
                         )
                     )
                 }
+            }
+        }
 
         // Middle section: Enemy Digimon
         Box(