/* Camada visual compartilhada do portal da secretaria.
   Mantém as cores das ações e os layouts específicos de cada módulo.
   A impressão continua usando os estilos originais. */
@media screen {
  .portal-refinado {
    --card-border-radius: 1.2rem;
    --card-padding: 1.5rem;
    --box-shadow: 0 6px 22px rgba(35, 45, 65, 0.07);
    --glass-shadow: 0 6px 22px rgba(35, 45, 65, 0.08);
    --clr-dark-variant: #44536a;
    --clr-info-dark: #526074;
  }

  .portal-refinado.dark-theme-variables,
  .dark-theme-variables .portal-refinado {
    --clr-dark-variant: #c6ceda;
    --clr-info-dark: #b7c1d0;
    --box-shadow: 0 6px 22px rgba(0, 0, 0, 0.2);
    --glass-shadow: 0 6px 22px rgba(0, 0, 0, 0.22);
  }

  .portal-refinado main { min-width: 0; }

  .portal-refinado main > h1:first-child {
    margin-bottom: 1.25rem;
    color: var(--clr-dark);
    font-size: clamp(1.5rem, 1.1rem + 1vw, 2rem);
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.035em;
    overflow-wrap: anywhere;
  }

  .portal-refinado main h2 {
    color: var(--clr-dark);
    line-height: 1.4;
    font-weight: 600;
  }

  .portal-refinado main .box {
    gap: 1.25rem;
    border-radius: var(--card-border-radius);
  }

  .portal-refinado main label {
    color: var(--clr-dark);
    font-weight: 500;
    line-height: 1.5;
  }

  .portal-refinado main :is(
    input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
    select, textarea
  ) {
    box-sizing: border-box;
    min-width: 0;
    min-height: 2.75rem;
    padding: 0.75rem 0.9rem;
    border: 1px solid var(--clr-border);
    border-radius: 0.7rem;
    background-color: var(--clr-white);
    color: var(--clr-dark);
    font-family: inherit;
    font-size: 0.9rem;
    line-height: 1.5;
    transition: border-color 150ms ease, box-shadow 150ms ease;
  }

  .portal-refinado main :is(input, textarea)::placeholder {
    color: var(--clr-placeholder);
    opacity: 1;
  }

  .portal-refinado main :is(input, select, textarea):focus-visible {
    border-color: var(--clr-primary);
    outline: 2px solid var(--clr-primary);
    outline-offset: 2px;
  }

  .portal-refinado :is(button, a, summary):focus-visible {
    outline: 2px solid var(--clr-primary);
    outline-offset: 3px;
  }

  .portal-refinado main :is(.btn, .btn-excel, .btn-salvar) {
    min-height: 2.75rem;
    padding: 0.75rem 1.1rem;
    border-radius: 0.7rem;
    font-family: inherit;
    font-weight: 600;
    line-height: 1.5;
    transition: background-color 150ms ease, box-shadow 150ms ease;
  }

  .portal-refinado main button:disabled {
    cursor: not-allowed;
    opacity: 0.72;
  }

  .portal-refinado main :is(
    input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="reset"]),
    select, textarea
  ):disabled {
    cursor: not-allowed;
    opacity: 1;
    color: var(--clr-disabled-text);
    -webkit-text-fill-color: var(--clr-disabled-text);
    background-color: var(--clr-disabled-bg);
  }

  .portal-refinado aside .sidebar a {
    min-height: 2.75rem;
    transition: background-color 150ms ease, color 150ms ease;
  }

  .portal-refinado .dashboard-numero {
    border-radius: var(--card-border-radius);
  }

  .portal-refinado .dashboard-fila {
    border-radius: var(--card-border-radius);
    box-shadow: var(--box-shadow);
  }

  .portal-refinado .dashboard-fila h3 {
    font-size: 1rem;
    font-weight: 600;
  }

  .portal-refinado .link-revisao-texto {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
    margin-bottom: 1rem;
    padding: 0.65rem 0.9rem;
    border: 1px solid var(--clr-primary);
    border-radius: 0.7rem;
    color: var(--clr-primary);
    font-weight: 600;
    line-height: 1.5;
  }

  .portal-refinado .link-revisao-texto:hover {
    background: var(--clr-light);
  }
}

