/* Grundlayout: Absoluter Retro-Look */
body {
    font-family: monospace;
    font-size: 14px;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* Standard-Links */
a {
    color: #0000ee;
    text-decoration: underline;
}
a:visited {
    color: #551a8b;
}

/* Farbschemata (kompromisslos schlicht) */
body.light {
    background-color: #ffffff;
    color: #000000;
}
body.light header, body.light footer {
    background: #ffffff;
    border-color: #000000;
}
body.light .sidebar {
    background: #ffffff;
    border-right: 1px solid #000000;
}

body.dark {
    background-color: #000000;
    color: #c0c0c0;
}
body.dark header, body.dark footer {
    background: #000000;
    border-color: #c0c0c0;
}
body.dark .sidebar {
    background: #000000;
    border-right: 1px solid #c0c0c0;
}
body.dark a { color: #00ffff; }
body.dark a:visited { color: #ff00ff; }

body.unix {
    background-color: #000000;
    color: #00ff00;
}
body.unix header, body.unix footer {
    background: #000000;
    border-color: #00ff00;
}
body.unix .sidebar {
    background: #000000;
    border-right: 1px solid #00ff00;
}
body.unix a { color: #00ff00; }
body.unix a:visited { color: #00aa00; }
body.unix input, body.unix textarea, body.unix button {
    background: #000;
    color: #00ff00;
    border: 1px solid #00ff00;
    font-family: monospace;
}

/* Header */
header {
    padding: 5px 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid;
}
.header-controls {
    display: flex;
    gap: 10px;
    align-items: center;
}
input#search {
    padding: 2px;
    font-family: monospace;
    border: 1px solid;
}
button.theme-btn {
    cursor: pointer;
    padding: 2px 5px;
    font-family: monospace;
    background: inherit;
    color: inherit;
    border: 1px solid currentColor;
}

/* Main Container (Zwei Spalten) */
.container {
    display: flex;
    flex: 1;
}
.sidebar {
    width: 250px;
    padding: 10px;
    overflow-y: auto;
    max-height: calc(100vh - 80px);
}
.sidebar ul {
    list-style: square;
    padding-left: 20px;
    margin: 0;
}
.sidebar li {
    margin-bottom: 4px;
}
.sidebar li a {
    text-decoration: none;
}
.sidebar li a:hover {
    text-decoration: underline;
}

.content {
    flex: 1;
    padding: 15px;
    background: inherit;
    overflow-y: auto;
    max-height: calc(100vh - 80px);
}
.content pre {
    white-space: pre-wrap;
    word-wrap: break-word;
    font-family: monospace;
    margin: 0;
}

/* Footer */
footer {
    padding: 5px 10px;
    font-size: 0.9em;
    border-top: 1px solid;
    display: flex;
    gap: 15px;
}
footer a {
    text-decoration: underline;
}