/* Clean Smart Pro — desktop mouse wheel / document scrolling repair.
 * Root cause: a legacy desktop rule forces main{overflow:hidden!important},
 * while the earlier single-finger repair runs only on touch/mobile devices.
 * Restore the document as the vertical scroll owner on desktop.
 * Preserve fixed sidebar, native inner dialog scrolling, horizontal lists
 * and body locks explicitly applied by dialogs or the app.
 */
@media (min-width: 781px) {
  html:root {
    height: auto !important;
    min-height: 100% !important;
    overflow-x: clip !important;
    overflow-y: auto !important;
    overscroll-behavior-y: auto !important;
  }
  html:root body:not([style*="overflow"]) {
    height: auto !important;
    min-height: 100% !important;
    overflow-x: clip !important;
    overflow-y: visible !important;
    overscroll-behavior-y: auto !important;
  }
  html:root body #app.app {
    height: auto !important;
    min-height: 100vh !important;
    overflow-x: clip !important;
    overflow-y: visible !important;
  }
  html:root body #app.app > main {
    height: auto !important;
    min-height: 100vh !important;
    max-height: none !important;
    overflow-x: clip !important;
    overflow-y: visible !important;
    overscroll-behavior-y: auto !important;
  }
  /* A panel or card must not become a false vertical scroll root. */
  html:root body #app.app.csp-dashboard-premium > main > .csp-dashboard-operations,
  html:root body #app.app.csp-dashboard-premium > main > .csp-dashboard-metrics {
    overflow-y: visible !important;
  }
  /* Genuine scrolling surfaces remain independently scrollable. */
  html:root body .modal .dialog,
  html:root body .qas-pred-modal .dialog,
  html:root body [role="dialog"] .dialog {
    overflow-y: auto !important;
    overscroll-behavior-y: contain;
  }
}
/* Fine-pointer devices at narrow desktop widths should scroll like mobile
 * without overriding modal-specific overflow locks. */
@media (max-width: 780px) and (hover: hover) and (pointer: fine) {
  html:root { overflow-x: clip !important; overflow-y: auto !important; }
  html:root body:not([style*="overflow"]) {
    overflow-x: clip !important; overflow-y: visible !important;
  }
  html:root body #app.app,
  html:root body #app.app > main {
    overflow-x: clip !important;
    overflow-y: visible !important;
    height: auto !important;
  }
}
