/* GCF Mi Cuenta */
.gcf-mc { max-width:680px }
.gcf-mc__title { font-size:22px; font-weight:700; color:#1e293b; margin:0 0 20px }
.gcf-mc__subtitle { font-size:16px; font-weight:700; color:#1e293b; margin:24px 0 12px }
.gcf-mc__breadcrumb { margin-bottom:16px; font-size:14px }
.gcf-mc__breadcrumb a { color:#2563eb; text-decoration:none }
.gcf-mc__desc { font-size:15px; color:#374151; margin-bottom:20px }
.gcf-mc__empty { color:#64748b; font-size:15px }

/* Grid de tarjetas */
.gcf-mc__grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:16px }
.gcf-mc__card { background:#fff; border:1px solid #e2e8f0; border-radius:10px; overflow:hidden; box-shadow:0 1px 4px rgba(0,0,0,.06); transition:box-shadow .2s }
.gcf-mc__card:hover { box-shadow:0 4px 12px rgba(0,0,0,.1) }
.gcf-mc__card-header { display:flex; justify-content:space-between; align-items:flex-start; padding:14px 16px; background:#f8fafc; border-bottom:1px solid #e2e8f0; gap:8px }
.gcf-mc__producto { font-weight:600; font-size:14px; color:#1e293b; line-height:1.3 }
.gcf-mc__card-body { padding:14px 16px }
.gcf-mc__card-footer { padding:12px 16px; border-top:1px solid #f1f5f9; display:flex; gap:8px; flex-wrap:wrap }

/* Estado badges */
.gcf-mc__estado { font-size:12px; font-weight:600; padding:3px 8px; border-radius:20px; white-space:nowrap; flex-shrink:0 }
.gcf-mc__estado--activo    { background:#dcfce7; color:#16a34a }
.gcf-mc__estado--pendiente { background:#fef9c3; color:#854d0e }
.gcf-mc__estado--completado{ background:#dbeafe; color:#1d4ed8 }
.gcf-mc__estado--cancelado { background:#fee2e2; color:#dc2626 }

/* Stats */
.gcf-mc__summary { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:12px; margin-bottom:20px; background:#f8fafc; border:1px solid #e2e8f0; border-radius:8px; padding:16px }
.gcf-mc__stat { display:flex; flex-direction:column; gap:2px }
.gcf-mc__stat span { font-size:11px; color:#64748b; text-transform:uppercase; letter-spacing:.4px }
.gcf-mc__stat strong { font-size:14px; color:#1e293b }
.gcf-mc__proxima { grid-column:1/-1; margin-top:4px; padding-top:10px; border-top:1px solid #e2e8f0 }

/* Progress bar */
.gcf-mc__progress { height:6px; background:#e2e8f0; border-radius:3px; margin:8px 0; overflow:hidden }
.gcf-mc__progress-bar { height:100%; background:#2563eb; border-radius:3px; transition:width .4s }

/* Acciones */
.gcf-mc__actions { margin-bottom:16px; display:flex; gap:10px; flex-wrap:wrap }

/* Botones */
.gcf-mc__btn { display:inline-block; padding:8px 16px; border-radius:6px; font-size:14px; font-weight:600; cursor:pointer; text-decoration:none; border:none; transition:all .2s; text-align:center }
.gcf-mc__btn--primary  { background:#2563eb; color:#fff }
.gcf-mc__btn--primary:hover  { background:#1d4ed8; color:#fff }
.gcf-mc__btn--secondary{ background:#f1f5f9; color:#1e293b }
.gcf-mc__btn--secondary:hover{ background:#e2e8f0; color:#1e293b }
.gcf-mc__btn--outline  { background:transparent; color:#2563eb; border:1.5px solid #2563eb }
.gcf-mc__btn--outline:hover  { background:#dbeafe; color:#1d4ed8 }
.gcf-mc__btn--sm { padding:5px 10px; font-size:12px }
.gcf-mc__btn--full { width:100%; margin-top:16px; padding:12px }
.gcf-mc__btn:disabled { opacity:.55; cursor:not-allowed }

/* Cuotas */
.gcf-mc__cuotas { display:flex; flex-direction:column; gap:8px }
.gcf-mc__cuota { display:flex; align-items:center; gap:12px; background:#f8fafc; border:1px solid #e2e8f0; border-radius:8px; padding:12px 16px }
.gcf-mc__cuota--pagada  { background:#f0fdf4; border-color:#bbf7d0 }
.gcf-mc__cuota--fallida { background:#fff1f2; border-color:#fecdd3 }
.gcf-mc__cuota--manual  { background:#f5f3ff; border-color:#ddd6fe }
.gcf-mc__cuota-num { font-size:12px; font-weight:700; color:#64748b; width:36px; flex-shrink:0; text-align:center }
.gcf-mc__cuota-info { flex:1; min-width:0 }
.gcf-mc__cuota-fecha { font-size:13px; color:#374151 }
.gcf-mc__cuota-importe { font-size:15px; font-weight:700; color:#1e293b; margin-top:2px }

/* Form tarjeta */
.gcf-mc__card-form { max-width:460px }
.gcf-mc__card-form label { display:block; font-size:13px; font-weight:600; color:#374151; margin-bottom:8px }
#gcf-card-el { background:#f8fafc; border:2px solid #e2e8f0; border-radius:8px; padding:14px 16px }
#gcf-card-el.StripeElement--focus { border-color:#3b82f6 }
#gcf-card-err { color:#dc2626; font-size:13px; margin-top:8px; min-height:18px }
.gcf-mc__secure { display:flex; align-items:center; gap:6px; font-size:12px; color:#94a3b8; margin-top:12px }

/* Success */
.gcf-mc__success { text-align:center; padding:32px 0 }
.gcf-mc__success-icon { font-size:52px; margin-bottom:12px }
.gcf-mc__success h3 { font-size:20px; color:#16a34a; margin-bottom:8px }
.gcf-mc__success p { color:#374151; font-size:14px }

/* Modal */
.gcf-mc__overlay { position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:9998 }
.gcf-mc__modal { position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); z-index:9999; background:#fff; border-radius:12px; padding:28px; max-width:400px; width:90%; box-shadow:0 8px 40px rgba(0,0,0,.18) }
.gcf-mc__modal h3 { font-size:18px; font-weight:700; margin-bottom:12px; color:#1e293b }
.gcf-mc__modal p { font-size:14px; color:#374151 }
.gcf-mc__modal-actions { display:flex; gap:10px; margin-top:20px }

@media(max-width:500px){
    .gcf-mc__grid { grid-template-columns:1fr }
    .gcf-mc__summary { grid-template-columns:1fr 1fr }
    .gcf-mc__cuota { flex-wrap:wrap }
}
