.title_strip_message_container {
    position: fixed;
    top: 6%;
    left: 50%;
    transform: translateX(-50%);
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
    display:none;
    align-items:center;
    padding:0 12px;
    gap:12px;
    font:14px/1 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
    border-radius:10px;
    width: 80%;
    height: 5.5vh;
    z-index: 1001;
    animation-name: tilt-n-move-shaking, slideDown;
    animation-duration: 0.7s; /* How long the animation takes */
    animation-timing-function: ease-out; /* How the animation progresses over time */
    animation-fill-mode: forwards; /* Keeps the element at its final state */
}

.title_container_message {
    flex:1;
    min-width:0;
    white-space: revert;
    text-overflow:ellipsis;
    color: #ffffff;
    font-weight: bold;
    font-size:20px;
    font-family: 'Roboto', sans-serif;
}

.title_container_icon {
    width:40px;
    height:40px;
    flex:0 0 25px;
    display:block;
    color: #000000;
}

.display_green_title_message {
    background: #45d14f;
    border: 2px solid #7aff76;
    display: inline-flex;
}

.display_red_title_message {
    background: #d14545;
    border: 2px solid #ff7676;
    display: inline-flex;
}

@keyframes slideDown {
    from {
        transform: translate(-50%, -100%); /* Start above its initial position */
        opacity: 0; /* Optional: start invisible */
    }
    to {
        transform: translate(-50%, 0); /* End at its original vertical position */
        opacity: 1; /* Optional: end fully visible */
    }
}

@keyframes tilt-n-move-shaking {
    0% {  }
    25% { transform: translate(5px, 5px) rotate(5deg); }
    50% { transform: translate(0, 0) rotate(0eg); }
    75% { transform: translate(-5px, 5px) rotate(-5deg); }
    100% { transform: translate(0, 0) rotate(0deg); }
}