/* Top-up package highlights (precios-20261029). Kept separate from hardcore-theme.css on purpose. */
.donation-panel .account-donation-grid button { position: relative; }
.donation-panel .account-donation-grid button .donation-package-extra {
  display: block;
  margin-top: 4px;
  font-size: 0.78rem;
  font-weight: 600;
  color: #9fd8a8;
  letter-spacing: 0.02em;
}
.donation-panel .account-donation-grid button.donation-package-highlight {
  border-width: 2px;
  border-style: solid;
}
.donation-panel .account-donation-grid button.donation-package-popular {
  border-color: #d4a73a;
  background: linear-gradient(180deg, rgba(212, 167, 58, 0.16), rgba(212, 167, 58, 0.03) 60%);
  box-shadow: 0 0 0 1px rgba(212, 167, 58, 0.35), 0 8px 24px rgba(212, 167, 58, 0.18);
}
.donation-panel .account-donation-grid button.donation-package-best-value {
  border-color: #3fbf7f;
  background: linear-gradient(180deg, rgba(63, 191, 127, 0.16), rgba(63, 191, 127, 0.03) 60%);
  box-shadow: 0 0 0 1px rgba(63, 191, 127, 0.35), 0 8px 24px rgba(63, 191, 127, 0.18);
}
.donation-panel .account-donation-grid button .donation-package-label {
  position: absolute;
  top: 8px;
  left: 8px;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
  color: #1a1206;
  background: #d4a73a;
  z-index: 2;
}
.donation-panel .account-donation-grid button.donation-package-best-value .donation-package-label {
  color: #06170e;
  background: #3fbf7f;
}

@media (min-width: 901px) {
  .donation-panel .account-donation-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.donation-panel .account-donation-grid button.donation-package-highlight .donation-streamer-bonus {
  top: auto;
  bottom: 8px;
  left: 9px;
}