/* ============================================================
   css/telas/administracao.css — CSS só da área "administracao".

   DE ONDE VEM: do LOTE F do mock aprovado
   03-Planejamento/plataforma/mock/MOCK-PLATAFORMA-COMPLETO-66-TELAS-v.A.html
   — as peças com prefixo .lf-, copiadas por medição. Aqui todas
   ganham o prefixo de área: .area-administracao.

   O QUE NÃO ESTÁ AQUI: tudo o que componentes.css já tem
   (.painel · .kpi · .tab · .selo · .faixa · .grupobt · .subcartao
   · .chk · .aprov · .quem2 · .ini · .notap · .pvazio).
   Nenhum valor cru. A escala compacta v.A é o aprovado.
   ============================================================ */

/* --- painel duplo e par de painéis --------------------------
   o .duplo da base tem altura travada em 421 px; estes crescem
   com o conteúdo, que é o que as telas desta área pedem. */
.area-administracao .lf-duplo{display:grid;grid-template-columns:1fr 348px;gap:16px;
  margin-bottom:16px;flex:1 0 auto;min-height:408px}
.area-administracao .lf-par{display:grid;grid-template-columns:1fr 1fr;gap:16px;
  margin-bottom:16px;flex:0 0 auto;align-items:start}
.area-administracao .lf-bl{flex:0 0 auto;margin-bottom:16px}
.area-administracao .lf-bl:last-child{margin-bottom:0}

/* --- aba de painel ------------------------------------------ */
.area-administracao .lf-aba{overflow:visible;flex:1 1 auto;min-height:0}

/* --- linha de apoio dentro de painel ------------------------ */
.area-administracao .lf-linha{display:flex;align-items:center;gap:10px;padding:9px 0 2px;
  border-top:1px solid var(--borda-sutil);margin-top:9px;flex-wrap:wrap}
.area-administracao .lf-linha>.i{width:14px;height:14px;color:var(--txt-apoio);flex:0 0 auto}
.area-administracao .lf-txt{font-size:12.5px;color:var(--txt-apoio);line-height:1.45;flex:1;min-width:200px}
.area-administracao .lf-txt b{color:var(--txt-forte);font-weight:500}
.area-administracao .etq.lf-aval{border-style:dashed}

/* --- campo de formulário ------------------------------------ */
.area-administracao .lf-campos{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px}
.area-administracao .lf-campo{display:flex;flex-direction:column;gap:5px;min-width:0}
.area-administracao .lf-c2{grid-column:1/-1}
.area-administracao .lf-campo label{font-size:12px;font-weight:500;color:var(--txt-forte)}
.area-administracao .lf-val{display:block;min-height:30px;width:100%;
  border:1px solid var(--borda-controle);border-radius:var(--r-ctrl);
  background:var(--fundo-campo);padding:6px 9px;font:inherit;
  font-size:12.5px;color:var(--txt-padrao);line-height:1.4;overflow-wrap:anywhere}
