/* Subiendo Rewards — promociones y cupones (pasajero). Reutiliza bloques de wallet-pro.css. */

.pr-page{touch-action:pan-y;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}
.pr-page > *{flex-shrink:0}

/* ---------- Hero ---------- */
.pr-hero{
  min-height:0;
  background:
    radial-gradient(120% 140% at 100% 0%,rgba(236,72,153,.4) 0%,transparent 55%),
    radial-gradient(90% 120% at 0% 100%,rgba(34,211,238,.32) 0%,transparent 60%),
    linear-gradient(135deg,#1e0b3b 0%,#3b1a78 50%,#6d28d9 100%);
  box-shadow:0 18px 40px rgba(109,40,217,.32),inset 0 1px 0 rgba(255,255,255,.18);
}
.pr-hero .wx-brand b{color:#f9a8d4}
.pr-hero .wx-brand-dot{background:#f472b6;box-shadow:0 0 0 3px rgba(244,114,182,.22),0 0 12px #f472b6}
.pr-hero .wx-hero-balance{text-shadow:0 4px 18px rgba(244,114,182,.4)}
.pr-hero-ico{width:24px;height:24px;color:#fbcfe8;opacity:.9}
.pr-hero-active{
  margin-top:.8rem;align-self:flex-start;max-width:100%;
  padding:.4rem .7rem;border-radius:99px;font-size:.72rem;font-weight:700;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.pr-hero-active.is-on{background:rgba(34,211,238,.22);border-color:rgba(103,232,249,.55)}

/* ---------- Estudiantina (misma tarjeta, look nuevo) ---------- */
.pr-page .estudiantina-promo-card{
  margin:0;padding:1rem;border-radius:22px;position:relative;
  background:
    radial-gradient(110% 120% at 100% 0%,rgba(34,211,238,.35) 0%,transparent 55%),
    linear-gradient(145deg,#0a1f5c 0%,#1d4ed8 60%,#2563eb 100%);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 14px 32px rgba(29,78,216,.28);
}
.pr-page .estudiantina-promo-image{border-radius:16px;max-height:150px;box-shadow:0 8px 20px rgba(0,0,0,.25)}
.pr-page .wallet-promo-kicker{
  display:inline-flex;align-items:center;gap:.35rem;padding:.2rem .55rem;border-radius:99px;
  background:rgba(34,211,238,.2);border:1px solid rgba(103,232,249,.5);color:#cffafe;letter-spacing:.12em;
}
.pr-page .wallet-promo-kicker::before{
  content:"";width:6px;height:6px;border-radius:50%;background:#22d3ee;box-shadow:0 0 8px #22d3ee;
}
.pr-page .wallet-promo-bonus{
  display:inline-block;font-size:1.35rem;padding:.15rem .6rem;border-radius:10px;
  background:rgba(254,240,138,.14);border:1px solid rgba(254,240,138,.35);
}
.pr-page .estudiantina-upload-label{
  display:flex;align-items:center;justify-content:center;gap:.45rem;
  margin-top:.9rem;padding:.8rem;border-radius:14px;cursor:pointer;text-align:center;
  border:1.5px dashed rgba(255,255,255,.45);background:rgba(255,255,255,.08);
  font-size:.8rem;font-weight:700;
}
.pr-page .estudiantina-upload-label::before{content:"📎";font-size:1rem}
.pr-page .estudiantina-upload-label:active{background:rgba(255,255,255,.14)}
.pr-page .estudiantina-file-input{
  position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;pointer-events:none;
}
.pr-page .estudiantina-proof-name:not(:empty){
  margin-top:.45rem;padding:.35rem .6rem;border-radius:10px;background:rgba(16,185,129,.2);
  font-size:.72rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.pr-page .estudiantina-promo-card .wallet-promo-cta{
  border-radius:14px;padding:.85rem;color:#1d4ed8;box-shadow:0 8px 20px rgba(0,0,0,.2);
}

/* ---------- Canjear código ---------- */
.pr-redeem-row{display:flex;gap:.5rem}
.pr-code-input{
  flex:1;min-width:0;padding:.8rem .9rem;border-radius:12px;font:inherit;
  font-family:'DM Mono',ui-monospace,monospace;font-size:.92rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--text,#0f172a);background:var(--surface,#f8fafc);
  border:1.5px solid var(--border,#e2e8f0);outline:none;transition:border-color .2s,box-shadow .2s;
}
.pr-code-input:focus{border-color:#7c3aed;box-shadow:0 0 0 4px rgba(124,58,237,.14)}
.pr-redeem-btn{
  flex-shrink:0;padding:.8rem 1.1rem;border-radius:12px;border:0;cursor:pointer;
  font:inherit;font-size:.86rem;font-weight:800;color:#fff;
  background:linear-gradient(135deg,#ec4899,#7c3aed);box-shadow:0 8px 18px rgba(124,58,237,.3);
}
.pr-redeem-btn:active{transform:scale(.97)}

.pr-page .promo-selected-banner{display:none !important}

/* ---------- Cupones tipo ticket ---------- */
.pr-list{display:flex;flex-direction:column;gap:.6rem}
.pr-section-label{
  margin:.5rem .1rem 0;font-size:.68rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  color:var(--text3,#64748b);
}
.pr-coupon{
  position:relative;display:flex;align-items:stretch;width:100%;min-height:92px;padding:0;
  border-radius:16px;overflow:hidden;cursor:pointer;text-align:left;font:inherit;
  background:var(--surface,#f8fafc);border:1px solid var(--border,#e2e8f0);color:var(--text,#0f172a);
  transition:transform .15s,box-shadow .2s;
}
.pr-coupon:active:not(:disabled){transform:scale(.985)}
.pr-stub{
  position:relative;flex:0 0 96px;display:flex;align-items:center;justify-content:center;padding:.6rem;
  color:#fff;text-align:center;
  background:linear-gradient(135deg,#06b6d4,#2563eb 60%,#4f46e5);
}
.pr-stub b{font-size:1.05rem;font-weight:900;line-height:1.1;letter-spacing:-.01em;word-break:break-word;text-shadow:0 2px 8px rgba(0,0,0,.2)}
.pr-stub::after{
  content:"";position:absolute;right:-1px;top:8px;bottom:8px;width:0;
  border-right:2px dashed rgba(255,255,255,.55);
}
.pr-coupon::before,.pr-coupon::after{
  content:"";position:absolute;left:87px;width:18px;height:18px;border-radius:50%;z-index:1;
  background:var(--white,#fff);
}
.pr-coupon::before{top:-9px;box-shadow:inset 0 -1px 0 var(--border,#e2e8f0)}
.pr-coupon::after{bottom:-9px;box-shadow:inset 0 1px 0 var(--border,#e2e8f0)}
.pr-body{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:.2rem;padding:.7rem .85rem .7rem 1rem}
.pr-title{font-size:.86rem;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pr-desc{
  font-size:.74rem;color:var(--text2,#475569);line-height:1.35;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.pr-foot{display:flex;align-items:center;flex-wrap:wrap;gap:.3rem .5rem;margin-top:.25rem}
.pr-code{
  font-family:'DM Mono',ui-monospace,monospace;font-size:.68rem;letter-spacing:.12em;
  padding:.12rem .45rem;border-radius:6px;background:var(--white,#fff);border:1px dashed var(--border2,#cbd5e1);
}
.pr-state{font-size:.66rem;font-weight:700;color:var(--blue,#2563eb)}
.pr-coupon.is-selected{
  border-color:#22d3ee;background:rgba(34,211,238,.08);
  box-shadow:0 0 0 3px rgba(34,211,238,.25),0 10px 22px rgba(34,211,238,.18);
}
.pr-coupon.is-selected .pr-state{color:#0891b2}
.pr-coupon.is-selected .pr-body{padding-right:2.2rem}
.pr-check{
  position:absolute;top:.5rem;right:.55rem;width:22px;height:22px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:900;color:#fff;
  background:linear-gradient(135deg,#22d3ee,#2563eb);box-shadow:0 4px 10px rgba(34,211,238,.4);
}
.pr-coupon.is-gold .pr-stub{background:linear-gradient(135deg,#fde68a 0%,#f59e0b 50%,#b45309 100%);color:#1c1917}
.pr-coupon.is-gold .pr-stub b{text-shadow:none}
.pr-coupon.is-gold{border-color:#fcd34d}
.pr-coupon.is-used{cursor:default;opacity:.6}
.pr-coupon.is-used .pr-stub{filter:grayscale(.85)}
.pr-coupon.is-used .pr-state{color:var(--text3,#94a3b8)}

/* ---------- Modo oscuro ---------- */
html[data-theme="dark"] .pr-coupon{background:var(--surface);border-color:var(--border)}
html[data-theme="dark"] .pr-coupon::before,
html[data-theme="dark"] .pr-coupon::after{background:var(--card)}
html[data-theme="dark"] .pr-code{background:var(--card);border-color:var(--border)}
html[data-theme="dark"] .pr-code-input{background:var(--surface) !important;color:var(--text) !important}
html[data-theme="dark"] .pr-code-input:focus{border-color:#a78bfa !important}
html[data-theme="dark"] .pr-state{color:#60a5fa}
html[data-theme="dark"] .pr-coupon.is-selected{background:rgba(34,211,238,.1);border-color:#22d3ee}
html[data-theme="dark"] .pr-coupon.is-selected .pr-state{color:#67e8f9}
html[data-theme="dark"] .pr-coupon.is-gold{border-color:#b45309}
html[data-theme="dark"] .pr-redeem-btn,
html[data-theme="dark"] .pr-coupon .pr-stub{color:#fff !important}
html[data-theme="dark"] .pr-coupon.is-gold .pr-stub{color:#1c1917 !important}
html[data-theme="dark"] .pr-coupon{color:var(--text) !important}
