/* Estilos do painel (tabelas de resultado e utilitários) */

.gm-content {
    padding-bottom: 20px;
}

/* ============================ TABELAS ============================ */

.gm-content table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: .9rem;
    background: var(--gm-surface);
}

.gm-content thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--gm-navy);
    color: #fff;
    font-weight: 700;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    white-space: nowrap;
    padding: .7rem .8rem;
    border: none;
}

.gm-content tbody td {
    padding: .6rem .8rem;
    vertical-align: top;
    border-top: 1px solid var(--gm-border);
    color: var(--gm-ink);
}

.gm-content tbody tr:nth-child(even) {
    background: #fbfdfd;
}

.gm-content tbody tr:hover {
    background: var(--gm-orange-soft);
}

.gm-content .table-responsive {
    max-height: 70vh;
    overflow: auto;
    border: 1px solid var(--gm-border);
    border-radius: var(--gm-radius);
    background: var(--gm-surface);
    box-shadow: var(--gm-shadow);
    -webkit-overflow-scrolling: touch;
}

.gm-content .gm-table.many-cols td,
.gm-content .gm-table.many-cols th {
    font-size: .75rem;
    padding: .4rem .5rem;
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gm-content .gm-table.very-many-cols td,
.gm-content .gm-table.very-many-cols th {
    font-size: .7rem;
    padding: .3rem .4rem;
    max-width: 120px;
}

.gm-nowrap {
    white-space: nowrap;
}

.gm-truncate {
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gm-num {
    text-align: right;
    white-space: nowrap;
}

/* ============================ SCROLLBAR ============================ */

.table-responsive::-webkit-scrollbar {
    height: 9px;
    width: 9px;
}

.table-responsive::-webkit-scrollbar-track {
    background: #eef4f6;
    border-radius: 10px;
}

.table-responsive::-webkit-scrollbar-thumb {
    background: #c3d5dc;
    border-radius: 10px;
}

    .table-responsive::-webkit-scrollbar-thumb:hover {
        background: var(--gm-teal);
    }

/* ============================ LINHA CLICAVEL ============================ */

.gm-content tbody tr.gm-linha-clicavel {
    cursor: pointer;
}

    .gm-content tbody tr.gm-linha-clicavel:hover {
        background: var(--gm-orange-soft);
        box-shadow: inset 3px 0 0 var(--gm-orange);
    }

/* ============================ MODAL DE DETALHE ============================ */

.gm-detalhe {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2px 24px;
    margin: 0;
}

.gm-detalhe__campo {
    padding: 10px 0;
    border-bottom: 1px solid var(--gm-border);
    min-width: 0;
}

    .gm-detalhe__campo dt {
        font-size: .7rem;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: .05em;
        color: var(--gm-muted);
        margin-bottom: 3px;
    }

    .gm-detalhe__campo dd {
        margin: 0;
        font-size: .95rem;
        color: var(--gm-ink);
        overflow-wrap: anywhere;
    }

/* Campos longos ocupam a linha inteira */
.gm-detalhe__campo:nth-child(2),
.gm-detalhe__campo:nth-child(9),
.gm-detalhe__campo:nth-child(14) {
    grid-column: 1 / -1;
}

@media (max-width: 640px) {
    .gm-detalhe {
        grid-template-columns: 1fr;
    }
}

/* ============ LARGURA DAS COLUNAS DA LISTA ============
   A razao social ocupava metade da tabela. Limita e corta com reticencias:
   o nome completo continua no title e no detalhe da empresa. */

/* max-width em celula so vale com table-layout: fixed — no layout automatico
   o navegador ignora e dimensiona pelo conteudo. */
.gm-content table {
    table-layout: fixed;
    width: 100%;
}

.gm-content tbody td,
.gm-content thead th {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Larguras pensadas para as colunas da tela de busca:
   Razao Social | CNPJ | Matriz/Filial | CNAE.
   CNPJ e Matriz/Filial tem tamanho fixo por natureza, entao sobra espaco
   para a descricao do CNAE, que e a informacao mais util e mais longa. */
.gm-content thead th:nth-child(1), .gm-content tbody td:nth-child(1) { width: 24%; }
.gm-content thead th:nth-child(2), .gm-content tbody td:nth-child(2) { width: 15%; }
.gm-content thead th:nth-child(3), .gm-content tbody td:nth-child(3) { width: 11%; }
.gm-content thead th:nth-child(4), .gm-content tbody td:nth-child(4) { width: 50%; }

@media (max-width: 768px) {
    .gm-content thead th:nth-child(1), .gm-content tbody td:nth-child(1) { width: 34%; }
    .gm-content thead th:nth-child(2), .gm-content tbody td:nth-child(2) { width: 22%; }
    .gm-content thead th:nth-child(3), .gm-content tbody td:nth-child(3) { width: 14%; }
    .gm-content thead th:nth-child(4), .gm-content tbody td:nth-child(4) { width: 30%; }
}

/* ============ INDICADOR DE LINHA CLICAVEL ============ */

.gm-content tbody tr.gm-linha-clicavel td:last-child {
    position: relative;
    padding-right: 28px;
}

    .gm-content tbody tr.gm-linha-clicavel td:last-child::after {
        content: '\203A';           /* chevron simples */
        position: absolute;
        right: 10px;
        top: 50%;
        transform: translateY(-50%);
        color: var(--gm-orange);
        font-size: 1.15rem;
        font-weight: 700;
        opacity: .45;
        transition: opacity .15s ease, right .15s ease;
    }

.gm-content tbody tr.gm-linha-clicavel:hover td:last-child::after {
    opacity: 1;
    right: 6px;
}

/* Aviso acima da tabela, so aparece quando ha linhas clicaveis */
.gm-dica-clique {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: .84rem;
    color: var(--gm-muted);
    margin-bottom: 10px;
}

    .gm-dica-clique i {
        color: var(--gm-orange);
    }

/* ============ ESTADO INICIAL (antes de filtrar) ============ */

.gm-vazio {
    text-align: center;
    padding: 46px 26px;
}

    .gm-vazio i {
        display: block;
        font-size: 2.4rem;
        color: var(--gm-orange);
        opacity: .55;
        margin-bottom: 14px;
    }

    .gm-vazio h3 {
        font-size: 1.1rem;
        margin: 0 0 8px;
    }

    .gm-vazio p {
        margin: 0 auto;
        max-width: 34em;
        color: var(--gm-muted);
        font-size: .93rem;
    }