/* Asguard Terminal Messenger v2.0 - Client Styles (v2.2 Visual Update) */
.terminal-messenger { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 2000000; display: none; font-family: 'Fira Code', monospace; background: rgba(13, 17, 23, 0.7); backdrop-filter: blur(3px); }
.terminal-messenger.open { display: flex; }
.terminal-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; cursor: pointer; }
.terminal-container { width: 80%; max-width: 750px; height: 400px; margin: auto; background: #0d1117; border: 1px solid #30363d; display: flex; flex-direction: column; position: relative; box-shadow: 0 0 50px rgba(0,0,0,0.9); padding: 20px; z-index: 2; }
.terminal-header { border-bottom: 1px solid #30363d; padding-bottom: 10px; margin-bottom: 10px; text-align: center; }
.terminal-glitch { color: var(--asguard-orange); font-weight: 900; font-size: 1.2em; position: relative; }
.terminal-status-line { font-size: 9px; color: #7f8c8d; margin-top: 3px; display: flex; align-items: center; justify-content: center; gap: 5px; }
.status-indicator { width: 5px; height: 5px; background: #00ff00; border-radius: 50%; box-shadow: 0 0 5px #00ff00; }
.terminal-output { flex: 1; overflow-y: auto; padding-right: 10px; margin-bottom: 10px; scrollbar-width: thin; scrollbar-color: #30363d transparent; text-align: left !important; }
.terminal-line { margin-bottom: 8px; line-height: 1.3; font-size: 13px; }
.line-meta { font-size: 9px; opacity: 0.3; display: block; }
.line-visitor { color: #eff0f1 !important; }
.line-operator { color: var(--asguard-orange) !important; }
.line-system { color: var(--asguard-blue); opacity: 0.6; }

/* Input Footer v2.2 */
.terminal-input-wrapper { display: flex; gap: 12px; align-items: flex-end; border-top: 1px solid #30363d; padding-top: 10px; }
.terminal-prompt { color: var(--asguard-orange); font-weight: bold; margin-bottom: 2px; }
.terminal-icon-btn { color: var(--asguard-orange); cursor: pointer; opacity: 0.7; transition: 0.3s; padding-bottom: 2px; font-size: 16px; }
.terminal-icon-btn:hover { opacity: 1; text-shadow: 0 0 5px var(--asguard-orange); }

/* Horizontal Feather Icon (Fountain Pen Style) */
.terminal-send-feather { transform: rotate(45deg); margin-bottom: 2px; }

.input-container { position: relative; flex: 1; display: flex; align-items: center; }
#terminal-input { 
    width: 100%; 
    background: transparent; 
    border: none; 
    color: #eff0f1; 
    font-family: inherit; 
    font-size: 13px; 
    resize: none; 
    outline: none; 
    padding: 0; 
    overflow: hidden; 
    height: 20px; 
    line-height: 20px;
    text-align: left; 
}

/* Placeholder Styling */
#terminal-input::placeholder { 
    color: var(--asguard-orange); 
    opacity: 0.3; 
    text-align: left; 
    text-transform: uppercase;
    font-size: 11px;
}

.terminal-cursor { 
    position: absolute; 
    left: 0;
    bottom: 2px; 
    color: var(--asguard-orange); 
    animation: blink 1s step-end infinite; 
    pointer-events: none; 
}

.terminal-modal { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #0d1117; z-index: 10; display: flex; align-items: center; justify-content: center; }
.modal-content { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; }
.modal-content-wide { display: flex; flex-direction: column; align-items: center; width: 80%; }
.terminal-input-row { width: 100%; max-width: 300px; display: flex; gap: 10px; align-items: center; background: #161b22; border: 1px solid #30363d; padding: 5px 10px; margin-bottom: 15px; }
.terminal-input-row input { background: transparent; border: none; color: var(--asguard-orange); font-family: inherit; outline: none; width: 100%; }
.terminal-field, .terminal-area { width:100%; background: #161b22; border: 1px solid #30363d; color: #fff; padding: 8px; margin-bottom: 10px; font-family: inherit; outline: none; }
.terminal-area { height: 80px; resize: none; }
.terminal-btn { background: transparent; border: 1px solid var(--asguard-orange); color: var(--asguard-orange); padding: 8px 20px; cursor: pointer; font-family: inherit; font-weight: bold; font-size: 12px; transition: 0.3s; }
.terminal-btn:hover { background: var(--asguard-orange); color: #000; }
#terminal-mute-btn { margin-left: 15px; cursor: pointer; color: var(--asguard-orange); font-size: 10px; font-weight: bold; }
@keyframes blink { 50% { opacity: 0; } }
