/* ==========================================================================
   MAC-TERMINAL GEHÄUSE & OPTIK
   ========================================================================== */
/* Das äußere Gehäuse des Mac-Terminals */
.terminal-window {
    background: #000000; /* Tiefschwarzer Hintergrund im Inneren */
    border-radius: 8px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
    overflow: hidden;
    margin-bottom: 2rem;
    width: 100%;
    border: 1px solid #222222; /* Feiner Rahmen um das Gehäuse */
    z-index: 100;
    position: relative;
}

/* Die macOS Fensterleiste oben */
.terminal-bar {
    background: #1a1a1a; /* Dunkelgraue Mac-Leiste */
    padding: 10px 14px;
    display: flex;
    align-items: center;
    position: relative;
    border-bottom: 1px solid #252525;
}

/* Die drei farbigen Mac-Punkte (Schließen, Minimieren, Maximieren) */
.terminal-bar .dot-container {
    display: flex;
    gap: 7px;
}
.terminal-bar .dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    display: inline-block;
}
.terminal-bar .dot.red { background: #ff5f56; }
.terminal-bar .dot.yellow { background: #ffbd2e; }
.terminal-bar .dot.green { background: #27c93f; }

/* Der zentrierte Titel in der Mac-Leiste */
.terminal-bar .terminal-title {
    color: #666666;
    font-size: 0.75rem;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    letter-spacing: 0.5px;
}

/* Der Textbereich im Inneren */
.terminal-body {
    padding: 15px;
    background: #000000;
    cursor: text;
}

/* Die aktive Eingabezeile */
.terminal-line {
    background: #000000;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

/* Das grüne Eingabe-Präfix */
.terminal-prompt {
    color: #4af626; 
    margin-right: 8px;
    font-family: 'Courier New', Courier, monospace;
}

/* ==========================================================================
   TERMINAL INPUT + EMULIERTER CURSOR
   ========================================================================== */

.input-wrapper {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
}


/* echtes Input-Feld */
#terminal-input {
    background: transparent;
    border: none;
    color: #4af626;
    font-family: 'Courier New', Courier, monospace;
    font-size: inherit;
    outline: none;

    padding: 0;
    margin: 0;

    /* System-Cursor verstecken */
    caret-color: transparent;

    /* Breite wird per JS gesetzt */
    width: 0;
    min-width: 0;
}


/* künstlicher Cursor */
.terminal-cursor {
    display: inline-block;

    width: 0.65ch;
    height: 1.2em;

    background: #4af626;

    margin-left: 3px;

    vertical-align: middle;

    animation: cursor-blink 1s infinite;
}


/* echtes Terminal-Blinken */
@keyframes cursor-blink {

    0%, 45% {
        opacity: 1;
    }

    50%, 100% {
        opacity: 0;
    }

}

/* Cursor blinkt immer - auch bei Fokus */
@keyframes cursor-blink {

    0%,49% {
        opacity:1;
    }

    50%,100% {
        opacity:0;
    }
}
@keyframes cursor-blink {
    0%, 49% { opacity: 1; }
    50%, 100% { opacity: 0; }
}

/* Die ausklappende Ladebenachrichtigung */
#terminal-output {
    margin-top: 10px;
    padding: 10px 0 0 0;
    background: #000000;
    border-top: 1px dashed #222222;
    color: #4af626; /* Benachrichtigungstext in Terminal-Grün */
    font-family: 'Courier New', Courier, monospace;
    line-height: 1.4;
    display: none; 
}