@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&display=swap');

.mvd-wrap{
  max-width:672px;
  margin:0 auto;
  padding:32px 20px 40px;
  display:flex;
  flex-direction:column;
  align-items:center;
  background:#1C1C1C;
  border-radius:24px;
  font-family:'Poppins',sans-serif;
}

/* Logo */
.mvd-logo-box{width:90px;height:90px;display:flex;align-items:center;justify-content:center;margin-bottom:28px}
.mvd-logo-img{width:90px;height:90px;object-fit:contain;border-radius:18px}
.mvd-logo-text{color:#fff;font-size:13px;font-weight:400;letter-spacing:0.5px}

/* Step visibility */
.mvd-step{width:100%;display:flex;flex-direction:column;align-items:center}
.mvd-hidden{display:none!important}

/* Progress dots */
.mvd-dots{display:flex;gap:6px;margin-bottom:28px}
.mvd-dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,0.12);transition:all 0.3s}
.mvd-dot-active{background:#B89A6A;width:20px;border-radius:3px}
.mvd-dot-done{background:rgba(184,154,106,0.4)}

/* Currency buttons */
.mvd-currency-row{display:flex;gap:8px;width:100%;margin-bottom:16px}
.mvd-cur-btn{flex:1;height:40px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.07);border-radius:14px;color:rgba(255,255,255,0.55);font-size:12px;font-family:'Poppins',sans-serif;cursor:pointer;transition:all 0.2s;letter-spacing:1px}
.mvd-cur-btn:hover{background:rgba(255,255,255,0.08);color:rgba(255,255,255,0.88)}
.mvd-cur-active{background:rgba(184,154,106,0.18)!important;border-color:#B89A6A!important;color:#F0E4CC!important}

/* Amount field */
.mvd-amount-wrap{width:100%;background:#C8C4BC;border-radius:20px;padding:24px 24px 18px;display:flex;flex-direction:column;align-items:center;margin-bottom:12px;position:relative;cursor:text}
.mvd-ghost-input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.mvd-amount-top{display:flex;align-items:center;justify-content:center;gap:12px;width:100%}
.mvd-amount-sym{font-size:40px;font-weight:300;color:rgba(42,42,42,0.4);line-height:1}
.mvd-amount-val{font-size:68px;font-weight:300;color:#2A2A2A;line-height:1;letter-spacing:-1px}
.mvd-amount-val.mvd-placeholder{color:rgba(42,42,42,0.3)}
.mvd-cursor{display:inline-block;width:2px;height:50px;background:#B89A6A;margin-left:3px;vertical-align:middle;animation:mvd-blink 1s step-end infinite}
@keyframes mvd-blink{0%,100%{opacity:1}50%{opacity:0}}
.mvd-cur-badge{position:absolute;right:16px;top:50%;transform:translateY(-50%);background:rgba(0,0,0,0.08);border-radius:10px;padding:5px 12px;font-size:11px;color:#2A2A2A;font-weight:500;letter-spacing:1.2px}
.mvd-clear-btn{margin-top:8px;background:none;border:none;font-size:11px;color:rgba(42,42,42,0.4);font-family:'Poppins',sans-serif;cursor:pointer;letter-spacing:0.5px;padding:2px 8px;border-radius:6px;transition:color 0.2s}
.mvd-clear-btn:hover{color:rgba(42,42,42,0.65)}

/* Preset amounts */
.mvd-presets{display:flex;gap:8px;width:100%;margin-bottom:12px}
.mvd-preset{flex:1;height:40px;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);border-radius:12px;color:rgba(255,255,255,0.55);font-size:13px;font-family:'Poppins',sans-serif;cursor:pointer;transition:all 0.2s}
.mvd-preset:hover{background:rgba(255,255,255,0.09);color:rgba(255,255,255,0.88)}
.mvd-preset-active{background:#B89A6A!important;border-color:#B89A6A!important;color:#fff!important}

/* Toggle */
.mvd-toggle-wrap{width:100%;background:#111;border-radius:20px;padding:5px;display:flex;position:relative;margin-bottom:28px;overflow:hidden}
.mvd-toggle-slider{position:absolute;top:5px;bottom:5px;width:calc(50% - 5px);background:#B89A6A;border-radius:15px;transition:left 0.28s cubic-bezier(.4,0,.2,1);left:5px;pointer-events:none}
.mvd-toggle-right{left:calc(50%)}
.mvd-tog-btn{flex:1;height:50px;border:none;border-radius:15px;font-size:12px;font-weight:500;letter-spacing:1.8px;font-family:'Poppins',sans-serif;cursor:pointer;transition:color 0.25s;background:transparent;position:relative;z-index:1}
.mvd-tog-inactive{color:rgba(255,255,255,0.55)}
.mvd-tog-active{color:#F0E4CC}

/* Helper text */
.mvd-helper{color:rgba(255,255,255,0.55);font-size:14px;font-weight:300;text-align:center;line-height:1.65;margin-bottom:20px}

/* Phone field */
.mvd-phone-wrap{width:100%;background:#C8C4BC;border-radius:20px;padding:20px 28px;display:flex;align-items:center;gap:14px;margin-bottom:28px;cursor:text;position:relative}
.mvd-phone-flag{display:flex;align-items:center;gap:8px;flex-shrink:0;font-size:20px}
.mvd-phone-prefix{font-size:13px;color:rgba(42,42,42,0.5);font-weight:300}
.mvd-phone-sep{width:1px;height:24px;background:rgba(42,42,42,0.18)}
.mvd-phone-val{font-size:26px;font-weight:300;color:#2A2A2A;letter-spacing:0.5px;flex:1}
.mvd-phone-val.mvd-placeholder{color:rgba(42,42,42,0.32);font-size:20px}

/* OTP */
.mvd-otp-row{display:flex;gap:10px;justify-content:center;width:100%;margin:20px 0}
.mvd-otp-b{width:52px;height:58px;background:#C8C4BC;border:none;border-radius:14px;font-size:22px;font-weight:400;text-align:center;color:#2A2A2A;font-family:'Poppins',sans-serif;outline:none;transition:box-shadow 0.2s}
.mvd-otp-b:focus{box-shadow:0 0 0 2px #B89A6A}
.mvd-resend{color:rgba(184,154,106,0.65);font-size:12px;cursor:pointer;text-align:center;margin-top:6px;margin-bottom:16px}

/* Form fields */
.mvd-field{width:100%;margin-bottom:12px}
.mvd-row2{display:flex;gap:10px;width:100%}
.mvd-row2 .mvd-field{flex:1}
.mvd-label{display:block;font-size:10px;color:rgba(255,255,255,0.40);letter-spacing:1.8px;text-transform:uppercase;margin-bottom:6px;padding-left:4px}
.mvd-inp{width:100%;height:54px;background:#C8C4BC;border:none;border-radius:14px;padding:0 20px;font-size:15px;font-weight:300;color:#2A2A2A;font-family:'Poppins',sans-serif;outline:none;transition:box-shadow 0.2s}
.mvd-inp:focus{box-shadow:0 0 0 2px #B89A6A}
.mvd-inp::placeholder{color:rgba(42,42,42,0.38)}
.mvd-sel{width:100%;height:54px;background:#C8C4BC;border:none;border-radius:14px;padding:0 20px;font-size:15px;font-weight:300;color:#2A2A2A;font-family:'Poppins',sans-serif;outline:none;appearance:none;cursor:pointer}

/* Stripe card element */
.mvd-card-element{width:100%;height:54px;background:#C8C4BC;border-radius:14px;padding:16px 20px;transition:box-shadow 0.2s}
.mvd-card-element.focused{box-shadow:0 0 0 2px #B89A6A}

/* Type grid */
.mvd-type-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%;margin-bottom:16px}
.mvd-type-card{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.07);border-radius:16px;padding:16px;cursor:pointer;transition:all 0.2s;text-align:left}
.mvd-type-card:hover{background:rgba(255,255,255,0.07)}
.mvd-type-active{background:rgba(184,154,106,0.13)!important;border-color:#B89A6A!important}
.mvd-type-name{font-size:14px;font-weight:400;color:rgba(255,255,255,0.88);margin-bottom:3px}
.mvd-type-sub{font-size:11px;color:rgba(255,255,255,0.55)}
.mvd-type-active .mvd-type-name{color:#F0E4CC}
.mvd-type-active .mvd-type-sub{color:rgba(240,228,204,0.55)}

/* Summary */
.mvd-summary{width:100%;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.07);border-radius:16px;padding:20px;margin-bottom:16px}
.mvd-sum-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid rgba(255,255,255,0.05);font-size:13px}
.mvd-sum-row:last-child{border-bottom:none;padding-top:14px}
.mvd-sum-lbl{color:rgba(255,255,255,0.55)}
.mvd-sum-val{color:rgba(255,255,255,0.88);font-weight:400}
.mvd-sum-total .mvd-sum-val{color:#F0E4CC;font-size:22px;font-weight:300}

/* CTA buttons */
.mvd-cta{width:100%;height:58px;background:#B89A6A;border:none;border-radius:20px;font-size:13px;font-weight:500;letter-spacing:1.8px;color:#F0E4CC;font-family:'Poppins',sans-serif;cursor:pointer;transition:all 0.2s;margin-top:8px}
.mvd-cta:hover{background:#C8AB7A}
.mvd-cta:active{transform:scale(0.99)}
.mvd-cta-dark{background:rgba(255,255,255,0.06)!important;color:rgba(255,255,255,0.55)!important;border:1px solid rgba(255,255,255,0.08)!important}
.mvd-cta-dark:hover{background:rgba(255,255,255,0.1)!important;color:rgba(255,255,255,0.88)!important}

/* Back button */
.mvd-back-btn{background:none;border:none;color:rgba(255,255,255,0.55);font-size:13px;font-family:'Poppins',sans-serif;cursor:pointer;margin-bottom:20px;padding:0;display:flex;align-items:center;gap:6px;align-self:flex-start}

/* Checkbox */
.mvd-cb-row{display:flex;align-items:center;gap:10px;margin-top:8px;width:100%}
.mvd-cb-row input[type=checkbox]{width:18px;height:18px;accent-color:#B89A6A;flex-shrink:0}
.mvd-cb-row span{font-size:12px;color:rgba(255,255,255,0.55)}

/* Secure note */
.mvd-secure{font-size:11px;color:rgba(255,255,255,0.40);text-align:center;margin-top:10px}

/* Spinner */
.mvd-spinner{color:rgba(255,255,255,0.55);font-size:13px;text-align:center;margin-top:12px;animation:mvd-pulse 1.5s ease-in-out infinite}
@keyframes mvd-pulse{0%,100%{opacity:0.4}50%{opacity:1}}

/* Error */
.mvd-error{color:#E24B4A;font-size:12px;text-align:center;margin-top:8px;padding:8px 12px;background:rgba(226,75,74,0.1);border-radius:8px}

/* Success */
.mvd-check-circle{width:70px;height:70px;border-radius:50%;background:rgba(184,154,106,0.12);border:1px solid rgba(184,154,106,0.28);display:flex;align-items:center;justify-content:center;margin:0 auto 20px}
.mvd-success-title{font-size:22px;font-weight:300;color:rgba(255,255,255,0.88);margin-bottom:10px;text-align:center}
.mvd-success-sub{font-size:14px;color:rgba(255,255,255,0.55);line-height:1.7;margin-bottom:24px;text-align:center}

/* PDF button */
.mvd-pdf-btn{width:100%;height:50px;background:rgba(184,154,106,0.1);border:1px solid rgba(184,154,106,0.28);border-radius:16px;color:#F0E4CC;font-size:13px;font-family:'Poppins',sans-serif;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:10px;text-decoration:none}

/* Footer */
.mvd-footer-note{color:rgba(255,255,255,0.40);font-size:12px;font-weight:300;text-align:center;line-height:1.75;margin-top:24px;max-width:340px}
.mvd-footer-note a{color:rgba(184,154,106,0.65);text-decoration:none}

/* ── Overrides: neutralizar estilos del tema WordPress ── */
#mvd-app button,
#mvd-app input[type="button"],
#mvd-app input[type="submit"] {
  background-color: transparent !important;
  border-radius: 20px !important;
  border: none !important;
  box-shadow: none !important;
  color: inherit !important;
  font-family: 'Poppins', sans-serif !important;
  text-transform: none !important;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 1 !important;
}
#mvd-app .mvd-cta {
  background-color: #B89A6A !important;
  color: #F0E4CC !important;
  border-radius: 20px !important;
  width: 100% !important;
  height: 58px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 1.8px !important;
  border: none !important;
  cursor: pointer !important;
  margin-top: 8px !important;
}
#mvd-app .mvd-cta:hover {
  background-color: #C8AB7A !important;
}
#mvd-app .mvd-cta-dark {
  background-color: rgba(255,255,255,0.06) !important;
  color: rgba(255,255,255,0.38) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
}
#mvd-app .mvd-toggle-wrap button,
#mvd-app .mvd-tog-btn {
  background-color: transparent !important;
  border: none !important;
  border-radius: 15px !important;
  box-shadow: none !important;
}
#mvd-app .mvd-tog-active {
  color: #F0E4CC !important;
}
#mvd-app .mvd-tog-inactive {
  color: rgba(255,255,255,0.38) !important;
}
#mvd-app .mvd-preset {
  background-color: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  color: rgba(255,255,255,0.38) !important;
  border-radius: 12px !important;
  height: 36px !important;
}
#mvd-app .mvd-preset-active {
  background-color: #B89A6A !important;
  border-color: #B89A6A !important;
  color: #fff !important;
}
#mvd-app .mvd-cur-btn {
  background-color: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  color: rgba(255,255,255,0.38) !important;
  border-radius: 14px !important;
}
#mvd-app .mvd-cur-active {
  background-color: rgba(184,154,106,0.18) !important;
  border-color: #B89A6A !important;
  color: #F0E4CC !important;
}
#mvd-app .mvd-back-btn {
  background-color: transparent !important;
  border: none !important;
  color: rgba(255,255,255,0.38) !important;
  border-radius: 0 !important;
}
#mvd-app .mvd-clear-btn {
  background-color: transparent !important;
  border: none !important;
  color: rgba(42,42,42,0.4) !important;
}
#mvd-app .mvd-pdf-btn {
  background-color: rgba(184,154,106,0.1) !important;
  border: 1px solid rgba(184,154,106,0.28) !important;
  color: #F0E4CC !important;
  border-radius: 16px !important;
  height: 50px !important;
  text-decoration: none !important;
  display: flex !important;
}
#mvd-app input[type="text"],
#mvd-app input[type="email"],
#mvd-app input[type="tel"],
#mvd-app input[type="password"],
#mvd-app input[type="number"],
#mvd-app select {
  background-color: #C8C4BC !important;
  color: #2A2A2A !important;
  border: none !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  outline: none !important;
}
#mvd-app .mvd-otp-b {
  background-color: #C8C4BC !important;
  color: #2A2A2A !important;
  border: none !important;
  border-radius: 14px !important;
  width: 52px !important;
  height: 58px !important;
  font-size: 22px !important;
  text-align: center !important;
}
#mvd-app .mvd-type-card {
  background-color: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  border-radius: 16px !important;
  cursor: pointer !important;
}
#mvd-app .mvd-type-active {
  background-color: rgba(184,154,106,0.13) !important;
  border-color: #B89A6A !important;
}

/* ── Country selector ── */
.mvd-country-select{display:flex;align-items:center;gap:6px;cursor:pointer;flex-shrink:0;padding:4px 6px;border-radius:10px;transition:background 0.2s;position:relative}
.mvd-country-select:hover{background:rgba(42,42,42,0.08)}
.mvd-country-arrow{font-size:10px;color:rgba(42,42,42,0.45);margin-left:2px}
.mvd-country-dropdown{position:absolute;top:calc(100% + 8px);left:0;background:#2A2A2A;border-radius:14px;padding:6px;z-index:999;min-width:200px;box-shadow:0 8px 32px rgba(0,0,0,0.4)}
.mvd-country-option{padding:10px 14px;font-size:13px;color:rgba(255,255,255,0.88);cursor:pointer;border-radius:10px;transition:background 0.15s;white-space:nowrap}
.mvd-country-option:hover{background:rgba(255,255,255,0.08)}
.mvd-country-selected{background:rgba(184,154,106,0.2);color:#F0E4CC}

/* ── Greeting returning user ── */
.mvd-greeting{text-align:center;margin-bottom:20px;padding:20px 0 4px}
.mvd-greeting-name{font-size:22px;font-weight:300;color:#fff;margin-bottom:6px}
.mvd-greeting-sub{font-size:14px;color:rgba(255,255,255,0.45);font-weight:300}
.mvd-no-greeting{display:none}

/* ── Portal button in step 1 ── */
.mvd-portal-divider{display:flex;align-items:center;gap:10px;width:100%;margin:20px 0 12px}
.mvd-portal-divider::before,.mvd-portal-divider::after{content:'';flex:1;height:1px;background:rgba(255,255,255,0.08)}
.mvd-portal-divider span{font-size:11px;color:rgba(255,255,255,0.25);letter-spacing:0.5px;white-space:nowrap}
.mvd-portal-btn{width:100%;height:48px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08)!important;border-radius:16px!important;color:rgba(255,255,255,0.5)!important;font-size:13px;font-family:'Poppins',sans-serif;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;letter-spacing:0.5px;transition:all 0.2s;background-color:rgba(255,255,255,0.04)!important}
.mvd-portal-btn:hover{background:rgba(255,255,255,0.08)!important;color:rgba(255,255,255,0.88)!important}

/* ── Portal wrap ── */
.mvd-portal-wrap{width:100%;display:flex;flex-direction:column;align-items:center}
.mvd-portal-header{text-align:center;margin-bottom:28px}
.mvd-portal-logo{width:64px;height:64px;background:#111;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:12px;color:#fff;letter-spacing:0.5px;margin:0 auto 12px}
.mvd-portal-title{font-size:18px;font-weight:300;color:rgba(255,255,255,0.88);letter-spacing:0.5px}
.mvd-portal-welcome{font-size:16px;font-weight:300;color:rgba(255,255,255,0.88)}

/* ── Portal stats ── */
.mvd-portal-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:100%;margin-bottom:24px}
.mvd-pstat{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.07);border-radius:14px;padding:16px 12px;text-align:center}
.mvd-pstat-val{font-size:20px;font-weight:300;color:#F0E4CC;margin-bottom:4px}
.mvd-pstat-lbl{font-size:10px;color:rgba(255,255,255,0.35);text-transform:uppercase;letter-spacing:1px}

/* ── Portal sections ── */
.mvd-portal-section{width:100%;margin-bottom:20px}
.mvd-portal-section-title{font-size:11px;color:rgba(255,255,255,0.3);text-transform:uppercase;letter-spacing:1.5px;margin-bottom:10px;padding-left:2px}

/* ── Donation history rows ── */
.mvd-history-row{background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.06);border-radius:12px;padding:14px 16px;margin-bottom:8px;display:flex;justify-content:space-between;align-items:center}
.mvd-history-left .mvd-history-type{font-size:13px;color:rgba(255,255,255,0.88);margin-bottom:3px}
.mvd-history-left .mvd-history-date{font-size:11px;color:rgba(255,255,255,0.3)}
.mvd-history-right{text-align:right}
.mvd-history-amount{font-size:16px;font-weight:300;color:#F0E4CC}
.mvd-history-folio{font-size:10px;color:rgba(255,255,255,0.25);margin-top:3px}
.mvd-history-pdf{display:inline-block;margin-top:4px;font-size:10px;color:rgba(184,154,106,0.7);text-decoration:none;letter-spacing:0.5px}

/* ── Subscription rows ── */
.mvd-sub-row{background:rgba(184,154,106,0.07);border:1px solid rgba(184,154,106,0.2);border-radius:12px;padding:14px 16px;margin-bottom:8px;display:flex;justify-content:space-between;align-items:center}
.mvd-sub-info .mvd-sub-type{font-size:13px;color:#F0E4CC;margin-bottom:3px}
.mvd-sub-info .mvd-sub-next{font-size:11px;color:rgba(255,255,255,0.3)}
.mvd-sub-right{text-align:right}
.mvd-sub-amount{font-size:16px;font-weight:300;color:#F0E4CC}
.mvd-cancel-sub{display:block;margin-top:6px;font-size:11px;color:rgba(226,75,74,0.7);cursor:pointer;letter-spacing:0.3px;background:none;border:none;font-family:'Poppins',sans-serif;padding:0}
.mvd-cancel-sub:hover{color:#E24B4A}

/* ── Profile ── */
.mvd-portal-profile{background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.06);border-radius:12px;padding:16px}
.mvd-profile-row{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid rgba(255,255,255,0.05);font-size:13px}
.mvd-profile-row:last-child{border-bottom:none}
.mvd-profile-lbl{color:rgba(255,255,255,0.35)}
.mvd-profile-val{color:rgba(255,255,255,0.88)}

/* ── Back to donate ── */
.mvd-back-to-donate{background:none;border:none;color:rgba(184,154,106,0.65);font-size:13px;font-family:'Poppins',sans-serif;cursor:pointer;margin-top:12px;letter-spacing:0.3px}
.mvd-back-to-donate:hover{color:#B89A6A}

/* ── Empty state ── */
.mvd-empty{text-align:center;padding:20px;color:rgba(255,255,255,0.25);font-size:13px}

/* ── Portal button rediseñado ── */
.mvd-portal-divider{display:flex;align-items:center;gap:10px;width:100%;margin:24px 0 14px}
.mvd-portal-divider::before,.mvd-portal-divider::after{content:'';flex:1;height:1px;background:rgba(255,255,255,0.1)}
.mvd-portal-divider span{font-size:12px;color:rgba(255,255,255,0.35);letter-spacing:0.5px;white-space:nowrap}
.mvd-portal-btn{width:100%;height:54px;background:rgba(255,255,255,0.08)!important;border:1px solid rgba(255,255,255,0.15)!important;border-radius:16px!important;color:rgba(255,255,255,0.85)!important;font-size:14px!important;font-family:'Poppins',sans-serif;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;letter-spacing:0.5px;transition:all 0.2s;background-color:rgba(255,255,255,0.08)!important;font-weight:400!important}
.mvd-portal-btn:hover{background:rgba(255,255,255,0.14)!important;color:#fff!important}
.mvd-portal-btn svg{opacity:0.9}

/* ── Portal button - versión prominente ── */
#mvd-app .mvd-portal-btn,
#mvd-portal .mvd-portal-btn {
  width: 100% !important;
  height: 56px !important;
  background: rgba(255,255,255,0.10) !important;
  border: 1.5px solid rgba(255,255,255,0.25) !important;
  border-radius: 18px !important;
  color: #fff !important;
  font-size: 15px !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 400 !important;
  letter-spacing: 0.3px !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  transition: all 0.2s !important;
}
#mvd-app .mvd-portal-btn:hover,
#mvd-portal .mvd-portal-btn:hover {
  background: rgba(255,255,255,0.16) !important;
}

/* Phone display - texto más limpio */
.mvd-phone-val.mvd-placeholder {
  font-size: 16px !important;
  color: rgba(42,42,42,0.35) !important;
}
.mvd-phone-val:not(.mvd-placeholder) {
  font-size: 22px !important;
  letter-spacing: 1px !important;
}

/* ── Poppins global + tamaños aumentados ── */
#mvd-app, #mvd-portal {
  font-family: 'Poppins', sans-serif !important;
}
#mvd-app *, #mvd-portal * {
  font-family: 'Poppins', sans-serif !important;
}
/* Aumentar fuentes clave */
#mvd-app .mvd-cta, #mvd-portal .mvd-cta {
  font-size: 14px !important;
  letter-spacing: 1.5px !important;
  height: 60px !important;
}
#mvd-app .mvd-tog-btn {
  font-size: 13px !important;
  letter-spacing: 1.5px !important;
  height: 54px !important;
}
#mvd-app .mvd-cur-btn {
  font-size: 13px !important;
  height: 44px !important;
}
#mvd-app .mvd-amount-wrap {
  padding: 30px 32px 22px !important;
}
#mvd-app .mvd-phone-wrap {
  padding: 24px 32px !important;
}
#mvd-app .mvd-success-title {
  font-size: 24px !important;
}
#mvd-app .mvd-greeting-name {
  font-size: 26px !important;
}
/* Desktop: max-width 672px with responsive padding */
@media (min-width: 700px) {
  .mvd-wrap {
    padding: 40px 32px 48px !important;
  }
  .mvd-amount-val {
    font-size: 72px !important;
  }
  .mvd-amount-sym {
    font-size: 44px !important;
  }
}
/* Mobile keeps original comfortable size */
@media (max-width: 699px) {
  .mvd-wrap {
    padding: 24px 16px 32px !important;
  }
}


