/* Buffers: the window area and the content of the various buffer types. */

#window { flex: 1; overflow: hidden; background: var(--window-bg); position: relative; }

/* ---------- generic buffer ---------- */

.buffer {
    display: none;
    height: 100%;
    overflow-y: auto;
    padding: 26px 48px 60px;
}
.buffer.active { display: block; }

.buffer h1 { font-size: 25px; color: #fff; margin: 0 0 10px; }
.buffer h2 { font-size: 18px; color: var(--accent); margin: 22px 0 6px; }
.buffer a { color: var(--accent); }
.buffer code {
    background: rgba(110, 118, 129, 0.22);
    padding: 1px 5px; border-radius: 3px;
    font-family: inherit; font-size: 0.92em;
}
.buffer ul { padding-left: 22px; }
.page-footer {
    margin-top: 42px; padding-top: 8px;
    border-top: 1px solid var(--border);
    color: var(--dim); font-size: 13px;
}
.dim { color: var(--dim); }

/* ---------- buffer list ---------- */

.buffer.buf-list { padding: 14px 24px; }
.buf-list-title {
    color: var(--dim); font-weight: bold;
    border-bottom: 1px solid var(--border);
    padding-bottom: 4px; margin-bottom: 4px;
    white-space: pre;
}
.buf-list-row { padding: 2px 6px; white-space: pre; cursor: pointer; }
.buf-list-row:hover { background: var(--highlight); }
.buf-list-row.selected { background: var(--accent); color: #fff; }
.buf-list-row.selected::before { content: "> "; }

/* ---------- editable buffers (scratch, opened files) ---------- */

.buffer.scratch,
.buffer.editable {
    background: #0a0d13;
    white-space: pre-wrap;
    outline: none;
}

/* ---------- help ---------- */

.help-table { border-collapse: collapse; margin-top: 10px; }
.help-table td { padding: 3px 16px 3px 0; border-bottom: 1px solid var(--border); }
.kbd { color: var(--accent); font-weight: bold; white-space: nowrap; }

/* ---------- scrollbars ---------- */

.buffer::-webkit-scrollbar { width: 12px; }
.buffer::-webkit-scrollbar-thumb { background: var(--border); border-radius: 6px; }
.buffer::-webkit-scrollbar-track { background: var(--window-bg); }