/*
 * Checklist ESEN — protótipo (Etapa A)
 * telas/execucao.css — #/servicos/:codigo/preencher (js/telas/execucao.js). Prefixo .exec-; só tokens de base.css.
 * Celular/tablet: modo foco (layout.css .foco / .barra-acao). Desktop: .layout-indice com índice à esquerda.
 */

/* =========================================================================
   MOLDURA
   ========================================================================= */
.exec-titulo { display: flex; align-items: center; gap: var(--esp-3); }
.exec-titulo > .icone { flex: none; width: 24px; height: 24px; color: var(--cor-texto-2); }
.exec-titulo > span { min-width: 0; }
.exec-salv { min-width: 0; }
.exec-principal { display: flex; flex-direction: column; gap: var(--esp-5); min-width: 0; }
.exec-progresso-desk {
  display: grid; gap: var(--esp-2); padding: var(--esp-3) var(--esp-4);
  background: var(--cor-superficie-1); border: var(--borda-largura) solid var(--cor-borda-sutil); border-radius: var(--raio-3);
}
.exec-progresso-desk .foco__contagem { font-size: var(--fs-rotulo); line-height: var(--lh-rotulo); }
.exec-progresso-desk .foco__secao-nome { font-size: var(--fs-painel); }
.exec-progresso-desk .foco__secao-pos { font-size: var(--fs-legenda); }
@media (min-width: 1024px) {
  .exec .layout-indice { grid-template-columns: 280px minmax(0, 760px); }
}

/* Índice dos passos */
.exec-indice { display: flex; flex-direction: column; gap: var(--esp-2); min-width: 0; }
@media (min-width: 1024px) { .exec-indice { max-height: calc(100vh - var(--altura-barra-superior) - 120px); overflow-y: auto; padding-right: var(--esp-1); } }
.exec-indice__titulo { font-size: var(--fs-rotulo); line-height: var(--lh-rotulo); font-weight: var(--peso-forte); color: var(--cor-texto-2); }
.exec-indice__grupo { margin-top: var(--esp-2); font-size: var(--fs-legenda); line-height: var(--lh-legenda); font-weight: var(--peso-forte); color: var(--cor-texto-3); text-transform: uppercase; letter-spacing: 0.04em; }
.exec-indice__lista { display: flex; flex-direction: column; gap: 2px; margin: 0; padding: 0; list-style: none; }
.exec-indice__lista--fim { margin-top: var(--esp-2); }
.exec-indice__item {
  display: flex; align-items: flex-start; gap: var(--esp-2); width: 100%; min-height: 36px; padding: 6px var(--esp-2);
  border-radius: var(--raio-2); border-left: var(--borda-marcador) solid transparent; color: var(--cor-texto-2); text-align: left;
  font-size: var(--fs-rotulo); line-height: 18px;
}
.exec-indice__item:hover { background: var(--cor-superficie-2); color: var(--cor-texto); }
.exec-indice__item--atual { background: var(--cor-destaque-fundo); border-left-color: var(--cor-destaque); color: var(--cor-texto); font-weight: var(--peso-forte); }
.exec-indice__icone { flex: none; display: inline-flex; margin-top: 1px; }
.exec-indice__icone .icone { width: 16px; height: 16px; stroke-width: var(--traco-icone-status); }
.exec-indice__item--feito .exec-indice__icone { color: var(--cor-sucesso-texto); }
.exec-indice__item--incompleto .exec-indice__icone { color: var(--cor-processo-texto); }
.exec-indice__item--vazio .exec-indice__icone, .exec-indice__item--bloqueado .exec-indice__icone { color: var(--cor-texto-3); }
.exec-indice__item--na .exec-indice__icone, .exec-indice__item--ne .exec-indice__icone { color: var(--cor-texto-2); }
.exec-indice__item--nc .exec-indice__icone, .exec-indice__item--critico .exec-indice__icone { color: var(--cor-perigo-texto); }
.exec-indice__item--critico { color: var(--cor-perigo-texto); }
.exec-indice__texto { display: flex; gap: var(--esp-2); min-width: 0; }
.exec-indice__num { flex: none; font-family: var(--fonte-mono); font-variant-numeric: normal; font-weight: var(--peso-medio); color: var(--cor-texto-3); }
.exec-indice__nome { min-width: 0; overflow-wrap: anywhere; }
.exec-indice__suspender { margin-top: var(--esp-3); }
.exec-indice--folha .exec-indice__item { min-height: var(--alvo-minimo); font-size: var(--fs-legenda-toque); line-height: 20px; padding: var(--esp-2) var(--esp-3); }

