/* Keep the overlay, content and external close icon in one stacking context
   above sticky navigation and the WordPress admin bar. Do not introduce a
   transform/fixed containing block: UAEL still positions its own children. */
.uael-modal-parent-wrapper[aria-modal="true"] {
    position: relative !important;
    z-index: 2147483000 !important;
    isolation: isolate;
}

/* Only keyboard focus changes the existing trigger/close appearance. */
[data-aqara-modal-action]:focus-visible,
.uael-modal-parent-wrapper a:focus-visible,
.uael-modal-parent-wrapper button:focus-visible,
.uael-modal-parent-wrapper input:focus-visible,
.uael-modal-parent-wrapper select:focus-visible,
.uael-modal-parent-wrapper textarea:focus-visible,
.uael-modal-parent-wrapper iframe:focus-visible {
    outline: 2px solid #222 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 2px #fff !important;
}

.uael-modal-parent-wrapper [data-aqara-modal-close] {
    min-width: 24px;
    min-height: 24px;
}

/* Used only when the author omitted every close control. */
.uael-modal-parent-wrapper button.aqara-modal-fallback-close {
    all: unset !important;
    box-sizing: border-box !important;
    position: absolute !important;
    top: 8px !important;
    right: 8px !important;
    width: 32px !important;
    height: 32px !important;
    border: 1px solid #222 !important;
    border-radius: 50% !important;
    background: #fff !important;
    color: #222 !important;
    font: 24px/30px sans-serif !important;
    text-align: center !important;
    cursor: pointer !important;
    z-index: 2 !important;
}

.uael-modal-parent-wrapper .uael-show button.aqara-modal-fallback-close {
    visibility: visible !important;
}

.uael-modal-parent-wrapper button.aqara-modal-fallback-close:focus-visible {
    outline: 2px solid #222 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 2px #fff !important;
}

@media (prefers-reduced-motion: reduce) {
    .uael-modal-parent-wrapper .uael-modal,
    .uael-modal-parent-wrapper .uael-content,
    .uael-modal-parent-wrapper .uael-overlay {
        animation: none !important;
        transition: none !important;
    }

    /* Some effects rely on animation keyframes for their final visible state. */
    .uael-modal-parent-wrapper .uael-show .uael-content {
        transform: none !important;
        opacity: 1 !important;
    }
}

@media (forced-colors: active) {
    [data-aqara-modal-action]:focus-visible,
    .uael-modal-parent-wrapper :focus-visible,
    .uael-modal-parent-wrapper button.aqara-modal-fallback-close:focus-visible {
        outline-color: Highlight !important;
    }
}