/* ================================================================
   lici-relatorio.css — RELATÓRIO DA LICI (pages/lici-relatorio.html)

   As negociações do Salesforce com o checkbox "Lici" marcado, no mesmo
   visual do Funil de Vendas (licitacao-funil-vendas.css: .fv-*), mais o
   que é só deste relatório: a ORIGEM do edital (Agente LICI × Manual),
   o crescimento por semana/mês e a leitura fase × origem.

   Cores da origem (validadas no dataviz: CVD ΔE ≥ 15, nos dois temas):
     --lx-ag   Agente LICI  (Manual Lici desmarcado — o agente achou)
     --lx-man  Manual       (Manual Lici marcado — edital enviado à mão)
   O âmbar fica abaixo de 3:1 no fundo branco: por isso todo número vem
   em texto (legenda, rótulo, tabela), nunca só na cor.

   Tudo aqui tem prefixo `.lx-`.
   ================================================================ */

.fv-wrap,.fv-dw{--lx-ag:#1C9AA3;--lx-man:#E0912F;}
/* tema escuro: os mesmos matizes, no degrau validado contra o cartão navy */
html[data-tema="escuro"] .fv-wrap,html[data-tema="escuro"] .fv-dw{--lx-ag:#22A5AE;--lx-man:#B8761C;}

/* selo de origem (lista, ficha, comparativo) */
.lx-orig{display:inline-flex;align-items:center;gap:5px;padding:2px 8px;border-radius:999px;font-size:10px;font-weight:700;
  white-space:nowrap;background:#F0F4F9;color:var(--fv-body);}
.lx-orig i{width:7px;height:7px;border-radius:2px;flex-shrink:0;background:var(--lx-ag);}
.lx-orig.man i{background:var(--lx-man);}
.fv-dw-tag.fv-orig{display:inline-flex;align-items:center;gap:5px;}
.fv-dw-tag.fv-orig::before{content:'';width:7px;height:7px;border-radius:2px;background:var(--lx-ag);}
.fv-dw-tag.fv-orig.man::before{background:var(--lx-man);}

/* ── abas do cabeçalho (Analisar edital · Aprovações · Relatório) ── */
.lx-tabs a,.lx-tabs span{display:inline-flex;align-items:center;gap:6px;}
.lx-tabs svg{width:14px;height:14px;flex-shrink:0;}

/* ── faixa da ORIGEM (Todos · Agente LICI · Manual) ─────────────── */
.lx-origbar{display:flex;align-items:center;gap:10px 16px;flex-wrap:wrap;padding:12px 14px;background:#fff;
  border:1px solid var(--fv-bd);border-radius:12px;}
.lx-origbar[hidden]{display:none;}
.lx-origbar .k{font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--fv-mut3);}
.lx-origbar .fv-seg button{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;font-size:12.5px;}
.lx-origbar .fv-seg button i{width:9px;height:9px;border-radius:3px;flex-shrink:0;}
.lx-origbar .fv-seg button small{font-size:10.5px;}
.lx-origbar .dica{order:9;flex:1 1 100%;font-size:11px;font-weight:600;color:var(--fv-mut3);line-height:1.45;min-width:0;}
.lx-origbar .dica b{color:var(--fv-mut);}
.lx-origbar .lx-met{margin-left:auto;}
/* org sem o "Manual Lici": a faixa fica só com Valor | Quantidade */
.lx-origbar.sem-orig .k,.lx-origbar.sem-orig #lx-orig,.lx-origbar.sem-orig .dica{display:none;}

/* ══════════════════════════════════════════════════════════════
   1. HERO — navy com a divisão Agente × Manual + comparativo
   ══════════════════════════════════════════════════════════════ */
/* navy | funil por fase — a mesma dupla do Funil de Vendas */
.lx-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.45fr);gap:12px;align-items:stretch;}
/* "editais" é mais longo que "neg.": o piso da faixa do funil sobe um pouco */
.lx-hero .fv-fn{--fn-min:10.8rem;margin-top:10px;}
/* encerradas sem ganho: duas fichas por linha (o valor cabe inteiro) */
.lx-hero .fv-chip{flex:1 1 calc(50% - 4px);}
.lx-hero .fv-fn-bar{height:36px;}
.lx-hero .fv-fn-conn{height:9px;}
.lx-hero .fv-fn-stats{margin-top:12px;padding-top:12px;}
/* comparativo Agente × Manual | funil por fase separado por origem */
.lx-row2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:12px;align-items:stretch;}
.lx-row2 .lx-cmp-w{justify-content:flex-start;}
/* texto escuro dentro dos pedaços: no âmbar e no verde-azulado ele passa
   de 4:1 (o branco ficaria abaixo de 3:1 no âmbar) — nos dois temas */