/* =========================================================================
   PASSO (cabeçalho, instrução, alertas)
   ========================================================================= */
.exec-passo { display: flex; flex-direction: column; gap: var(--esp-5); min-width: 0; }
.exec-rotulo { font-size: var(--fs-legenda); line-height: var(--lh-legenda); font-weight: var(--peso-forte); color: var(--cor-texto-3); text-transform: uppercase; letter-spacing: 0.04em; }
.exec-rotulo .mono { color: var(--cor-texto-2); letter-spacing: 0; }
.exec-h2 { font-family: var(--fonte-titulo); font-size: var(--fs-pagina); line-height: var(--lh-pagina); font-weight: var(--peso-forte); letter-spacing: -0.01em; text-wrap: balance; }
.exec-h2:focus { outline: none; }
.exec-h3 { display: inline-flex; align-items: center; gap: var(--esp-2); font-size: var(--fs-painel); line-height: var(--lh-painel); font-weight: var(--peso-forte); }
.exec-h3 .icone { color: var(--cor-texto-2); }
.exec-etapa__cab { display: flex; flex-direction: column; gap: var(--esp-2); }

.exec-chips { display: flex; flex-wrap: wrap; gap: var(--esp-2); margin-top: var(--esp-1); }
.exec-chip {
  display: inline-flex; align-items: center; gap: 6px; height: var(--altura-badge); padding: 0 var(--esp-2);
  border: var(--borda-largura) solid var(--cor-borda-controle); border-radius: var(--raio-1);
  font-size: var(--fs-legenda); line-height: var(--lh-legenda); font-weight: var(--peso-forte); color: var(--cor-texto);
}
.exec-chip .icone { width: 14px; height: 14px; stroke-width: var(--traco-icone-status); color: var(--cor-texto-2); }
.exec-chip--perfil-E, .exec-chip--perfil-A { border-color: var(--cor-processo-borda); background: var(--cor-processo-fundo); color: var(--cor-processo-texto); }
.exec-chip--perfil-E .icone, .exec-chip--perfil-A .icone { color: var(--cor-processo-texto); }
.exec-chip--perfil-R { border-color: var(--cor-destaque); background: var(--cor-destaque-fundo); }
.exec-chip--perfil-R .icone { color: var(--cor-destaque); }

.exec-instrucao { display: flex; flex-direction: column; gap: var(--esp-3); }
.exec-bloco { display: flex; flex-direction: column; gap: var(--esp-1); }
.exec-bloco__rotulo { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-rotulo); line-height: var(--lh-rotulo); font-weight: var(--peso-forte); color: var(--cor-texto-2); }
.exec-bloco__texto { font-size: var(--fs-secao); line-height: 26px; color: var(--cor-texto); max-width: 68ch; }
.exec-bloco--criterio { padding: var(--esp-3) var(--esp-4); background: var(--cor-sucesso-fundo); border-left: var(--borda-marcador) solid var(--cor-sucesso-borda); border-radius: var(--raio-2); }
.exec-bloco--criterio .exec-bloco__rotulo { color: var(--cor-sucesso-texto); }
.exec-bloco--criterio .exec-bloco__rotulo .icone { stroke-width: var(--traco-icone-status); }
.exec-bloco--criterio .exec-bloco__texto { font-size: var(--fs-corpo); line-height: 22px; }

