/* ------------------------------------------------------------------ */
/* Obrify Design System — RDO (Apontamento)                            */
/*                                                                      */
/* Quarta tela migrada (as três primeiras foram Atividades, Cronograma  */
/* e listagem de Obras — ver obrify_atividades_theme.css/               */
/* obrify_gantt_theme.css/obrify_projects_theme.css). Escopado por       */
/* `.obrify-theme-lab` (ver ApplicationHelper#obrify_theme_lab?, que      */
/* agora cobre facts#index/new/edit/create/update/show) e consome só    */
/* tokens --ob-*.                                                       */
/*                                                                      */
/* A maior parte do RDO (cards, tabela, badges, botões, dropdowns,      */
/* modais) já é re-tematizada globalmente pelos arquivos irmãos assim   */
/* que `.obrify-theme-lab` entra no body — este arquivo só cobre o que   */
/* é específico do RDO: os cards de assinatura do fluxo de aprovação     */
/* (.ob-sig-card), a caixa de declaração e as linhas de item aninhado.   */
/* O cabeçalho sticky da tabela usa a regra global                      */
/* `.obrify-theme-lab .table thead th` (obrify_atividades_theme.css) —   */
/* a listagem de Apontamentos passou a usar `.table` puro (mesma classe  */
/* de Atividades), então não precisa mais de regra própria aqui.         */
/*                                                                      */
/* Precisa carregar depois de obrify_atividades_theme.css (mesma regra  */
/* de cascata: depois do core/demo do Vuexy) — ver _head.html.erb.      */
/* ------------------------------------------------------------------ */

/* ---------- Delta acumulado (linha complementar do card de indicadores) - */
/* Só o ícone carrega o sentido (alta/baixa/estável) — o valor fica no texto
   padrão da legenda, mesmo critério de .ob-row-progress-value/-over-icon em
   Atividades. Usado só pela linha "Delta acumulado" do card de indicadores
   — o Delta da tabela agora usa .ob-delta-icon-badge (ver mais abaixo),
   um pouco mais evidente por ser a coluna, não uma legenda secundária. */
.obrify-theme-lab .ob-delta-icon {
  font-size: 14px;
}

.obrify-theme-lab .ob-delta-icon-positive { color: var(--ob-success); }
.obrify-theme-lab .ob-delta-icon-negative { color: var(--ob-danger); }
.obrify-theme-lab .ob-delta-icon-neutral  { color: var(--ob-text-muted); }

/* ---------- Linha "é a sua vez" (current_validator_id == current_user) -- */
/* Realce sutil de borda, sem badge extra — mesmo espírito do anel de foco
   de .ob-sig-card-highlight, adaptado para uma linha de tabela (não dá
   para usar box-shadow ao redor de um <tr>, só a borda esquerda). */
.obrify-theme-lab .ob-row-your-turn {
  box-shadow: inset 3px 0 0 var(--ob-primary);
}

/* ---------- Card de indicadores (área analítica) ------------------------ */
/* Segundo valor do card (Último RDO) não precisa do mesmo peso do KPI
   principal (RDOs pendentes) — mesmo critério de escala já usado em
   .ob-exec-item .ob-kpi-value para o card de Execução em Atividades. */
.obrify-theme-lab .ob-indicator-secondary .ob-kpi-value {
  font-size: 18px;
}

/* ---------- Legenda da rosca em 1 coluna (card mais estreito) ----------- */
.obrify-theme-lab .ob-comp-legend-stack {
  grid-template-columns: 1fr;
}

/* Bolinha um pouco maior que a de Atividades: aqui o total de RDOs de uma
   obra pode passar de 2-3 dígitos (a de Atividades convive com contagens
   menores) — 22px espremia números como "118". */
.obrify-theme-lab .ob-comp-legend-stack .ob-comp-dot {
  width: 27px;
  height: 27px;
  font-size: 11.5px;
}

/* ---------- Alternância discreta (Por RDO / Acumulado) ------------------ */
/* Um trilho de texto, não um par de botões Bootstrap — a troca é secundária
   dentro do próprio card e não deve competir visualmente com o título. */
.obrify-theme-lab .ob-view-toggle {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  background-color: var(--ob-card-inner);
  border-radius: var(--ob-radius-pill);
  padding: 2px;
  flex-shrink: 0;
}

