/* =========================================================================
   Busca por campo - tela nova (/search).

   So o que e DESTA tela: o topo que gruda e os ajustes de quem vem
   emprestado. O campo de busca e a barra da home (barra-busca.css) e os
   cartoes de resultado sao os do Catalogo Inteligente
   (catalogo-inteligente.css) - a mesma informacao, e duas folhas para o
   mesmo componente divergem na primeira correcao que alguem fizer em uma
   so.
   ========================================================================= */

.bu {
  max-width: 1180px; margin: 2.5rem auto 4rem;
  /* Camada propria: o .header-admin tem z-index altissimo e, sem isto, a
     primeira linha da tela e pintada por baixo dele. */
  position: relative; z-index: 1;
  font-family: 'Outfit', 'Signika', Arial, sans-serif;
  color: #191C1D; text-align: left;
}
.bu *, .bu *:before, .bu *:after { box-sizing: border-box; }

/* Declarada aqui tambem, e nao so no barra-busca.css: rotulo de leitor de
   tela que vira texto visivel por falta de uma folha vizinha e um defeito
   caro para o que custa repetir tres linhas. */
.bu .visualmente-oculto {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}
.bu p, .bu h1, .bu h2, .bu h3, .bu h4 { margin: 0; padding: 0; color: inherit; }

/* ------------------------------------------------------< resultados */

