:root {
    --pl-font-title: 28px;
    --pl-font-title-mobile: 24px;
    --pl-font-subtitle: 18px;
    --pl-font-body: 14px;
    --pl-font-menu: 13px;
    --pl-font-table-head: 11px;
    --pl-font-table-body: 12px;
    --pl-font-table-subline: 10px;
    --pl-font-kpi: 28px;
    --pl-line-body: 1.45;
    --pl-line-compact: 1.25;
}

body:not(.site-publico) {
    font-size: var(--pl-font-body);
    line-height: var(--pl-line-body);
}

body:not(.site-publico) h1,
body:not(.site-publico) .introducao h1,
body:not(.site-publico) .cabecalho-pagina-relatorio h1,
body:not(.site-publico) .week-topbar h1,
body:not(.site-publico) .page-head h2,
body:not(.site-publico) .ficha-topo h1 {
    font-size: var(--pl-font-title) !important;
    line-height: 1.12;
}

body:not(.site-publico) h2,
body:not(.site-publico) .titulo-painel h2,
body:not(.site-publico) .cabecalho-painel-relatorio h2,
body:not(.site-publico) .titulo-secao-relatorio h2,
body:not(.site-publico) .section-heading h2,
body:not(.site-publico) .panel-title,
body:not(.site-publico) .painel h2,
body:not(.site-publico) .form-section h3 {
    font-size: var(--pl-font-subtitle) !important;
    line-height: 1.2;
}

body:not(.site-publico) p,
body:not(.site-publico) li,
body:not(.site-publico) label,
body:not(.site-publico) input,
body:not(.site-publico) select,
body:not(.site-publico) textarea,
body:not(.site-publico) button,
body:not(.site-publico) .descricao,
body:not(.site-publico) .texto-analitico {
    font-size: var(--pl-font-body);
}

body:not(.site-publico) nav a,
body:not(.site-publico) nav button,
body:not(.site-publico) .tabs a,
body:not(.site-publico) .abas button,
body:not(.site-publico) .cadastro-aba,
body:not(.site-publico) .menu-relatorio-item > span:last-child,
body:not(.site-publico) .mr-nav a,
body:not(.site-publico) .am-module-nav a {
    font-size: var(--pl-font-menu) !important;
    line-height: var(--pl-line-compact);
}

body:not(.site-publico) table,
body:not(.site-publico) tbody,
body:not(.site-publico) td,
body:not(.site-publico) .tabela-relatorio tbody td,
body:not(.site-publico) .schedule-table,
body:not(.site-publico) .tabela-elenco {
    font-size: var(--pl-font-table-body) !important;
    line-height: var(--pl-line-compact);
}

body:not(.site-publico) th,
body:not(.site-publico) thead th,
body:not(.site-publico) .tabela-relatorio thead th,
body:not(.site-publico) .tabela-ordenavel th,
body:not(.site-publico) .schedule-table thead th {
    font-size: var(--pl-font-table-head) !important;
    line-height: var(--pl-line-compact);
}

body:not(.site-publico) small,
body:not(.site-publico) td small,
body:not(.site-publico) th small,
body:not(.site-publico) .subtitulo-secao,
body:not(.site-publico) .eyebrow,
body:not(.site-publico) .identificacao,
body:not(.site-publico) .titulo-painel span,
body:not(.site-publico) .cabecalho-painel-relatorio span,
body:not(.site-publico) .titulo-secao-relatorio span,
body:not(.site-publico) .linha-filtros-tabela input,
body:not(.site-publico) .linha-filtros-tabela select,
body:not(.site-publico) .contador-linhas-tabela,
body:not(.site-publico) .legenda-indicadores-tabela,
body:not(.site-publico) .mr-eyebrow,
body:not(.site-publico) .mr-subtitle {
    font-size: var(--pl-font-table-subline) !important;
    line-height: var(--pl-line-compact);
}

body:not(.site-publico) .resumo strong,
body:not(.site-publico) .card .value,
body:not(.site-publico) .am-kpis strong,
body:not(.site-publico) .mr-kpi strong,
body:not(.site-publico) .valor-principal-card,
body:not(.site-publico) .grade-indicadores-chegada strong {
    font-size: var(--pl-font-kpi) !important;
    line-height: 1;
}

@media (max-width: 760px) {
    body:not(.site-publico) h1,
    body:not(.site-publico) .introducao h1,
    body:not(.site-publico) .cabecalho-pagina-relatorio h1,
    body:not(.site-publico) .week-topbar h1,
    body:not(.site-publico) .page-head h2,
    body:not(.site-publico) .ficha-topo h1 {
        font-size: var(--pl-font-title-mobile) !important;
    }
}

.pl-system-header {
    min-height: 76px;
    padding: 12px 28px;
    background: #ffffff;
    color: #102a43;
    border-bottom: 1px solid #d8e1ec;
    display: grid;
    grid-template-columns: minmax(230px, 1fr) minmax(240px, auto) minmax(230px, 1fr);
    align-items: center;
    gap: 20px;
    position: sticky;
    top: 0;
    z-index: 1000;
}

