/* ============================================================
   SKYVIDYA v3 — styles: command bar, H3 gate, módulos,
   ativos, onboarding, gestão. Layers on app-v2.css.
   ============================================================ */

/* ---- command bar ---- */
.cb-trigger { display:inline-flex; align-items:center; gap:9px; cursor:pointer;
  border:1px solid var(--rule); border-radius:var(--radius); background:var(--bg-elev);
  color:var(--fg-mute); font-family:var(--font-body); font-size:12px; padding:8px 12px; transition:all 150ms; min-width:220px; }
.cb-trigger:hover { border-color:var(--sv-ink-500); color:var(--fg-soft); }
.cb-trigger span:nth-child(2) { flex:1; text-align:left; }
.cb-kbd { font-size:9px; letter-spacing:0.06em; color:var(--fg-mute); border:1px solid var(--rule); border-radius:4px; padding:2px 6px; }

.cb-overlay { position:fixed; inset:0; z-index:300; background:color-mix(in srgb, var(--bg-void) 60%, transparent);
  backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); display:flex; align-items:flex-start; justify-content:center; padding-top:14vh; }
.cb-panel { width:min(560px, 92vw); background:var(--bg-elev); border:1px solid var(--sv-ink-500); border-radius:var(--radius-lg);
  box-shadow:0 24px 70px -20px rgba(0,0,0,0.8); overflow:hidden; }
.cb-input { display:flex; align-items:center; gap:11px; padding:14px 16px; border-bottom:1px solid var(--rule); }
.cb-input input { flex:1; background:none; border:none; outline:none; color:var(--fg); font-family:var(--font-body); font-size:14px; }
.cb-input input::placeholder { color:var(--fg-mute); }
.cb-list { max-height:320px; overflow-y:auto; padding:7px; }
.cb-item { display:flex; align-items:center; gap:11px; width:100%; text-align:left; cursor:pointer;
  background:none; border:none; padding:10px 11px; border-radius:6px; color:var(--fg-mid); font-size:13px; font-family:var(--font-body); transition:background 120ms; }
.cb-item:hover { background:var(--bg-elev-2); color:var(--fg); }
.cb-item span { flex:1; }
.cb-item .cb-go { opacity:0; transition:opacity 120ms; color:var(--sv-cyan); }
.cb-item:hover .cb-go { opacity:1; }
.cb-ai { border-top:1px solid var(--rule-soft); border-radius:0; color:var(--sv-cyan); }

/* ---- H3 gate panel (bottom-right over map) ---- */
.h3-gate { bottom:18px; right:16px; width:230px; padding:12px; z-index:7; }
.h3-gate .ct { font-family:var(--font-mono); font-size:9px; letter-spacing:0.14em; text-transform:uppercase; color:var(--fg-mute); margin-bottom:9px; }
.h3g-row { display:flex; align-items:center; gap:8px; width:100%; cursor:pointer; background:none; border:none;
  padding:6px 4px; border-radius:5px; transition:background 130ms; }
.h3g-row:hover { background:var(--bg-elev-2); }
.h3g-row.locked { opacity:0.75; }
.h3g-l { font-size:11.5px; color:var(--fg-mid); flex:1; text-align:left; }
.h3g-row.on .h3g-l { color:var(--fg); }
.h3g-r { font-size:9px; color:var(--fg-mute); }
.h3g-lock { font-size:8.5px; letter-spacing:0.06em; color:var(--sv-coral); border:1px solid color-mix(in srgb, var(--sv-coral) 40%, transparent); border-radius:4px; padding:2px 6px; }
.h3g-free { font-size:8.5px; letter-spacing:0.06em; color:var(--risk-low); }
.h3g-note { font-size:10px; color:var(--fg-mute); line-height:1.5; margin:8px 0 0; padding-top:8px; border-top:1px solid var(--rule-soft); }

/* ---- upgrade / onboarding modal ---- */
.up-panel { width:min(440px, 92vw); background:var(--bg-elev); border:1px solid var(--sv-ink-500); border-radius:var(--radius-lg);
  box-shadow:0 24px 70px -20px rgba(0,0,0,0.8); padding:22px; }
.up-title { font-size:18px; letter-spacing:-0.02em; margin:8px 0 0; }
.up-body { font-size:12.5px; color:var(--fg-soft); line-height:1.6; margin:10px 0 0; }
.up-list { margin:14px 0; padding-left:16px; }
.up-list li { font-size:12px; color:var(--fg-mid); line-height:1.7; }

.ob-steps { display:flex; gap:14px; margin-bottom:6px; }
.ob-step { font-size:8.5px; letter-spacing:0.1em; color:var(--fg-mute); }
.ob-step.on { color:var(--sv-coral); }
.ob-step.done { color:var(--risk-low); }
.ob-input { width:100%; margin-top:14px; background:var(--bg); border:1px solid var(--rule); border-radius:6px;
  padding:11px 13px; color:var(--fg); font-size:13px; outline:none; letter-spacing:0.04em; }
.ob-input:focus { border-color:color-mix(in srgb, var(--sv-coral) 50%, transparent); }
.ob-mods { display:flex; flex-direction:column; gap:7px; margin-top:14px; }
.ob-mod { display:flex; align-items:center; gap:10px; cursor:pointer; background:var(--bg); border:1px solid var(--rule);
  border-radius:6px; padding:10px 12px; transition:all 140ms; }
.ob-mod:hover { border-color:var(--sv-ink-500); }
.ob-mod.on { border-color:color-mix(in srgb, var(--sv-coral) 45%, transparent); background:color-mix(in srgb, var(--sv-coral) 6%, transparent); }
.ob-mod-n { font-size:12.5px; color:var(--fg-mid); }
.ob-mod.on .ob-mod-n { color:var(--fg); }
.ob-done { display:grid; place-items:center; padding:18px 0; }

