@import url("./analysis-band-base.css");

/* BTi startup loader: critical first-paint styling. */
@property --bti-loader-angle {
  syntax: '<angle>';
  inherits: false;
  initial-value: 0deg;
}

.bti-loading-overlay {
  background: #001122 !important;
}

.bti-loading-panel {
  width: min(92vw, 430px) !important;
  gap: 22px !important;
  padding: 0 !important;
}

.bti-loading-brand {
  position: relative !important;
  width: clamp(190px, 28vw, 270px) !important;
  aspect-ratio: 1 / 1 !important;
  display: grid !important;
  place-items: center !important;
  isolation: isolate !important;
}

.bti-loading-brand::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  border-radius: 18% !important;
  background: conic-gradient(
    from var(--bti-loader-angle),
    rgba(36, 73, 105, 0.48) 0deg,
    rgba(36, 73, 105, 0.48) 258deg,
    rgba(255, 165, 0, 0.70) 286deg,
    #ffffff 312deg,
    #ffa500 334deg,
    rgba(36, 73, 105, 0.48) 360deg
  ) !important;
  box-shadow: 0 0 30px rgba(255, 165, 0, 0.08) !important;
  animation: bti-loader-frame-progress 1.8s linear infinite !important;
}

.bti-loading-brand::after {
  content: '' !important;
  position: absolute !important;
  inset: 4px !important;
  z-index: 1 !important;
  border-radius: calc(18% - 2px) !important;
  background: #001122 !important;
}

.bti-loading-brand-mark {
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  width: 72% !important;
  aspect-ratio: 624 / 303 !important;
  height: auto !important;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  background-image: url("./assets/bti-loader-wordmark.png?v=2") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
  image-rendering: auto !important;
}

.bti-loading-brand-rule,
.bti-loading-spinner {
  display: none !important;
}

.bti-loading-title {
  margin: 0 !important;
}

@keyframes bti-loader-frame-progress {
  to { --bti-loader-angle: 360deg; }
}

@media (prefers-reduced-motion: reduce) {
  .bti-loading-brand::before {
    animation-duration: 3.2s !important;
  }
}

/* ETF dashboard: influencing factors are intentionally available only for equities. */
#grid-content.equity-dashboard-layout[data-equity-dashboard-asset="etf"] .tab-btn[data-tab="sensitivity"] {
  display: none !important;
}