.profile-container {
      max-width: 200px;
      background: black;
      border-radius: 12px;
      box-shadow: 0px 4px 15px rgba(0,0,0,0.1);
      padding: 30px;
      color:white;
    }

    .avatar {
      display: flex;
      justify-content: center;
    }
    .avatar img {
      width:120px; 
      height:120px; 
      border-radius:50%;
      border:3px solid #ddd;
    }

    h2 {
      margin-top:15px; 
    }

    .mood-section, .todo-section {
      margin-top:25px;
    }
    
    label {
        font-weight:bold; 
        display:block; 
        margin-bottom:5px;
    }

    input[type="textgeren"] {
        width:100%; 
        padding:10px; 
        border-radius:6px; 
        border:1px solid #ccc; 
        margin-bottom:10px;
        color:black;
    }

    button {
        padding:8px 16px; 
        background:cadetblue; 
        color:white; 
        border:none; 
        border-radius:6px; 
        cursor:pointer;
    }
    

    
     .delete-btn{
         background:red ;color:white ;border:none ;border-radius :4 px;padding :3 px 8 px ;
         cursor:pointer ;
     }
     .delete-btn:hover{background:#c0392b;}
     
     .mood-display .todoDisplay{
         font-size :16 px;color:#555;margin-top :8 px;background:#fafafa;padding :10 px;border-radius :6 px;border-left :4 px solid #2196F3
     }
     
.geren-input {
  width:115px;
  border-radius:3px;
  border:none;
  font-size:11px;
  padding:4px;
  background:white;
  box-shadow: inset 0px 1px 0px 0px rgba(0, 0, 0, 0.03), inset 0px 3px 0px 0px rgba(0, 0, 0, 0.02);
  outline:none; 
  resize:none; 
  height :28px; 
  line-height :28px; 
  color:black ; 
}
#btn-login {
    background-color: cadetblue;
    margin-right: 10px;
    color:white;
}
#btn-register {
    background-color: #5cae97;
    color:white;
}
.input-wrapper{
    padding: 5px;
}
#gerendengru{
    margin-top:15%;
}