/* octopus-relatorios.css · item 258 (22/09/2026): Marketing > Relatorios, Google Business e bloco Analise automatica */
.rel-card { min-width:0; }
.rel-card-tit { font-size:15px; font-weight:700; color:var(--text); margin-bottom:10px; }
.rel-card-tit .rel-sub { font-weight:400; }
.rel-sub { font-size:12px; color:var(--muted); overflow-wrap:anywhere; }
.rel-sub code, .rel-con code { font-size:12px; }
.rel-nowrap { white-space:nowrap; }
.rel-vazio { color:var(--muted); font-size:13px; padding:14px 4px; }
.rel-vazio code { font-size:12px; }
.rel-aviso { font-size:12px; color:#CEA046; margin-top:8px; }

.rel-resumo { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.rel-pill, .rel-st { display:inline-block; font-size:11px; font-weight:700; border-radius:10px; padding:2px 9px; border:1px solid transparent; white-space:nowrap; }
.rel-st-rascunho { background:rgba(255,160,60,.14); color:#e8923a; border-color:rgba(255,160,60,.4); }
.rel-st-aprovado { background:rgba(90,150,255,.12); color:#5a96ff; border-color:rgba(90,150,255,.35); }
.rel-st-publicado { background:rgba(63,185,122,.14); color:#3fb97a; border-color:rgba(63,185,122,.4); }
.rel-st-oculto { background:var(--surface2); color:var(--muted); border-color:var(--border2); }

.rel-filtros { display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:14px; }
.rel-filtros select, .rel-filtros input, .rel-inp { background:var(--surface2); border:1px solid var(--border2); color:var(--text); padding:6px 10px; border-radius:6px; font-size:12px; font-family:inherit; }
.rel-data { font-size:12px; color:var(--muted); display:flex; align-items:center; gap:4px; }

.rel-tab { width:100%; border-collapse:collapse; font-size:13px; }
.rel-tab th { text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.5px; color:var(--muted); padding:8px 8px; border-bottom:1px solid var(--border); white-space:nowrap; }
.rel-tab td { padding:9px 8px; border-bottom:1px solid var(--border); vertical-align:middle; color:var(--text); }
.rel-tab th.n, .rel-tab td.n { text-align:right; white-space:nowrap; }
.rel-lin { cursor:pointer; }
.rel-lin:hover, .rel-lin:focus { background:var(--surface2); outline:none; }
.rel-lin-rascunho td:first-child { border-left:3px solid #e8923a; }
/* item 265 (27/09/2026): lista em blocos por dia */
.rel-dia { margin-top:14px; }
.rel-dia-cab { display:flex; align-items:baseline; gap:10px; padding:0 0 6px; border-bottom:1px solid var(--border2); margin-bottom:6px; }
.rel-dia-tit { font-size:13px; font-weight:700; color:#CEA046; text-transform:uppercase; letter-spacing:.5px; }
.rel-item { display:grid; grid-template-columns:52px minmax(160px,1.4fr) minmax(150px,1fr) minmax(200px,1.6fr) auto; gap:6px 12px; align-items:center; padding:8px 10px; border-radius:8px; border:1px solid transparent; border-left:3px solid transparent; font-size:13px; color:var(--text); }
.rel-item.rel-lin-rascunho { border-left-color:#e8923a; }
.rel-item.rel-item-oculto { opacity:.6; }
.rel-item-hora { font-variant-numeric:tabular-nums; }
.rel-item-quem { display:flex; align-items:center; gap:6px; flex-wrap:wrap; min-width:0; }
.rel-item-quem .rel-sub { flex-basis:100%; }
.rel-item-fonte, .rel-item-kpis { min-width:0; }
.rel-item-st { justify-self:end; }
.rel-b-excluir { border-color:rgba(255,77,107,.5); color:#ff4d6b; }
.rel-kpis-td { min-width:220px; }
.rel-kpi-mini { display:inline-block; margin:0 10px 2px 0; font-size:12px; color:var(--text); white-space:nowrap; }
.rel-kpi-r { font-size:10px; text-transform:uppercase; letter-spacing:.4px; color:var(--muted); }
.rel-ruido { opacity:.55; }
.rel-var { font-size:11px; font-weight:700; }
.rel-var-pos { color:#3fb97a; } .rel-var-neg { color:#ff4d6b; } .rel-var-zero { color:var(--muted); }
.rel-bola { display:inline-block; width:12px; height:12px; border-radius:50%; vertical-align:middle; flex:0 0 auto; }
.rel-vermelho { background:#ff4d6b; box-shadow:0 0 0 3px rgba(255,77,107,.2); }
.rel-amarelo { background:#e8923a; box-shadow:0 0 0 3px rgba(255,160,60,.2); }
.rel-verde { background:#3fb97a; box-shadow:0 0 0 3px rgba(63,185,122,.2); }
.rel-cinza { background:var(--border2); }
.rel-tag { display:inline-block; font-size:10px; border:1px solid var(--border2); border-radius:8px; padding:1px 6px; color:var(--muted); vertical-align:middle; }
.rel-tag-sinal { color:#3fb97a; border-color:rgba(63,185,122,.4); }
.rel-tag-alerta { color:#ff4d6b; border-color:rgba(255,77,107,.4); }

/* conexao do n8n */
.rel-con-lin { font-size:13px; color:var(--text); margin-bottom:8px; overflow-wrap:anywhere; }
.rel-con-lin > span:first-child { display:inline-block; min-width:110px; color:var(--muted); font-size:12px; }
.rel-token-caixa { margin-top:10px; padding:10px; background:var(--surface2); border:1px solid #CEA046; border-radius:8px; display:flex; gap:8px; align-items:center; flex-wrap:wrap; font-size:12px; color:var(--muted); }
.rel-tok { user-select:all; color:var(--text); font-size:13px; overflow-wrap:anywhere; }

/* detalhe */
.rel-det-topo { display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-bottom:10px; }
.rel-det-cab { font-size:13px; color:var(--muted); display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.rel-det-cab strong { color:var(--text); }
.rel-det-tit { font-size:18px; margin:6px 0 4px; color:var(--text); }
.rel-det-resumo { font-size:14px; color:var(--text); margin:0 0 6px; }
.rel-bloco { margin-top:18px; }
.rel-bloco-tit { font-size:12px; text-transform:uppercase; letter-spacing:.6px; color:#CEA046; font-weight:700; margin-bottom:8px; }
.rel-tab-kpi td:first-child { font-weight:600; }
.rel-acoes { margin:0; padding-left:20px; }
.rel-acoes li { margin-bottom:10px; color:var(--text); font-size:13px; }
.rel-acao-tit { font-weight:600; }
.rel-acao-achado, .rel-acao-como { font-size:12px; color:var(--text); margin-top:4px; border-left:2px solid var(--border2); padding-left:8px; }
.rel-acao-achado > span, .rel-acao-como > span, .rel-cli-acao > span { display:block; font-size:10px; text-transform:uppercase; letter-spacing:.5px; color:var(--muted); font-weight:700; }
.rel-acao-como ul { margin:2px 0 0; padding-left:18px; }
.rel-abas { display:flex; gap:4px; flex-wrap:wrap; margin-bottom:8px; }
.rel-aba { background:var(--surface2); border:1px solid var(--border2); color:var(--muted); border-radius:6px; padding:5px 10px; font-size:12px; cursor:pointer; font-family:inherit; }
.rel-aba.ativa { color:var(--text); border-color:#CEA046; }
.rel-md { font-size:13px; color:var(--text); line-height:1.55; background:var(--surface2); border:1px solid var(--border); border-radius:8px; padding:12px 14px; max-height:520px; overflow:auto; overflow-wrap:anywhere; }
.rel-md h1, .rel-md h2, .rel-md h3, .rel-md h4 { margin:10px 0 6px; color:var(--text); }
.rel-md h1 { font-size:17px; } .rel-md h2 { font-size:15px; } .rel-md h3, .rel-md h4 { font-size:14px; }
.rel-md p { margin:0 0 8px; } .rel-md ul, .rel-md ol { margin:0 0 8px; padding-left:20px; }
.rel-md table { border-collapse:collapse; margin-bottom:8px; } .rel-md th, .rel-md td { border:1px solid var(--border); padding:4px 8px; font-size:12px; }
.rel-md-linha { display:flex; gap:12px; border-bottom:1px solid var(--border); padding:3px 0; font-size:12px; }
.rel-md a { color:#5a96ff; }
.rel-md-area { width:100%; box-sizing:border-box; background:var(--surface); border:1px solid var(--border2); color:var(--text); border-radius:6px; padding:8px 10px; font-size:13px; font-family:inherit; resize:vertical; line-height:1.5; }
.rel-lab { display:block; font-size:11px; text-transform:uppercase; letter-spacing:.5px; color:var(--muted); margin:8px 0 4px; }
.rel-det-acoes { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:10px; }
.rel-ocultar { display:inline-flex; gap:6px; align-items:center; margin-left:auto; }
.rel-b-ok { border-color:#3fb97a; color:#3fb97a; }
.rel-hist-lin { font-size:13px; color:var(--text); display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:6px; }

/* cartoes por cliente (Google Business e Analise automatica) */
.rel-grade { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:12px; }
.rel-cli { background:var(--surface2); border:1px solid var(--border); border-radius:10px; padding:12px 14px; min-width:0; }
.rel-cli-cab { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:4px; }
.rel-cli-cab strong { flex:1 1 auto; color:var(--text); font-size:14px; overflow-wrap:anywhere; }
.rel-cli-sec { font-size:11px; text-transform:uppercase; letter-spacing:.5px; color:var(--muted); margin:10px 0 6px; }
.rel-nums { display:flex; flex-wrap:wrap; gap:4px 14px; margin-top:6px; }
.rel-cli-resumo { font-size:12px; color:var(--text); margin-top:8px; overflow-wrap:anywhere; }
.rel-cli-prob { font-size:12px; color:#e8923a; margin-top:4px; overflow-wrap:anywhere; }
.rel-cli-acao { font-size:12px; color:var(--text); margin-top:8px; border-left:2px solid #CEA046; padding-left:8px; overflow-wrap:anywhere; }
.rel-cli-acao > span { color:#CEA046; }

/* alertas na tela Google Business */
.gb-lista { display:flex; flex-direction:column; gap:8px; }
.gb-item { border:1px solid var(--border); border-left:3px solid var(--border2); border-radius:8px; background:var(--surface2); }
.gb-item.gb-critico { border-left-color:#ff4d6b; } .gb-item.gb-atencao { border-left-color:#e8923a; } .gb-item.gb-info { border-left-color:#5a96ff; }
.gb-item-lin { display:flex; gap:10px; align-items:center; padding:10px 12px; flex-wrap:wrap; }
.gb-item-txt { flex:1 1 240px; min-width:0; }
.gb-tit { font-weight:600; color:var(--text); font-size:14px; overflow-wrap:anywhere; }
.gb-acoes { display:flex; gap:6px; flex-wrap:wrap; }
.gb-acoes .btn-sm { padding:5px 10px; font-size:12px; text-decoration:none; }
.gb-msg { white-space:pre-wrap; font-size:13px; color:var(--text); padding:0 12px 10px; overflow-wrap:anywhere; }
.gb-rev { border-top:1px solid var(--border); padding:10px 12px 12px; }
.gb-est { color:#CEA046; font-size:14px; letter-spacing:1px; } .gb-est span { color:var(--border2); }
.gb-rev-txt { white-space:pre-wrap; font-size:13px; color:var(--text); margin:6px 0 4px; overflow-wrap:anywhere; }

@media (max-width:640px) {
  .rel-grade { grid-template-columns:1fr; }
  .rel-kpis-td { min-width:0; }
  .rel-ocultar { margin-left:0; }
  .rel-item { grid-template-columns:44px 1fr auto; }
  .rel-item-fonte { grid-column:2; }
  .rel-item-kpis { grid-column:2 / span 2; }
  .rel-item-st { grid-column:3; grid-row:1; }
  .rel-tab th, .rel-tab td { padding:7px 5px; }
}
