/* Documento público (termos/ e privacidade/): texto legal em cartão de papelaria.
   Reaproveita o visual de .folha (conta.css) sem puxar a folha da conta. */
@layer componentes {
  .documento-pagina .topo {
    justify-content: space-between;
  }

  /* O logo deixa de viver num h1 (o h1 é o título do documento). O alvo 56×56
     já vem de .marca; min-width evita o auditor de a11y em tela estreita. */
  a.marca {
    min-width: var(--alvo);
    line-height: 0;
    color: var(--cor-texto);
    text-decoration: none;
  }

  .pular-conteudo {
    min-width: var(--alvo);
  }

  .documento {
    max-width: 65ch;
    margin: var(--espaco-4) auto var(--espaco-6);
    padding: var(--espaco-pad-largo);
    border: var(--borda);
    border-radius: var(--raio);
    background: var(--cor-superficie);
    box-shadow: var(--sombra);
    overflow-wrap: anywhere;
  }

  .documento h1 {
    font-size: var(--fonte-5);
  }

  .documento h2 {
    font-size: var(--fonte-4);
    margin-top: var(--espaco-6);
  }

  .documento h3 {
    font-size: var(--fonte-4);
    margin-top: var(--espaco-4);
  }

  .documento p,
  .documento ul,
  .documento ol,
  .documento dl {
    margin: 0 0 var(--espaco-3);
  }

  .documento ul,
  .documento ol {
    padding: 0 0 0 var(--espaco-5);
  }

  .documento li {
    margin: 0 0 var(--espaco-2);
  }

  .documento__versao {
    color: var(--cor-texto-suave);
  }

  .documento__acoes {
    display: flex;
    flex-wrap: wrap;
    gap: var(--espaco-gap);
    margin: var(--espaco-6) 0 0;
  }

  .documento table {
    width: 100%;
    max-width: 100%;
    margin: 0 0 var(--espaco-4);
    border-collapse: collapse;
  }

  .documento caption {
    caption-side: top;
    text-align: start;
    font-weight: var(--fonte-peso-forte);
    margin: 0 0 var(--espaco-2);
  }

  .documento th,
  .documento td {
    text-align: start;
    vertical-align: top;
    padding: var(--espaco-2) var(--espaco-3);
    border-bottom: var(--borda-largura-fina) solid var(--cor-borda);
  }

  .documento th {
    font-weight: var(--fonte-peso-forte);
  }

  .documento td[data-rotulo]::before {
    content: none;
  }

  @media (max-width: 699px) {
    .documento thead {
      position: absolute;
      width: var(--espaco-px-1);
      height: var(--espaco-px-1);
      padding: 0;
      margin: calc(-1 * var(--espaco-px-1));
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }

    .documento table,
    .documento tbody,
    .documento tr,
    .documento th,
    .documento td {
      display: block;
      width: 100%;
    }

    .documento tr {
      margin: 0 0 var(--espaco-4);
      padding: 0 0 var(--espaco-3);
      border-bottom: var(--borda-largura-fina) solid var(--cor-borda);
    }

    .documento th,
    .documento td {
      padding: var(--espaco-2) 0;
      border: 0;
    }

    .documento td[data-rotulo]::before {
      content: attr(data-rotulo);
      display: block;
      font-weight: var(--fonte-peso-forte);
      margin: 0 0 var(--espaco-1);
    }
  }

  @media print {
    .pular-conteudo,
    .topo .botao,
    .documento__acoes {
      display: none;
    }

    body {
      background-image: none;
    }

    .documento {
      max-width: none;
      margin: 0;
      box-shadow: none;
    }
  }
}