@media screen and (max-width: 768px) {
  .portal-refinado { --card-padding: 1.1rem; }

  /* 16px evita o zoom automático do Safari ao preencher os campos. */
  .portal-refinado main :is(input, select, textarea) { font-size: 16px; }

  .portal-refinado main > h1:first-child { margin-bottom: 0.75rem; }
  .portal-refinado main .box { gap: 1rem; }
  .portal-refinado .link-revisao-texto { max-width: 100%; }
}

@media screen and (prefers-reduced-motion: reduce) {
  .portal-refinado main :is(input, select, textarea, .btn, .btn-excel, .btn-salvar),
  .portal-refinado aside .sidebar a { transition: none; }
}

/* Detalhes de uso compartilhados; sem alterar a impressão. */
@media screen {
  .portal-refinado .table-wrapper {
    min-width: 0;
    max-width: 100%;
    overscroll-behavior-x: contain;
  }

  .portal-refinado .table-wrapper:focus-visible {
    outline: 2px solid var(--clr-primary);
    outline-offset: 3px;
  }

  .portal-refinado .aviso-rolagem-tabela {
    margin: 0.75rem 0;
    color: var(--clr-info-dark);
    font-size: 0.8rem;
    line-height: 1.5;
  }

  .portal-refinado .paginacao button:is(.ativo, :hover):not(:disabled),
  .portal-refinado :is(#tabelaOficios, #tabelaCirculares, #tabelaContratos, #tabelaServidores) thead th {
    color: #fff;
  }

  .portal-refinado .paginacao button:disabled {
    cursor: not-allowed;
    opacity: 0.72;
  }

  .portal-refinado .dialogo-global {
    max-height: calc(100dvh - 2rem);
    overflow-y: auto;
    overflow-wrap: anywhere;
  }

  .portal-refinado .dialogo-global-prompt {
    display: block;
    width: 100%;
    min-height: 7rem;
    margin-top: 1rem;
    padding: 0.8rem;
    resize: vertical;
    border: 1px solid var(--clr-info-dark);
    border-radius: 0.7rem;
    background: var(--clr-color-background);
    color: var(--clr-dark);
    font: inherit;
  }

  .portal-refinado .dialogo-global-prompt::placeholder {
    color: var(--clr-placeholder);
    opacity: 1;
  }

  .portal-refinado .dialogo-global-prompt:focus-visible {
    outline: 2px solid var(--clr-primary);
    outline-offset: 2px;
  }

  .portal-refinado .dialogo-global-prompt[aria-invalid="true"] {
    border-color: var(--clr-danger);
  }

  .portal-refinado .dialogo-global-conteudo .dialogo-global-erro {
    margin-top: 0.5rem;
    color: var(--clr-danger);
    font-size: 0.85rem;
  }
}

@media screen and (max-width: 768px) {
  .portal-refinado .paginacao button {
    min-width: 44px;
    min-height: 44px;
  }

  .portal-refinado .dialogo-global-prompt { font-size: 16px; }
  .portal-refinado .dialogo-global-acoes { flex-wrap: wrap; }
  .portal-refinado .btn-dialogo { min-height: 44px; }
}

@media print {
  .aviso-rolagem-tabela { display: none; }
}

