.record-stat-row td{padding:0!important}.record-date-title{display:flex;justify-content:space-between;padding:10px 12px 4px;font-size:12px}.record-date-title small{color:var(--muted)}.daily-stats{display:grid;grid-template-columns:repeat(6,1fr) auto;gap:8px;padding:8px 12px 12px;align-items:end}.daily-stats span{font-size:12px}.daily-stats b{display:block;color:#7d8ba0;font-size:9px;text-transform:uppercase;margin-bottom:5px}.daily-stats em{font-style:normal}.record-timeline-row td{padding:0 18px 20px!important}.wide-timeline{display:flex;justify-content:space-around;position:relative;padding-top:12px}.wide-timeline::before{content:"";position:absolute;top:48px;left:10%;right:10%;height:2px;background:#d7dce3}.timeline-point{position:relative;z-index:1;text-align:center;min-width:110px}.timeline-point b,.timeline-point small{display:block;font-size:11px}.timeline-point i{display:block;width:16px;height:16px;border-radius:50%;margin:7px auto 5px;background:#009b71;border:2px solid #fff;box-shadow:0 0 0 1px #009b71}.timeline-point.exit i{background:#ef202b;box-shadow:0 0 0 1px #ef202b}.timeline-point.entry b{color:#009b71}.timeline-point.exit b{color:#ef202b}.point-popover{position:absolute;z-index:4;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(4px);width:165px;padding:10px;border-radius:8px;background:#fff;box-shadow:0 8px 20px #11274333;text-align:left;opacity:0;pointer-events:none;transition:.15s}.timeline-point:hover .point-popover{opacity:1;pointer-events:auto;transform:translateX(-50%)}.point-popover strong,.point-popover small{display:block;font-size:10px}.point-popover small{color:var(--muted);margin:4px 0 8px}.point-popover button{border:0;background:var(--color-primary-soft);color:var(--color-primary);border-radius:var(--radius-pill);font-size:10px;padding:5px 10px;margin-right:4px}@media(max-width:800px){.daily-stats{grid-template-columns:repeat(3,1fr)}.daily-stats .row-button{grid-column:span 3}}

/* Mesmo vocabulário visual do Histórico mobile: pontos pequenos, entrada
   azul, saída vermelha, ajustado com um único anel laranja e reprovado cinza. */
.timeline-point i{
  width:10px!important;
  height:10px!important;
  border:0!important;
  background:var(--color-primary)!important;
  box-shadow:none!important;
}
.timeline-point.exit i{background:#ef202b!important}
.timeline-point.entry b{color:var(--color-primary)!important}
.timeline-point.exit b{color:#ef202b!important}
.timeline-point.point-edited i{
  background:var(--color-primary)!important;
  box-shadow:0 0 0 2px #fff,0 0 0 4px var(--color-edit,#ff6b00)!important;
}
.timeline-point.point-edited.exit i{background:#ef202b!important}
.timeline-point.point-manual i{
  background:var(--color-primary)!important;
  box-shadow:0 0 0 2px #fff,0 0 0 4px var(--color-edit,#ff6b00)!important;
}
.timeline-point.point-manual.exit i{background:#ef202b!important}
.timeline-point.point-rejected i{
  background:#aab4c2!important;
  box-shadow:none!important;
}
.timeline-point.point-rejected b{color:#7c8794!important}
/* O ponto em foco precisa subir com o balão inteiro. Sem elevar também o
   ponto/card pai, as marcações do card seguinte eram pintadas por cima do
   popover maior. */
.record-stat-row.day-card:has(.timeline-point:hover),
.record-stat-row.day-card:has(.timeline-point:focus-within){
  position:relative;
  z-index:30;
}
.timeline-point:hover,
.timeline-point:focus-within{z-index:40!important}
/* .timeline-legend/.timeline-legend-item/.timeline-legend-dot: o layout
   (flex, padding, tamanho, arredondado) só existia num bloco de reports.css
   que foi removido por ter regras de COR mortas/conflitantes (ver
   reports.css) — mas esse mesmo bloco também tinha as únicas regras de
   estrutura da legenda, então removê-lo apagou a legenda inteira (virava
   texto corrido, sem os pontinhos). Reposto aqui, junto com o resto do
   vocabulário visual do popover/timeline que já mora neste arquivo. */
.timeline-legend{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
  padding:8px 12px;
  background:#f8fafc;
  border:1px solid #e2e8f0;
  border-radius:8px;
  font-size:11px;
  color:#475569;
}
.timeline-legend-item{display:inline-flex;align-items:center;gap:6px;font-weight:600}
.timeline-legend-dot{
  display:inline-block!important;
  border-radius:50%!important;
  width:8px!important;
  height:8px!important;
  border:0!important;
}
.timeline-legend-dot.entry{background:var(--color-primary)!important}
.timeline-legend-dot.exit{background:#ef202b!important}
.timeline-legend-dot.edited{
  background:transparent!important;
  border:2px solid var(--color-edit,#ff6b00)!important;
  box-shadow:none!important;
}
.timeline-legend-dot.rejected{background:#aab4c2!important}

/* Os pontos ficam soltos na MESMA área branca da linha de cima (data +
   estatísticas do dia) — antes o conjunto virava uma pílula com fundo e
   borda próprios (#f5f8fc + contorno), o que lia como um card separado,
   "boiando" abaixo do resto. Removido o fundo/borda/arredondado: mesma
   posição e mesmo espaçamento entre os pontos, só sem a caixa em volta. */
.record-timeline-row td{padding:0 18px 20px!important}
.wide-timeline{
  display:flex!important;
  justify-content:flex-start!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:14px!important;
  width:fit-content!important;
  min-height:0!important;
  padding:4px 0 0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
.wide-timeline::before{display:none!important}
.timeline-point{
  display:inline-flex!important;
  align-items:center!important;
  gap:5px!important;
  /* Cada marcação reserva a mesma coluna. Isso mantém os horários seguintes
     no mesmo eixo, mesmo que algum texto/ícone ocupe largura diferente. */
  flex:0 0 50px!important;
  width:50px!important;
  min-width:50px!important;
  text-align:left!important;
}
.timeline-point i{order:1;margin:0!important;flex:0 0 auto}
.wide-timeline .timeline-point b{order:2;color:#3b4c63!important;font-size:12px!important}
.timeline-point>small{display:none!important}
.timeline-point.point-request-pending i{
  background:#aab4c2!important;
  box-shadow:0 0 0 2px #fff,0 0 0 4px var(--color-edit,#ff6b00)!important;
}
.timeline-point.point-request-pending b{color:#667383!important}

/* Card do popover de ponto (aparece ao passar o mouse): largura maior pra
   caber "Editar" + "Reprovar" + o botão de foto numa linha só, e a linha de
   ações virou flex com gap — antes usava só margin-right no botão, o que
   deixava o botão de foto "sobrando" espremido numa segunda linha, com
   espaçamento diferente dos outros dois. */
.point-popover{
  width:200px!important;
  padding:12px!important;
}
.point-popover strong{margin-bottom:2px!important}
.point-popover>div{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:6px!important;
  margin-top:2px!important;
}
.point-popover button{margin-right:0!important;white-space:nowrap!important}

/* Ponta de turno que atravessa a meia-noite. A cor base do ponto NÃO muda
   (entrada azul, saída vermelha continuam sendo a informação principal, e o
   verde/vermelho da pílula já significa outra coisa: consistência do dia). O
   que marca a virada é um anel discreto, no mesmo vocabulário do anel laranja
   de "ajustado". */
.timeline-point.point-crossing i{
  box-shadow:0 0 0 2px #fff,0 0 0 4px #7b8cff!important;
}
.point-popover .point-crossing-note{
  display:block!important;
  margin-top:4px!important;
  color:#4d5bbf!important;
  font-weight:700!important;
  line-height:1.35!important;
}