/* ── Auth tabs SMS / Email ── */
.mvd-auth-tabs{display:flex;gap:6px;width:100%;margin-bottom:20px;background:#111;border-radius:14px;padding:5px}
.mvd-auth-tab{flex:1;height:42px;border:none;border-radius:10px;font-size:13px;font-family:'Poppins',sans-serif;font-weight:400;cursor:pointer;background:transparent;color:rgba(255,255,255,0.55);display:flex;align-items:center;justify-content:center;gap:7px;transition:all 0.2s;letter-spacing:0.3px}
.mvd-auth-tab:hover{color:rgba(255,255,255,0.65)}
.mvd-auth-tab-active{background:rgba(255,255,255,0.1)!important;color:#fff!important}

/* ── Auth tabs fix ── */
#mvd-app .mvd-auth-tabs {
  display: flex !important;
  gap: 6px !important;
  width: 100% !important;
  margin-bottom: 20px !important;
  background: #111 !important;
  border-radius: 16px !important;
  padding: 5px !important;
  box-sizing: border-box !important;
}
#mvd-app .mvd-auth-tab {
  flex: 1 !important;
  height: 48px !important;
  border: none !important;
  border-radius: 12px !important;
  font-size: 14px !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 400 !important;
  cursor: pointer !important;
  background: transparent !important;
  color: rgba(255,255,255,0.45) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  transition: all 0.2s !important;
  letter-spacing: 0.3px !important;
  box-shadow: none !important;
  outline: none !important;
  padding: 0 !important;
  margin: 0 !important;
  width: auto !important;
  min-width: 0 !important;
}
#mvd-app .mvd-auth-tab svg {
  flex-shrink: 0 !important;
  stroke: currentColor !important;
}
#mvd-app .mvd-auth-tab-active {
  background: rgba(255,255,255,0.12) !important;
  color: #ffffff !important;
}
#mvd-app .mvd-auth-tab:hover {
  color: rgba(255,255,255,0.75) !important;
}
#mvd-app .mvd-auth-tab:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* ── Fix summary text visibility ── */
#mvd-app .mvd-summary {
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(255,255,255,0.1) !important;
}
#mvd-app .mvd-sum-lbl {
  color: rgba(255,255,255,0.5) !important;
}
#mvd-app .mvd-sum-val {
  color: rgba(255,255,255,0.85) !important;
}
#mvd-app .mvd-sum-total .mvd-sum-val {
  color: #F0E4CC !important;
  font-size: 22px !important;
  font-weight: 300 !important;
}
#mvd-app .mvd-sum-row {
  border-bottom: 1px solid rgba(255,255,255,0.07) !important;
}

