body {
 background-color: #0f0f1b;
 font-family: Arial, sans-serif;
 color: white;
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
 min-height: 100vh;
 margin: 0;
}

.custom-large {
 max-width: 900px;
 width: 900px;
}

textarea {
 width: 750px;
 padding: 5px;
 font-size: 18px;
 resize: none;
}

.textarea_agent {
 width: 750px;       /* or any fixed value like 400px */
 height: 100%;     /* sets vertical size */
 padding: 5px;
 resize: none;   /* allow vertical resizing only */
 font-size: 18px;
}

.content_agent {
 background-color: #111111;
 padding: 10px;
 border-radius: 5px;
 text-align: center;
 max-width: 750px;
 width: 750px;
 height: 300px;
}

.textarea_user {
 width: 750px;       /* or any fixed value like 400px */
 height: 100%;     /* sets vertical size */
 padding: 5px;
 resize: none;  /* allow vertical resizing only */
 font-size: 18px;
}

.content_user {
 background-color: #111111;
 padding: 10px;
 border-radius: 5px;
 text-align: center;
 max-width: 750px;
 width: 750px;
 height: 80px;
}

#toggleEffect {
 margin-bottom: 30px;
 padding: 10px 20px;
 font-size: 14px;
 border: none;
 background: #ffffff22;
 color: white;
 border-radius: 5px;
 cursor: pointer;
}

.animated-border-box {
 position: relative;
 padding: 3px;
 border-radius: 5px;
 transition: all 0.5s ease;
}

.animated-border-box.flashy {
 background: transparent;
 border: 5px solid white;
}

.animated-border-box.flashy:hover {
 background: linear-gradient(270deg, #ff0057, #00ffae, #0099ff, #ff00c3);
 background-size: 600% 600%;
 animation: borderMove 4s ease infinite;
 border: 5px solid white;
}

.animated-border-box.flashy::before {
 content: "";
 position: absolute;
 top: -3px;
 bottom: -3px;
 left: -3px;
 right: -3px;
 background: inherit;
 background-size: inherit;
 z-index: -1;
 border-radius: 5px;
 filter: blur(4px);
 animation: borderMove 4s ease infinite;
}

.animated-border-box.simple {
 background: transparent;
 border: 5px solid gray;
}

.animated-border-box.simple::before {
 display: none;
 background: transparent;
 border: 5px solid gray;
}

@keyframes borderMove {
 0%   { background-position: 0% 50%; }
 50%  { background-position: 100% 50%; }
 100% { background-position: 0% 50%; }
}

.text_box {
 background: transparent;
 color: white;
 border: 5px;
 font-size: 18px;
}

.text_box:hover {
 background: transparent;
 color: white;
 border: 5px;
 font-size: 18px;
}

.text_box:focus {
 border: none;
 outline: none;
}
