/* דפי תוכן: תנאי שימוש, פרטיות, נגישות, אודות */
.doc { max-width: 780px; padding: 34px 20px 20px; }
.doc h1 { margin-bottom: 6px; }
.doc-date { font-size: 14px; color: var(--ink-400); margin-bottom: 26px; }
.doc h2 { font-size: 21px; margin: 30px 0 10px; color: var(--navy-900); }
.doc h3 { font-size: 17px; margin: 22px 0 8px; }
.doc p, .doc li { font-size: 16.5px; line-height: 1.8; color: var(--ink-700); }
.doc ul, .doc ol { padding-inline-start: 22px; margin: 0 0 1em; }
.doc li { margin-bottom: 7px; }
.doc strong { color: var(--navy-900); }
.doc-note {
  margin-top: 36px; padding: 20px 22px;
  background: var(--teal-50); border: 1px solid var(--teal-200);
  border-radius: var(--r-lg);
}
.doc-note h3 { margin-top: 0; color: var(--teal-800); }
.doc-note p:last-child { margin-bottom: 0; }
.doc-cta { display: flex; gap: 10px; flex-wrap: wrap; margin: 26px 0 0; }

.stats { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; margin: 26px 0 8px; }
.stats > div { background: var(--teal-50); border: 1px solid var(--teal-200); border-radius: var(--r-md); padding: 16px 12px; text-align: center; }
.stats strong { display: block; font-size: 27px; font-weight: 800; color: var(--teal-800); line-height: 1.1; }
.stats span { display: block; font-size: 13px; color: var(--ink-500); margin-top: 3px; }
@media (max-width: 620px) { .stats { grid-template-columns: repeat(2, minmax(0,1fr)); } }