/* ── Email input field ── */
#mvd-app .mvd-email-field,
#mvd-portal .mvd-email-field {
  flex: 1 !important;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  font-size: 16px !important;
  font-weight: 300 !important;
  color: #2A2A2A !important;
  font-family: 'Poppins', sans-serif !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  height: auto !important;
  border-radius: 0 !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
#mvd-app .mvd-email-field::placeholder,
#mvd-portal .mvd-email-field::placeholder {
  color: rgba(42,42,42,0.38) !important;
}
/* Full width containers - only when visible */
#mvd-app #mvd-auth-sms:not(.mvd-hidden),
#mvd-app #mvd-auth-email:not(.mvd-hidden),
#mvd-portal #mvd-portal-auth-sms:not(.mvd-hidden),
#mvd-portal #mvd-portal-auth-email:not(.mvd-hidden) {
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}
/* Hidden always wins */
#mvd-app .mvd-hidden,
#mvd-portal .mvd-hidden {
  display: none !important;
}
#mvd-app #mvd-auth-sms .mvd-phone-wrap,
#mvd-app #mvd-auth-email .mvd-phone-wrap,
#mvd-app #mvd-auth-sms .mvd-cta,
#mvd-app #mvd-auth-email .mvd-cta,
#mvd-portal #mvd-portal-auth-sms .mvd-phone-wrap,
#mvd-portal #mvd-portal-auth-email .mvd-phone-wrap,
#mvd-portal #mvd-portal-auth-sms .mvd-cta,
#mvd-portal #mvd-portal-auth-email .mvd-cta {
  width: 100% !important;
}

