body {
    margin: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-width: 320px;
    min-height: 100vh;
    align-items: center;

    /*#background-image: url("background.svg");*/
    background-repeat: no-repeat;
    background-size: contain;
}

/* Center the table and set minimum width */
table {
    margin: 0 auto;  /* Centers the table horizontally */
    min-width: 800px; /* Minimum width - adjust as needed */
    width: 80%;  /* Takes up 80% of container width */
    max-width: 1200px; /* Optional: prevents table from getting too wide */
}


table {
    border-collapse: collapse;
    width: 100%;
    margin: 0;
    font-size: 14px;        /* Smaller font size if needed */
}

th {
    background-color: #f8f9fa;
    padding: 2px 2px;
    border-bottom: 1px solid #dee2e6;
    line-height: 1.2;
}

td {
    padding: 2px 2px;
    border-bottom: 1px solid #eee;
    font-size: 1.2em;
    line-height: 1.2;
}

/* this isn't working */
.upload-list tr:nth-child(even) td {
    background-color: #4C8BF5;
    color: #fe0;
}

.table-button {
    padding: 2px 2px;
    line-height: 1;
    min-height: 20px;
    font-size: 12px;
    border: 1px solid #000;
    border-radius: 3px;
    cursor: pointer;
}

/* Make table responsive */
@media screen and (max-width: 800px) {
    table {
        min-width: 100%;
        width: 100%;
    }
}

h1 {
    font-size: 29px;
    line-height: 39px;
    font-weight: 300;
}

.title {
    margin-bottom: 40px;
}

#app {
    max-width: 1280px;
}

img {
    max-width: 100%;
    height: auto;
}



button {
    font-family: Inter, system-ui, sans-serif;
    background-color: rgba(25, 25, 28, 0.5);
    cursor: pointer;
    color: rgba(255, 255, 255, 1);
}

button:hover {
    background-image: radial-gradient(
            farthest-corner at 77% 83%,
            rgba(1, 197, 245, 0.5) 2%,
            rgba(1, 126, 254, 0.5) 28%,
            rgba(25, 25, 28, 0) 70%
    );
    border: 1px solid rgba(76, 166, 255, 0.2);
    background-clip: padding-box;
}

.icon-red {
    color: #f82d2d;
    vertical-align: bottom;
    height: 1em;
    width: 1em;
}

.icon-yellow {
    color: gold;
    vertical-align: bottom;
    height: 1em;
    width: 1em;
}

.icon-green {
    color: chartreuse;
    vertical-align: bottom;
    height: 1em;
    width: 1em;
}


@media (max-width: 875px) {



}