/*
 * Checklist ESEN — protótipo (Etapa A)
 * telas/novo-servico.css — #/novo-servico e #/servicos/:codigo/preencher (js/telas/novo-servico.js)
 * Só tokens de css/base.css; componentes e áreas do modo foco vêm de componentes.css e layout.css.
 * Prefixo das classes próprias: .novo-
 */

/* =========================================================================
   NOVO SERVIÇO — formulário (desktop) e etapas (toque)
   ========================================================================= */
.novo-grade { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-8); align-items: start; }
.novo-aside { display: none; }
@media (min-width: 1200px) {
  .novo-grade { grid-template-columns: minmax(0, var(--largura-formulario)) minmax(260px, 360px); }
  .novo-aside { display: grid; gap: var(--esp-5); position: sticky; top: calc(var(--altura-barra-superior) + var(--esp-5)); }
}
.novo-form { padding-bottom: var(--esp-4); }
.novo-form__secao { display: flex; align-items: baseline; gap: var(--esp-3); padding-top: var(--esp-6); border-top: var(--borda-largura) solid var(--cor-borda-sutil); }
.novo-form > .formulario__nota + .novo-form__secao { padding-top: 0; border-top: 0; }
.novo-num {
  display: inline-flex; align-items: center; justify-content: center; flex: none; width: 24px; height: 24px;
  border: var(--borda-largura) solid var(--cor-borda-controle); border-radius: var(--raio-1);
  font-family: var(--fonte-mono); font-size: var(--fs-rotulo); line-height: 1; font-weight: var(--peso-medio); color: var(--cor-texto-2);
}
.novo-bloco { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-5); min-width: 0; }
.novo-nota { font-size: var(--fs-legenda); line-height: var(--lh-legenda); color: var(--cor-texto-2); }

/* Tipos de serviço: grade de cartões (2 colunas no desktop) */
@media (min-width: 1024px) {
  .novo-tipos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .novo-tipos .opcao-toque { align-items: flex-start; min-height: 88px; padding: var(--esp-3) var(--esp-4); }
  .novo-tipos .opcao-toque__icone { margin-top: 2px; }
}

/* Usina escolhida */
.novo-usina { display: grid; gap: var(--esp-3); padding: var(--esp-4); background: var(--cor-superficie-1); border: var(--borda-largura) solid var(--cor-borda-sutil); border-radius: var(--raio-3); }
.novo-usina__titulo { display: flex; flex-wrap: wrap; align-items: center; gap: var(--esp-2); font-weight: var(--peso-forte); }
.novo-usina__titulo .icone { color: var(--cor-texto-3); }
.novo-usina__titulo .codigo { color: var(--cor-texto-2); }
.novo-usina__inversores { display: grid; gap: var(--esp-1); }
.novo-usina .ficha { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--esp-3) var(--esp-6); }

/* Data com atalhos */
.novo-data__linha { display: flex; flex-wrap: wrap; align-items: center; gap: var(--esp-2); }
.novo-data__campo { width: 176px; }
@media (max-width: 1023px) {
  .novo-data__linha { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; }
  .novo-data__campo { width: auto; }
}

/* Equipamentos */
.novo-equip__grupo { margin-top: var(--esp-1); font-size: var(--fs-legenda); line-height: var(--lh-legenda); font-weight: var(--peso-forte); color: var(--cor-texto-3); }
.novo-equip__lista { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 var(--esp-6); }
.novo-equip__lista .marcar { align-items: flex-start; padding: var(--esp-2) 0; }
.novo-equip__lista .marcar__caixa { margin-top: 0; }
@media (min-width: 768px) { .novo-equip__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.novo-equip__outro { display: grid; gap: 6px; justify-items: start; margin-top: var(--esp-1); }
.novo-equip__outro > .btn--fantasma { margin-left: -14px; }
@media (max-width: 1023px) { .novo-equip__outro > .btn--fantasma { margin-left: calc(-1 * var(--esp-5)); } }
.novo-equip__outro-linha { display: flex; gap: var(--esp-2); width: 100%; max-width: 480px; }
.novo-equip__outro-linha .entrada { flex: 1; min-width: 0; }

/* Resumo lateral (≥ 1200) */
.novo-aside__vazio { font-size: var(--fs-corpo); }
.novo-aside__modelo { display: grid; gap: var(--esp-3); }
.novo-aside__linha { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--esp-2); }
.novo-aside__meta, .novo-aside__nota { font-size: var(--fs-legenda); line-height: var(--lh-legenda); color: var(--cor-texto-2); }
.novo-aside__nota { color: var(--cor-texto-3); }
.novo-aside__secoes { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; border-top: var(--borda-largura) solid var(--cor-borda-sutil); }
.novo-aside__secoes > li {
  display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; align-items: center; gap: var(--esp-2);
  min-height: 32px; padding: var(--esp-1) 0; border-bottom: var(--borda-largura) solid var(--cor-borda-sutil); font-size: var(--fs-rotulo); line-height: var(--lh-rotulo);
}
.novo-aside__num { font-family: var(--fonte-mono); color: var(--cor-texto-3); }
.novo-aside__nome { min-width: 0; }
.novo-aside__qtd { display: inline-flex; align-items: center; gap: var(--esp-1); color: var(--cor-texto-3); white-space: nowrap; font-variant-numeric: tabular-nums; }