/* ── Fix email autofill background ── */
#mvd-app .mvd-email-field,
#mvd-portal .mvd-email-field,
#mvd-app .mvd-email-field:-webkit-autofill,
#mvd-app .mvd-email-field:-webkit-autofill:hover,
#mvd-app .mvd-email-field:-webkit-autofill:focus,
#mvd-portal .mvd-email-field:-webkit-autofill,
#mvd-portal .mvd-email-field:-webkit-autofill:hover,
#mvd-portal .mvd-email-field:-webkit-autofill:focus {
  background: transparent !important;
  background-color: transparent !important;
  -webkit-box-shadow: 0 0 0px 1000px #C8C4BC inset !important;
  box-shadow: 0 0 0px 1000px #C8C4BC inset !important;
  -webkit-text-fill-color: #2A2A2A !important;
  border: none !important;
  outline: none !important;
}

/* ── Auth tabs: full width pero estilo tab ── */
#mvd-app .mvd-auth-tabs,
#mvd-portal .mvd-auth-tabs {
  width: 100% !important;
  display: flex !important;
  gap: 0 !important;
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(255,255,255,0.1) !important;
  border-radius: 14px !important;
  padding: 0 !important;
  overflow: hidden !important;
  margin-bottom: 20px !important;
}
#mvd-app .mvd-auth-tab,
#mvd-portal .mvd-auth-tab {
  flex: 1 !important;
  height: 46px !important;
  border: none !important;
  border-radius: 0 !important;
  font-size: 14px !important;
  color: rgba(255,255,255,0.45) !important;
  background: transparent !important;
  border-right: 1px solid rgba(255,255,255,0.08) !important;
  box-shadow: none !important;
}
#mvd-app .mvd-auth-tab:last-child,
#mvd-portal .mvd-auth-tab:last-child {
  border-right: none !important;
}
#mvd-app .mvd-auth-tab-active,
#mvd-portal .mvd-auth-tab-active {
  background: rgba(255,255,255,0.1) !important;
  color: #ffffff !important;
  font-weight: 500 !important;
}