.citylist { list-style: none; margin: 18px 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; }
.citylist a { display: flex; justify-content: space-between; gap: 10px; align-items: center;
  padding: 11px 14px; border: 1px solid var(--line); border-radius: var(--r-sm);
  background: #fff; color: var(--ink-700); font-size: 15px; min-height: 46px; }
.citylist a:hover { border-color: var(--teal-500); color: var(--teal-800);
  text-decoration: none; background: var(--teal-50); }
.f-n { color: var(--ink-400); font-size: 13px; font-weight: 500; }
@media (max-width: 860px) { .citylist { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 560px) { .citylist { grid-template-columns: 1fr; } }

/* סינון רשימה חיה (ערים, כשרויות) */
.listfilter {
  position: relative; display: flex; align-items: center; gap: 10px;
  background: #fff; border: 1.5px solid var(--line); border-radius: var(--r-md);
  padding: 0 14px; margin: 20px 0 8px;
}
.listfilter > svg { color: var(--ink-400); flex-shrink: 0; }
.listfilter .input {
  border: none; background: none; padding: 13px 0; min-height: 50px;
  box-shadow: none; font-size: 16.5px;
}
.listfilter .input:focus { box-shadow: none; outline: none; }
.listfilter:focus-within { border-color: var(--teal-500); box-shadow: 0 0 0 3px var(--teal-100); }
.listfilter-x {
  border: none; background: none; cursor: pointer; color: var(--ink-400);
  width: 34px; height: 34px; border-radius: var(--r-pill); flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.listfilter-x:hover { background: var(--bg); color: var(--ink-900); }

/* ⚠️ bdi מבודד את הכיוון. שם יישוב עם סוגריים או עם תו לטיני מתערבב
   בטקסט סביבו וגורם לסוגריים להיראות הפוכות. isolate מונע את זה גם
   כשהדפדפן לא מכבד את התג עצמו. */
.citylist bdi, .card-title bdi, .biz-title bdi { unicode-bidi: isolate; }

/* ─── פרטי הלכה שנתרמו ───────────────────────────────────────────────────────
   ⚠️ נראה **שונה** משורות התעודה בכוונה. שורות התעודה מאומתות מול המשרד,
   אלה נמסרו על ידי בית העסק. משתמש שומר-כשרות חייב לראות את ההבדל בלי
   לקרוא הערת שוליים. */
.cert-rows-enriched {
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px dashed var(--line, #d9dee6);
  border-radius: 10px;
  background: transparent;
}
.cert-rows-enriched dt { opacity: .8; }
.cert-note-enriched { margin-top: 6px; opacity: .78; }

/* ─── איור ראשי לדף ──────────────────────────────────────────────────────────
   ⚠️ אלה איורים דקורטיביים בלבד — alt ריק ו-aria-hidden, כדי שקורא מסך
   לא יקריא אותם. הם לא נושאים מידע, וכל מה שהם מראים כתוב גם בטקסט. */
.page-art {
  max-width: 420px;
  margin: 0 auto 22px;
  display: block;
}
.page-art img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--r-lg);
}
@media (max-width: 600px) {
  .page-art { max-width: 300px; margin-bottom: 16px; }
}

/* עיר בלי תעודה בתוקף — מוצגת, לא מוסתרת */
.citylist a.city-none { opacity: .72; }
.f-n-none { font-size: 12px; color: var(--warn); font-weight: 600; white-space: nowrap; }

/* ─── דף בעל העסק (27.8.2026) ────────────────────────────────────────────────
   היעד של הקישור ב-SMS. ר' owner.php. */
.owner-photo {
  display: flex; gap: 14px; align-items: flex-start;
  background: var(--teal-50); border: 1px solid var(--teal-200);
  border-radius: var(--r-md); padding: 16px; margin: 22px 0;
}
.owner-photo-ico {
  flex-shrink: 0; width: 44px; height: 44px; border-radius: var(--r-pill);
  background: #fff; color: var(--teal-700);
  display: flex; align-items: center; justify-content: center;
}
.owner-photo strong { display: block; color: var(--navy-900); margin-bottom: 4px; }
.owner-photo p { margin: 0; font-size: 14.5px; color: var(--ink-700); line-height: 1.6; }

.owner-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 24px 0 8px; }

/* ⚠️ שתי הפעולות ה"שליליות" בכרטיסים נפרדים ובמראה מאופק — הן חייבות
   להיות נגישות וברורות, ולא להתחרות בפעולה הראשית. */
.owner-stop, .owner-remove {
  display: flex; gap: 14px; align-items: center; flex-wrap: wrap;
  border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 14px 16px; margin-top: 14px;
}
.owner-stop > div, .owner-remove > div { flex: 1 1 260px; min-width: 0; }
.owner-stop strong, .owner-remove strong { display: block; color: var(--navy-900); }
.owner-stop .hint, .owner-remove .hint { margin: 3px 0 0; font-size: 13.5px; }
.owner-remove { border-color: #F0D6D6; background: #FEF8F8; }
.owner-remove .input { margin-top: 8px; }
.btn-danger {
  background: var(--danger, #B03A3A); color: #fff; border: 1px solid var(--danger, #B03A3A);
}
.btn-danger:hover { filter: brightness(.93); }

@media (max-width: 620px) {
  .owner-stop .btn, .owner-remove .btn { width: 100%; justify-content: center; }
}

/* ─── לוח בקרה לבעלי עסקים / חיפוש עסק לתביעת בעלות (30.8.2026) ─────────────── */
.owner-biz-list { display: flex; flex-direction: column; gap: 12px; margin: 20px 0; }
.owner-biz-row {
  display: flex; gap: 14px; align-items: center; flex-wrap: wrap;
  border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 14px 16px; background: #fff;
}
.owner-biz-row > .obr-info { flex: 1 1 240px; min-width: 0; }
.owner-biz-row h3 { margin: 0 0 3px; font-size: 16.5px; }
.owner-biz-row .hint { margin: 2px 0 0; font-size: 13.5px; }
.owner-biz-actions { display: flex; gap: 8px; flex-wrap: wrap; flex-shrink: 0; }
@media (max-width: 620px) {
  .owner-biz-row { padding: 13px 14px; }
  .owner-biz-actions { width: 100%; }
  .owner-biz-actions .btn { flex: 1 1 auto; justify-content: center; }
}

.owner-verify-card {
  border: 1px solid var(--line); border-radius: var(--r-lg);
  padding: 20px; margin: 20px 0; background: #fff;
}
.owner-verify-card h2 { margin: 0 0 4px; }
.owner-code-input {
  letter-spacing: .3em; text-align: center; font-size: 22px; max-width: 220px;
}

/* ─── עמוד חבילות פרסום (for-business.php) ──────────────────────────── */
.pkg-grid { gap: 16px; align-items: stretch; }
.pkg-card {
  position: relative; display: flex; flex-direction: column;
  border: 1px solid var(--line); border-radius: 14px; padding: 22px 20px;
  background: #fff;
}
.pkg-card-hot { border-color: var(--teal-500, var(--teal-600)); border-width: 2px; box-shadow: 0 6px 22px rgba(1,122,142,.10); }
.pkg-badge {
  position: absolute; inset-block-start: -11px; inset-inline-end: 18px;
  background: var(--teal-600); color: #fff; font-size: 12.5px; font-weight: 700;
  padding: 3px 12px; border-radius: 999px;
}
.pkg-name { font-size: 21px; margin: 0 0 2px; }
.pkg-tagline { color: var(--ink-500); margin: 0 0 12px; font-size: 14.5px; }
.pkg-price { font-size: 30px; font-weight: 800; color: var(--navy-700, var(--ink-900)); margin-bottom: 14px; }
.pkg-price span { font-size: 15px; font-weight: 500; color: var(--ink-500); }
.pkg-points { list-style: none; padding: 0; margin: 0 0 14px; display: grid; gap: 8px; }
.pkg-points li { position: relative; padding-inline-start: 24px; font-size: 14.5px; line-height: 1.5; }
.pkg-points li::before {
  content: "✓"; position: absolute; inset-inline-start: 0; top: 0;
  color: var(--teal-600); font-weight: 800;
}
.pkg-note { font-size: 12.5px; color: var(--amber-700, var(--ink-500)); margin: 0 0 12px; }
.pkg-card .btn-block { margin-top: auto; }
.pkg-steps { line-height: 1.8; padding-inline-start: 20px; }
.pkg-steps li { margin-bottom: 6px; }
.pkg-faq details {
  border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; margin-bottom: 8px;
}
.pkg-faq summary { cursor: pointer; font-weight: 600; }
.pkg-faq details p { margin: 8px 0 0; color: var(--ink-500); line-height: 1.6; }

/* ─── רשימת גופי כשרות מקופלת (דף המהדרין) ──────────────────────────────────
   🛑 נוסף 31.8.2026 אחרי משוב: "גופי הכשרות תופסים אורך ענק מהדף".
   `.citylist` קורס לטור אחד מתחת ל-560px, ולכן 22 גופים = 22 שורות
   מלאות במובייל, לפני שהגולש ראה מסעדה אחת.
   ⚠️ `<details>` נייטיבי ולא JS: עובד במקלדת, קורא מסך מכריז עליו,
   וגוגל סורקת את מה שבתוכו — הקישורים נשארים לאינדוקס. */
.meh-bodies { border: 1px solid var(--line); border-radius: var(--r-md);
  background: #fff; padding: 14px 16px; }
.meh-bodies > summary { cursor: pointer; list-style: none; display: flex;
  align-items: center; gap: 10px; font-size: 16px; color: var(--ink-700); }
.meh-bodies > summary::-webkit-details-marker { display: none; }
/* ⚠️ החץ מסובב ב-transform ולא בתו טקסטואלי: ‹ › ← → הם bidi-mirrored
   ומתהפכים לבד ב-RTL, כלומר מצביעים לכיוון ההפוך בדיוק. */
.meh-bodies > summary::after { content: ''; margin-inline-start: auto;
  width: 9px; height: 9px; border-inline-end: 2px solid var(--ink-400);
  border-block-end: 2px solid var(--ink-400); transform: rotate(45deg);
  transition: transform .18s ease; flex: none; }
.meh-bodies[open] > summary::after { transform: rotate(-135deg); }
.meh-bodies > summary:hover { color: var(--teal-800); }
.meh-bodies .citylist { margin-top: 12px; }