@layer dialogs {
	dialog[data-id="facebook-post-overlay-dlg"] {
        .popup {
            height: 0;
            overflow: hidden;
            border-radius: 0 !important;
            opacity: 0;
            
            .card-body {
                padding: 0;

                placeholder {
                    width: min(500px, 90vw);

                    .loading {
                        width: 32px;
                    }   


                    .fb-post, iframe, .fb-post > span {
                        width: min(500px, 90vw) !important;
                    }                 
                }
            }

            .ux-icon-close {
                top: -11px !important;
                right: -12px !important;
                width: auto !important;
                background: #333;
                border-radius: 50%;
                padding: 4px;

                svg {
                    width: 17px !important;
                    fill: #fff !important;
                }
            }
        }

        & > .loading {
            display: none;
        }

        &.is-loading {
            & > .loading {
                display: inline-block;
                background-color: #f3f3f3;
                width: 42px;
                position: absolute;
                left: 50%;
                top: 50%;
                transform: translate(-50%,-50%);
            }
        }

        &.ready {
            .popup {
                height: auto;
                overflow: visible;   
            }
        }
    }
}