.exec-detalhes { border: var(--borda-largura) solid var(--cor-borda-sutil); border-radius: var(--raio-2); background: var(--cor-superficie-1); }
.exec-detalhes > summary {
  display: flex; align-items: center; gap: var(--esp-2); min-height: 40px; padding: var(--esp-2) var(--esp-3); cursor: pointer;
  font-size: var(--fs-rotulo); line-height: var(--lh-rotulo); font-weight: var(--peso-forte); color: var(--cor-texto-2); list-style: none;
}
.exec-detalhes > summary::-webkit-details-marker { display: none; }
.exec-detalhes > summary::after { content: '+'; margin-left: auto; font-family: var(--fonte-mono); color: var(--cor-texto-3); }
.exec-detalhes[open] > summary::after { content: '−'; }
.exec-detalhes > summary .icone { color: var(--cor-texto-3); }
.exec-detalhes > :not(summary) { padding: 0 var(--esp-3) var(--esp-3); font-size: var(--fs-corpo); line-height: var(--lh-corpo); }
.exec-detalhes > p + p { padding-top: 0; }
.exec-fontes { display: grid; gap: 2px; margin: 0; padding-left: var(--esp-6); list-style: none; }
.exec-historico { display: grid; gap: var(--esp-1); margin: 0; padding-left: var(--esp-6); }

.exec-alertas { display: flex; flex-direction: column; gap: var(--esp-3); }
.exec-alertas:empty { display: none; }
.exec-critico { display: flex; align-items: flex-start; gap: var(--esp-2); font-size: var(--fs-rotulo); line-height: 18px; color: var(--cor-perigo-texto); font-weight: var(--peso-forte); }
.exec-critico .icone { flex: none; margin-top: 1px; stroke-width: var(--traco-icone-status); }

.exec-bloqueio {
  display: flex; flex-direction: column; gap: var(--esp-3); padding: var(--esp-4);
  background: var(--cor-superficie-1); border: var(--borda-largura) solid var(--cor-perigo-borda); border-left: var(--borda-marcador) solid var(--cor-perigo); border-radius: var(--raio-2);
}
.exec-bloqueio__titulo { display: flex; align-items: center; gap: var(--esp-2); font-size: var(--fs-painel); line-height: var(--lh-painel); font-weight: var(--peso-forte); }
.exec-bloqueio__titulo .icone { color: var(--cor-perigo-texto); }
.exec-bloqueio__lista { display: grid; gap: var(--esp-2); margin: 0; }
.exec-bloqueio__lista dt { font-size: var(--fs-legenda); line-height: var(--lh-legenda); font-weight: var(--peso-forte); color: var(--cor-texto-3); }
.exec-bloqueio__lista dd { margin: 0; font-size: var(--fs-corpo); line-height: var(--lh-corpo); }
.exec-bloqueio__nota { font-size: var(--fs-rotulo); line-height: 18px; color: var(--cor-texto-2); }
.exec-delegacao { display: grid; gap: var(--esp-3); padding-top: var(--esp-3); border-top: var(--borda-largura) solid var(--cor-borda-sutil); }
.exec-delegacao > .btn { justify-self: start; }

/* =========================================================================
   RESPOSTA E CAMPOS CONDICIONAIS
   ========================================================================= */
