/* Os tokens da marca Transitar.
 *
 * Este arquivo é a única fonte das cores da casa. Antes dele, a intranet tinha
 * 219 cores distintas escritas à mão em cinco folhas de estilo — entre elas
 * `#303d60`, que ninguém sabe de onde veio, e `#172b4d` com `#5e6c84`, que são
 * restos da paleta do Trello, de quando o quadro foi copiado de lá.
 *
 * A regra: **cor que se repete ou que carrega significado mora aqui**, e quem
 * precisa dela usa `var(--...)`. O que se ganha não é aparência, é poder mudar
 * dez telas mexendo em um lugar.
 *
 * O que fica de fora, de propósito: parada de gradiente e micro-tom usados uma
 * vez só. O tema do quadro tem 96 deles. Token de uso único não é sistema, é
 * renomear — e ainda cobra do leitor uma ida a outro arquivo para descobrir
 * que `--verde-do-degrade-do-cabecalho` era só um verde claro.
 *
 * Carregado no `base.html` antes das folhas de cada módulo, para que elas
 * possam ler os tokens.
 */

:root {
    /* ---- As cinco cores do Manual de Marca ------------------------------ */
    --marca-agua: #208290;
    --marca-verde: #76c152;
    --marca-ciano: #009db6;
    --marca-marinho: #162d58;
    --marca-cinza: #616263;

    /* O gradiente da identidade, na diagonal do manual. */
    --marca-gradiente: linear-gradient(45.4deg, var(--marca-agua), var(--marca-verde));

    /* ---- Papéis, e não cores -------------------------------------------- *
     * O resto da casa pede "a cor do texto secundário", não "#616263". Assim
     * um acerto de contraste acontece aqui e vale em todo lugar.
     */
    --superficie: #ffffff;
    --superficie-fundo: #f4f6f9;
    --superficie-alt: #f8f9fa;

    --texto: #1c2430;
    --texto-suave: var(--marca-cinza);
    --texto-fraco: #8a8b8c;
    --texto-sobre-marca: #ffffff;

    --borda: #dfe3e8;
    --borda-forte: #c4cad2;

    /* ---- Estado ---------------------------------------------------------- *
     * Vermelho e âmbar não estão no manual, que é de identidade e não de
     * interface. Escolhidos para ficarem ao lado do verde da marca sem
     * competir com ele, e conferidos em contraste sobre `--superficie`.
     */
    --ok: var(--marca-verde);
    --atencao: #b8860b;
    --erro: #c0392b;
    --erro-fundo: #fdecea;
    --info: var(--marca-ciano);

    /* Prioridade da demanda — os três pesos que o cadastro oferece. */
    --prioridade-baixa: var(--marca-cinza);
    --prioridade-normal: var(--marca-agua);
    --prioridade-alta: var(--erro);

    /* ---- Tipografia ------------------------------------------------------ *
     * A fonte do sistema, de propósito. A inclusão original do AdminLTE
     * buscava Source Sans Pro num servidor externo, e esperar DNS e Internet
     * atrasava justamente o primeiro acesso e a instalação no celular. Com a
     * pilha nativa, cada aparelho usa a fonte que já tem: San Francisco no
     * iPhone e no iPad, Roboto no Android, Segoe no Windows. Nada para baixar,
     * funciona na rede interna, e o texto sai com a cara do aparelho.
     */
    --fonte: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
             "Helvetica Neue", Arial, sans-serif;
    --fonte-numero: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
                    "Liberation Mono", monospace;

    /* ---- Forma ----------------------------------------------------------- */
    /* Os valores são os do quadro, promovidos a valores da casa. Ele é o
     * módulo mais recente e o mais bem resolvido; alinhar o resto a ele custa
     * uma linha e faz as telas parecerem parte do mesmo produto. */
    --raio: .85rem;
    --raio-medio: .6rem;
    --raio-pequeno: .5rem;
    --raio-pilula: 999px;
    --sombra: 0 2px 8px rgba(23, 65, 74, .07);
    --sombra-alta: 0 10px 28px rgba(23, 65, 74, .10);

    /* O menor alvo que um dedo acerta sem erro. Vale para botão, aba e
     * qualquer coisa que se toque; é o número que `tests_e2e_celular.py` e
     * `tests_e2e_responsivo.py` conferem. */
    --alvo-toque: 44px;
}

