adaptive styles for file uploads

src/app/styles/pages-styles.scss

@@ -395,6 +395,11 @@
 			text-align: left;
 			display: flex;
 			justify-content: space-between;
+
+			@media (max-width: 500px) {
+				flex-direction: column;
+				gap: 10px;
+			}
 		}
 
 		.uploaded-image {
@@ -439,6 +444,10 @@
 			font-size: 16px;
 			transition: 0.3s;
 			min-width: 120px;
+
+			@media (max-width: 500px) {
+				max-height: 34px;
+			}
 		}
 
 		.btn:hover {
@@ -446,6 +455,50 @@
 			box-shadow: 0 8px 25px v.$shadow-1;
 		}
 	}
+
+	.selected-file-action-panel {
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		margin-bottom: 16px;
+
+		@media (max-width: 900px) {
+			flex-direction: column;
+		}
+	}
+
+	.selected-file-right-block {
+		display: flex;
+		align-items: center;
+
+		@media (max-width: 500px) {
+			flex-direction: column-reverse;
+			gap: 8px;
+		}
+
+		.upload-progress {
+			font-weight: 500;
+			font-size: 18px;
+			margin-right: 16px;
+
+			@media (max-width: 500px) {
+				margin-right: 0px;
+			}
+		}
+	}
+
+	.selected-file-action-info {
+		color: #374151;
+		font-weight: 500;
+		display: flex;
+		gap: 10px;
+	}
+
+	.selected-file-wrapper {
+		display: flex;
+		flex-direction: column;
+		gap: 16px;
+	}
 }
 
 .page-row {