/*
 * Badge de paiement mobile — source canonique.
 * Couvre PAYÉE / NON PAYÉE et leurs variantes responsives.
 * Les règles métier de visibilité restent hors de ce composant.
 */

@media (max-width:1050px){
.payment-badge{
  display:inline-flex;
  align-items:center;
  margin-left:6px;
  padding:2px 7px;
  border-radius:999px;
  font-size:10px;
  line-height:1.2;
  font-weight:800;
  letter-spacing:.03em;
  vertical-align:middle;
  border:0; box-shadow:none;
}
}
@media (max-width:1050px){
.payment-badge.paid{
  background:#dff1e2;
  color:#2f6f39;
}
}
@media (max-width:1050px){
.payment-badge.unpaid{
  background:#fde8c7;
  color:#7c5516;
}
}
@media (max-width:1050px){
.payment-badge{
  font-size:13px;
  padding:3px 9px;
  font-weight:850;
}
}
@media (max-width:1050px){
.payment-badge.unpaid{
  background:#f8d7d7;
  color:#a33434;
}
}
@media (max-width:700px){
.payment-badge{
    font-size:12px;
    padding:3px 8px;
  }
}
@media (max-width:480px){
.payment-badge{
    font-size:10px;
    padding:2px 6px;
    margin-left:4px;
  }
}