:root {
    /* Taille contrôlable */
    --font-table-header: 32px;   /* Titres de colonnes */
    --font-pagination: 32px;     /* Pagination en haut */
    --font-row: 32px;            /* Texte des lignes (modifiable si nécessaire) */

    /* Couleurs */
    --background-dark: #000;
    --row-odd: rgb(185, 97, 3);
    --row-even: rgb(225, 132, 0);
    --text-color: white;
}

/* Page entière */
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    font-family: Arial, Verdana, Geneva, sans-serif;
    background-color: var(--background-dark);
    color: var(--text-color);
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
}

/* Container principal */
.container {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    padding: 1vh 2vw;
    box-sizing: border-box;
}

/* Pagination tout en haut */
#pageIndicatorTop {
    font-size: var(--font-pagination);
    font-weight: bold;
    text-align: center;
    color: var(--text-color);
    margin-bottom: 0.3vh;
}

/* Tableau */
.table-container {
    flex-grow: 1;
    overflow-y: hidden; /* pas de scroll */
}

table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    font-weight: bold;
}

/* Titres des colonnes */
thead th {
    font-size: var(--font-table-header);
    text-align: center;
    padding: 1vh 1vw;
    color: var(--text-color);
}

/* Lignes du tableau */
tbody td {
    font-size: var(--font-row);
    text-align: center;
    padding: 0.8vh 1vw;
}

/* Alternance des couleurs des lignes */
tbody tr:nth-child(odd) {
    background-color: var(--row-odd);
}

tbody tr:nth-child(even) {
    background-color: var(--row-even);
}

/* Status reste neutre */
.available,
.occupied {
    color: var(--text-color);
}

/* Responsive petits écrans */
@media (max-width: 768px) {
    :root {
        --font-table-header: 32px;
        --font-pagination: 32px;
        --font-row: 32px;
    }
}

/* Responsive grands écrans (TV) */
@media (min-width: 1600px) {
    :root {
        --font-table-header: 32px;
        --font-pagination: 32px;
        --font-row: 32px;
    }
}