/* ================= e10: rotas, coletores, carga e transmissões, planilha manual, OS da crítica =================
   Plano: auditoria/evidencias-construcao/e10/PLANO-VISUAL.md. Só os tokens da e03.
   Ordem: base → componentes → @media (celular por último). */

.lc-duas { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: var(--esp-4); align-items: start; margin-bottom: var(--esp-4); }
.lc-duas > * { min-width: 0; }
.lc-duas .bloco { margin-bottom: var(--esp-4); }
.lc-rotas > div:first-child .bloco-tabela { margin-bottom: var(--esp-4); }
.lc-editor { display: grid; grid-template-columns: minmax(300px, 1fr) minmax(0, 1.9fr); gap: var(--esp-4); align-items: start; }
.lc-editor > .bloco { margin-bottom: 0; min-width: 0; }
.lc-editor > .bloco:first-child { position: sticky; top: 76px; }
.lc-carga { grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); }
.lc-topo { display: flex; align-items: center; justify-content: space-between; gap: var(--esp-3); margin: 0 0 var(--esp-3); }
.lc-topo h3 { margin: 0; font-size: var(--t-bloco); font-weight: 600; }
.lc-acoes { display: flex; flex-wrap: wrap; gap: var(--esp-3); align-items: center; justify-content: flex-end; margin-top: var(--esp-4); }
.lc-acoes .dica { margin: 0 auto 0 0; }
.lc-serie { font-variant-numeric: tabular-nums; letter-spacing: .01em; }
tr.lc-escolhida td { background: var(--azul-claro-fundo); }
tr.lc-escolhida td:first-child { box-shadow: inset 3px 0 0 var(--azul); }
.lc-faixa .pc-busca-linha > button { margin-left: auto; }
.lc-rotulo-escuro { color: #C9D4E3; margin-top: 0; }

/* ---------- régua da jornada ---------- */
.lc-jornada { display: flex; align-items: center; gap: var(--esp-3); min-width: 150px; }
.lc-jornada-barra { position: relative; flex: 1 1 90px; height: 8px; border-radius: 999px; background: #E3E8EF; overflow: hidden; }
.lc-jornada-barra i { position: absolute; inset: 0 auto 0 0; border-radius: inherit; background: var(--ok); }
.lc-jornada.alerta .lc-jornada-barra i { background: #E3A93B; }
.lc-jornada.erro .lc-jornada-barra i { background: var(--erro); }
.lc-jornada-txt { font-size: var(--t-nota); color: var(--apoio); white-space: nowrap; font-variant-numeric: tabular-nums; }
.lc-jornada-txt b { color: var(--tinta); font-size: var(--t-rotulo); }
.bloco-corpo > .lc-jornada { margin-bottom: var(--esp-4); }

/* ---------- o percurso: uma linha vertical com uma parada por ligação ---------- */
ol.lc-percurso { list-style: none; margin: 0; padding: 0; position: relative; }
.lc-parada { position: relative; display: grid; grid-template-columns: auto 30px minmax(0, 1fr) auto; gap: var(--esp-3); align-items: center;
  padding: 8px 6px 8px 0; border-radius: var(--raio-controle); background: var(--branco); }
.lc-parada + .lc-parada { margin-top: 2px; }
/* o traço que liga as paradas passa por trás do número */
.lc-parada::before { content: ''; position: absolute; top: 0; bottom: 0; left: calc(24px + var(--esp-3) + 14px); width: 2px; background: #C8D6E8; z-index: 0; }
.lc-parada:first-child::before { top: 50%; }
.lc-parada:last-child::before { bottom: 50%; }
.lc-parada:only-child::before { display: none; }
.lc-alca { display: inline-flex; width: 24px; color: #9AA8BA; cursor: grab; }
.lc-alca .icone { width: 18px; height: 18px; }
.lc-num { position: relative; z-index: 1; display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 999px;
  background: var(--branco); border: 2px solid var(--azul); color: var(--azul); font-size: var(--t-nota); font-weight: 600; font-variant-numeric: tabular-nums; }
.lc-parada:first-child .lc-num { background: var(--azul); color: var(--branco); }
.lc-parada-txt { min-width: 0; font-size: var(--t-corpo); }
.lc-parada-txt p { margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lc-parada-txt span { color: var(--apoio); }
.lc-parada-txt small { display: block; color: var(--apoio); font-size: var(--t-nota); overflow-wrap: anywhere; }
.lc-parada-acoes { display: flex; gap: 4px; align-items: center; }
button.lc-seta { width: 34px; padding: 0; justify-content: center; }
button.lc-seta .icone { margin: 0; width: 16px; height: 16px; }
select.lc-mover { width: 150px; min-height: 34px; height: 34px; font-size: var(--t-rotulo); padding: 0 8px; }
.lc-parada.arrastando { opacity: .55; box-shadow: var(--sombra); }
.lc-parada:hover { background: var(--fundo-suave); }
.lc-vazio { color: var(--apoio); padding: var(--esp-4) 0; }

/* ---------- coletores: fichas técnicas dos modelos ---------- */
ul.lc-modelos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--esp-3); }
.lc-modelos li { border: 1px solid var(--borda); border-left: 3px solid var(--agua); border-radius: var(--raio-controle); padding: var(--esp-3) var(--esp-4); min-width: 0; }
.lc-modelos b { display: block; font-size: var(--t-corpo); }
.lc-modelos li > span { display: block; font-size: var(--t-nota); color: var(--apoio); margin-bottom: var(--esp-2); }
.lc-modelos dl { margin: 0; display: grid; gap: 2px; }
.lc-modelos dl div { display: flex; justify-content: space-between; gap: var(--esp-3); font-size: var(--t-rotulo); }
.lc-modelos dt { color: var(--apoio); }
.lc-modelos dd { margin: 0; text-align: right; overflow-wrap: anywhere; min-width: 0; }

/* ---------- o dia de cada rota ---------- */
ul.lc-dias { list-style: none; margin: 0; padding: 0; }
.lc-dia { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(0, 1.6fr) auto; grid-template-areas: 'rota barra sit' 'rota num horas';
  gap: 6px var(--esp-4); align-items: center; padding: 14px 20px; border-top: 1px solid #EEF1F5; }
.lc-dia:first-child { border-top: 0; }
.lc-dia-rota { grid-area: rota; min-width: 0; }
.lc-dia-rota b { display: block; font-size: var(--t-corpo); }
.lc-dia-rota > span { font-size: var(--t-nota); color: var(--apoio); }
.lc-dia-barra { grid-area: barra; display: flex; height: 12px; border-radius: 999px; background: #EEF1F5; overflow: hidden; }
.lc-dia-barra i { display: block; height: 100%; width: var(--w); flex: none; animation: lc-cresce .3s var(--ease) both; transform-origin: left; }
.lc-dia-barra i.l { background: var(--azul); }
.lc-dia-barra i.o { background: #E3A93B; }
.lc-dia-barra i.p { background: repeating-linear-gradient(-45deg, #D5DDE8 0 4px, #EEF1F5 4px 8px); }
.lc-dia-barra i.s { background: transparent; border: 1px dashed var(--borda-forte); border-radius: 999px; box-sizing: border-box; animation: none; }
@keyframes lc-cresce { from { transform: scaleX(0); } }
.lc-dia-num { grid-area: num; font-size: var(--t-rotulo); color: var(--apoio); font-variant-numeric: tabular-nums; }
.lc-dia-num b { color: var(--tinta); font-size: var(--t-corpo); }
.lc-dia-sit { grid-area: sit; justify-self: end; }
ol.lc-horas { grid-area: horas; list-style: none; margin: 0; padding: 0; display: flex; gap: var(--esp-4); justify-self: end; }
.lc-horas li { font-size: var(--t-rotulo); font-variant-numeric: tabular-nums; white-space: nowrap; }
.lc-horas span { display: block; font-size: var(--t-nota); color: var(--apoio); }

fieldset.lc-marcar { border: 0; margin: var(--esp-3) 0 0; padding: 0; min-width: 0; }
.lc-marcar legend { font-size: var(--t-rotulo); font-weight: 500; color: #33445C; padding: 0; margin-bottom: 6px; }
.lc-marcar label { display: flex; gap: var(--esp-3); align-items: center; margin: 0; padding: 8px 4px; border-bottom: 1px solid #EEF1F5; font-weight: 400; cursor: pointer; }
.lc-marcar input { width: auto; min-height: 0; margin: 0; }
.lc-marcar label:has(input:disabled) { color: var(--apoio); cursor: default; }
.lc-marcar b { display: block; font-weight: 600; font-size: var(--t-corpo); }
.lc-marcar small { color: var(--apoio); font-size: var(--t-nota); }

/* ---------- planilha: grade de digitação ---------- */
ol.lc-grade { list-style: none; margin: var(--esp-3) 0 0; padding: 0; }
.lc-grade-linha { display: grid; grid-template-columns: 30px minmax(0, 1fr) 120px 190px minmax(90px, auto); gap: var(--esp-3); align-items: center; padding: 8px 0; border-top: 1px solid #EEF1F5; }
.lc-grade-linha .lc-num { width: 26px; height: 26px; border-width: 1.5px; }
.lc-grade-lig { min-width: 0; font-size: var(--t-corpo); }
.lc-grade-lig span { color: var(--apoio); }
.lc-grade-lig small { display: block; font-size: var(--t-nota); color: var(--apoio); font-variant-numeric: tabular-nums; }
.lc-grade-linha input.lc-leitura { font-variant-numeric: tabular-nums; text-align: right; }
.lc-grade-linha.fora input.lc-leitura { border-color: #E3A93B; box-shadow: 0 0 0 3px var(--alerta-fundo); }
.lc-grade-linha.lancada .lc-num { background: var(--ok); border-color: var(--ok); color: var(--branco); }
.lc-resultado { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.lc-resultado small { font-size: var(--t-nota); color: var(--apoio); }

/* ---------- OS da crítica ---------- */
.lc-check input { width: 18px; height: 18px; min-height: 0; margin: 0; }
.lc-emitir { display: flex; flex-wrap: wrap; gap: var(--esp-3); align-items: center; justify-content: flex-end; border-top: 1px solid var(--borda); }
.lc-emitir .segmento { margin-right: auto; }
#os-msg { flex-basis: 100%; order: 3; }
#os-msg:empty { display: none; }

/* ---------- ficha: aba Leituras com a legenda de cores ---------- */
.lc-legenda { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: var(--t-nota); color: var(--apoio); padding-bottom: 0; }
.lc-leg { display: inline-flex; align-items: center; gap: 6px; }
.lc-leg i { width: 12px; height: 12px; border-radius: 3px; flex: none; }
.lc-leg.hidrometro_anterior i { background: #9AA8BA; }
.lc-leg.hidrometro_do_mes i { background: var(--azul); }
.lc-leg.leitura_do_mes i { background: var(--agua); }
.lc-leg.foto i { background: var(--branco); border: 1.5px solid var(--tinta); border-radius: 999px; }
.lc-tabela-leituras tr td:first-child { box-shadow: inset 4px 0 0 var(--lc-cor, transparent); }
.lc-tabela-leituras tr.lc-l-hidrometro_anterior { --lc-cor: #9AA8BA; }
.lc-tabela-leituras tr.lc-l-hidrometro_anterior td { color: #56657A; background: #F8F9FB; }
.lc-tabela-leituras tr.lc-l-hidrometro_do_mes { --lc-cor: var(--azul); }
.lc-tabela-leituras tr.lc-l-leitura_do_mes { --lc-cor: var(--agua); }
.lc-tabela-leituras tr.lc-l-leitura_do_mes td { background: #EAF6FD; }
.lc-ficha > .bloco-tabela { margin: 0; box-shadow: none; border-radius: 0 0 var(--raio) var(--raio); }
.lc-mes { display: flex; align-items: center; gap: var(--esp-2); }
button.lc-foto { width: 32px; padding: 0; justify-content: center; }
button.lc-foto .icone { width: 16px; height: 16px; margin: 0; }
.lc-foto-img { display: block; width: 100%; max-width: 480px; height: auto; border-radius: var(--raio-controle); margin: 0 auto var(--esp-3); }

/* ---------- folhas impressas (planilha, ficha, OS) ---------- */
.doc-tabela tr.doc-linha-escrever td { height: 9mm; }
.doc-tabela tr.doc-linha-escrever td:nth-last-child(-n+2) { border-bottom: 1px solid #56657A; }
.doc-planilha .doc-tabela { font-size: 8.5pt; table-layout: fixed; }
.doc-planilha .doc-tabela th, .doc-planilha .doc-tabela td { white-space: normal; padding: 1.2mm 1.4mm; }
.doc-planilha .doc-tabela th:nth-child(1) { width: 6mm; } .doc-planilha .doc-tabela th:nth-child(2) { width: 15mm; }
.doc-planilha .doc-tabela th:nth-child(4) { width: 17mm; } .doc-planilha .doc-tabela th:nth-child(5) { width: 16mm; }
.doc-planilha .doc-tabela th:nth-child(6) { width: 22mm; } .doc-planilha .doc-tabela th:nth-child(7) { width: 20mm; } .doc-planilha .doc-tabela th:nth-child(8) { width: 26mm; }
.doc-leituras { font-size: 7.5pt; }
.doc-leituras th, .doc-leituras td { white-space: normal; padding: 1.2mm 1.1mm; }
.doc-os .doc-tabela { table-layout: fixed; font-size: 8.5pt; }
.doc-os .doc-tabela th, .doc-os .doc-tabela td { white-space: normal; padding: 1.4mm 1.6mm; vertical-align: top; }
.doc-os .doc-tabela th:nth-child(1) { width: 22mm; } .doc-os .doc-tabela th:nth-child(2) { width: 32mm; }
.doc-os .doc-tabela th:nth-child(3) { width: 34mm; } .doc-os .doc-tabela th:nth-child(5) { width: 32mm; }
.doc-os tr.doc-linha-escrever td { height: 12mm; }
.doc-leituras tr.doc-leg-anterior td { color: #56657A; }
.doc-leituras tr td:first-child { border-left: 3px solid transparent; }
.doc-leituras tr.doc-leg-anterior td:first-child { border-left-color: #9AA8BA; }
.doc-leituras tr.doc-leg-atual td:first-child { border-left-color: #1A5FB4; }
.doc-leituras tr.doc-leg-mes td:first-child { border-left-color: #49B3EE; }
ul.doc-legenda { list-style: none; display: flex; flex-wrap: wrap; gap: 2mm 6mm; padding: 0; margin: 2mm 0 0; font-size: 8pt; }
.doc-legenda li { display: inline-flex; align-items: center; gap: 2mm; }
.doc-legenda i { display: inline-block; width: 3mm; height: 3mm; background: #9AA8BA; }
.doc-legenda .doc-leg-atual i { background: #1A5FB4; }
.doc-legenda .doc-leg-mes i { background: #49B3EE; }
.doc-legenda .doc-leg-foto i { background: transparent; border: 1px solid #0B1B33; border-radius: 50%; }

@media (prefers-reduced-motion: reduce) {
  .lc-dia-barra i { animation: none; }
}

@media (max-width: 1100px) {
  .lc-duas, .lc-carga, .lc-editor { grid-template-columns: minmax(0, 1fr); }
  .lc-editor > .bloco:first-child { position: static; }
}

@media (max-width: 640px) {
  .lc-topo { flex-wrap: wrap; }
  .lc-faixa .pc-busca-linha > button { margin-left: 0; width: 100%; }
  .lc-faixa .segmento { width: 100%; }
  .lc-parada { grid-template-columns: 30px minmax(0, 1fr); grid-template-areas: 'num txt' 'acoes acoes'; padding: 10px 0; }
  .lc-parada::before { left: 14px; }
  .lc-alca { display: none; }
  .lc-parada .lc-num { grid-area: num; }
  .lc-parada-txt { grid-area: txt; }
  .lc-parada-txt p { white-space: normal; }
  .lc-parada-acoes { grid-area: acoes; padding-left: calc(30px + var(--esp-3)); }
  button.lc-seta { width: 44px; }
  select.lc-mover { flex: 1 1 auto; width: auto; min-width: 0; height: 44px; min-height: 44px; }
  .lc-dia { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: 'rota sit' 'barra barra' 'num num' 'horas horas'; padding: 14px 16px; }
  ol.lc-horas { justify-self: start; flex-wrap: wrap; gap: var(--esp-2) var(--esp-4); }
  .lc-grade-linha { grid-template-columns: 26px minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: 'num lig lig' '. lei oco' '. res res'; }
  .lc-grade-linha .lc-num { grid-area: num; }
  .lc-grade-lig { grid-area: lig; }
  .lc-grade-linha input.lc-leitura { grid-area: lei; }
  .lc-grade-linha select.lc-ocorrencia { grid-area: oco; min-width: 0; }
  .lc-resultado { grid-area: res; flex-direction: row; align-items: center; gap: var(--esp-2); }
  .lc-resultado:empty { display: none; }
  .lc-emitir { justify-content: stretch; }
  .lc-emitir .segmento { width: 100%; margin-right: 0; }
  .lc-emitir button { width: 100%; }
  .lc-tabela-leituras tr td:first-child { box-shadow: none; }
  .lc-tabela-leituras tr { border-left: 4px solid var(--lc-cor, var(--borda)); }
  .lc-jornada { min-width: 0; flex: 1 1 auto; justify-content: flex-end; }
  .lc-jornada-barra { flex: 1 1 60px; max-width: 120px; }
  .lc-jornada-txt { white-space: normal; }
}
