/* Volltextsuche – nutzt die Farb-Tokens der Archivseite (:root in index.html) */

.searchbar{
  display:flex; align-items:center; gap:12px;
  background:var(--card); border:1px solid var(--line); border-radius:12px;
  padding:0 16px; box-shadow:var(--shadow);
  transition:border-color .15s, box-shadow .15s;
}
.searchbar:focus-within{ border-color:var(--red); box-shadow:0 0 0 3px rgba(226,0,26,.14), var(--shadow); }
.searchbar svg{ width:19px; height:19px; flex:none; stroke:var(--muted); fill:none; stroke-width:2.1; stroke-linecap:round; }
.searchbar input{
  flex:1; border:0; outline:0; background:none; color:var(--ink);
  font:inherit; font-size:16.5px; padding:15px 0;
}
.searchbar input::placeholder{ color:var(--muted); }
/* nativen Löschen-Button ausblenden – wir haben einen eigenen */
.searchbar input::-webkit-search-cancel-button,
.searchbar input::-webkit-search-decoration{ -webkit-appearance:none; appearance:none; }
.searchbar button{
  border:0; background:none; padding:6px; border-radius:8px; cursor:pointer;
  color:var(--muted); display:none; line-height:0;
}
.searchbar button:hover{ background:rgba(127,127,127,.14); color:var(--ink); }
.searchbar.has-value button{ display:block; }

.searchmeta{
  display:flex; align-items:baseline; gap:14px; flex-wrap:wrap;
  margin-top:14px; font-size:13.5px; color:var(--muted);
}
.searchmeta .count{ color:var(--ink); font-weight:600; }
.searchmeta select{
  font:inherit; font-size:13px; color:var(--ink); background:var(--card);
  border:1px solid var(--line); border-radius:8px; padding:5px 8px;
}
.sortby{
  font:inherit; font-size:13px; font-weight:600; color:var(--red); background:none;
  border:1px solid var(--line); border-radius:8px; padding:6px 11px; cursor:pointer;
  margin-left:auto;
}
.sortby:hover{ border-color:var(--red); }
.sortby:focus-visible{ outline:2px solid var(--red); outline-offset:2px; }
@media(max-width:560px){ .sortby{ margin-left:0; } }

.results{ display:flex; flex-direction:column; gap:2px; margin-top:22px; }
.hit{
  display:grid; grid-template-columns:96px 1fr; gap:18px; align-items:start;
  padding:15px 14px; border-radius:10px; text-decoration:none; color:inherit;
  border-bottom:1px solid var(--line); transition:background .12s;
}
.hit:last-child{ border-bottom:0; }
.hit:hover{ background:rgba(226,0,26,.055); }
.hit:focus-visible{ outline:2px solid var(--red); outline-offset:2px; }
.hit .loc{ display:flex; flex-direction:column; gap:3px; }
.hit .yr{
  font-size:12px; font-weight:800; letter-spacing:.02em; color:#fff; background:var(--red);
  padding:3px 8px; border-radius:20px; align-self:start; font-variant-numeric:tabular-nums;
}
.hit .pg{ font-size:12px; color:var(--muted); font-variant-numeric:tabular-nums; padding-left:2px; }
.hit .snip{ font-size:14.5px; line-height:1.6; color:var(--ink); }
.hit mark{ background:rgba(226,0,26,.18); color:inherit; border-radius:3px; padding:0 2px; font-weight:600; }
@media(prefers-color-scheme:dark){
  .hit mark{ background:rgba(255,60,80,.30); color:#fff; }
}
:root[data-theme="dark"] .hit mark{ background:rgba(255,60,80,.30); color:#fff; }
:root[data-theme="light"] .hit mark{ background:rgba(226,0,26,.18); color:inherit; }
@media(max-width:560px){
  .hit{ grid-template-columns:1fr; gap:8px; padding:14px 10px; }
  .hit .loc{ flex-direction:row; align-items:center; gap:10px; }
}

.searchstate{ padding:34px 4px; color:var(--muted); font-size:15px; }
.searchstate b{ color:var(--ink); }
.more{
  margin-top:18px; align-self:flex-start; font:inherit; font-size:14px; font-weight:600;
  color:var(--red); background:none; border:1px solid var(--line); border-radius:9px;
  padding:10px 16px; cursor:pointer;
}
.more:hover{ border-color:var(--red); }
[hidden]{ display:none !important; }
