.dev .dialog-theme-lms .modal-dialog{
    color: var(--text-color-base);
    font-size: var(--font-size-base);
    line-height: var(--lineheight-large);
}

.dev .dialog-theme-lms .modal-dialog label{
    color: var(--text-color-base);
    font-size: var(--font-size-base);
    line-height: var(--lineheight-large);
}

.dev .dialog-theme-lms .modal-dialog-overlay {
    top: 2em;
}

.dialog-theme-lms .modal-dialog-overlay {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    z-index: 1000;
    transition: background-color 0.3s ease, opacity 0.3s ease;
    background: rgba(0, 0, 0, 0.1);
    opacity: 1;


    /* center .modal-dialog */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.dialog-theme-lms .panel-close{
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" stroke="hsl(223deg  84%25  20%25)" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round" class="css-i6dzq1"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>');
    background-position: 0;
    height: 1.5rem;
    width: 1.5rem;
    display: inline-block;
    float: right;
}

.dialog-theme-lms .panel-title{
    color: var(--heading-color);
    display: inline-block;
}

.dialog-theme-lms .modal-dialog {
    position: absolute;
    background: white;
    padding: 1rem;
    border-radius: var(--border-radius-large);
}

.modal-dialog .modal-dialog-content {
    min-width: 20vw;
    max-width: 80vw;
    min-height: 20vh;
    max-height: 80vh;
    padding: var(--flow-space);
    overflow: auto;
}