/* ------------------------------------------------------------------------ TRC CMS 1.14.0 — elementos do CONTEÚDO (tabelas) Servido pelo núcleo no de qualquer tema (Renderer::position). O wrapper .trc-tbl é criado no render por ContentElements::apply(). Cores em cinza translúcido de propósito: funcionam tanto em tema claro quanto em tema escuro. Um tema que quiser outro visual é só declarar as variáveis --trc-tbl-* no style.css dele — os valores aqui são fallback, nunca sobrescrevem o tema. ------------------------------------------------------------------------ */ /* O contorno e a rolagem moram no wrapper — overflow-x não funciona em . */ .trc-tbl { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; margin: 1.6rem 0; border: 1px solid var(--trc-tbl-line, rgba(128, 128, 128, .38)); border-radius: var(--trc-tbl-radius, 8px); } .trc-tbl > table { border-collapse: collapse; width: 100%; margin: 0; background: transparent; font-size: .95em; line-height: 1.45; } .trc-tbl th, .trc-tbl td { padding: 10px 14px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--trc-tbl-line, rgba(128, 128, 128, .38)); border-right: 1px solid var(--trc-tbl-line, rgba(128, 128, 128, .38)); } .trc-tbl th:last-child, .trc-tbl td:last-child { border-right: 0; } .trc-tbl tr:last-child td { border-bottom: 0; } .trc-tbl thead th { background: var(--trc-tbl-head, rgba(128, 128, 128, .14)); font-weight: 700; } .trc-tbl tbody tr:nth-child(even) { background: var(--trc-tbl-zebra, rgba(128, 128, 128, .07)); } /* No celular a tabela ROLA em vez de espremer as colunas. O piso é por CÉLULA, não na tabela: tabela de 2 colunas continua cabendo na tela, e a de 5 colunas fica larga o bastante para o texto respirar e rola de lado. */ @media (max-width: 640px) { .trc-tbl th, .trc-tbl td { padding: 9px 11px; min-width: var(--trc-tbl-cell, 140px); } } /* Impressão: sem rolagem, tudo visível. */ @media print { .trc-tbl { overflow-x: visible; } .trc-tbl th, .trc-tbl td { min-width: 0; } }