﻿/********************************/
/* Configuração Geral da Página */
/********************************/

body {
        background: linear-gradient(135deg, #e0eafc, #cfdef3); 
        font-family: 'Segoe UI', Helvetica, Arial, sans-serif;
        /*margin: 0;
        padding: 0;*/
    }

/********************************/

.rotulo-grupo {
    color: #FFFFFF;
    font-weight: bold;
    background-color: #6666FF;
    padding-top: 8px;
    padding-bottom: 8px;
    text-align: left;
    padding-left: 10px;
    font-size: 18px;
    margin:auto;
    margin-top:5px;
    width:100%;
    height: 25px; 
   
}
.rotulo-campos {
    padding: 10px;
}

.secao-destaque {
    color: #FF0000; 
    font-weight: bold
}

/*    Alinhamento do conteúdo da página
*/
.page-container {
  max-width: 2000px;
  margin: 0 auto;
  padding: 20px;
  box-sizing: border-box;
}

/*
    Configuração de rodapé de página
*/
.custom-footer {
    background-color: #2c3e50;
    color: #ffffff;
    padding: 30px 15px;
    font-family: 'Arial', sans-serif;
    text-align: center;
}

/*.custom-footer {
    background-color: #2c3e50 !important;
    color: #ffffff !important;
    padding: 30px 15px !important;
    text-align: center !important;
}*/


.custom-footer-container {
    max-width: 2000px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.custom-footer-logo img {
    width: 120px;
    height: auto;
    margin-bottom: 15px;
}

.custom-footer-info {
    margin-bottom: 15px;
    font-size: 14px;
}

.custom-footer-info a {
    color: #1abc9c;
    text-decoration: none;
}

.custom-footer-info a:hover {
    text-decoration: underline;
}

.custom-footer-social a {
    margin: 0 10px;
    display: inline-block;
}

.custom-footer-social img {
    width: 28px;
    height: 28px;
    filter: brightness(0) invert(1); /* torna os ícones brancos */
    transition: transform 0.3s ease;
}

.custom-footer-social img:hover {
    transform: scale(1.1);
}

/* Mobile-friendly layout */
@media (max-width: 600px) {
    .custom-footer-container {
        flex-direction: column;
        text-align: center;
    }

    .custom-footer-social a {
        margin: 8px;
    }
}

/*
    Cabeçalho das páginas
*/
.simple-header {
  background-color: #2c3e50; /* mesma cor do rodapé */
  color: #ffffff;
  padding: 8px 20px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
  font-family: 'Segoe UI', Arial, sans-serif;
}

.header-wrapper {
  display: flex;
  align-items: center;
  max-width: 2000px;
  margin: 0 auto;
}

.header-logo {
  height: 36px;
  margin-right: 12px;
}

.header-title {
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 0.5px;
}


/* Página Sobre */


.sobre-container {
    /*background: linear-gradient(135deg, #e0eafc, #cfdef3);*/
    max-width: 1200px;
    margin: 60px auto;
    padding: 40px;
    background-color: #ffffff;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 40px;
}

.sobre-imagem {
    width: 200px;  /*ou qualquer valor fixo para evitar quebra */
    height: auto;
    display: block;
}

.sobre-conteudo {
    flex: 1;
}

.sobre-titulo {
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 15px;
    color: #1e2a38;
}

.sobre-texto {
    font-size: 1.5rem;
    line-height: 1.6;
    color: #4a4a4a;
}

@media (max-width: 768px) {
    .sobre-container {
        flex-direction: column;
        text-align: center;
    }

    .sobre-imagem {
        max-width: 90%;
        height: auto;
    }
}

/************************************************/
/*             Ajustando GRIDVIEW               */
/************************************************/
/* Container para controlar a altura e a rolagem (mantido como estava) */

.gridview-wrapper {
    position: relative;
    width: 100%;
    max-width: 2000px;
    margin: 0 auto;
    /* ❌ Remover altura e overflow */
    /* height: 250px; */
     overflow-x: auto; 
    /* overflow-y: auto; */
}

/*.gridview-wrapper {*/
    /*position: relative;*/
    /*height: 250px;  Defina a altura fixa desejada para o seu GridView  */
    /*overflow-x: auto;*/
    /*overflow-y: auto;*/
         /*--- Adição para centralizar horizontalmente ---*/
    /*max-width: 2000px;*/  /*Defina uma largura máxima para o GridView, se desejar*/ 
    /*margin: 0 auto;*/     /*Centraliza o bloco horizontalmente*/ 
/*}*/

   
/* Estilos para a tabela gerada pelo GridView (mantido como estava) */
.gridview-wrapper table {
    width: 100%;
    border-collapse: collapse;
    white-space: nowrap;
}

/* Estilos para células do cabeçalho e dados */
.gridview-wrapper th,
.gridview-wrapper td {
    /* --- Ajuste principal aqui: Reduzindo o padding vertical --- */
    padding: 4px 8px; /* Top/Bottom de 4px, Left/Right de 8px */
    text-align: left;
    border: 1px solid #ddd;
    vertical-align: middle; /* Centraliza o conteúdo verticalmente */
    font-size: 0.85em; /* Reduz a fonte um pouco mais por padrão */
}

/* Estilos específicos para a tabela aninhada dentro de uma célula */
.gridview-wrapper .inner-table {
    width: auto;
    border: none;
}

.gridview-wrapper .inner-table td {
    border: none;
    /* --- Reduzindo o padding das células internas da tabela --- */
    padding: 0;
}

/* --- Media Queries para Telas Menores (com ajuste de fonte e padding) --- */

/* Para telas de tablets e celulares (até 768px de largura) */
@media (max-width: 768px) {
    .gridview-wrapper {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Opcional: Esconde colunas para economizar espaço */
    .gridview-wrapper table th:nth-child(4), /* CNPJ */
    .gridview-wrapper table td:nth-child(4),
    .gridview-wrapper table th:nth-child(7), /* Envio */
    .gridview-wrapper table td:nth-child(7) {
        display: none;
    }

    /* --- Ajuste da fonte e padding para telas menores --- */
    .gridview-wrapper th,
    .gridview-wrapper td {
        padding: 3px 6px; /* Padding menor para top/bottom e left/right */
        font-size: 0.8em; /* Fonte um pouco menor */
    }
}

/* Para telas de celulares (até 480px de largura) */
@media (max-width: 480px) {
    /* Opcional: Esconde mais colunas, se necessário */
    .gridview-wrapper table th:nth-child(5), /* Título */
    .gridview-wrapper table td:nth-child(5) {
        display: none;
    }

    /* --- Ajuste da fonte e padding para telas muito pequenas --- */
    .gridview-wrapper th,
    .gridview-wrapper td {
        padding: 2px 4px; /* Padding ainda menor para top/bottom e left/right */
        font-size: 0.75em; /* Fonte mais reduzida */
    }

    /* Para botões e ícones dentro das células, se necessário */
    .gridview-wrapper .grid-item button,
    .gridview-wrapper .grid-item input[type="button"],
    .gridview-wrapper .grid-item .asp-button, /* Classe padrão de botões ASP.NET, se aplicável */
    .gridview-wrapper .grid-item img {
        font-size: 0.75em; /* Ajusta o tamanho da fonte para botões */
        max-width: 18px; /* Exemplo: reduz o tamanho de ícones */
        max-height: 18px;
        /* Remover ou reduzir margens de botões/imagens se eles estiverem adicionando altura */
        margin: 0;
        padding: 0;
    }

    /* Especificamente para o FileUpload e o ImageButton de "Trocar" */
    .gridview-wrapper .inner-table td input[type="file"],
    .gridview-wrapper .inner-table td img {
        height: 18px; /* Fixa a altura dos elementos para não empurrarem a linha */
        width: auto; /* Mantém a proporção */
        max-width: 100%;
    }

    /* Pode ser necessário ajustar o estilo dos botões "Excluir" e "Select" também */
    .gridview-wrapper td input[type="submit"], /* Botões de formulário */
    .gridview-wrapper td a.aspNetDisabled /* Links de paginação desabilitados */
    {
        padding: 2px 5px; /* Reduz padding de botões */
        font-size: 0.7em;
    }
}

/**********************************************************************/
/* --- ESTILOS ADICIONADOS/AJUSTADOS PARA A PAGINAÇÃO DO GRIDVIEW --- */
/* --- ESTILOS PARA PAGINAÇÃO DO GRIDVIEW --- */

/* Seletor para as células TD que contêm os números de paginação. */
/* Este é o ponto CRÍTICO para controlar o espaçamento entre os números. */
#MainContent_grdarq tr[align="center"] > td > table > tbody > tr > td {
    padding: 0 1px !important; /* Ajuste o segundo valor (horizontal) conforme seu gosto */
    text-align: center;
    border: none !important; /* Remove a borda das células da paginação, se houver. */
    vertical-align: middle;
}

/* Garante que a tabela interna da paginação não adicione espaçamento extra. */
#MainContent_grdarq tr[align="center"] > td > table {
    width: auto; /* Permite que a tabela ocupe apenas o espaço necessário. */
    border-collapse: collapse;
    margin: 0 auto; /* Centraliza a tabela de paginação dentro da célula pai. */
}


/* Estilo para links de paginação ao passar o mouse (hover). */
#MainContent_grdarq tr[align="center"] > td > table > tbody > tr > td > a:hover {
    font-size:16px;
    background-color: white !important; /* Fundo BRANCO para página DISPONÍVEL ao passar o mouse, com !important */
    border-color: white;
    font-weight: bold;
    color: red !important;  /* Texto VERMELHO para página DISPONÍVEL ao passar o mouse, com !important */
}
/***************************************************/


