/* ACXA_MODAL_DIM_NO_BLUR_V1
 * Match Add part (#maintAccessoryModal): slight dim, no blur, block taps/scroll
 * behind the window. Do not restyle inner modal cards, forms, or buttons. */

:root {
  --acxa-modal-dim: rgba(0, 0, 0, 0.60);
}

html:not(.dark) {
  --acxa-modal-dim: rgba(0, 0, 0, 0.60);
}

html.dark {
  --acxa-modal-dim: rgba(0, 0, 0, 0.60);
}

#setupModal,
#operatorModal,
#operatorBulkModal,
#machineRegistryModal,
#machineRegistrySheetModal,
#manualAssignModal,
#rptFilterModal,
#shiftReportModal,
#nodeExportModal,
#faultDetailModal,
#bootLogModal,
#kbdModal,
#dataAccessDeniedModal,
#wifiPanel,
#maintAlertModal,
#maintBulkModal,
#maintAccessoryModal,
#workerCalendarModal,
#slaveInspectorPopup,
.slave-inspector-overlay,
.rename-popover-overlay,
#rename-popover,
#billingModalOverlay,
#subscriptionLockscreen,
#acxaSubVerifyOverlay,
#acxaHostingUpdateModal,
#settingsWifiPrompt,
.settings-wifi-prompt-overlay,
#onboardOverlay,
.onboard-overlay,
.export-modal-overlay,
.kbd-modal-overlay,
.fm-overlay,
.ar-overlay,
.ahu-overlay,
.maint-modal-overlay,
.rpt-modal-overlay {
  background: var(--acxa-modal-dim) !important;
  background-image: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  pointer-events: auto !important;
}

/* Overlay layer itself should not scroll the page; inner cards still can. */
#setupModal,
#operatorModal,
#operatorBulkModal,
#machineRegistryModal,
#machineRegistrySheetModal,
#manualAssignModal,
#rptFilterModal,
#shiftReportModal,
#nodeExportModal,
#faultDetailModal,
#bootLogModal,
#kbdModal,
#dataAccessDeniedModal,
#wifiPanel,
#maintAlertModal,
#maintBulkModal,
#maintAccessoryModal,
#workerCalendarModal,
#slaveInspectorPopup,
.slave-inspector-overlay,
.rename-popover-overlay,
#rename-popover,
#billingModalOverlay,
#subscriptionLockscreen,
#acxaSubVerifyOverlay,
#acxaHostingUpdateModal,
#settingsWifiPrompt,
.settings-wifi-prompt-overlay,
#onboardOverlay,
.onboard-overlay,
.export-modal-overlay,
.kbd-modal-overlay,
.fm-overlay,
.ar-overlay,
.ahu-overlay,
.maint-modal-overlay,
.rpt-modal-overlay {
  touch-action: none;
  overscroll-behavior: none;
}

#setupModal > *,
#operatorModal > *,
#operatorBulkModal > *,
#machineRegistryModal > *,
#machineRegistrySheetModal > *,
#manualAssignModal > *,
#rptFilterModal > *,
#shiftReportModal > *,
#nodeExportModal > *,
#faultDetailModal > *,
#bootLogModal > *,
#kbdModal > *,
#dataAccessDeniedModal > *,
#wifiPanel > *,
#maintAlertModal > *,
#maintBulkModal > *,
#maintAccessoryModal > *,
#workerCalendarModal > *,
#slaveInspectorPopup > *,
.slave-inspector-overlay > *,
.rename-popover-overlay > *,
#rename-popover > *,
#billingModalOverlay > *,
#subscriptionLockscreen > *,
#acxaSubVerifyOverlay > *,
#acxaHostingUpdateModal > *,
#settingsWifiPrompt > *,
#onboardOverlay > *,
.maint-modal-overlay > * {
  pointer-events: auto !important;
  touch-action: pan-y;
}

/* Page behind any open window: no taps, no scroll (same idea as Add part).
 * ACXA_MODAL_WINDOW_HEADER_CLICKS_V1 — target the page top bar by class only.
 * A bare `header` selector also matched a window's own header (Report Studio),
 * which killed its close button. */
body.acxa-modal-open,
html.acxa-modal-open {
  overflow: hidden !important;
  overscroll-behavior: none !important;
}
body.acxa-modal-open > header.topbar,
body.acxa-modal-open header.command-topbar,
body.acxa-modal-open header.premium-header,
body.acxa-modal-open .premium-footer,
body.acxa-modal-open #mobileBottomNav,
body.acxa-modal-open .mobile-bottom-nav,
body.acxa-modal-open .page,
body.acxa-modal-open #mainContent,
body.acxa-modal-open #page-live,
body.acxa-modal-open #page-nodes,
body.acxa-modal-open #page-operators,
body.acxa-modal-open #page-reports,
body.acxa-modal-open #page-notifications,
body.acxa-modal-open #page-performance,
body.acxa-modal-open #page-maintenance,
body.acxa-modal-open #page-settings,
body.acxa-modal-open #page-subscription {
  pointer-events: none !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
  touch-action: none !important;
}

