/* =====================================================================
   5 Minutos + · estilos de cuentas, planes Free/Pro y pagos
   Pro = US$15 por 6 meses · pago manual aprobado por administrador
   ===================================================================== */
.topbar-actions{display:flex;align-items:center;gap:10px}
.plan-badge{display:inline-block;border-radius:999px;padding:6px 12px;font:700 11px 'DM Sans',sans-serif;letter-spacing:1px}
.plan-badge.free{background:#efe7ea;color:#7a6670;border:1px solid #e2d5da}
.plan-badge.pro{background:linear-gradient(120deg,#f6bb35,#d84f7b);color:#fff;border:1px solid #fff;box-shadow:0 2px 0 #ead9e6}

/* ---- Puerta de acceso ---- */
.auth-gate{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:22px;background:linear-gradient(135deg,#FFF9EF,#F9E8E8 52%,#CFE3D4);overflow:auto}
.gate-card{width:100%;max-width:440px;background:#fffaf5;border:1px solid #eadfe6;border-radius:24px;padding:30px 26px;box-shadow:0 18px 50px #88728b22;text-align:center}
.gate-brand{display:flex;justify-content:center;margin-bottom:12px}
.gate-card h1{font:600 38px 'Playfair Display',serif;color:#6f6173;margin:6px 0 8px}
.gate-card h1 em{font-style:normal;color:#b77fa1}
.gate-lead{font-size:14px;color:#62545a;line-height:1.7;margin:0 0 16px}
.gate-tabs{display:flex;gap:8px;background:#f3ecef;border-radius:12px;padding:5px;margin:14px 0}
.gate-tab{flex:1;border:0;background:transparent;border-radius:9px;padding:10px;font:700 13px 'DM Sans',sans-serif;color:#7a6670;cursor:pointer}
.gate-tab.active{background:#fff;color:#8e4261;box-shadow:0 2px 6px #88728b18}
.auth-form{max-width:none;text-align:left}
.auth-status{padding:12px 14px;margin:14px 0;border-radius:12px;background:#fff;border:1px solid var(--line);font-size:13px;color:#51434a;overflow-wrap:anywhere;text-align:left}

/* ---- Bloqueo Pro ---- */
.pro-gated{position:relative}
.pro-gated.locked > *:not(.pro-lock){filter:blur(3px);pointer-events:none;user-select:none}
.pro-lock{display:none}
.pro-gated.locked .pro-lock{display:grid;place-items:center;position:absolute;inset:0;z-index:5;padding:20px}
.pro-lock-card{max-width:400px;text-align:center;background:#fffaf5;border:1px solid #eadfe6;border-radius:20px;padding:26px 22px;box-shadow:0 16px 40px #88728b22}
.pro-lock-card h3{font:600 24px 'Playfair Display',serif;color:#6f6173;margin:12px 0 8px}
.pro-lock-card p{font-size:13px;color:#62545a;line-height:1.7;margin:0 0 14px}

/* ---- Cuenta ---- */
.account-section{max-width:720px;margin:30px 0;padding:22px 18px;border:1px solid #eadfe6;border-radius:20px;background:#fffaf5}
.account-section h2{font:600 25px 'Playfair Display',serif;margin:5px 0 14px}
.account-row{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.account-row strong{font-size:15px;color:#49303d;overflow-wrap:anywhere}
.account-plan-text{font-size:13px;color:#62545a;margin:4px 0 0}
.account-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.account-actions button{margin-top:0;flex:1;min-width:150px}

/* ---- Upgrade ---- */
.upgrade-section{max-width:820px;margin:30px 0;padding:24px 20px;border:1px solid #eadfe6;border-radius:22px;background:linear-gradient(135deg,#FFF9EF,#F9E8E8 58%,#CFE3D4)}
.upgrade-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.upgrade-head h2{font:600 30px 'Playfair Display',serif;margin:5px 0 6px;color:#6f6173}
.upgrade-sub{font-size:13px;color:#62545a;line-height:1.7;max-width:420px;margin:0}
.price-block{text-align:right;background:#fff;border:1px solid #eadfe6;border-radius:16px;padding:12px 18px;box-shadow:0 4px 0 #eadfe6}
.price-amount{display:block;font:700 34px 'Playfair Display',serif;color:#a94370;line-height:1}
.price-period{font-size:12px;color:#7a6670;font-weight:700}
.plan-compare{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:20px 0}
.plan-col{background:#fff;border:1px solid #eadfe6;border-radius:16px;padding:18px}
.plan-col h3{font:600 20px 'Playfair Display',serif;margin:0 0 10px;color:#6f6173}
.plan-col ul{margin:0;padding-left:18px}
.plan-col li{font-size:13px;color:#51434a;line-height:1.9}
.pro-col{border-color:#d8cbe8;box-shadow:0 4px 0 #e6ddf1}
.upgrade-active{background:#fff;border:1px solid #cfe3d4;border-radius:16px;padding:18px;margin:16px 0}
.upgrade-active strong{font-size:16px;color:#3f7a56}
.upgrade-active p{font-size:13px;color:#62545a;margin:6px 0 0}

/* ---- Métodos de pago ---- */
.pay-methods{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:16px 0}
.pay-method{display:flex;flex-direction:column;gap:3px;align-items:flex-start;background:#fff;border:1px solid #eadfe6;border-radius:14px;padding:12px;cursor:pointer;text-align:left}
.pay-method span{font:700 13px 'DM Sans',sans-serif;color:#49303d}
.pay-method small{font-size:11px;color:#7a6670}
.pay-method.active{border-color:#b77fa1;box-shadow:0 0 0 2px #d8cbe8 inset;background:#fff6f9}
.pay-instructions{background:#fff;border:1px solid #eadfe6;border-left:4px solid #b77fa1;border-radius:0 14px 14px 0;padding:16px 18px;margin-bottom:16px}
.pay-instructions strong{font-size:15px;color:#8e4261}
.pay-instructions p{font-size:13px;color:#51434a;line-height:1.7;margin:6px 0 0}
.pay-instructions .pay-detail{font-weight:700;color:#49303d;background:#f7f0f2;border-radius:9px;padding:8px 10px;overflow-wrap:anywhere}
.pay-link{display:inline-block;margin-top:10px;text-decoration:none;text-align:center}

/* ---- Solicitudes ---- */
.my-payments{display:grid;gap:10px;max-width:700px}
.payment-item{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;background:#fff;border:1px solid #eadfe6;border-radius:14px;padding:14px 16px}
.payment-item h4{font:600 16px 'Playfair Display',serif;margin:4px 0;color:#49303d}
.payment-item p{font-size:12px;color:#62545a;margin:2px 0;overflow-wrap:anywhere}
.payment-item small{font-size:11px;color:#897f84}
.payment-method{font:700 10px 'DM Sans',sans-serif;letter-spacing:1px;text-transform:uppercase;color:#b77fa1}
.review-note{color:#8e4261!important}
.payment-status{align-self:center;flex:0 0 auto;border-radius:999px;padding:6px 12px;font:700 11px 'DM Sans',sans-serif}
.payment-status.pending{background:#fdf3dd;color:#8a6d1f}
.payment-status.approved{background:#e4f3e8;color:#2f7a4c}
.payment-status.rejected{background:#fbe4e6;color:#a33b46}

@media(max-width:640px){
  .plan-compare{grid-template-columns:1fr}
  .pay-methods{grid-template-columns:repeat(2,minmax(0,1fr))}
  .price-block{text-align:left}
  .gate-card{padding:24px 18px}
}
