/* ============================================
   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;
}

/* ============================================
   AJUSTE DE LARGURA DOS POPUPS QUANDO ESCALA ESTÁ ATIVA
   ============================================ */

/* Quando o scale está ativo (telas menores), aumenta a largura do popup */
body.scale-active .rz-dialog,
body.scale-active .radzen-dialog {
    width: 85vw !important; /* 85% da largura da viewport */
    max-width: 1200px !important;
    min-width: 800px !important;
}

/* Ajuste do conteúdo interno do popup */
body.scale-active .rz-dialog-content,
body.scale-active .radzen-dialog-content {
    padding: 20px 24px !important;
    max-height: 80vh !important;
    overflow-y: auto !important;
}

    /* Garante que o conteúdo interno use todo o espaço */
    body.scale-active .rz-dialog-content > div,
    body.scale-active .radzen-dialog-content > div {
        width: 100% !important;
        max-width: 100% !important;
    }

/* Ajuste para o footer do popup */
body.scale-active .rz-dialog-footer,
body.scale-active .radzen-dialog-footer {
    padding: 16px 24px !important;
    gap: 12px !important;
}

    /* Botões dentro do popup */
    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 DE TELA
   ============================================ */

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

/* Para telas entre 1024px e 1365px (notebooks menores) */
@media (min-width: 1024px) and (max-width: 1365px) {
    body.scale-active .rz-dialog,
    body.scale-active .radzen-dialog {
        width: 85vw !important;
        min-width: 800px !important;
    }

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

/* Para 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;
    }
}

/* ============================================
   TAMANHO MÁXIMO DO DIÁLOGO EM TELAS PEQUENAS (ORIGINAL)
   ============================================ */
@media (max-width: 1024px) {
    .rz-dialog {
        max-width: 95vw !important;
        max-height: 90vh !important;
    }

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

    /* Dentro do diálogo, colunas podem empilhar */
    .rz-dialog .rz-row {
        flex-direction: column !important;
    }

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

/* Ajuste para botões dentro de diálogos */
@media (max-width: 768px) {
    .rz-dialog .rz-button {
        width: 100% !important;
        min-width: auto !important;
    }

    body.scale-active .rz-dialog-footer {
        flex-direction: column;
    }

        body.scale-active .rz-dialog-footer .rz-button {
            width: 100% !important;
        }
}