body.acxa-modal-open #setupModal,
body.acxa-modal-open #operatorModal,
body.acxa-modal-open #operatorBulkModal,
body.acxa-modal-open #machineRegistryModal,
body.acxa-modal-open #machineRegistrySheetModal,
#machineRegistryModal,
#machineRegistrySheetModal,
body.acxa-modal-open #manualAssignModal,
body.acxa-modal-open #rptFilterModal,
body.acxa-modal-open #shiftReportModal,
body.acxa-modal-open #nodeExportModal,
body.acxa-modal-open #faultDetailModal,
body.acxa-modal-open #bootLogModal,
body.acxa-modal-open #kbdModal,
body.acxa-modal-open #dataAccessDeniedModal,
body.acxa-modal-open #wifiPanel,
body.acxa-modal-open #maintAlertModal,
body.acxa-modal-open #maintBulkModal,
body.acxa-modal-open #maintAccessoryModal,
body.acxa-modal-open #workerCalendarModal,
body.acxa-modal-open #slaveInspectorPopup,
body.acxa-modal-open .slave-inspector-overlay,
body.acxa-modal-open .rename-popover-overlay,
body.acxa-modal-open #rename-popover,
body.acxa-modal-open #billingModalOverlay,
body.acxa-modal-open #subscriptionLockscreen,
body.acxa-modal-open #acxaSubVerifyOverlay,
body.acxa-modal-open #acxaHostingUpdateModal,
body.acxa-modal-open #settingsWifiPrompt,
body.acxa-modal-open #onboardOverlay,
body.acxa-modal-open .maint-modal-overlay,
body.acxa-modal-open #trialOfferScreen,
body.acxa-modal-open #trialSuccessOverlay,
body.acxa-modal-open #backlogSuccessOverlay,
body.acxa-modal-open #paymentVerifyingOverlay,
body.acxa-modal-open #paymentSuccessOverlay,
body.acxa-modal-open #dataAccessPeriodsModal,
body.acxa-modal-open #dagBacklogConfirm,
body.acxa-modal-open #toastContainer,
body.acxa-modal-open #toastContainer * {
  pointer-events: auto !important;
}

/* ACXA_MODAL_WINDOW_HEADER_CLICKS_V1
 * A window's own title bar (and its close button) must stay tappable while the
 * page behind is inert. Keep this even if a page-chrome rule ever matches it. */
body.acxa-modal-open #setupModal header,
body.acxa-modal-open #operatorModal header,
body.acxa-modal-open #operatorBulkModal header,
body.acxa-modal-open #manualAssignModal header,
body.acxa-modal-open #rptFilterModal header,
body.acxa-modal-open #rptFilterModal .ar-head,
body.acxa-modal-open #rptFilterModal .ar-close,
body.acxa-modal-open #shiftReportModal header,
body.acxa-modal-open #nodeExportModal header,
body.acxa-modal-open #faultDetailModal header,
body.acxa-modal-open #bootLogModal header,
body.acxa-modal-open #kbdModal header,
body.acxa-modal-open #wifiPanel header,
body.acxa-modal-open #maintAlertModal header,
body.acxa-modal-open #maintBulkModal header,
body.acxa-modal-open #maintAccessoryModal header,
body.acxa-modal-open #workerCalendarModal header,
body.acxa-modal-open #slaveInspectorPopup header,
body.acxa-modal-open #billingModalOverlay header,
body.acxa-modal-open #onboardOverlay header,
body.acxa-modal-open .maint-modal-overlay header,
body.acxa-modal-open .slave-inspector-overlay header {
  pointer-events: auto !important;
  touch-action: pan-y !important;
}

#trialOfferScreen,
#trialSuccessOverlay,
#backlogSuccessOverlay,
#paymentVerifyingOverlay,
#paymentSuccessOverlay,
#dataAccessPeriodsModal,
#dagBacklogConfirm {
  background: var(--acxa-modal-dim) !important;
  background-image: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  pointer-events: auto !important;
}

#dataAccessDeniedModal > div[style*="inset:0"],
#dataAccessPeriodsModal > div[style*="inset:0"],
#dagBacklogConfirm > div[style*="inset:0"] {
  background: var(--acxa-modal-dim) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Machine details waiting cover: fully hide the real page and eat clicks.
 * Placeholder bars do not fetch extra data — they only cover while the page fills in. */
.node-detail-skeleton-overlay,
#nodeDetailSkeletonOverlay {
  pointer-events: auto !important;
  background: #191918 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html:not(.dark) .node-detail-skeleton-overlay,
html:not(.dark) #nodeDetailSkeletonOverlay {
  background: #ffffff !important;
}
.node-detail-is-loading {
  overflow: hidden !important;
}
.node-detail-is-loading > *:not(.node-detail-skeleton-overlay):not(#nodeDetailSkeletonOverlay) {
  visibility: hidden !important;
  pointer-events: none !important;
}