/* Rodapé fixo do formulário (desktop) */
.novo-rodape__texto { display: inline-flex; align-items: center; gap: var(--esp-2); font-size: var(--fs-rotulo); line-height: var(--lh-rotulo); color: var(--cor-texto-2); }
.novo-rodape__texto .icone { color: var(--cor-texto-3); flex: none; }

/* Etapas no toque */
.novo-foco .foco__corpo { width: 100%; max-width: var(--largura-formulario); margin: 0 auto; }
/* Rolagem até um erro: não esconder o campo sob o cabeçalho fixo nem sob a barra de ação */
.novo-foco .foco__corpo * { scroll-margin-top: var(--esp-4); scroll-margin-bottom: calc(var(--altura-barra-acao) + var(--esp-4)); }
.novo-preencher * { scroll-margin-bottom: calc(var(--altura-barra-acao) + var(--esp-4)); }
.novo-foco h1.foco__titulo { margin: 0; }
.novo-etapa { gap: var(--esp-5); }
.novo-barra__nota { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--fs-legenda-toque); line-height: var(--lh-legenda-toque); color: var(--cor-texto-3); }
.novo-conferir { display: grid; gap: var(--esp-3); padding: var(--esp-4); background: var(--cor-superficie-1); border: var(--borda-largura) solid var(--cor-borda-sutil); border-radius: var(--raio-3); }
.novo-conferir__titulo { font-size: var(--fs-secao-toque); line-height: var(--lh-secao-toque); font-weight: var(--peso-forte); }

/* =========================================================================
   PREENCHIMENTO
   ========================================================================= */
.novo-secao-desc { font-size: var(--fs-legenda-toque); line-height: var(--lh-legenda-toque); color: var(--cor-texto-2); }
.novo-itens { display: grid; }
.novo-corpo > .aviso, .novo-principal > .aviso { margin: 0; }

/* Item */
.novo-item { position: relative; }
.novo-item__pulado { color: var(--cor-processo-texto); }
.novo-item__controle { min-width: 0; }
.novo-item__acoes { display: flex; flex-wrap: wrap; align-items: center; gap: var(--esp-2); margin-left: calc(-1 * var(--esp-2)); }
.novo-item__acoes:empty { display: none; }
.novo-item [data-obs]:empty, .novo-item [data-fotos-item]:empty, .novo-item [data-erro-item]:empty { display: none; }
.novo-item--erro .resposta__opcao[aria-checked="false"] { border-color: var(--cor-perigo-texto); }
.novo-item--erro .opcao-toque { border-color: var(--cor-perigo-borda); }
.novo-item--erro .entrada { border-color: var(--cor-perigo-texto); }
.novo-erro-item { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--esp-2) var(--esp-3); }
.novo-foto-item { position: relative; cursor: pointer; }
.novo-foto-item > input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.novo-foto-item:focus-within { outline: var(--borda-foco) solid var(--cor-foco); outline-offset: var(--foco-afastamento); }
.novo-fotos-item { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); max-width: 420px; }

/* Fotos */
.novo-fotos-area { display: grid; gap: var(--esp-3); min-width: 0; }
.novo-fotos-area:empty { display: none; }
.novo-falhas { display: grid; gap: var(--esp-2); padding: var(--esp-3); background: var(--cor-perigo-fundo); border-left: var(--borda-marcador) solid var(--cor-perigo); border-radius: var(--raio-2); }
.novo-fotos-area [data-erro-fotos]:empty { display: none; }

/* Barra de ação (toque): o estado longo de falha esconde a posição para não quebrar a linha */
.novo-barra__salv { flex: 1 1 auto; min-width: 0; }
.novo-foco .barra-acao__estado:has(.salvamento--erro, .salvamento--offline) .barra-acao__posicao { display: none; }
.novo-foco .salvamento--erro, .novo-foco .salvamento--offline {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; width: 100%; font-size: var(--fs-rotulo);
}
.novo-foco .salvamento--erro .btn, .novo-foco .salvamento--offline .btn { margin-left: 0; }
/* Com falha, a barra fica mais alta (texto em duas linhas + "Tentar novamente"): reserva o espaço no fim da tela */
.app--foco .novo-foco--preencher:has(.salvamento--erro, .salvamento--offline) { padding-bottom: calc(var(--altura-barra-acao) + var(--altura-controle-toque) + var(--esp-4)); }

