a lot of changes

src/app/shared/header/header.page.scss

@@ -1,22 +1,22 @@
-@import '~src/function.scss';
+@import "~src/function.scss";
 
-.div-top-header{
+.div-top-header {
   margin: 0 em(20);
   // background-color: #0782c9;
   //padding-top: em(15px);
-  border: 0!important;
+  border: 0 !important;
 }
 
+.profile-image {
+  vertical-align: middle;
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+  display: block; /* Torna a imagem um elemento de bloco */
+  margin: 0 auto;
+}
 
-
-  .profile-image {
-    border-radius: 80%; /* Tornar a imagem circular */
-    width: 100%;
-    height: 25.33%;
-    overflow: auto;
-  }
-
-.div-logo{
+.div-logo {
   background: transparent;
   width: em(140);
   justify-content: center;
@@ -34,17 +34,17 @@
     }
   }
 
-  .logo-description{
+  .logo-description {
     width: 74.67%;
     margin: 0 auto;
     overflow: auto;
     font-size: 8.5px;
     font-family: Bahnschrift;
 
-    .logo-description-content{
+    .logo-description-content {
       width: 100%;
 
-      .logo-description-text{
+      .logo-description-text {
         font-weight: 700;
         text-align: center;
         width: 100%;
@@ -52,32 +52,31 @@
         padding: 0 !important;
       }
 
-      .add-line{
+      .add-line {
         width: 100%;
         border-bottom: 1px solid #000;
         margin-bottom: 2.5px !important;
         padding: 0 !important;
       }
 
-      .add-line-white{
+      .add-line-white {
         width: 100%;
         border-bottom: 1px solid #fff;
         margin-bottom: 2.5px !important;
         padding: 0 !important;
       }
     }
-    .color-white{
+    .color-white {
       color: #fff !important;
     }
 
-    .add-botton-border{
+    .add-botton-border {
       border-bottom: 1px solid #000;
     }
 
-    .add-botton-border-white{
+    .add-botton-border-white {
       border-bottom: 1px solid #fff;
     }
-
   }
 }
 
@@ -87,15 +86,15 @@
 }
 
 .div-profile {
-  height: fit-content;
+  width: 40px;
+  height: 40px;
+  text-align: center;
   background-color: transparent;
-  overflow: auto;
   display: flex !important;
-  justify-content: end;
-  max-width: 45px;
+  justify-content:space-around;
   border-radius: 50px;
 
-  .icon{
+  .icon {
     position: relative;
     border: none !important;
   }
@@ -105,15 +104,15 @@
     font-size: rem(12);
     color: white;
     text-align: center;
-    width:20px;
-    height:20px;
+    width: 20px;
+    height: 20px;
     border-radius: 35%;
     position: absolute; /* changed */
     top: 5px; /* changed */
     right: 27px; /* changed */
   }
 
-  .profile-text{
+  .profile-text {
     font-size: rem(20);
     font-weight: 300;
     width: fit-content;
@@ -125,43 +124,40 @@
   //border: 1px solid red;
 }
 
-.desktop { 
+.desktop {
   display: none;
 }
 
 @media only screen and (min-width: 1366px) {
-
-  .mobile{
+  .mobile {
     display: none !important;
   }
-  .desktop{
+  .desktop {
     display: block;
   }
-
 }
 
-.tab{
+.tab {
   height: 65px;
   cursor: pointer;
   user-select: none;
 }
 
-.tab:hover{
+.tab:hover {
   border-top: 7px solid var(--header-tab-text-white);
 }
-.active{
+.active {
   border-top: 7px solid var(--header-tab-text-white);
-  span{
+  span {
     font-weight: 650;
   }
 }
 
-
-.search-input-container{
+.search-input-container {
   background-color: white;
   border-radius: 27.5px;
   border: solid 1px #ebebeb;
-  .icon{
+  .icon {
     color: #797979;
     width: rem(45);
     height: rem(45);
@@ -170,15 +166,14 @@
     font-size: rem(25);
     align-items: center;
   }
-  .input-text{
+  .input-text {
     width: 100%;
   }
-  .icon-z{
+  .icon-z {
     width: 20px;
   }
 }
 
-
 .tab {
   color: var(--header-tab-text-white);
 }