/* ===================================================================
   Halaman kamus (markah lama) diselaraskan dengan sistem desain
   assets/style.css: kartu, pil, tipografi, dan paginasi yang sama.
   Dimuat hanya oleh include/header.php.
   =================================================================== */

.legacy-main { padding-bottom: 2.5rem; }
.legacy-page { padding-top: 1.4rem; }

/* Setiap blok konten menjadi kartu, sama seperti panel alat. */
.legacy-page .content {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.1rem 1.2rem;
  box-shadow: var(--shadow);
  margin: 0 0 1rem;
}
.legacy-page .content > :first-child { margin-top: 0; }
.legacy-page .content > :last-child { margin-bottom: 0; }
.legacy-page .content p { max-width: 72ch; }

.legacy-page h1 { margin-bottom: .6rem; }
.legacy-page .content h2 { margin: 1.6rem 0 .7rem; }
.legacy-page .content h2:first-child { margin-top: 0; }
.legacy-page .content h3 { margin: 1.2rem 0 .4rem; }

.legacy-page .breadcrumb { font-size: .82rem; color: var(--muted); margin: 0 0 1rem; }
.legacy-page .breadcrumb a { color: var(--muted); }
.legacy-page .breadcrumb a:hover { color: var(--accent); }

.legacy-page hr { border: 0; border-top: 1px solid var(--line); margin: 1.4rem 0; }

/* ---------- hasil tesaurus ---------- */
.legacy-page .lemmas { margin: .2rem 0 .9rem; }
.legacy-page .lemmas table { width: 100%; border-collapse: collapse; }
.legacy-page .lemmas tbody,
.legacy-page .lemmas tr { display: block; }
.legacy-page .lemmas td { display: block; width: auto !important; padding: 0; border: 0; }

/* Baris pertama: daftar kata menjadi pil. font-size 0 menyembunyikan koma. */
.legacy-page .lemmas tr:first-child td { font-size: 0; line-height: 0; }
.legacy-page .lemmas tr:first-child td:first-child,
.legacy-page .lemmas tr:first-child td:nth-child(2) { display: none; }

.legacy-page .lemmas tr:first-child a {
  display: inline-block;
  margin: .16rem .2rem;
  padding: .22rem .62rem;
  font-size: .87rem;
  line-height: 1.4;
  color: var(--ink);
  background: var(--wash);
  border: 1px solid var(--line);
  border-radius: 999px;
  text-decoration: none;
}
.legacy-page .lemmas tr:first-child a:hover { border-color: var(--accent); color: var(--accent); }

/* Baris kedua: definisi sebagai teks kecil di bawah pil. */
.legacy-page .lemmas tr:nth-child(2) td:first-child,
.legacy-page .lemmas tr:nth-child(2) td:nth-child(2) { display: none; }
.legacy-page .lemmas tr:nth-child(2) td:nth-child(3) {
  padding: .1rem 0 .5rem;
  font-size: .85rem;
  line-height: 1.5;
  color: var(--muted);
}

.legacy-page .definition1 {
  margin-top: 1.3rem;
  padding: .55rem .8rem;
  background: var(--wash);
  border-left: 3px solid var(--accent);
  border-radius: 6px;
  font-weight: 600;
  font-size: .95rem;
}
.legacy-page .definition1:first-child { margin-top: .2rem; }
.legacy-page .posname1 { color: var(--muted); font-weight: 400; font-style: italic; }

/* Gambar peta kata */
.legacy-page #image_visual {
  width: 100%;
  max-width: 600px;
  height: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
}

/* ---------- daftar kata per huruf ---------- */
.legacy-page .prefixListOdd,
.legacy-page .prefixListEven {
  float: none;
  display: inline-block;
  width: auto;
  margin: .18rem;
  padding: .28rem .62rem;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 999px;
  line-height: 1.4;
  font-size: .87rem;
}
.legacy-page .prefixListOdd a,
.legacy-page .prefixListEven a { color: var(--ink); text-decoration: none; }
.legacy-page .prefixListOdd:hover,
.legacy-page .prefixListEven:hover { border-color: var(--accent); }
.legacy-page .prefixListClear { display: none; }

/* ---------- paginasi ---------- */
.legacy-page .paging {
  display: inline-block;
  margin: .18rem;
  padding: .24rem .65rem;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: .85rem;
}
.legacy-page .paging a { text-decoration: none; }
.legacy-page .paging[style] { background: var(--accent-soft) !important; border-color: var(--accent); }
.legacy-page .disable {
  display: inline-block;
  margin: .18rem;
  padding: .24rem .65rem;
  font-size: .85rem;
  color: var(--muted);
}

/* ---------- saran kata ---------- */
.legacy-page .did_you {
  display: block;
  margin: 1rem 0 .4rem;
  color: var(--muted);
  font-size: .78rem;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.legacy-page .did_you_content { padding-left: 0; }

/* ---------- pencarian populer ---------- */
.legacy-page .popular-table,
.legacy-page .popular-table tbody,
.legacy-page .popular-table tr,
.legacy-page .popular-table td { display: block; width: 100% !important; padding: 0; border: 0; }
.legacy-page .popular-table tr {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: .2rem 1rem;
}
.legacy-page .popular-table td { line-height: 2; }
.legacy-page .popular-table a { text-decoration: none; }

/* ---------- daftar alat di beranda ---------- */
.legacy-page .daftar-alat { list-style: none; padding: 0; margin: 0; }
.legacy-page .daftar-alat li { padding: .45rem 0; border-bottom: 1px solid var(--line); }
.legacy-page .daftar-alat li:last-child { border-bottom: 0; }

/* ---------- tautan ke alat ---------- */
.legacy-page .alat-terkait { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0; }
.legacy-page .alat-terkait a {
  display: inline-block;
  padding: .3rem .7rem;
  font-size: .86rem;
  background: var(--wash);
  border: 1px solid var(--line);
  border-radius: 999px;
  text-decoration: none;
}
.legacy-page .alat-terkait a:hover { border-color: var(--accent); }

/* ---------- iklan ---------- */
.legacy-ads { margin: 1.4rem 0; text-align: center; }
.legacy-ads ins,
.legacy-page .content ins { max-width: 100%; }
.legacy-page .content > div[style*="border"] {
  border-color: var(--line) !important;
  margin: 1rem 0;
}

@media (max-width: 640px) {
  .legacy-page .content { padding: .9rem; }
  .legacy-page .popular-table tr { grid-template-columns: 1fr 1fr; }
  .legacy-page .lemmas tr:nth-child(2) td:nth-child(3) { font-size: .82rem; }
}