/* ============================================================================
   base.css  -  reset, root layout, theme-visibility, overlay base.
   Shared by both themes. Per-use-case accent is set on #frmMain at runtime
   (--accent / --accent-hover).
   ========================================================================== */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; height: 100%; }
body { overflow: hidden; }

#frmMain {
  position: absolute; inset: 0; display: flex; flex-direction: column;
  --accent: #4f46e5; --accent-hover: #4039bb;
}
.app-body { flex: 1; min-height: 0; display: flex; flex-direction: column; }

.legacy .modern-only { display: none !important; }
.modern .legacy-only { display: none !important; }

/* modal overlay base (shared - dialog chrome lives in dialogs.css) */
.overlay {
  position: absolute; inset: 0; background: rgba(15, 23, 42, .48);
  display: flex; align-items: center; justify-content: center; z-index: 100;
  backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
}
.dialog { background: #fff; box-shadow: 0 28px 80px rgba(2, 6, 23, .45); display: flex; flex-direction: column; max-height: 92%; }