/* Estilos base para os links (outras páginas) - ALVO PRINCIPAL DO PROBLEMA */
/* Aumentamos a especificidade para garantir que estes estilos sejam aplicados */
#MainContent_grdarq tr[align="center"] > td > table > tbody > tr > td > a {
    
    /* ******** PONTOS DE REFORÇO ********* */
    font-size: 14px;
    font-weight: bold;
    border-color: #2461BF;
    background-color: #2461BF  !important; /* Fundo azul para a página ATUAL, com !important */
    color: white !important;             /* Texto branco para a página ATUAL, com !important */
    /* ************************************ */
    
    
}

/* Estilo ESPECÍFICO para o número da página ATUAL (o SPAN). */
/* Este estilo deve SOBRESCRVER o base para o SPAN */
#MainContent_grdarq tr[align="center"] > td > table > tbody > tr > td > span {
    display: inline-block;
    padding: 4px 6px; /* Espaçamento interno de cada número/botão de página. */
    margin: 0 0px;    /* Geralmente '0' aqui, pois o espaçamento entre elementos é controlado pelo `padding` do `<td>` pai. */
    
    font-size: 16px;
    text-decoration: none;
    border: 1px solid #ddd;
    border-radius: 3px;

    background-color: #f9f9f9 !important; /* Fundo padrão para páginas NÃO selecionadas, com !important */
    color: #337ab7 !important; /* Cor do texto para páginas NÃO selecionadas, com !important */

    box-sizing: border-box;
}
    /****************************************************/
    /*---

### Media Queries para Paginação em Telas Menores (Mantidas)

```css*/
    @media (max-width: 768px) {
        #MainContent_grdarq tr[align="center"] > td > table > tbody > tr > td {
            padding: 0 0.5px !important; /* Mais apertado em telas menores. */
        }

            #MainContent_grdarq tr[align="center"] > td > table > tbody > tr > td > a,
            #MainContent_grdarq tr[align="center"] > td > table > tbody > tr > td > span {
                padding: 3px 4px;
                font-size: 0.8em;
            }
    }

    @media (max-width: 480px) {
        #MainContent_grdarq tr[align="center"] > td > table > tbody > tr > td {
            padding: 0 0px !important; /* Quase sem espaçamento entre os TDs. */
        }

            #MainContent_grdarq tr[align="center"] > td > table > tbody > tr > td > a,
            #MainContent_grdarq tr[align="center"] > td > table > tbody > tr > td > span {
                padding: 2px 3px;
                font-size: 0.75em;
            }
    }
