.chat-container { width: 100vw; height: 100vh; display: flex; flex-direction: column; background: #000; }
.chat-header { 
    padding: 1rem 180px 1rem 3rem; /* Las loc 180px in dreapta pentru profil chip */
    background: rgba(0,0,0,0.85); border-bottom: 1px solid var(--border); 
    display: flex; justify-content: space-between; align-items: center; 
    backdrop-filter: blur(20px);
}
.chat-header .logo { font-size: 1.3rem; margin: 0; }

.chat-main { flex: 1; display: flex; background: radial-gradient(circle at center, #0a0f2d, #000); }
.chat-box { width: 420px; background: rgba(0,0,0,0.4); border-left: 1px solid var(--border); display: flex; flex-direction: column; }
.messages { flex: 1; padding: 2rem; overflow-y: auto; display: flex; flex-direction: column; gap: 1rem; }

.user-msg { background: rgba(255,255,255,0.04); padding: 12px 18px; border-radius: 18px; border: 1px solid var(--border); align-self: flex-start; max-width: 85%; }
.user-msg b { color: var(--primary); margin-right: 10px; font-weight: 800; }

.input-area { padding: 1.5rem 2rem; background: rgba(0,0,0,0.5); border-top: 1px solid var(--border); display: flex; gap: 15px; }
input { background: rgba(255,255,255,0.03); border: 1px solid var(--border); padding: 0.9rem 1.4rem; border-radius: 15px; color: white; outline: none; width: 100%; }

.waiting { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; gap: 20px; }
.loader { width: 50px; height: 50px; border: 5px solid rgba(255,255,255,0.1); border-top: 5px solid var(--primary); border-radius: 50%; animation: spin 1s infinite linear; }
@keyframes spin { 100% { transform: rotate(360deg); } }

@media (max-width: 1024px) {
    .chat-header { padding-right: 120px; }
    .chat-box { width: 100%; }
}