.obrify-theme-lab .ob-view-toggle-btn {
  border: none;
  background: transparent;
  color: var(--ob-text-secondary);
  font-size: 12px;
  font-weight: 500;
  padding: 4px 12px;
  border-radius: var(--ob-radius-pill);
  cursor: pointer;
  transition: background-color var(--ob-transition), color var(--ob-transition);
}

.obrify-theme-lab .ob-view-toggle-btn:hover {
  color: var(--ob-text-primary);
}

.obrify-theme-lab .ob-view-toggle-btn.active {
  background-color: var(--ob-card);
  color: var(--ob-primary);
  font-weight: 600;
  box-shadow: var(--ob-shadow);
}

/* ---------- Delta em destaque na tabela ---------------------------------- */
/* Só o ícone ganha peso/preenchimento (bolinha colorida, mesma linguagem de
   .ob-comp-dot) — o valor continua em texto neutro, sem chip nem fundo ao
   redor do número. Menos "exagero" que pintar a célula inteira. */
.obrify-theme-lab .ob-delta-indicator {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-variant-numeric: tabular-nums;
  color: var(--ob-text-primary);
}

.obrify-theme-lab .ob-delta-icon-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  flex-shrink: 0;
  font-size: 12px;
}

.obrify-theme-lab .ob-delta-icon-badge-positive {
  background-color: color-mix(in srgb, var(--ob-success) 18%, transparent);
  color: var(--ob-success);
}

.obrify-theme-lab .ob-delta-icon-badge-negative {
  background-color: color-mix(in srgb, var(--ob-danger) 18%, transparent);
  color: var(--ob-danger);
}

.obrify-theme-lab .ob-delta-icon-badge-neutral {
  background-color: var(--ob-card-inner);
  color: var(--ob-text-muted);
}

/* ---------- Produção/Custo com peso diferenciado (sem exagero) ---------- */
/* Só um pouco mais firmes que o texto padrão da tabela — sinalizam que são
   os valores financeiros "de referência" da linha, sem cor nova nem fundo. */
.obrify-theme-lab .ob-table-figure {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

/* ---------- Declaração de veracidade (rodapé do formulário) ------------- */
/* Antes um rosa fixo (rgba(250,194,195,0.5), quebrava no tema escuro) —
   agora o mesmo tom "soft" de --ob-danger usado nos badges (ob-badge-danger),
   coerente com o resto da paleta semântica. */
.obrify-theme-lab .ob-declaration-box {
  background-color: color-mix(in srgb, var(--ob-danger) 12%, transparent);
  border-color: color-mix(in srgb, var(--ob-danger) 30%, transparent) !important;
  color: var(--ob-text-primary);
}

/* ---------- Cards de assinatura (fluxo de aprovação) -------------------- */
/* Substitui o CSS inline de .cards-row/.sig-card de
   _approval_workflow.html.erb/_profile_validators.html.erb pelos mesmos
   tokens de espaçamento/raio/sombra usados no resto do Design System.
   Os 4 estados (assinado/contestado/aguardando/bloqueado) usam as cores
   semânticas já estabelecidas (sucesso/perigo/info/neutro), em vez de
   classes Bootstrap soltas por estado. */
.obrify-theme-lab .ob-sig-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 260px));
  gap: var(--ob-space-16);
}

.obrify-theme-lab .ob-sig-card {
  background-color: var(--ob-card);
  border: 1px solid var(--ob-border);
  border-radius: var(--ob-radius);
  box-shadow: var(--ob-shadow);
  padding: var(--ob-space-16);
  display: flex;
  flex-direction: column;
  gap: var(--ob-space-8);
}

.obrify-theme-lab .ob-sig-card-title {
  font-family: var(--ob-font-display);
  font-size: 14px;
  font-weight: 600;
  color: var(--ob-text-primary);
}

.obrify-theme-lab .ob-sig-card-role {
  font-size: 12px;
  color: var(--ob-text-secondary);
}

.obrify-theme-lab .ob-sig-card-status {
  display: flex;
  align-items: center;
  gap: var(--ob-space-8);
  font-size: 13px;
  font-weight: 600;
}

.obrify-theme-lab .ob-sig-card-status.is-success { color: var(--ob-success); }
.obrify-theme-lab .ob-sig-card-status.is-danger  { color: var(--ob-danger); }
.obrify-theme-lab .ob-sig-card-status.is-info    { color: var(--ob-info); }
.obrify-theme-lab .ob-sig-card-status.is-neutral { color: var(--ob-text-muted); }

