/*nexcter was here*/
@font-face {
    font-family: "3270";
    src: url("assets/fonts/3270-Regular.woff2") format("woff2");
}

@font-face {
    font-family: "zpix";
    src: url("assets/fonts/zpix.woff2") format("woff2");
}

/*themes*/
:root {
    --bg: #000;
    --text: #c9c9c9;
    --green: #40ff3d;
    --error: #ff3d3d;
    --font: "3270", monospace;
    --background-image: none;
}


.theme-normal {
    --bg: #000;
    --text: #c9c9c9;
    --green: #40ff3d;
    --error: #ff3d3d;
    --font: "3270", monospace;
    --background-image: none;
}


.theme-amber {
    --bg: #000;
    --text: #ffb000;
    --green: #8f8;
    --error: #f66;
    --font: "3270", monospace;
    --background-image: none;
}



.theme-matrix {
    --bg: #000;
    --text: #00ff41;
    --green: #00ff41;
    --error: #ff3333;
    --font: "3270", monospace;
    --background-image: none;
}



.theme-pastel {
    --bg: #17131c;
    --text: #f5bde6;
    --green: #b8f2d0;
    --error: #ff9eae;
    --font: "3270", monospace;
    --background-image: none;
}

.theme-needy {
    --bg: #f9e2f9;
    --text: #4932c9;
    --green: #431dc2;
    --error: #de4744;
    --font: "zpix", monospace;
    font-weight: bold;
    --background-image: url("assets/theme_assets/ngowallpaper.png");
}

body {
    margin: 0;

    width: 100%;
    height: 100%;

    line-height: 20px;

    background-color: var(--bg);
    background-image: var(--background-image);
    background-repeat: repeat;

    color: var(--text);

    font-family: var(--font);
    font-size: 15px;

    overflow: hidden;
}


/* ==========================================
 * TERMINAL
 * ========================================== */

#terminal {
background: transparent;

width: 100%;
height: 100vh;

padding: 0 20px 20px 20px;

box-sizing: border-box;

overflow-y: auto;
overflow-x: hidden;
}

#output {
white-space: pre-wrap;
word-wrap: break-word;

}


/* ==========================================
 * NORMAL INPUT
 * ========================================== */

#input-line {
display: flex;

align-items: baseline;

height: 20px;
}


.prompt {
    color: var(--text);

    white-space: nowrap;

    margin-right: 8px;
}


#command-input {
flex: 1;

line-height: 20px;
height: 20px;

padding: 0;
margin: 0;

background: transparent;

border: none;
outline: none;

color: var(--text);

font-family: inherit;
font-size: inherit;

caret-color: var(--text);
}


/* ==========================================
 * TERMINAL TEXT
 * ========================================== */

.green {
    color: var(--green);
}


.command {
    color: var(--text);
}


.error {
    color: var(--error);
}


.command-output {
    color: var(--text);
}


/* ==========================================
 * GLOW
 * ========================================== */

.glow {
    text-shadow:
    0 0 0.5px currentColor,
    0 0 2px currentColor;
}


/* ==========================================
 * READER OVERLAY
 * ========================================== */

#reader-overlay {
display: none;

position: fixed;

inset: 0;

width: 100%;
height: 100%;

padding: 20px;

box-sizing: border-box;

background: var(--bg);
color: var(--text);

z-index: 9999;

overflow-y: auto;
}


#reader-content {
white-space: normal;

word-wrap: break-word;

color: var(--text);
}


/* ==========================================
 * MARKDOWN DOCUMENT
 * ========================================== */

.reader-document {
    max-width: 900px;

    line-height: 1.35;

    color: #fff;
}


/* Headings */

.reader-document h1 {
    color: #fff;

    font-size: 26px;

    margin: 12px 0 4px;
}


.reader-document h2 {
    color: #fff;

    font-size: 21px;

    margin: 10px 0 3px;
}


.reader-document h3 {
    color: #fff;

    font-size: 18px;

    margin: 8px 0 2px;
}


.reader-document h4,
.reader-document h5,
.reader-document h6 {
    color: #fff;
}


/* Paragraphs */

.reader-document p {
    color: #fff;

    margin: 5px 0;
}


/* Lists */

.reader-document ul,
.reader-document ol {
    margin: 5px 0;

    padding-left: 25px;
}


.reader-document li {
    margin: 1px 0;
}


/* Links */

.reader-document a {
    color: #4287f5;

    text-decoration: underline;
}


/* Images */

.reader-document img {
    display: block;

    max-width: 100%;

    height: auto;

    margin: 10px 0;
}


/* Inline code */

.reader-document code {
    background: #111;

    padding: 1px 4px;
}


/* Code blocks */

.reader-document pre {
    background: #080808;

    border-left: 2px solid var(--text);

    padding: 8px 12px;

    margin: 8px 0;

    overflow-x: auto;
}


/* Blockquotes */

.reader-document blockquote {
    border-left: 2px solid var(--text);

    margin: 7px 0;

    padding-left: 12px;

    color: #fff;
}


/* Horizontal rules */

.reader-document hr {
    border: 0;

    border-top: 1px solid var(--text);

    margin: 12px 0;
}


/* ==========================================
 * READER UI
 * ========================================== */

.reader-header {
    color: var(--text);

    margin-bottom: 2px;
}


.reader-separator {
    color: var(--text);

    margin-bottom: 8px;
}


.reader-footer {
    color: var(--text);

    margin-top: 15px;

    padding-bottom: 20px;
}


.reader-page {
    line-height: 20px;

    margin-bottom: 2px;
}


.reader-command {
    display: grid;

    grid-template-columns: 70px auto;

    line-height: 20px;
}


/* ==========================================
 * READER INPUT
 * ========================================== */

#reader-input-line {
display: flex;

align-items: baseline;

margin-top: 5px;
}


#reader-prompt {
color: var(--text);

white-space: nowrap;

margin-right: 8px;
}


#reader-input {
flex: 1;

height: 20px;

padding: 0;
margin: 0;

background: transparent;

border: none;
outline: none;

color: var(--text);

font-family: inherit;
font-size: inherit;

line-height: 20px;

caret-color: var(--text);
}

/* ==========================================
 * TERMINAL IMAGE LEFT
 * ========================================== */

.terminal-image-left {
    display: flex;

    align-items: flex-start;

    gap: 20px;

    margin: 5px 0;
}


.terminal-image {
    width: 250px;

    height: auto;

    object-fit: contain;

    flex-shrink: 0;
}


.terminal-image-text {
    white-space: pre-wrap;

    word-wrap: break-word;

    flex: 1;
}