/* ============================================================
   Design System v3 — telas de autenticação (login / senha).
   Escopado em .ds3 — replica o kit do design-system/ standalone
   sem tocar no Dashmix/Bootstrap do resto do ERP.
   Estático em public/css (não passa pelo Vite): editar = hard refresh.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');

.ds3 {
  /* tokens base (espelham --ds-* do design-system) */
  --bg-page:#faf9f5; --bg-surface:#fff; --bg-inset:#f0eee6;
  --text-1:#1a1816; --text-2:#3d3d3a; --text-3:#5e5d59; --text-muted:#87867f;
  --border-soft:#e8e6dc; --border-default:#d1cfc5; --border-strong:#b0aea5;
  --accent-link:#438f88; --accent-soft:#f0f7f6;
  --critical-bg:#fef2f2; --critical-fg:#991b1b; --critical-border:#fecaca; --critical-dot:#dc2626;
  --success-bg:#f0fdf4; --success-fg:#166534; --success-border:#bbf7d0; --success-dot:#16a34a;
  --radius-sm:6px; --radius-md:8px; --radius-lg:14px; --radius-pill:999px;
  --shadow-card:0 1px 2px rgba(26,24,22,.04), 0 12px 32px -12px rgba(26,24,22,.14);
  --focus-ring:rgba(26,24,22,.08);
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;
  --fs-h2:24px;--fs-h3:18px;--fs-lead:16px;--fs-body:14px;--fs-meta:13px;--fs-label:11px;--fs-small:12px;
  --tracking-wide:.05em;--tracking-snug:-.015em;
  --t-fast:140ms cubic-bezier(.16,1,.3,1);

  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--text-2);
  font-size:var(--fs-body);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* ---- shell: viewport centrado sobre parchment c/ profundidade warm ---- */
.ds3-auth{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:var(--space-6);
  background:
    radial-gradient(1200px 700px at 50% -10%, #fffdf8 0%, rgba(255,253,248,0) 60%),
    radial-gradient(900px 600px at 100% 110%, var(--accent-soft) 0%, rgba(240,247,246,0) 55%),
    var(--bg-page);
}
.ds3-auth__wrap{width:100%;max-width:420px;}

/* ---- brand ---- */
.ds3-auth__brand{text-align:center;margin-bottom:var(--space-6);}
.ds3-brand-lockup{display:inline-flex;flex-direction:column;align-items:center;gap:14px;}
.ds3-brand-mark-wrap{position:relative;display:inline-flex;}
/* luz pulsando atrás/embaixo do cube (vaza pelo vidro translúcido) */
.ds3-brand-mark-wrap::before{
  content:"";
  position:absolute;
  left:50%;top:55%;
  width:95%;height:80%;
  transform:translate(-50%,-50%);
  background:radial-gradient(ellipse at center,
    rgba(255,255,255,1) 0%,
    rgba(255,255,255,.85) 22%,
    rgba(255,252,244,.45) 45%,
    rgba(255,252,244,0) 70%);
  filter:blur(6px);
  z-index:0;
  pointer-events:none;
  animation:ds3-brand-pulse 2.6s ease-in-out infinite;
}
.ds3-brand-mark{position:relative;z-index:1;height:84px;width:auto;display:block;}
@keyframes ds3-brand-pulse{
  0%,100%{opacity:.55;transform:translate(-50%,-50%) scale(.82);}
  50%    {opacity:1;transform:translate(-50%,-50%) scale(1.04);}
}
@media (prefers-reduced-motion:reduce){
  .ds3-brand-mark-wrap::before{animation:none;opacity:.7;}
}
.ds3-brand-name{
  font-family:"Space Grotesk","Inter",sans-serif;
  font-weight:600;
  font-size:34px;
  line-height:1;
  letter-spacing:-.02em;
  color:var(--text-1);
}
.ds3-auth__kicker{
  margin:var(--space-4) 0 0;
  font-size:var(--fs-label);
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:var(--tracking-wide);
  color:var(--text-muted);
}

/* ---- card ---- */
.ds3-auth__card{
  background:var(--bg-surface);
  border:1px solid var(--border-default);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-card);
  padding:var(--space-6);
}
@media(min-width:480px){.ds3-auth__card{padding:32px;}}

.ds3-auth__head{margin-bottom:var(--space-5);}
.ds3-auth__title{
  font-size:var(--fs-h2);
  font-weight:600;
  letter-spacing:var(--tracking-snug);
  color:var(--text-1);
  margin:0;
  line-height:1.2;
}
.ds3-auth__sub{font-size:var(--fs-meta);color:var(--text-3);margin:6px 0 0;line-height:1.5;}

