/* amplish branding for Metabase static embeds — auto-injected on every
   container start by /custom-entrypoint.sh. Edit this file (mounted at
   /config/amplish-theme.css) to adjust colors; no rebuild needed, just
   restart/redeploy the Metabase service.

   IMPORTANT: every custom property below carries !important. Metabase's
   own frontend JS (Mantine/Emotion) injects a large runtime <style> tag
   into <head> AFTER this stylesheet loads, and that runtime stylesheet
   also redefines nearly all of these same --mb-color-* variables at
   :root scope. Because it loads later, it would otherwise win the
   cascade (equal specificity, later source order beats ours) even
   though our tag is present and correctly formed — confirmed by
   inspecting document.styleSheets live: sheet index 3 (a
   data-emotion="emotion-global" <style> tag) redefines --mb-color-core-brand,
   --mb-color-text-primary, --mb-color-border, and almost every other
   variable except --mb-color-background/--mb-color-bg-dashboard-card
   (which is why the dark background alone appeared to work while the
   gold/cream branding did not). Neither Metabase's static CSS nor its
   runtime Emotion stylesheet uses !important on these properties, so
   !important here is sufficient to always win regardless of injection
   order, without needing JS re-application tricks. Keep every line in
   this block !important — dropping it on any one property reintroduces
   the same silent-override bug for that property only. */
:root {
  /* Hintergruende */
  --mb-color-background: #0F1113 !important;
  --mb-color-bg-dashboard: #0F1113 !important;
  --mb-color-bg-dashboard-card: #1E211F !important;

  /* Rahmen */
  --mb-color-border: #2D3238 !important;
  --mb-color-border-brand: #E8B873 !important;
  --mb-color-border-neutral: #2D3238 !important;
  --mb-color-border-neutral-subtle: #33352F !important;

  /* Marke / Akzent (amplish gold) */
  --mb-color-core-brand: #E8B873 !important;
  --mb-color-core-brand-hover: #C99A62 !important;
  --mb-color-core-metabase: #E8B873 !important;
  --mb-color-text-brand: #E8B873 !important;
  --mb-color-text-brand-hover: #C99A62 !important;
  --mb-color-text-brand-strong: #E8B873 !important;
  --mb-color-text-brand-strong-hover: #C99A62 !important;
  --mb-color-input-focus: #E8B873 !important;
  --mb-color-logo-primary: #E8B873 !important;
  --mb-color-logo-secondary: #C99A62 !important;
  --mb-color-logo-text: #F4ECDF !important;

  /* Filter / Summarize (semantische Metabase-Farben) */
  --mb-color-core-filter: #C99A62 !important;
  --mb-color-core-summarize: #7FB69A !important;
  --mb-color-feedback-positive: #7FB69A !important;

  /* Text */
  --mb-color-text-primary: #F4ECDF !important;
  --mb-color-text-primary-inverse: #0F1113 !important;
  --mb-color-text-secondary: #ABA08E !important;
  --mb-color-text-disabled: #5C5547 !important;
  --mb-color-text-disabled-inverse: #837A6C !important;
  --mb-color-text-selected: #0F1113 !important;

  /* Tooltips */
  --mb-color-tooltip-background: #1E211F !important;
  --mb-color-tooltip-background-focused: #16181A !important;
  --mb-color-tooltip-text: #F4ECDF !important;
  --mb-color-tooltip-text-secondary: #ABA08E !important;

  /* Sonstiges */
  --mb-color-modal-overlay: rgba(15, 17, 19, 0.6) !important;
  --mb-color-shadow-default: rgba(0, 0, 0, 0.4) !important;
  --mb-color-switch-off: #5C5547 !important;
  --mb-color-icon-disabled: #5C5547 !important;
  --mb-color-illustration-secondary-brand: #C99A62 !important;
  --mb-color-illustration-tertiary-brand: #F3DEC8 !important;
}

body, html {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* Diagramm-Farben (Chart-Serien) — eigener Mechanismus, NICHT ueber die
   --mb-color-* Variablen oben steuerbar. Metabase setzt Serienfarben (z. B.
   fuer Funnel-, Balken- und Liniendiagramme) als Praesentations-Attribut
   direkt am SVG-Element (<polygon fill="#509EE2">, Metabases Standard-Blau
   "accent0"), nicht als CSS custom property und nicht ueber ein style-
   Attribut. Live per Browser-Konsole bestaetigt: eine CSS-Regel auf das
   Element gewinnt gegen dieses Attribut immer (Praesentations-Attribute
   haben laut SVG-Spezifikation die niedrigste Prioritaet im Cascade, unter
   jeder CSS-Regel egal welcher Spezifitaet) — kein !important noetig, aber
   schadet nicht und macht die Absicht klar.

   Fuer den Funnel (Karte 41, "Vertriebs-Pipeline") reicht eine flache
   Akzentfarbe: Metabase gibt jeder Stufe ohnehin eine abnehmende opacity
   (1.0 -> 0.85 -> 0.7 -> 0.55 -> 0.4 ...), wodurch aus der einen Farbe
   automatisch ein Verlauf entsteht — live geprueft, sieht gut aus, keine
   weitere Verlaufslogik noetig.

   [data-testid="funnel-chart"] ist Metabases eigenes Test-Attribut am
   Wrapper-Div (stabiler als generierte Emotion-Klassennamen wie "VAtvi"). */
[data-testid="funnel-chart"] svg polygon {
  fill: #E8B873 !important;
}