.obrify-theme-lab .ob-sig-card-signature {
  max-width: 100%;
  max-height: 120px;
  object-fit: contain;
}

/* Layout de Assinaturas nos RDOs (Estilo Plataforma Digital) */
#section-signatures {
  margin-top: 25px;
  text-align: center;
  page-break-inside: avoid;
  break-inside: avoid;
}

.rdo-signature-item {
  display: inline-block;
  vertical-align: top;
  box-sizing: border-box;
  page-break-inside: avoid;
  break-inside: avoid;
  width: 31.5%;
  max-width: 280px;
  min-width: 210px;
  margin: 0 0.6% 16px 0.6%;
  text-align: left;
  background: transparent !important;
  background-color: transparent !important;
}

.rdo-signature-card {
  border: 1px solid #d1d5db;
  border-radius: 8px;
  background: #ffffff;
  padding: 8px 10px;
  text-align: left;
  box-sizing: border-box;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  page-break-inside: avoid !important;
  break-inside: avoid !important;
}

.rdo-signature-card table,
.rdo-signature-card table tr,
.rdo-signature-card table td {
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
}

.rdo-signature-card td:first-child {
  padding-right: 8px !important;
}

.rdo-signature-card td.rdo-signature-meta-col {
  border-left: 1px solid #e5e7eb !important;
  padding-left: 8px !important;
  vertical-align: middle !important;
}

.rdo-signature-img {
  max-width: 100%;
  max-height: 48px;
  width: auto;
  height: auto;
  object-fit: contain;
  display: inline-block;
}

.rdo-signature-signer-name {
  font-size: 8px !important;
  font-weight: 700;
  color: #111827;
  line-height: 1.15;
}

.rdo-signature-signer-title {
  font-size: 7px !important;
  color: #4b5563;
  line-height: 1.15;
}

.rdo-signature-signer-team {
  font-size: 7px !important;
  font-weight: 700;
  color: #111827;
  line-height: 1.15;
}

@media screen and (max-width: 768px) {
  .rdo-signature-item {
    width: 100% !important;
    max-width: 320px !important;
    margin: 0 auto 15px auto !important;
    display: block !important;
  }
}

.obrify-theme-lab .ob-sig-card-meta {
  font-size: 11px;
  color: var(--ob-text-muted);
}

/* Destaque de "é a sua vez" — mesmo anel de foco usado em
   .ob-project-card-current, sem animação de pulso contínuo (que não tem
   equivalente em nenhum outro componente do Design System). */
.obrify-theme-lab .ob-sig-card-highlight {
  border-color: var(--ob-primary);
  box-shadow: 0 0 0 3px var(--ob-primary-soft);
}

/* ---------- Linhas de item já adicionado (seções aninhadas do form) ---- */
/* Reaproveita o espaçamento/tipografia de .ob-project-metrics para as
   listas de atividades/mão de obra/equipamentos/materiais/ocorrências já
   adicionadas ao RDO, antes escritas com markup Bootstrap solto por
   seção (cada partial tinha o próprio estilo de linha). */
.obrify-theme-lab .ob-nested-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ob-space-8);
  padding: var(--ob-space-8) var(--ob-space-12);
  border: 1px solid var(--ob-border);
  border-radius: var(--ob-radius-sm);
  background-color: var(--ob-card);
  font-size: 13px;
  color: var(--ob-text-primary);
}

.obrify-theme-lab .ob-nested-row + .ob-nested-row {
  margin-top: var(--ob-space-8);
}

.obrify-theme-lab .ob-nested-row-actions {
  display: flex;
  align-items: center;
  gap: var(--ob-space-4);
  flex-shrink: 0;
}

@media print {
  #pdf-content,
  .card#pdf-content,
  div[id^="pdf-content"],
  .card.fact-print-page,
  .fact-print-page .card {
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }

  #pdf-content .card-body,
  div[id^="pdf-content"] .card-body,
  .fact-print-page .card-body {
    padding: 0 !important;
    border: none !important;
    margin: 0 !important;
  }

  #section-header {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
  }

  #section-header img {
    height: 46px !important;
    max-height: 46px !important;
    max-width: 31.5% !important;
    width: auto !important;
    object-fit: contain !important;
    flex: 0 1 auto !important;
  }
}

