/* Final, scoped layout corrections. No game logic or payout rules live here. */

/* Caldeiroes: keep every revealed value inside its own pedestal. */
#bonus-modal[data-game-type="collect"][data-skin="halloween"] .premium-collect-stage .collect-value-box {
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 84% !important;
  max-width: 84% !important;
  box-sizing: border-box !important;
  padding: 0 .2em !important;
  font-size: clamp(12px, 1.18vw, 21px) !important;
  line-height: 1.05 !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#bonus-modal[data-game-type="collect"][data-skin="halloween"] #bonus-detail,
#bonus-modal[data-game-type="collect"][data-skin="halloween"] .bonus-detail {
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 31% !important;
  max-width: 31% !important;
  box-sizing: border-box !important;
  padding: 0 1.4% !important;
  font-size: clamp(14px, 1.35vw, 24px) !important;
  line-height: 1.05 !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Morangos and Colmeias: center the jackpot strip inside the artwork. */
#bonus-modal[data-game-type="pick"] .pick-game-meters {
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 38% !important;
  max-width: 38% !important;
  box-sizing: border-box !important;
  padding-inline: 3.2% !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
}

#bonus-modal[data-game-type="pick"] .pick-game-meters label {
  min-width: 0 !important;
  justify-content: center !important;
  gap: .45em !important;
  white-space: nowrap !important;
}

#bonus-modal[data-game-type="pick"] .pick-game-meters output {
  min-width: 0 !important;
  font-size: clamp(15px, 1.38vw, 26px) !important;
  white-space: nowrap !important;
}

#bonus-modal[data-game-type="pick"] .pick-game-meters [data-pick-status] {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  text-align: center !important;
  font-size: clamp(11px, .92vw, 17px) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Girafas Pantanal: use only the purpose-built positions in the clean artwork. */
#bonus-modal.girafas-pantanal-front {
  overflow: hidden !important;
}

#bonus-modal.girafas-pantanal-front .bonus-header,
#bonus-modal.girafas-pantanal-front #bonus-detail,
#bonus-modal.girafas-pantanal-front .bonus-detail,
#bonus-modal.girafas-pantanal-front #bonus-award,
#bonus-modal.girafas-pantanal-front .bonus-award,
#bonus-modal.girafas-pantanal-front .bonus-burst,
#bonus-modal.girafas-pantanal-front .cinematic-atmosphere {
  display: none !important;
}

#bonus-modal.girafas-pantanal-front .pantanal-frog-meters {
  position: absolute !important;
  z-index: 80 !important;
  left: 50% !important;
  top: 25.2% !important;
  transform: translate(-50%, -50%) !important;
  width: 48% !important;
  height: 7% !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: center !important;
  box-sizing: border-box !important;
  padding: .25% 2% !important;
  color: #fff4c1 !important;
  background: rgba(10, 25, 12, .72) !important;
  border: 1px solid rgba(255, 213, 91, .72) !important;
  border-radius: 8px !important;
  text-align: center !important;
  pointer-events: none !important;
}

#bonus-modal.girafas-pantanal-front .pantanal-frog-meters label {
  display: grid !important;
  gap: 0 !important;
  min-width: 0 !important;
}

#bonus-modal.girafas-pantanal-front .pantanal-frog-meters small {
  font-size: clamp(8px, .68vw, 12px) !important;
  font-weight: 900 !important;
  letter-spacing: .09em !important;
}

#bonus-modal.girafas-pantanal-front .pantanal-frog-meters strong {
  font-size: clamp(13px, 1.18vw, 22px) !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

#bonus-modal.girafas-pantanal-front .pantanal-prize-display {
  position: absolute !important;
  z-index: 85 !important;
  left: 50% !important;
  top: 37% !important;
  transform: translate(-50%, -50%) !important;
  width: 22% !important;
  height: 14% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  padding: 0 2% !important;
  color: #fff6c4 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  text-align: center !important;
  pointer-events: none !important;
}

#bonus-modal.girafas-pantanal-front .pantanal-prize-display small {
  display: block !important;
  font-size: clamp(10px, .82vw, 15px) !important;
  font-weight: 900 !important;
  letter-spacing: .12em !important;
}

#bonus-modal.girafas-pantanal-front .pantanal-prize-display strong {
  display: block !important;
  max-width: 100% !important;
  font-size: clamp(22px, 2.3vw, 42px) !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#bonus-modal.girafas-pantanal-front .frog-choice-hint {
  display: block !important;
  opacity: 1 !important;
  left: 50% !important;
  bottom: 1% !important;
  transform: translateX(-50%) !important;
  width: 66% !important;
  box-sizing: border-box !important;
  padding: .22em .4em !important;
  border: 1px solid rgba(255, 219, 90, .78) !important;
  border-radius: 999px !important;
  color: #fff4bf !important;
  background: rgba(7, 28, 10, .82) !important;
  font-size: clamp(8px, .72vw, 13px) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

