/* bh-base.css - the global base rules MudBlazor.min.css (and MudThemeProvider) applied to every
   page, which the app's markup and CSS were laid out against. Loaded after bh-reboot.css,
   site.css and platform-components.css (whose last section is the pc- utility classes that
   replaced MudBlazor's), in the slot MudBlazor.min.css had.

   Element and universal selectors, as in MudBlazor, so every Platform.Components rule (all
   class-based) still wins whatever the load order. The only class rules set the theme root's
   inherited text size and font token, never a component's own styles. Colours use --pc-* tokens, which
   Platform.Components declares on the PlatformTheme element (.pc-theme), not on :root, so rules
   that can match outside the theme carry a fallback. */

:root {
	/* The app font. MudBlazor's theme put Rubik (needme-fonts.css) ahead of its default stack. */
	--bh-font-family: Rubik, Roboto, Helvetica, Arial, sans-serif;
	/* Stacking ladder. The app's own fixed layers were calibrated against MudBlazor's magnitudes
	   (drawer 1100, app bar 1300, dialog 1400, snackbar 1500), so the app keeps them and maps
	   Platform.Components' layers onto them (.pc-theme below) instead of re-basing every app layer
	   under PC's defaults (70-100). App layers in between: offline inspector = app bar; agent
	   chat/sessions drawer and its scrim 1310-1320 and the maximised files panel 1390 (above the
	   app bar and the site nav drawer, below menus and dialogs); sync error sheet and its scrim
	   1350-1351 (below dialogs, so its confirmations open on top). */
	--bh-z-drawer: 1100;
	--bh-z-appbar: 1300;
	--bh-z-drawer-modal: 1302;
	--bh-z-menu: 1395;
	--bh-z-tooltip: 1397;
	--bh-z-overlay: 1399;
	--bh-z-dialog: 1400;
	--bh-z-popover: 1450;
	--bh-z-snackbar: 1500;
	/* Above every app layer: offline inspector 1300, agent panels 1310-1390, offline FAB 9000.
	   MudBlazor.min.css gave the error bar 9999. */
	--bh-z-error-ui: 9999;
}

/* Box model reset. border-box sizing is what every width/height in the app's CSS assumes. The
   zero border width with a solid style is the baseline the border utilities rely on: .pc-border-2
   or .pc-border-dashed only change one of the two, so without the other they would draw nothing.
   MudBlazor's universal margin/padding reset is deliberately not carried over: bh-reboot.css
   already sets the spacing of the elements the pages use (p, h1-h6, ul, ...), and zeroing the
   rest would also strip the user-agent spacing Platform.Components was built against. */
*,
*::before,
*::after {
	box-sizing: border-box;
	border-width: 0;
	border-style: solid;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-tap-highlight-color: transparent; /* no grey flash on tap in the MAUI WebView */
}

/* Plain text outside a typography component was 14px Rubik (MudBlazor's body2 default). Without
   this it jumps to the browser's 16px. The second selector carries it through the PlatformTheme
   element, whose font-scale class resets font-size to 1rem; the scale factor still applies. */
body,
body .pc-theme {
	font-family: var(--bh-font-family);
	font-size: calc(0.875rem * var(--pc-font-scale, 1));
	font-weight: 400;
	line-height: 1.43;
	letter-spacing: 0.01071em;
}

/* MudBlazor's body rule also painted the page in the theme's background and text colours, which
   were dark in dark mode. Platform.Components scopes its tokens to the PlatformTheme element
   (.pc-theme), so body would otherwise keep bh-reboot.css's white background and #212529 text, and
   any viewport area the theme element does not cover (a short page, content outside the theme
   root) shows white in dark mode. Body takes its colours from the app's root theme instead:
   the portal layouts' PlatformTheme carries the bh-app-theme class (only that root, so a nested
   dark preview theme cannot repaint the page). Values are Platform.Components' default
   light/dark surface tokens; a tenant scheme still colours everything inside the theme element.
   Before the layout renders (the boot and loading shell) the light colours apply. */
