.styled-list {
    width: max-content;
    max-width: 100%;
    padding: 0;
}
.styled-list-category {
    border-radius: 1em 1em 0 0;
    padding: 1em 2em 0.8em 1em;
    margin: 1em 0 0;
    border-style: solid;
    border-color: var(--color-black);
    border-width: 1px 1px 0;
    font-weight: bold;
}
.styled-list li {
    position: relative;
    list-style-type: none;
}
.styled-list li a, .styled-list li .button-as-link {
    color: var(--color-black);
}
.styled-list li:not(.styled-list-category) {
    margin: 0;
}
.styled-list li a:not(.styled-list-category a), .styled-list .no-link-item {
    margin: 0;
    padding: 0.5em 1em 0.5em 2em;
    display: block;
}
.styled-list li a:not(.styled-list-category a):hover {
    background-color: var(--bg-hover);
    color: white;
}
.styled-list-subcategory {
    border-radius: 0 0 1em 1em;
    border-width: 0 1px 1px 1px;
    border-style: solid;
    border-color: var(--color-black);
    padding: 0 0 1em;
    overflow: hidden;
    min-width: 20em;
    background-color: white;
}


.selectable-list-container {
    display: grid;
    grid-template-columns: 1fr;
    width: max-content;
    margin: 0 auto;
    max-width: 100%;
    overflow: auto;
}
.selectable-list-container.minimized {
    grid-template-columns: 1fr auto;
}
table {
    border-collapse: collapse;
}
.selectable-list table, .list table {
    width: max-content;
    min-width: 33em;
}
.list td, .list th, .selectable-list td, .selectable-list th {
    padding: 0.6em 1.4em;
    border-bottom: 1px solid #0000003d;
}

.selectable-list, .list {
    overflow: auto;
    text-align: left;
    display: flex;
    flex-direction: column;
}
.selectable-list tr:not(thead tr), .selectable-row {
    cursor: pointer;
    border-radius: 6px;
    padding: 0.8em 1.2em;
}
.selectable-list tr:not(thead tr):hover, .selectable-row:not(:has(.edit-button:hover)):hover, .selected-row-item {
    background-color: var(--bg-hover);
}
th {
    position: sticky;
    top: 0;
    background-color: white;
}
.selectable-list-action-button {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap-reverse;
}

.selectable-row-container {
    padding: 0 1em;
}
.hide-nonSelected-items .selectable-row:not(.selected-list-item){
    display: none;
}
.selected-list-item {
    border-left: 0.5em solid lightgreen;
    padding-left: 1em;
}
.selectable-row {
    margin: 1em 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 3px 2px 8px -5px #5a5a5a;
}

.details-view {
    border-left: 1px solid var(--color-black);
    padding: 0 2em;
    overflow: auto;
}

.col-2-label-value {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 0.4em 1em;
}

.col-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2em;
}
.col-2 .text-warning {
    grid-column-start: 1;
    grid-column-end: 3;
}

.log-entry {
    border: 1px solid #80808075;
    border-radius: 0.5em;
    padding: 1em 2em;
    margin: 1em 0;
    box-shadow: 3px 2px 8px -5px #5a5a5a;
}
.log-entry img {
    width: 12em;
    border-radius: 0.5em;
    margin: 1em 0 0;
}

.load-more-rows-button {
    border-bottom: none;
    text-decoration: underline;
    text-align: center;
}

@media (max-width: 680px) {
    .selectable-list-container.minimized .selectable-list {
        display: none;
    }
    .selectable-list-container.minimized .details-view {
        border-left: none;
        padding: 0;
    }
}