.shared-document-panel {
    display: block !important;
    overflow: hidden;
    margin-inline: 0;
    scroll-margin-top: 8rem;
    --document-panel-height: 65vh;
}
.shared-document-panel > .shared-document-track {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 150%;
    max-width: none !important;
    height: var(--document-panel-height);
    padding: 0;
    transition: transform .35s ease;
}
.shared-document-track > * {
    width: auto !important;
    max-width: none !important;
    min-width: 0;
    margin: 0 !important;
    padding: 0 .75rem;
    overflow: auto;
    height: 100%;
    box-sizing: border-box;
}
.shared-document-panel.is-preview-open > .shared-document-track { transform: translateX(-33.333333%); }
.shared-document-panel [data-shared-preview] { visibility: hidden; transition: visibility 0s .35s; }
.shared-document-panel.is-preview-open [data-shared-preview] { visibility: visible; transition-delay: 0s; }
.shared-document-panel [data-shared-list] img { max-width: 100%; max-height: 180px; object-fit: contain; }
.shared-document-panel table { width: 100%; margin: 0; }
.shared-document-panel thead th { position: sticky; top: 0; z-index: 1; }
.shared-document-preview {
    display: flex;
    flex-direction: column;
    border: 1px solid #dee2e6;
    border-radius: .5rem;
    background: #fff;
}
.shared-document-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
    gap: .75rem;
    padding: .75rem;
    border-bottom: 1px solid #dee2e6;
    background: #f8f9fa;
}
.shared-document-heading strong { min-width: 0; overflow-wrap: anywhere; }
.shared-document-content {
    display: flex;
    flex: 1;
    min-height: 0;
    align-items: center;
    justify-content: center;
    overflow: auto;
}
.shared-document-content iframe { width: 100%; height: 100%; border: 0; }
.shared-document-content img, .shared-document-content video { max-width: 100%; max-height: 100%; object-fit: contain; }
.shared-document-content pre { width: 100%; height: 100%; margin: 0; padding: 1rem; white-space: pre-wrap; overflow-wrap: anywhere; }
.office-document-drawer { width: min(75vw, 1100px) !important; }
.office-document-drawer > .shared-document-preview { width: 100%; height: 100%; border: 0; border-radius: 0; }
[data-document-url] { cursor: pointer; }
[data-document-url]:focus-visible { outline: 2px solid #0d6efd; outline-offset: 2px; }
@media (max-width: 767.98px) {
    .shared-document-panel > .shared-document-track { display: block; position: relative; width: 100%; height: auto; }
    .shared-document-track > [data-shared-form], .shared-document-track > [data-shared-list] {
        height: auto;
        max-height: var(--document-panel-height);
        margin-bottom: 1rem !important;
    }
    .shared-document-track > [data-shared-preview] {
        position: absolute;
        left: 100%;
        top: 0;
        width: 100% !important;
        height: var(--document-panel-height);
    }
    .shared-document-panel.is-preview-open > .shared-document-track { transform: translateX(-100%); }
    .office-document-drawer { width: 100% !important; }
    .shared-document-heading { align-items: flex-start; flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
    .shared-document-panel > .shared-document-track,
    .shared-document-panel [data-shared-preview] { transition: none; }
}
/* Pending uploads keep the form on the left and use the right preview column. */
.shared-document-panel.is-upload-preview > .shared-document-track {
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    transform: none;
}
.shared-document-panel.is-upload-preview [data-shared-list] { display: none; }
.shared-document-panel.is-upload-preview [data-shared-preview] { visibility: visible; transition-delay: 0s; }
.shared-document-content > .project-upload-preview { width: 100%; height: 100%; margin: 0; }
.project-upload-layout.has-upload-preview {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    height: var(--document-panel-height);
}
.project-upload-layout.has-upload-preview > form { overflow: auto; min-height: 0; }
.project-upload-side-preview { display: none; min-height: 0; }
.has-upload-preview > .project-upload-side-preview { display: block; overflow: auto; }
.project-upload-side-preview > .project-upload-preview { height: 100%; margin: 0; }
.shared-document-heading [hidden] { display: none !important; }
@media (max-width: 767.98px) {
    .shared-document-panel.is-upload-preview > .shared-document-track { display: grid; height: var(--document-panel-height); }
    .shared-document-panel.is-upload-preview .shared-document-track > [data-shared-preview] { position: static; width: auto !important; }
    .project-upload-layout.has-upload-preview { grid-template-columns: minmax(0, 1fr); height: auto; }
    .has-upload-preview > .project-upload-side-preview { height: var(--document-panel-height); }
}

.document-editor-modal .modal-body { height: calc(90vh - 75px); overflow: auto; }
.document-editor-modal .modal-content { max-height: 95vh; }
.document-editor-modal .form-label { display: block; width: 100%; }
.document-editor-current-media { display: block; width: 100%; height: calc(100% - 2rem); min-height: 200px; object-fit: contain; border: 0; }
.document-editor-modal .modal-body > [data-document-module] { height: calc(100% - 2.5rem); }
.shared-document-content > iframe { flex: 1; align-self: stretch; }
@media (max-width: 575.98px) {
    .shared-document-panel.is-upload-preview > .shared-document-track { display: block; height: auto; }
    .shared-document-panel.is-upload-preview .shared-document-track > [data-shared-preview] { height: var(--document-panel-height); }
}