/* Lista de seções (índice no desktop e folha "Seções" no toque) */
.novo-secoes { margin: 0; padding: 0; list-style: none; }
.novo-secoes > li + li { border-top: var(--borda-largura) solid var(--cor-borda-sutil); }
.novo-secoes__item {
  position: relative; display: grid; grid-template-columns: 24px minmax(0, 1fr) 20px; align-items: center; gap: var(--esp-3);
  width: 100%; min-height: 52px; padding: var(--esp-2) var(--esp-4); color: var(--cor-texto); text-align: left;
  transition: background-color var(--dur-rapida);
}
.novo-secoes__item:hover { background: var(--cor-superficie-2); }
.novo-secoes__item:focus-visible { outline-offset: -2px; }
.novo-secoes__item--atual { background: var(--cor-superficie-3); }
.novo-secoes__item--atual::before { content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: var(--borda-marcador); background: var(--cor-destaque); }
.novo-secoes__item--atual:hover { background: var(--cor-superficie-3); }
.novo-secoes__num { display: inline-flex; justify-content: center; font-family: var(--fonte-mono); font-size: var(--fs-rotulo); font-weight: var(--peso-medio); color: var(--cor-texto-3); }
.novo-secoes__item--atual .novo-secoes__num { color: var(--cor-destaque); }
.novo-secoes__texto { display: grid; gap: 2px; min-width: 0; }
.novo-secoes__titulo { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--fs-rotulo); line-height: 18px; font-weight: var(--peso-forte); }
.novo-secoes__item--atual .novo-secoes__titulo { color: var(--cor-texto); }
.novo-secoes__meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--esp-1) var(--esp-2); font-size: var(--fs-legenda); line-height: var(--lh-legenda); color: var(--cor-texto-2); font-variant-numeric: tabular-nums; }
.novo-secoes__meta > .icone { color: var(--cor-texto-3); }
.novo-secoes__estado { display: inline-flex; justify-content: center; }
.novo-secoes__item--revisao { border-top: var(--borda-largura) solid var(--cor-borda); }
@media (max-width: 1023px) {
  .novo-secoes__item { min-height: var(--altura-controle-toque); padding: var(--esp-2) var(--esp-4); grid-template-columns: 28px minmax(0, 1fr) 24px; }
  .novo-secoes__num { font-size: var(--fs-legenda-toque); }
  .novo-secoes__titulo { font-size: var(--fs-corpo-toque); line-height: 22px; white-space: normal; }
  .novo-secoes__meta { font-size: var(--fs-legenda-toque); line-height: var(--lh-legenda-toque); }
  .novo-secoes__estado .icone { width: 22px; height: 22px; }
}

