/* ===========================================================================
   Greeta — Smart Lead Capture (Sprint 12)
   Modal de qualificação. Reusa tokens do DS (ds.css). Dark mode.
   Larguras: desktop 760px · tablet 680px · mobile full screen.
   =========================================================================== */

/* ---------- overlay ---------- */
.lc-overlay{
  position:fixed;inset:0;z-index:1000;
  display:flex;align-items:center;justify-content:center;
  padding:clamp(16px,4vw,40px);
  background:rgba(7,5,11,.72);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  opacity:0;transition:opacity .2s ease;
  overflow-y:auto;
}
.lc-overlay[hidden]{display:none}
.lc-overlay.is-open{opacity:1}
body.lc-lock{overflow:hidden}

/* ---------- modal ---------- */
.lc-modal{
  position:relative;width:100%;max-width:760px;
  background:var(--surface);
  border:1px solid var(--border-strong);
  border-radius:var(--r-lg);
  box-shadow:var(--shadow);
  padding:clamp(22px,3.5vw,40px);
  margin:auto;
  transform:translateY(12px) scale(.985);
  transition:transform .22s ease;
}
.lc-overlay.is-open .lc-modal{transform:translateY(0) scale(1)}
@media(max-width:1024px){.lc-modal{max-width:680px}}

/* mobile: tela cheia, sem bordas arredondadas */
@media(max-width:600px){
  .lc-overlay{padding:0;align-items:stretch;overflow-x:hidden}
  .lc-modal{max-width:none;min-height:100%;border-radius:0;border:0;overflow-x:hidden;padding:20px 18px calc(28px + env(safe-area-inset-bottom))}
}

/* ---------- close ---------- */
.lc-close{
  position:absolute;top:14px;right:14px;z-index:2;
  width:38px;height:38px;border-radius:999px;
  display:flex;align-items:center;justify-content:center;
  background:var(--surface-2);border:1px solid var(--border);
  color:var(--text-dim);cursor:pointer;transition:color .15s,border-color .15s,background .15s;
}
.lc-close:hover{color:var(--text);border-color:var(--border-strong);background:var(--surface-3)}
.lc-close svg{width:18px;height:18px}

/* ---------- header ---------- */
.lc-head{text-align:left;margin-bottom:22px;padding-right:40px}

/* ---------- form layout ---------- */
.lc-form{display:flex;flex-direction:column;gap:18px;min-width:0}
.lc-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;min-width:0}
@media(max-width:600px){.lc-grid{grid-template-columns:1fr}}

/* min-width:0 deixa os filhos flex/grid encolherem → sem overflow horizontal no mobile */
.lc-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.lc-field label,.lc-chipset legend{font-size:13.5px;font-weight:600;color:var(--text);letter-spacing:-.1px}
.lc-req{color:var(--accent)}

/* inputs / select / textarea */
.lc-field input,.lc-field textarea,.lc-select select{
  width:100%;max-width:100%;min-width:0;font-family:var(--font);font-size:15px;color:var(--text);
  background:var(--surface-2);border:1px solid var(--border);
  border-radius:var(--r-sm);padding:12px 14px;
  transition:border-color .15s,box-shadow .15s;
}
.lc-field textarea{resize:vertical;min-height:80px;line-height:1.5}
.lc-field input::placeholder,.lc-field textarea::placeholder{color:var(--text-faint)}
.lc-field input:focus,.lc-field textarea:focus,.lc-select select:focus{
  outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim);
}
.lc-field input[aria-invalid="true"],.lc-field textarea[aria-invalid="true"]{border-color:var(--red)}

/* select com seta custom */
.lc-select{position:relative}
.lc-select::after{
  content:"";position:absolute;right:14px;top:50%;width:9px;height:9px;
  border-right:2px solid var(--text-dim);border-bottom:2px solid var(--text-dim);
  transform:translateY(-65%) rotate(45deg);pointer-events:none;
}
.lc-select select{appearance:none;-webkit-appearance:none;padding-right:36px;cursor:pointer}
.lc-select select:invalid{color:var(--text-faint)}
.lc-select option{background:var(--surface-2);color:var(--text)}

.lc-hint{font-size:12.5px;color:var(--text-faint);line-height:1.4}

/* ---------- chips ---------- */
.lc-chipset{border:0;display:flex;flex-direction:column;gap:10px;min-width:0}
.lc-chips{display:flex;flex-wrap:wrap;gap:9px}
.lc-chip{
  font-family:var(--font);font-size:13.5px;font-weight:500;color:var(--text-dim);
  background:var(--surface-2);border:1px solid var(--border);
  border-radius:999px;padding:9px 15px;cursor:pointer;
  transition:color .15s,border-color .15s,background .15s,transform .12s;
}
.lc-chip:hover{color:var(--text);border-color:var(--border-strong)}
.lc-chip[aria-checked="true"]{
  color:#fff;background:var(--brand);border-color:var(--brand);
  box-shadow:0 6px 18px -8px rgba(132,5,188,.7);
}
.lc-chipset.has-error .lc-chips{outline:1px solid var(--red);outline-offset:6px;border-radius:12px}

/* ---------- counter ---------- */
.lc-counter{font-size:12px;color:var(--text-faint);text-align:right}

/* ---------- consent ---------- */
.lc-consent{display:flex;gap:11px;align-items:flex-start;font-size:13.5px;color:var(--text-dim);line-height:1.5;cursor:pointer}
.lc-consent input{margin-top:2px;width:18px;height:18px;flex:0 0 auto;accent-color:var(--brand);cursor:pointer}
.lc-consent a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}

/* ---------- errors ---------- */
.lc-error{font-size:12.5px;color:var(--red);min-height:0}
.lc-error:empty{display:none}
.lc-error--global{margin-top:-4px}

/* ---------- submit + spinner ---------- */
.lc-submit{justify-content:center;width:100%;margin-top:4px;min-height:48px}
.lc-submit[disabled]{opacity:.7;cursor:progress;transform:none;filter:none}
.lc-spinner{display:none;width:18px;height:18px;border-radius:999px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;animation:lc-spin .7s linear infinite}
.lc-submit.is-loading .lc-submit__label{display:none}
.lc-submit.is-loading .lc-spinner{display:inline-block}
@keyframes lc-spin{to{transform:rotate(360deg)}}

.lc-legal-note{font-size:11.5px;color:var(--text-faint);text-align:center;margin-top:2px}

/* honeypot: invisível a humanos, presente para bots */
.lc-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------- view toggle ---------- */
.lc-view[hidden]{display:none}

/* ---------- success ---------- */
.lc-success{text-align:center;padding:clamp(16px,4vw,40px) 0}
.lc-success__icon{
  width:72px;height:72px;border-radius:999px;margin:0 auto 8px;
  display:flex;align-items:center;justify-content:center;
  background:var(--accent-dim);color:var(--green);
  border:1px solid var(--border-strong);
}
.lc-success__icon svg{width:34px;height:34px}

/* respeita reduced motion */
@media(prefers-reduced-motion:reduce){
  .lc-overlay,.lc-modal{transition:none}
  .lc-spinner{animation:none}
}