/*
    Nombre : mifindex-mineria-wrap.css
    Resumen: Conjunto de estilos aplicados a campos del formulario de personalización y cuadrícula para ajustar su texto al tamaño de su contenedor
             Estos estilos de ajuste se combinan con los estilos de la hoja mifindex-mineria.css
    Fecha  : 17/04/2026
    Notas  : Clases extraídas propuestas por Google Gemini IA
*/

/*1. FORMULARIO DE CAMPOS: panel árbol de campos*/

/* Ajustar el contenedor del nodo */
.dxtv-nd {
    height: auto !important;
    display: flex;
    align-items: flex-start;            /* Mantiene el inicio arriba */
    padding: 4px 0;
}
/* Ajustar el texto en los nodos del árbol */
.dxtv-ndTxt {
    white-space: normal !important;
    display: inline-block;
    vertical-align: top !important;
    word-break: break-word;
    max-width: 390px;                   /*375px, origen.GAB: personalizado en método customFormLabels, mifindex.mining.js*/
    line-height: 1.2 !important;        /* Reduce el espacio entre líneas para subir el texto */
    padding-top: 0 !important;          /* Elimina espacio superior residual */
    margin-top: -1px !important;        /* Ajuste fino opcional: usa valores negativos si sigue bajo */
    text-align: justify;
}
/* Ajustar la imagen */
.dxtv-ndImg {
    vertical-align: top !important;
    margin-top: 0px !important;         /* Restablecido para que sea el punto de referencia */
    flex-shrink: 0;
}

/*2. FORMULARIO DE CAMPOS: panel Area de Datos*/

/* 1. Forzar el ajuste en las celdas de los encabezados dentro del formulario de personalización */
/*GAB: no tiene efecto en el área de datos de formulario, bajo evaluación */
/*.dxpgCustFields_Material .dxpgHeaderText_Material {
            white-space: normal !important;
            word-break: break-word;
            min-width: 150px; 
            max-width: 350px;
            padding: 5px !important;
        }*/

/* 2. Ajustar el div interno que contiene el texto */
.dxpgCustFields_Material .dxpgHeaderText_Material div {
    white-space: normal !important;     /*Propiedad determinante: it is used to create multiple lines in a <text> element, which does not wrap by default*/
    /*height: auto !important;*/
    line-height: 1.2 !important;
    /*display: block !important;*/
    text-align: justify;
}

/* 3. Asegurar que la tabla contenedora no se desborde */
/*GAB: no tiene efecto en ajuste de texto del campo en área de datos*/
/*.dxpgCustFields_Material .dxpgHeaderTable_Material {
    width: 100% !important;
    table-layout: fixed;                /* Ayuda a que el max-width del padre se respete */
/*}*/

/*CUADRICULA: celdas del área de filas*/

/* Ajusta el texto largo en las celdas de las filas (Row Area) */
.dxpgRowFieldValue_Material {
    white-space: normal !important;     /* Permite que el texto salte de línea */
    word-wrap: break-word;              /* Rompe palabras si son demasiado largas */
    min-width: 150px;                   /* Ancho mínimo para que no se vea muy comprimido */
    max-width: 300px;                   /* Ancho máximo: ajusta este valor según tu diseño */
    padding: 8px 5px !important;        /* Mejora el espacio visual entre filas */
    line-height: 1.2 !important;        /* Espaciado entre líneas del nombre largo */
    text-align: justify;
}
.dxpgDataCell_Material {
    vertical-align: middle !important;  /* alinea contenido de celda de datos */
}