/* ---- módulos catálogo ---- */
.mod-section { margin-bottom:26px; }
.mod-sec-h { display:flex; align-items:baseline; gap:12px; margin-bottom:12px; }
.mod-tag { font-family:var(--font-mono); font-size:10px; font-weight:600; letter-spacing:0.16em; padding:4px 10px; border-radius:4px; border:1px solid; }
.mod-tag.coral { color:var(--sv-coral); border-color:color-mix(in srgb, var(--sv-coral) 45%, transparent); background:color-mix(in srgb, var(--sv-coral) 8%, transparent); }
.mod-tag.cyan { color:var(--sv-cyan); border-color:color-mix(in srgb, var(--sv-cyan) 45%, transparent); background:color-mix(in srgb, var(--sv-cyan) 8%, transparent); }
.mod-tag.soft { color:var(--fg-soft); border-color:var(--rule); }
.mod-sub { font-size:11.5px; color:var(--fg-mute); }
.mod-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(250px, 1fr)); gap:12px; }
.mod-card { display:flex; flex-direction:column; align-items:flex-start; gap:8px; text-align:left; cursor:pointer;
  background:var(--bg-elev); border:1px solid var(--rule); border-radius:var(--radius); padding:15px; transition:all 150ms; }
.mod-card:hover { border-color:var(--sv-ink-500); transform:translateY(-2px); }
.mc-top { display:flex; align-items:center; justify-content:space-between; width:100%; }
.mc-ico { width:30px; height:30px; display:grid; place-items:center; border:1px solid var(--rule); border-radius:6px; background:var(--bg); }
.mc-score { font-family:var(--font-display); font-weight:600; font-size:22px; letter-spacing:-0.02em; }
.mc-status { font-size:8.5px; letter-spacing:0.1em; padding:3px 8px; border-radius:4px; border:1px solid var(--rule); color:var(--fg-mute); }
.mc-status.ativo { color:var(--risk-low); border-color:color-mix(in srgb, var(--risk-low) 40%, transparent); }
.mc-name { font-size:13.5px; font-weight:600; color:var(--fg); letter-spacing:-0.01em; }
.mc-desc { font-size:11px; color:var(--fg-soft); line-height:1.5; margin:0;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.mc-fontes { font-size:8.5px; letter-spacing:0.05em; text-transform:uppercase; color:var(--fg-mute); }

/* módulo detalhe extras */
.mod-svc-box { display:flex; flex-direction:column; align-items:center; gap:12px; text-align:center; padding:20px; }
.mod-svc-box p { font-size:11.5px; color:var(--fg-soft); line-height:1.55; margin:0; max-width:30ch; }
.esg-checks { display:flex; flex-direction:column; }
.esg-row { display:grid; grid-template-columns:24px 1fr auto; align-items:center; gap:10px; padding:10px 16px; border-bottom:1px solid var(--rule-soft); }
.esg-row:last-child { border-bottom:none; }
.esg-led { width:20px; height:20px; border-radius:50%; display:grid; place-items:center; }
.esg-led.ok { color:var(--risk-low); background:color-mix(in srgb, var(--risk-low) 12%, transparent); }
.esg-led.bad { color:var(--risk-critical); background:color-mix(in srgb, var(--risk-critical) 12%, transparent); }
.esg-k { font-size:12px; color:var(--fg-mid); }
.esg-k em { font-style:normal; color:var(--risk-critical); font-family:var(--font-mono); font-size:10px; }
.esg-src { font-size:8.5px; letter-spacing:0.05em; text-transform:uppercase; color:var(--fg-mute); }
.gb-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:12px; }
.gb-card { padding:14px; display:flex; flex-direction:column; gap:6px; }
.gb-u { font-size:8.5px; letter-spacing:0.06em; text-transform:uppercase; color:var(--fg-mute); }

/* ---- ativos ---- */
.asset-mods { display:flex; gap:5px; flex-wrap:wrap; }
.am-chip { font-size:8px; letter-spacing:0.05em; padding:2px 6px; border-radius:4px; border:1px solid var(--rule); color:var(--fg-soft); }
.esg-pill { display:inline-flex; align-items:center; gap:5px; font-size:9px; letter-spacing:0.05em; padding:3px 8px; border-radius:10px; border:1px solid; }
.esg-pill.ok { color:var(--risk-low); border-color:color-mix(in srgb, var(--risk-low) 40%, transparent); }
.esg-pill.bad { color:var(--risk-critical); border-color:color-mix(in srgb, var(--risk-critical) 45%, transparent); }
.parcel-list { display:flex; flex-direction:column; gap:2px; }
.parcel-row { display:grid; grid-template-columns:34px 1fr auto auto; align-items:center; gap:10px; padding:7px 8px; border-radius:5px; transition:background 120ms; }
.parcel-row:hover { background:var(--bg-elev-2); }
.pr-id { font-size:9.5px; color:var(--fg-mute); }
.pr-cult { font-size:11.5px; color:var(--fg-mid); }
.pr-ha { font-size:10px; color:var(--fg-soft); }
.pr-ndvi { font-size:10px; }

/* ---- gestão ---- */
.gestao-row { display:grid; grid-template-columns:220px 1fr auto; align-items:center; gap:14px; padding:13px 16px; border-bottom:1px solid var(--rule-soft); }
.gestao-row:last-child { border-bottom:none; }
.g-k { font-family:var(--font-mono); font-size:10px; letter-spacing:0.1em; text-transform:uppercase; color:var(--fg-mute); }
.g-v { font-size:13px; color:var(--fg); }
@media (max-width:760px){ .gestao-row { grid-template-columns:1fr; } }