/* ============================================================
   search.css — styles owned by the search agent (prefix: sr-).
   #/search — cross-restaurant dish / ingredient search.
   Builds on base.css tokens only (--paper/--ink/--acc/--soft/
   --faint/--faint2/--card/--wash/--mut/--sans/--serif/--hair…).
   Warm paper, hairlines, tabular price columns, centered
   letter-spaced headers, NO italic on Hebrew.
   ============================================================ */

/* ---------- head ---------- */
.sr-head{padding-bottom:8px}
.sr-k{
  font-size:11.5px;letter-spacing:5px;color:var(--soft);font-weight:400;
  text-transform:none;margin-bottom:10px;
}

/* ---------- the search field: a bare ledger underline ---------- */
.sr-fieldwrap{max-width:560px;margin:8px auto 0}
.sr-srlabel{                     /* visually hidden, still read by SR */
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
.sr-field{
  display:flex;align-items:center;gap:10px;
  border-bottom:2px solid var(--ink);
  padding:8px 4px 10px;
  transition:border-color .2s;
}
.sr-field:focus-within{border-color:var(--acc)}
.sr-mag{
  width:20px;height:20px;flex-shrink:0;
  fill:none;stroke:var(--soft);stroke-width:2;stroke-linecap:round;
  transition:stroke .2s;
}
.sr-field:focus-within .sr-mag{stroke:var(--acc)}
.sr-field input{
  flex:1;min-width:0;
  font-family:var(--serif);font-size:24px;font-weight:400;
  background:transparent;border:none;outline:none;color:var(--ink);
  padding:2px 0;line-height:1.3;
  appearance:none;-webkit-appearance:none;
}
.sr-field input::placeholder{color:var(--ph);font-weight:300}
.sr-field input::-webkit-search-decoration,
.sr-field input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.sr-clear{
  flex-shrink:0;width:28px;height:28px;border-radius:50%;
  border:1px solid var(--faint);background:transparent;color:var(--soft);
  font-size:18px;line-height:1;font-family:var(--sans);
  display:inline-flex;align-items:center;justify-content:center;
  transition:border-color .15s,color .15s,transform .15s;
}
.sr-clear:hover{border-color:var(--acc);color:var(--acc);transform:rotate(90deg)}
.sr-clear:focus-visible{outline-color:var(--acc)}

/* ---------- craving chips ---------- */
.sr-chips{
  display:flex;gap:7px 9px;flex-wrap:wrap;justify-content:center;
  max-width:720px;margin:22px auto 4px;
}
.sr-chip{
  font-family:var(--sans);font-size:13px;line-height:1.4;letter-spacing:.3px;
  color:var(--ink);cursor:pointer;background:transparent;
  border:none;border-bottom:1px dotted var(--faint);
  padding:4px 3px;display:inline-flex;align-items:baseline;gap:4px;
  transition:color .15s,border-color .15s;
}
.sr-chip:hover{color:var(--acc);border-bottom-color:var(--acc);border-bottom-style:solid}
.sr-chip .sr-chipn{
  font-size:10px;color:var(--mut);font-variant-numeric:tabular-nums;
  letter-spacing:0;transition:color .15s;
}
.sr-chip:hover .sr-chipn{color:var(--acc)}
.sr-chipon{color:var(--acc);border-bottom:1px solid var(--acc);font-weight:700}
.sr-chipon .sr-chipn{color:var(--acc)}
.sr-chip:focus-visible{outline:2px solid var(--acc);outline-offset:3px;border-radius:2px}

/* ---------- the "מפת המנה" summary card ---------- */
.sr-card{
  max-width:640px;margin:34px auto 8px;
  background:var(--card);border:1px solid var(--ink);
  box-shadow:var(--lift);
  padding:22px 26px 20px;
}
.sr-cardhd{display:flex;align-items:center;gap:16px;margin-bottom:6px}
.sr-emblem{width:60px;height:60px;flex-shrink:0}
.sr-emblem svg{display:block;width:100%;height:100%}
.sr-cardttl{min-width:0}
.sr-cardk{
  font-size:10px;letter-spacing:4px;color:var(--acc);font-weight:500;
  margin-bottom:3px;
}
.sr-cardttl h2{
  font-family:var(--serif);font-size:30px;font-weight:900;line-height:1.15;
  overflow-wrap:break-word;
}
.sr-cardsub{font-size:12px;color:var(--soft);font-weight:300;margin-top:3px;letter-spacing:.3px}

.sr-cardstats{
  display:flex;flex-wrap:wrap;gap:1px;background:var(--faint);
  border-top:var(--hair);border-bottom:var(--hair);
  margin:16px 0 0;
}
.sr-cs{
  flex:1 1 90px;min-width:0;padding:12px 14px;text-align:center;background:var(--card);
}
.sr-csv{
  display:block;font-family:var(--serif);font-size:22px;font-weight:900;
  font-variant-numeric:tabular-nums;white-space:nowrap;line-height:1.15;
}
.sr-csl{display:block;font-family:var(--sans);font-size:10px;letter-spacing:1.5px;color:var(--soft);margin-top:3px;font-weight:400}
.sr-cardnote{margin-top:14px;font-size:12.5px;color:var(--soft);text-align:center;font-weight:300;line-height:1.8}

.sr-cardends{display:flex;gap:1px;background:var(--faint);margin-top:1px}
.sr-endcol{flex:1 1 0;min-width:0;background:var(--card);padding:12px 14px;text-align:center}
.sr-endtag{font-size:10px;letter-spacing:2.5px;color:var(--acc);font-weight:500;margin-bottom:6px}
.sr-occ{
  display:block;text-decoration:none;color:inherit;
  transition:transform .15s;
}
.sr-occ:hover{transform:translateY(-1px)}
.sr-occprice{
  display:block;font-family:var(--serif);font-size:19px;font-weight:900;
  font-variant-numeric:tabular-nums;line-height:1.2;
}
.sr-occ:hover .sr-occprice{color:var(--acc)}
.sr-occwhere{display:block;font-family:var(--sans);font-size:12px;color:var(--soft);font-weight:300;margin-top:3px;line-height:1.5}
.sr-occwhere b{color:var(--ink);font-weight:700}
.sr-occ:hover .sr-occwhere b{color:var(--acc)}

.sr-cardlink{
  display:block;text-align:center;margin-top:18px;padding-top:14px;
  border-top:var(--hair2);
  font-size:13px;color:var(--acc);text-decoration:none;font-weight:400;letter-spacing:.3px;
}
.sr-cardlink:hover{text-decoration:underline}

/* ---------- result count line ---------- */
.sr-count{
  max-width:660px;margin:30px auto 4px;text-align:center;
  font-size:14px;color:var(--soft);font-weight:300;letter-spacing:.3px;line-height:1.8;
}
.sr-count b{color:var(--ink);font-weight:700;font-family:var(--serif);font-size:17px}
.sr-cap{color:var(--mut);font-size:12px}

/* ---------- result rows ---------- */
.sr-rows{max-width:660px;margin:10px auto 0}
.sr-row{
  display:flex;align-items:baseline;gap:14px;padding:13px 6px;
  border-bottom:var(--hair2);cursor:pointer;text-decoration:none;color:inherit;
  transition:background .2s;
}
.sr-row:hover,
.sr-row:focus-visible{background:var(--wash)}
.sr-row:focus-visible{outline:2px solid var(--acc);outline-offset:-2px;border-radius:2px}
.sr-price{
  font-family:var(--serif);font-size:19px;font-weight:900;
  min-width:70px;font-variant-numeric:tabular-nums;line-height:1.3;flex-shrink:0;
}
.sr-price.sr-na{color:var(--mut);font-weight:300;font-size:12px;letter-spacing:.5px}
.sr-main{min-width:0;flex:1;display:flex;flex-direction:column}
.sr-name{font-family:var(--serif);font-weight:700;font-size:16.5px;line-height:1.4;overflow-wrap:break-word}
.sr-rest{font-size:13px;color:var(--soft);font-weight:300;display:inline}
.sr-desc{
  font-size:12.5px;color:var(--soft);font-weight:300;line-height:1.6;margin-top:3px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.sr-meta{
  margin-right:auto;font-size:11.5px;color:var(--soft);letter-spacing:.4px;
  white-space:nowrap;font-weight:300;align-self:center;text-align:left;
}
.sr-row:hover .sr-price{color:var(--acc)}

/* ---------- empty state (no query) ---------- */
.sr-invite{
  max-width:560px;margin:26px auto 0;text-align:center;
  font-size:14.5px;color:var(--soft);font-weight:300;line-height:1.9;letter-spacing:.3px;
}
.sr-topwrap{max-width:760px;margin:40px auto 0}
.sr-toptitle{
  text-align:center;font-family:var(--serif);font-size:15px;font-weight:700;
  letter-spacing:5px;color:var(--ink);margin-bottom:22px;
  display:flex;align-items:center;gap:16px;justify-content:center;
}
.sr-toptitle::before,
.sr-toptitle::after{content:'';flex:1;max-width:80px;height:1px;background:var(--faint)}
.sr-top{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;
}
.sr-topcard{
  border:1px solid var(--ink);background:var(--card);padding:16px 14px 14px;
  text-align:center;text-decoration:none;color:inherit;
  box-shadow:var(--lift);
  display:flex;flex-direction:column;align-items:center;
  transition:transform .2s,box-shadow .2s;
}
.sr-topcard:hover,
.sr-topcard:focus-visible{transform:translate(-2px,-3px);box-shadow:6px 7px 0 var(--faint)}
.sr-topink{width:40px;height:40px;color:var(--soft2);margin-bottom:8px}
.sr-topink svg{display:block;width:100%;height:100%}
.sr-topname{font-family:var(--serif);font-size:18px;font-weight:700;line-height:1.25}
.sr-topmeta{margin-top:8px;display:flex;flex-direction:column;align-items:center;min-height:34px;justify-content:center}
.sr-topmed{font-family:var(--serif);font-size:22px;font-weight:900;font-variant-numeric:tabular-nums;line-height:1.1}
.sr-topmedl{font-size:9.5px;letter-spacing:1px;color:var(--soft);margin-top:2px;font-weight:400}
.sr-topocc{font-size:10.5px;color:var(--mut);margin-top:8px;letter-spacing:.5px;font-weight:300}

/* ---------- empty results (query, no match) ---------- */
.sr-none{
  text-align:center;padding:48px 0 20px;color:var(--soft);
  font-size:16.5px;line-height:2;font-weight:300;
}
.sr-noneink{width:64px;height:64px;margin:0 auto 14px;color:var(--faint3)}
.sr-noneink svg{display:block;width:100%;height:100%}
.sr-nonehint{display:block;font-size:13px;color:var(--mut);margin-top:6px;font-weight:300}

/* ---------- small screens ---------- */
@media (max-width:640px){
  .sr-field input{font-size:19px}                 /* still ≥16px: iOS won't zoom */
  .sr-fieldwrap{max-width:none}
  .sr-cardttl h2{font-size:25px}
  .sr-emblem{width:50px;height:50px}
  .sr-card{padding:18px 16px 16px}
  .sr-csv{font-size:19px}
  .sr-row{gap:10px;flex-wrap:wrap;row-gap:2px}
  .sr-price{min-width:58px;font-size:17px}
  .sr-meta{flex-basis:100%;text-align:right;margin-right:0;margin-top:2px;align-self:auto}
  .sr-toptitle{letter-spacing:3px}
  .sr-top{grid-template-columns:repeat(2,1fr);gap:10px}
}
@media (max-width:480px){
  .sr-topcard{padding:12px 8px 10px}
  .sr-topink{width:34px;height:34px}
  .sr-topname{font-size:16px}
  .sr-topmed{font-size:19px}
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  .sr-clear:hover{transform:none}
  .sr-topcard:hover,.sr-topcard:focus-visible,
  .sr-occ:hover,.sr-row:hover{transform:none}
}

/* ---------- print ---------- */
@media print{
  .sr-field,.sr-chips,.sr-clear,.sr-mag,.sr-invite{display:none !important}
  .sr-card,.sr-topcard{box-shadow:none;break-inside:avoid}
  .sr-row{break-inside:avoid}
  .sr-count{margin-top:8px}
}

/* ============================================================
   FINDER upgrade — filters, dish-first rows, compare, prepared
   ============================================================ */
/* row is now a div: checkbox · price · link(main) · meta */
.sr-row{align-items:flex-start}
.sr-main{flex-direction:row;gap:11px;align-items:flex-start;text-decoration:none;color:inherit;min-width:0}
.sr-maintxt{min-width:0;display:flex;flex-direction:column}
.sr-thumb{width:44px;height:44px;object-fit:cover;flex-shrink:0;border:1px solid var(--ink);border-radius:8px;background:#fff;filter:grayscale(.25) sepia(.05);transition:filter .2s;margin-top:2px}
.sr-row:hover .sr-thumb{filter:none}
.sr-price{align-self:flex-start;margin-top:1px}

/* compare pick */
.sr-pick{flex-shrink:0;align-self:center;cursor:pointer;padding:4px 0 4px 2px;display:inline-flex}
.sr-pick input{position:absolute;opacity:0;width:1px;height:1px}
.sr-pickbox{width:16px;height:16px;border:1.5px solid var(--soft2);border-radius:4px;display:inline-block;position:relative;transition:border-color .15s,background .15s;background:var(--card)}
.sr-pick:hover .sr-pickbox{border-color:var(--acc)}
.sr-pick input:checked + .sr-pickbox{background:var(--acc);border-color:var(--acc)}
.sr-pick input:checked + .sr-pickbox::after{content:'';position:absolute;inset:3px 4px 5px 4px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg)}
.sr-pick input:focus-visible + .sr-pickbox{outline:2px solid var(--acc);outline-offset:2px}

/* dietary tag pills on the row */
.sr-tag{font-family:var(--sans);display:inline-block;font-size:9px;letter-spacing:.8px;font-weight:600;border-radius:3px;padding:1px 5px;vertical-align:2px;margin-right:4px;white-space:nowrap}
.sr-tag-vegan,.sr-tag-veg{color:#2e6b45;background:color-mix(in srgb,#2e6b45 10%,transparent)}
.sr-tag-gf{color:#8a6a1e;background:color-mix(in srgb,#8a6a1e 10%,transparent)}
.sr-tag-spicy{color:#a3532a;background:color-mix(in srgb,#a3532a 10%,transparent)}
.sr-kmark{color:#2e6b45;font-weight:600}
.sr-openmark{color:#2e6b45;font-weight:600}

/* ---------- filter bar ---------- */
.sr-filters{
  max-width:660px;margin:14px auto 0;display:flex;flex-wrap:wrap;gap:7px 9px;align-items:center;justify-content:center;
  padding:9px 12px;border:1px solid var(--faint);border-radius:10px;background:color-mix(in srgb,var(--ink) 2%,transparent);
}
.sr-fsel{display:inline-flex;align-items:center;gap:6px;font-size:11px;color:var(--soft);letter-spacing:.5px}
.sr-fsel select{
  font:inherit;font-size:12.5px;color:var(--ink);background:var(--card);border:1px solid var(--faint);
  border-radius:6px;padding:4px 8px;cursor:pointer;max-width:150px;
}
.sr-fsel select:focus-visible{outline:2px solid var(--acc);outline-offset:1px}
.sr-ftgl{
  font:inherit;font-size:12px;letter-spacing:.3px;color:var(--soft);background:var(--card);
  border:1px solid var(--faint);border-radius:14px;padding:4px 11px;cursor:pointer;
  transition:color .15s,border-color .15s,background .15s;
}
.sr-ftgl:hover{border-color:var(--acc);color:var(--acc)}
.sr-fon{background:var(--acc);border-color:var(--acc);color:#fff;font-weight:600}
.sr-fon:hover{color:#fff}
.sr-fclear{background:none;border:none;font:inherit;font-size:11px;color:var(--soft2);cursor:pointer;letter-spacing:.4px;text-decoration:underline dotted}
.sr-fclear:hover{color:var(--acc)}

/* ---------- prepared searches ---------- */
.sr-prepwrap{max-width:700px;margin:30px auto 0}
.sr-preptitle{
  text-align:center;font-family:var(--serif);font-size:14px;font-weight:700;letter-spacing:5px;color:var(--ink);
  margin-bottom:14px;display:flex;align-items:center;gap:16px;justify-content:center;
}
.sr-preptitle::before,.sr-preptitle::after{content:'';flex:1;max-width:70px;height:1px;background:var(--faint)}
.sr-preps{display:flex;flex-wrap:wrap;gap:9px;justify-content:center}
.sr-prep{
  text-decoration:none;color:var(--ink);font-size:13px;font-weight:400;letter-spacing:.2px;
  border:1px solid var(--ink);border-radius:16px;padding:6px 13px;background:var(--card);
  box-shadow:2px 2px 0 var(--faint);transition:transform .15s,box-shadow .15s,color .15s;
  display:inline-flex;align-items:center;gap:7px;
}
.sr-prep:hover{transform:translate(-1px,-2px);box-shadow:3px 4px 0 var(--faint);color:var(--acc)}
.sr-prepn{font-size:10px;color:var(--soft);background:var(--faint2);border-radius:8px;padding:1px 6px;font-weight:600}
.sr-prepnote{margin-top:10px;text-align:center;font-size:10.5px;color:var(--mut);font-weight:300;letter-spacing:.3px}

/* ---------- compare tray (fixed bottom) ---------- */
.sr-tray{
  position:fixed;bottom:14px;left:50%;transform:translateX(-50%);z-index:60;
  display:flex;align-items:center;gap:12px;padding:9px 18px;
  background:var(--ink);color:#f5f1e6;border-radius:24px;box-shadow:0 6px 22px rgba(28,25,21,.35);
}
.sr-trayn{font-size:12.5px;letter-spacing:.3px;font-weight:300}
.sr-traygo{
  font:inherit;font-size:13px;font-weight:700;color:var(--ink);background:#f5f1e6;border:none;border-radius:14px;
  padding:5px 14px;cursor:pointer;letter-spacing:.3px;
}
.sr-traygo:hover{background:#fff}
.sr-trayclear{background:none;border:none;font:inherit;font-size:11px;color:#cfc7b4;cursor:pointer;text-decoration:underline dotted}
.sr-trayclear:hover{color:#fff}

/* ---------- comparison table ---------- */
.sr-cmp{
  max-width:820px;margin:26px auto 0;background:var(--card);border:1px solid var(--ink);
  box-shadow:var(--lift);padding:18px 18px 14px;
}
.sr-cmphead{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.sr-cmphead h2{font-family:var(--serif);font-size:16px;font-weight:700;letter-spacing:4px}
.sr-cmpclose{background:none;border:none;font:inherit;font-size:11.5px;color:var(--soft2);cursor:pointer;letter-spacing:.5px}
.sr-cmpclose:hover{color:var(--acc)}
.sr-cmptbl{overflow-x:auto;border-top:1px solid var(--faint)}
.sr-cmprow{
  display:grid;grid-template-columns:86px repeat(var(--cols,2),minmax(130px,1fr));gap:10px;
  padding:9px 2px;border-bottom:1px solid var(--faint2);align-items:baseline;
}
.sr-cmplbl{font-size:10.5px;letter-spacing:1px;color:var(--soft);font-weight:500;align-self:start;padding-top:2px}
.sr-cmpcell{font-size:13px;line-height:1.65;font-weight:300;color:var(--ink);min-width:0;overflow-wrap:break-word}
.sr-cmpname .sr-cmpcell b{font-family:var(--serif);font-size:14.5px;font-weight:700}
.sr-cmpprice{font-family:var(--serif);font-size:18px;font-weight:900;font-variant-numeric:tabular-nums}
.sr-cmpcell a{color:var(--ink);text-decoration:none;font-weight:700;border-bottom:1px solid transparent}
.sr-cmpcell a:hover{color:var(--acc);border-color:var(--acc)}
.sr-cmpcity{display:block;font-size:11px;color:var(--soft)}
.sr-cmpna{color:var(--mut);font-weight:300;font-size:12px}
.sr-cmpest{font-style:normal;font-size:8px;letter-spacing:1.5px;color:#8a6a1e;border:1px solid color-mix(in srgb,#8a6a1e 40%,transparent);border-radius:2px;padding:0 4px;vertical-align:2px}
.sr-cmpsrc{font-size:11px;color:var(--soft)}
.sr-cmpnote{margin-top:10px;font-size:11px;color:var(--soft);font-weight:300;line-height:1.7;letter-spacing:.2px}

@media (max-width:640px){
  .sr-filters{gap:6px 7px;padding:8px 9px}
  .sr-fsel select{max-width:130px;font-size:16px;padding:3px 6px}   /* ≥16px: iOS must not zoom on focus */
  .sr-thumb{width:38px;height:38px}
  .sr-tray{bottom:10px;max-width:94vw;padding:8px 14px;gap:9px}
  .sr-cmprow{grid-template-columns:70px repeat(var(--cols,2),minmax(110px,1fr))}
}
@media print{
  .sr-filters,.sr-tray,.sr-pick{display:none !important}
  .sr-cmp{box-shadow:none;break-inside:avoid}
}