/* =========================
   WB Lemma Dictionary — Theme override-safe (zonder !important)
   ========================= */

.wb-dict{
  --wb-gap:.5rem;
  --wb-columns:2;
}

/* Sticky bar */
.wb-dict .wb-stickybar{
  position: sticky;
  top: 0;
  z-index: 9999;
  background:none;
  border-bottom:0;
  padding:.75rem 0 .5rem;
}

/* -------------------------
   ZOEK: input + button naast elkaar
   ------------------------- */

/* reset theme floats/clears op form elementen */
.wb-dict .wb-search form,
.wb-dict .wb-search label,
.wb-dict .wb-search input,
.wb-dict .wb-search button,
.wb-dict .wb-search a{
  float:none;
  clear:none;
}

.wb-dict .wb-search label{
  display:block;
  margin:0 0 .5rem;
  font-weight:600;
}

.wb-dict .wb-search .wb-search-row{
  display:flex;
  flex-direction:row;
  flex-wrap:nowrap;
  align-items:center;
  gap:var(--wb-gap);
  width:50%;
}

.wb-dict .wb-search .wb-search-row input[type="search"]{
  flex:1 1 auto;
  width:auto;
  max-width:none;
  min-width:200px;
  margin:0;
  padding:.55rem .7rem;
  border:1px solid #ddd;
  border-radius:.45rem;
  box-sizing:border-box;
  display:block;
}

.wb-dict .wb-search .wb-search-row button,
.wb-dict .wb-search .wb-search-row .wb-clear{
  flex:0 0 auto;
  width:auto;
  max-width:none;
  margin:0;
  padding:.55rem .9rem;
  border:1px solid #ddd;
  border-radius:.45rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1.2;
  white-space:nowrap;
  box-sizing:border-box;
  text-decoration:none;
  cursor:pointer;
}

.wb-dict .wb-search .wb-search-row button{
  margin-top:5px;
}

.wb-dict .wb-meta{
  margin:.65rem 0 0;
  color:#444;
}

.wb-clear-btn {
	background:#67b4ab;
}

.wb-clear-btn:hover {
	background:#67b4ab99;
	color: #000 !important;
}

/* Zoek-shortcode in smalle kolom: altijd button onder input */
.wb-dict.wb-dict-searchonly .wb-search .wb-search-row{
  flex-wrap:wrap;
}

.wb-dict.wb-dict-searchonly .wb-search .wb-search-row input[type="search"]{
  flex:1 1 100%;
  width:100%;
  min-width:0;
}

.wb-dict.wb-dict-searchonly .wb-search .wb-search-row button,
.wb-dict.wb-dict-searchonly .wb-search .wb-search-row .wb-clear{
  flex:0 0 auto;
  width:auto;
}

.single-lemma .wb-dict .wb-search .wb-search-row{
  width:100%;
  padding-top:10px;
}

/* -------------------------
   A–Z: letters naast elkaar
   ------------------------- */

.wb-dict nav.wb-az{
  display:block;
}

.wb-dict nav.wb-az ul{
  list-style:none;
  padding:0;
  margin:1rem 0 1.25rem;
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  align-items:center;
  gap:.4rem;
}

.wb-dict nav.wb-az ul li{
  display:inline-flex;
  margin:0;
  padding:0;
}

.wb-dict nav.wb-az ul li a,
.wb-dict nav.wb-az ul li span{
  display:inline-flex;
  width:auto;
  align-items:center;
  justify-content:center;
  min-width:2.1rem;
  padding:.28rem .55rem;
  border:1px solid #ddd;
  border-radius:.4rem;
  text-decoration:none;
  line-height:1.2;
}

.wb-dict nav.wb-az ul li.is-empty span{
  opacity:.20;
  background:#67b4ab;
  cursor:default;
}

.wb-dict nav.wb-az ul li.has a{
  background:#67b4ab;
  border-radius:.4rem;
  color:#fff;
}

.wb-dict nav.wb-az ul li.has a:hover{
  background:#67b4ab99;
  color:#000;
}

.wb-list a,
.wb-dict .wb-top a {
  color: #000 !important;
}

.wb-dict .wb-top a {
  background:#67b4ab44;
  padding: 2px 5px;
  border-radius: 5px;
}

.wb-list a:hover {
  color: #67b4ab !important;
}

.wb-dict .wb-top a:hover {
  color: #fff !important;
}

.wb-dict .wb-top {
	padding-top: 10px;}


/* -------------------------
   Output lijsten
   ------------------------- */

.wb-dict .wb-group{
  margin:2rem 0;
  scroll-margin-top:10px;
}

.wb-dict .wb-group h2{
  margin:0 0 .75rem;
  padding-bottom:5px;
  border-bottom:1px solid #000;
}

.wb-dict .wb-list{
  columns: var(--wb-columns) !important;
  column-gap:3rem !important;
  list-style: disc !important;
  padding: 0 !important;
  margin-left: 15px !important;
}

.wb-dict .wb-list li{
  break-inside:avoid !important;
}

/* -------------------------
   Zoekresultaten
   ------------------------- */

.page-template-woordenboek .wb-results li a {
  color: #000;
}

.page-template-woordenboek .wb-results li a:hover {
  color: #67b4ab !important;
}

.page-template-woordenboek .wb-results li {
  margin-left: 25px;
}

p.wb-meta {
  padding-bottom: 0;
}

.wb-dict .wb-search-row input[type="search"]:focus {
  outline: none;
  border: 2px solid #67b4ab;
}

/* -------------------------
   Responsive
   ------------------------- */
   
@media screen and (max-width:700px){
.wb-dict .wb-list{
  columns:2 !important;
}

.wb-dict nav.wb-az{
  display:none !important;
}

.wb-dict .wb-list li{
  break-inside:avoid !important;
  margin:0 0 .35rem !important;
}

.wb-dict .wb-results{
  list-style:none !important;
  padding:0 !important;
  margin:.75rem 0 0 !important;
}

.wb-dict .wb-results li{
  margin:0 0 .35rem !important;
}

}