/* ── Final autofill fix with correct bg color ── */
#mvd-app .mvd-email-field:-webkit-autofill,
#mvd-app .mvd-email-field:-webkit-autofill:hover,
#mvd-app .mvd-email-field:-webkit-autofill:focus,
#mvd-portal .mvd-email-field:-webkit-autofill,
#mvd-portal .mvd-email-field:-webkit-autofill:hover,
#mvd-portal .mvd-email-field:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0px 1000px #C8C4BC inset !important;
  box-shadow: 0 0 0px 1000px #C8C4BC inset !important;
  -webkit-text-fill-color: #2A2A2A !important;
}
/* Non-autofill state - match phone wrap background */
#mvd-app #mvd-email-wrap,
#mvd-app #mvd-portal-email-wrap {
  background: #C8C4BC !important;
}

/* ── Auth intro text ── */
.mvd-auth-intro {
  width: 100% !important;
  text-align: center !important;
  margin-bottom: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}
.mvd-auth-intro-title {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,0.80) !important;
  font-family: 'Poppins', sans-serif !important;
  line-height: 1.4 !important;
}
.mvd-auth-intro-sub {
  font-size: 12px !important;
  font-weight: 300 !important;
  color: rgba(255,255,255,0.38) !important;
  font-family: 'Poppins', sans-serif !important;
  line-height: 1.6 !important;
}

