/* ============================================
   FIX CRÍTICO PARA TEXTO VERTICAL
   ============================================ */

@media (max-width: 768px) {
    /* RESET ABSOLUTO - Eliminar cualquier transformación vertical */
    table.materials-list *,
    tbody.materials-list *,
    tr.materials-list *,
    .materials-list *,
    .materials-list *::before,
    .materials-list *::after {
        writing-mode: horizontal-tb !important;
        -webkit-writing-mode: horizontal-tb !important;
        -ms-writing-mode: lr-tb !important;
        text-orientation: mixed !important;
        direction: ltr !important;
        unicode-bidi: normal !important;
        transform: none !important;
        -webkit-transform: none !important;
    }

    /* FORZAR CONTENEDOR FLEX EN HORIZONTAL */
    .materials-list tr td,
    .materials-list tbody tr td {
        display: block !important;
        width: 100% !important;
    }

    /* HEADER DEL MATERIAL - DEBE SER HORIZONTAL */
    .materials-list .d-flex.justify-content-between,
    .materials-list .d-flex.justify-content-between.align-items-start {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        width: 100% !important;
    }

    /* TEXTO DEL MATERIAL - MÁXIMA PRIORIDAD */
    .materials-list .fw-bold,
    .materials-list .text-primary,
    .materials-list .fw-bold.text-primary,
    .materials-list div.fw-bold.text-primary,
    .materials-list div.fw-bold.text-primary.flex-grow-1,
    .materials-list .d-flex .fw-bold,
    .materials-list .d-flex .text-primary {
        display: inline-block !important;
        width: auto !important;
        max-width: calc(100% - 60px) !important;
        white-space: normal !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        font-size: 0.95rem !important;
        line-height: 1.4 !important;
        writing-mode: horizontal-tb !important;
        text-orientation: mixed !important;
        direction: ltr !important;
        float: none !important;
        flex-direction: row !important;
    }

    /* NO VERTICAL LAYOUT PARA CONTAINERS DE TEXTO */
    .materials-list .card-body > div:first-child,
    .materials-list .card-body > .d-flex:first-child {
        flex-direction: row !important;
        display: flex !important;
    }
}
