.economize-container {
  display: flex;
  align-items: center;
}


tr.order-total.parcelas-flex-pix-total td > strong > .woocommerce-Price-amount.amount {
    font-size: 0.9em !important;
    color: #00a650 !important;
}
tr.order-total.parcelas-flex-pix-total strong .woocommerce-Price-amount.amount {
    color: #00a650 !important;
}

.economize-container img {
  width: 24px; /* Ajuste o tamanho conforme necessário */
  height: 24px; /* Ajuste o tamanho conforme necessário */
  margin-right: 8px; /* Espaçamento entre a imagem e o texto */
}

.economize-container .economize-text {
  font-weight: bold;
}

.economize-container .economize-amount {
  margin-left: 8px; /* Espaçamento entre o texto e o valor economizado */
}


/* Estilos gerais, aplicáveis a todos os dispositivos */
.pix {
  background-color: #e5f9ef;
  padding: 15px;
  border-radius: 8px;
  margin: 10px 0;
}

/* Estilização para a cor do texto do método de pagamento PIX */
.pix .preco, .pix .parcelas, .pix .textodesconto {
  color: #77c869;
  /* Cor verde para o texto da opção PIX */
}

/* Estilização para imagens dos ícones de pagamento */
.icone-pagamento {
  width: 50px;
  height: auto;
  display: block;
  margin-bottom: 10px;
}


/* Estilização para a opção de pagamento em geral */
.opcao-pagamento {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  cursor: default;

}

.opcao-pagamento .parcelas,
.opcao-pagamento .preco,
.opcao-pagamento .textodesconto {
  display: block;
  line-height: 1.5;
}

.opcao-pagamento .preco {
  font-weight: 700;
  font-size: 1.2em;
  color: #333;
}

 .precos {
  font-weight: 700;
  font-size: 1.2em;
  color: #333;
}



/* Estilização para a opção de pagamento em Loops e Categoria */

.melhor-parcelas_loop-container {
  font-size: 12px;
}
..desconto-boleto-loop-container {
  font-size: 12px;
}
.opcao-pagamento2.pix {
  display: flex;
  align-items: center;
  gap: 2px;
  margin-bottom: 10px;
  cursor: default;

}

.opcao-pagamento2 .parcelas,
.opcao-pagamento2 .preco,
.opcao-pagamento2 .textodesconto {
  display: block;
  line-height: 1;
  font-size: 14px; 

}

.opcao-pagamento2 .preco {
  font-weight: 700;
  font-size: 1em;
  color: #333;
}
/* Estilização adicional para destacar o pagamento PIX, mantendo o destaque no preço */
.pix .preco {
  /* Aqui mantemos a cor verde específica para o preço no PIX, se quiser que se destaque ainda mais */
  color: #77c869;
}

/* Se quiser que o preço para métodos que não sejam PIX permaneça com a cor padrão (e.g., preto ou cinza escuro),
             você pode omitir a regra de cor da classe .opcao-pagamento .preco acima
             e apenas definir a cor padrão aqui: */
.opcao-pagamento:not(.pix) .preco {
  color: #333;
  /* ou qualquer cor padrão que você usa para o texto */
}


.hWoKbG {
  background: rgb(64, 205, 40);
  color: white;
  font-size: 12px;
  line-height: 18px;
  font-weight: 900;
  border-radius: 5px;
  padding: 0px 5px;
  margin-left: 6px;
}

.desconto-container {
  display: flex;
  align-items: center;
}

.badge-container {
  display: flex;
  align-items: center;
}

.formasdepagamentos {
  padding: 10px 10px 10px 10px;
}

.product-label--on-sale {
  background: blue;
  color: #77c869;
}
.product-label {
  display: inline-flex;
  padding: 4px 10px;
  color: #fff;
  border-radius: 3px;
  font-weight: var(--text-font-bolder-weight);
  font-size: calc(var(--base-text-font-size) - (var(--default-text-font-size) - 13px));
  line-height: 1;
  vertical-align: top;
  width: 100%;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}

.economize-label {
  background-color: #000; /* Fundo preto */
  color: #fff; /* Letra branca */
  font-weight: 600; /* Peso da fonte 600 */
  padding: 10px 20px; /* Espaçamento interno */
  border-radius: 5px; /* Bordas arredondadas */
  display: inline-block; /* Faz com que a label se ajuste ao conteúdo */
  font-size: 1em; /* Tamanho da fonte */
  /* Adicione outras propriedades de fonte conforme necessário */
}


/* Media query para dispositivos com largura máxima de 768px (tablets e smartphones) */
@media (max-width: 768px) {
  .icone-pagamento {
    width: 30px; /* Reduz o tamanho do ícone */
  }

  .opcao-pagamento {
    flex-direction: row; /* Empilha os itens verticalmente */
    align-items: flex-start; /* Alinha itens à esquerda */
  }

  .opcao-pagamento .parcelas,
  .opcao-pagamento .preco,
  .opcao-pagamento .textodesconto {
    display: inline; /* Exibe itens na mesma linha */
    line-height: normal; /* Espaçamento de linha normal */
  }

  .opcao-pagamento .preco {
    font-size: 1em; /* Reduz o tamanho da fonte */
  }

  .hWoKbG {
    font-size: 10px; /* Reduz o tamanho da fonte da badge */
    line-height: 16px; /* Ajusta o espaçamento da linha */
  }
}

/* Media query para dispositivos com largura máxima de 480px (smartphones) */
@media (max-width: 480px) {
  .pix {
    padding: 10px; /* Reduz o espaçamento interno */
  }

  .opcao-pagamento {
    gap: 5px; /* Reduz o espaço entre ícone e texto */
  }

  .opcao-pagamento .preco {
    font-size: 0.9em; /* Reduz ainda mais o tamanho da fonte */
  }
}

/* Estilos para o desconto do Pix nos loops */
.desconto-pix-loop-simples {
    color: #00a650;
    margin-top: 4px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.desconto-pix-loop-simples .preco-pix {
    font-weight: 600;
    color: #00a650 !important;

}

.preco-pix .woocommerce-Price-amount {
  color: #00a650; /* verde, por exemplo */
  font-weight: bold; /* opcional */
}

.desconto-pix-loop-simples .texto-pix {
    font-size: 0.95rem;
}

.badge-pix {
    background: #d1fae5;
    color: #00a650;
    font-size: 12px;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 4px;
}

/* Media query para dispositivos móveis */
@media (max-width: 768px) {
    .desconto-pix-loop-simples {
        font-size: 0.9rem;
    }
    
    .badge-pix {
        font-size: 11px;
        padding: 1px 4px;
    }
}

