@charset "utf-8";
/* Login rediseñado — Design System Sojotrims (ver crm-rediseno/CAMBIOS.md 4s).
   Todo cuelga de .lg para no chocar con los estilos antiguos (bootstrap, estilos.css). */

body.is-login{margin:0!important;padding:0!important;background:#eaf2ff!important;overflow-x:hidden}
body.is-login br{display:none}
body.is-login #detArticuloDiv,body.is-login #divCrearDoc{display:none}

.lg{--blue-50:#eef4ff;--blue-100:#dbe8ff;--blue-500:#0d6efd;--blue-600:#0b5ed7;--ink:#141b27;--ink-2:#4a5568;--ink-3:#8590a3;--line:#e8ebf2;--line-strong:#d6dbe6;--bad:#d6303a;--px:0px;--py:0px;
 font-family:'DM Sans',system-ui,sans-serif;font-size:13.5px;color:var(--ink);letter-spacing:-.005em;-webkit-font-smoothing:antialiased;
 position:relative;min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:24px 16px;overflow:hidden;box-sizing:border-box;
 background:linear-gradient(135deg,#eaf2ff 0%,#f4f8ff 45%,#dce9ff 100%)}
.lg *,.lg *::before,.lg *::after{box-sizing:border-box}

.lg-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.lg-o{position:absolute;border-radius:50%;filter:blur(54px);opacity:.6;will-change:transform;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.lg-o1{width:46vmax;height:46vmax;left:-12vmax;top:-14vmax;background:radial-gradient(circle,#0d6efd 0%,rgba(13,110,253,0) 68%);animation:lgm1 23s ease-in-out infinite,lgb1 11s ease-in-out infinite;transform:translate(calc(var(--px)*1.4),calc(var(--py)*1.4))}
.lg-o2{width:40vmax;height:40vmax;right:-10vmax;bottom:-16vmax;background:radial-gradient(circle,#4d94ff 0%,rgba(77,148,255,0) 68%);animation:lgm2 27s ease-in-out infinite,lgb2 13s ease-in-out infinite;transform:translate(calc(var(--px)*-1.2),calc(var(--py)*-1.2))}
.lg-o3{width:30vmax;height:30vmax;right:8vmax;top:-10vmax;background:radial-gradient(circle,#9cc4ff 0%,rgba(156,196,255,0) 68%);animation:lgm3 19s ease-in-out infinite,lgb1 9s ease-in-out infinite reverse;opacity:.7}
.lg-o4{width:28vmax;height:28vmax;left:6vmax;bottom:-12vmax;background:radial-gradient(circle,#0a4fb4 0%,rgba(10,79,180,0) 68%);animation:lgm4 25s ease-in-out infinite,lgb2 12s ease-in-out infinite reverse;opacity:.32}
/* orbes fluidos: recorren la pantalla (translate), se deforman como gotas (border-radius) y respiran (scale) */
@keyframes lgm1{0%{translate:0 0;scale:1}20%{translate:26vmax 8vmax;scale:1.12}45%{translate:38vmax 30vmax;scale:.9}70%{translate:10vmax 36vmax;scale:1.15}100%{translate:0 0;scale:1}}
@keyframes lgm2{0%{translate:0 0;scale:1}25%{translate:-30vmax -12vmax;scale:1.15}50%{translate:-16vmax -34vmax;scale:.92}75%{translate:-40vmax -8vmax;scale:1.1}100%{translate:0 0;scale:1}}
@keyframes lgm3{0%{translate:0 0;scale:1}33%{translate:-34vmax 24vmax;scale:1.2}66%{translate:-12vmax 38vmax;scale:.88}100%{translate:0 0;scale:1}}
@keyframes lgm4{0%{translate:0 0;scale:1}30%{translate:34vmax -22vmax;scale:1.15}60%{translate:52vmax -6vmax;scale:.9}100%{translate:0 0;scale:1}}
@keyframes lgb1{0%,100%{border-radius:50% 50% 50% 50%/50% 50% 50% 50%}25%{border-radius:62% 38% 46% 54%/46% 60% 40% 54%}50%{border-radius:40% 60% 58% 42%/58% 42% 60% 40%}75%{border-radius:55% 45% 38% 62%/40% 56% 44% 60%}}
@keyframes lgb2{0%,100%{border-radius:46% 54% 60% 40%/56% 40% 60% 44%}33%{border-radius:60% 40% 42% 58%/44% 58% 42% 56%}66%{border-radius:38% 62% 54% 46%/60% 44% 56% 40%}}
.lg-grid{position:absolute;inset:-60px;background-image:radial-gradient(rgba(13,110,253,.22) 1.2px,transparent 1.4px);background-size:34px 34px;-webkit-mask-image:radial-gradient(ellipse at center,#000 0%,transparent 72%);mask-image:radial-gradient(ellipse at center,#000 0%,transparent 72%);animation:lggrid 30s linear infinite;transform:translate(calc(var(--px)*.5),calc(var(--py)*.5))}
@keyframes lggrid{to{background-position:34px 34px}}

.lg .lg-card{position:relative;z-index:2;width:min(400px,100%);margin:0;background:rgba(255,255,255,.86);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.95);border-radius:8px;box-shadow:0 30px 80px rgba(13,60,160,.22),0 2px 0 rgba(255,255,255,.8) inset;padding:30px 30px 26px;display:grid;gap:16px;animation:lgpop .8s cubic-bezier(.34,1.56,.64,1) both}
@keyframes lgpop{0%{opacity:0;transform:translateY(46px) scale(.82)}60%{opacity:1}100%{opacity:1;transform:none}}
.lg .lg-logo{display:block;height:36px;background:url(imagenes/logoSojotrims_rd.png) left center/auto 100% no-repeat;animation:lgdrop .7s .25s cubic-bezier(.34,1.56,.64,1) both}
@keyframes lgdrop{0%{opacity:0;transform:translateY(-18px)}100%{opacity:1;transform:none}}
.lg .lg-hi{margin:6px 0 4px;animation:lgup .5s .4s both}
.lg .lg-hi h1{font-family:inherit;font-size:24px;font-weight:700;letter-spacing:-.025em;line-height:1.1;margin:0;color:var(--ink);padding:0;border:0}
.lg .lg-hi p{color:var(--ink-2);font-size:13px;margin:2px 0 0}
.lg .lg-f{display:flex;flex-direction:column;gap:6px;animation:lgup .5s both}
.lg .lg-f:nth-of-type(1){animation-delay:.5s}.lg .lg-f:nth-of-type(2){animation-delay:.58s}
.lg .lg-f label{font-size:12px;font-weight:600;color:var(--ink-2);margin:0;padding:0;line-height:1.3;text-align:left;width:auto}
.lg .lg-act{display:flex;justify-content:flex-end;animation:lgup .5s .68s both}
@keyframes lgup{0%{opacity:0;transform:translateY(14px)}100%{opacity:1;transform:none}}

.lg .lg-in{position:relative}
.lg .lg-in>i{position:absolute;left:13px;top:50%;transform:translateY(-50%);font-size:18px;color:var(--ink-3);pointer-events:none;transition:.15s}
.lg .lg-in input{display:block;width:100%;height:44px;margin:0;padding:0 42px 0 40px;font:inherit;font-size:14px;color:var(--ink);background:#fff;border:1px solid var(--line-strong);border-radius:8px;outline:0;box-shadow:none;transition:border-color .15s,box-shadow .15s}
.lg .lg-in input::placeholder{color:var(--ink-3)}
.lg .lg-in input:focus{border-color:var(--blue-500);box-shadow:0 0 0 4px var(--blue-100)}
.lg .lg-in:focus-within>i{color:var(--blue-500)}
.lg .lg-eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:34px;height:34px;padding:0;border:0;background:none;border-radius:6px;cursor:pointer;color:var(--ink-3);display:grid;place-items:center;font-size:18px}
.lg .lg-eye i{position:static;transform:none;color:inherit;font-size:18px;pointer-events:none}
.lg .lg-eye:hover{background:var(--blue-50);color:var(--blue-500)}
.lg .lg-err{color:var(--bad);font-size:12.5px;font-weight:600;margin:-6px 0 -4px;max-height:0;opacity:0;overflow:hidden;transition:.2s}
.lg .lg-err.show{max-height:44px;opacity:1}

.lg .lg-go{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;min-width:140px;padding:0 24px;border:0;border-radius:8px;cursor:pointer;font:inherit;font-weight:600;font-size:14px;color:#fff;background:linear-gradient(135deg,#0d6efd 0%,#3a8bff 55%,#7d8dff 100%);box-shadow:0 6px 16px rgba(13,110,253,.28);transition:filter .14s,box-shadow .14s,transform .14s}
.lg .lg-go:hover{filter:brightness(1.07);box-shadow:0 8px 20px rgba(13,110,253,.36);transform:translateY(-1px)}
.lg .lg-go:active{transform:translateY(1px)}
.lg .lg-go i{font-size:17px}
.lg .lg-go .lg-ar{transition:transform .18s}.lg .lg-go:hover .lg-ar{transform:translateX(4px)}
.lg .lg-go .lg-sp,.lg .lg-go .lg-ok{position:absolute;font-size:22px;opacity:0;transform:scale(.4)}
.lg .lg-go.busy .lg-t,.lg .lg-go.busy .lg-ar,.lg .lg-go.done .lg-t,.lg .lg-go.done .lg-ar{opacity:0}
.lg .lg-go.busy .lg-sp{opacity:1;transform:none;animation:lgspin .7s linear infinite}
.lg .lg-go.done .lg-ok{opacity:1;transform:scale(1);transition:transform .35s cubic-bezier(.34,2.2,.64,1),opacity .15s}
@keyframes lgspin{to{transform:rotate(360deg)}}

.lg .lg-card.bad{animation:lgshake .45s}
@keyframes lgshake{0%,100%{transform:none}20%{transform:translateX(-10px)}40%{transform:translateX(9px)}60%{transform:translateX(-6px)}80%{transform:translateX(4px)}}
.lg.out .lg-card{animation:lgout .62s cubic-bezier(.5,-.3,.7,.2) forwards}
@keyframes lgout{0%{transform:scale(1)}25%{transform:scale(.94)}100%{transform:scale(1.35);opacity:0;filter:blur(6px)}}
.lg.out .lg-bg{animation:lgflash .8s ease-out}
@keyframes lgflash{0%{filter:none}30%{filter:brightness(1.25) saturate(1.3)}100%{filter:none}}
.lg .lg-foot{position:absolute;bottom:16px;left:0;right:0;text-align:center;color:var(--ink-3);font-size:12px;z-index:2}
.lg-cf{position:fixed;z-index:3000;pointer-events:none}
.lg-ring{position:fixed;z-index:2999;width:20px;height:20px;margin:-10px 0 0 -10px;border:3px solid #0d6efd;border-radius:50%;pointer-events:none;animation:lgring2 .8s ease-out forwards}
@keyframes lgring2{to{transform:scale(22);opacity:0;border-width:1px}}
@media(max-width:700px){.lg .lg-card{padding:24px 20px 20px}.lg .lg-hi h1{font-size:22px}}
@media(prefers-reduced-motion:reduce){.lg-grid,.lg .lg-card,.lg .lg-logo,.lg .lg-hi,.lg .lg-f,.lg .lg-act{animation:none!important}}

/* css/helpers.css:30 pone background:#000!important al pasar por cualquier button: se anula en el login */
.lg .lg-go:not(.fake-select):hover{background:linear-gradient(135deg,#0d6efd 0%,#3a8bff 55%,#7d8dff 100%)!important;border-color:transparent!important}
.lg .lg-eye:not(.fake-select):hover{background:#eef4ff!important;border-color:transparent!important}