/*
 * p:dialog no PrimeFaces 16 com primefaces.THEME=none (fase 4 da modernizacao, #23228).
 *
 * O dialogo virou duas camadas: .ui-dialog (camada fixa que cobre a tela e rola o conteudo longo) e .ui-dialog-box
 * (a caixa). O JS do PrimeFaces posiciona a caixa DENTRO da camada; quem faz a camada cobrir a tela sao os temas
 * oficiais, que o sistema nao usa. Sem esta folha a camada fica do tamanho da caixa, presa no fim da pagina.
 *
 * - A camada deixa passar o clique (pointer-events: none), para o dialogo nao modal nao travar a tela; a caixa
 *   volta a receber o clique. No modal quem bloqueia a tela e a mascara (.ui-widget-overlay).
 * - "body ..." sobe a especificidade: o components.css do PrimeFaces carrega depois das folhas do sistema.
 * - As classes de largura (pDialog30/50/75/90) ficam na raiz do dialogo, que agora e a camada: a largura passa para
 *   a caixa (percentual da area util da camada).
 */
body .ui-dialog:not(.ui-dialog-absolute) {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

body .ui-dialog {
    padding: 1.5rem;
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: auto;
    pointer-events: none;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

/* Caixa do tamanho do conteudo, como nos temas oficiais: sem isto o dialogo sem largura definida (openDynamic, com o
   iframe de contentWidth fixo) estica ate a largura da camada e sobra uma faixa vazia a direita */
body .ui-dialog > .ui-dialog-box {
    pointer-events: auto;
    position: relative;
    display: inline-flex;
    flex-direction: column;
}

body .ui-dialog.ui-dialog-absolute > .ui-dialog-box {
    position: absolute;
}

body .ui-dialog.pDialog30,
body .ui-dialog.pDialog50,
body .ui-dialog.pDialog75,
body .ui-dialog.pDialog90 {
    width: auto !important;
    max-width: none !important;
}

body .ui-dialog.pDialog30 > .ui-dialog-box {
    width: 30% !important;
}

body .ui-dialog.pDialog50 > .ui-dialog-box {
    width: 50% !important;
}

body .ui-dialog.pDialog75 > .ui-dialog-box {
    width: 75% !important;
}

body .ui-dialog.pDialog90 > .ui-dialog-box {
    width: 90% !important;
    max-width: unset !important;
}

/*
 * Tamanhos que ficavam no style="" do p:dialog. No PrimeFaces 16 o style vai para a raiz (a camada da tela toda), nao
 * para a caixa: o "carregando" (block) virava uma camada de 120x120 no canto da tela. Use styleClass com estas classes
 * (ou crie outra aqui) em vez de style no p:dialog; o DialogSemStyleTest barra o style.
 */
body .ui-dialog.dlgBlock > .ui-dialog-box {
    border: none !important;
    width: 120px !important;
    height: 120px !important;
}

body .ui-dialog.dlgBlock > .ui-dialog-box > .ui-dialog-content {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    height: 100% !important;
    padding: 0 !important;
    overflow: hidden !important;
}

body .ui-dialog.dlgBlock > .ui-dialog-box > .ui-dialog-titlebar {
    display: none !important;
}

body .ui-dialog.dlgBlock > .ui-dialog-box > .ui-dialog-content img {
    margin: 0 !important;
}

body .ui-dialog.dlgAlturaMax500 > .ui-dialog-box {
    max-height: 500px !important;
}

body .ui-dialog.dlgAlturaMax700 > .ui-dialog-box {
    max-height: 700px !important;
}

body .ui-dialog.dlgLargura500 > .ui-dialog-box {
    width: 500px !important;
}

body .ui-dialog.dlgLargura505 > .ui-dialog-box {
    width: 505px !important;
}

body .ui-dialog.dlgLargura640 > .ui-dialog-box {
    width: 640px !important;
}

body .ui-dialog.dlgLargura700 > .ui-dialog-box {
    width: 700px !important;
}

body .ui-dialog.dlgLarguraMin700 > .ui-dialog-box {
    min-width: 700px !important;
}

body .ui-dialog.dlgMargemTopo50 > .ui-dialog-box {
    margin-top: 50px !important;
}