.bu__barra {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 10px; margin-bottom: 12px;
}
.bu .bu__voltar {
  display: inline-flex; align-items: center; gap: 6px;
  margin-right: 1%; flex: 0 0 auto;
  font-size: 17px; font-weight: 500;
  color: var(--brand-base, #0076AD) !important;
  text-decoration: none;
}
.bu .bu__voltar:hover { text-decoration: underline; }
.bu__barra[hidden] { display: none; }
.bu__barra .ci__total { margin: 0; }

/* O corpo da tela carrega a classe .ci, para herdar os botoes e os cartoes
   do Catalogo Inteligente. O que se desarma aqui e so o LAYOUT DE TELA
   daquela classe - grade de duas colunas, altura de viewport, moldura
   propria -, que ali serve ao chat e aqui atrapalharia. As regras dos
   cartoes continuam valendo inteiras. */
.bu .ci, .bu.ci {
  display: block; height: auto; min-height: 0;
  max-width: none; margin: 0; gap: 0;
}
/* Depois da regra acima, e com a mesma forca: ".bu .ci" zera a margem da
   classe emprestada, e o respiro entre o campo e o resultado e desta tela. */
.bu .bu__corpo { margin-top: 7px; }

/* O cartao de resultado e o painel de obra vem de catalogo-inteligente.css;
   aqui so o que precisa mudar por estarem fora daquela tela. */
.bu .ci__lista-cartao, .bu .ci__visao {
  background: #FFFFFF; border-radius: 14px; overflow: hidden;
}
/* Na conversa o turno ja da respiro entre os cartoes de obra; aqui eles
   ficam soltos no fundo e precisam do proprio. */
.bu .ci__obra-cartao { margin-bottom: 16px; }
.bu .ci__obra-cartao:last-child { margin-bottom: 0; }
.bu .ci__visao { padding: 0px; }
.bu .ci__visao-nota { padding: 20px; font-size: 15px; color: #667A88; }

/* A ficha mora fora do .bu e por isso nao pega o ".bu .ci" acima: a
   classe emprestada precisa ser desarmada de novo aqui, senao a grade de
   tela cheia dela empurra a ficha para dentro de uma coluna. */
.bu__ficha-raiz {
  display: block; height: auto; min-height: 0; max-width: none; margin: 0; gap: 0;
}

@media (max-width: 760px) {
  .bu { margin: 1rem auto 3rem; }
}

/* No BIB_TRT_02_SP_IA o bloco entra dentro de #resultado_busca_topo,
   debaixo da barra que já existia. O respiro de página inteira do /search
   sobra aqui. */
#buscaTopoResultados.bu {
  max-width: none;
  margin: 8px auto 16px;
}

/* Reservar fica na coluna da capa, no mesmo desenho do Ver detalhe. */
.ci .ci__obra-acao {
  display: flex; align-items: center; justify-content: center;
  width: 100%; min-height: 32px; padding: 0 12px;
  border: 1px solid var(--ci-linha); border-radius: 8px;
  background: var(--ci-papel); color: var(--ci-acento-esc);
  font-size: 14px; font-weight: 700;
}
.ci .ci__obra-acao:hover { background: var(--ci-acento-fr); }
.ci .ci__obra-acao[hidden] { display: none; }

/* Renovar e malote ficam na linha do exemplar, ao lado da situação. */
.ci .ci__item-acoes { display: flex; flex-wrap: wrap; gap: 6px; flex: 0 0 auto; }
.ci .ci__item-acao {
  height: auto; padding: 2px 10px;
  border: 1px solid var(--ci-linha); border-radius: 999px;
  background: var(--ci-papel); color: var(--ci-acento-esc);
  font-size: 12px; font-weight: 700;
}
.ci .ci__item-acao:hover { background: var(--ci-acento-fr); }

/* Cartão FRBR no mesmo estilo do modelo (capa, abas azuis, painel e exemplares).
   Escopo só da busca do hero, para não alterar o catálogo do projeto ia. */
#buscaTopoResultados .ci__frbr {
  font-family: ui-sans-serif, system-ui, "Segoe UI", sans-serif;
  color: #1E293B;
}
#buscaTopoResultados .ci__obra-cartao {
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 24px;
  margin-bottom: 24px;
  padding: 10px;
  border: 1px solid #E2E8F0;
  border-radius: 16px;
  background: #fff;
  box-shadow:
    0 1px 2px rgba(15, 23, 42, .05),
    0 8px 24px rgba(15, 23, 42, .07);
}
#buscaTopoResultados .ci__obra-cartao--1 {
  /* border: 2px solid rgba(59, 130, 246, .35); */
  box-shadow:
    0 1px 2px rgba(15, 23, 42, .05),
    0 8px 24px rgba(15, 23, 42, .07);
}
#buscaTopoResultados .ci__obra-capa-col {
  gap: 10px;
  padding: 16px;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  background: #F8FAFC;
}
#buscaTopoResultados .ci__obra-capa {
  width: 130px;
  height: 192px;
  padding: 12px;
  border-radius: 8px;
  border: 2px solid rgba(255, 255, 255, .2);
  color: #fff;
  box-shadow: 0 4px 10px rgba(15, 23, 42, .25);
}
#buscaTopoResultados .ci__obra-capa-kicker {
  font-size: 8px;
  letter-spacing: .16em;
  color: #93C5FD;
  opacity: 1;
}
#buscaTopoResultados .ci__obra-capa-aut { font-size: 10px; color: #E2E8F0; }
#buscaTopoResultados .ci__obra-capa-tit { font-size: 12px; font-weight: 800; }
#buscaTopoResultados .ci__obra-capa-rot { font-size: 7px; color: #CBD5E1; }
#buscaTopoResultados .ci__obra-capa-ed { font-size: 10px; }
#buscaTopoResultados .ci__obra-capa-ano {
  font-size: 9px;
  background: rgba(255, 255, 255, .2);
}
#buscaTopoResultados .ci .ci__obra-detalhe,
#buscaTopoResultados .ci .ci__obra-pdf,
#buscaTopoResultados .ci .ci__obra-acao,
#buscaTopoResultados .ci .ci__obra-aba,
#buscaTopoResultados .ci .ci__itens-mais {
  height: auto;
  min-height: 0;
  text-transform: none;
  letter-spacing: 0;
  text-shadow: none;
  background-image: none;
}
#buscaTopoResultados .ci .ci__obra-detalhe {
  width: 100%;
  min-height: 30px;
  border-radius: 8px;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
}
#buscaTopoResultados .ci .ci__obra-detalhe:hover { background: #136795; }
#buscaTopoResultados .ci .ci__obra-pdf {
  width: 100%;
  min-height: 30px;
  border: 1px solid #FECACA;
  border-radius: 8px;
  background: #FEF2F2;
  color: #B91C1C;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
}
#buscaTopoResultados .ci .ci__obra-pdf:hover { background: #FEE2E2; color: #B91C1C; }
#buscaTopoResultados .ci .ci__obra-acao {
  width: 100%;
  min-height: 30px;
  border: 1px solid #E2E8F0;
  border-radius: 8px;
  background: #fff;
  color: #334155;
  font-size: 12px;
  font-weight: 600;
}
#buscaTopoResultados .ci .ci__obra-acao:hover { background: #F8FAFC; }
#buscaTopoResultados .ci__obra-conta { font-size: 11px; font-weight: 500; color: #64748B; }

