@media screen {
    .th-wide-table-content {
        max-width: var(--th-table-width);
    }

    @media (min-width: 1640px) {
        .container.th-wide-table-page {
            width: calc(100% - 80px);
            max-width: 1800px;
        }

        .th-wide-table-page .th-wide-table-content {
            max-width: none;
        }

        .th-wide-table-page .tenders-page {
            max-width: none;
        }
    }

    body:not(.dark-mode) {
        --th-page-bg: #e8edf1;
        --th-surface-bg: #f5f7f9;
        --th-header-bg: #e5ebf0;
        --th-subtle-bg: #edf1f5;
        --th-input-bg: #fafbfd;
        --th-border: #cdd6de;
        --bs-body-bg: var(--th-page-bg);
        --bs-border-color: var(--th-border);
        background-color: var(--th-page-bg) !important;
    }

    body:not(.dark-mode) .bg-white,
    body:not(.dark-mode) .card,
    body:not(.dark-mode) .modal-content,
    body:not(.dark-mode) .offcanvas,
    body:not(.dark-mode) .dropdown-menu,
    body:not(.dark-mode) .list-group-item,
    body:not(.dark-mode) .accordion-item,
    body:not(.dark-mode) #scoringGuidePanel,
    body:not(.dark-mode) #commentPanel,
    body:not(.dark-mode) #evalCommentPanel,
    body:not(.dark-mode) .viewer-empty,
    body:not(.dark-mode) .snapshot-banner,
    body:not(.dark-mode) .metric,
    body:not(.dark-mode) .chart-panel,
    body:not(.dark-mode) .recommendation-notes,
    body:not(.dark-mode) .viewer-narrative {
        background-color: var(--th-surface-bg) !important;
    }

    body:not(.dark-mode) .bg-light,
    body:not(.dark-mode) .column-filters th {
        background-color: var(--th-subtle-bg) !important;
    }

    body:not(.dark-mode) .navbar,
    body:not(.dark-mode) .viewer-header {
        background-color: #eef2f5 !important;
    }

    body:not(.dark-mode) .tender-toolbar {
        background-color: var(--th-surface-bg);
    }

    body:not(.dark-mode) .table:not(.table-primary):not(.table-secondary):not(.table-success):not(.table-danger):not(.table-warning):not(.table-info):not(.table-dark) {
        --bs-table-bg: var(--th-surface-bg);
        --bs-table-hover-bg: #e8eef4;
        --bs-table-striped-bg: #edf1f5;
        --bs-table-border-color: #d7dfe6;
    }

    body:not(.dark-mode) .table-light,
    body:not(.dark-mode) .table:not(.table-primary):not(.table-secondary):not(.table-success):not(.table-danger):not(.table-warning):not(.table-info):not(.table-dark) thead:not(.table-primary):not(.table-secondary):not(.table-success):not(.table-danger):not(.table-warning):not(.table-info):not(.table-dark) {
        --bs-table-bg: var(--th-header-bg);
    }

    body:not(.dark-mode) .form-control,
    body:not(.dark-mode) .form-select {
        background-color: var(--th-input-bg);
        border-color: #c4ced8;
    }

    body:not(.dark-mode) .form-control:disabled,
    body:not(.dark-mode) .form-select:disabled,
    body:not(.dark-mode) .input-group-text {
        background-color: var(--th-subtle-bg);
    }

    body:not(.dark-mode) .form-control:focus,
    body:not(.dark-mode) .form-select:focus {
        border-color: #86b7fe;
    }

    body:not(.dark-mode) .form-control.is-valid,
    body:not(.dark-mode) .form-select.is-valid,
    body:not(.dark-mode) .was-validated .form-control:valid,
    body:not(.dark-mode) .was-validated .form-select:valid {
        border-color: var(--bs-form-valid-border-color, #198754);
    }

    body:not(.dark-mode) .form-control.is-invalid,
    body:not(.dark-mode) .form-select.is-invalid,
    body:not(.dark-mode) .was-validated .form-control:invalid,
    body:not(.dark-mode) .was-validated .form-select:invalid {
        border-color: var(--bs-form-invalid-border-color, #dc3545);
    }

    body:not(.dark-mode) .accordion {
        --bs-accordion-bg: var(--th-surface-bg);
    }

    body:not(.dark-mode) .page-toolbar,
    body:not(.dark-mode) .viewer-toolbar {
        border-color: #ccd6df;
    }
}
