.ui-dialog:not(.ui-draggable.ui-resizable) {
    .ui-dialog-title {
        display: none !important;

    }

    .ui-dialog-titlebar {
        background-color: var(--white) !important;
        position: relative;
        min-height: 40px;
    }

    .ui-icon-closethick,
    .ui-dialog-titlebar-close {
        background-image: url("data:image/svg+xml,%3csvg width='12' height='12' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11 1.318l-10 10M11 11.318l-10-10' stroke='%23000000' stroke-width='1.5'/%3e%3c/svg%3e") !important;
        background-repeat: no-repeat;
        background-position: center;
        transform: translate(0%, -15%) !important;
    }

    .ui-dialog-titlebar-close {
        top: 20px !important;
        margin-top: 0 !important;
        z-index: 10;
    }

    &:has(#drupal-modal) {
        width: 900px !important;
        max-width: 95vw;

        #drupal-modal {
            max-height: 913px;
            overflow-y: auto;
        }
    }

    & {
        background-color: #fff !important;
    }
}

.ui-widget-overlay.ui-front {
    background-color: #edeff5 !important;
    opacity: 0.9 !important;

}

:where(html[data-theme="dark"]) .ui-dialog:not(.ui-draggable.ui-resizable) {
    .ui-dialog-titlebar {
        background-color: var(--dark) !important;
    }

    /* El aspa negra de la regla base va en los dos elementos: si solo se
       aclara el icono, la del botón queda negra sobre el fondo oscuro. */
    .ui-icon-closethick,
    .ui-dialog-titlebar-close {
        background-image: url("data:image/svg+xml,%3csvg width='12' height='12' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11 1.318l-10 10M11 11.318l-10-10' stroke='%23ffffff' stroke-width='1.5'/%3e%3c/svg%3e") !important;
    }

    & {
        background-color: var(--dark) !important;
        color: #f1f1f1;
    }
}

:where(html[data-theme="dark"]) .ui-widget-overlay.ui-front {
    background-color: #0d0d0d !important;
    opacity: 0.85 !important;
}