#buscaTopoResultados .ci .ci__obra-selo {
  font-size: 14px;
  font-weight: 800;
  color: #1D4ED8;
}
#buscaTopoResultados .ci .ci__obra-nome {
  font-size: 17.5px;
  font-weight: 700;
  color: #0F172A;
}
#buscaTopoResultados .ci .ci__obra-aut { font-size: 14px; color: #475569; }
#buscaTopoResultados .ci .ci__obra-aut strong { color: #1E293B; font-weight: 500; }
#buscaTopoResultados .ci .ci__obra-tipo { margin-top: 2px; font-size: 14px; color: #64748B; }
#buscaTopoResultados .ci .ci__obra-camada { color: #1D4ED8; font-style: normal; font-weight: 800; }
#buscaTopoResultados .ci__manif-frbr {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #1D4ED8;
  font-style: normal;
  font-weight: 800;
}
#buscaTopoResultados .ci__manif-frbr svg { width: 13px; height: 13px; flex: 0 0 auto; }
#buscaTopoResultados .ci__manif-ano { color: #1D4ED8; font-style: normal; font-weight: 800; }
#buscaTopoResultados .ci__base-logo { height: 26px; }

#buscaTopoResultados .ci__obra-abas-rot {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .06em;
  color: #64748B;
}
#buscaTopoResultados .ci__obra-abas-frbr {
  font-size: 14px;
  font-weight: 800;
  color: #1D4ED8;
}
#buscaTopoResultados .ci .ci__obra-aba {
  min-height: 30px;
  padding: 6px 12px;
  border-radius: 8px;
  background: #F1F5F9;
  color: #334155;
  font-size: 12px;
  font-weight: 600;
}
#buscaTopoResultados .ci .ci__obra-aba:hover { background: #E2E8F0; }
#buscaTopoResultados .ci .ci__obra-aba[aria-selected="true"] {
  background: #2563EB;
  color: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .12);
}

