/* =========================================================
   MOTOR DE PAGOS - FRONTEND (ANTI-THEME OVERRIDES)
   Solo afecta metodos mdp_*
========================================================= */

/* ---------- Separación entre métodos (más aire) ---------- */
.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method{
  margin: 0 0 18px 0 !important;
}
.woocommerce-checkout #payment ul.payment_methods li[class*="payment_method_mdp_"]{
  margin: 0 0 26px 0 !important;
}

/* ====== ICONO / LOGO EN LISTA ====== */
.woocommerce-checkout #payment ul.payment_methods li[class*="payment_method_mdp_"] .mdp-pay-icon-wrap,
#add_payment_method #payment ul.payment_methods li[class*="payment_method_mdp_"] .mdp-pay-icon-wrap{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  width:auto !important;
  max-width:110px !important;
  margin-left:10px !important;
  vertical-align:middle !important;
  filter:none !important;
  box-shadow:none !important;
  background:transparent !important;
}

.woocommerce-checkout #payment ul.payment_methods li[class*="payment_method_mdp_"] img.mdp-pay-icon,
#add_payment_method #payment ul.payment_methods li[class*="payment_method_mdp_"] img.mdp-pay-icon{
  width:92px !important;
  height:auto !important;
  max-width:92px !important;
  min-width:92px !important;
  max-height:40px !important;
  display:inline-block !important;
  object-fit:contain !important;
  background:transparent !important;
  padding:0 !important;
  border:0 !important;
  box-shadow:none !important;
  filter:none !important;
}

.woocommerce-checkout #payment ul.payment_methods li[class*="payment_method_mdp_"] > label img,
#add_payment_method #payment ul.payment_methods li[class*="payment_method_mdp_"] > label img{
  width:92px !important;
  max-width:92px !important;
  height:auto !important;
  max-height:40px !important;
  object-fit:contain !important;
  filter:none !important;
}

/* Ocultar texto del título en checkout SOLO para mdp (evita redundancia) */
.woocommerce-checkout #payment ul.payment_methods li[class*="payment_method_mdp_"] > label,
#add_payment_method #payment ul.payment_methods li[class*="payment_method_mdp_"] > label{
  font-size:0 !important;
  line-height:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
}
.woocommerce-checkout #payment ul.payment_methods li[class*="payment_method_mdp_"] > label input,
#add_payment_method #payment ul.payment_methods li[class*="payment_method_mdp_"] > label input{
  font-size:16px !important;
  line-height:normal !important;
}

/* ====== QUITAR FONDO / BORDE GRIS SOLO EN MDP ====== */
.woocommerce-checkout #payment ul.payment_methods li[class*="payment_method_mdp_"],
#add_payment_method #payment ul.payment_methods li[class*="payment_method_mdp_"]{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
}

.woocommerce-checkout #payment ul.payment_methods li[class*="payment_method_mdp_"] div.payment_box,
#add_payment_method #payment ul.payment_methods li[class*="payment_method_mdp_"] div.payment_box{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  margin:10px 0 0 0 !important;
}

.woocommerce-checkout #payment ul.payment_methods li[class*="payment_method_mdp_"] div.payment_box::before,
#add_payment_method #payment ul.payment_methods li[class*="payment_method_mdp_"] div.payment_box::before{
  display:none !important;
}

/* =========================================================
   TARJETA
========================================================= */