#bonus-modal.girafas-pantanal-front .pantanal-live-credit,
#bonus-modal.girafas-pantanal-front .pantanal-trigger-prize {
  position: absolute !important;
  z-index: 80 !important;
  left: 22% !important;
  transform: translate(-50%, -50%) !important;
  width: 12.5% !important;
  height: 5.3% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  color: #fff2ba !important;
  font-size: clamp(13px, 1.35vw, 25px) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-align: center !important;
  white-space: nowrap !important;
  pointer-events: none !important;
}

#bonus-modal.girafas-pantanal-front .pantanal-live-credit { top: 80.4% !important; }
#bonus-modal.girafas-pantanal-front .pantanal-trigger-prize { top: 89.4% !important; }

#bonus-modal.girafas-pantanal-front .pantanal-total-win {
  position: absolute !important;
  z-index: 82 !important;
  left: 62% !important;
  top: 83.8% !important;
  transform: translate(-50%, -50%) !important;
  width: 29% !important;
  height: 5% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  color: #fff2ba !important;
  font-size: clamp(12px, 1.22vw, 22px) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  pointer-events: none !important;
}

@media (max-width: 900px) {
  #bonus-modal[data-game-type="pick"] .pick-game-meters { width: 43% !important; max-width: 43% !important; }
  #bonus-modal.girafas-pantanal-front .pantanal-frog-meters { width: 54% !important; }
  #bonus-modal.girafas-pantanal-front .pantanal-total-win { width: 32% !important; }
}

/* 2026-11-05: final isolation layer.  The legacy theme contains repeated
   high-specificity rules; these selectors intentionally outrank them while
   remaining limited to one game family at a time. */

/* Caldeiroes — value and total never leave the artwork. */
html body #bonus-modal#bonus-modal#bonus-modal[data-game-type="collect"][data-skin="halloween"]
  :is(.premium-collect-stage,.collect-secondary-stage) > button .collect-value-box,
html body #admin-bonus-preview#admin-bonus-preview#admin-bonus-preview[data-game-type="collect"][data-skin="halloween"]
  :is(.premium-collect-stage,.collect-secondary-stage) > button .collect-value-box {
  left: 5% !important;
  right: 5% !important;
  bottom: 22.5% !important;
  width: 90% !important;
  max-width: 90% !important;
  height: 13% !important;
  transform: none !important;
  display: grid !important;
  place-items: center !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 .22em !important;
  font-size: clamp(9px, .78vw, 15px) !important;
  line-height: 1 !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html body #bonus-modal#bonus-modal#bonus-modal[data-game-type="collect"][data-skin="halloween"] :is(#bonus-detail,.bonus-detail),
html body #admin-bonus-preview#admin-bonus-preview#admin-bonus-preview[data-game-type="collect"][data-skin="halloween"] footer > strong {
  left: 50% !important;
  width: 40% !important;
  max-width: 40% !important;
  transform: translateX(-50%) !important;
  box-sizing: border-box !important;
  padding: 0 1.2% !important;
  font-size: clamp(13px, 1.2vw, 22px) !important;
  line-height: 1.05 !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Morangos and Colmeias — one centred, contained meter strip. */
html body #bonus-modal#bonus-modal#bonus-modal[data-game-type="pick"] .pick-game-meters,
html body #admin-bonus-preview#admin-bonus-preview#admin-bonus-preview[data-game-type="pick"] footer.pick-game-meters {
  left: 50% !important;
  right: auto !important;
  width: 34% !important;
  max-width: 34% !important;
  transform: translateX(-50%) !important;
  box-sizing: border-box !important;
  padding-inline: 2.4% !important;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important;
  overflow: hidden !important;
}
html body #bonus-modal#bonus-modal#bonus-modal[data-game-type="pick"] .pick-game-meters :is(label,output,[data-pick-status]),
html body #admin-bonus-preview#admin-bonus-preview#admin-bonus-preview[data-game-type="pick"] footer.pick-game-meters :is(label,output,[data-pick-status]) {
  min-width: 0 !important;
  max-width: 100% !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
html body #bonus-modal#bonus-modal#bonus-modal[data-game-type="pick"] .pick-game-meters output,
html body #admin-bonus-preview#admin-bonus-preview#admin-bonus-preview[data-game-type="pick"] footer.pick-game-meters output {
  font-size: clamp(13px, 1.12vw, 21px) !important;
}
html body #bonus-modal#bonus-modal#bonus-modal[data-game-type="pick"] .pick-game-meters [data-pick-status],
html body #admin-bonus-preview#admin-bonus-preview#admin-bonus-preview[data-game-type="pick"] footer.pick-game-meters [data-pick-status] {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  font-size: clamp(9px, .72vw, 14px) !important;
}

