/* ================================
   PIX-PAYMENT.CSS - v5.0.0
   Spiritualize Pix Payment Widget
   ✅ MIGRAÇÃO: Atualizado para EasyQRCodeJS
   ================================ */

/* ========== CONTAINER ========== */
.spz-pix-payment {
  display: block;
  width: 100%;
  transition: opacity 0.5s ease;
}

.spz-pix-payment.is-fading-out {
  opacity: 0;
}

/* ========== QR CODE ========== */
.spz-qr-wrapper {
  display: block;
  width: 100%;
}

.spz-qr-code {
  display: inline-block;
  width: 250px;
  height: 250px;
  line-height: 0;
}

/* ✅ EasyQRCodeJS gera canvas E img - forçar display correto */
.spz-qr-code canvas {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
}

/* EasyQRCodeJS também pode gerar IMG - garantir que ela respeite o tamanho */
.spz-qr-code img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
}

/* ========== CARD ========== */
.spz-pix-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.spz-pix-code {
  width: 100%;
  word-break: break-all;
  overflow-wrap: break-word;
  text-align: left;
  font-family: monospace;
  font-size: 14px;
  line-height: 1.6;
}

/* ========== BOTÃO ========== */
.spz-copy-btn {
  cursor: pointer;
  border: none;
  background: #000;
  color: #fff;
  transition: all 0.3s ease;
  width: 100%;
  text-align: center;
}

.spz-copy-btn:hover {
  opacity: 0.8;
}

.spz-copy-btn:active {
  transform: scale(0.98);
}

.spz-copy-btn.copied {
  background: #22c55e;
}

/* ========== EDITOR PREVIEW ========== */
.elementor-editor-active .spz-pix-payment {
  min-height: 200px;
}

/* ========== ORDER REVIEW ========== */
.spz-order-review {
  display: block;
  width: 100%;
  transition: opacity 0.5s ease;
}

.spz-order-review.is-fading-in {
  animation: fadeIn 0.5s ease;
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.spz-order-header,
.spz-order-row,
.spz-order-discount-row,
.spz-order-total-row {
  display: grid;
  grid-template-columns: 60% 40%;
  align-items: center;
  position: relative;
}

.spz-col-1,
.spz-order-col-item,
.spz-order-discount-label,
.spz-order-total-label {
  text-align: left;
}

.spz-col-2,
.spz-order-col-val,
.spz-order-discount-val,
.spz-order-total-val {
  text-align: left;
}

.spz-order-row {
  border-bottom: 1px solid transparent;
}

.spz-order-footer {
  display: block;
  width: 100%;
}

/* Divisor vertical */
.spz-order-table.has-vertical-divider .spz-order-header::after,
.spz-order-table.has-vertical-divider .spz-order-row::after,
.spz-order-table.has-vertical-divider .spz-order-discount-row::after,
.spz-order-table.has-vertical-divider .spz-order-total-row::after {
  content: '';
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background-color: #e0e0e0;
  width: 1px;
  height: 70%;
  left: 60%;
}

/* Divisor horizontal */
.spz-order-divider {
  width: 100%;
  height: 1px;
  background-color: #e0e0e0;
}