#buscaTopoResultados .ci__manif {
  grid-template-columns: minmax(0, 1fr) 280px;
  gap: 16px;
  padding: 16px;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  background: #F8FAFC;
}
#buscaTopoResultados .ci__manif-dados { font-size: 12px; color: #475569; gap: 4px; }
#buscaTopoResultados .ci .ci__manif-dados h4 {
  margin: 0 0 4px;
  font-size: 14px;
  font-weight: 700;
  color: #0F172A;
}
#buscaTopoResultados .ci__manif-reg { color: #2563EB; font-weight: 600; }
#buscaTopoResultados .ci__manif-dados code {
  font-family: ui-monospace, "Cascadia Mono", Consolas, monospace;
  font-size: 12px;
  color: #1E293B;
  background: none;
}
#buscaTopoResultados .ci__manif-itens {
  padding: 12px;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .05);
  font-size: 12px;
}
#buscaTopoResultados .ci__itens-n { font-size: 11px; color: #334155; }
#buscaTopoResultados .ci__itens-n em { color: #1D4ED8; font-weight: 800; }
#buscaTopoResultados .ci .ci__itens-mais {
  padding: 2px 8px;
  border-radius: 4px;
  background: #F1F5F9;
  color: #334155;
  font-size: 10px;
  font-weight: 600;
}
#buscaTopoResultados .ci .ci__itens-mais:hover { background: #2563EB; color: #fff; }
#buscaTopoResultados .ci__item { padding: 4px 0; border-bottom-color: #F1F5F9; }
#buscaTopoResultados .ci__item-onde {
  display: flex; flex-direction: column; gap: 1px;
  white-space: normal; overflow: hidden;
  font-size: 12px; font-weight: 500; color: #1E293B;
}
#buscaTopoResultados .ci__item-bib-linha {
  display: flex;
  align-items: baseline;
  gap: 0.7em;
  min-width: 0;
}
#buscaTopoResultados .ci__item-bib,
#buscaTopoResultados .ci__item-local {
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
#buscaTopoResultados .ci__item-ident {
  flex: 0 0 auto;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: #0f172a;
}
#buscaTopoResultados .ci__item-local {
  font-family: ui-monospace, Consolas, monospace;
  font-size: 11px; font-weight: 500; color: #64748B;
}
#buscaTopoResultados .ci__item-sit {
  font-size: 11px; font-weight: 500; padding: 2px 8px; border-radius: 999px;
}
#buscaTopoResultados .ci__item-sit--ok       { background: #D1FAE5; color: #065F46; }
#buscaTopoResultados .ci__item-sit--espera   { background: #FEF3C7; color: #92400E; }
#buscaTopoResultados .ci__item-sit--parado   { background: #FFE4E6; color: #9F1239; }
#buscaTopoResultados .ci__item-sit--especial { background: #CCFBF1; color: #115E59; }
#buscaTopoResultados .ci__item-sit--reserva  { background: #DBEAFE; color: #1E40AF; }
#buscaTopoResultados .ci__item-sit--restaura { background: #FCE7F3; color: #9D174D; }
#buscaTopoResultados .ci__item-sit--sumido   { background: #FFEDD5; color: #9A3412; }
#buscaTopoResultados .ci__item-sit--baixa    { background: #F1F5F9; color: #334155; }
#buscaTopoResultados .ci__item-sit--interno  { background: #EDE9FE; color: #5B21B6; }
#buscaTopoResultados .ci__item-sit--curso    { background: #CFFAFE; color: #155E75; }
#buscaTopoResultados .ci__item-sit--neutro   { background: #F8FAFC; color: #475569; }
#buscaTopoResultados .ci__fonte { margin-top: 12px; }
#buscaTopoResultados .ci__fonte-texto,
#buscaTopoResultados .ci__fonte-link {
  display: block; margin-top: 6px; font-size: 14px; line-height: 1.45; color: #0F172A;
}
#buscaTopoResultados a.ci__fonte-link { color: #0076ad; text-decoration: none; }
#buscaTopoResultados a.ci__fonte-link:hover {  }
#buscaTopoResultados .ci__manif-tag {
  background: #fff;
  border-color: #E2E8F0;
  color: #64748B;
  font-size: 12px;
}
#buscaTopoResultados a.ci__manif-tag {
  text-decoration: none;
  cursor: pointer;
}
#buscaTopoResultados a.ci__manif-tag:hover {
  border-color: #2563EB;
  color: #1D4ED8;
}
#buscaTopoResultados .ci__manif-tags .ci__itens-mais { align-self: center; }

@media (max-width: 900px) {
  #buscaTopoResultados .ci__obra-cartao,
  #buscaTopoResultados .ci__manif { grid-template-columns: minmax(0, 1fr); }
}