/* =============================================================
   Rodapé — crédito de desenvolvimento e links legais
   -------------------------------------------------------------
   O crédito da Angatu Sistemas aparece em toda página que tem
   rodapé. O logotipo é o arquivo oficial (branco sobre fundo
   transparente, feito para fundo escuro — que é o do VagaCidade);
   nunca uma versão redesenhada.
   ============================================================= */

@layer components {

  .ds-footer {
    margin-block-start: var(--space-12);
    padding: var(--space-6) var(--gutter);
    border-block-start: 1px solid var(--border-subtle);
    text-align: center;
    font-size: var(--fs-xs);
    color: var(--text-subtle);
  }

  .ds-footer__links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: var(--space-2) var(--space-4);
  }

  .ds-footer__links a {
    color: var(--text-muted);
    text-decoration: none;
    min-block-size: var(--tap-target);
    display: inline-flex;
    align-items: center;
  }

  .ds-footer__copy {
    margin-block-start: var(--space-2);
  }

  .ds-credito {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    margin-block-start: var(--space-4);
    min-block-size: var(--tap-target);
    padding-inline: var(--space-2);
    text-decoration: none;
    color: var(--text-subtle);
    transition: opacity var(--dur-fast) var(--ease-out);
  }

  .ds-credito__marca {
    block-size: 1.625rem;
    inline-size: auto;
    display: block;
  }

  @media (hover: hover) and (pointer: fine) {

    .ds-footer__links a:hover {
      color: var(--text-strong);
    }

    .ds-credito:hover {
      opacity: 0.75;
    }
  }

  .ds-footer__links a:focus-visible,
  .ds-credito:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring);
    border-radius: var(--radius-xs);
  }

  @media (prefers-reduced-motion: reduce) {

    .ds-credito {
      transition: none;
    }
  }
}