/* Global UI overrides for Superset (TICE BI) — loaded on every page.
   Keep this file safe to apply broadly (no dashboard-scoped selectors). */

:root {
  --tice-spinner-size: 42px;
  --tice-spinner-gap: 10px;
}

/* ---------- Global spinner/logo replacement ----------
   Superset uses different loader implementations depending on view:
   - Dashboard chart holder: `.loading` with an inline SVG (infinity)
   - Ant Design `Spin`: `.ant-spin` / `.ant-spin-dot`
   - Misc: `[data-test="loading"]`

   We hide the native spinner visuals and render the TICE BI logo instead.
*/

/* Hide the inline SVG infinity icon wherever it appears inside known loaders. */
.loading svg,
[data-test="loading"] svg,
.chart-container .loading svg,
.dashboard-component-chart-holder .loading svg,
.dashboard-component-chart-holder .loading .loading-spinner {
  display: none !important;
}

/* Superset’s common Loading component is an <img class="loading ..."> that
   points to the default Superset spinner asset. Replace that image globally. */
img.loading {
  content: url("/static/assets/branding/tice_logo.svg") !important;
  object-fit: contain !important;
}

/* Hide AntD dot spinner (if used anywhere). */
.ant-spin .ant-spin-dot,
.ant-spin .ant-spin-dot-item {
  display: none !important;
}

/* Render a consistent logo spinner on loader containers. */
.loading::before,
[data-test="loading"]::before,
.ant-spin::before {
  content: "";
  display: block;
  width: var(--tice-spinner-size);
  height: var(--tice-spinner-size);
  margin: 0 auto var(--tice-spinner-gap);
  background: url("/static/assets/branding/tice_logo.svg") no-repeat center/contain;
  opacity: 0.95;
}

/* Keep loader text readable on dark theme. */
.loading,
[data-test="loading"],
.ant-spin {
  color: #e8eefc !important;
}

/* Some loaders wrap content with a generic `.loading` that is flex/inline.
   Ensure our pseudo-element does not break layout. */
.loading,
[data-test="loading"] {
  min-height: calc(var(--tice-spinner-size) + var(--tice-spinner-gap) + 1em);
}

/* Ensure the “Waiting on database…” text doesn’t look faded. */
.loading * {
  color: inherit !important;
}

/* ---------- KPI cards (Big Number) ----------
   In embedded iframes the default font can overflow the card and hide the €
   prefix/suffix. Keep numbers readable and always show currency. */
.chart-container .big_number {
  font-size: clamp(44px, 5.2vw, 78px) !important;
  line-height: 1.05 !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

.chart-container .big_number_prefix,
.chart-container .big_number_suffix,
.chart-container .big_number_currency,
.chart-container .big_number_unit {
  font-size: 0.55em !important;
  line-height: 1 !important;
  color: #ffffff !important;
  opacity: 0.95 !important;
  vertical-align: baseline !important;
  margin-left: 10px !important;
  margin-right: 10px !important;
}