/* BREKA_LOGIN_MODULAR_V1
   Capa visual para el ingreso. No modifica autenticacion ni APIs. */
body.login-premium.login-modular-v1{
  --login-primary:#5b5cf0;
  --login-primary-2:#7c3aed;
  --login-ink:#131827;
  --login-muted:#697386;
  --login-line:#e7e9f1;
  min-height:100dvh;
  background:
    radial-gradient(circle at 86% 4%,rgba(124,58,237,.13),transparent 28rem),
    radial-gradient(circle at 5% 78%,rgba(91,92,240,.10),transparent 25rem),
    #f7f8fc;
}
.login-modular-v1 .login-shell{background:transparent}
.login-modular-v1 .login-brand-panel{
  background:
    radial-gradient(circle at 86% 14%,rgba(124,58,237,.28),transparent 28rem),
    linear-gradient(150deg,#11162a 0%,#171a3b 48%,#22205a 100%);
}
.login-modular-v1 .login-brand-mark{
  background:linear-gradient(145deg,#5b5cf0,#7c3aed);
  box-shadow:0 14px 34px rgba(91,92,240,.32);
}
.login-modular-v1 .login-brand-group{color:#aaa8ff}
.login-modular-v1 .login-brand-copy h1{letter-spacing:-.05em}
.login-modular-v1 .login-eyebrow{
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.12);
  color:#dedcff;
}
.login-modular-v1 .login-eyebrow-dot{background:#7ee2ac}
.login-modular-v1 .login-form-panel{
  background:
    radial-gradient(circle at 80% 10%,rgba(124,58,237,.08),transparent 22rem),
    #fafafe;
}
.login-modular-v1 .login-card-inner{
  border:1px solid rgba(225,227,238,.95);
  background:rgba(255,255,255,.98);
  border-radius:28px;
  box-shadow:0 28px 70px rgba(33,38,76,.12);
}
.login-modular-v1 .login-card-header h2{
  color:var(--login-ink);
  letter-spacing:-.045em;
}
.login-modular-v1 .login-card-header p{color:var(--login-muted)}
.login-modular-v1 .login-field label{color:#374151}
.login-modular-v1 .login-input-wrap input{
  border:1px solid #e1e4ee;
  background:#fbfbfe;
  border-radius:16px;
}
.login-modular-v1 .login-input-wrap input:focus{
  border-color:#7778f3;
  box-shadow:0 0 0 4px rgba(91,92,240,.10);
}
.login-modular-v1 .login-input-icon{color:#9199aa}
.login-modular-v1 .login-submit{
  border-radius:16px;
  background:linear-gradient(135deg,#5b5cf0,#6d55e8 52%,#7c3aed);
  box-shadow:0 14px 30px rgba(91,92,240,.25);
}
.login-modular-v1 .login-google{
  border-radius:16px;
  border-color:#e1e4ee;
  box-shadow:none;
}
.login-modular-v1 .login-create a{color:#5b5cf0}
.login-modular-v1 .login-security{color:#9aa1b1}

/* Tarjeta de propuesta de valor en escritorio */
.login-modular-v1 .login-brand-copy p{color:#c0c3d3}
.login-modular-v1 .login-brand-footer{color:#898ea4}

/* Entrada movil alineada con Breka Apps */
@media(max-width:900px){
  body.login-premium.login-modular-v1{
    background:
      radial-gradient(circle at 88% 0%,rgba(124,58,237,.16),transparent 20rem),
      #f7f8fc;
  }
  .login-modular-v1 .login-form-panel{
    min-height:100dvh;
    padding:
      max(18px,env(safe-area-inset-top))
      14px
      max(100px,calc(86px + env(safe-area-inset-bottom)));
    background:
      radial-gradient(circle at 88% 2%,rgba(124,58,237,.22),transparent 17rem),
      linear-gradient(180deg,#171a3b 0,#171a3b 188px,#f7f8fc 188px,#f7f8fc 100%);
  }
  .login-modular-v1 .login-card{width:min(100%,520px)}
  .login-modular-v1 .login-mobile-brand{
    min-height:74px;
    margin:0 5px 16px;
    color:#fff;
  }
  .login-modular-v1 .login-mobile-brand .login-brand-mark{
    width:46px;height:46px;flex-basis:46px;border-radius:15px;font-size:21px;
  }
  .login-modular-v1 .login-mobile-brand .login-brand-name{
    font-size:21px;letter-spacing:.08em
  }
  .login-modular-v1 .login-mobile-brand .login-brand-group{color:#aaa8ff}
  .login-modular-v1 .login-mobile-brand .login-brand-platform{
    color:#c4c7d6!important;
  }
  .login-modular-v1 .login-card-inner{
    padding:28px 22px 23px;
    border-radius:28px;
    box-shadow:0 24px 60px rgba(28,32,66,.16);
  }
  .login-modular-v1 .login-card-header{
    margin-bottom:22px;
  }
  .login-modular-v1 .login-card-header h2{
    font-size:31px;
  }
  .login-modular-v1 .login-card-header p{
    margin-top:9px;
    font-size:14px;
    line-height:1.5;
  }
  .login-modular-v1 .login-form{gap:15px}
  .login-modular-v1 .login-input-wrap input{
    min-height:56px;
    font-size:16px;
  }
  .login-modular-v1 .login-submit{
    min-height:56px;
    margin-top:2px;
  }
  .login-modular-v1 .login-auth-divider{margin:16px 0 12px}
  .login-modular-v1 .login-google{min-height:54px}
  .login-modular-v1 .login-create{margin-top:15px}
  .login-modular-v1 .login-security{margin-top:14px}
}
@media(max-width:420px){
  .login-modular-v1 .login-form-panel{
    padding-left:12px;
    padding-right:12px;
    background:
      radial-gradient(circle at 88% 2%,rgba(124,58,237,.22),transparent 16rem),
      linear-gradient(180deg,#171a3b 0,#171a3b 176px,#f7f8fc 176px,#f7f8fc 100%);
  }
  .login-modular-v1 .login-card-inner{padding:25px 19px 21px;border-radius:25px}
  .login-modular-v1 .login-card-header h2{font-size:29px}
}

/* Alternative sign-ins share the existing row; keep the local form in place. */
.login-modular-v1 .login-provider-options{display:flex;gap:12px;align-items:stretch;margin-top:16px}
.login-modular-v1 .login-provider-options .login-google{flex:1;min-width:0;width:auto;margin:0;display:flex;align-items:center;justify-content:center;gap:8px;text-align:center;text-decoration:none;padding:12px;font-size:14px;line-height:1.3}
.login-modular-v1 .login-provider-options .login-google[hidden]{display:none}
.login-modular-v1 .login-breka-one{color:#5b5cf0;border-color:#c8c7ff;background:#f7f7ff}
.login-modular-v1 .login-breka-one:focus-visible{outline:3px solid #7778f3;outline-offset:3px}
.login-modular-v1 .login-central-hint{display:block;margin-top:8px;color:#5b5cf0;font-weight:600}

/* Consistent card gutters on desktop and mobile. */
.login-modular-v1 .login-card-inner{box-sizing:border-box;padding:28px 30px 24px}
.login-modular-v1 .login-card-header{margin-bottom:24px}
.login-modular-v1 .login-card-header h2{font-size:32px;line-height:1.15}
.login-modular-v1 .login-card-header p{font-size:14px;line-height:1.5}
.login-modular-v1 .login-form{gap:18px}
.login-modular-v1 .login-provider-options .login-google{font-size:13px;min-height:52px}
.login-modular-v1 .login-create{line-height:1.5}
.login-modular-v1 .login-security{line-height:1.5}
@media(max-width:900px){
 .login-modular-v1 .login-card-inner{padding:26px 22px 22px}
 .login-modular-v1 .login-card-header h2{font-size:29px}
 .login-modular-v1 .login-form{gap:15px}
}
@media(max-width:420px){
 .login-modular-v1 .login-card-inner{padding:24px 20px 20px}
 .login-modular-v1 .login-provider-options{gap:8px}
 .login-modular-v1 .login-provider-options .login-google{padding:10px 8px;font-size:12px}
}