/* ===== Galata — search page ===== */

/* Hero and two-column layout shared by the static pages */
.phero-inner{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) var(--col-r);column-gap:var(--gap);padding-top:40px;padding-bottom:52px}
.p-main{grid-column:1;min-width:0;max-width:860px}
.p-title{font-family:var(--serif);font-weight:700;font-size:clamp(2rem,3.2vw,2.7rem);line-height:1.1;margin:14px 0 0;color:var(--h-ink)}
.slayout{display:grid;grid-template-columns:minmax(0,1fr) var(--col-r);grid-template-areas:"main right";gap:var(--gap);padding-top:0;padding-bottom:64px;align-items:start}
.s-body{grid-area:main;min-width:0}
.btn-line{border-color:var(--line);color:var(--brand-text);background:var(--surface)}

/* Search box in the hero */
.shero-form{display:flex;margin-top:22px;max-width:760px;background:var(--surface);border-radius:12px;padding:6px;box-shadow:0 20px 40px -20px rgba(0,0,0,.5)}
.shero-form input{flex:1;min-width:0;border:0;background:none;font:inherit;font-size:1.08rem;padding:12px 16px;color:var(--ink)}
.shero-form input::placeholder{color:var(--muted);opacity:1}
.shero-form input:focus{outline:none;box-shadow:none}
.shero-form:has(input:focus){outline:3px solid var(--focus-in,var(--ink));outline-offset:2px;box-shadow:0 0 0 7px var(--focus-out,var(--surface)),0 20px 40px -20px rgba(0,0,0,.5)}
@supports not selector(:has(a)){.shero-form:focus-within{outline:3px solid var(--focus-in,var(--ink));outline-offset:2px;box-shadow:0 0 0 7px var(--focus-out,var(--surface))}}
.shero-form button{border:0;border-radius:8px;background:var(--accent);color:var(--accent-ink);font:800 .98rem var(--sans);padding:0 22px;display:flex;align-items:center;gap:8px;cursor:pointer}
.shero-tips{margin:12px 0 1em;font-size:.84rem;color:var(--h-muted)}
.shero-tips code{background:var(--h-glass);border:1px solid var(--h-glass-line);padding:1px 6px;border-radius:4px;color:var(--h-ink);font-size:.8rem}

