/* ============================================
   PROTEÇÃO DE POPUPS/MODAIS
   Arquivo: wwwroot/css-novo/dialogs.css
   Impede que popups herdem regras de grid
   ============================================ */

/* Reset de layout para diálogos */
.rz-dialog .rz-row {
    flex-direction: row !important;
    flex-wrap: wrap !important;
}

.rz-dialog .rz-column {
    width: auto !important;
    flex: initial !important;
    max-width: none !important;
}

.rz-dialog .rz-card {
    padding: var(--card-padding) !important;
}

/* ============================================
   TAMANHO PADRÃO DOS POPUPS QUANDO SCALE ESTÁ ATIVO
   Usado para popups maiores, cadastros, formulários etc.
   ============================================ */

body.scale-active .rz-dialog,
body.scale-active .radzen-dialog {
    width: 85vw !important;
    max-width: 1200px !important;
    min-width: min(800px, 95vw) !important;
}

    /* ============================================
   MODAL DE CONFIRMAÇÃO COMPACTO
   Use CssClass = "confirm-dialog" no DialogService.Confirm
   ============================================ */

    body.scale-active .rz-dialog.confirm-dialog,
    body.scale-active .radzen-dialog.confirm-dialog {
        width: auto !important;
        max-width: min(560px, 95vw) !important;
        min-width: min(420px, 95vw) !important;
    }

        /* Conteúdo do confirm mais enxuto */
        body.scale-active .rz-dialog.confirm-dialog .rz-dialog-content,
        body.scale-active .radzen-dialog.confirm-dialog .radzen-dialog-content {
            padding: 18px 24px !important;
        }

        /* Footer do confirm mantendo botões lado a lado */
        body.scale-active .rz-dialog.confirm-dialog .rz-dialog-footer,
        body.scale-active .radzen-dialog.confirm-dialog .radzen-dialog-footer {
            display: flex !important;
            flex-direction: row !important;
            justify-content: flex-end !important;
            align-items: center !important;
            gap: 12px !important;
            flex-wrap: nowrap !important;
        }

            body.scale-active .rz-dialog.confirm-dialog .rz-dialog-footer .rz-button,
            body.scale-active .radzen-dialog.confirm-dialog .radzen-dialog-footer .rz-button {
                min-width: 120px !important;
                width: auto !important;
                padding: 8px 20px !important;
            }

/* ============================================
   CONTEÚDO INTERNO DOS POPUPS
   ============================================ */

body.scale-active .rz-dialog-content,
body.scale-active .radzen-dialog-content {
    padding: 20px 24px !important;
    max-height: 80vh !important;
    overflow-y: auto !important;
}

    body.scale-active .rz-dialog-content > div,
    body.scale-active .radzen-dialog-content > div {
        width: 100% !important;
        max-width: 100% !important;
    }

/* ============================================
   FOOTER PADRÃO DOS POPUPS
   ============================================ */

body.scale-active .rz-dialog-footer,
body.scale-active .radzen-dialog-footer {
    display: flex !important;
    flex-direction: row !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 12px !important;
    flex-wrap: wrap !important;
}

    body.scale-active .rz-dialog-footer .rz-button,
    body.scale-active .radzen-dialog-footer .rz-button {
        min-width: 120px !important;
        padding: 8px 20px !important;
    }

/* ============================================
   RESPONSIVIDADE PARA DIFERENTES TAMANHOS
   ============================================ */

/* Telas entre 1366px e 1599px */
@media (min-width: 1366px) and (max-width: 1599px) {
    body.scale-active .rz-dialog,
    body.scale-active .radzen-dialog {
        width: 80vw !important;
        max-width: 1100px !important;
        min-width: min(760px, 95vw) !important;
    }

        body.scale-active .rz-dialog.confirm-dialog,
        body.scale-active .radzen-dialog.confirm-dialog {
            width: auto !important;
            max-width: min(560px, 95vw) !important;
            min-width: min(420px, 95vw) !important;
        }
}

/* Telas entre 1024px e 1365px */
@media (min-width: 1024px) and (max-width: 1365px) {
    body.scale-active .rz-dialog,
    body.scale-active .radzen-dialog {
        width: 85vw !important;
        max-width: 1000px !important;
        min-width: min(760px, 95vw) !important;
    }

        body.scale-active .rz-dialog.confirm-dialog,
        body.scale-active .radzen-dialog.confirm-dialog {
            width: auto !important;
            max-width: min(560px, 95vw) !important;
            min-width: min(420px, 95vw) !important;
        }

    body.scale-active .rz-dialog-content,
    body.scale-active .radzen-dialog-content {
        padding: 16px 20px !important;
    }
}

/* Telas menores que 1024px */
@media (max-width: 1023px) {
    body.scale-active .rz-dialog,
    body.scale-active .radzen-dialog {
        width: 95vw !important;
        min-width: auto !important;
        max-width: 95vw !important;
        max-height: 90vh !important;
    }

        body.scale-active .rz-dialog.confirm-dialog,
        body.scale-active .radzen-dialog.confirm-dialog {
            width: auto !important;
            max-width: min(560px, 95vw) !important;
            min-width: min(420px, 95vw) !important;
        }

    .rz-dialog-content {
        max-width: 95vw !important;
        overflow-y: auto !important;
    }

    .rz-dialog .rz-row {
        flex-direction: column !important;
    }

    .rz-dialog .rz-column {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }
}

/* Celular pequeno: botões do confirm podem empilhar */
@media (max-width: 480px) {
    body.scale-active .rz-dialog.confirm-dialog,
    body.scale-active .radzen-dialog.confirm-dialog {
        width: 95vw !important;
        min-width: auto !important;
        max-width: 95vw !important;
    }

        body.scale-active .rz-dialog.confirm-dialog .rz-dialog-footer,
        body.scale-active .radzen-dialog.confirm-dialog .radzen-dialog-footer {
            flex-direction: column !important;
        }

            body.scale-active .rz-dialog.confirm-dialog .rz-dialog-footer .rz-button,
            body.scale-active .radzen-dialog.confirm-dialog .radzen-dialog-footer .rz-button {
                width: 100% !important;
                min-width: auto !important;
            }
}