/* ==========================================================================
   comum.css — estilos do Painel FIDC (Lista, Busca e página do FIDC)
   Prefixo ct-. Cores sempre por variável do site (--site-*) pro modo escuro.
   ========================================================================== */
:root{ --ct-risco-fundo: #fbeceb; --ct-alerta-fundo: #faf1df; }
@media (prefers-color-scheme: dark){ :root{ --ct-risco-fundo: #2c1817; --ct-alerta-fundo: #2b2413; } }
.ct-principal{ max-width: var(--site-largura); margin: 0 auto; padding: 0 var(--site-margem); }
.ct-largo{ width: min(1720px, 100vw - 2 * var(--site-margem) - 16px); margin-left: 50%; transform: translateX(-50%); }
.ct-barra{ display: flex; flex-wrap: wrap; gap: 10px 20px; align-items: center; margin: 0 0 12px; font-size: 0.86rem; }
.ct-barra input[type=search]{ font: inherit; font-size: 0.9rem; padding: 8px 10px; border: 1px solid var(--site-borda-forte); border-radius: var(--site-raio-p); background: var(--site-cartao); color: var(--site-texto); }
.ct-barra label{ display: inline-flex; gap: 6px; align-items: center; color: var(--site-texto-suave); }
.ct-sub{ font-size: 0.74rem; color: var(--site-texto-suave); display: block; font-weight: 400; }
.ct-pos{ color: var(--site-positivo); }
.ct-neg{ color: var(--site-negativo); }

.ct-tabela{ font-size: 0.82rem; }
.ct-tabela th, .ct-tabela td{ padding: 9px 6px; vertical-align: top; }
.ct-tabela td.ct-nome, .ct-tabela th.ct-nome{ text-align: left; white-space: normal; min-width: 190px; max-width: 240px; padding-left: 10px; }
.ct-tabela td.ct-nome a{ font-weight: 600; color: var(--site-texto); text-decoration: none; line-height: 1.3; }
.ct-tabela td.ct-nome a:hover{ color: var(--site-primaria); text-decoration: underline; }
.ct-tabela td.ct-nome small{ display: block; font-family: var(--site-mono); font-size: 0.64rem; color: var(--site-texto-fraco); line-height: 1.5; margin-top: 2px; }
.ct-tabela td.ct-esq, .ct-tabela th.ct-esq{ text-align: left; white-space: normal; }
.ct-tabela th button{ font: inherit; color: inherit; text-transform: inherit; letter-spacing: inherit; background: none; border: 0; padding: 0; cursor: pointer; text-align: inherit; }
.ct-tabela th button:hover{ color: var(--site-texto); }
.ct-tabela th[aria-sort] button::after{ content: " ↓"; }
.ct-tabela th[aria-sort="ascending"] button::after{ content: " ↑"; }
.ct-tabela tbody tr:hover td{ background: var(--site-destaque); }
.ct-tabela tbody tr.ct-risco td{ background: var(--ct-risco-fundo); }
.ct-tabela tbody tr.ct-risco td:first-child{ box-shadow: inset 3px 0 0 var(--site-negativo); }
.ct-tabela tfoot td{ font-weight: 600; border-top: 1px solid var(--site-borda-forte); }
.ct-forte{ font-weight: 700; font-size: 0.92rem; }
.ct-clique{ font: inherit; font-weight: 700; font-size: 0.92rem; color: var(--site-texto); background: var(--site-destaque); border: 1px solid var(--site-borda-forte); border-radius: var(--site-raio-p); padding: 2px 6px 2px 7px; cursor: pointer; font-variant-numeric: tabular-nums; display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.ct-clique svg{ width: 11px; height: 11px; flex: none; opacity: 0.7; }
.ct-clique:hover, .ct-clique:focus-visible{ border-color: var(--site-primaria); color: var(--site-primaria); }
.ct-clique:hover svg{ opacity: 1; }
.ct-classe{ font-size: 0.8rem; font-weight: 600; white-space: nowrap; }
.ct-tipo{ display: inline-block; font-size: 0.62rem; font-weight: 600; letter-spacing: 0.04em; border: 1px solid var(--site-borda-forte); border-radius: 4px; padding: 0 5px; margin-left: 6px; color: var(--site-texto-suave); vertical-align: 2px; white-space: nowrap; cursor: help; }
.ct-ficha-tipo{ display: block; font-size: 0.8rem; font-weight: 400; opacity: 0.85; margin-top: 2px; }
.ct-classe i{ display: inline-block; width: 8px; height: 8px; border-radius: 1px; margin-right: 5px; }
/* escala do colchão comprometido (sempre com o número escrito) */
.ct-comp{ display: inline-block; font-weight: 700; font-size: 0.9rem; padding: 1px 6px; border-radius: var(--site-raio-p); white-space: nowrap; }
.ct-comp-0{ color: var(--site-positivo); }
.ct-comp-1{ color: var(--site-texto); }
.ct-comp-2{ color: var(--site-alerta); background: var(--ct-alerta-fundo); }
.ct-comp-3{ color: var(--site-negativo); background: var(--ct-risco-fundo); }
.ct-comp-3::before{ content: "▲ "; font-size: 0.66rem; vertical-align: 1px; }
.ct-atencao{ display: inline-block; font-size: 0.66rem; line-height: 1.3; color: var(--site-alerta); background: var(--ct-alerta-fundo); border-radius: var(--site-raio-p); padding: 1px 5px; margin: 1px 3px 2px 0; }
.ct-tabela td.ct-aten{ text-align: left; white-space: normal; width: 170px; min-width: 150px; max-width: 180px; }
.ct-atencao::before{ content: "▲ "; font-size: 0.58rem; vertical-align: 1px; }
.ct-atencao.ct-dado{ color: var(--site-texto-suave); background: var(--site-destaque); }
.ct-atencao.ct-dado::before{ content: "† "; }
.ct-atencao.ct-grave{ color: var(--site-negativo); background: var(--ct-risco-fundo); }
.ct-ast{ font-size: 0.8em; color: var(--site-alerta); font-weight: 700; margin-left: 1px; cursor: help; }
.ct-info{ font: 600 0.66rem/1.5 var(--site-mono); background: var(--site-grade); border: 0; border-radius: 3px; color: var(--site-texto-suave); cursor: pointer; padding: 0 4px; margin-left: 5px; vertical-align: 1px; text-transform: none; letter-spacing: 0; }
.ct-info:hover, .ct-info:focus-visible{ background: var(--site-destaque); color: var(--site-primaria); }
.ct-pop p{ font-size: 0.84rem; line-height: 1.5; margin: 8px 0 4px; color: var(--site-texto); }
.ct-pop p + p{ margin-top: 6px; color: var(--site-texto-suave); }
.ct-selo{ display: inline-block; font-family: var(--site-mono); font-size: 0.58rem; letter-spacing: 0.06em; text-transform: uppercase; border: 1px solid var(--site-borda-forte); border-radius: 2px; padding: 0 4px; color: var(--site-texto-suave); margin-left: 6px; vertical-align: 1px; }
/* caixinha (popover) com gráfico */
.ct-pop{ position: absolute; z-index: 40; width: min(460px, calc(100vw - 32px)); background: var(--site-cartao); border: 1px solid var(--site-borda-forte); border-radius: var(--site-raio); box-shadow: var(--site-sombra-flutuante); padding: 14px 16px 10px; }
.ct-pop-cabeca{ display: flex; justify-content: space-between; gap: 12px; align-items: baseline; }
.ct-pop-cabeca b{ font-size: 0.9rem; }
.ct-pop-cabeca small{ display: block; font-size: 0.76rem; color: var(--site-texto-suave); font-weight: 400; }
.ct-pop-fechar{ font: inherit; font-size: 1.1rem; line-height: 1; background: none; border: 0; color: var(--site-texto-suave); cursor: pointer; padding: 2px 4px; }
.ct-pop-fechar:hover{ color: var(--site-texto); }
.ct-pop .site-grafico text{ font-size: 10px; }
.ct-pop .site-grafico .ct-rot{ font-family: var(--site-fonte); font-size: 10px; font-weight: 600; fill: var(--site-texto); }
.ct-metodo{ font-size: 0.86rem; color: var(--site-texto-suave); max-width: 90ch; }
.ct-metodo li{ margin-bottom: 4px; }
.ct-carregando{ padding: 40px 0; color: var(--site-texto-suave); }
/* páginas */
.ct-cabeca-secao{ display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 24px; border-top: 2px solid var(--site-tinta); padding-top: 12px; margin: 40px 0 16px; }
.ct-cabeca-secao h2{ font-size: 1.3rem; margin: 0; }
.ct-cabeca-secao p{ margin: 0; font-size: 0.84rem; color: var(--site-texto-suave); }
.ct-vazio{ font-size: 0.9rem; color: var(--site-texto-suave); padding: 12px 0; }
.ct-tabela tr.ct-proprio td{ background: var(--site-cartao); }
.ct-busca{ position: relative; max-width: 720px; margin-bottom: 20px; }
.ct-busca input{ width: 100%; font: inherit; font-size: 1.05rem; padding: 12px 14px; border: 1px solid var(--site-borda-forte); border-radius: var(--site-raio-p); background: var(--site-cartao); color: var(--site-texto); }
.ct-busca input:focus{ outline: 2px solid var(--site-primaria); outline-offset: 0; }
.ct-nivel{ font-family: var(--site-mono); font-size: 0.68rem; color: var(--site-texto-suave); white-space: nowrap; }

/* quadros (indicadores) da página do fundo */
.ct-quadros{ margin-bottom: 8px; }
.ct-quadros + .ct-quadros{ margin-top: -1px; }
.ct-quadros-4{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1000px){ .ct-quadros-4{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ct-quadros .site-indicador dt{ min-height: 0; }
.ct-quadros .site-indicador .site-valor{ font-size: clamp(1.3rem, 1.05rem + 0.8vw, 1.7rem); }
.ct-quadros .site-indicador .site-valor small{ font-size: 0.8rem; font-weight: 400; color: var(--site-texto-suave); }
.ct-quadro-sub{ margin-top: 6px; line-height: 1.5; }

/* quadros novos da página do FIDC (regra do regulamento, cota júnior, crédito atrasado) */
.ct-quadros-5{ grid-template-columns: repeat(5, minmax(0, 1fr)); }
@media (max-width: 1000px){ .ct-quadros-5{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ct-aviso{ font-size: 0.86rem; line-height: 1.5; color: var(--site-texto); background: var(--ct-alerta-fundo); border-left: 3px solid var(--site-alerta); border-radius: var(--site-raio-p); padding: 10px 14px; margin: 12px 0; max-width: 100ch; }
.ct-aviso b{ color: var(--site-alerta); }
.ct-nota{ font-size: 0.84rem; line-height: 1.5; color: var(--site-texto-suave); max-width: 100ch; margin: 8px 0; }
.ct-tabela td.ct-num-sub{ color: var(--site-texto-suave); font-size: 0.76rem; }

/* gráficos de histórico lado a lado */
.ct-grade2{ display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 20px; }
@media (max-width: 1000px){ .ct-grade2{ grid-template-columns: minmax(0, 1fr); } }
.ct-classe-parte{ white-space: nowrap; }
.ct-classe-parte i{ display: inline-block; width: 8px; height: 8px; border-radius: 1px; margin-right: 5px; }