update styles

src/app/styles/pages-styles.scss

@@ -19,7 +19,7 @@
 
 .protection-overview {
 	--text-color: v.$text-p;
-/* 	background: linear-gradient(135deg, v.$p-color 50%, v.$s-color 100%);
+	/* 	background: linear-gradient(135deg, v.$p-color 50%, v.$s-color 100%);
 	color: v.$white; */
 	color: var(--text-color);
 	border-radius: 20px;
@@ -75,10 +75,7 @@
 
 	.protection-stat {
 		padding: 15px;
-		/* background: rgba(255, 255, 255, 0.1); */
-		/* background-color: v.$b-color-1; */
-		/* background-color: v.$bg-light; */
-		box-shadow: 0 4px 20px v.$shadow-1;
+		border: 1px solid v.$b-color-2;
 		border-radius: 12px;
 		display: flex;
 		flex-direction: column;
@@ -123,6 +120,7 @@
 			font-size: 28px;
 			font-weight: 700;
 			margin-bottom: 5px;
+			color: v.$p-color;
 
 			&.btn {
 				user-select: none;
@@ -143,22 +141,12 @@
 		}
 
 		&-total-info {
-			position: absolute;
-			top: 10;
-			left: 10;
-			/* background-color: #1f293718; */
-			box-shadow: 0 4px 20px v.$shadow-1;
 			padding: 10px;
 			border-radius: 10;
 			font-size: 15px;
-		}
-
-		.stacked-bar-chart {
-			border-radius: 10;
-			width: 100%;
-			padding: 0 20px;
 			display: flex;
 			justify-content: center;
+			gap: 20px;
 		}
 
 		&-drop-down-list {
@@ -193,10 +181,20 @@
 			}
 		}
 
-		&:has(.stacked-bar-chart) {
-			height: 100%;
-			padding-left: 100px;
-		}
+	}
+
+	.stacked-bar-chart-wrapper {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+	}
+
+	.stacked-bar-chart {
+		border-radius: 10;
+		width: 100%;
+		padding: 0 20px;
+		display: flex;
+		justify-content: center;
 	}
 
 	&-switch {