.exec-resposta { display: flex; flex-direction: column; gap: var(--esp-3); padding-top: var(--esp-4); border-top: var(--borda-largura) solid var(--cor-borda-sutil); }
.exec-resposta__opcoes { --colunas-resposta: 2; }
@media (min-width: 1024px) {
  .exec-resposta__opcoes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); width: 100%; }
  .exec-resposta__opcoes .resposta__opcao { height: 44px; }
}
.exec-condicional:empty { display: none; }
.exec-condicional, .exec-nc { display: flex; flex-direction: column; gap: var(--esp-4); }
.exec-campo-grupo { display: grid; gap: var(--esp-2); }
.exec-severidades { display: grid; gap: var(--intervalo-alvos); }
.exec-duas { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-4); }
@media (min-width: 768px) { .exec-duas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.exec-confirma { display: flex; align-items: flex-start; gap: var(--esp-2); font-size: var(--fs-rotulo); line-height: 18px; color: var(--cor-sucesso-texto); }
.exec-confirma .icone { flex: none; margin-top: 1px; stroke-width: var(--traco-icone-status); }
.exec-pare {
  display: flex; align-items: flex-start; gap: var(--esp-3); padding: var(--esp-4);
  background: var(--cor-perigo-fundo); border: var(--borda-largura) solid var(--cor-perigo-borda); border-radius: var(--raio-2);
}
.exec-pare > .icone { flex: none; color: var(--cor-perigo-texto); stroke-width: var(--traco-icone-status); }
.exec-pare > div { display: flex; flex-direction: column; gap: var(--esp-2); min-width: 0; }
.exec-pare__titulo { font-size: var(--fs-painel); line-height: var(--lh-painel); font-weight: var(--peso-negrito); color: var(--cor-perigo-texto); }
.exec-pare .btn { align-self: flex-start; }
.exec-correcao { display: flex; flex-direction: column; gap: var(--esp-2); }

/* Fotos da etapa */
.exec-fotos, .exec-medicoes { display: flex; flex-direction: column; gap: var(--esp-3); padding-top: var(--esp-4); border-top: var(--borda-largura) solid var(--cor-borda-sutil); }
.exec-fotos__cab { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--esp-1) var(--esp-3); }
.exec-fotos__grade { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--esp-2); }
@media (min-width: 768px) { .exec-fotos__grade { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.exec-fotos__acoes { display: flex; flex-wrap: wrap; align-items: center; gap: var(--esp-2) var(--esp-3); }
.exec-fotos__botao { position: relative; cursor: pointer; }
.exec-fotos__botao:focus-within { outline: var(--borda-foco) solid var(--cor-foco); outline-offset: var(--foco-afastamento); }
.exec-fases { display: inline-flex; flex-wrap: wrap; gap: var(--esp-1); }
.exec-fase { position: relative; cursor: pointer; }
.exec-fase input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.exec-fase:has(input:checked) { background: var(--cor-destaque-fundo); border-color: var(--cor-destaque); font-weight: var(--peso-forte); }
.exec-fase:has(input:focus-visible) { outline: var(--borda-foco) solid var(--cor-foco); outline-offset: var(--foco-afastamento); }
.exec-dispensa { display: flex; flex-direction: column; gap: var(--esp-3); }
.exec-dispensa__campos { padding-left: var(--esp-3); border-left: var(--borda-marcador) solid var(--cor-perigo); }

/* Medições e materiais */
.exec-medicoes__lista, .exec-materiais { display: flex; flex-direction: column; gap: var(--esp-3); margin: 0; padding: 0; list-style: none; }
.exec-medicao, .exec-material { display: flex; flex-direction: column; gap: var(--esp-3); padding: var(--esp-3) var(--esp-4) var(--esp-4); background: var(--cor-superficie-1); border: var(--borda-largura) solid var(--cor-borda-sutil); border-radius: var(--raio-2); }
.exec-medicao__cab { display: flex; align-items: center; justify-content: space-between; gap: var(--esp-2); }
.exec-medicao__num { font-size: var(--fs-rotulo); line-height: var(--lh-rotulo); font-weight: var(--peso-forte); color: var(--cor-texto-2); }
.exec-medicao__grade { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-3) var(--esp-4); }
@media (min-width: 768px) {
  .exec-medicao__grade { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .exec-medicao__largo { grid-column: 1 / -1; }
}
.exec-medicoes > .btn, .exec-fotos > .btn { align-self: flex-start; }

/* Registro, validação e requisitos */
.exec-registro { display: flex; flex-direction: column; gap: var(--esp-2); }
.exec-registro:empty { display: none; }
.exec-registro__linha { display: flex; align-items: flex-start; gap: var(--esp-2); font-size: var(--fs-rotulo); line-height: 18px; }
.exec-registro__linha .icone { flex: none; margin-top: 1px; }
.exec-validacao { display: flex; flex-direction: column; gap: var(--esp-2); padding: var(--esp-3) var(--esp-4); background: var(--cor-processo-fundo); border-left: var(--borda-marcador) solid var(--cor-processo-borda); border-radius: var(--raio-2); }
.exec-validacao > p { display: flex; align-items: flex-start; gap: var(--esp-2); font-size: var(--fs-corpo); line-height: var(--lh-corpo); }
.exec-validacao > p .icone { flex: none; margin-top: 2px; color: var(--cor-processo-texto); }
.exec-validacao--recusada { background: var(--cor-perigo-fundo); border-left-color: var(--cor-perigo); }
.exec-validacao--recusada > p .icone { color: var(--cor-perigo-texto); }
.exec-req { display: flex; align-items: flex-start; gap: var(--esp-2); padding: var(--esp-3) var(--esp-4); border-radius: var(--raio-2); font-size: var(--fs-corpo); line-height: var(--lh-corpo); }
.exec-req .icone { flex: none; margin-top: 2px; stroke-width: var(--traco-icone-status); }
.exec-req--vazio { background: var(--cor-superficie-1); color: var(--cor-texto-2); }
.exec-req--ok { background: var(--cor-sucesso-fundo); color: var(--cor-sucesso-texto); }
.exec-req--falta { flex-direction: column; gap: var(--esp-1); background: var(--cor-superficie-1); border-left: var(--borda-marcador) solid var(--cor-processo-borda); }
.exec-req__titulo { display: flex; align-items: center; gap: var(--esp-2); font-weight: var(--peso-forte); }
.exec-req__titulo .icone { color: var(--cor-processo-texto); margin-top: 0; }
.exec-req ul { margin: 0; padding-left: var(--esp-8); color: var(--cor-texto-2); }

/* =========================================================================
   SEGURANÇA SG-01 a SG-08
   ========================================================================= */
.exec-sg-lista { display: flex; flex-direction: column; gap: var(--esp-3); margin: 0; padding: 0; list-style: none; }
.exec-sg {
  display: flex; flex-direction: column; 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);
}
.exec-sg--nc { border-color: var(--cor-perigo-borda); border-left: var(--borda-marcador) solid var(--cor-perigo); }
.exec-sg--na { background: transparent; border-style: dashed; }
.exec-sg__cab { display: flex; flex-wrap: wrap; align-items: center; gap: var(--esp-2) var(--esp-3); }
.exec-sg__cod { font-size: var(--fs-codigo); line-height: var(--lh-codigo); font-weight: var(--peso-medio); color: var(--cor-texto-2); }
.exec-sg__titulo { font-size: var(--fs-painel); line-height: var(--lh-painel); font-weight: var(--peso-forte); }
.exec-sg__texto { font-size: var(--fs-corpo); line-height: var(--lh-corpo); color: var(--cor-texto); max-width: 68ch; }
.exec-sg--na .exec-sg__texto { color: var(--cor-texto-3); }
.exec-sg__bloqueio { display: flex; align-items: flex-start; gap: var(--esp-2); font-size: var(--fs-rotulo); line-height: 18px; color: var(--cor-texto-2); }
.exec-sg__bloqueio .icone { flex: none; margin-top: 1px; color: var(--cor-texto-3); }
.exec-sg__resp { --colunas-resposta: 3; }
.exec-sg__motivo { display: flex; flex-direction: column; gap: var(--esp-2); }

/* =========================================================================
   CHECK-IN / CHECK-OUT E ENCERRAMENTO
   ========================================================================= */
.exec-gps { display: flex; flex-direction: column; gap: var(--esp-3); }
.exec-gps__texto { font-size: var(--fs-corpo); line-height: var(--lh-corpo); color: var(--cor-texto-2); max-width: 68ch; }
.exec-gps__simular { align-self: flex-start; font-size: var(--fs-rotulo); }
.exec-gps--registrado { flex-direction: row; align-items: flex-start; gap: var(--esp-3); padding: var(--esp-3) var(--esp-4); background: var(--cor-superficie-2); border-radius: var(--raio-2); }
.exec-gps__icone { flex: none; color: var(--cor-texto-2); }
.exec-gps__titulo { font-size: var(--fs-corpo); line-height: var(--lh-corpo); font-weight: var(--peso-forte); overflow-wrap: anywhere; }
.exec-gps__sub { font-size: var(--fs-legenda); line-height: var(--lh-legenda); color: var(--cor-texto-2); }
.exec-pend { white-space: pre-line; font-size: var(--fs-corpo); line-height: var(--lh-corpo); color: var(--cor-texto-2); }

.exec-ass { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--esp-2); padding: var(--esp-3) 0; border-bottom: var(--borda-largura) solid var(--cor-borda-sutil); }
.exec-ass:last-child { border-bottom: 0; }
@media (min-width: 768px) { .exec-ass { grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: var(--esp-4); } }
.exec-ass__rotulo { font-size: var(--fs-corpo); line-height: var(--lh-corpo); font-weight: var(--peso-forte); }
.exec-ass__img { width: 160px; max-width: 100%; height: auto; background: var(--doc-papel); border-radius: var(--raio-1); }
.exec-assinatura { position: relative; }
.exec-assinatura__tela { display: block; width: 100%; height: auto; aspect-ratio: 32 / 11; background: var(--doc-papel); border: var(--borda-largura) solid var(--cor-borda-controle); border-radius: var(--raio-2); touch-action: none; cursor: crosshair; }
.exec-assinatura__limpar { position: absolute; top: var(--esp-1); right: var(--esp-1); background: var(--doc-papel); color: var(--doc-texto); }
.exec-assinatura__limpar:hover { background: var(--doc-cabecalho); }

