/* ──────────────────────────────────────────────────────────────────────────
   Barra de captação de 2 tons (reservas vs captação) — variante fundo claro
   ----------------------------------------------------------------------------
   Mesma estrutura da barra do hero do cliente (dois <progress> sobrepostos,
   sem style inline — conforme política CSP), porém com cores que leem sobre os
   cards brancos do PARCEIRO e do ADMIN. O cliente mantém a sua própria versão
   branca em customer/offer-details.css (vive sobre o hero escuro) e NÃO importa
   este arquivo.

   Tons (whitelabel, via var(--color-primary)/--primary-rgb por tenant/área):
   - captação (acquired): cor primária sólida;
   - reservas (reserved): cor primária translúcida (~0.40);
   - trilho (track): cinza neutro claro.
   ────────────────────────────────────────────────────────────────────────── */

.offer-fundraising-header {
  font-size: 0.88rem;
  opacity: 0.85;
}

.fundraising-bar-track {
  position: relative;
  display: flex;
  height: 10px;
  overflow: visible;
  background: rgba(0, 0, 0, 0.06);
  border-radius: 6px;
}

.fundraising-bar-track .min-goal-marker {
  position: absolute;
  top: -4px;
  bottom: -4px;
  left: 66%;
  z-index: 3;
  width: 2px;
  background: rgba(0, 0, 0, 0.35);
}

.fundraising-bar-track .min-goal-label {
  position: absolute;
  top: -20px;
  left: 66%;
  font-size: 0.62rem;
  opacity: 0.7;
  transform: translateX(-50%);
  white-space: nowrap;
}

.offer-fundraising-values {
  font-size: 0.85rem;
  opacity: 0.9;
}

.offer-fundraising-legend {
  font-size: 0.78rem;
  opacity: 0.8;
}

.offer-fundraising-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 4px;
  border-radius: 2px;
}

/* VERDE FIXO (independe do tenant): Cotas adquiridas = verde escuro; Reservas
   ativas = verde claro (nunca o cinza do primary, que ficava invisível). */
.offer-fundraising-dot--acquired {
  background: var(--color-success-strong);
}

.offer-fundraising-dot--reserved {
  background: var(--color-success-soft);
}

/* ── Barra de captação de 2 tons (adquirido + reservado) ──
   Dois <progress> sobrepostos (sem style inline): o de fundo cobre 0→totalPct
   no tom de reservas; o da frente cobre 0→acquiredPct no tom de captação. A
   faixa acquiredPct→totalPct fica no tom de reservas. Cores iguais aos dots. */
.fundraising-bar {
  position: relative;
  width: 100%;
  height: 16px;
  overflow: hidden;
  border-radius: 8px;
  background: var(--color-surface-500);
}

.fundraising-bar__layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 6px;
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
}

.fundraising-bar__layer::-webkit-progress-bar {
  background: transparent;
}

/* fundo: reservas (value = totalPct) — mesmo tom do dot --reserved */
.fundraising-bar__layer--reserved {
  z-index: 1;
}
.fundraising-bar__layer--reserved::-webkit-progress-value {
  background: var(--color-success-soft);
}
.fundraising-bar__layer--reserved::-moz-progress-bar {
  background: var(--color-success-soft);
}

/* frente: captação (value = acquiredPct) — mesmo tom do dot --acquired */
.fundraising-bar__layer--acquired {
  z-index: 2;
}
.fundraising-bar__layer--acquired::-webkit-progress-value {
  background: var(--color-success-strong);
}
.fundraising-bar__layer--acquired::-moz-progress-bar {
  background: var(--color-success-strong);
}