/* דף בית עסק */
.biz { padding: 20px 20px 10px; }
.crumbs { font-size: 13.5px; color: var(--ink-400); margin-bottom: 16px; display: flex; gap: 8px; flex-wrap: wrap; }
.crumbs a { color: var(--ink-500); }

.biz-grid { display: grid; grid-template-columns: 1fr 340px; gap: 26px; align-items: start; }
.biz-main { min-width: 0; }

.biz-head { display: flex; align-items: flex-start; gap: 16px; margin-bottom: 14px; }
.biz-title { flex-grow: 1; min-width: 0; }
.biz-title .hint { margin: 4px 0 0; }
.biz-addr { font-size: 16px; color: var(--ink-700); margin: 6px 0 0; }
.fav-lg { position: static; width: 48px; height: 48px; flex-shrink: 0; }

.biz-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 22px; }
.biz-tags .tag { font-size: 14px; padding: 6px 13px; }

/* כרטיס התעודה — האלמנט המרכזי בדף */
.cert {
  border: 1.5px solid var(--gold-400); border-radius: var(--r-lg);
  overflow: hidden; margin-bottom: 20px; background: #fff;
}
.cert-top {
  display: flex; gap: 16px; align-items: flex-start; padding: 20px;
  background: linear-gradient(180deg, #FDFBF6 0%, var(--gold-100) 100%);
}
.cert-seal { color: var(--gold-600); flex-shrink: 0; }
.cert-kicker { font-size: 12.5px; font-weight: 700; color: var(--gold-text); letter-spacing: .05em; margin: 0; }
.cert-date { font-size: clamp(20px, 3vw, 26px); margin: 3px 0 2px; }
.cert-sub { font-size: 14.5px; color: var(--ink-500); margin: 0; }

.cert-rows { margin: 0; padding: 16px 20px; border-top: 1px solid var(--gold-100); display: flex; flex-direction: column; gap: 11px; }
.cert-rows > div { display: flex; justify-content: space-between; gap: 14px; }
.cert-rows dt { font-size: 14.5px; color: var(--ink-500); margin: 0; }
.cert-rows dd { font-size: 14.5px; color: var(--navy-900); font-weight: 600; margin: 0; text-align: start; }
.cert .btn-block { border-radius: 0; }
.cert-note { text-align: center; font-size: 12.5px; color: var(--ink-400); padding: 9px 12px 12px; margin: 0; }

.biz-sec { margin-bottom: 20px; }

/* משגיחים */
.sup-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.sup-list li { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line-soft); }
.sup-list li:last-child { border-bottom: none; }
.sup-ico {
  width: 40px; height: 40px; border-radius: var(--r-sm); flex-shrink: 0;
  background: var(--teal-50); color: var(--teal-700);
  display: flex; align-items: center; justify-content: center;
}
.sup-name { flex-grow: 1; min-width: 0; }
.sup-name strong { display: block; font-size: 15.5px; color: var(--navy-900); font-weight: 600; }
.sup-name small { display: block; font-size: 13px; color: var(--ink-500); }
.sup-note { margin: 14px 0 0; font-size: 12.5px; }

/* טבלה */
.tbl { width: 100%; border-collapse: collapse; font-size: 14.5px; min-width: 480px; }
.tbl th { text-align: start; font-size: 12.5px; color: var(--ink-500); font-weight: 700; letter-spacing: .03em; padding: 0 12px 10px; border-bottom: 1px solid var(--line); }
.tbl td { padding: 12px; border-bottom: 1px solid var(--line-soft); color: var(--ink-700); }

