/* ====================================================================
   TRADUTOR DE DOCUMENTOS - REGRAS ESPECÍFICAS DE ACESSIBILIDADE (A11Y)
   ==================================================================== */

/* --------------------------------------------------------------------
   1. CONTROLE DINÂMICO DE TAMANHO DE FONTE
   -------------------------------------------------------------------- */
html[data-font-size="small"] {
  --font-base: 15px;
}

html[data-font-size="normal"] {
  --font-base: 18px;
}

html[data-font-size="large"] {
  --font-base: 22px;
}

html[data-font-size="xlarge"] {
  --font-base: 26px;
}

/* --------------------------------------------------------------------
   2. FOCO ACESSÍVEL PARA TECLADO (TAB / SHIFT+TAB)
   -------------------------------------------------------------------- */
:focus-visible {
  outline: 3px solid #0284c7 !important;
  outline-offset: 3px !important;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  box-shadow: 0 0 0 3px rgba(2, 132, 199, 0.4);
}

/* --------------------------------------------------------------------
   3. TEMA DE ALTO CONTRASTE (WCAG AAA - MODO ESPECIAL PARA BAIXA VISÃO)
   -------------------------------------------------------------------- */
html[data-theme="high-contrast"] {
  --bg-page: #000000;
  --bg-card: #0a0a0a;
  --text-main: #ffffff;
  --text-muted: #e2e8f0;
  --border-color: #ffff00; /* Amarelo puro de alto contraste */

  --primary: #ffff00;
  --primary-hover: #eab308;
  --primary-text: #000000;

  --accent-teal-bg: #052e16;
  --accent-teal: #4ade80;

  /* Semáforos de Alto Contraste */
  --color-green-bg: #000000;
  --color-green-border: #4ade80;
  --color-green-text: #4ade80;

  --color-yellow-bg: #000000;
  --color-yellow-border: #facc15;
  --color-yellow-text: #facc15;

  --color-red-bg: #000000;
  --color-red-border: #f87171;
  --color-red-text: #f87171;
}

html[data-theme="high-contrast"] .a11y-bar {
  background-color: #000000;
  border-bottom: 2px solid #ffff00;
}

html[data-theme="high-contrast"] .btn-a11y {
  background-color: #000000;
  color: #ffff00;
  border-color: #ffff00;
}

html[data-theme="high-contrast"] .btn-a11y.active,
html[data-theme="high-contrast"] .btn-a11y:hover {
  background-color: #ffff00;
  color: #000000;
}

html[data-theme="high-contrast"] .main-header {
  background-color: #000000;
  border-bottom-color: #ffff00;
}

html[data-theme="high-contrast"] .brand-title {
  color: #ffff00;
}

html[data-theme="high-contrast"] .brand-subtitle {
  color: #ffffff;
}

html[data-theme="high-contrast"] .app-card {
  background-color: #000000;
  border-color: #ffffff;
}

html[data-theme="high-contrast"] .drop-zone {
  background-color: #0f172a;
  border-color: #ffff00;
}

html[data-theme="high-contrast"] .drop-main-text {
  color: #ffffff;
}

html[data-theme="high-contrast"] .tab-btn {
  color: #ffffff;
}

html[data-theme="high-contrast"] .tab-btn.active {
  color: #ffff00;
  background-color: #1e293b;
  border-bottom-color: #ffff00;
}

html[data-theme="high-contrast"] .summary-hero-box {
  background-color: #000000;
  border-color: #4ade80;
}

html[data-theme="high-contrast"] .summary-text {
  color: #4ade80;
}

html[data-theme="high-contrast"] .audio-player-card {
  background-color: #000000;
  border-color: #ffff00;
}

html[data-theme="high-contrast"] .info-card {
  background-color: #000000;
  border-color: #ffffff;
}

html[data-theme="high-contrast"] .alert-box-wrapper {
  background-color: #000000;
  border-color: #f87171;
}

html[data-theme="high-contrast"] .alert-item {
  background-color: #18181b;
  border-left-color: #f87171;
}

html[data-theme="high-contrast"] .alert-heading,
html[data-theme="high-contrast"] .alert-item strong {
  color: #f87171;
}

html[data-theme="high-contrast"] .accessible-textarea {
  background-color: #000000;
  color: #ffffff;
  border-color: #ffffff;
}

html[data-theme="high-contrast"] .sample-buttons-wrapper {
  background-color: #000000;
  border-color: #ffffff;
}

html[data-theme="high-contrast"] .btn-outline {
  color: #ffffff;
  border-color: #ffffff;
}

html[data-theme="high-contrast"] :focus-visible {
  outline: 4px solid #ffff00 !important;
}

/* --------------------------------------------------------------------
   4. SUPORTE A PREFERÊNCIA DE MOVIMENTO REDUZIDO
   -------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
