/* ═══════════════════════════════════════════════════════════════
   ROYAL NAVY — PÁGINA DE CONSULTA (/consulta)
   Usa os tokens do style.css (claro) e do dark.css (escuro).
   ═══════════════════════════════════════════════════════════════ */

/* O atributo hidden precisa vencer os "display" definidos abaixo */
.page-consulta [hidden] { display: none !important; }

.sr-only {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.skip-link {
  position: absolute; left: 1rem; top: -4rem; z-index: 2000;
  padding: 0.6rem 1rem; border-radius: var(--radius-sm);
  background: var(--navy-900); color: #fff; font-weight: 600;
  transition: top 0.2s var(--ease);
}
.skip-link:focus { top: 0.8rem; }

a.nav-brand { display: flex; align-items: center; gap: 0.6rem; text-decoration: none; }

/* ── Cabeçalho ─────────────────────────────────────────────── */
.consulta-hero {
  position: relative;
  padding: 118px 1.5rem 96px;
  text-align: center;
  color: var(--on-dark);
  background:
    radial-gradient(ellipse 60% 70% at 82% 8%, rgba(255, 236, 159, 0.55), transparent 62%),
    linear-gradient(180deg, #1f86cf 0%, #3fa5e3 46%, #7ccaf1 100%);
}
.consulta-hero::after {
  content: '';
  position: absolute; left: 0; right: 0; bottom: -1px; height: 46px;
  background: var(--sky-50);
  -webkit-mask: var(--wave-mask) center / 100% 100% no-repeat;
          mask: var(--wave-mask) center / 100% 100% no-repeat;
}
.consulta-hero__inner { max-width: 820px; margin: 0 auto; }
.consulta-hero .section-tag { color: var(--sun-200); border-color: rgba(255, 236, 159, 0.55); background: rgba(255, 255, 255, 0.14); }
.consulta-title {
  font-family: 'Cinzel', serif;
  font-size: clamp(2.1rem, 5vw, 3.6rem);
  font-weight: 700;
  line-height: 1.12;
  text-shadow: 0 4px 26px rgba(10, 42, 74, 0.45);
}
.consulta-title .accent { color: var(--sun-300); }
.consulta-sub { margin: 0.9rem auto 1.8rem; max-width: 640px; color: var(--on-dark-secondary); text-shadow: 0 1px 12px rgba(10, 42, 74, 0.4); }
.consulta-sub em { font-style: normal; font-weight: 600; color: var(--sun-200); }

/* ── Campo de busca e filtros ──────────────────────────────── */
.consulta-form { display: grid; gap: 0.9rem; }
.consulta-field {
  position: relative;
  display: flex; align-items: center;
  background: #fff;
  border-radius: 100px;
  border: 2px solid rgba(255, 255, 255, 0.7);
  box-shadow: 0 18px 44px -16px rgba(10, 42, 74, 0.55);
  transition: box-shadow 0.25s var(--ease), border-color 0.25s var(--ease);
}
.consulta-field:focus-within { border-color: var(--sun-400); box-shadow: 0 18px 44px -16px rgba(10, 42, 74, 0.55), 0 0 0 4px rgba(255, 198, 46, 0.4); }
.consulta-field__icon { width: 24px; height: 24px; margin-left: 1.3rem; flex-shrink: 0; color: var(--sea-600); }
.consulta-field input {
  flex: 1; min-width: 0;
  padding: 1.05rem 1rem;
  font: 500 1.05rem 'Inter', system-ui, sans-serif;
  color: var(--navy-900);
  background: transparent; border: 0; outline: 0;
  -webkit-appearance: none; appearance: none;
}
.consulta-field input::placeholder { color: var(--text-muted); }
.consulta-field input::-webkit-search-cancel-button { display: none; }
.consulta-field__limpar {
  width: 36px; height: 36px; margin-right: 0.6rem; flex-shrink: 0;
  font-size: 1.5rem; line-height: 1; color: var(--text-secondary);
  background: var(--sky-100); border: 0; border-radius: 50%; cursor: pointer;
}
.consulta-field__limpar:hover { background: var(--sky-200); }

.consulta-filtros { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.7rem; text-align: left; }
.consulta-select { display: grid; gap: 0.25rem; }
.consulta-select span { font: 600 0.72rem 'Rajdhani', sans-serif; letter-spacing: 0.18em; text-transform: uppercase; color: var(--sun-200); }
.consulta-select select {
  width: 100%; padding: 0.7rem 0.9rem;
  font: 500 0.95rem 'Inter', system-ui, sans-serif;
  color: var(--navy-900);
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid rgba(255, 255, 255, 0.7); border-radius: var(--radius-md);
  cursor: pointer;
}
.consulta-ajuda { margin-top: 0.9rem; font-size: 0.86rem; color: var(--on-dark-muted); }

/* ── Área principal ────────────────────────────────────────── */
.consulta-main { max-width: 1240px; margin: 0 auto; padding: 1.2rem 1.5rem 4.5rem; min-height: 46vh; }

.consulta-aviso {
  margin: 0 auto 1.4rem; max-width: 820px; padding: 1rem 1.3rem;
  border-radius: var(--radius-md); font-size: 0.95rem;
  color: var(--navy-800); background: var(--sky-100); border: var(--border-soft);
}
.consulta-aviso--erro { color: #7a1c0c; background: #ffe9e3; border: 1px solid rgba(242, 89, 58, 0.45); }

.consulta-grid { display: grid; grid-template-columns: minmax(300px, 400px) minmax(0, 1fr); gap: 1.8rem; align-items: start; }

.consulta-h2 { font: 700 1.05rem 'Rajdhani', sans-serif; letter-spacing: 0.16em; text-transform: uppercase; color: var(--navy-800); margin-bottom: 0.9rem; }
.consulta-h2__n { color: var(--sea-600); }

.consulta-chips { display: flex; flex-wrap: wrap; gap: 0.45rem; margin-bottom: 1rem; }
.chip {
  display: inline-flex; align-items: center; gap: 0.5rem;
  padding: 0.35rem 0.8rem; cursor: pointer;
  font: 600 0.84rem 'Inter', system-ui, sans-serif; color: var(--navy-700);
  background: #fff; border: var(--border-soft); border-radius: 100px;
  transition: transform 0.2s var(--ease), background-color 0.2s var(--ease), border-color 0.2s var(--ease);
}
.chip:hover { transform: translateY(-2px); background: var(--sky-100); border-color: var(--sky-400); }
.chip__n { font: 700 0.72rem 'Rajdhani', sans-serif; padding: 0.05rem 0.45rem; border-radius: 100px; color: #fff; background: var(--sea-600); }

.resultados { list-style: none; display: grid; gap: 0.6rem; }
.resultados__vazio { padding: 1.2rem; color: var(--text-secondary); background: #fff; border: var(--border-soft); border-radius: var(--radius-md); }
.resultado {
  display: grid; gap: 0.25rem; width: 100%; text-align: left; cursor: pointer;
  padding: 0.85rem 1rem; color: inherit; font: inherit;
  background: var(--grad-card); border: var(--border-soft); border-radius: var(--radius-md);
  box-shadow: var(--shadow-card);
  transition: transform 0.2s var(--ease), box-shadow 0.2s var(--ease), border-color 0.2s var(--ease);
}
.resultado:hover { transform: translateY(-3px); box-shadow: var(--shadow-hover); border-color: var(--sky-400); }
.resultado--ativo { border-color: var(--sun-500); box-shadow: var(--shadow-hover), 0 0 0 2px rgba(249, 167, 26, 0.4); }
.resultado__nome { font: 700 1.05rem 'Cinzel', serif; color: var(--navy-900); }
.resultado__sub { font-size: 0.86rem; color: var(--text-secondary); }
.resultado__tags { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-top: 0.2rem; }

.tag {
  display: inline-block; padding: 0.15rem 0.6rem;
  font: 600 0.72rem 'Rajdhani', sans-serif; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--sea-700); background: rgba(15, 169, 177, 0.12); border-radius: 100px;
}
.tag--forte { color: var(--navy-900); background: var(--sun-200); }
.tag--botao { cursor: pointer; border: 0; font-size: 0.8rem; text-transform: none; letter-spacing: 0.02em; }
.tag--botao:hover { background: rgba(15, 169, 177, 0.24); }

.paginacao { display: flex; align-items: center; justify-content: space-between; gap: 0.8rem; margin-top: 1rem; font-size: 0.9rem; color: var(--text-secondary); }
.btn-mini {
  padding: 0.45rem 0.9rem; cursor: pointer;
  font: 600 0.85rem 'Rajdhani', sans-serif; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--navy-800); background: #fff; border: var(--border-soft); border-radius: 100px;
}
.btn-mini:hover:not(:disabled) { background: var(--sky-100); }
.btn-mini:disabled { opacity: 0.45; cursor: not-allowed; }

/* ── Ficha ─────────────────────────────────────────────────── */
.consulta-ficha {
  position: sticky; top: 90px;
  padding: 0; overflow: hidden;
  background: #fff; border: var(--border-soft); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card);
  outline: none;
}
.consulta-ficha:focus-visible { outline: 3px solid var(--sun-500); outline-offset: 3px; }
.ficha-vazia { padding: 3rem 2rem; text-align: center; color: var(--text-secondary); }
.ficha-vazia__icone { font-size: 3rem; opacity: 0.55; }
.ficha-vazia h2 { margin: 0.4rem 0; font: 700 1.4rem 'Cinzel', serif; color: var(--navy-900); }
.ficha-vazia p { max-width: 420px; margin: 0 auto; }

.ficha-topo { padding: 1.6rem 1.8rem 1.4rem; color: #fff; background: linear-gradient(135deg, var(--navy-800), var(--sky-600)); }
.ficha-tags { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 0.8rem; }
.ficha-nome { font: 700 clamp(1.6rem, 3vw, 2.3rem) 'Cinzel', serif; line-height: 1.15; }
.ficha-sub { margin-top: 0.3rem; color: var(--on-dark-secondary); font-weight: 500; }

.ficha-secao { padding: 1.2rem 1.8rem; border-top: 1px solid rgba(26, 125, 187, 0.12); }
.ficha-secao__titulo { margin-bottom: 0.7rem; font: 700 0.85rem 'Rajdhani', sans-serif; letter-spacing: 0.22em; text-transform: uppercase; color: var(--sun-800); }
.ficha-texto { color: var(--text-secondary); }
.ficha-lista { list-style: none; display: grid; gap: 0.5rem; }
.ficha-lista li { position: relative; padding-left: 1.2rem; color: var(--text-secondary); }
.ficha-lista li::before { content: ''; position: absolute; left: 0; top: 0.62em; width: 7px; height: 7px; border-radius: 50%; background: var(--sea-500); }

.ficha-pares { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0.8rem; }
.ficha-par dt { font: 600 0.72rem 'Rajdhani', sans-serif; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-muted); }
.ficha-par dd { font-weight: 500; color: var(--navy-900); }

.ficha-tempo { list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.8rem; }
.ficha-tempo__item { padding: 0.7rem 0.9rem; border-left: 3px solid var(--sea-500); background: var(--sky-50); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }
.ficha-tempo__item--vazio { border-left-color: var(--sky-200); opacity: 0.75; }
.ficha-tempo__rotulo { display: block; font: 600 0.72rem 'Rajdhani', sans-serif; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-muted); }
.ficha-tempo__data { display: block; font-weight: 600; color: var(--navy-900); }
.ficha-relacionados { list-style: none; display: flex; flex-wrap: wrap; gap: 0.5rem; }

.consulta-footer { margin-top: 0; }

/* ── Modo escuro ───────────────────────────────────────────── */
[data-theme="dark"] .consulta-hero {
  background:
    radial-gradient(ellipse 60% 26% at 50% 100%, rgba(255, 106, 31, 0.32), transparent 72%),
    radial-gradient(ellipse 40% 60% at 12% 10%, rgba(180, 206, 255, 0.10), transparent 70%),
    linear-gradient(180deg, #02050b 0%, #0b1c33 62%, #3a2216 100%);
}
[data-theme="dark"] .consulta-hero::after { background: #04101c; }
[data-theme="dark"] .consulta-hero .section-tag { color: var(--d-ember-l); border-color: rgba(255, 138, 61, 0.5); background: rgba(255, 138, 61, 0.12); }
[data-theme="dark"] .consulta-title .accent { color: var(--d-ember-l); }
[data-theme="dark"] .consulta-sub { color: var(--d-tx2); }
[data-theme="dark"] .consulta-sub em { color: var(--d-ember-l); }
[data-theme="dark"] .consulta-field { background: rgba(6, 22, 40, 0.92); border-color: rgba(120, 180, 220, 0.35); box-shadow: 0 18px 44px -16px rgba(0, 0, 0, 0.8); }
[data-theme="dark"] .consulta-field:focus-within { border-color: var(--d-ember); box-shadow: 0 18px 44px -16px rgba(0, 0, 0, 0.8), 0 0 0 4px rgba(255, 138, 61, 0.32); }
[data-theme="dark"] .consulta-field__icon { color: var(--d-cyan); }
[data-theme="dark"] .consulta-field input { color: var(--d-tx); }
[data-theme="dark"] .consulta-field input::placeholder { color: var(--d-tx3); }
[data-theme="dark"] .consulta-field__limpar { color: var(--d-tx2); background: rgba(120, 180, 220, 0.16); }
[data-theme="dark"] .consulta-select span { color: var(--d-ember-l); }
[data-theme="dark"] .consulta-select select { color: var(--d-tx); background: rgba(6, 22, 40, 0.92); border-color: rgba(120, 180, 220, 0.3); color-scheme: dark; }
[data-theme="dark"] .consulta-ajuda { color: var(--d-tx3); }

[data-theme="dark"] .consulta-aviso { color: var(--d-tx); background: var(--d-panel); border-color: var(--d-line); }
[data-theme="dark"] .consulta-aviso--erro { color: #ffd9cf; background: rgba(120, 30, 14, 0.5); border-color: rgba(255, 106, 31, 0.5); }
[data-theme="dark"] .consulta-h2 { color: var(--d-tx); }
[data-theme="dark"] .consulta-h2__n { color: var(--d-cyan); }
[data-theme="dark"] .chip { color: var(--d-tx); background: var(--d-panel); border-color: var(--d-line); }
[data-theme="dark"] .chip:hover { background: rgba(20, 60, 90, 0.85); border-color: var(--d-cyan); }
[data-theme="dark"] .chip__n { background: #14859d; }
[data-theme="dark"] .resultados__vazio { color: var(--d-tx2); background: var(--d-panel); border-color: var(--d-line); }
[data-theme="dark"] .resultado { background: var(--d-panel-2); border-color: var(--d-line); box-shadow: var(--d-shadow); }
[data-theme="dark"] .resultado:hover { border-color: rgba(255, 138, 61, 0.5); box-shadow: var(--d-shadow-h); }
[data-theme="dark"] .resultado--ativo { border-color: var(--d-ember); box-shadow: var(--d-shadow-h), 0 0 0 2px rgba(255, 138, 61, 0.35); }
[data-theme="dark"] .resultado__nome { color: #f2f7fc; }
[data-theme="dark"] .resultado__sub { color: var(--d-tx2); }
[data-theme="dark"] .tag { color: var(--d-cyan-l); background: rgba(84, 209, 228, 0.12); }
[data-theme="dark"] .tag--forte { color: #1a0d05; background: linear-gradient(135deg, #ffd9a0, #ff9a3c); }
[data-theme="dark"] .tag--botao:hover { background: rgba(84, 209, 228, 0.24); }
[data-theme="dark"] .paginacao { color: var(--d-tx2); }
[data-theme="dark"] .btn-mini { color: var(--d-tx); background: var(--d-panel); border-color: var(--d-line); }
[data-theme="dark"] .btn-mini:hover:not(:disabled) { background: rgba(20, 60, 90, 0.85); }

[data-theme="dark"] .consulta-ficha { background: var(--d-panel-2); border-color: var(--d-line); box-shadow: var(--d-shadow); }
[data-theme="dark"] .ficha-vazia { color: var(--d-tx2); }
[data-theme="dark"] .ficha-vazia h2 { color: #f2f7fc; }
[data-theme="dark"] .ficha-topo { background: linear-gradient(135deg, #0b1c33 0%, #3a1f14 130%); border-bottom: 1px solid rgba(255, 138, 61, 0.35); }
[data-theme="dark"] .ficha-secao { border-top-color: var(--d-line); }
[data-theme="dark"] .ficha-secao__titulo { color: var(--d-ember-l); }
[data-theme="dark"] .ficha-texto, [data-theme="dark"] .ficha-lista li { color: var(--d-tx2); }
[data-theme="dark"] .ficha-lista li::before { background: var(--d-ember); }
[data-theme="dark"] .ficha-par dt, [data-theme="dark"] .ficha-tempo__rotulo { color: var(--d-tx3); }
[data-theme="dark"] .ficha-par dd, [data-theme="dark"] .ficha-tempo__data { color: var(--d-tx); }
[data-theme="dark"] .ficha-tempo__item { background: rgba(20, 50, 80, 0.5); border-left-color: var(--d-ember); }
[data-theme="dark"] .ficha-tempo__item--vazio { border-left-color: var(--d-line); }
[data-theme="dark"] .skip-link { background: var(--d-ember); color: var(--d-ink); }

/* ── Telas menores ─────────────────────────────────────────── */
@media (max-width: 960px) {
  .consulta-grid { grid-template-columns: 1fr; }
  .consulta-ficha { position: static; }
}
@media (max-width: 640px) {
  .consulta-hero { padding: 96px 1rem 80px; }
  .consulta-filtros { grid-template-columns: 1fr; }
  .consulta-main { padding: 1rem 1rem 3.5rem; }
  .ficha-topo, .ficha-secao { padding-left: 1.2rem; padding-right: 1.2rem; }
  .ficha-tempo { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .chip, .resultado, .consulta-field { transition: none; }
  .chip:hover, .resultado:hover { transform: none; }
}
