@font-face {
    font-family: 'Courier New';
    src: url('/static/fonts/couriernew.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

body {
    background-color: #1e1e1e; /* Фон сайта */
    color: #dcdcdc; /* Цвет текста */
    font-family: 'Courier New', 'Source Code Pro', monospace; /* Шрифт терминала */
    /* font-family: 'Source Code Pro', monospace; */
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
}

#terminal-window {
    background-color: #2d2d2d;
    width: 80%;
    max-width: 800px;
    border-radius: 10px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
    overflow: hidden;
}

#terminal-header {
    background-color: #404040;
    padding: 8px;
    display: flex;
    align-items: center;
}

.btn {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin-right: 8px;
}

.red {
    background-color: #ff605c;
}

.yellow {
    background-color: #ffbd44;
}

.green {
    background-color: #00ca4e;
}

#terminal {
    background-color: #1e1e1e;
    color: #dcdcdc;
    padding: 15px;
    font-size: 16px;
    line-height: 1.5;
    overflow-y: auto;
    height: 400px;
}

#output {
    white-space: pre-wrap; /* Сохранение переносов строк */
    overflow-wrap: break-word; /* Перенос длинных слов */
    margin: 0;
}

#input-line {
    display: flex;
    align-items: center;
    margin: 0;
}

.prompt {
    color: #00e600; /* Цвет приглашения команд */
}

.command {
    margin-left: 5px; /* Добавление отступа между $ и командой */
}

#input {
    background: none;
    border: none;
    color: #dcdcdc;
    outline: none;
    width: 100%;
    font-family: 'Courier New', monospace; /* Шрифт терминала */
    font-size: 16px; /* Фиксированный размер шрифта */
    line-height: 1.5; /* Фиксированная высота строки */
    height: 24px; /* Установить фиксированную высоту */
    margin: 0; /* Убираем отступы */
}

#input::selection {
    background: #555;
}

#terminal::-webkit-scrollbar {
    width: 10px;
}

#terminal::-webkit-scrollbar-thumb {
    background-color: #555;
    border-radius: 5px;
}

a {
    color: #0099ff; /* Цвет ссылок */
    text-decoration: none; /* Убираем подчеркивание */
    border-bottom: 1px solid #0099ff; /* Добавляем нижнюю границу */
    transition: color 0.3s, border-bottom 0.3s; /* Плавный переход */
}

a:hover {
    color: #66ccff; /* Цвет ссылки при наведении */
    border-bottom: 1px solid #66ccff; /* Меняем цвет нижней границы при наведении */
}

a:visited {
    color: #0099ff; /* Цвет посещенных ссылок */
}

a:active {
    color: #007acc; /* Цвет ссылки при нажатии */
}