/* ============================================================
   EDR CRM — Login (redesenho "operação / construção civil")
   Exclusivo da tela de login (index.html). Não afeta telas internas.
   ============================================================ */
:root{
  --lg-ink:#17352a; --lg-green:#164b37; --lg-paper:#f7f6ef; --lg-card:#fffefa;
  --lg-orange:#e86d1c; --lg-lime:#c9e86a; --lg-line:#dce2d8; --lg-muted:#718176;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:'Plus Jakarta Sans',system-ui,sans-serif;color:var(--lg-ink);background:var(--lg-ink)}

.lg-wrap{display:grid;grid-template-columns:1fr 1fr;min-height:100vh}

/* ===== LADO CLARO (marca) ===== */
.lg-brand{background:var(--lg-paper);padding:56px 60px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.lg-topo{position:absolute;inset:0;opacity:.55;pointer-events:none}
.lg-cross{position:absolute;color:var(--lg-orange);opacity:.55;font-family:'DM Mono',monospace;font-size:26px;line-height:1;user-select:none}
.lg-logo{width:112px;height:112px;color:var(--lg-green);margin-bottom:16px;position:relative;z-index:2}
.lg-logo svg{display:block;width:100%;height:100%}
.lg-brandname{font:600 13px 'Plus Jakarta Sans',sans-serif;letter-spacing:.28em;color:var(--lg-ink);position:relative;z-index:2;margin-bottom:54px}
.lg-headline{font-family:'Fraunces',serif;font-weight:600;font-size:clamp(38px,4.4vw,60px);line-height:1.04;letter-spacing:-.015em;color:var(--lg-ink);position:relative;z-index:2;margin:0}
.lg-headline i{font-style:italic;font-weight:500}
.lg-subtext{margin:22px 0 0;font-size:15px;line-height:1.6;color:var(--lg-muted);max-width:400px;position:relative;z-index:2}

/* ===== LADO ESCURO (form) ===== */
.lg-form-side{background:var(--lg-ink);color:#eef4ec;padding:56px 60px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.lg-waves{position:absolute;inset:0;opacity:.14;pointer-events:none}
.lg-form-inner{width:100%;max-width:420px;position:relative;z-index:2}
.lg-title{font-family:'Fraunces',serif;font-weight:500;font-size:clamp(30px,3.4vw,44px);letter-spacing:-.01em;color:#fff;margin:0 0 36px}
.lg-field{margin-bottom:22px}
.lg-field label{display:block;font-size:13px;font-weight:600;color:#cfe0d3;margin-bottom:9px}
.lg-input-wrap{position:relative;display:flex;align-items:center}
.lg-input-wrap .lg-ico{position:absolute;left:16px;color:#8fae98;width:18px;height:18px;pointer-events:none}
.lg-input-wrap input{width:100%;height:56px;padding:0 48px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.16);color:#fff;font:15px 'Plus Jakarta Sans',sans-serif;outline:none;transition:border-color .15s,background .15s}
.lg-input-wrap input::placeholder{color:#6f8a78}
.lg-input-wrap input:focus{border-color:var(--lg-lime);background:rgba(255,255,255,.06)}
.lg-eye{position:absolute;right:14px;background:none;border:none;color:#8fae98;cursor:pointer;width:22px;height:22px;display:grid;place-items:center}
.lg-eye:hover{color:#cfe0d3}
.lg-btn{width:100%;height:56px;margin-top:10px;border:none;border-radius:12px;cursor:pointer;background:var(--lg-lime);color:#16311f;font:700 16px 'Plus Jakarta Sans',sans-serif;letter-spacing:.01em;transition:filter .15s,transform .1s}
.lg-btn:hover{filter:brightness(1.05)}
.lg-btn:active{transform:translateY(1px)}
.lg-btn:disabled{opacity:.6;cursor:wait}
.lg-erro{background:rgba(217,71,61,.15);border:1px solid rgba(217,71,61,.4);color:#f4b8b3;border-radius:10px;padding:11px 14px;font-size:13px;margin-bottom:18px}
.lg-erro.hidden{display:none}
.lg-foot{margin-top:20px;display:flex;align-items:center;gap:8px;font-size:13px;color:#8fae98}
.lg-foot .lg-lock{width:15px;height:15px}
.lg-status{position:absolute;left:60px;bottom:40px;display:flex;align-items:center;gap:9px;font-size:13px;color:#8fae98;z-index:2}
.lg-status .lg-dot{width:9px;height:9px;border-radius:50%;background:var(--lg-lime)}

/* loading overlay */
#loading{position:fixed;inset:0;background:rgba(23,53,42,.6);display:flex;align-items:center;justify-content:center;z-index:50}
#loading.hidden{display:none}
.spinner{width:38px;height:38px;border:3px solid rgba(255,255,255,.25);border-top-color:var(--lg-lime);border-radius:50%;animation:lg-spin .7s linear infinite}
@keyframes lg-spin{to{transform:rotate(360deg)}}

@media(max-width:880px){
  .lg-wrap{grid-template-columns:1fr}
  .lg-brand{padding:44px 30px 30px}
  .lg-brandname{margin-bottom:26px}
  .lg-form-side{padding:40px 30px 80px}
  .lg-status{left:30px;bottom:26px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
