/* Layout mods in two columns if wide enough */
@media screen and (min-width: 768px) {
    #mod-descriptions {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
}

.full-description {
    max-height: 80vh;
    overflow-y: auto;

}

.mod-icon,
.mod-icon-category {
    width: 48px;
    height: 48px;
    vertical-align: middle;
    margin-right: 5px;
}
.mod-icon-category {
    width: 16px;
    height: 16px;
}

/* Mod categories styling */
.categories {
    list-style: none;
    padding: 0;
    margin: 10px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.categories li {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 5px;
    font-size: 0.6em;
    color: white;
}

/* Unique colors for different categories */
.categories .technology {
    background-color: #007bff;
}

.categories .magic {
    background-color: #9c27b0;
}

.categories .adventure {
    background-color: #28a745;
}

.categories .utility {
    background-color: #ffc107;
}

.categories .library {
    background-color: #17a2b8;
}

.categories .worldgen {
    background-color: #6c757d;
}

.categories .storage {
    background-color: #dc3545;
}

.categories .optimization {
    background-color: #20c997;
}

.categories .decoration {
    background-color: #fd7e14;
}

.categories .misc {
    background-color: #6610f2;
}