.mdp-card{
  background:
    radial-gradient(1200px 500px at 10% 10%, rgba(255,255,255,.06), transparent 60%),
    radial-gradient(1000px 400px at 90% 0%, rgba(0,230,118,.12), transparent 55%),
    var(--mdp-bg);
  border-radius:20px;
  padding:18px;
  margin:14px 0;
  color: var(--mdp-text, #ffffff);
  box-shadow: 0 14px 40px rgba(0,0,0,.25);
}

/* Checkout sin sombra */
.mdp-card.mdp-checkout{
  box-shadow:none !important;
}

.mdp-card-inner{
  padding:20px;
  border-radius:16px;
  background: rgba(0,0,0,.18);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  text-align:center;
}

/* ===================== QR ===================== */
/* ✅ Forzado doble (wrapper + imagen) por si el tema pisa border-radius */
.mdp-qr-wrap{
  text-align:center;
  margin: 8px 0 10px;
}

.mdp-qr-wrap .mdp-qr{
  width:220px;
  max-width:100%;
  border-radius:10px !important; /* ✅ AHORA SÍ O SÍ */
  background:#fff !important;
  padding:10px !important;
  display:inline-block !important;
  box-shadow:none !important;
}

.mdp-qr-wrap img.mdp-qr{
  border-radius:10px !important;  /* ✅ redundante intencional */
}

/* Instrucciones */
.mdp-instructions{
  margin: 10px auto 16px;
  padding: 14px 16px;
  border-radius: 14px;
  background: var(--mdp-bg) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  line-height:1.5;
  font-size:14px;
  color: var(--mdp-text, #fff) !important;
  text-align:center;
}

/* =========================================================
   BOTONES (FORZADOS CONTRA EL TEMA)
   Normal: relleno accent + texto blanco + sin borde
   Hover: transparente + borde + texto accent
========================================================= */

.mdp-actions{
  display:flex;
  justify-content:center;
  gap:12px;
  flex-wrap:wrap;
  margin-top:14px;
}

.mdp-actions .mdp-btn{
  padding:12px 22px !important;
  border-radius:999px !important;
  font-weight:900 !important;
  cursor:pointer !important;
  text-decoration:none !important;
  transition:.18s ease !important;

  border:2px solid transparent !important; /* ✅ sin borde en normal */
  outline:none !important;
  box-shadow:none !important;

  /* algunos temas ponen background/ color raros */
  background: transparent;
  color: inherit;
}

/* COPY */
.mdp-actions .mdp-btn.mdp-copy{
  background: var(--mdp-accent) !important; /* ✅ relleno */
  color: #ffffff !important;               /* ✅ texto blanco */
  border-color: transparent !important;    /* ✅ sin borde */
}

.mdp-actions .mdp-btn.mdp-copy:hover{
  background: transparent !important;          /* ✅ vacío */
  color: var(--mdp-accent) !important;         /* ✅ texto del color del relleno */
  border-color: var(--mdp-accent) !important;  /* ✅ solo borde */
}

/* WHATSAPP (misma lógica) */
.mdp-actions .mdp-btn.mdp-wa{
  background:#25d366 !important;
  color:#ffffff !important;
  border-color: transparent !important;
}

.mdp-actions .mdp-btn.mdp-wa:hover{
  background: transparent !important;
  color:#25d366 !important;
  border-color:#25d366 !important;
}

/* Nota */
.mdp-note{
  margin-top:16px;
  padding:14px;
  border-radius:12px;
  background: rgba(255,255,255,.08);
  text-align:center;
}

/* WhatsApp destino */
.mdp-wa-dest{
  margin-top:8px;
  font-size:12px;
  text-align:center;
  opacity:.85;
}

/* =========================================================
   THANK YOU (Gracias)
========================================================= */

body.woocommerce-order-received .mdp-thankyou-head{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  margin-bottom:14px;
  text-align:center;
}

body.woocommerce-order-received .mdp-thankyou-logo{
  width:92px;
  height:40px;
  object-fit:contain;
  filter:none;
}

body.woocommerce-order-received .mdp-thankyou-title{
  font-size:18px;
  font-weight:900;
  opacity:.95;
}

@media (min-width: 900px){
  body.woocommerce-order-received .mdp-thankyou-grid{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:22px;
    align-items:start;
  }
}

.mdp-key-block{
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:center;
  justify-content:center;
  margin: 6px 0 10px;
}
.mdp-key-label{
  opacity:.9;
  font-weight:700;
}
.mdp-key-value{
  font-size:28px;
  font-weight:1000;
  letter-spacing:.5px;
}

/* --- Botones: Copy (magenta) y WhatsApp (verde) --- */
.mdp-actions .mdp-btn{
  padding:12px 22px !important;
  border-radius:999px !important;
  font-weight:900 !important;
  cursor:pointer !important;
  text-decoration:none !important;
  transition:.18s ease !important;
  border:2px solid transparent !important;
  outline:none !important;
  box-shadow:none !important;
}

/* COPY: normal relleno magenta + texto blanco; hover solo borde + texto */
.mdp-actions .mdp-btn.mdp-copy{
  background: var(--mdp-copy, #ca0080) !important;
  color:#ffffff !important;
  border-color: transparent !important;
}
.mdp-actions .mdp-btn.mdp-copy:hover{
  background: transparent !important;
  color: var(--mdp-copy, #ca0080) !important;
  border-color: var(--mdp-copy, #ca0080) !important;
}

/* WhatsApp: normal verde + texto blanco; hover solo borde + texto */
.mdp-actions .mdp-btn.mdp-wa{
  background:#25d366 !important;
  color:#ffffff !important;
  border-color: transparent !important;
}
.mdp-actions .mdp-btn.mdp-wa:hover{
  background: transparent !important;
  color:#25d366 !important;
  border-color:#25d366 !important;
}

/* En thankyou, el bloque de acciones de la derecha centrado */
.mdp-actions-right{
  justify-content:center !important;
  margin-top:10px !important;
}

/* WhatsApp destino centrado debajo del botón */
.mdp-wa-dest{
  margin-top:10px !important;
  font-size:13px !important;
  text-align:center !important;
  opacity:.9 !important;
}

/* Nota un poco abajo */
.mdp-note{
  margin-top:14px !important;
}