/* =========================================================================
   REVISÃO E SUCESSO
   ========================================================================= */
.exec-resumo { --colunas-indicadores: 5; }
@media (min-width: 1024px) { .exec-resumo { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.exec-resumo .indicador__valor { font-size: var(--fs-indicador-toque); line-height: var(--lh-indicador-toque); }
.exec-concluir { display: flex; flex-wrap: wrap; gap: var(--esp-2) var(--esp-3); }
@media (max-width: 767px) { .exec-concluir { flex-direction: column; } .exec-concluir > .btn { width: 100%; } }
.exec-lista-pend .pendencia--atencao > .icone:first-child { color: var(--cor-processo-texto); }
.exec-lista-pend p.pendencia { cursor: default; }
.exec-sucesso__topo { display: flex; align-items: center; gap: var(--esp-4); }
.exec-sucesso__topo > .icone { flex: none; }

@media (max-width: 1023px) {
  .exec-h2 { font-size: var(--fs-pagina-toque); line-height: var(--lh-pagina-toque); }
  .exec-bloco__texto { font-size: var(--fs-corpo-toque); line-height: var(--lh-corpo-toque); }
  .exec-bloco--criterio .exec-bloco__texto { font-size: 15px; line-height: 22px; }
  .exec-h3 { font-size: var(--fs-corpo-toque); line-height: var(--lh-corpo-toque); }
  .exec-detalhes > summary { min-height: var(--alvo-minimo); font-size: var(--fs-rotulo-toque); }
  .exec-detalhes > :not(summary) { font-size: 15px; line-height: 22px; }
  .exec-sg__texto, .exec-gps__texto, .exec-req, .exec-bloqueio__lista dd { font-size: 15px; line-height: 22px; }
  .exec-chip { height: var(--altura-badge-toque); font-size: var(--fs-legenda-toque); }
  .exec-indice__item { font-size: var(--fs-legenda-toque); }
}