@font-face {
    font-family: 'Minecraftia';
    src: url('./fontmc.ttf') format('truetype');
    /* Ajoutez d'autres variantes si nécessaire, comme bold, italic, etc. */
}

body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100vh;
    margin: 0;
    background-color: #1e1e1f;
    font-family: Arial, sans-serif;
}

h1 {
    margin-top: 50px;
    font-size: 30px;
    color: #b61272;
    font-family: 'Minecraftia', sans-serif;
}

.cell {
    width: 100%;
    height: 100%;
}

#maze {
    display: grid;
    grid-template-columns: repeat(var(--maze-size), 1fr);
    grid-template-rows: repeat(var(--maze-size), 1fr);
    width: 800px;
    height: 800px;
}

.wall { background-color: #000000; }
.path { background-color: #1e1e1f; }
.start { background-color: #0f0; }
.end { background-color: #f00; }

#controls-top, #controls-bottom {
    display: flex;
    gap: 10px;
    margin: 10px 0;
}

input {
    padding: 3px;
}

button {
    padding: 5px 10px;
    color: rgb(255, 255, 255);
    border: none;
    border-radius: 3px;
    cursor: pointer;
}
input {
    background-color: #141414;
    color: white;
    font-family: 'Minecraftia', sans-serif;
}

button.active {
    background-color: #ff0000 !important;
}
button.active:hover {
    background-color: #ff6600 !important;
}
#reloadBtn {
    background-color: #7600ba;
}

#reloadBtn:hover {
    background-color: #c45eff;
}

#downloadBtn {
    background-color: #008cff;
}

#downloadBtn:hover {
    background-color: #0051ff;
}

#revealBtn {
    background-color: #00d9ff;
}

#revealBtn:hover {
    background-color: #008cff;
}

#editBtn {
    background-color: #00ff62;
}

#editBtn:hover {
    background-color: #1fa22a;
}

#showAllPathsBtn {
    background-color: #00a2ff;
}

#showAllPathsBtn:hover {
    background-color: #00ffff;
}
.path-0{background-color:#FF0000}
.path-1{background-color:#00FF00}
.path-2{background-color:#0000FF}
.path-3{background-color:#FFFF00}
.path-4{background-color:#FF00FF}
.path-5{background-color:#00FFFF}
.path-6{background-color:#800000}
.path-7{background-color:#008000}
.path-8{background-color:#000080}
.path-9{background-color:#808000}
.path-10{background-color:#800080}
.path-11{background-color:#008080}
.path-12{background-color:#FFA500}
.path-13{background-color:#A52A2A}
.path-14{background-color:#8A2BE2}
.path-15{background-color:#5F9EA0}
.path-16{background-color:#FF1493}
.path-17{background-color:#D2691E}
.path-18{background-color:#4B0082}
.path-19{background-color:#FFD700}