:root {
  --alerta-desconto-bg: #ffe066;
  --alerta-desconto-text: #d35400;
  --alerta-desconto-icone: #f39c12;
}
.alerta-desconto-animado {
  display: inline-flex;
  align-items: center;
  background: var(--alerta-desconto-bg);
  color: var(--alerta-desconto-text);
  border-radius: 6px;
  padding: 4px 10px;
  font-weight: bold;
  font-size: 0.98em;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  margin: 6px 0;
  animation: alerta-pulse 1.2s infinite alternate;
  gap: 7px;
  white-space: nowrap;
}
.alerta-desconto-icone {
  font-size: 1.5em;
  color: var(--alerta-desconto-icone);
  animation: alerta-bounce 0.8s infinite alternate;
}
.alerta-desconto-porcentagem {
  font-size: 1.1em;
  font-weight: 900;
}
.alerta-desconto-texto {
  white-space: nowrap;
}
@keyframes alerta-pulse {
  0% { box-shadow: 0 2px 8px rgba(0,0,0,0.07); }
  100% { box-shadow: 0 4px 16px rgba(255,224,102,0.25); }
}
@keyframes alerta-bounce {
  0% { transform: translateY(0); }
  100% { transform: translateY(-5px); }
}
@media (max-width: 600px) {
  .alerta-desconto-animado {
    font-size: 0.90em;
    padding: 3px 6px;
    gap: 5px;
    max-width: 100%;
    width: auto;
  }
  .alerta-desconto-icone {
    font-size: 1.1em;
  }
  .alerta-desconto-texto {
    font-size: 1em;
  }
}