.search-results {
    list-style-type: none;
    padding: 0;
    margin: 0 auto;

    display: grid;
    justify-content: center;
    gap: 1rem;

    width: 90%;
    max-width: 500px;

    place-content: center;
}

.result-item {
    display: flex;
    flex-direction: row;
    align-items: center;
    text-align: center;
    gap: 16px;
    min-width: 400px;

    justify-content: space-between;

    outline: 1px solid #3c2a68;
    background-color: #202020;
    padding: 1rem;
}

.result-img {
    image-rendering: pixelated;
    width: 160px;
    flex-shrink: 0; /* Ensures container never shrinks the graphic */
}

.result-title {
    display: block;
    text-align: center;
    font-size: 1.5rem;
}

/* Hide it by default for non-JS environments */
.search-container {
    display: none;
}

/* Show it natively only if scripting (JS) is active */
@media (scripting: enabled) {
    .search-container {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 1rem;
    }
}

#search {
    background-color: #303030;
    color: #F5F5F5;
    border-color: #F5F5F5;
    width: 50%;

    border-radius: 1rem;
    padding: 0.5rem;
}