main {
    width: min(1080px, calc(100% - 2em))!important
}

form {
    margin: 1em 0;
}

div#search {
    display: flex;
}

#search input {
    margin: 0;
    flex-grow: 1;

    border-right: none;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

#search button {
    padding: 0 .5em;

    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

form #filters p {
    margin: .5em 0 0 0;
}
form #filters label {
    display: inline;
}
form #filters input {
    margin-right: 1em;
    display: inline;
}

#logs {
    width: 100%;
    border-collapse: collapse;
}

#logs tr {
}

#logs tr td {
    border-bottom: 1px solid #8888;
}

#logs tr td:nth-child(even) {
    background: #00000004;
}

#logs th, #logs td {
    padding: .4em .8em;
}

td, th {
    width: 1%;
    text-align: left;
    white-space: nowrap;
}
td.log-level,
th.log-level,
td.log-type,
th.log-type {
    text-align: center;
}
td.log-content,
td.log-content {
    width: 100%;
    white-space: collapse;
}

.log:hover {
    background: #fff8;
}

.log.warn {
    background: #ffe86a;
}
.log.warn:hover {
    background: #ffec81;
}