html:has(.bh-app-theme) body {
	background-color: var(--md-sys-color-surface, #fffbfe);
	color: var(--md-sys-color-on-surface, #1d1b20);
}

html:has(.bh-app-theme.pc-theme--dark) body {
	color-scheme: dark;
	background-color: #141218;
	color: #e6e0e9;
}

@media (prefers-color-scheme: dark) {
	html:has(.bh-app-theme.pc-theme--system) body {
		color-scheme: dark;
		background-color: #141218;
		color: #e6e0e9;
	}
}

/* Platform.Components' typography (PlatformText, buttons, fields) uses its own font token; point
   it at the app font, as MudBlazor's Typography.Default did for its components. */
.pc-theme {
	--md-sys-typescale-font-family: var(--bh-font-family);
}

/* Platform.Components' stacking layers on the app's ladder (:root above). Same order as PC's
   defaults: docked drawer < app bar < modal drawer < menu < tooltip < overlay < dialog < popover
   < snackbar. Every theme element, so a nested PlatformTheme does not drop back to PC's values. */
.pc-theme {
	--pc-z-drawer: var(--bh-z-drawer);
	--pc-z-appbar: var(--bh-z-appbar);
	--pc-z-drawer-modal: var(--bh-z-drawer-modal);
	--pc-z-menu: var(--bh-z-menu);
	--pc-z-tooltip: var(--bh-z-tooltip);
	--pc-z-overlay: var(--bh-z-overlay);
	--pc-z-dialog: var(--bh-z-dialog);
	--pc-z-popover: var(--bh-z-popover);
	--pc-z-snackbar: var(--bh-z-snackbar);
}

/* Bold text was weight 700 (the browser's "bolder" picks a different Rubik face). */
strong,
b {
	font-weight: 700;
}

/* Links took the surrounding text colour, not the browser's / site.css's link blue, and had no
   underline; styled links (.pc-link) set their own colour. */
a {
	color: inherit;
	text-decoration: none;
}

/* The ~95 plain <button> elements in the app's own markup (icon toggles, chip removers, card
   headers) were drawn as bare clickable content by MudBlazor's button rule. Zero specificity, so
   any class rule in the app still wins (as it did over MudBlazor's element rule), and
   Platform.Components' own buttons are left out entirely: they are styled from the user-agent
   defaults. The test is any pc- class, so a plain button carrying a pc- utility (pc-ma-2) would be
   left out too: app markup gives a plain button a feature class instead (UtilityClassScanTests). */
:where(button:not([class*="pc-"])) {
	color: inherit;
	background-color: transparent;
	border: 0;
	border-radius: 0;
	margin: 0;
	padding: 0;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	vertical-align: middle;
	position: relative;
	user-select: none;
	text-decoration: none;
}

/* Embedded documents (Swagger, Power BI, file previews) fill their container with no frame. */
iframe {
	border: 0;
	width: 100%;
	height: 100%;
}

/* MudThemeProvider drew thin 8px scrollbars everywhere. Platform.Components themes scrollbars
   inside .pc-theme (and the document's, with more specific selectors); this keeps the same thin
   look for anything rendered outside it. */
@supports not selector(::-webkit-scrollbar) {
	:where(html, body *) {
		scrollbar-width: thin;
	}
}

@supports selector(::-webkit-scrollbar) {
	:where(body *)::-webkit-scrollbar {
		width: 8px;
		height: 8px;
	}

	:where(body *)::-webkit-scrollbar-track {
		background: transparent;
	}

	:where(body *)::-webkit-scrollbar-thumb {
		background: var(--pc-scrollbar-thumb, rgb(128 128 128 / 0.45));
		border-radius: 1px;
	}
}

/* Blazor's unhandled-error bar was MudBlazor's error colour, not site.css's light yellow. It sits
   outside the PlatformTheme element, hence the fallbacks (MudBlazor's default error colours).
   MudBlazor also raised it above every app layer (site.css's z-index 1000 would put it under the
   offline inspector, the offline FAB and the agent panels) and widened the right padding so the
   dismiss icon does not overlap the text. */
#blazor-error-ui {
	background-color: var(--pc-color-error, #f44336);
	color: var(--pc-color-on-error, #ffffff);
	padding: 0.6rem 1.75rem 0.7rem 1.25rem;
	z-index: var(--bh-z-error-ui);
}

#blazor-error-ui .dismiss {
	color: inherit;
}

#blazor-error-ui .reload {
	text-decoration: underline;
}
