/**
 * S-Cloud — Responsive preview pour mobile
 * v2.2.42 — Approche docx-preview ignoreWidth + CSS fluide
 *
 * Adapte l'affichage des previews DOCX/XLSX/CSV/PDF/text aux écrans mobiles
 * sans CSS transform (qui cause des coupures de contenu).
 */

/* ── Container preview : permet scroll horizontal si besoin (tables larges) ── */
#scDocxContainer,
#scXlsxContainer,
#scCsvContainer {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* ── Mobile : ajustements UX ── */
@media (max-width: 768px) {
    #scDocxContainer,
    #scXlsxContainer,
    #scCsvContainer {
        padding: .5rem !important;
        min-height: 400px !important;
    }

    /* PDF iframe : hauteur basée sur viewport */
    .col-lg-8 .card-body iframe[title="Preview PDF"] {
        height: 75vh !important;
        min-height: 400px;
    }

    /* Texte iframe */
    .col-lg-8 .card-body iframe[title="Preview texte"] {
        height: 60vh !important;
        min-height: 300px;
    }

    /* Image / Video */
    .col-lg-8 .card-body img { max-height: 60vh !important; }
    .col-lg-8 .card-body video { max-height: 60vh !important; }

    /* ─────────────────────────────────────────────────────────
       docx-preview : le rendre FLUIDE (pas A4 fixe) sur mobile
       Override les styles inline injectés par la lib
       ───────────────────────────────────────────────────────── */
    #scDocxContainer .docx-wrapper {
        background: transparent !important;
        padding: 0 !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    #scDocxContainer .docx-wrapper > section.docx,
    #scDocxContainer .docx-wrapper > article.docx {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        min-height: auto !important;
        padding: .5rem !important;
        margin: 0 0 .5rem 0 !important;
        box-shadow: 0 1px 3px rgba(0,0,0,.08) !important;
    }

    /* Paragraphes et runs : forcer le wrap des longs mots */
    #scDocxContainer .docx p,
    #scDocxContainer .docx div,
    #scDocxContainer .docx span,
    #scDocxContainer .docx-wrapper p,
    #scDocxContainer .docx-wrapper div {
        max-width: 100% !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
    }

    /* Images intégrées dans le docx : limiter à 100% */
    #scDocxContainer img {
        max-width: 100% !important;
        height: auto !important;
    }

    /* Tables dans docx : scroll horizontal si trop large */
    #scDocxContainer table {
        max-width: 100% !important;
        font-size: .82rem !important;
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }
    #scDocxContainer table td,
    #scDocxContainer table th {
        padding: .25rem .35rem !important;
    }

    /* XLSX/CSV : tables petites avec scroll horizontal */
    #scXlsxContainer table,
    #scCsvContainer table {
        font-size: .72rem !important;
    }
    #scXlsxContainer th,
    #scXlsxContainer td,
    #scCsvContainer th,
    #scCsvContainer td {
        padding: .25rem .35rem !important;
        white-space: nowrap;
    }

    /* Card header preview : nom fichier en truncate */
    .col-lg-8 .card-header.sc-card-head .fw-bold {
        max-width: calc(100vw - 100px);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

/* ── Très petits écrans (≤ 400px) ── */
@media (max-width: 400px) {
    #scDocxContainer,
    #scXlsxContainer,
    #scCsvContainer {
        padding: .25rem !important;
    }

    #scDocxContainer .docx-wrapper > section.docx,
    #scDocxContainer .docx-wrapper > article.docx {
        padding: .35rem !important;
    }
}