.pl-system-brand,
.pl-system-club {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.pl-system-logo {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #d8e1ec;
    font-size: 20px;
    font-weight: 900;
    line-height: 1;
    text-align: center;
    text-decoration: none;
}

.pl-system-logo-p {
    color: #0d47a1;
}

.pl-system-logo-l {
    color: #00b894;
}

.pl-system-page {
    min-width: 0;
    text-align: center;
}

.pl-system-club {
    justify-content: flex-end;
    text-align: right;
}

.pl-system-brand strong,
.pl-system-page strong,
.pl-system-club strong,
.pl-system-brand span,
.pl-system-page span,
.pl-system-club span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pl-system-brand strong,
.pl-system-page strong,
.pl-system-club strong {
    color: #102a43;
    font-size: 18px;
    font-weight: 900;
    line-height: 1.15;
}

.pl-system-brand span,
.pl-system-page span,
.pl-system-club span {
    margin-top: 3px;
    color: #637083;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;
}

@media (max-width: 860px) {
    .pl-system-header {
        position: static;
        grid-template-columns: 1fr;
        align-items: flex-start;
        gap: 12px;
        padding: 12px 16px;
    }

    .pl-system-page,
    .pl-system-club {
        text-align: left;
    }

    .pl-system-club {
        justify-content: flex-start;
    }

    .pl-system-header .pl-idioma-seletor {
        justify-self: start;
    }
}

.pl-system-footer {
    padding: 14px 28px;
    text-align: center;
    border-top: 1px solid #d8e1ec;
    background: #ffffff;
    flex-shrink: 0;
}

/* Usado pelos templates-base (layout.html, analise_mercado/base.html,
   captacao/_base.html, treino_forca/_base.html,
   monitoramento_remoto/base_monitoramento_remoto.html) pra grudar o
   rodape no fim da tela quando a pagina tem pouco conteudo - sem isso o
   rodape nasce logo depois do conteudo curto, com um vao em branco ate o
   fim da viewport. Classe propria (nao aplicada a <body> generico) pra
   nao arriscar quebrar os templates standalone, que tem layouts proprios
   diversos e nao foram auditados visualmente um a um. */
.pl-page-shell {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}
.pl-page-shell > main {
    flex: 1 0 auto;
}

.pl-system-footer p {
    margin: 0;
    color: #637083;
    font-size: 11px !important;
    font-weight: 700;
    line-height: 1.2;
}

@media print {
    .pl-system-footer {
        display: none !important;
    }
}

/* Ordem de Execucao "Internacionalizacao global e seletor permanente de
   idioma" (2026-09-14): componente do seletor de idioma. Compartilhado
   entre o cabecalho do sistema autenticado (grid acima) e a tela de
   login (templates/login.html), ambos carregam este arquivo. */
.pl-idioma-seletor {
    position: relative;
    justify-self: end;
}

.pl-idioma-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 36px;
    padding: 6px 10px;
    border: 1px solid #d8e1ec;
    border-radius: 8px;
    background: #ffffff;
    color: #102a43;
    font: inherit;
    cursor: pointer;
}

.pl-idioma-toggle:hover,
.pl-idioma-toggle:focus-visible {
    border-color: #0d47a1;
}

.pl-idioma-bandeira {
    display: inline-flex;
    align-items: center;
    line-height: 1;
}

.pl-idioma-bandeira-svg {
    width: 20px;
    height: 14px;
    border-radius: 2px;
    display: block;
    flex-shrink: 0;
    box-shadow: 0 0 0 1px rgba(16, 42, 67, 0.15);
}

.pl-idioma-codigo {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.pl-idioma-seta {
    width: 12px;
    height: 12px;
    flex: 0 0 12px;
}

.pl-idioma-lista {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 1200;
    min-width: 220px;
    margin: 0;
    padding: 6px;
    list-style: none;
    border: 1px solid #d8e1ec;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 12px 28px rgba(0, 18, 40, 0.16);
}

.pl-idioma-lista[hidden] {
    display: none;
}

.pl-idioma-opcao {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 6px;
    color: #102a43;
    font-size: 13px;
    text-decoration: none;
}

.pl-idioma-opcao:hover,
.pl-idioma-opcao:focus-visible {
    background: #eef3f8;
}

.pl-idioma-opcao-atual {
    font-weight: 800;
}

.pl-idioma-nome {
    flex: 1 1 auto;
}

.pl-idioma-check {
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
    color: #0e8fa0;
}

/* Variante usada na tela de login (standalone, sem o grid do cabecalho
   do sistema): fica fixo no canto superior direito da viewport. */
.pl-idioma-seletor--flutuante {
    position: fixed;
    top: 16px;
    right: 16px;
    z-index: 1300;
}

@media print {
    .pl-idioma-seletor {
        display: none !important;
    }
}

/* Impressao: mantem o cabecalho lado a lado (marca | titulo da pagina |
   clube), igual a tela — so encolhe fonte/icones/gap pra caber mesmo se o
   navegador imprimir em retrato (o @page{size:landscape} de cada tela nem
   sempre e respeitado pelo dialogo de impressao). Nao empilha em linhas
   separadas. */
@media print {
    .pl-system-header {
        position: static;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        min-height: auto;
        padding: 6px 10px;
    }

    .pl-system-brand,
    .pl-system-page,
    .pl-system-club {
        flex: 1 1 0;
        min-width: 0;
    }

    .pl-system-brand strong,
    .pl-system-page strong,
    .pl-system-club strong {
        font-size: 12px;
    }

    .pl-system-brand span,
    .pl-system-page span,
    .pl-system-club span {
        font-size: 8px;
        margin-top: 0;
    }

    .pl-system-logo {
        width: 26px;
        height: 26px;
        flex: 0 0 26px;
        font-size: 12px;
    }
}