/**************************/
/*     QrCode Download    */
/**************************/
.qr-code-container {
    text-align: center;
    margin-top: 50px;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 8px;
    display: inline-block; /* Para o container se ajustar ao conteúdo */
}

.qr-code-image {
    width: 250px; /* Largura fixa para o QR Code */
    height: 250px; /* Altura fixa para o QR Code */
    border: 1px solid #eee;
    padding: 5px;
    background-color: #fff;
}

.download-link {
    display: block;
    margin-top: 20px;
    font-size: 1.1em;
    color: #007bff;
    text-decoration: none;
}

    .download-link:hover {
        text-decoration: underline;
    }

/**************************************************/
/******************** GRDCON **********************/
/**************************************************/
/**********************************************************************/
/* --- ESTILOS ADICIONADOS/AJUSTADOS PARA A PAGINAÇÃO DO GRIDVIEW --- */
/* --- ESTILOS PARA PAGINAÇÃO DO GRIDVIEW --- */

/* Seletor para as células TD que contêm os números de paginação. */
/* Este é o ponto CRÍTICO para controlar o espaçamento entre os números. */
#MainContent_grdcon tr[align="center"] > td > table > tbody > tr > td {
    padding: 0 1px !important; /* Ajuste o segundo valor (horizontal) conforme seu gosto */
    text-align: center;
    border: none !important; /* Remove a borda das células da paginação, se houver. */
    vertical-align: middle;
}

