advanced-dialog button[slot="controls-panel"]:not([unstyled]) {
    margin: 0.3rem;
    padding: 0.3rem;
    min-width: 5rem;
    border: solid #D1D1D1 1px;
    border-radius: 0.3pc;
    background: white;
}
advanced-dialog > button[slot="controls-panel"]:not([unstyled]).action {
    border-color: #87b9ff;
    cursor: pointer;
}
advanced-dialog > button[slot="controls-panel"]:not([unstyled]).action:hover {
    background: #f5f9ff;
}
advanced-dialog button[slot="controls-panel"]:not([unstyled]):not(:last-of-type){
    margin-right: 0px;
}

advanced-dialog {
    max-width: 100%;
    max-height: 100%;
}
advanced-dialog *[slot="title"] {
    margin-top: 0px;
    margin-bottom: 0px;
}


advanced-dialog[size=x-small], advanced-dialog[size=alert] {
    width: var(--adv-dialog-xs-width, unset);
    height: var(--adv-dialog-xs-height, unset);
    max-width: var(--adv-dialog-xs-max-width, 250px);
}
advanced-dialog[size=small] {
    width: var(--adv-dialog-sm-width, 45%);
    height: var(--adv-dialog-sm-height, 45%);
}
advanced-dialog[size=medium] {
    width: var(--adv-dialog-med-width, 65%);
    height: var(--adv-dialog-med-height, 65%);
}
advanced-dialog[size=large] {
    width: var(--adv-dialog-med-width, 80%);
    height: var(--adv-dialog-med-height, 80%);
}
advanced-dialog[size=fullscreen], advanced-dialog[size=full] {
    width: var(--adv-dialog-lg-width, 100%);
    height: var(--adv-dialog-lg-height, 80%);
    border-radius: 0px;
}
.adv-dialog-backdrop {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 99;
    background: rgba(20, 20, 30, 0.4);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
}
.adv-dialog-backdrop {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 99;
    background: rgba(20, 20, 30, 0.4);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
}

@media (max-width: 600px){
    advanced-dialog:not([size=x-small]):not([size='alert']) {
        height: 100% !important;
        width: 100% !important;
        border-radius: 0px;
    }
    advanced-dialog[size=x-small], advanced-dialog[size=alert]{
        margin: 0.3rem;
    }
}