/* ---- form fields ---- */
.ds3 .ds-field{display:flex;flex-direction:column;gap:7px;}
.ds3 .ds-field + .ds-field{margin-top:var(--space-4);}
.ds3 .ds-field__label{
  font-size:var(--fs-label);
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:var(--tracking-wide);
  color:var(--text-3);
}
.ds3 .ds-input{
  width:100%;height:44px;padding:0 14px;
  font-size:var(--fs-body);font-family:inherit;color:var(--text-1);
  background:var(--bg-surface);
  border:1px solid var(--border-default);
  border-radius:var(--radius-sm);
  transition:border-color var(--t-fast),box-shadow var(--t-fast);
}
.ds3 .ds-input::placeholder{color:var(--text-muted);}
.ds3 .ds-input:hover:not(:focus){border-color:var(--border-strong);}
.ds3 .ds-input:focus{outline:none;border-color:var(--text-1);box-shadow:0 0 0 3px var(--focus-ring);}
.ds3 .ds-input.is-invalid{border-color:var(--critical-dot);}
.ds3 .ds-input.is-invalid:focus{box-shadow:0 0 0 3px rgba(220,38,38,.12);}
.ds3 .ds-field__error{font-size:var(--fs-small);color:var(--critical-fg);}

/* input com ícone à esquerda */
.ds3 .ds-input-icon{position:relative;display:flex;align-items:center;}
.ds3 .ds-input-icon > [data-lucide]{position:absolute;left:13px;color:var(--text-muted);pointer-events:none;}
.ds3 .ds-input-icon .ds-input{padding-left:40px;}

/* ---- row: link + remember ---- */
.ds3-auth__row{
  display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);
  margin-top:var(--space-4);
}
.ds3 .ds-check{display:inline-flex;align-items:center;gap:8px;cursor:pointer;user-select:none;}
.ds3 .ds-check input{
  appearance:none;-webkit-appearance:none;
  width:17px;height:17px;margin:0;flex-shrink:0;
  border:1px solid var(--border-strong);border-radius:5px;
  background:var(--bg-surface);cursor:pointer;
  display:grid;place-content:center;
  transition:all var(--t-fast);
}
.ds3 .ds-check input:checked{background:var(--text-1);border-color:var(--text-1);}
.ds3 .ds-check input:checked::after{
  content:"";width:9px;height:9px;
  background:var(--bg-page);
  clip-path:polygon(14% 44%,0 65%,42% 100%,100% 16%,84% 0,40% 68%);
}
.ds3 .ds-check input:focus-visible{outline:none;box-shadow:0 0 0 3px var(--focus-ring);}
.ds3 .ds-check span{font-size:var(--fs-meta);color:var(--text-2);}

.ds3 .ds-link{
  font-size:var(--fs-meta);font-weight:500;color:var(--accent-link);
  text-decoration:none;transition:color var(--t-fast);
}
.ds3 .ds-link:hover{color:var(--text-1);text-decoration:underline;text-underline-offset:2px;}

/* ---- buttons ---- */
.ds3 .ds-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  width:100%;height:44px;padding:0 18px;
  border-radius:var(--radius-sm);
  font-size:var(--fs-body);font-weight:600;font-family:inherit;line-height:1;
  white-space:nowrap;text-decoration:none;cursor:pointer;
  border:1px solid transparent;background:transparent;color:var(--text-1);
  transition:all var(--t-fast);
}
.ds3 .ds-btn--primary{background:var(--text-1);color:var(--bg-page);}
.ds3 .ds-btn--primary:hover{background:var(--text-2);color:var(--bg-page);}
.ds3 .ds-btn--primary:active{transform:translateY(1px);}
.ds3 .ds-btn--secondary{background:var(--bg-surface);color:var(--text-1);border-color:var(--border-default);}
.ds3 .ds-btn--secondary:hover{background:var(--bg-inset);border-color:var(--border-strong);}
.ds3 .ds-btn[disabled]{opacity:.5;cursor:not-allowed;}

.ds3-auth__submit{margin-top:var(--space-5);}

/* ---- alerts ---- */
.ds3 .ds-alert{
  display:flex;align-items:flex-start;gap:10px;
  padding:12px 14px;border-radius:var(--radius-sm);
  font-size:var(--fs-meta);line-height:1.5;
  border:1px solid transparent;margin-bottom:var(--space-5);
}
.ds3 .ds-alert > [data-lucide]{flex-shrink:0;margin-top:1px;}
.ds3 .ds-alert--success{background:var(--success-bg);color:var(--success-fg);border-color:var(--success-border);}
.ds3 .ds-alert--success [data-lucide]{color:var(--success-dot);}
.ds3 .ds-alert--error{background:var(--critical-bg);color:var(--critical-fg);border-color:var(--critical-border);}
.ds3 .ds-alert--error [data-lucide]{color:var(--critical-dot);}

/* ---- divider + back link ---- */
.ds3-auth__alt{
  margin-top:var(--space-5);padding-top:var(--space-5);
  border-top:1px solid var(--border-soft);
  text-align:center;
}
.ds3 .ds-back{
  display:inline-flex;align-items:center;gap:6px;
  font-size:var(--fs-meta);font-weight:500;color:var(--text-3);
  text-decoration:none;transition:color var(--t-fast);
}
.ds3 .ds-back:hover{color:var(--text-1);}

/* ---- footer ---- */
.ds3-auth__foot{
  text-align:center;margin-top:var(--space-6);
  font-size:var(--fs-small);color:var(--text-muted);
}

/* ---- lucide ---- */
.ds3 [data-lucide]{display:inline-block;width:16px;height:16px;}
.ds3 svg.lucide{width:16px;height:16px;vertical-align:-3px;stroke-width:1.75;}
.ds3 .ds-btn svg.lucide{width:17px;height:17px;}