/* Toolbar: result count, filter toggle (small screens), sort, applied filters */
.s-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;padding:28px 0 14px;border-bottom:1px solid var(--line)}
.s-toolbar:not(:has(.chips-act)){padding-bottom:24px}
.s-toolbar .res{font-size:1.02rem;margin:0}
.s-toolbar .res b{font-size:1.25rem}
.s-toolbar .res-q{color:var(--muted)}
.s-sort{margin-inline-start:auto;display:flex;align-items:center;gap:8px}
.s-sort select{font:600 .88rem var(--sans);padding:8px 12px;border-radius:8px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);max-width:100%}
.s-sort-go{padding:7px 12px;font-size:.86rem}
.ftoggle{display:none;padding:7px 12px;font-size:.86rem}
.ftoggle-n{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:var(--brand);color:#fff;font-size:.72rem;font-weight:800}
.chips-act{display:flex;flex-wrap:wrap;gap:6px;width:100%;list-style:none;margin:0;padding:0}
.chips-act a{display:inline-flex;align-items:center;gap:6px;font:700 .8rem var(--sans);padding-block:5px;padding-inline:12px 8px;border-radius:999px;background:var(--tint);color:var(--brand-text);text-decoration:none;transition:background-color .15s,color .15s}
.chips-act a::after{content:"×";font-size:1rem;line-height:1;opacity:.7}
.chips-act a:hover{background:var(--brand);color:#fff}
.chips-act .clear{background:none;text-decoration:underline;padding-inline-start:4px}
.chips-act .clear::after{content:none}
.chips-act .clear:hover{background:none;color:var(--ink)}

/* Marked search terms keep the full text colour (muted and brand text fall below 4.5:1 on the mark) */
.art mark{color:var(--ink)}

/* Filter card (the first card of the right block) */
.g-card{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:18px;box-shadow:0 18px 40px -20px rgba(0,0,0,.4)}
.filters .f{display:block;margin:0 0 14px;padding:0;border:0;min-width:0}
.filters .f>span,.filters .f>legend{display:block;font-size:.82rem;font-weight:700;margin-bottom:6px;padding:0}
.filters input[type=text],.filters select{width:100%;padding:9px 11px;border:1.5px solid var(--line);border-radius:7px;background:var(--paper);color:var(--ink);font:inherit;font-size:.9rem}
.filters input::placeholder{color:var(--muted);opacity:1}
.yr2{display:grid;grid-template-columns:1fr auto 1fr;gap:6px;align-items:center;font-size:.85rem;color:var(--muted)}
.chk{display:flex;gap:9px;align-items:center;font-size:.88rem;margin:6px 0;cursor:pointer}
.chk input{width:16px;height:16px;flex:none;accent-color:var(--brand)}
.chk .t{flex:1;min-width:0}
/* A fieldset does not collapse margins as the draft's <div> did */
.filters fieldset .chk:first-of-type{margin-top:0}
.filters fieldset .chk:last-child{margin-bottom:0}
.chk .n{margin-inline-start:auto;color:var(--muted);font-size:.78rem}
.fbtns{display:flex;gap:8px;margin-top:12px}
.fbtns button,.fbtns a{flex:1;padding:10px;border-radius:7px;font:700 .88rem var(--sans);cursor:pointer;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);text-align:center;text-decoration:none}
.fbtns a:hover{border-color:var(--brand-text);color:var(--brand-text)}
.fbtns button.pri{background:var(--brand);border-color:var(--brand);color:#fff}

/* Search tips */
.s-tips ul{list-style:none;margin:0;padding:0;font-size:.88rem}
.s-tips li{padding:7px 0;border-bottom:1px solid var(--line)}
.s-tips li:last-child{border-bottom:0;padding-bottom:0}

/* Nothing found / no query yet */
.empty-s{text-align:center;padding:48px 20px 20px}
.empty-s svg{width:120px;height:120px;margin:0 auto 10px;display:block}
.empty-s h2{font-size:1.35rem;margin:6px 0}
.empty-s p{color:var(--muted);margin:0 auto 18px;max-width:52ch}
.empty-s>ul:not(.popkw){list-style:none;padding:0;margin:0 auto 22px;display:inline-grid;gap:6px;text-align:start;font-size:.92rem}
.empty-s>ul:not(.popkw) li::before{content:"";display:inline-block;width:8px;height:11px;margin-inline-end:10px;background:var(--accent);clip-path:polygon(0 0,100% 0,100% 100%,50% 74%,0 100%)}
.empty-s>ul:not(.popkw) a{color:var(--brand-text);font-weight:600}
.popkw-h{font-size:1rem;font-weight:700;color:var(--ink);margin:0 0 10px}
.popkw{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;list-style:none;margin:0;padding:0}
.popkw a{display:inline-block;padding:7px 14px;border-radius:999px;background:var(--tint);color:var(--brand-text);font:700 .86rem var(--sans);text-decoration:none;transition:background-color .15s,color .15s}
.popkw a:hover{background:var(--brand);color:#fff}

/* Page links */
.pager{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:30px}
.pager a,.pager .pg-gap{display:inline-grid;place-items:center;min-width:40px;height:40px;padding:0 12px;border-radius:8px;font:700 .9rem var(--sans);color:var(--ink)}
.pager a{border:1.5px solid var(--line);background:var(--surface);text-decoration:none;transition:border-color .15s,color .15s}
.pager a:hover{border-color:var(--brand-text);color:var(--brand-text)}
.pager a[aria-current]{background:var(--brand);border-color:var(--brand);color:#fff}
.pager .pg-gap{min-width:20px;padding:0;color:var(--muted)}

@media (max-width:860px){
  .phero-inner{grid-template-columns:1fr}
  .slayout{grid-template-columns:minmax(0,1fr);grid-template-areas:"main" "right"}
  .ftoggle:not([hidden]){display:inline-flex}
  /* Folded only once the script has taken over; without it the card stays open. */
  .filters.js-fold:not(.open){display:none}
  .g-card{box-shadow:none}
}
@media (max-width:560px){
  .shero-form button{padding:0 14px}
}
@media (forced-colors:active){
  .shero-form:has(input:focus){outline-color:Highlight;box-shadow:none}
  .pager a[aria-current]{border-width:3px}
}
@media print{
  .shero-form,.shero-tips,.ftoggle,.s-sort,.filters,.s-tips,.pager{display:none!important}
}