/* Desktop: índice, progresso geral e seção */
.novo-indice .painel__cab { min-height: 48px; }
.novo-indice__modelo { display: flex; align-items: center; gap: var(--esp-2); padding: var(--esp-3) var(--esp-4); border-top: var(--borda-largura) solid var(--cor-borda-sutil); font-size: var(--fs-legenda); line-height: var(--lh-legenda); color: var(--cor-texto-3); }
.novo-indice__modelo .icone { flex: none; }
.novo-geral { display: flex; flex-wrap: wrap; align-items: center; gap: var(--esp-3) var(--esp-6); }
.novo-geral__barra { flex: 1 1 320px; max-width: 480px; }
.novo-geral__nums { display: flex; flex-wrap: wrap; align-items: center; gap: var(--esp-2) var(--esp-5); font-size: var(--fs-rotulo); line-height: var(--lh-rotulo); color: var(--cor-texto-2); font-variant-numeric: tabular-nums; }
.novo-geral__nums > li { display: inline-flex; align-items: center; gap: var(--esp-1); }
.novo-geral__nums .icone { color: var(--cor-texto-3); }
.novo-geral__nums .contagem-nc .icone { color: currentColor; }
.novo-cab-salv:empty { display: none; }
.novo-principal { display: grid; gap: var(--esp-5); min-width: 0; }
.novo-secao__titulo { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--esp-2); }
.novo-secao__num { font-family: var(--fonte-mono); font-size: var(--fs-codigo); font-weight: var(--peso-medio); color: var(--cor-texto-3); }
.novo-secao__resumo { align-self: flex-start; display: inline-flex; flex-wrap: wrap; align-items: center; gap: var(--esp-2); padding-top: 2px; font-size: var(--fs-legenda); line-height: var(--lh-legenda); color: var(--cor-texto-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.novo-secao .painel__cab { align-items: flex-start; }
.novo-secao__corpo { padding-top: 0; padding-bottom: 0; }
.novo-secao__corpo > .novo-fotos-area { padding: var(--esp-4) 0; }
.novo-secao__erro:empty { display: none; }
.novo-secao__erro { padding: 0 var(--esp-4) var(--esp-4); }
.novo-barra .barra-acao__posicao { font-size: var(--fs-rotulo); line-height: var(--lh-rotulo); }
/* Desktop: avisos (toasts) acima da barra de ação, para não cobrir "Próxima seção" / "Iniciar checklist" */
@media (min-width: 1024px) {
  body:has(.novo-preencher, .novo-pagina) .toasts { bottom: calc(var(--altura-controle) + 2 * var(--esp-6)); }
}
/* Toque (inclusive tablet): avisos acima da barra de ação fixa do modo foco */
@media (max-width: 1023px) {
  body:has(.novo-foco) .toasts { bottom: calc(var(--altura-barra-acao) + var(--esp-2) + env(safe-area-inset-bottom)); }
}
@media (min-width: 1024px) {
  .novo-preencher .item-checklist__ajuda { max-width: 64ch; }
  .novo-preencher .opcoes-toque { max-width: 560px; }
  .novo-preencher .novo-item .campo:not(.observacao-livre) { max-width: 560px; }
  .novo-preencher .novo-item .entrada-unidade { max-width: 240px; }
}

/* Revisão */
.novo-revisao { display: grid; gap: var(--esp-4); min-width: 0; }
.novo-revisao__cab { display: grid; gap: var(--esp-1); }
.novo-pendencias:focus-visible { outline: var(--borda-foco) solid var(--cor-foco); outline-offset: var(--foco-afastamento); }
.novo-pendencias:focus:not(:focus-visible) { outline: none; }
.novo-contagens { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--esp-3) var(--esp-6); margin: 0; }
.novo-contagens > div { min-width: 0; }
.novo-contagens dt { font-size: var(--fs-legenda); line-height: var(--lh-legenda); font-weight: var(--peso-forte); color: var(--cor-texto-3); }
.novo-contagens dd { margin: 2px 0 0; font-size: var(--fs-secao); line-height: var(--lh-secao); font-weight: var(--peso-forte); font-variant-numeric: tabular-nums; }
@media (min-width: 768px) { .novo-contagens { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.novo-revisao__secoes { margin: var(--esp-4) calc(-1 * var(--esp-4)) calc(-1 * var(--esp-4)); border-top: var(--borda-largura) solid var(--cor-borda-sutil); }
.novo-revisao__fotos { display: grid; gap: var(--esp-6); }
@media (min-width: 1200px) { .novo-revisao__fotos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.novo-revisao__acao { grid-column: 2 / -1; margin-left: calc(-1 * var(--esp-2)); }
@media (max-width: 1023px) {
  .novo-contagens dt { font-size: var(--fs-legenda-toque); line-height: var(--lh-legenda-toque); }
  .novo-revisao .painel__corpo .aviso { margin: 0; }
}

/* Edição da identificação (modal) */
.novo-editar .novo-equip__lista { grid-template-columns: minmax(0, 1fr); }

/* =========================================================================
   SUCESSO
   ========================================================================= */
.novo-sucesso__corpo { display: grid; gap: var(--esp-5); padding: var(--esp-6); }
.novo-sucesso__topo { display: flex; align-items: center; gap: var(--esp-4); }
.novo-sucesso__icone { display: inline-flex; color: var(--cor-sucesso-texto); }
.novo-sucesso__icone .icone { width: 40px; height: 40px; }
.novo-sucesso__titulos { display: grid; gap: 2px; }
.novo-sucesso__titulos .titulo-pagina { margin: 0; }
.novo-sucesso__codigo { color: var(--cor-texto-2); }
.novo-sucesso__quando { color: var(--cor-texto-2); }
.novo-sucesso__acoes { justify-content: flex-end; padding-top: var(--esp-2); border-top: var(--borda-largura) solid var(--cor-borda-sutil); }
@media (max-width: 767px) {
  .novo-sucesso__corpo { padding: var(--esp-4); }
  .novo-sucesso__acoes { flex-direction: column-reverse; align-items: stretch; }
  .novo-sucesso__acoes > .btn { width: 100%; }
}