:root{
  /* Defaults: try WP block-theme palette vars, then fall back to safe colors */
  --wpgd-primary: var(--wp--preset--color--primary, var(--global--color-primary, #6366f1));
  --wpgd-on-primary: var(--wp--preset--color--base, #ffffff);
  --wpgd-surface: var(--wp--preset--color--base, #ffffff);
  --wpgd-text: var(--wp--preset--color--contrast, #0f172a);
  --wpgd-muted: var(--wp--preset--color--secondary, #475569);
  --wpgd-border: rgba(0,0,0,0.12);
  --wpgd-soft: rgba(0,0,0,0.03);
  --wpgd-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);
  --wpgd-shadow-soft: 0 10px 15px -3px rgba(0,0,0,0.10);
  --wpgd-radius: 12px;
  --wpgd-radius-lg: 16px;
}

/* Botón: si el usuario setea clases del theme (button / btn / wp-element-button), evitamos pisar estilos. */
.wpgd-btn:not(.wp-element-button):not(.wp-block-button__link):not(.button):not(.btn){
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 24px;
  border-radius:var(--wpgd-radius);
  font-weight:600;
  text-decoration:none;
  transition:filter .15s ease, opacity .15s ease, transform .15s ease;
  cursor:pointer;
  border:none;
  font:inherit;
}

.wpgd-btn-primary:not(.wp-element-button):not(.wp-block-button__link):not(.button):not(.btn){
  background:var(--wpgd-primary);
  color:var(--wpgd-on-primary) !important;
}
.wpgd-btn-primary:not(.wp-element-button):not(.wp-block-button__link):not(.button):not(.btn):hover{ filter:brightness(.92); }
.wpgd-btn-secondary:not(.wp-element-button):not(.wp-block-button__link):not(.button):not(.btn){
  background:transparent;
  border:1px solid var(--wpgd-border);
  color:var(--wpgd-text);
}
.wpgd-btn-secondary:not(.wp-element-button):not(.wp-block-button__link):not(.button):not(.btn):hover{ filter:brightness(.98); transform:translateY(-1px); }

.wpgd-inline-banner{
  background:var(--wpgd-surface);
  border:1px solid var(--wpgd-border);
  border-left:4px solid var(--wpgd-primary);
  padding:24px;
  margin:32px 0;
  border-radius:var(--wpgd-radius-lg);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  flex-wrap:wrap;
  box-shadow:0 4px 6px -1px rgba(0,0,0,0.06);
}

.wpgd-banner-content h4{ margin:0 0 8px 0; font-size:1.25rem; color:var(--wpgd-text); }
.wpgd-banner-content p{ margin:0; color:var(--wpgd-muted); }

.wpgd-floating-btn{
  position:fixed;
  bottom:24px;
  right:24px;
  z-index:9999;
  display:flex;
  align-items:center;
  gap:8px;
  text-decoration:none;
}

.wpgd-floating-btn:not(.wp-element-button):not(.button):not(.btn):not(.wp-block-button__link){
  background:var(--wpgd-primary);
  color:var(--wpgd-on-primary) !important;
  padding:12px 20px;
  border-radius:999px;
  font-weight:700;
  box-shadow:0 10px 15px -3px rgba(0,0,0,0.12);
  transition:filter .15s ease, transform .15s ease;
  font:inherit;
}
.wpgd-floating-btn:not(.wp-element-button):not(.button):not(.btn):not(.wp-block-button__link):hover{ filter:brightness(.92); transform:translateY(-1px); }
.wpgd-floating-btn:focus{ outline:3px solid var(--wpgd-primary); outline-offset:2px; }

.wpgd-premium-page{
  max-width:880px;
  margin:0 auto;
  padding:40px 20px;
  font-family:inherit;
}
.wpgd-hero{ text-align:center; margin-bottom:32px; }
.wpgd-hero-icon{ font-size:3rem; display:block; margin-bottom:14px; }
.wpgd-hero h1{ font-size:2.4rem; font-weight:800; color:var(--wpgd-text); margin:0 0 14px 0; line-height:1.2; }
.wpgd-lead{ font-size:1.05rem; color:var(--wpgd-muted); max-width:640px; margin:0 auto; line-height:1.65; }
.wpgd-page-intro{ margin:22px auto 26px auto; max-width:740px; color:var(--wpgd-text); }
.wpgd-page-intro p{ color:var(--wpgd-muted); }
.wpgd-page-outro{ margin:28px auto 0 auto; max-width:740px; color:var(--wpgd-text); }
.wpgd-page-outro p{ color:var(--wpgd-muted); }

.wpgd-methods-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
  gap:18px;
}

.wpgd-method-card{
  background:var(--wpgd-surface);
  border:1px solid var(--wpgd-border);
  border-radius:var(--wpgd-radius-lg);
  padding:18px;
  display:flex;
  align-items:center;
  gap:14px;
  cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  text-align:left;
  box-shadow:0 4px 6px -1px rgba(0,0,0,0.06);
  color:inherit;
  text-decoration:none;
  width:100%;
}
.wpgd-method-card:hover{
  border-color:var(--hover-color);
  transform:translateY(-3px);
  box-shadow:var(--wpgd-shadow-soft);
}
.wpgd-method-card:focus{ outline:3px solid var(--wpgd-primary); outline-offset:2px; }

.wpgd-card-icon{
  width:56px;
  height:56px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  background:var(--wpgd-soft);
  border:1px solid rgba(0,0,0,0.06);
  flex:0 0 auto;
}
.wpgd-card-icon svg{ width:30px; height:30px; display:block; }
.wpgd-icon-logo{ line-height:0; }
.wpgd-card-info h3{ margin:0 0 4px 0; font-size:1.05rem; color:var(--wpgd-text); font-weight:750; letter-spacing:-0.01em; }
.wpgd-card-info span{ font-size:.9rem; color:var(--wpgd-muted); font-weight:600; }

.wpgd-modal-overlay{
  position:fixed;
  inset:0;
  background:rgba(15, 23, 42, 0.70);
  z-index:100000;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .2s ease, visibility .2s ease;
  display:flex;
  align-items:center;
  justify-content:center;
  backdrop-filter:blur(4px);
}
.wpgd-modal-active{ opacity:1; visibility:visible; pointer-events:auto; }
.wpgd-modal-overlay[aria-hidden="false"]{ opacity:1; visibility:visible; pointer-events:auto; }

.wpgd-modal-content{
  background:var(--wpgd-surface);
  width:92%;
  max-width:420px;
  border-radius:18px;
  padding:28px 28px 22px 28px;
  position:relative;
  transform:translateY(12px);
  transition:transform .2s ease;
  text-align:center;
  box-shadow:var(--wpgd-shadow);
}
.wpgd-modal-active .wpgd-modal-content,
.wpgd-modal-overlay[aria-hidden="false"] .wpgd-modal-content{ transform:translateY(0); }

.wpgd-modal-close{
  position:absolute;
  top:14px;
  right:14px;
  background:none;
  border:none;
  font-size:1.6rem;
  color:#94a3b8;
  cursor:pointer;
  transition:color .2s;
}
.wpgd-modal-close:hover{ color:var(--wpgd-text); }
.wpgd-modal-close:focus{ outline:3px solid var(--wpgd-primary); outline-offset:2px; }

.wpgd-modal-header h3{ margin:0 0 12px 0; color:var(--wpgd-text); font-size:1.45rem; }

.wpgd-modal-body p{ color:var(--wpgd-muted); margin:0 0 16px 0; font-size:.95rem; line-height:1.55; }

.wpgd-qr-container{
  background:var(--wpgd-surface);
  padding:14px;
  border-radius:14px;
  border:1px solid var(--wpgd-border);
  display:inline-block;
  margin-bottom:18px;
}
.wpgd-qr-container img{ display:block; width:200px; height:200px; }

.wpgd-address-box{ display:flex; gap:8px; }
.wpgd-address-box input{
  flex:1;
  padding:12px;
  border:1px solid var(--wpgd-border);
  border-radius:12px;
  background:var(--wpgd-soft);
  color:var(--wpgd-text);
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size:.9rem;
  text-align:center;
  outline:none;
}
.wpgd-address-box button{
  background:var(--wpgd-primary);
  color:var(--wpgd-on-primary);
  border:none;
  padding:0 16px;
  border-radius:12px;
  font-weight:700;
  cursor:pointer;
  transition:filter .15s ease;
}
.wpgd-address-box button:hover{ filter:brightness(.92); }
.wpgd-address-box button:focus{ outline:3px solid var(--wpgd-primary); outline-offset:2px; }

.wpgd-success-text{ color:#10b981 !important; font-weight:700; margin-top:12px !important; }

/* Link pre-modal */
.wpgd-link-body{
  text-align:left;
  margin: 0 0 10px 0;
}
.wpgd-link-body p{ margin:0 0 10px 0; }
.wpgd-amounts{
  display:flex;
  gap:10px;
  justify-content:center;
  flex-wrap:wrap;
  margin: 10px 0 14px 0;
}
.wpgd-amount-btn{
  background:transparent;
  border:1px solid var(--wpgd-border);
  color:var(--wpgd-text);
  border-radius:999px;
  padding:8px 14px;
  font-weight:800;
  cursor:pointer;
  transition:transform .15s ease, filter .15s ease, border-color .15s ease;
}
.wpgd-amount-btn:hover{ transform:translateY(-1px); border-color:var(--wpgd-primary); }
.wpgd-amount-btn.is-active{ background:var(--wpgd-primary); color:var(--wpgd-on-primary); border-color:var(--wpgd-primary); }

.wpgd-link-actions{
  display:flex;
  gap:10px;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  margin-top: 6px;
}

@media (max-width:640px){
  .wpgd-inline-banner{ flex-direction:column; text-align:center; }
  .wpgd-hero h1{ font-size:2rem; }
  .wpgd-modal-content{ padding:24px 18px 18px 18px; }
}