/* Componentes com a mesma linguagem visual em todos os módulos. */
@media screen {

  .portal-refinado main :is(
    .campo-busca, .campo-busca-oficios, .campo-busca-servidores,
    .campo-busca-contratos, .campo-busca-escolas, .campo-busca-usuarios,
    .campo-busca-estoque, .busca-central-solicitacoes, .campo-data,
    .filtro-tipo-contrato
  ) {
    min-width: 0;
    max-width: 100%;
    min-height: 44px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 0.7rem;
    background: var(--clr-white);
  }

  .portal-refinado main :is(
    .campo-busca, .campo-busca-oficios, .campo-busca-servidores,
    .campo-busca-contratos, .campo-busca-escolas, .campo-busca-usuarios,
    .campo-busca-estoque, .busca-central-solicitacoes, .campo-data,
    .filtro-tipo-contrato
  ):focus-within {
    outline: 2px solid var(--clr-primary);
    outline-offset: 2px;
  }

  .portal-refinado main :is(
    .campo-busca, .campo-busca-oficios, .campo-busca-servidores,
    .campo-busca-contratos, .campo-busca-escolas, .campo-busca-usuarios,
    .campo-busca-estoque, .busca-central-solicitacoes, .campo-data,
    .filtro-tipo-contrato
  ) :is(input, select) {
    width: 100%;
    min-width: 0;
    min-height: 2.75rem;
    /* A moldura e o foco pertencem ao conjunto. Os !important neutralizam
       a especificidade dos seletores gerais de tipos de input acima. */
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
  }

  .portal-refinado main .busca-central-solicitacoes input {
    padding-inline: 0.75rem !important;
  }

  .portal-refinado main .campo-data > span {
    flex-shrink: 0;
    margin-bottom: 0;
  }

  .portal-refinado main .estoque-toolbar > #filtroCategoriaEstoque {
    width: auto;
    max-width: 100%;
    min-height: 2.75rem;
  }

  .portal-refinado main :is(
    .card-evento, .item-tarefa, .card-usuario, .card-escola,
    .card-turma-escola, .usuario-admin-card, .quadro-indicador,
    .timeline-card, .box-dados, .card-aditivo
  ) {
    border-radius: var(--border-radius-3);
  }

  .portal-refinado main novo,
  .portal-refinado #tabelaDfds thead th,
  .portal-refinado main .modalidade-check input:checked + span {
    color: #fff;
  }

  .portal-refinado .msg, .portal-refinado #btnTopo { color: #fff; }

  .portal-refinado main .checkbox-tarefa { appearance: auto; }

  .portal-refinado .quadro-indicadores {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
  }

  .portal-refinado .dados-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
  }

  .portal-refinado .lista-usuarios-admin {
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr));
  }
}

@media screen and (max-width: 1100px) {
  .portal-refinado .coordenador-adicionar {
    grid-template-columns: minmax(0, 1fr);
  }
  .portal-refinado .coordenador-adicionar .btn { width: 100%; }
}

@media screen and (max-width: 650px) {
  .portal-refinado main :is(.btn-editar-evento, .btn-excluir-evento, .btn-excluir-tarefa) {
    min-width: 44px;
    min-height: 44px;
  }
  .portal-refinado .quadro-indicadores { grid-template-columns: minmax(0, 1fr); }
  .portal-refinado #btnGerarQuadro { min-width: 0; }
}

/* A adaptação acompanha a largura da coluna, inclusive com o menu lateral aberto. */
@media screen {
  .portal-refinado .escolas-grid { container: escolas / inline-size; }
  .portal-refinado .quadro-controle { container: quadro / inline-size; }
  .portal-refinado .lista-escolas {
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
  }
  .portal-refinado .lista-turmas-escola {
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr));
  }
  .portal-refinado .lista-materiais {
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr));
  }
  .portal-refinado .lista-usuarios {
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr));
  }
}

@container escolas (max-width: 760px) {
  .coordenador-adicionar { grid-template-columns: minmax(0, 1fr); }
  .coordenador-adicionar .btn { width: 100%; }
}

@container quadro (max-width: 740px) {
  .quadro-selecao { grid-template-columns: minmax(0, 1fr); }
  .quadro-botoes-acao { flex-wrap: wrap; }
  .quadro-botoes-acao .btn { flex: 1; }
  .quadro-controle .label-invisivel { display: none; }
  #btnGerarQuadro { min-width: 0; }
}