.area-administracao textarea.lf-val{min-height:66px;resize:vertical}
.area-administracao select.lf-val{appearance:none;padding-right:26px;
  background-image:linear-gradient(45deg,transparent 50%,var(--txt-apoio) 50%),
                   linear-gradient(135deg,var(--txt-apoio) 50%,transparent 50%);
  background-position:calc(100% - 15px) 14px,calc(100% - 10px) 14px;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.area-administracao .lf-val:focus-visible{outline:2px solid var(--foco);outline-offset:1px}
.area-administracao .lf-ajuda{display:block;font-size:11px;color:var(--txt-apoio);line-height:1.4}

/* --- chave de liga e desliga, em bloco de ajuste ------------ */
.area-administracao .lf-aju{display:flex;align-items:center;gap:12px;min-height:56px;
  border-bottom:1px solid var(--borda-sutil);padding:7px 0;flex-wrap:wrap;row-gap:8px}
.area-administracao .lf-aju:last-of-type{border-bottom:0}
.area-administracao .lf-aju .quem2{flex:1 1 260px;min-width:0}
.area-administracao .lf-aju .quem2 i{line-height:1.4}
.area-administracao .lf-aju .selo{flex:0 0 auto}
.area-administracao .lf-sw{display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:28px;flex:0 0 auto;border:0;background:none;padding:0}
.area-administracao .lf-chave{width:30px;height:17px;border-radius:var(--r-pilula);
  background:var(--fundo-card);border:1px solid var(--borda-controle);
  position:relative;flex:0 0 auto;display:block}
.area-administracao .lf-chave::after{content:"";position:absolute;left:2px;top:2px;width:11px;
  height:11px;border-radius:50%;background:var(--borda-controle)}
.area-administracao .lf-sw[aria-checked="true"] .lf-chave{background:var(--acao);border-color:var(--acao-escuro)}
.area-administracao .lf-sw[aria-checked="true"] .lf-chave::after{left:15px;background:var(--sobre-acento)}
.area-administracao .lf-sw[disabled]{opacity:.45}

/* --- célula de matriz: marca de leitura, sem cor de ação ---- */
.area-administracao .lf-mx{display:inline-grid;place-items:center;width:22px;height:22px;
  border-radius:5px;font-size:12.5px;color:var(--txt-apoio);border:1px solid transparent;
  background:none;padding:0}
.area-administracao .lf-mx.on{border-color:var(--borda-padrao);background:var(--fundo-alt);
  color:var(--txt-forte)}
.area-administracao .lf-mx .i{width:13px;height:13px;stroke-width:2.4}
.area-administracao .lf-mx[disabled]{opacity:.45}

/* --- identificação em subcartão ----------------------------- */
.area-administracao .lf-ident{align-items:stretch}
.area-administracao .lf-ident .col{min-width:0}

/* --- par de rótulo e texto em lista ------------------------- */
.area-administracao .lf-pt{display:flex;flex-direction:column;min-width:0;line-height:1.35;text-align:left}
.area-administracao .lf-pt b{font-size:12.5px;font-weight:500;color:var(--txt-forte)}
.area-administracao .lf-pt i{font-size:11.5px;color:var(--txt-fraco);margin-top:2px}

/* ============================================================
   PEÇAS DE LISTA — as mesmas da Biblioteca, na medida da base:
   busca com campo de verdade e título de coluna que ordena.
   ============================================================ */
.area-administracao .lf-busca{height:28px;min-width:152px;border:1px solid var(--borda-controle);
  border-radius:7px;display:inline-flex;align-items:center;gap:7px;padding:0 9px;
  color:var(--txt-fraco);font-size:11.5px;background:var(--fundo-campo)}
.area-administracao .lf-busca .i{width:13px;height:13px;flex:0 0 auto}
.area-administracao .lf-busca input{border:0;background:none;font:inherit;font-size:11.5px;
  color:var(--txt-forte);min-width:0;width:100%;outline:none;padding:0}
.area-administracao .lf-busca:focus-within{border-color:var(--foco);box-shadow:0 0 0 1px var(--foco)}
.area-administracao .tab thead th .lf-ord-bt{display:inline-flex;align-items:center;gap:5px;
  font:inherit;color:inherit;letter-spacing:inherit;text-transform:inherit;padding:0}
.area-administracao .tab thead th .lf-ord-bt.on{color:var(--txt-forte)}
.area-administracao .tab thead th .lf-ord-bt .i{width:12px;height:12px}

/* --- marca de acesso da tela -------------------------------- */
.area-administracao .lf-marcas{display:flex;align-items:center;gap:7px;flex-wrap:wrap;
  margin:-2px 0 13px;flex:0 0 auto}

/* --- bloco de quem só lê ------------------------------------ */
.area-administracao .lf-sem{flex:0 0 auto;border:1px solid var(--borda-padrao);
  border-radius:var(--r-painel);background:var(--fundo-card);display:flex;
  flex-direction:column;align-items:center;justify-content:center;gap:9px;
  text-align:center;padding:24px;margin-bottom:16px}
.area-administracao .lf-sem .caixa{width:44px;height:44px}
.area-administracao .lf-sem .caixa .i{width:19px;height:19px}
.area-administracao .lf-sem p{font-size:13px;color:var(--txt-apoio);max-width:460px;line-height:1.5}
.area-administracao .lf-sem p b{display:block;font-size:14.5px;font-weight:600;
  color:var(--txt-forte);margin-bottom:3px;letter-spacing:-.02em}

/* --- celular ------------------------------------------------ */
@media (max-width:1180px){
  .area-administracao .lf-duplo{grid-template-columns:1fr;min-height:0}
  .area-administracao .lf-par{grid-template-columns:1fr}
}
@media (max-width:860px){
  .area-administracao .lf-duplo>.painel,.area-administracao .lf-par>.painel{min-height:0}
  .area-administracao .lf-campos{grid-template-columns:1fr}
  .area-administracao .lf-busca{width:100%;min-height:44px}
  .area-administracao .lf-sw{width:44px;height:44px}
  .area-administracao .lf-mx{width:44px;height:44px}
  .area-administracao .acoesl .bt{min-height:44px}
  .area-administracao .lf-ident{flex-direction:column;gap:12px}
  .area-administracao .lf-ident .div{width:auto;height:1px}
}

/* --- etiqueta de ação especial: nome longo quebra em vez de
       invadir a coluna vizinha (a base trava .etq em nowrap) --- */
.area-administracao .etqs2 .etq{white-space:normal;text-align:left}
.area-administracao .tab tbody td{overflow-wrap:anywhere}

/* ============================================================
   MEDIDO NO CELULAR (390 px): a mesma correção da Biblioteca —
   o subcartão de identificação vira uma coluna, e o alvo de
   toque de 44 px alcança o link da faixa e o pé do cartão.
   ============================================================ */
@media (max-width:860px){
  .area-administracao .subcartao{flex-direction:column;gap:12px}
  .area-administracao .subcartao .div{width:auto;height:1px}
  .area-administracao .subcartao .col{min-width:0}
  .area-administracao .faixa a{display:inline-block;padding:12px 0;line-height:20px}
  .area-administracao .kpi .baixo{min-height:44px}
}