/* Garante que a tabela interna da paginação não adicione espaçamento extra. */
#MainContent_grdcon tr[align="center"] > td > table {
    width: auto; /* Permite que a tabela ocupe apenas o espaço necessário. */
    border-collapse: collapse;
    margin: 0 auto; /* Centraliza a tabela de paginação dentro da célula pai. */
}


/* Estilo para links de paginação ao passar o mouse (hover). */
#MainContent_grdcon tr[align="center"] > td > table > tbody > tr > td > a:hover {
    font-size:16px;
    background-color: white !important; /* Fundo BRANCO para página DISPONÍVEL ao passar o mouse, com !important */
    border-color: white;
    font-weight: bold;
    color: red !important;  /* Texto VERMELHO para página DISPONÍVEL ao passar o mouse, com !important */
}
/***************************************************/


/* Estilos base para os links (outras páginas) - ALVO PRINCIPAL DO PROBLEMA */
/* Aumentamos a especificidade para garantir que estes estilos sejam aplicados */
#MainContent_grdcon tr[align="center"] > td > table > tbody > tr > td > a {
    
    /* ******** PONTOS DE REFORÇO ********* */
    font-size: 14px;
    font-weight: bold;
    border-color: #2461BF;
    background-color: #2461BF !important; /* Fundo azul para a página SELECIONADA, com !important */
    color: white !important;             /* Texto branco para a página SELECIONADA, com !important */
    /* ************************************ */
    
    
}

/* Estilo ESPECÍFICO para o número da página ATUAL (o SPAN). */
/* Este estilo deve SOBRESCRVER o base para o SPAN */
#MainContent_grdcon tr[align="center"] > td > table > tbody > tr > td > span {
    display: inline-block;
    padding: 4px 6px; /* Espaçamento interno de cada número/botão de página. */
    margin: 0 0px;    /* Geralmente '0' aqui, pois o espaçamento entre elementos é controlado pelo `padding` do `<td>` pai. */
    
    font-size: 16px;
    text-decoration: none;
    border: 1px solid #ddd;
    border-radius: 3px;

    background-color: #f9f9f9 !important; /* Fundo padrão para páginas NÃO selecionadas, com !important */
    color: #337ab7 !important; /* Cor do texto para páginas NÃO selecionadas, com !important */

    box-sizing: border-box;
}
    /****************************************************/