/* ══════════════════════════════════════════════════════════════════════
 * ACXA_MODAL_SURFACE_V1 — every modal window is a SOLID panel.
 *
 * Cards on a page are deliberately a touch translucent for depth: in night
 * mode `bg-surface-900` paints a gradient at 92-96% opacity, and
 * `bg-surface-800` as low as 82%. On a card sitting on the page background
 * that reads as texture. On a modal floating over a busy page it reads as a
 * see-through window — worker cards showing through Add Worker, parts rows
 * through Add part. A window must never leak the page behind it.
 *
 * Only an opaque BASE is added: the existing gradient stays as the paint on
 * top, so the look is unchanged apart from the bleed. Every window listed in
 * this file is covered, in both themes, so modals cannot drift apart again.
 * ══════════════════════════════════════════════════════════════════════ */

:root {
  /* Same colours the panels already use, at full opacity. */
  --acxa-modal-surface: #ffffff;
}
html.dark {
  --acxa-modal-surface: rgb(28, 29, 27);
}

html #setupModal > *,
html #operatorModal > *,
html #operatorBulkModal > *,
html #machineRegistryModal > *,
html #machineRegistrySheetModal > *,
html #manualAssignModal > *,
html #rptFilterModal > *,
html #shiftReportModal > *,
html #nodeExportModal > *,
html #faultDetailModal > *,
html #bootLogModal > *,
html #kbdModal > *,
html #dataAccessDeniedModal > *,
html #wifiPanel > *,
html #maintAlertModal > *,
html #maintBulkModal > *,
html #maintAccessoryModal > *,
html #workerCalendarModal > *,
html #slaveInspectorPopup > *,
html #billingModalOverlay > *,
html #acxaSubVerifyOverlay > *,
html #acxaHostingUpdateModal > *,
html #settingsWifiPrompt > *,
html #onboardOverlay > *,
html .slave-inspector-overlay > *,
html .rename-popover-overlay > *,
html .settings-wifi-prompt-overlay > *,
html .onboard-overlay > *,
html .export-modal-overlay > *,
html .kbd-modal-overlay > *,
html .maint-modal-overlay > *,
html .rpt-modal-overlay > *,
html .maint-modal-panel,
html .export-modal,
html .ar-shell,
html .ahu-shell,
html .fm-shell {
  background-color: var(--acxa-modal-surface) !important;
}

/* Panels whose own rule paints a translucent gradient need the gradient
 * itself made solid, not just a base behind it. */
html.dark #operatorModal > *,
html.dark #operatorBulkModal > *,
html.dark #machineRegistryModal > *,
html.dark #machineRegistrySheetModal > *,
html.dark #manualAssignModal > *,
html.dark #workerCalendarModal > *,
html.dark #maintAlertModal > *,
html.dark #maintBulkModal > *,
html.dark #maintAccessoryModal > *,
html.dark .maint-modal-panel {
  background-image: linear-gradient(160deg, rgb(32, 32, 30), rgb(25, 26, 27)) !important;
}

html:not(.dark) #operatorModal > *,
html:not(.dark) #operatorBulkModal > *,
html:not(.dark) #machineRegistryModal > *,
html:not(.dark) #machineRegistrySheetModal > *,
html:not(.dark) #manualAssignModal > *,
html:not(.dark) #workerCalendarModal > *,
html:not(.dark) #maintAlertModal > *,
html:not(.dark) #maintBulkModal > *,
html:not(.dark) #maintAccessoryModal > *,
html:not(.dark) .maint-modal-panel {
  background-image: linear-gradient(180deg, #ffffff 0%, #ffffff 100%) !important;
}

/* Staff Admin app (admin.html) windows — same rule, same look. Listed here
 * so the two dashboards cannot drift apart; the ids are inert on app.html. */
html #adminBootLogModal > *,
html #bootHistoryModal > *,
html #signalChartModal > *,
html #subCreateModal > *,
html #subHistoryModal > *,
html #subMachineModal > *,
html #authEditModal > *,
html #dbEditorModal > * {
  background-color: var(--acxa-modal-surface) !important;
}
html.dark #adminBootLogModal > *,
html.dark #bootHistoryModal > *,
html.dark #signalChartModal > *,
html.dark #subCreateModal > *,
html.dark #subHistoryModal > *,
html.dark #subMachineModal > *,
html.dark #authEditModal > *,
html.dark #dbEditorModal > * {
  background-image: linear-gradient(160deg, rgb(32, 32, 30), rgb(25, 26, 27)) !important;
}
html:not(.dark) #adminBootLogModal > *,
html:not(.dark) #bootHistoryModal > *,
html:not(.dark) #signalChartModal > *,
html:not(.dark) #subCreateModal > *,
html:not(.dark) #subHistoryModal > *,
html:not(.dark) #subMachineModal > *,
html:not(.dark) #authEditModal > *,
html:not(.dark) #dbEditorModal > * {
  background-image: linear-gradient(180deg, #ffffff 0%, #ffffff 100%) !important;
}