/*
 * RD Group brand override for Metabase (open-source build).
 * Injected by the brand-proxy sidecar as <link rel="stylesheet" href="/rd-brand/brand.css">.
 * Source of truth for the values: ~/brand (tokens/rd-brand.tokens.json).
 *
 * Why !important everywhere: Metabase writes its theme as a runtime <style> block on :root
 * (emotion). A same-origin stylesheet with !important custom properties wins over it.
 * Only brand colour and font are overridden; text/background tokens are left alone so the
 * built-in dark theme keeps working.
 *
 * Verified against metabase/metabase:v0.63.5.2. Re-check the selectors after every upgrade:
 *   --mb-color-core-brand, --mb-default-font-family, svg[data-testid="main-logo"]
 */

@font-face { font-family: 'Neue Haas Display'; src: url(/rd-brand/NeueHaasDisplay-400.woff2) format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Neue Haas Display'; src: url(/rd-brand/NeueHaasDisplay-500.woff2) format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'Neue Haas Display'; src: url(/rd-brand/NeueHaasDisplay-700.woff2) format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }

:root {
	/* p06 — one family */
	--mb-default-font-family: 'Neue Haas Display', Lato, Arial, sans-serif !important;

	/* p07 — RD Blue as the interaction colour (buttons, links, focus, selected) */
	--mb-color-core-brand: #2778c1 !important;
	--mb-color-brand: #2778c1 !important;
	--mb-color-text-brand: #2778c1 !important;
	--mb-color-border-brand: #2778c1 !important;
	--mb-color-input-focus: #2778c1 !important;
	--mb-color-core-brand-hover: #1b4f7f !important;   /* derived shade, not in the book */
	--mb-color-text-brand-hover: #1b4f7f !important;   /* derived shade, not in the book */

	/* p07 — query-builder accents kept monochrome: summarize black, filter mid-grey */
	--mb-color-core-summarize: #0a0a0a !important;
	--mb-color-core-filter: #888888 !important;
}

/* Logo: Metabase renders an inline <svg data-testid="main-logo"> (login page 65px, nav ~32px).
 * Paint the RD Group horizontal lockup as the svg's background and hide its paths.
 * Aspect ratio is the lockup's viewBox (1025.5 × 395.9). */
svg[data-testid="main-logo"] {
	background: url(/rd-brand/logo-black.svg) left center / contain no-repeat !important;
	aspect-ratio: 1025.5 / 395.9;
	width: auto !important;
	color: transparent !important;
}
svg[data-testid="main-logo"] > * { display: none !important; }

/* Dark theme: white lockup (p05: white on dark, never grey). Selector verified for v0.63. */
[data-metabase-theme="night"] svg[data-testid="main-logo"],
[data-mantine-color-scheme="dark"] svg[data-testid="main-logo"] {
	background-image: url(/rd-brand/logo-white.svg) !important;
}