/* ── Portal charts ── */
.mvd-portal-chart-card{background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);border-radius:14px;padding:14px}
.mvd-portal-chart-title{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:rgba(255,255,255,0.55);margin-bottom:10px;font-family:'Poppins',sans-serif}
.mvd-portal-chart-legend{margin-top:10px;display:flex;flex-direction:column;gap:5px}
.mvd-p-leg-item{display:flex;align-items:center;gap:6px;font-size:11px;color:rgba(255,255,255,0.65);font-family:'Poppins',sans-serif}
.mvd-p-leg-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.mvd-p-leg-pct{margin-left:auto;color:rgba(255,255,255,0.45)}

/* ── PDF download button ── */
#mvd-portal a.mvd-history-pdf {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  color: #B89A6A !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  margin-top: 6px !important;
  padding: 5px 10px !important;
  border: 1px solid rgba(184,154,106,0.3) !important;
  border-radius: 8px !important;
  transition: all 0.2s !important;
}
#mvd-portal a.mvd-history-pdf:hover {
  background: rgba(184,154,106,0.1) !important;
  border-color: #B89A6A !important;
}

/* ── Cancel subscription button ── */
#mvd-portal .mvd-cancel-sub {
  background: rgba(239,68,68,0.12) !important;
  border: 1px solid rgba(239,68,68,0.3) !important;
  color: #ef4444 !important;
  border-radius: 10px !important;
  padding: 8px 14px !important;
  font-size: 12px !important;
  font-family: 'Poppins', sans-serif !important;
  cursor: pointer !important;
  margin-top: 8px !important;
  width: 100% !important;
  transition: all 0.2s !important;
}
#mvd-portal .mvd-cancel-sub:hover {
  background: rgba(239,68,68,0.2) !important;
}

