/* --- Typographie moderne GitHub Dark --- */
@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500&display=swap');

body {
    font-family: 'Fira Code', monospace;
    background-color: #0d1117;
    color: #c9d1d9;
    margin: 1em 2em;
}

/* --- Reviewer Prompt --- */
#reviewerPrompt {
    background-color: #161b22;
    padding: 1em 2em;
    border-radius: 6px;
    max-width: 400px;
    margin: 2em auto;
    text-align: center;
}

#reviewerPrompt input {
    width: 90%;
    padding: 0.5em;
    margin-bottom: 0.5em;
    border-radius: 4px;
    border: 1px solid #30363d;
    background-color: #0d1117;
    color: #c9d1d9;
}

/* --- Main Container --- */
#main-container {
    display: flex;
    gap: 2em;
    align-items: flex-start;
}

/* Vidéo */
#video-container video {
    width: 100%;
    max-width: 640px;
    border-radius: 4px;
    border: 1px solid #30363d;
}

/* Contenu à droite */
#content-container {
    flex: 1;
}

/* Titres */
h2 {
    font-size: 1.1rem;
    margin-bottom: 0.5em;
    color: #58a6ff;
}

/* Formulaire commentaire */
#commentForm textarea {
    width: 100%;
    min-height: 80px;
    padding: 0.5em;
    margin-bottom: 0.5em;
    border-radius: 4px;
    border: 1px solid #30363d;
    background-color: #161b22;
    color: #c9d1d9;
}

/* Boutons bleus avec halo */
.btn {
    background-color: #238aff;
    color: #fff;
    border: none;
    padding: 0.5em 1em;
    border-radius: 4px;
    cursor: pointer;
    transition: box-shadow 0.2s, transform 0.1s;
}

.btn:hover {
    box-shadow: 0 0 10px #238affaa, 0 0 20px #238aff55;
}

/* Tableau commentaires */
#comments-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1em;
    table-layout: fixed;
}

#comments-table th, #comments-table td {
    border: 1px solid #30363d;
    padding: 0.4em 0.6em;
}

#comments-table th {
    font-size: 0.7rem;
    text-transform: uppercase;
    color: #58a6ff;
}

#comments-table td {
    font-size: 0.85rem;
    word-wrap: break-word;
}

/* Actions boutons */
#comments-table td button {
    margin-right: 0.5rem;
}

/* Export buttons */
#exportButtons .btn {
    margin-right: 0.5rem;
}