/* ── Custom properties ──────────────────────────────────────────────────── */
:root {
  --bg:      #ffffff;
  --fg:      #1a1a1a;
  --muted:   #555555;
  --border:  #d0d0d0;
  --accent:  #1a56a0;
  --accent-h:#0d3d7a;
  --input-bg:#f5f5f5;
  --note-bg: #f0f4f8;
  --max-w:   720px;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg:      #111111;
    --fg:      #e8e8e8;
    --muted:   #aaaaaa;
    --border:  #333333;
    --accent:  #5b9bd5;
    --accent-h:#7ab3e0;
    --input-bg:#1e1e1e;
    --note-bg: #1a2233;
  }
}

/* ── Reset / base ───────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
               'Helvetica Neue', Arial, sans-serif;
  font-size: 1rem;
  line-height: 1.6;
  background: var(--bg);
  color: var(--fg);
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

a { color: var(--accent); text-decoration: none; }
a:hover { color: var(--accent-h); text-decoration: underline; }

/* ── Layout ─────────────────────────────────────────────────────────────── */
header, main, footer {
  width: 100%;
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 1rem;
}

header {
  padding-top: 1.25rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--border);
  margin-bottom: 1.5rem;
}

main { flex: 1; padding-bottom: 2rem; }

footer {
  padding-top: 1rem;
  padding-bottom: 1rem;
  border-top: 1px solid var(--border);
  color: var(--muted);
  font-size: 0.8rem;
  margin-top: auto;
}

/* ── Header / site title ────────────────────────────────────────────────── */
.site-title {
  display: block;
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--fg);
  margin-bottom: 0.75rem;
  letter-spacing: -0.01em;
}
.site-title:hover { color: var(--accent); text-decoration: none; }

/* ── Search form ────────────────────────────────────────────────────────── */
.search-row {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
}

#q {
  flex: 1 1 200px;
  min-width: 0;
  padding: 0.45rem 0.65rem;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--input-bg);
  color: var(--fg);
  font-size: 1rem;
  font-family: inherit;
}
#q:focus { outline: 2px solid var(--accent); border-color: var(--accent); }

#lang {
  padding: 0.45rem 0.5rem;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--input-bg);
  color: var(--fg);
  font-size: 0.9rem;
  font-family: inherit;
  cursor: pointer;
}

button[type="submit"] {
  padding: 0.45rem 1rem;
  background: var(--accent);
  color: #fff;
  border: none;
  border-radius: 4px;
  font-size: 0.95rem;
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
}
button[type="submit"]:hover { background: var(--accent-h); }

.lang-hint {
  font-size: 0.78rem;
  color: var(--muted);
  margin-top: 0.3rem;
  min-height: 1em;
}

/* ── Index / intro ──────────────────────────────────────────────────────── */
.intro { max-width: 540px; }
.intro p { margin-bottom: 0.75rem; color: var(--muted); }
.examples a { margin-right: 0.4rem; }

/* ── Result: HU section ─────────────────────────────────────────────────── */
.wikt-section h1,
.result-list h1 {
  font-size: 1.5rem;
  font-weight: 600;
  margin-bottom: 1rem;
  color: var(--fg);
}

.result-entry {
  margin-bottom: 2.5rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--border);
}
.result-entry:last-child { border-bottom: none; }

.result-entry h2 {
  font-size: 1.25rem;
  font-weight: 600;
  margin-bottom: 0.75rem;
}

.source-link {
  margin-top: 0.75rem;
  font-size: 0.85rem;
  color: var(--muted);
}

/* ── Not found / notes ──────────────────────────────────────────────────── */
.not-found { color: var(--muted); }
.not-found p { margin-bottom: 0.5rem; }

.cache-note {
  font-size: 0.85rem;
  color: var(--muted);
  background: var(--note-bg);
  padding: 0.4rem 0.75rem;
  border-radius: 4px;
  margin-bottom: 1rem;
}

/* ── Wiktionary content scoping ─────────────────────────────────────────── */
.wikt-content {
  font-size: 0.95rem;
}

/* Reset font on all wikt elements so it uses site font */
.wikt-content * {
  font-family: inherit;
}

/* Headings inside wikt section (h3=POS, h4=subheadings) */
.wikt-content h3 {
  font-size: 1rem;
  font-weight: 600;
  margin: 1.25rem 0 0.4rem;
  padding-bottom: 0.2rem;
  border-bottom: 1px solid var(--border);
  color: var(--fg);
}
.wikt-content h4 {
  font-size: 0.9rem;
  font-weight: 600;
  margin: 1rem 0 0.3rem;
  color: var(--muted);
}

/* Definition lists */
.wikt-content ol, .wikt-content ul {
  padding-left: 1.5rem;
  margin: 0.4rem 0;
}
.wikt-content li { margin-bottom: 0.2rem; }

/* Declension / conjugation tables */
.table-scroll-wrapper {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.wikt-content table {
  border-collapse: collapse;
  font-size: 0.82rem;
  margin: 0.75rem 0;
  min-width: 300px;
}
.wikt-content td, .wikt-content th {
  border: 1px solid var(--border);
  padding: 0.25rem 0.5rem;
  text-align: left;
  vertical-align: top;
  color: var(--fg);
  background: var(--bg);
}
.wikt-content th {
  background: var(--note-bg);
  font-weight: 600;
}

/* Pronunciation */
.wikt-content .IPA { font-style: normal; }

/* Hide Wiktionary navigation clutter */
.wikt-content .NavFrame,
.wikt-content .sister-wikipedia,
.wikt-content .maintenance-line,
.wikt-content .mw-editsection,
.wikt-content .noprint,
.wikt-content sup.reference { display: none; }

/* Derived/related terms columns */
.wikt-content .col-list { columns: 3; column-gap: 1rem; font-size: 0.85rem; }
@media (max-width: 500px) { .wikt-content .col-list { columns: 2; } }

/* ── Responsive ─────────────────────────────────────────────────────────── */
@media (max-width: 480px) {
  .site-title { font-size: 1rem; }
  .wikt-section h1, .result-list h1 { font-size: 1.25rem; }
}