/* ציר זמן */
.timeline { list-style: none; margin: 0; padding: 0; }
.tl-i { display: flex; gap: 14px; padding-bottom: 18px; position: relative; }
.tl-i:not(:last-child)::before {
  content: ""; position: absolute; inset-inline-start: 5px; top: 16px; bottom: 0;
  width: 2px; background: var(--line);
}
.tl-dot { width: 12px; height: 12px; border-radius: var(--r-pill); background: var(--teal-600); flex-shrink: 0; margin-top: 5px; z-index: 1; }
.tl-cert_lost .tl-dot, .tl-business_removed .tl-dot { background: var(--danger); }
.tl-i strong { display: block; font-size: 15px; color: var(--navy-900); }
.tl-i small { display: block; font-size: 12.5px; color: var(--ink-400); }
.tl-i .hint { display: block; margin: 0; font-size: 13.5px; }

/* צד */
.biz-side { display: flex; flex-direction: column; gap: 16px; position: sticky; top: calc(var(--nav-h) + 14px); }
.biz-actions { display: flex; flex-direction: column; gap: 9px; }
.minimap {
  height: 190px; border-radius: var(--r-md); overflow: hidden;
  border: 1px solid var(--line); background: var(--teal-50);
}
/* ⚠️ ל-Leaflet חייב להיות גובה מפורש על האלמנט עצמו, אחרת הוא מרונדר
   בגובה 0 והמפה "לא מופיעה" בלי שום שגיאה. */
.minimap .leaflet-container { width: 100%; height: 100%; border-radius: inherit; font: inherit; }
/* ⚠️ z-index: Leaflet מגדיר 400+ לשכבות שלו, ובלי זה הן עולות מעל
   התפריט הדביק והמגירות. */
.minimap .leaflet-pane,
.minimap .leaflet-top,
.minimap .leaflet-bottom { z-index: 1; }
.minimap-links {
  display: flex; gap: 8px; align-items: center; justify-content: center;
  margin-top: 9px; font-size: 13.5px; color: var(--ink-400);
}

@media (max-width: 960px) {
  .biz-grid { grid-template-columns: 1fr; }
  .biz-side { position: static; }
  .grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  /* ⚠️ 25.8.2026: לא לקרוס `.grid-3` בחזרה ל-1fr כאן - זהה לכלל ב-
     brand.css (ר' שם למעלה). business.css נטען אחרי brand.css ומנצח
     באותה ספציפיות - זו הייתה הדריסה השנייה שביטלה את התיקון בשקט. */
  .cert-rows > div { flex-direction: column; gap: 2px; }
  .cert-rows dd { text-align: start; }
}

/* בידוד כיוון לשמות ולכתובות שמקורן בנתונים */
.biz-addr bdi, .cert-rows bdi, .card-kashrut bdi { unicode-bidi: isolate; }

/* ─── דירוג וחוות דעת ────────────────────────────────────────────────────────
   ⚠️ מרוחק ויזואלית מכרטיס התעודה בכוונה: זו דעת סועדים על המקום ולא
   קביעה על הכשרות. שני הבלוקים לא חולקים רקע, מסגרת או צבע. */
.reviews-sec { margin-top: 26px; }
.rating-sum { display: flex; align-items: center; gap: 8px; }