/* ── New donation button ── */
#mvd-portal-new-donation {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* ── Auth intro mejorado ── */
#mvd-app .mvd-auth-intro,
#mvd-portal .mvd-auth-intro {
  width: 100% !important;
  text-align: center !important;
  margin-bottom: 18px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  padding: 16px 12px !important;
  background: rgba(255,255,255,0.04) !important;
  border-radius: 14px !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
}
.mvd-auth-intro-title {
  font-size: 16px !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,0.90) !important;
  font-family: 'Poppins', sans-serif !important;
  line-height: 1.3 !important;
}
.mvd-auth-intro-sub {
  font-size: 12px !important;
  font-weight: 300 !important;
  color: rgba(255,255,255,0.45) !important;
  font-family: 'Poppins', sans-serif !important;
  line-height: 1.6 !important;
}

/* ── Nota de seguridad bajo botón ── */
.mvd-auth-secure-note {
  text-align: center !important;
  font-size: 11px !important;
  color: rgba(255,255,255,0.28) !important;
  font-family: 'Poppins', sans-serif !important;
  margin-top: 8px !important;
  letter-spacing: 0.3px !important;
}

/* ── Portal access note (reemplaza footer) ── */
.mvd-portal-access-note {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  font-size: 12px !important;
  color: rgba(255,255,255,0.55) !important;
  font-family: 'Poppins', sans-serif !important;
  line-height: 1.7 !important;
  padding: 14px 16px !important;
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  border-radius: 12px !important;
  margin-bottom: 0 !important;
  margin-top: 28px !important;
  text-align: left !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* ── Separador antes del botón portal ── */
.mvd-divider-line {
  width: 100% !important;
  height: 1px !important;
  background: rgba(255,255,255,0.08) !important;
  margin: 24px 0 20px !important;
  position: relative !important;
}
.mvd-divider-line::before {
  content: 'o accede a tu historial' !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  background: var(--bg, #1C1C1C) !important;
  padding: 0 12px !important;
  font-size: 11px !important;
  color: rgba(255,255,255,0.25) !important;
  font-family: 'Poppins', sans-serif !important;
  white-space: nowrap !important;
}