.nightshade-chat {
display: flex;
flex-direction: column;
min-height: 0;
height: 100%;
border: 1px solid var(--nightshade-panel-border);
border-radius: 9px;
overflow: hidden;
}
.nightshade-chat-head {
display: flex;
align-items: center;
gap: 8px;
padding: 8px 12px;
border-bottom: 1px solid var(--nightshade-panel-border);
background: var(--nightshade-panel-2);
font-size: 12px;
}
.nightshade-chat-status {
width: 8px;
height: 8px;
border-radius: 50%;
background: var(--nightshade-text-dim);
}
.nightshade-chat-status.online {
background: #4ade80;
}
.nightshade-chat-status-text {
color: var(--nightshade-text-dim);
}
.nightshade-chat-spacer {
flex: 1 1 auto;
}
.nightshade-chat-reset {
padding: 3px 10px;
border: 1px solid var(--nightshade-panel-border);
border-radius: 6px;
background: var(--nightshade-input-bg);
color: var(--nightshade-text-dim);
font: inherit;
cursor: pointer;
}
.nightshade-chat-body {
flex: 1 1 auto;
min-height: 0;
overflow-y: auto;
padding: 10px;
display: flex;
flex-direction: column;
gap: 8px;
}
.nightshade-chat-message {
max-width: 84%;
padding: 8px 12px;
border-radius: 12px;
white-space: pre-wrap;
overflow-wrap: anywhere;
line-height: 1.5;
}
.nightshade-chat-message.user {
align-self: flex-end;
background: var(--nightshade-accent-soft);
color: var(--nightshade-text);
}
.nightshade-chat-message.assistant {
align-self: flex-start;
background: var(--nightshade-panel);
border: 1px solid var(--nightshade-panel-border);
}
.nightshade-chat-message.thinking {
align-self: flex-start;
color: var(--nightshade-text-dim);
font-style: italic;
}
.nightshade-chat-message.tool {
align-self: flex-start;
font-family: var(--nightshade-mono);
font-size: 12px;
color: var(--nightshade-tok-command);
background: var(--nightshade-panel-2);
}
.nightshade-chat-message.info {
align-self: center;
color: var(--nightshade-text-dim);
font-size: 12px;
}
.nightshade-chat-message.error {
align-self: flex-start;
border: 1px solid var(--nightshade-danger-soft);
color: var(--nightshade-danger);
}
.nightshade-chat-busy {
display: flex;
align-items: center;
gap: 8px;
color: var(--nightshade-text-dim);
font-size: 12px;
}
.nightshade-chat-compose {
display: flex;
gap: 8px;
padding: 10px;
border-top: 1px solid var(--nightshade-panel-border);
}
.nightshade-chat-input {
flex: 1 1 auto;
min-height: 38px;
max-height: 140px;
padding: 9px 12px;
border: 1px solid var(--nightshade-panel-border);
border-radius: 8px;
background: var(--nightshade-input-bg);
color: var(--nightshade-text);
font: inherit;
resize: vertical;
}
.nightshade-chat-input:focus {
outline: none;
border-color: var(--nightshade-accent);
}
.nightshade-chat-send {
align-self: flex-end;
}