/* Mobile document review */
    @media (max-width: 767.98px) {
        /*
         * Match the compact single-row header used on the document viewer
         * page (.document-viewer-header): a small fixed-width back button
         * on the left, badge/meta sharing that same row on the right
         * instead of each wrapping onto its own full-width row.
         */
        .review-page-titlebar {
            align-items: center !important;
            flex-wrap: nowrap !important;
            gap: 10px !important;
            padding: 14px 16px;
        }
        .review-page-title-main {
            flex: 0 0 auto;
        }
        .review-page-title-main .review-back-btn {
            width: auto;
            min-width: 42px;
            height: 42px;
            padding: 0 12px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            white-space: nowrap;
        }
        .review-page-title-main .review-back-label {
            display: inline;
        }
        .review-page-side {
            flex: 1 1 auto;
            min-width: 0;
        }
        .review-page-heading {
            min-width: 0;
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: flex-end;
            gap: 6px;
        }
        .review-page-heading h5 {
            width: 100%;
            margin-left: 0 !important;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            font-size: 15px;
        }
        .review-page-meta {
            display: block;
            min-width: 0;
            line-height: 1.4;
            font-size: 12px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .comment-page-wrap {
            gap: 10px;
            overflow: visible;
        }
        .comment-doc-pane,
        .comment-thread-pane {
            border: 1px solid #e9ebec;
            border-radius: 8px;
        }
        .comment-doc-pane {
            height: 72vh;
            min-height: 520px;
            max-height: 820px;
        }
        .comment-thread-pane {
            height: min(56vh, 580px);
            min-height: 400px;
        }
        .comment-pane-header {
            flex-wrap: wrap;
            padding: 10px 12px;
        }
        .comment-doc-pane .comment-pane-header .preview-title-wrap {
            flex: 1 1 100%;
            margin-right: 0 !important;
        }
        .comment-doc-pane .comment-pane-header > .d-flex {
            width: 100%;
            justify-content: flex-end;
        }
        .comment-doc-pane .comment-pane-header .btn {
            flex: 0 0 auto;
            min-height: 34px;
            padding: 5px 10px;
            font-size: 12px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }
        .doc-version-sidebar {
            max-height: 96px;
        }
        .doc-version-list.nav {
            flex-flow: row nowrap !important;
            overflow-x: auto;
            overflow-y: hidden;
            padding-bottom: 2px;
            scrollbar-width: thin;
        }
        .doc-version-list .nav-link {
            flex: 0 0 auto;
            max-width: 190px;
        }
        .review-workflow-actions {
            padding: 12px;
        }
        .review-workflow-actions .review-action-grid {
            grid-template-columns: 1fr;
            gap: 8px;
        }
        .review-workflow-actions .review-action-grid .btn,
        .review-workflow-actions .review-action-grid--count-3 .review-action-primary,
        .review-workflow-actions .review-action-grid--count-5 .review-action-primary {
            grid-column: 1 / -1;
            min-height: 36px;
            padding: 6px 10px;
            font-size: 12px;
        }
        .comment-thread {
            padding: 12px;
            overscroll-behavior: contain;
        }
        .comment-thread > .d-flex {
            gap: 8px !important;
        }
        .comment-thread .replies-wrap {
            margin-left: 4px !important;
            padding-left: 9px !important;
        }
        .comment-thread .d-flex.align-items-baseline.justify-content-between {
            align-items: flex-start !important;
            flex-wrap: wrap;
        }
        .comment-thread .d-flex.align-items-center.gap-2.ms-2 {
            margin-left: 0 !important;
        }
        .comment-attachment a {
            max-width: 100%;
            overflow-wrap: anywhere;
        }
        .comment-compose {
            padding: 10px 12px;
            background: #fff;
        }
        .comment-compose .form-control {
            min-height: 76px;
            font-size: 16px;
        }
        .comment-compose-footer {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
            gap: 8px;
        }
        .comment-compose-footer .btn {
            width: auto;
            min-height: 32px;
            margin: 0 !important;
            padding: 4px 9px;
            font-size: 12px;
        }
        .reply-toggle {
            min-height: 38px;
        }
        .review-workflow-modal .modal-dialog {
            margin: 10px;
        }
        .review-workflow-modal .modal-footer {
            flex-wrap: nowrap;
        }
        .review-workflow-modal .modal-footer .btn {
            flex: 1 1 0;
            min-height: 44px;
        }
    }

    @media (max-width: 374.98px) {
        .comment-compose-footer {
            grid-template-columns: 1fr;
        }
        .comment-doc-pane {
            height: 70vh;
            min-height: 480px;
        }
    }