#customDialog {
    min-width: 50ch;
    max-width: 1600px;
    max-height: 80%;
    border: none;
    border-radius: 10px;
    box-shadow: 2px 2px 10px 2px black;
    background: #ddd;
    margin-top: 10%;
}

#customDialog .button-row {
    margin-top: .5em;
    float: right;
}

#customDialog .button-row button {
    padding: .5em;
    margin-left: .2em;
    margin-right: .2em;
    border-radius: 5px;
    border: none;
    background-color: silver;
}

#customDialog .button-row button:hover, #customDialog .button-row button:hover {
   background-color: #ababab; 
}

#customDialog .button-row button.default-button {
    background-color: skyblue;
}

#customDialog .button-row button.default-button:hover, #customDialog .button-row button.default-button:focus-visible {
    background-color: cornflowerblue;
}

#customDialog .button-row button:first-of-type {
    margin-left: 0;
}

#customDialog .button-row button:last-of-type {
    margin-right: 0;
}

#customDialog input[type=text] {
    padding: .2em 0;
    text-indent: .2em;
    border-radius: 5px;
    border: 2px solid gray;
    width: 100%;
    outline: none;
    position: relative;
}

#customDialog input[type=text]:focus-within, #customDialog input[type=text]:focus-visible, #customDialog input[type=text]:focus {
    border-color: blue;
}

#customDialog datalist {
    color-scheme: light;
    background-color: purple;
}