/* ===========================================================================
   As famílias que o quadro trouxe, e que a casa inteira passa a usar

   O kanban é hoje o módulo mais recente e o mais bem resolvido visualmente.
   Em vez de inventar um sistema novo e deixar duas identidades convivendo — o
   erro que a tela de contratos cometeu —, os valores que ele já usa sobem para
   cá e viram os da casa. Nada muda no quadro; muda quem mais pode usá-los.
   ========================================================================== */

:root {
    /* ---- Superfícies do quadro ------------------------------------------ */
    --fundo-coluna: #ebecf0;
    --linha-sutil: #dfe1e6;
    --texto-apagado: #97a0af;
    --texto-secundario: #6b778c;
    --foco-anel: #80bdff;

    /* ---- Papel: as telas de arquivo ------------------------------------- *
     * Um segundo conjunto de superfícies, de propósito. O ofício arquivado
     * não é um card — é documento —, e a folha levemente quente separa as
     * duas coisas sem precisar de rótulo.
     */
    --papel: #fcfcfb;
    --papel-borda: #e1e0d9;
    --papel-borda-forte: #c3c2b7;
    --papel-texto: #0b0b0b;
    --papel-texto-suave: #52514e;
    --papel-selo-fundo: #ece9e2;
    --papel-selo-texto: #6b6559;

    /* ---- Tipos de documento --------------------------------------------- *
     * Estas cores **carregam significado**: são como quem lê o quadro
     * distingue um requerimento da câmara de uma indicação, de relance e sem
     * ler o rótulo. Por isso não viram cor da marca — trocá-las por variações
     * de água e verde tornaria os tipos indistinguíveis, que é o oposto do
     * que a tela precisa. Ficam nomeadas, e é isso que muda: quem quiser a cor
     * do ofício pede `--tipo-oficio`, não `#0079bf`.
     *
     * A família roxa é de propósito uma escala: câmara é o mais escuro porque
     * é o mais importante dos três, e a indicação o mais claro.
     */
    --tipo-requerimento-camara: #4b2e83;
    --tipo-requerimento: #6f52b8;
    --tipo-indicacao: #9b8ad4;
    --tipo-oficio: #0079bf;
    --tipo-ci: #0f6b8c;
    --tipo-pedido: #61bd4f;
    --tipo-setor: #026aa7;
    --tipo-outro: #8590a2;
    --tipo-neutro: #7f8c8d;

    /* O verde do WhatsApp. Marca de terceiro, e por isso literal e intocada:
     * o reconhecimento é justamente a função dela. */
    --whatsapp: #25d366;

    /* ---- Faixas de estado no topo da coluna e do indicador -------------- */
    --faixa-aberto: var(--ok);
    --faixa-andamento: #f2d600;
    --faixa-cancelado: #b3bac5;
    --faixa-atencao: #fab219;
    --faixa-bom: #0ca30c;
    --faixa-info: #2a78d6;
    --info-fundo: #e3edfa;
}


/* Lista de responsáveis do chamado. Fica no global porque os oito formulários
   de solicitação desenham os campos num laço, sem gancho por campo — e porque
   o mesmo desenho serve os oito. */
.lista-de-responsaveis {
    display: grid;
    gap: .35rem .9rem;
    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
    margin: .15rem 0 0;
    padding: 0;
}
.lista-de-responsaveis > div { margin: 0; }
.lista-de-responsaveis label {
    align-items: center;
    display: flex;
    font-weight: 400;
    gap: .45rem;
    margin: 0;
}
.lista-de-responsaveis input[type="checkbox"] {
    flex: 0 0 auto;
    height: 1rem;
    margin: 0;
    width: 1rem;
}