.stars { letter-spacing: 1px; white-space: nowrap; }
.stars .star { color: var(--line); }
.stars .star.on,
.stars .star.half { color: var(--star); }
/* חצי כוכב: מילוי חלקי אמיתי ולא עיגול כלפי מעלה, שהיה מנפח דירוגים */
.stars .star.half {
  background: linear-gradient(to left, var(--line) 50%, var(--star) 50%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.stars-n { margin-inline-start: 7px; font-weight: 700; color: var(--ink-700); font-size: 14px; }
.stars-n small { font-weight: 500; color: var(--ink-400); }

.review-list { list-style: none; margin: 0 0 18px; padding: 0; display: grid; gap: 12px; }
.review-list li {
  background: var(--paper); border: 1px solid var(--line);
  border-radius: var(--r-md); padding: 13px 15px;
}
.review-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 6px; }
.review-who { font-weight: 600; font-size: 14px; }
.review-when { font-size: 12.5px; color: var(--ink-400); margin-inline-start: auto; }
.review-list p { margin: 0; font-size: 14.5px; line-height: 1.6; }

.review-form {
  background: var(--paper); border: 1px solid var(--line);
  border-radius: var(--r-md); padding: 16px;
}
.review-form h3 { margin: 0 0 10px; font-size: 16px; }
.review-form textarea { margin-bottom: 12px; }

/* ⚠️ הכוכבים הם קבוצת radio אמיתית — עובדים בלי JS, נגישים למקלדת
   ולקורא מסך. ה-DOM מסודר 5→1 כדי ש-~ יוכל לצבוע את הקודמים. */
.star-pick { border: 0; margin: 0 0 12px; padding: 0; display: flex; flex-direction: row-reverse; justify-content: flex-end; gap: 2px; }
.star-pick input { position: absolute; opacity: 0; width: 0; height: 0; }
/* ⚠️ 44×44 ולא רק font-size. הצהרת הנגישות שלנו מבטיחה יעד מגע של
   44 פיקסלים לפחות, וכוכב בגודל גופן 30 הוא יעד של ~30. באצבע זה
   ההבדל בין לדרג 4 לדרג 3 בטעות. */
.star-pick label {
  display: flex; align-items: center; justify-content: center;
  min-width: 44px; min-height: 44px;
  font-size: 30px; line-height: 1; color: var(--line);
  cursor: pointer; transition: color .12s;
}
.star-pick input:checked ~ label,
.star-pick label:hover,
.star-pick label:hover ~ label { color: var(--star); }
.star-pick input:focus-visible + label { outline: 2px solid var(--teal-600); outline-offset: 2px; border-radius: 4px; }

/* ─── רצועת יצירת קשר ────────────────────────────────────────────────────────
   ⚠️ גבוה בדף ולא בסרגל הצד. מי שבודק אם מסעדה קיימת רוצה מספר טלפון
   בשנייה הראשונה, לא כפתור ניווט. */
.biz-contact {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px; margin: 0 0 14px;
}
.bc-item {
  display: flex; align-items: center; gap: 11px;
  padding: 12px 14px; min-height: 62px;
  background: var(--paper); border: 1px solid var(--line);
  border-radius: var(--r-md); color: var(--ink-700);
  transition: border-color .14s, box-shadow .14s, background .14s;
}
.bc-item:hover { border-color: var(--teal-500); box-shadow: var(--sh-1); text-decoration: none; }
/* ⚠️ שעות פתיחה הן מידע ולא קישור. אותו כרטיס בדיוק, בלי אפקט hover
   ובלי סמן-יד — כרטיס שנראה לחיץ ולא עושה כלום הוא באג נגישות. */
.bc-item.bc-static { cursor: default; }
.bc-item.bc-static:hover { border-color: var(--line); box-shadow: none; }
.bc-item.bc-static strong { font-weight: 600; font-size: 14px; line-height: 1.55; }
.bc-item small { display: block; font-size: 12px; color: var(--ink-500); margin-bottom: 2px; }
/* ⚠️ dir=ltr על המספר: טלפון ישראלי ב-RTL מוצג עם המקף בצד הלא נכון */
.bc-item strong { display: block; font-size: 16px; font-weight: 700; color: var(--navy-900); }

/* הפריט הראשי — טלפון. בולט, כי זה מה שמחפשים */
.bc-primary { background: var(--teal-50); border-color: var(--teal-200); }
.bc-primary .bc-ic { background: var(--teal-700); color: #fff; }
.bc-primary strong { color: var(--teal-800); }

/* פריט "רך" — חיפוש חיצוני, לא מידע שלנו */
.bc-soft { background: transparent; border-style: dashed; }
.bc-soft strong { font-size: 14.5px; color: var(--ink-700); }

.bc-ic {
  flex-shrink: 0; width: 38px; height: 38px; border-radius: 50%;
  background: var(--bg); color: var(--teal-700);
  display: flex; align-items: center; justify-content: center;
}
.bc-note { margin: -6px 0 16px; font-size: 13px; }

@media (max-width: 520px) {
  .biz-contact { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  /* ⚠️ דירוג במובייל: התאריך יורד לשורה משלו במקום להידחק לקצה, והכוכבים
     נשארים 44px. בלי זה שם-הכותב והתאריך נלחצים לשתי מילים חתוכות. */
  .review-top { gap: 7px; }
  .review-when { margin-inline-start: 0; width: 100%; }
  .review-form { padding: 14px; }
  .star-pick { justify-content: center; }
  .reviews-sec .sec-head { flex-wrap: wrap; gap: 8px; }
}

/* ─── הערת התעודה ────────────────────────────────────────────────────────────
   ⚠️ בתוך כרטיס התעודה ובצבעיו, לא בבלוק ההעשרה: זהו טקסט רשמי מהתעודה
   עצמה, בדיוק כמו התוקף והרמה. "בישול ישראל רק לדעת הרמ״א" מופיע כאן
   מילה במילה כפי שכתבה המועצה הדתית. */
.cert-remark {
  margin: 12px 0 2px; padding: 12px 14px;
  background: var(--gold-100); border: 1px solid var(--warn-line);
  border-radius: var(--r-sm);
}
.cert-remark-h {
  display: block; font-size: 11.5px; font-weight: 700; letter-spacing: .05em;
  color: var(--gold-text); margin-bottom: 5px;
}
.cert-remark p { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--ink-900); font-weight: 600; }

/* תגיות ההערה — קישור לסינון, לא רק תווית */
.cert-remark-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.tag-rt      { background: #fff; border-color: var(--warn-line); color: var(--gold-text); }
.tag-rt-warn { background: var(--danger-bg); border-color: var(--danger-line); color: var(--danger); font-weight: 700; }
.tag-rt:hover, .tag-rt-warn:hover { text-decoration: none; filter: brightness(.97); }

/* ⚠️ מקווקו = "לא רשמי, נתרם". פרט שמגיע מהתעודה עצמה מקבל מסגרת
   מלאה בצבעי התעודה — הוא לא הסתייגות ואסור שייראה כמו כזו. */
.cert-rows-official {
  margin-top: 10px; padding: 10px 12px;
  border: 1px solid var(--warn-line); border-radius: 10px;
  background: var(--gold-100);
}
.cert-note-official { margin-top: 6px; color: var(--gold-text); opacity: 1; }

/* ─── תגית "במאגר הרשמי" ────────────────────────────────────────────────
   ⚠️ בולטת בכוונה ובשורה משלה, לא בין שאר התגיות. מרגע שהאתר מציג גם
   עסקים שאינם מהמשרד, זו ההבחנה היחידה שבאמת חשובה למי ששומר כשרות. */
.official {
  display: flex; align-items: flex-start; gap: 10px;
  margin: 4px 0 14px; padding: 12px 14px;
  border: 1.5px solid var(--teal-500); border-radius: var(--r-md, 12px);
  background: var(--teal-50); color: var(--teal-800);
  font-size: 14.5px; line-height: 1.5;
}
.official svg { flex-shrink: 0; margin-block-start: 1px; color: var(--teal-600); }
.official strong { font-weight: 800; }
/* ⚠️ ענבר ולא אדום: העסק אינו "פסול", הוא פשוט לא מופיע במאגר. אדום
   היה נקרא כקביעה שלנו על הכשרות שלו — וזה בדיוק מה שאסור לנו. */
.official-no {
  border-color: #E0A32E; background: #FDF6E7; color: #6B4E12;
}
.official-no svg { color: #C98A17; }
/* 🛑 אותו שיקול כמו בכרטיס: פרסום של רשות מכשירה אינו אזהרה. */
.official-src { border-color: var(--teal-200); background: var(--teal-50); color: var(--teal-700); }
.official-src svg { color: var(--teal-600); }
.official-src + .official-info { border-inline-start-color: var(--teal-500); }

/* כפתור ה-i. ⚠️ 32px ולא 18px — יעד מגע. אייקון מידע שצריך לכוון אליו
   באצבע הוא אייקון שאיש לא לוחץ עליו, וגם כשל נגישות. */
.official-i {
  flex-shrink: 0; margin-inline-start: auto; align-self: center;
  width: 32px; height: 32px; border-radius: 50%;
  border: 1.5px solid currentColor; background: transparent; color: inherit;
  font-family: inherit; font-size: 15px; font-weight: 800; line-height: 1;
  cursor: pointer; opacity: .75;
  display: flex; align-items: center; justify-content: center;
}
.official-i:hover, .official-i:focus-visible { opacity: 1; background: rgba(255,255,255,.6); }
.official-i[aria-expanded="true"] { opacity: 1; background: rgba(255,255,255,.75); }

.official-info {
  margin: -8px 0 16px; padding: 14px 16px;
  border: 1px solid var(--line); border-inline-start: 3px solid var(--teal-500);
  border-radius: var(--r-sm, 10px); background: #fff;
  font-size: 14.5px; line-height: 1.65; color: var(--ink-700);
}
.official-info p { margin: 0 0 9px; }
.official-info p:last-child { margin-bottom: 0; }
.official-info strong { color: var(--navy-900); }
.official-info-note { font-size: 13px; color: var(--ink-500); }
.official-no + .official-info { border-inline-start-color: #E0A32E; }

/* ─── טבלת שעות הפתיחה ───────────────────────────────────────────────────
   ⚠️ טבלה ולא שורת טקסט. שורת טקסט אחת נשברה באמצע טווח השעות, והכיווניות
   הפכה את החצי השני — "שלישי -12:00" בשורה אחת ו-"00:00" בשורה הבאה. */
/* 🛑 שורה שלמה ברשת, לא תא צר.
   `.biz-contact` היא רשת של `minmax(190px, 1fr)`, וטבלת שעות בת שתי
   עמודות פשוט לא נכנסת ל-190 פיקסלים — במסך רחב השעות נחתכו והשורות
   "שישי" ו"שבת" הופיעו בלי שעה בכלל. רוני צילם את זה בדסקטופ.
   ⚠️ `1 / -1` תופס את כל העמודות בלי לדעת כמה יש. */
.bc-hours { align-items: flex-start; grid-column: 1 / -1; }
.bc-hours > span:last-child { width: 100%; min-width: 0; }

/* ⚠️ במסך רחב הטבלה מתפרסת לשתי עמודות של ימים במקום עמודה ארוכה
   אחת — אחרת שורה שלמה ברוחב 900 פיקסלים מבזבזת מקום על ריק. */
@media (min-width: 700px) {
  table.hrs { max-width: 520px; }
}
table.hrs { width: 100%; border-collapse: collapse; margin-top: 4px; }
table.hrs th, table.hrs td {
  padding: 3px 0; font-size: 14px; font-weight: 500;
  color: var(--ink-700); text-align: start; vertical-align: top;
}
table.hrs th { font-weight: 600; color: var(--ink-500); white-space: nowrap; padding-inline-end: 12px; }
/* 🛑 nowrap על השעות — זה מה שמונע את השבירה באמצע הטווח. */
table.hrs td { white-space: nowrap; font-variant-numeric: tabular-nums; }
/* ⚠️ היום הנוכחי מודגש גם במשקל וגם בצבע — לא בצבע בלבד. */
table.hrs tr.is-today th, table.hrs tr.is-today td {
  font-weight: 800; color: var(--navy-900);
}

/* ═══ כשרות מהדרין ממדריכים חיצוניים ═══
   ר' business_hechsher() ב-includes/functions.php.

   ⚠️⚠️ הבלוק הזה **בולט בכוונה**. הגרסה הראשונה עשתה אותו קטן
   ואפרפר כדי שלא יתחרה בתעודה הרשמית — ורוני צדק שזו הייתה טעות:
   הוא נראה כמו הערת שוליים, ולוגו של בד״ץ ב-46 פיקסל אינו נקרא.

   🛑 **הבלטה אינה סותרת את ההבחנה.** ההפרדה מהתעודה הרשמית נשמרת
   דרך שלושה דברים שאינם גודל: הכותרת אומרת מפורשות "לפי מדריכים
   חיצוניים", כל גוף נושא את שם המקור שדיווח עליו, וההסתייגות
   נשארת גלויה. מה שהוסר הוא רק ה"קטן ואפור", לא ההבחנה עצמה. */
.mehadrin {
    /* מסגרת זהב עדינה — נוכחות אמיתית, בלי לחקות את חותם התעודה */
    /* ⚠️ ירוק לפי בקשת רוני — וזה גם נכון: ירוק הוא צבע האישור
       המקובל, והוא מבדיל את הבלוק מהזהב של התעודה הרשמית. */
    border: 2px solid #2f8f57;
    background: linear-gradient(180deg, #f2fbf5 0%, #fff 55%);
}
.mehadrin .panel-title { color: #1f6b41; }

.mehadrin .mh-list {
    list-style: none;
    margin: 0 0 1.1rem;
    padding: 0;
    display: grid;
    /* ⚠️ מינימום 260px: מתחת לזה הלוגו הגדול והשם נדחסים ונשברים */
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
    gap: .9rem;
}
.mh-item {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.1rem;
    border: 1px solid rgba(47, 143, 87, .35);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 2px 10px rgba(11, 49, 81, .06);
    /* ⚠️ בלעדיו שם ארוך מנפח את התא ושובר את הרשת */
    min-width: 0;
}
.mh-logo {
    flex: 0 0 auto;
    /* 🛑 הקפיצה המרכזית: 46 → 88 פיקסל. סימן כשרות שאי אפשר לזהות
       בלי להתקרב למסך אינו ממלא את תפקידו. */
    width: 132px;
    height: 132px;
    object-fit: contain;
    /* ⚠️ רקע לבן מפורש: חלק מהסימנים שקופים וחלק לבנים-על-שקוף.
       בלעדיו סימן בהיר נעלם על רקע בהיר. */
    background: #fff;
    border-radius: 10px;
    padding: 4px;
}
.mh-logo-none {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.6rem;
    font-weight: 700;
    color: #2f8f57;
    background: #f2fbf5;
    border: 2px dashed rgba(47, 143, 87, .5);
}
.mh-body { min-width: 0; display: flex; flex-direction: column; gap: .25rem; }
.mh-name {
    font-weight: 700;
    color: var(--navy-900, #0B3151);
    font-size: 1.12rem;
    line-height: 1.3;
    /* שם ארוך נשבר לשתי שורות במקום להיחתך — שם של גוף כשרות
       חתוך באמצע גרוע משתי שורות */
    overflow-wrap: anywhere;
}
.mh-src {
    font-size: .85rem;
    color: #6b7684;
}
.mh-corr {
    display: inline-block;
    margin-inline-start: .25rem;
    padding: .1rem .45rem;
    border-radius: 999px;
    background: #e8f5ed;
    color: #1f6b41;
    font-weight: 700;
    font-size: .78rem;
}
.mh-note {
    font-size: .84rem;
    line-height: 1.65;
    color: #5b6672;
    background: #fbfaf7;
    border-inline-start: 4px solid #2f8f57;
    padding: .8rem .95rem;
    border-radius: 8px;
    margin: 0;
}

@media (max-width: 480px) {
    /* ⚠️ בטלפון הלוגו יורד ל-70 אבל **לא** חוזר לגודל המקורי —
       זו הייתה כל הבעיה מלכתחילה. */
    .mh-logo { width: 104px; height: 104px; }
    .mh-item { padding: .85rem .9rem; gap: .8rem; }
    .mh-name { font-size: 1.03rem; }
}

/* ⚠️ סימן לבן על רקע שחור — רקע כהה במקום היפוך.
   היפוך צבעים משנה את הסימן עצמו, וסימן כשרות אינו מקום לשינויים. */
.mh-logo-dark {
    background: #14181c;
    padding: 6px;
}

/* ⚠️ תג ״מאומת״ — מוצג רק כשהמידע מגיע מהאתר של הגוף המכשיר עצמו.
   ר' HECHSHER_OFFICIAL_SOURCE ב-includes/functions.php.
   ירוק רווי ומובחן משאר הבלוק: זו הצהרה חזקה יותר מכל השאר. */
.mh-verified {
    display: inline-flex;
    align-items: center;
    gap: .22rem;
    margin-inline-start: .4rem;
    padding: .1rem .45rem;
    border-radius: 999px;
    background: #1f6b41;
    color: #fff;
    font-size: .72rem;
    font-weight: 700;
    /* ⚠️ vertical-align — בלעדיו התג גורר את שורת הבסיס של השם */
    vertical-align: middle;
}
.mh-verified svg { flex: 0 0 auto; }

/* ⚠️ יחס קבוע ו-object-fit: תמונות מבעלי עסק מגיעות בכל יחס
   אפשרי (צילום טלפון אנכי, סריקת תפריט). בלי זה הכותרת של
   הדף נדחפת מתחת לקיפול בחלק מהמקרים. */
/* 🛑 `aspect-ratio: 2/1` + `object-fit: cover` **חתך תמונות לגובה**.
   תעודת כשרות סרוקה (884x1260) וצילום פודטראק (900x1600) הם שניהם
   לאורך, ובמסגרת 2:1 נראה מהם רק פס אמצעי. תמונה שנחתכה כך שאי אפשר
   לקרוא אותה גרועה מהיעדר תמונה — במיוחד כשהיא תעודה.
   ⚠️ `max-height` ולא גובה חופשי: בלעדיו תמונה לאורך דוחפת את כל
   תוכן הדף מתחת לקו הקיפול. */
.biz-cover {
  margin: 0 0 18px; border-radius: var(--r-md); overflow: hidden;
  background: var(--line-soft); display: flex; justify-content: center;
}
.biz-cover img {
  display: block; width: auto; max-width: 100%;
  height: auto; max-height: 70vh; object-fit: contain;
}

/* ⚠️ רצועת תמונות ממוזערות — מוצגת רק כשיש יותר מתמונה אחת
   (ר' business.php). גלילה אופקית ולא גלישה לשורה שנייה: העמוד
   כולו לא אמור לגלוש, ורצועה של ארבע ממוזערות נכנסת גם ב-320px. */
.biz-thumbs {
  display: flex; gap: 8px; margin: -10px 0 18px;
  overflow-x: auto; padding-bottom: 4px;
  scrollbar-width: thin;
}
.biz-thumb {
  flex: 0 0 auto; padding: 0; border: 2px solid var(--line);
  border-radius: var(--r-sm); overflow: hidden; background: none;
  cursor: pointer; line-height: 0; transition: border-color .15s;
}
.biz-thumb img { width: 86px; height: 62px; object-fit: cover; display: block; }
.biz-thumb:hover { border-color: var(--teal-400, var(--teal-600)); }
/* ⚠️ `is-on` **וגם** `:focus-visible`: הראשון מסמן מה מוצג, השני
   מסמן איפה המקלדת נמצאת. שניהם נחוצים ואינם אותו דבר. */
.biz-thumb.is-on { border-color: var(--teal-600); }
.biz-thumb:focus-visible { outline: 3px solid var(--teal-600); outline-offset: 2px; }

/* הכתובת העברית מתחת לתעתיק, בדפים בשפה זרה.
   ⚠️ מוקטנת ומעומעמת בכוונה: היא **לא** המידע הראשי לקורא הזר, היא
   הגיבוי המעשי שלו מול נהג מונית או שלט ברחוב. */
.biz-addr-he {
  margin: 2px 0 0;
  font-size: .9rem;
  color: var(--ink-500);
  direction: rtl;
}