.lx-hero .fv-split i span{color:#06243F;}
html[data-tema="escuro"] .lx-hero .fv-split i span{color:#06243F;}
/* ritmo: três números entre a barra e o rodapé do cartão navy */
.lx-ritmo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-areas:"a b c";gap:12px;margin:auto 0;padding:14px 0;
  border-top:1px solid rgba(255,255,255,.16);}
.lx-ritmo:empty{display:none;}
.lx-ritmo .fv-nf:nth-child(1){grid-area:a;} .lx-ritmo .fv-nf:nth-child(2){grid-area:b;} .lx-ritmo .fv-nf:nth-child(3){grid-area:c;}
.lx-hero .fv-navy .fv-split{margin-top:4px;}

/* comparativo lado a lado (tabela: no celular não vira uma coluna só) */
.lx-cmp-w{margin-top:10px;flex:1;display:flex;flex-direction:column;justify-content:center;min-width:0;overflow-x:auto;}
body.dept .area-main table.lx-cmp{width:100%;border-collapse:separate;border-spacing:0;font-size:12px;font-variant-numeric:tabular-nums;}
body.dept .area-main table.lx-cmp th,body.dept .area-main table.lx-cmp td{padding:6px 10px;border-bottom:1px solid var(--fv-bd-soft);text-align:right;white-space:nowrap;}
body.dept .area-main table.lx-cmp tbody tr:last-child td{border-bottom:none;}
body.dept .area-main table.lx-cmp th.rh,body.dept .area-main table.lx-cmp td.rh{text-align:left;font-size:10px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--fv-mut3);padding-left:2px;}
body.dept .area-main table.lx-cmp thead th{padding:0 6px 8px;border-bottom:1px solid var(--fv-bd);vertical-align:bottom;}
body.dept .area-main table.lx-cmp td{color:var(--fv-body);font-weight:600;}
body.dept .area-main table.lx-cmp td b{color:var(--fv-ink);font-weight:700;font-size:13px;}
body.dept .area-main table.lx-cmp td small{display:block;font-size:10px;font-weight:600;color:var(--fv-mut3);margin-top:2px;}
body.dept .area-main table.lx-cmp td.big b{font-size:19px;letter-spacing:-.4px;}
body.dept .area-main table.lx-cmp td .pos{color:#22794C;} body.dept .area-main table.lx-cmp td .neg{color:#B54545;}
.lx-cmp-hd{display:inline-flex;flex-direction:column;align-items:flex-end;gap:3px;border:1px solid var(--fv-bd);background:#FBFCFE;border-radius:10px;
  padding:8px 11px;cursor:pointer;font-family:inherit;color:inherit;min-width:128px;border-top:3px solid var(--c);}
.lx-cmp-hd:hover{border-color:#BFD3E6;border-top-color:var(--c);}
.lx-cmp-hd.on{background:#EFF6FF;border-color:#BFDBFE;border-top-color:var(--c);}
.lx-cmp-hd .t{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:800;color:var(--fv-ink);text-transform:none;letter-spacing:0;}
.lx-cmp-hd .t i{width:9px;height:9px;border-radius:3px;background:var(--c);}
.lx-cmp-hd .s{font-size:10px;font-weight:600;color:var(--fv-mut3);text-transform:none;letter-spacing:0;}
.lx-cmp-bar{display:block;height:5px;border-radius:99px;background:var(--fv-track);overflow:hidden;margin-top:5px;margin-left:auto;width:100%;max-width:140px;}
.lx-cmp-bar i{display:block;height:100%;border-radius:99px;margin-left:auto;}

/* ══════════════════════════════════════════════════════════════
   2. CRESCIMENTO — colunas empilhadas Agente (embaixo) + Manual
   ══════════════════════════════════════════════════════════════ */
.lx-cr-ctl{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.lx-cr{position:relative;margin-top:14px;min-width:0;}
.lx-cr-sc{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.lx-cr-in{min-width:100%;}
.lx-cr-plot{position:relative;display:flex;gap:6px;align-items:flex-end;height:200px;padding-left:40px;
  border-bottom:1px solid var(--fv-bd);}
/* grade horizontal: linhas finas e sólidas, um tom acima do fundo; a
   escala fica na calha da esquerda, fora das colunas */
.lx-cr-grid{position:absolute;inset:0;pointer-events:none;}
.lx-cr-grid i{position:absolute;left:40px;right:0;border-top:1px solid var(--fv-bd-soft);}
.lx-cr-grid i span{position:absolute;left:-40px;width:34px;top:-6px;text-align:right;font-size:9px;font-weight:600;color:var(--fv-mut3);
  font-style:normal;font-variant-numeric:tabular-nums;line-height:1;}
.lx-cr-plot>.lx-cr-col,.lx-cr-x>*{flex:1 1 0;min-width:30px;}
.lx-cr-col{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px;height:100%;
  cursor:pointer;border-radius:6px;}
.lx-cr-col:hover{background:rgba(10,46,92,.035);}
.lx-cr-col:focus-visible{outline:2px solid #1272C4;outline-offset:1px;}
.lx-cr-col.on{background:rgba(18,114,196,.08);}
.lx-cr-col.dim{opacity:.45;}
.lx-cr-n{font-size:10px;font-weight:700;color:var(--fv-ink);line-height:1;font-variant-numeric:tabular-nums;white-space:nowrap;}
.lx-cr-col.curso .lx-cr-n{color:#1272C4;}
.lx-cr-stk{width:62%;max-width:44px;display:flex;flex-direction:column-reverse;gap:2px;min-height:2px;}
.lx-cr-stk i{display:block;width:100%;flex:0 0 auto;min-height:0;}
/* só a ponta de cima é arredondada (a base fica no eixo) */
.lx-cr-stk i:last-child{border-radius:4px 4px 0 0;}
.lx-cr-col.curso .lx-cr-stk{opacity:.72;}
/* por mês são poucas colunas: a barra engrossa */
.lx-cr.mes .lx-cr-stk{width:44%;max-width:110px;}
.lx-cr-x{display:flex;gap:6px;margin-top:7px;padding-left:40px;}
.lx-cr-x span{font-size:10px;font-weight:700;color:var(--fv-mut);text-align:center;white-space:nowrap;overflow:hidden;}
.lx-cr-x span.curso{color:#1272C4;}
.lx-cr-leg{display:flex;align-items:center;gap:8px 16px;flex-wrap:wrap;margin-top:12px;font-size:11px;font-weight:600;color:var(--fv-mut);}
.lx-cr-leg span{display:inline-flex;align-items:center;gap:6px;}
.lx-cr-leg i{width:9px;height:9px;border-radius:3px;flex-shrink:0;}
.lx-cr-leg b{color:var(--fv-ink);font-weight:700;font-variant-numeric:tabular-nums;}
.lx-cr-leg .nota{margin-left:auto;color:var(--fv-mut3);}
/* dica que segue o mouse */
.lx-tip{position:absolute;z-index:5;pointer-events:none;min-width:190px;max-width:260px;background:#0A2E5C;color:#fff;border-radius:10px;
  padding:10px 12px;font-size:11.5px;line-height:1.45;box-shadow:0 10px 26px -10px rgba(10,46,92,.55);transform:translate(-50%,-100%);}
.lx-tip[hidden]{display:none;}
.lx-tip .t{font-weight:800;font-size:12px;margin-bottom:5px;}
.lx-tip .r{display:flex;align-items:center;gap:7px;justify-content:space-between;}
.lx-tip .r span{display:inline-flex;align-items:center;gap:6px;color:rgba(255,255,255,.78);font-weight:600;}
.lx-tip .r i{width:8px;height:8px;border-radius:2px;}
.lx-tip .r b{font-variant-numeric:tabular-nums;}
.lx-tip .tot{border-top:1px solid rgba(255,255,255,.18);margin-top:5px;padding-top:5px;}

/* ══════════════════════════════════════════════════════════════
   3. FASE × ORIGEM — barras espelhadas (Agente ← fase → Manual)
   ══════════════════════════════════════════════════════════════ */
.lx-bf{display:flex;flex-direction:column;gap:5px;margin-top:10px;flex:1;justify-content:center;}
.lx-bf-h,.lx-bf-r{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,140px) minmax(0,1fr);grid-template-areas:"a n m";gap:10px;align-items:center;}
.lx-bf-h{font-size:10px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--fv-mut3);margin-bottom:2px;}
.lx-bf-h .a{grid-area:a;text-align:right;} .lx-bf-h .m{grid-area:m;}
.lx-bf-h span{display:inline-flex;align-items:center;gap:6px;}
.lx-bf-h i{width:9px;height:9px;border-radius:3px;}
.lx-bf-r{cursor:pointer;border-radius:8px;padding:3px 0;}
.lx-bf-r:hover{background:#F7FAFD;}
.lx-bf-r.on{background:#EFF6FF;}
.lx-bf-r.dim{opacity:.45;}
.lx-bf-n{grid-area:n;text-align:center;font-size:11.5px;font-weight:700;color:var(--fv-ink);line-height:1.25;min-width:0;}
.lx-bf-n .t{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.lx-bf-n small{display:block;font-size:9.5px;font-weight:600;color:var(--fv-mut3);font-variant-numeric:tabular-nums;}
.lx-bf-s{display:flex;align-items:center;gap:7px;min-width:0;}
.lx-bf-s.a{grid-area:a;flex-direction:row-reverse;}
.lx-bf-s.m{grid-area:m;}
/* pista: a barra cresce a partir do centro e o número vai colado na ponta */
.lx-bf-s .tr{flex:1;min-width:0;height:16px;display:flex;align-items:center;gap:7px;}
.lx-bf-s.a .tr{flex-direction:row-reverse;}
.lx-bf-s .tr i{display:block;height:14px;flex:0 0 auto;min-width:0;}
.lx-bf-s.a .tr i{border-radius:4px 0 0 4px;}
.lx-bf-s.m .tr i{border-radius:0 4px 4px 0;}
.lx-bf-s .v{flex:0 0 auto;font-size:11px;font-weight:700;color:var(--fv-body);font-variant-numeric:tabular-nums;white-space:nowrap;}
.lx-bf-s .v.z{color:var(--fv-mut3);font-weight:600;}
.lx-bf-sep{border-top:1px dashed var(--fv-bd);margin:4px 0 2px;}
.lx-bf-tot .lx-bf-n{font-size:10px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--fv-mut2);}
.lx-bf-tot{cursor:default;}
.lx-bf-tot:hover{background:none;}

/* ══════════════════════════════════════════════════════════════
   4. LISTA DE EDITAIS
   ══════════════════════════════════════════════════════════════ */
.lx-xls{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--fv-bd);background:#fff;border-radius:9px;padding:7px 11px;
  font-family:inherit;font-size:11.5px;font-weight:700;color:#1272C4;cursor:pointer;white-space:nowrap;}
.lx-xls:hover{border-color:#1272C4;background:#F4F9FF;}
.lx-xls svg{flex-shrink:0;}
body.dept .area-main table.fv-tb.fv-ng td.og{max-width:130px;}
/* a lista cabe no cartão em ~1.100px: cortes com reticências (o title traz o inteiro) */
body.dept .area-main table.fv-tb.fv-ng.lx-ng td.nm{max-width:220px;}
body.dept .area-main table.fv-tb.fv-ng.lx-ng td.org{max-width:180px;}
body.dept .area-main table.fv-tb.fv-ng.lx-ng td .fv-badge{max-width:140px;}

/* ══════════════════════════════════════════════════════════════
   5. RESPONSIVO
   ══════════════════════════════════════════════════════════════ */
@media(max-width:1199.98px){
  .lx-hero,.lx-row2{grid-template-columns:1fr;}
}
@media(max-width:767.98px){
  /* o funil empilha nome e faixa no celular (a regra do hero acima não vale aqui) */
  .lx-hero .fv-fn-row,.lx-hero .fv-fn-sep,.lx-hero .fv-fn-out{grid-template-columns:1fr;}
  .lx-origbar{flex-direction:column;align-items:stretch;}
  .lx-origbar .fv-seg{width:100%;box-sizing:border-box;}
  /* três botões numa linha: o valor desce para baixo do nome */
  .lx-origbar #lx-orig button{flex:1 1 0;min-width:0;flex-wrap:wrap;justify-content:center;gap:2px 6px;padding:7px 4px;font-size:12px;line-height:1.2;}
  .lx-origbar #lx-orig button small{flex:1 1 100%;text-align:center;margin-left:0;}
  .lx-origbar .lx-met button{flex:1;justify-content:center;padding:8px 6px;}
  .lx-origbar .lx-met{margin-left:0;}
  .lx-cr-plot{height:180px;}
  .lx-ritmo{gap:8px;}
  /* fase em cima, as duas barras embaixo (agente ← | → manual) */
  .lx-bf{--lx-calha:62px;gap:10px;}
  .lx-bf-h,.lx-bf-r{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"n n" "a m";gap:3px 6px;}
  .lx-bf-h{grid-template-areas:"a m";}
  .lx-bf-n .t{white-space:normal;}
  .lx-bf-s .v{font-size:10.5px;}
  .lx-bf-s .tr{gap:5px;}
  .lx-cr-leg .nota{margin-left:0;}
  .lx-cmp-hd{min-width:0;width:100%;box-sizing:border-box;padding:7px 8px;}
  .lx-cmp-hd .s{display:none;}
  body.dept .area-main table.lx-cmp{table-layout:fixed;}
  body.dept .area-main table.lx-cmp th,body.dept .area-main table.lx-cmp td{padding:7px 4px;white-space:normal;}
  body.dept .area-main table.lx-cmp th.rh,body.dept .area-main table.lx-cmp td.rh{width:30%;font-size:9px;letter-spacing:.04em;line-height:1.3;}
  body.dept .area-main table.lx-cmp td.big b{font-size:17px;}
  body.dept .area-main table.lx-cmp td b{font-size:12.5px;}
}