.dir-popover-dialog {
    position: fixed;
    margin: 0;
    padding: 0;
    max-width: none;
    max-height: none;
    overflow: hidden;
    width: 100%;
    height: 100%;
    border: none;
    background: none;
    color: rgb(var(--P-color-fg));

    &::backdrop {
        opacity: 0;
    }

    > .inner-backdrop {
        position: absolute;
        inset: 0;
        background: rgba(0, 0, 0, 0.2);
    }

    > .i-arrow {
        position: absolute;
        top: 0;
        left: 0;
        --arrow-size: 16px;
        --arrow-color: var(--P-dialog-bg);

        &::before,
        &::after {
            content: '';
            position: absolute;
            top: calc(var(--arrow-size) * -0.5);
            left: calc(var(--arrow-size) * -0.5);
            border: calc(var(--arrow-size) * 0.5) solid transparent;
        }

        &::before {
            --arrow-size: 19px;
            --arrow-color: var(--P-dialog-outline);
        }

        &[data-type='left']::before,
        &[data-type='left']::after {
            border-right-color: var(--arrow-color);
            left: calc(var(--arrow-size) * -1);
        }
        &[data-type='right']::before,
        &[data-type='right']::after {
            border-left-color: var(--arrow-color);
            left: auto;
            right: calc(var(--arrow-size) * -1);
        }
        &[data-type='top']::before,
        &[data-type='top']::after {
            border-bottom-color: var(--arrow-color);
            top: calc(var(--arrow-size) * -1);
        }
        &[data-type='bottom']::before,
        &[data-type='bottom']::after {
            border-top-color: var(--arrow-color);
            top: calc(var(--arrow-size) * -0);
        }
    }

    > .inner-popover {
        position: absolute;
        background: var(--P-dialog-bg);
        box-shadow: 0 0.5em 1em rgba(0, 0, 0, 0.3), 0 0 0 1px var(--P-dialog-outline);
        border-radius: 0.5rem;
        overflow: hidden;

        > .i-content {
            position: absolute;
            top: 0;
            left: 0;
            max-width: calc(100vw - 2em);
            max-height: calc(100vh - 4em);
            overflow: hidden auto;
        }
    }
}