/* Girafas Pantanal — clean logo, information in the intended panels. */
html body #admin-bonus-preview#admin-bonus-preview.girafas-pantanal-front #admin-bonus-preview-content > header,
html body #admin-bonus-preview#admin-bonus-preview.girafas-pantanal-front #admin-bonus-preview-content > header :is(h2,p,small) {
  display: none !important;
}
html body #admin-bonus-preview#admin-bonus-preview.girafas-pantanal-front .pantanal-frog-meters {
  position: absolute !important;
  z-index: 90 !important;
  left: 50% !important;
  top: 25.3% !important;
  transform: translate(-50%,-50%) !important;
  width: 48% !important;
  height: 7% !important;
  display: grid !important;
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  align-items: center !important;
  box-sizing: border-box !important;
  padding: .25% 2% !important;
  color: #fff3bd !important;
  background: rgba(8,25,11,.72) !important;
  border: 1px solid rgba(255,211,79,.72) !important;
  border-radius: 8px !important;
  text-align: center !important;
  overflow: hidden !important;
}
html body #admin-bonus-preview#admin-bonus-preview.girafas-pantanal-front .pantanal-frog-meters label {
  display: grid !important;
  min-width: 0 !important;
}
html body #admin-bonus-preview#admin-bonus-preview.girafas-pantanal-front .pantanal-frog-meters small { font: 900 clamp(7px,.64vw,12px)/1 Arial,sans-serif !important; }
html body #admin-bonus-preview#admin-bonus-preview.girafas-pantanal-front .pantanal-frog-meters strong { font: 900 clamp(12px,1.08vw,21px)/1 Arial,sans-serif !important; white-space: nowrap !important; }

html body #admin-bonus-preview#admin-bonus-preview.girafas-pantanal-front .pantanal-prize-display {
  position: absolute !important;
  z-index: 92 !important;
  left: 50% !important;
  top: 37% !important;
  transform: translate(-50%,-50%) !important;
  width: 22% !important;
  height: 14% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  padding: 0 2% !important;
  color: #fff5c1 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  text-align: center !important;
  overflow: hidden !important;
}
html body #admin-bonus-preview#admin-bonus-preview.girafas-pantanal-front .pantanal-prize-display small { font: 900 clamp(8px,.72vw,13px)/1 Arial,sans-serif !important; letter-spacing: .1em !important; }
html body #admin-bonus-preview#admin-bonus-preview.girafas-pantanal-front .pantanal-prize-display strong { max-width: 100% !important; font: 900 clamp(19px,2vw,38px)/1 Arial,sans-serif !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }

html body #admin-bonus-preview#admin-bonus-preview.girafas-pantanal-front .frog-choice-hint {
  display: grid !important;
  place-items: center !important;
  opacity: 1 !important;
  left: 17% !important;
  right: 17% !important;
  bottom: 1% !important;
  width: 66% !important;
  max-width: 66% !important;
  transform: none !important;
  box-sizing: border-box !important;
  padding: .2em .35em !important;
  border: 1px solid rgba(255,218,85,.78) !important;
  border-radius: 999px !important;
  color: #fff3b8 !important;
  background: rgba(7,27,10,.84) !important;
  font: 900 clamp(7px,.62vw,12px)/1 Arial,sans-serif !important;
  text-align: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
}
html body #admin-bonus-preview#admin-bonus-preview.girafas-pantanal-front :is(.pantanal-live-credit,.pantanal-trigger-prize) {
  position: absolute !important;
  z-index: 91 !important;
  left: 22% !important;
  transform: translate(-50%,-50%) !important;
  width: 12.5% !important;
  height: 5.2% !important;
  display: grid !important;
  place-items: center !important;
  color: #fff1b4 !important;
  font: 900 clamp(11px,1.15vw,22px)/1 Arial,sans-serif !important;
  white-space: nowrap !important;
  overflow: hidden !important;
}
html body #admin-bonus-preview#admin-bonus-preview.girafas-pantanal-front .pantanal-live-credit { top: 80.4% !important; }
html body #admin-bonus-preview#admin-bonus-preview.girafas-pantanal-front .pantanal-trigger-prize { top: 89.4% !important; }
html body #admin-bonus-preview#admin-bonus-preview.girafas-pantanal-front .pantanal-total-win {
  position: absolute !important;
  z-index: 91 !important;
  left: 62% !important;
  top: 83.8% !important;
  transform: translate(-50%,-50%) !important;
  width: 29% !important;
  height: 5% !important;
  display: grid !important;
  place-items: center !important;
  color: #fff1b4 !important;
  font: 900 clamp(10px,1.04vw,20px)/1 Arial,sans-serif !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* In Girafas the legacy footer duplicates the custom credit/bonus/total panels. */
html body #admin-bonus-preview#admin-bonus-preview.girafas-pantanal-front #admin-bonus-preview-content > footer { display: none !important; }

@media (max-width: 900px) {
  html body #bonus-modal#bonus-modal#bonus-modal[data-game-type="pick"] .pick-game-meters,
  html body #admin-bonus-preview#admin-bonus-preview#admin-bonus-preview[data-game-type="pick"] footer.pick-game-meters { width: 39% !important; max-width: 39% !important; }
}