/* ═══════════════════════════════════════════════════════════════════
   מערכת עיצוב אחת — כל הצבעים כאן. הערכים מוזרקים מ-web.theme דרך
   layout() (בלוק <style> ב-<head>); כאן ברירות המחדל = המראה הנוכחי.
   שינוי טוקן אחד → כל האתר. אין יותר עטיפת theme רכיבית.
   ═══════════════════════════════════════════════════════════════════ */
:root {
  --bg: #3fa7d6;                    /* רקע הדף — כחול */
  /* משטח אחיד לכל מה שמציג מידע או מוביל לדף אחר: כרטיסייה, ריבוע,
     התראה, שורה, טבלה — הכול בכחול הכהה הזה, טקסט בהיר. */
  --card: #12505f;                  /* משטח כרטיסייה/ריבוע/שורה — כחול כהה */
  --ink: #eef7fa;                   /* טקסט על משטח כהה — בהיר */
  --muted: rgba(238,247,250,.72);   /* טקסט משני על משטח כהה */
  --line: rgba(255,255,255,.14);    /* מסגרות / קווי הפרדה על כהה */
  --field-bg: #f3fbfd;              /* שדות קלט — בהירים (קריאות הקלדה) */
  --field-ink: #06313c;             /* טקסט בשדה קלט — כהה */
  --card-solid: var(--field-bg);    /* תאימות לאחור */
  --tile: var(--card);              /* ריבוע לחיץ = אותו משטח */
  --tile-ink: var(--ink);
  --accent: #18c39a;                /* הדגשה — טורקיז */
  --new: #8ff5b8;                   /* סימן ההתראה (new_dot) — בכל מצב תצוגה */
  --up: #8ff5b8;                    /* תוספת / עלייה בציון — על משטח כהה */
  --down: #ff9d9d;                  /* הפחתה / פעולה מסוכנת — על משטח כהה */
  --accent-ink: #04312a;            /* טקסט על רקע accent */
  --raise: rgba(255,255,255,.06);   /* משטח מורם בתוך כרטיס (תיבת מספר) */
  --nav-bg: #0e424f;               /* כותרת + לשוניות — כהה קצת יותר מהמשטח */
  --nav-ink: #eef7fa;

  /* סולם עיגול-פינות: 1=שדה/כפתור קטן · 2=כפתור/שבב · 3=כרטיס · 4=כרטיס גדול · pill=גלולה */
  --r-1: 4px;  --r-2: 8px;  --r-3: 10px;  --r-4: 14px;  --r-pill: 999px;
  /* ── סולם גדלי טקסט — חמישה גדלים, ולא יותר (08/10) ─────────────────
     xs = תגית / מונה / הערה זעירה · sm = טקסט משני, כפתור קטן ·
     base = גוף, כפתור, שדה · lg = כותרת קטע, ערך מודגש · xl = כותרת דף, מספר גדול.
     כל font-size באתר הוא אחד מאלה (בדיקה: web/test_design_system.py). הערכים
     מגיעים מ-web.theme בהגדרות — שינוי שם משנה את כל האתר. */
  --fs-xs: .78rem; --fs-sm: .88rem; --fs-base: 1rem; --fs-lg: 1.2rem; --fs-xl: 1.6rem;
  /* לא טקסט: סמל בריבוע, תווית גרף */
  --icon-md: 1.9rem; --icon-lg: 2.4rem; --chart-label: 10px;
  /* סולם מרווחים */
  --sp-1: .25rem; --sp-2: .5rem; --sp-3: .75rem; --sp-4: 1rem;
  --sp-5: 1.5rem; --sp-6: 2rem;
  /* צבעי-סמנטיקה */
  --ok: #0f5132;      --ok-bg: #d7f5e3;
  --warn: #b45309;    --warn-ink: #7a4a12; --warn-bg: #fdeecb;
  --danger: #9b1c1c;  --danger-bg: #fde0e0;
}

/* משטח כרטיס בסיסי — .panel וכל שאר הקופסאות יורשים את הערכים האלה. */
.surface, .panel {
  background: var(--card); color: var(--ink); border: 1px solid var(--line);
  border-radius: var(--r-3); padding: var(--sp-4); margin-bottom: var(--sp-4);
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
/* כלל בסיס: [hidden] תמיד מסתיר — גם על אלמנטים עם display משלהם (למשל
   .tile שהוא display:flex). בלי זה סינון-הצד-לקוח לא מסתיר ריבועים. */
[hidden] { display: none !important; }
/* רשת ביטחון: שום אלמנט לא מרחיב את הדף לרוחב ומסתיר תוכן.
   clip (ולא hidden) — לא שובר position: sticky של התפריט/הסרגל. */
html { overflow-x: clip; max-width: 100%; }
/* מילה / כתובת ארוכה בלי רווחים נשברת במקום להרחיב את הדף (14/10: קישור מקור בעמוד
   מתעניין הרחיב את הדף בטלפון מ-320 ל-463 פיקסלים — הדף "זז ימינה ושמאלה") */
body { overflow-wrap: break-word; }
a[href^="http"] { overflow-wrap: anywhere; }
body {
  font: var(--fs-base)/1.55 "Segoe UI", Arimo, "Helvetica Neue", Arial, sans-serif;
  background: var(--bg); color: var(--ink);
}
header {
  background: var(--ink); color: #fff; padding: .7rem 1rem;
  display: flex; align-items: center; gap: .6rem;
}
.trainbar {
  background: #b45309; color: #fff; text-align: center;
  padding: .45rem 1rem; font-weight: 600; font-size: var(--fs-base);
}
header .brand { font-weight: 700; letter-spacing: .01em; }
.gsearch { margin-inline-start: auto; }
.gsearch input {
  font: inherit; padding: .3rem .6rem; border-radius: var(--r-2); border: 1px solid #3a4753;
  background: #2b3642; color: #e6ebef; min-width: 12rem;
}

.chart { margin: 0; }
.chart svg { color: var(--accent); display: block; height: 220px; }
.chart .axis { stroke: var(--line); stroke-width: 1; }
.chart .dots circle { fill: var(--accent); }
.chart .ax { fill: var(--muted); font-size: var(--chart-label); }
.chart figcaption { color: var(--muted); font-size: var(--fs-sm); margin-top: .3rem; }
.spark { vertical-align: middle; }
.spark.up { color: #16a34a; }
.spark.down { color: #dc2626; }
pre.usage { white-space: pre-wrap; font-size: var(--fs-sm); line-height: 1.5;
  background: var(--bg); padding: .6rem .8rem; border-radius: var(--r-2); overflow-x: auto; }
nav {
  display: flex; flex-wrap: wrap; gap: .15rem;
  background: #2b3642; padding: .35rem .6rem;
  position: sticky; top: 0; z-index: 5;
}
nav a {
  color: #cfd8df; text-decoration: none; padding: .35rem .7rem;
  border-radius: var(--r-2); font-size: var(--fs-base); white-space: nowrap;
}
nav a:hover { background: #3a4753; color: #fff; }
nav a.on { background: var(--accent); color: var(--accent-ink); font-weight: 600; }

/* סרגל נתיב (פירורי לחם) — מתחת ללשוניות, שורה דקה, כל שלב כפתור מוארך */
.crumbs {
  display: flex; align-items: center; gap: .35rem; flex-wrap: nowrap;
  padding: .45rem .7rem; background: var(--nav-bg);
  border-bottom: 1px solid var(--line);
  overflow-x: auto; -webkit-overflow-scrolling: touch;
  font-size: var(--fs-base); line-height: 1;
}
.crumbs .crumb {
  display: inline-block; white-space: nowrap; text-decoration: none;
  padding: .28rem .85rem; border-radius: var(--r-pill);
  background: rgba(255,255,255,.10); border: 1px solid var(--line);
  color: var(--tile-ink);
}
.crumbs a.crumb:hover { border-color: var(--accent); color: #fff; }
.crumbs .crumb-cur {
  background: var(--accent); border-color: var(--accent);
  color: var(--accent-ink); font-weight: 600;
}
main { padding: 1rem; max-width: 1000px; margin: 0 auto; }
.greeting { color: var(--muted); margin: .2rem 0 1rem; }
.counts { color: var(--muted); margin: 0 0 1rem; }

.panel {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-3);
  padding: .9rem 1rem; margin-bottom: 1rem;
}
.panel h2 { margin: 0 0 .7rem; font-size: var(--fs-base); }
.panel-spin { margin-inline-start: .5rem; }
.empty { color: var(--muted); margin: .3rem 0; }

.tw { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; font-size: var(--fs-base); }
th, td { text-align: right; padding: .45rem .6rem; border-bottom: 1px solid var(--line); }
th { color: var(--muted); font-weight: 600; }
tr:last-child td { border-bottom: 0; }
a { color: var(--accent); }
code { background: rgba(0,0,0,.22); color: var(--ink);
  padding: .05rem .35rem; border-radius: var(--r-1); }

.muted { color: var(--muted); font-size: var(--fs-sm); }
td .bulk-cb { transform: scale(1.15); }
textarea { font: inherit; border: 1px solid var(--line); border-radius: var(--r-2);
  background: var(--field-bg); color: var(--field-ink); padding: .5rem; }

/* כפתורים — מוגדרים במקום אחד למטה ("מערכת כפתורים אחת") */
.qform { display: flex; flex-direction: column; gap: .7rem; max-width: 34rem; }
.qform label { display: flex; flex-direction: column; gap: .25rem; font-size: var(--fs-base); }
.qform input, .qform select, .qform textarea {
  font: inherit; padding: .4rem .55rem; border: 1px solid var(--line);
  border-radius: var(--r-2); background: var(--field-bg); color: var(--field-ink);
}
.qform fieldset { border: 1px solid var(--line); border-radius: var(--r-2); }
/* שני שדות זה לצד זה ("מ- / עד") — 18/10, "מה אני מחפש" בקישור של מתעניין */
.qform .pair { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.qform .pair > label { min-width: 0; }
.qform .pair input { width: 100%; min-width: 0; box-sizing: border-box; }
/* הדגמים שלו בקישור — כפתורים קטנים בשורה שנשברת, לא אחד בכל שורה */
.pf-models { display: flex; flex-wrap: wrap; gap: .35rem; margin: .3rem 0 .8rem; }
.qform fieldset input { width: 6rem; }
.qform legend { font-size: var(--fs-sm); color: var(--muted); }
/* תמונת דגם בקטלוג — אותה תמונה כמו במוצרים במעקב (14/09) */
.cat-model-img { max-width: 220px; max-height: 220px; border-radius: var(--r-3);
  display: block; margin-bottom: .4rem; }
/* שדה שהקטלוג קובע — תצוגה בלבד, עם קישור לשינוי במקור (14/09) */
.qform-locked { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;
  padding: .4rem .55rem; border: 1px dashed var(--line); border-radius: var(--r-2);
  background: rgba(255,255,255,.04); }
.qform-locked a { font-size: var(--fs-sm); }

/* הגדרות: שורה שנפתחת לכרטיס — כמו שורת התראה. התווית הקריאה + הפקד
   תמיד גלויים וזמינים; ההסבר המלא והמפתח הטכני רק בהרחבה. */
.cfg-group-h { margin: 1.1rem 0 .4rem; font-size: var(--fs-sm); color: var(--muted);
  font-weight: 700; }
.cfg-group { margin-inline-start: .1rem; padding-inline-start: .7rem;
  border-inline-start: 2px solid var(--line); }
.cfg-field { background: rgba(255,255,255,.05); border: 1px solid var(--line);
  border-radius: var(--r-3); margin-bottom: .4rem; }
.cfg-field[open] { border-color: var(--accent); }
.cfg-field > summary {
  list-style: none; cursor: pointer; padding: .5rem .7rem;
  display: flex; gap: .6rem; align-items: center; font-size: var(--fs-sm);
}
.cfg-field > summary::-webkit-details-marker { display: none; }
.cfg-label { flex: 1 1 auto; min-width: 0; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.cfg-field[open] .cfg-label { white-space: normal; }
.cfg-ctl { flex: none; display: flex; align-items: center; }
.cfg-ctl input[type="text"], .cfg-ctl input[type="number"] {
  font: inherit; padding: .3rem .5rem; border: 1px solid var(--line);
  border-radius: var(--r-2); background: var(--field-bg); color: var(--field-ink);
  width: 9rem; max-width: 40vw;
}
.cfg-complex-badge { color: var(--muted); font-size: var(--fs-sm); white-space: nowrap; }
.cfg-field .cfg-body { padding: .1rem .9rem .8rem; border-top: 1px solid var(--line); }
.cfg-field .cfg-body p.cfg-detail { margin: .55rem 0; color: var(--ink); font-size: var(--fs-sm);
  line-height: 1.55; }
.cfg-field .cfg-body p.cfg-path { margin: .4rem 0 0; color: var(--muted); font-size: var(--fs-xs); }
.cfg-field .cfg-body textarea {
  width: 100%; font: inherit; font-family: ui-monospace, Consolas, monospace;
  font-size: var(--fs-sm); padding: .5rem; border: 1px solid var(--line); border-radius: var(--r-2);
  background: var(--field-bg); color: var(--field-ink); margin-top: .3rem;
}

/* מתג הדלקה/כיבוי (ON/OFF) לשדות בוליאניים, במקום true/false */
.switch { position: relative; display: inline-flex; align-items: center; cursor: pointer; }
.switch input[type="checkbox"] {
  position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0;
}
.switch-track {
  width: 2.6rem; height: 1.5rem; border-radius: var(--r-pill); background: var(--line);
  position: relative; flex: none; transition: background .15s ease;
}
.switch-track::before {
  content: ""; position: absolute; top: 2px; inset-inline-start: 2px;
  width: 1.1rem; height: 1.1rem; border-radius: 50%; background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.35); transition: transform .15s ease;
}
.switch input:checked ~ .switch-track { background: var(--accent); }
.switch input:checked ~ .switch-track::before { transform: translateX(110%); }
[dir="rtl"] .switch input:checked ~ .switch-track::before { transform: translateX(-110%); }

.ok-banner { background: var(--ok-bg); color: var(--ok); padding: .5rem .8rem;
  border-radius: var(--r-2); margin-bottom: var(--sp-4); }
.err { background: var(--danger-bg); color: var(--danger); padding: .5rem .8rem;
  border-radius: var(--r-2); margin-bottom: var(--sp-4); }
.err form.inl { display: inline; }
.err button { border: 1px solid currentColor; background: transparent; color: inherit;
  border-radius: var(--r-1); padding: .1rem .5rem; cursor: pointer; font: inherit; }

/* כרטיס אישור מוצר-טיוטה (לפני שהמוצר מתחיל להיסרק) */
.mi-chip {
  display: inline-block; background: rgba(255,255,255,.12); color: var(--ink);
  border: 1px solid var(--line); border-radius: var(--r-pill);
  padding: .1rem .55rem; margin: .12rem .2rem .12rem 0; font-size: var(--fs-sm);
}

/* שורה מכווצת (פורמט התראה) — כותרת + מונה, נפתחת בלחיצה. .row-card */
.row-card { padding: 0; }
.row-card > summary {
  list-style: none; cursor: pointer; padding: .7rem .9rem;
  font-weight: 600; display: flex; align-items: center; gap: .5rem;
}
.row-card > summary::-webkit-details-marker { display: none; }
.row-card > summary::after { content: "▾"; margin-inline-start: auto; color: var(--muted); }
.row-card[open] > summary::after { content: "▴"; }
.row-card .rc-count {
  background: var(--accent); color: var(--accent-ink); border-radius: var(--r-pill);
  padding: .02rem .5rem; font-size: var(--fs-sm); font-weight: 700;
}
.row-card > :not(summary) { margin-inline: .9rem; }
.row-card > :last-child { margin-bottom: .9rem; }

/* לוח ספקות פר-מוצר (גל 2) */
.doubts { list-style: none; margin: 0; padding: 0; }
.doubt {
  border: 1px solid var(--line); border-radius: var(--r-3);
  padding: .6rem .7rem; margin-bottom: .5rem; background: rgba(255,255,255,.05);
}
.doubt-kind {
  display: inline-block; font-size: var(--fs-xs); font-weight: 700;
  background: var(--warn); color: #fff; border-radius: var(--r-pill);
  padding: .05rem .5rem; margin-inline-end: .3rem;
}
.doubt-act { margin-top: .5rem; display: flex; gap: .4rem; flex-wrap: wrap; }
/* כפתורי .doubt-act = הכפתור המשני הרגיל (15/10, סידור התצוגה: היו סגנון רביעי — מרובע כחול) */
.noise-smp { margin: .3rem 0 .6rem; padding-inline-start: 1.1rem; font-size: var(--fs-sm); }
.tl-warn { color: var(--warn); font-weight: 700; margin-inline-end: .15rem; }
.mi-suggested { outline: 2px solid var(--accent); outline-offset: 1px; }
@media (max-width: 640px) {
  .cfg-ctl input[type="text"], .cfg-ctl input[type="number"] { width: 6.5rem; }
}

.soft-reminder {
  background: var(--warn-bg); color: var(--warn-ink); padding: .5rem .8rem;
  border-radius: var(--r-2); margin-bottom: .7rem;
}
.checkin {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-2);
  padding: .5rem .8rem; margin-bottom: .7rem; display: flex; gap: .4rem;
  align-items: center; flex-wrap: wrap;
}
.checkin button { padding: .25rem .7rem; }
.rules { margin: .2rem 0 .6rem; padding-inline-start: 1.2rem; }
.rules li { margin: .2rem 0; }
.deal-act { margin: .2rem 0; font-size: var(--fs-base); }

.inl { display: inline; }
.inl button { padding: .32rem .8rem; font-size: var(--fs-sm); }
.panel h3 { margin: 1rem 0 .4rem; font-size: var(--fs-base); color: var(--muted); }

.job-box {
  margin-top: .6rem; padding: .5rem .7rem; border: 1px dashed var(--line);
  border-radius: var(--r-2); color: var(--muted); font-size: var(--fs-base);
}
/* כפתורים — ראה "מערכת כפתורים אחת" למטה */

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #161b21; --card: #1f2630; --ink: #e6ebef; --muted: #9aa7b2;
    --line: #313b46; --accent: #7bb8e8;
    --ok: #b7f7c8;      --ok-bg: #16351f;
    --warn-ink: #f2d98a; --warn-bg: #3a3009;
    --danger: #f5b5b5;  --danger-bg: #3a1414;
  }
  code { background: #2a323d; }
}

/* ── ריבועים (רכיב עיצוב מרכזי) ───────────────────────────────────── */
.tiles {
  display: grid; gap: .8rem; margin: .6rem 0;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
}
.tiles.big { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 1rem; }
.tile {
  display: flex; flex-direction: column; gap: .35rem;
  padding: .8rem; background: var(--card); border: 1px solid var(--line);
  border-radius: var(--r-4); text-decoration: none; color: var(--ink);
  transition: border-color .12s ease, transform .12s ease;
}
.tile:hover { border-color: var(--accent); transform: translateY(-1px); }
.tiles.big .tile { padding: 1.1rem; gap: .5rem; }
/* תמונת מוצר = החפץ כולו, לא קטע ממנו (22/09, מדיווח המשתמש).
   `cover` חתך את התמונה כדי למלא ריבוע 4:3, והתמונות שלנו הן 1:1 עד
   1.6:1 — כך נחתכו גלגלים וקצוות ואופנוע נראה "לא כמו שצריך". בקטלוג
   של חפצים חייבים לראות את החפץ השלם, ולכן `contain` עם רקע נקי. */
/* צילום מודעה ממלא את הפריים — הוא תמונה מהחיים ולא חפץ על רקע לבן.
   `contain` עליו יצר פסים לבנים ענקיים וכיווץ את התמונה (23/09). */
.tile .tl-img.tl-photo { object-fit: cover; background: var(--bg); }
/* תמונת מוצר שנלקחה ממודעה היא צילום מהשטח — אותה התנהגות (25/09). */
.tile .tl-img[src*="photo=1"] { object-fit: cover; background: var(--bg); }

.tile .tl-img {
  width: 100%; aspect-ratio: 4 / 3; object-fit: contain;
  /* רקע לבן ולא רקע האתר: תמונות מוצר מגיעות כמעט תמיד על לבן, וכך
     הריפוד שמשלים ל-4:3 מתמזג איתן במקום ליצור פסים צבעוניים בצדדים. */
  border-radius: var(--r-2); background: #fff; display: block;
}
.tile .tl-icon {
  font-size: var(--icon-md); line-height: 1; width: 100%; aspect-ratio: 4 / 3;
  display: flex; align-items: center; justify-content: center;
  background: var(--bg); border-radius: var(--r-2);
}
.tiles.big .tile .tl-icon { font-size: var(--icon-lg); }
.tile .tl-title { font-weight: 600; }
/* מה כלול במכירה (31/10) — "+ מטען" / "− מחסנית" על הריבוע ובדף המודעה */
.kit-tags { display: flex; flex-wrap: wrap; gap: var(--sp-1); margin-top: var(--sp-1); }
.kit-tag { font-size: var(--fs-xs); line-height: 1.5; padding: 0 var(--sp-2); border-radius: var(--r-pill);
           border: 1px solid currentColor; white-space: nowrap;
           max-width: 100%; overflow: hidden; text-overflow: ellipsis; }  /* 2/11: תגית ארוכה לא דוחפת את הדף הצידה */
.kit-plus { color: var(--up); }
.kit-minus { color: var(--down); }
.kit-opt { color: var(--muted); border-style: dashed; }
.tile .tl-sub { color: var(--muted); font-size: var(--fs-sm); line-height: 1.4; }

/* ריבוע צריך position כדי שהתגית תשב בפינה */
.tile { position: relative; }
.tile .tl-badge {
  position: absolute; inset-block-start: .5rem; inset-inline-start: .5rem;
  display: flex; gap: .3rem; align-items: center;
  background: rgba(0,0,0,.45); border-radius: var(--r-pill); padding: .12rem .4rem;
  font-size: var(--fs-sm); line-height: 1;
}
.tile .tl-badge .tl-link { filter: grayscale(.1); }
/* "במעקב" בקטלוג — לא התראה, ולכן לא סימן ההתראה */
.tile .tl-tracked { color: var(--accent); font-weight: 700; }

/* ציון הזדמנות כרמזור */
.score-dot { font-size: var(--fs-base); line-height: 1; }
.score-dot.score-hi  { color: #18c39a; }
.score-dot.score-mid { color: #f7b32b; }
.score-dot.score-lo  { color: #9aa7b0; }
.score-head { display: flex; align-items: center; gap: .4rem; font-size: var(--fs-base);
  margin: 0 0 .3rem; }
.score-head .score-dot { font-size: var(--fs-lg); }

/* סרגל מיון/סינון לרוחב המסך — נצמד למעלה בזמן גלילה */
.filterbar {
  display: flex; flex-wrap: wrap; gap: .5rem; align-items: center;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-3);
  padding: .6rem .7rem; margin-bottom: 1rem;
  position: sticky; top: 3rem; z-index: 4;
  box-shadow: 0 2px 6px rgba(0,0,0,.08);
}
.filterbar select, .filterbar input {
  font: inherit; padding: .35rem .5rem; border: 1px solid var(--line);
  border-radius: var(--r-2); background: var(--bg); color: var(--ink); min-width: 7rem;
}
.filterbar .fb-label { color: var(--muted); font-size: var(--fs-sm); }
.filterbar .clear { font-size: var(--fs-sm); align-self: center; }

/* כיווץ סרגל הסינון לשורה אחת */
.fb-toggle {
  font: inherit; cursor: pointer; padding: 0; line-height: 1;
  width: 1.9rem; height: 1.9rem; border: 1px solid var(--line);
  border-radius: var(--r-2); background: rgba(255,255,255,.10); color: var(--tile-ink);
  transition: transform .15s; flex: 0 0 auto;
}
.filterbar.collapsed .fb-toggle { transform: rotate(180deg); }
.fb-summary { display: none; color: var(--muted); font-size: var(--fs-sm);
  flex: 1 1 auto; cursor: pointer; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; }
.filterbar.collapsed {
  flex-wrap: nowrap; flex-direction: row; align-items: center;
}
.filterbar.collapsed > *:not(.fb-toggle):not(.fb-summary) { display: none; }
.filterbar.collapsed .fb-summary { display: inline-block; }

/* סינונים שמורים — צ'יפים מעוגלים מתחת לסרגל הסינון */
.saved-filters { position: static; box-shadow: none; margin: -.4rem 0 1rem; }
.saved-filters .chip {
  display: inline-flex; align-items: center; gap: .25rem;
  background: rgba(255,255,255,.10); border: 1px solid var(--line); border-radius: var(--r-pill);
  padding: .15rem .3rem .15rem .7rem; font-size: var(--fs-sm);
}
.saved-filters .chip a { text-decoration: none; }
.saved-filters .chip .inl button {
  border: 0; background: transparent; color: var(--muted);
  font-size: var(--fs-base); line-height: 1; padding: 0 .2rem; cursor: pointer;
}
.saved-filters .chip .inl button:hover { color: var(--danger); }

/* הגדרות: כפתור "?" והסבר נפתח לכל שדה */
.cfg-help-btn {
  border: 1px solid var(--line); background: var(--card); color: var(--muted);
  border-radius: 50%; width: 1.3rem; height: 1.3rem; font-size: var(--fs-sm);
  line-height: 1; cursor: pointer; margin-inline-start: .35rem; flex: none;
}
.cfg-hint {
  grid-column: 1 / -1; margin: .1rem 0 .5rem; padding: .45rem .65rem;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-2);
  font-size: var(--fs-sm); color: var(--muted); line-height: 1.5;
}
.cfgrow-cat { margin: 1rem 0 .2rem; font-size: var(--fs-sm); }
.cfgrow-cat a { color: var(--muted); text-decoration: none; }

/* ══ מראה האתר — הכול על הטוקנים המאוחדים ══════════════════════════ */

/* כותרת + לשוניות */
header, nav { background: var(--nav-bg); }
header { color: var(--nav-ink); }
nav a { color: rgba(238,247,250,.82); }
nav a:hover { background: rgba(255,255,255,.12); color: #fff; }
nav a.on { background: var(--accent); color: var(--accent-ink); }
.gsearch input { background: rgba(0,0,0,.2); color: var(--nav-ink); border-color: transparent; }

/* טבלאות → "חי": תאים מעוגלים ונפרדים (רק במסך רחב; בטלפון .tw.cards) */
@media (min-width: 641px) {
  .tw table { border-collapse: separate; border-spacing: .3rem; width: auto; min-width: 100%; }
  .tw th, .tw td {
    border: 0; background: rgba(255,255,255,.05); color: var(--ink);
    border-radius: var(--r-3); padding: .5rem .7rem;
  }
  .tw thead th { background: rgba(255,255,255,.12); color: var(--ink); }
  .tw tbody th { background: rgba(255,255,255,.08); color: var(--ink); }
}

/* ── מערכת כפתורים אחת ──────────────────────────────────────────────
   ברירת מחדל: גלולת accent, טקסט כהה — פעולה ראשית.
   .secondary / .ghost: שקוף עם מסגרת — פעולה משנית.
   .danger: מסגרת אדומה → מילוי אדום ב-hover.  .sm: קטן. */
button, .btn {
  font: inherit; font-weight: 600; cursor: pointer; text-decoration: none;
  display: inline-block; padding: .42rem 1.05rem; border: 0;
  border-radius: var(--r-pill); background: var(--accent); color: var(--accent-ink);
}
button:hover, .btn:hover { filter: brightness(1.08); }
button.secondary, button.ghost, .btn.secondary, .btn.ghost, .doubt-act button:not(.danger) {
  background: rgba(255,255,255,.12); color: var(--ink); border: 1px solid var(--line);
}
button.secondary:hover, button.ghost:hover, .btn.secondary:hover, .btn.ghost:hover,
.doubt-act button:not(.danger):hover {
  filter: none; background: rgba(255,255,255,.2);
}
button.danger, .btn.danger {
  /* --down ולא --danger (08/10): --danger כהה, לבאנר על רקע בהיר; על הכרטיס הכהה
     הכפתור האדום כמעט לא נקרא */
  background: transparent; border: 1px solid var(--down); color: var(--down);
}
button.danger:hover, .btn.danger:hover { filter: none; background: var(--danger); color: #fff; }
button.sm, .btn.sm { padding: .24rem .7rem; font-size: var(--fs-sm); }
main input, main select, main textarea {
  border-radius: var(--r-2); border: 1px solid var(--line);
  background: var(--field-bg); color: var(--field-ink);
}
/* גודל אחד לשדה (08/10): עד היום הכלל נתן רק צבע ומסגרת — שדה שלא ישב בתוך סרגל
   סינון או טופס מוכר יצא בגודל ברירת המחדל של הדפדפן (19 פיקסלים, גופן 13). */
/* :where = ספציפיות אפס — כל כלל מקומי מפורש (סרגל סינון, שורת מציאה) גובר */
:where(main input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=range]):not([type=file]),
main select, main textarea) {
  font: inherit; font-size: var(--fs-base); padding: .45rem .7rem; min-height: 2.3rem;
  box-sizing: border-box;
}
main fieldset { border-radius: var(--r-3); border-color: var(--line); }
pre.usage, .job-box { background: var(--card); color: var(--ink); }

/* ריבוע לחיץ */
.tile {
  background: var(--tile); color: var(--tile-ink);
  border-color: rgba(255,255,255,.14);
  box-shadow: 0 4px 14px rgba(4,40,50,.22);
}
.tile:hover { border-color: var(--accent); }
.tile .tl-sub { color: rgba(238,247,250,.78); }
.tile .tl-icon { background: rgba(255,255,255,.10); }

/* סרגל סינון — בצבע הריבוע */
.filterbar {
  background: var(--tile); border-color: rgba(255,255,255,.14);
  box-shadow: 0 4px 14px rgba(4,40,50,.22);
}
.filterbar .fb-label, .filterbar .clear, .filterbar .fb-summary { color: var(--tile-ink); }
/* "נקה" הוא כפתור ירוק — טקסט כהה כמו כל כפתור ירוק (היה בהיר על ירוק, 08/10) */
.filterbar button.clear { color: var(--accent-ink); }
.filterbar select, .filterbar input {
  background: var(--field-bg); color: var(--field-ink); border: 0;
}

/* שורות מוכרים — צמודות, בצורת שורת-חיפוש */
.rowbars { display: flex; flex-direction: column; gap: .35rem; margin: .4rem 0; }
.rowbar {
  display: flex; align-items: baseline; gap: .9rem; text-decoration: none;
  background: var(--tile); color: var(--tile-ink);
  border-radius: var(--r-pill); padding: .7rem 1.2rem;
}
.rowbar .rb-name { font-weight: 600; }
.rowbar .rb-meta { color: rgba(238,247,250,.75); font-size: var(--fs-sm); }
.rowbar.deal { flex-wrap: wrap; border-radius: var(--r-4); }
.rowbar.deal .inl { margin-inline-start: auto; }
.rowbar.deal .inl input { border-radius: var(--r-2); border: 0; padding: .3rem .45rem; }

/* יומן עסקי — ריבועי סיכום רווח + טפסי הוספה זה לצד זה */
.tile.stat { text-align: start; }
.tile.stat .stat-big { font-size: var(--fs-xl); font-weight: 700; }
.two-forms { display: flex; flex-wrap: wrap; gap: 1.2rem; }
.two-forms .qform { flex: 1 1 15rem; }
/* מענה מתוך התראה — שורה קומפקטית */
.exp-answer { flex-direction: row; flex-wrap: wrap; align-items: flex-end;
  gap: .5rem; max-width: none; margin-top: .5rem; }
.exp-answer label { font-size: var(--fs-sm); }
.exp-answer input, .exp-answer select { min-width: 5rem; }

/* פקד הפעלת פוש לטלפון (עמוד התראות) */
.push-slot { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem;
  margin: 0 0 .8rem; padding: .6rem .8rem; font-size: var(--fs-base);
  border: 1px solid var(--line); border-radius: var(--r-2); background: rgba(255,255,255,.03); }
.push-slot .ps-ok { color: var(--accent); font-weight: 600; }
.push-slot .ps-msg { color: var(--muted); font-size: var(--fs-sm); }

/* תיבת שאלות — כרטיס עם טופס תשובה */
.q-card { border: 1px solid var(--line); border-radius: var(--r-2); padding: .8rem 1rem;
  margin: .5rem 0; background: rgba(255,255,255,.03); }
.q-card .q-kind { font-size: var(--fs-xs); color: var(--muted); margin: 0 0 .2rem; }
.q-card .q-asked { margin: 0 0 .6rem; font-weight: 600; }
.q-card .q-answer { gap: .5rem; }
.q-card .q-btns { display: flex; flex-wrap: wrap; gap: .5rem; }
.q-card .q-subject { margin: 0 0 .3rem; font-size: var(--fs-sm); }
.q-card .q-open { margin: 0 0 .6rem; }
.q-card .q-open .btn { font-size: var(--fs-sm); padding: .25rem .6rem; }

/* דף אבטחת כניסה (/2fa) */
.steps { padding-inline-start: 1.3rem; line-height: 1.7; }
.steps li { margin: .4rem 0; }
.totp-key { display: inline-block; margin-top: .3rem; padding: .4rem .7rem;
  font-size: var(--fs-lg); letter-spacing: .15em; background: rgba(255,255,255,.06);
  border-radius: var(--r-2); user-select: all; }
.totp-uri { display: block; margin-top: .4rem; word-break: break-all;
  font-size: var(--fs-xs); color: var(--muted); user-select: all; }

/* זרם ההתראות — שורה עם מסגרת דקה שנפתחת לכרטיס (עמוד התראות) */
.alert-stream { display: flex; flex-direction: column; gap: .5rem; margin: .4rem 0; }

/* החלקה במגע — רכיב אחד לכל האתר (התראות + לוח ספקות).
   העטיפה = [data-swipe] עם data-left/data-right; השורה = [data-swipe-row].
   צבע לפי as-arch/imp/def/yes/no:
   ארכיון = אדום · חשובות = ירוק · חזרה לתיבה = כחול · מתאים = ירוק · לא מתאים = אדום */
[data-swipe] { position: relative; overflow: hidden; border-radius: var(--r-4); }
[data-swipe] .as-bg {
  position: absolute; inset: 0; display: flex; align-items: center;
  padding: 0 1.3rem; font-weight: 700; color: #fff; opacity: 0;
  pointer-events: none; border-radius: var(--r-4);
  transition: filter .12s ease, letter-spacing .12s ease;
}
[data-swipe] .as-left  { justify-content: flex-end; }
[data-swipe] .as-right { justify-content: flex-start; }
[data-swipe] .as-arch { background: var(--danger); }   /* ארכיון — אדום */
[data-swipe] .as-imp  { background: #16814a; }   /* חשובות — ירוק */
[data-swipe] .as-def  { background: #2563a8; }   /* חזרה לתיבה — כחול */
[data-swipe] .as-yes  { background: #16814a; }   /* ספק: מתאים — ירוק */
[data-swipe] .as-no   { background: var(--danger); }  /* ספק: לא מתאים — אדום */
/* "חמוש" — עברת את סף האישור: הרקע הפעיל מתבהר והתווית מתרווחת מעט */
[data-swipe].armed-left  .as-left,
[data-swipe].armed-right .as-right { filter: brightness(1.22); letter-spacing: .04em; }
[data-swipe] [data-swipe-row] {
  position: relative; z-index: 1;
  transition: transform .2s cubic-bezier(.2, .8, .2, 1);
}
[data-swipe].dragging [data-swipe-row] { transition: none; }
/* שורת ספק — רקע אטום כדי שרקעי ההחלקה לא יציצו מאחוריה */
.doubt-swipe { list-style: none; margin: 0 0 .45rem; }
.doubt-swipe .doubt-row { background: var(--card); padding: .55rem .7rem;
  border: 1px solid var(--line); border-radius: var(--r-4); }
.alert-row {
  background: var(--card); color: var(--ink);
  border: 1px solid var(--line); border-radius: var(--r-4);
}
.alert-row[open] { border-color: var(--accent); }
/* מקופלת = שורה דקה, שורת-חיפוש. נפתחת רק בלחיצה. */
.alert-row > summary {
  list-style: none; cursor: pointer; padding: .5rem .75rem;
  display: flex; gap: .5rem; align-items: center; font-size: var(--fs-base);
}
.alert-row > summary::-webkit-details-marker { display: none; }
.alert-row > summary .bulk-cb { flex-shrink: 0; }
/* עיגול "לא נקרא" — התראה שהגיעה מאז הכניסה הקודמת ללוח (כמו וואטסאפ) */
/* ── סימן ההתראה — רכיב אחד לכל האתר (07/10) ─────────────────────────
   "יש כאן משהו חדש / משהו שמחכה לך". נקודה מצוירת (לא תו) כדי שתהיה באותו
   גודל בכל גופן; טבעת בצבע המשטח כדי שתיראה גם על לשונית ירוקה; זוהר.
   נוצר רק דרך new_dot() ב-web/pages.py. */
.ar-unread {
  display: inline-block; flex-shrink: 0; vertical-align: middle;
  width: .62rem; height: .62rem; border-radius: 50%; margin-inline: .3rem;
  background: var(--new); color: transparent; font-size: 0; line-height: 0;
  overflow: hidden;
  box-shadow: 0 0 0 2px var(--card),
              0 0 7px 1px color-mix(in srgb, var(--new) 75%, transparent);
}
.ar-unread.at-corner {
  position: absolute; inset-block-start: .4rem; inset-inline-end: .4rem; margin: 0;
}
.fab .ar-unread.at-corner { inset-block-start: -.1rem; inset-inline-end: -.1rem; }
.alert-row .ar-kind { font-weight: 600; font-size: var(--fs-xs); color: var(--muted);
  white-space: nowrap; flex-shrink: 0; }
.alert-row .ar-title { flex: 1; min-width: 0; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.alert-row[open] .ar-title { white-space: normal; }
.alert-row .ar-when { font-size: var(--fs-xs); color: var(--muted); white-space: nowrap;
  flex-shrink: 0; }
.alert-row .ar-body {
  padding: .2rem 1rem 1rem; border-top: 1px solid var(--line);
}
.alert-row .ar-body p { margin: .6rem 0; }
.alert-row .ar-acts { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .7rem; }
.alert-row .ar-acts.ar-top { margin-top: 0; margin-bottom: .2rem; }
.alert-row .ar-acts .inl { display: inline-block; }
.alert-row .ar-body .tw { margin-top: .4rem; }
.filterbar-x { display: inline-block; margin: -.6rem 0 1rem .5rem; }
/* ── רכיב קולקטיבי: סימון + פעולות מרובות ─────────────────────────────
   תיבת בחירה .bulk-cb — מוסתרת עד שהרשת ב-.sel-mode. סרגל .bulk-bar. */
.bulk-cb {
  width: 1.15rem; height: 1.15rem; cursor: pointer; margin: 0;
  transform: scale(1.05); accent-color: var(--accent);
}
.sel-mode .bulk-cb, .bulk-bar .bulk-cb { display: inline-block; }
[data-bulk]:not(.sel-mode) .bulk-cb { display: none; }
.sel-mode .tile { outline: 2px dashed var(--accent); outline-offset: -2px; }
.bulk-bar {
  display: flex; flex-wrap: wrap; align-items: center; gap: .5rem;
  margin: -.2rem 0 1rem;
}
.bulk-bar .bulk-all { display: flex; align-items: center; gap: .35rem;
  font-size: var(--fs-sm); color: var(--muted); }
.bulk-bar .bulk-count { font-size: var(--fs-sm); color: var(--muted); }
.bulk-bar .bulk-toggle, .bulk-bar .bulk-act {
  padding: .38rem 1rem; font-size: var(--fs-base);
}

/* כפתורים צפים — טור אחד בצד המסך, ממורכז אנכית. התחתון = חזרה. */
nav { padding-inline: 1rem; }
.fabs {
  position: fixed; inset-inline-start: .5rem; top: 50%; transform: translateY(-50%);
  display: flex; flex-direction: column; gap: .5rem; z-index: 8;
}
.fab, .fab-notes {
  width: 2.4rem; height: 2.4rem; border-radius: 50%; border: 0;
  background: var(--accent); color: var(--accent-ink);
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 3px 9px rgba(4,40,50,.3); cursor: pointer; text-decoration: none;
  position: relative;   /* לסימן ההתראה בפינה */
  /* איפוס מודל-הקופסה: <button> מגיע עם padding/font/appearance של הדפדפן,
     <a> לא — בלי האיפוס הסמל בתוך כפתור-JS יוצא קטן מהסמל בתוך קישור.
     זה מה ששבר את אחידות הגודל. */
  box-sizing: border-box; padding: 0; margin: 0; line-height: 0; font-size: 0;
  -webkit-appearance: none; appearance: none; flex: 0 0 auto;
}
.fab:hover, .fab-notes:hover { filter: brightness(1.08); }
/* גודל + עובי-קו אחידים לכל הסמלים — כולם משורטטים באותה מסגרת ב-pages.py,
   וכולם 84% מהכפתור (שכבר בלי padding), כך שכולם יוצאים בדיוק אותו גודל. */
.fab svg, .fab-notes svg { width: 84%; height: 84%; display: block; }

/* מחשבון צף — נפתח ליד טור ה-FAB (צד ימין שלו) */
#mi-calc {
  position: fixed; top: 50%; transform: translateY(-50%);
  inset-inline-start: 3.4rem; z-index: 40;
  background: #04312a; padding: .55rem; border-radius: var(--r-4);
  box-shadow: 0 8px 24px rgba(0,0,0,.35); width: 12.5rem;
}
#mi-calc-d {
  width: 100%; font: var(--fs-lg)/1 ui-monospace, monospace; text-align: left;
  padding: .5rem .6rem; border: 0; border-radius: var(--r-2); margin-bottom: .45rem;
  background: #eef7fa; color: #06313c;
}
.mi-calc-keys { display: grid; grid-template-columns: repeat(4, 1fr); gap: .35rem; }
.mi-calc-keys button {
  padding: .55rem 0; border: 0; border-radius: var(--r-2); font: inherit;
  background: var(--accent); color: var(--accent-ink); cursor: pointer;
}
.mi-calc-keys button[data-k="C"] { grid-column: span 4; background: var(--warn); }

/* פנקס הצעות שיפור — עכשיו חלק מטור ה-FAB בצד (ראה .fabs) */
#mi-notes {
  position: fixed; top: 50%; transform: translateY(-50%);
  inset-inline-start: 3.4rem; z-index: 40;
  width: min(23rem, calc(100vw - 4.4rem)); background: #04312a;
  border-radius: var(--r-4); box-shadow: 0 12px 34px rgba(0,0,0,.4);
  padding: .7rem; display: flex; flex-direction: column; gap: .5rem;
}
.mi-notes-head { display: flex; align-items: center; justify-content: space-between;
  color: var(--tile-ink); }
.mi-notes-head strong { font-size: var(--fs-base); }
.mi-notes-x { background: transparent; border: 0; color: var(--tile-ink);
  font-size: var(--fs-lg); line-height: 1; cursor: pointer; padding: 0 .3rem; }
.mi-notes-tabs { display: flex; flex-wrap: wrap; gap: .3rem; }
.mi-notes-tab {
  border: 0; border-radius: var(--r-pill); padding: .22rem .7rem; font: inherit;
  font-size: var(--fs-xs); cursor: pointer; max-width: 11rem; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap;
  background: rgba(238,247,250,.16); color: var(--tile-ink);
}
.mi-notes-tab.on { background: var(--accent); color: var(--accent-ink); font-weight: 700; }
.mi-notes-area {
  width: 100%; min-height: 12rem; resize: vertical; font: inherit;
  line-height: 1.5; padding: .6rem .7rem; border: 0; border-radius: var(--r-3);
  background: #f3fbfd; color: #06313c;
}
.mi-notes-foot { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.mi-notes-new {
  border: 0; border-radius: var(--r-pill); padding: .3rem .8rem; font: inherit;
  font-size: var(--fs-sm); cursor: pointer; background: var(--accent); color: var(--accent-ink);
}
.mi-notes-del {
  border: 0; border-radius: var(--r-pill); padding: .3rem .8rem; font: inherit;
  font-size: var(--fs-sm); cursor: pointer; background: rgba(238,247,250,.16);
  color: var(--tile-ink); margin-inline-start: auto;
}
.mi-notes-status { font-size: var(--fs-xs); color: rgba(238,247,250,.7); }

/* מוצרים במעקב — סרגל סינון מדורג (משתמש ב-.filterbar המשותף) */
.last-scan { color: var(--muted); font-size: var(--fs-sm); }

/* שורת חיפוש גדולה + שאלות בפורמט זהה (מוצר חדש) */
.np-form { max-width: 44rem; margin: 1.4rem auto 0; }
main .searchbar {
  width: 100%; font-family: inherit; font-size: var(--fs-lg); line-height: 1.3; padding: .95rem 1.3rem;
  border-radius: var(--r-pill); border: 0; background: var(--tile);
  color: var(--tile-ink); box-shadow: 0 5px 18px rgba(4,40,50,.28);
}
.searchbar::placeholder { color: rgba(238,247,250,.6); }
.qbar-go {
  display: inline-block; margin: .7rem auto 0; padding: .55rem 1.2rem;
  border: 0; border-radius: var(--r-pill); background: var(--accent);
  color: var(--accent-ink); font: inherit; font-weight: 600; cursor: pointer;
}
#qmenu { margin-top: 1rem; display: flex; flex-direction: column; gap: .6rem; }
.qbar {
  background: var(--tile); border-radius: var(--r-4);
  padding: .6rem .95rem; display: flex; flex-direction: column; gap: .3rem;
}
.qbar > label { color: var(--tile-ink); font-size: var(--fs-sm); font-weight: 600; }
.qbar input, .qbar select, .qbar textarea {
  font: inherit; padding: .45rem .6rem; border: 0; border-radius: var(--r-3);
  background: #f3fbfd; color: #06313c; width: 100%;
}
.qbar span { display: flex; align-items: center; gap: .4rem; }
.qbar span input { width: 6rem; }
/* בלוק "החברה והדגם המדויקים ביד2" ברוטינת השאלות */
.veh-cat { display: flex; flex-direction: column; gap: .4rem; margin-top: .5rem; }
.veh-cat select[multiple] { min-height: 7rem; }
.veh-cat label.inl { flex-direction: row; align-items: center; gap: .4rem;
  color: var(--tile-ink); font-size: var(--fs-sm); font-weight: 600; }
.veh-cat label.inl input { width: auto; }
.veh-cat-note { font-size: var(--fs-sm); }

.qbar-wide fieldset { border: 0; }
.qbar-wide legend, .qbar-wide .wblock label, .qbar-wide .muted { color: var(--tile-ink); }

/* טבלה "חיה" — להשוואת מודעות (חריג: צפיפות לפני ניקיון) */
.livetable table { border-collapse: separate; border-spacing: .3rem; }
.livetable th, .livetable td {
  border: 0; background: var(--card); border-radius: var(--r-3);
  padding: .5rem .7rem;
}
.livetable thead th { background: var(--accent); color: var(--accent-ink); }
.livetable tbody th { background: rgba(255,255,255,.08); }

/* תא מודעה — עוגן למיקום תיבת הבחירה בפינה */
.ad-cell { position: relative; }
.ad-cell .bulk-cb {
  position: absolute; top: .5rem; inset-inline-start: .5rem; z-index: 2;
}

/* כרטיסיית "עוד פעולות" */
.more-actions { margin: 0 0 1rem; }
.more-actions > summary {
  list-style: none; cursor: pointer; display: inline-flex; align-items: center;
  gap: .4rem; padding: .4rem .9rem; border: 1px solid var(--line);
  border-radius: var(--r-2); background: var(--card); font-weight: 600; font-size: var(--fs-base);
}
.more-actions > summary::-webkit-details-marker { display: none; }
.more-actions > summary::before { content: "☰"; color: var(--muted); }
.more-actions .ma-list {
  display: flex; flex-direction: column; align-items: flex-start; gap: .1rem;
  margin: .5rem 0 0; padding: .5rem; border: 1px solid var(--line);
  border-radius: var(--r-2); background: var(--card); max-width: 22rem;
}
.more-actions .ma-list hr { width: 100%; border: 0; border-top: 1px solid var(--line); margin: .35rem 0; }
.more-actions .ma-list { max-width: 26rem; }
.ma-bulk { width: 100%; }
.ma-bulk .bulk-bar { margin: .1rem 0 .2rem; }
.ma-item, .ma-item button {
  background: transparent; border: 0; font: inherit; color: var(--ink);
  padding: .45rem .3rem; cursor: pointer; text-align: start; width: 100%;
  border-radius: var(--r-2);
}
.ma-item.danger, .ma-item button.danger { color: var(--down); }
.ma-item:hover, .ma-item button:hover { background: rgba(255,255,255,.08); }
/* 08/10: מה שנפתח בתוך פריט תפריט (טופס "העבר נבחרות", בוחר ענף) הוא תוכן, לא שורת
   תפריט — כפתור רגיל ושבב רגיל. עד היום סגנון שורת התפריט "דלף" לכל כפתור מקונן,
   והם יצאו שטוחים ומרובעים (סריקת העיצוב). */
.ma-item details > :not(summary) button:not(.domtab):not(.danger):not(.ghost):not(.secondary) {
  background: var(--accent); color: var(--accent-ink); border-radius: var(--r-pill);
  padding: .42rem 1.05rem; width: auto; font-weight: 600; text-align: center;
}
.ma-item button.domtab {
  background: var(--card); color: var(--ink); border: 1px solid var(--line);
  border-radius: var(--r-pill); padding: .45rem 1rem; width: auto; text-align: center;
}
.ma-item button.domtab.on { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.ma-item .inl { display: block; }

/* גלריית תמונות הדגם — הראשית + נוספות מוויקישיתוף (Q12) */
.prod-gallery { display: flex; gap: .5rem; overflow-x: auto; margin: 0 0 1rem;
  padding-bottom: .25rem; }
.prod-gallery img { height: 7.5rem; width: auto; border-radius: var(--r-2);
  border: 1px solid var(--line); flex: 0 0 auto; object-fit: cover; }

/* שינוי ברוטינת השאלות — מקונן בתוך "עוד פעולות" (11/09), לא כשורה נפרדת */
.ma-list .prod-edit { width: 100%; margin: .3rem 0 0; }
.more-actions:has(.prod-edit) .ma-list { max-width: 34rem; }
.prod-edit { margin: 1rem 0; }
.prod-edit > summary {
  list-style: none; cursor: pointer; padding: .5rem .9rem; border: 1px solid var(--line);
  border-radius: var(--r-2); background: var(--card); font-weight: 600;
}
.prod-edit > summary::-webkit-details-marker { display: none; }
.prod-edit[open] > summary { border-radius: var(--r-2) var(--r-2) 0 0; border-bottom: 0; }
.prod-edit .qform {
  border: 1px solid var(--line); border-top: 0; border-radius: 0 0 var(--r-2) var(--r-2);
  padding: .9rem; margin: 0;
}
.prod-edit .qform .pair { display: flex; align-items: center; gap: .4rem; }
.prod-edit .qform .pair input { width: 7rem; }

/* ── התאמה לטלפון ─────────────────────────────────────────────────── */
img { max-width: 100%; height: auto; }
.tw { -webkit-overflow-scrolling: touch; }

@media (max-width: 640px) {
  html { font-size: 15px; }   /* כל הסולם קטן ביחד — לא רק טקסט רגיל (08/10) */
  main { padding: .8rem .7rem; }

  /* כותרת עליונה — נערמת, חיפוש ברוחב מלא */
  header { flex-wrap: wrap; }
  .gsearch { width: 100%; margin: .45rem 0 0; }
  .gsearch input { width: 100%; min-width: 0; }

  /* תפריט — שורה אחת תמיד, גם במסך צר. לא מקטינים טקסט; מצמצמים רווחים
     ומרווחים פנימיים, וכל לשונית מקבלת חלק שווה (יש מקום גם ללשונית נוספת). */
  /* 15/10: רק התפריט העליון — עד היום הכלל תפס גם את שורת המיקום (גם היא <nav>)
     ומתח את השלבים שלה לרוחבים לא שווים */
  body > nav:not(.crumbs) { gap: .15rem; padding: .35rem .25rem; flex-wrap: nowrap; }
  body > nav:not(.crumbs) a {
    flex: 1 1 0; min-width: 0; text-align: center; padding: .5rem .2rem;
    font-size: var(--fs-base); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }

  /* לוחות ופעולות */
  .panel { padding: .8rem .8rem; }
  .panel h2 { font-size: var(--fs-base); }
  .inl { display: block; margin-bottom: .45rem; }
  .inl button { min-height: 40px; font-size: var(--fs-base); }
  button, .btn { min-height: 40px; }

  /* שדות סינון — טור אחד ברוחב מלא */
  .filters { flex-direction: column; align-items: stretch; }
  .filters input, .filters select,
  .filters input[type="search"] { width: 100%; min-width: 0; }
  .filterbar { flex-direction: column; align-items: stretch; top: 0; }
  /* 14/10: הסרגל נצמד למעלה — ופתוח הוא גבוה מהמסך, והחלק התחתון שלו (חלוקות, "נקה",
     סינון AI) לא היה נגיש בכלל. עכשיו לא גבוה מהמסך, וגולל בתוך עצמו. */
  .filterbar:not(.collapsed) { max-height: calc(100vh - 1rem); overflow-y: auto; flex-wrap: nowrap; }
  .filterbar:not(.collapsed) > * { flex-shrink: 0; }   /* טור אחד — גובה מוגבל לא מקפל לעמודות */
  .filterbar select, .filterbar input { width: 100%; min-width: 0; }
  /* תיבת סימון — לא ברוחב מלא (07/10: כל תיבה ישבה בשורה משלה, רחוק מהטקסט שלה) */
  .filterbar input[type="checkbox"] { width: auto; flex: 0 0 auto; }
  .tiles { grid-template-columns: repeat(auto-fill, minmax(46%, 1fr)); }
  .tiles.big { grid-template-columns: 1fr; }
  body > nav:not(.crumbs) { padding-inline-start: .6rem; padding-inline-end: .6rem; }
  /* שורת הכפתורים הצפים (5 מאז 07/10) לא מסתירה את השורה האחרונה בעמוד */
  main { padding-bottom: 4.5rem; }
  /* בטלפון — שורה אופקית בתחתית במקום טור בצד */
  .fabs { flex-direction: row; top: auto; bottom: .8rem; inset-inline-start: .8rem;
    transform: none; }
  #mi-calc { top: auto; bottom: 4rem; inset-inline-start: .5rem; transform: none; }
  #mi-notes { top: auto; bottom: 4rem; inset-inline-end: .5rem; inset-inline-start: .5rem;
    width: auto; transform: none; }

  /* טבלאות רשימה → כרטיס לכל שורה, בלי גרירה הצידה */
  .tw.cards table, .tw.cards tbody,
  .tw.cards tr, .tw.cards td { display: block; width: 100%; }
  .tw.cards thead { display: none; }   /* הכותרת מופיעה כתווית ליד כל שדה */
  .tw.cards tr {
    border: 1px solid var(--line); border-radius: var(--r-2);
    margin-bottom: .6rem; padding: .15rem .2rem;
  }
  .tw.cards td {
    border-bottom: 1px dashed var(--line); padding: .45rem .55rem;
    text-align: right; font-size: var(--fs-base);
  }
  .tw.cards tr td:last-child { border-bottom: 0; }
  .tw.cards td[data-label]:not([data-label=""])::before {
    content: attr(data-label) " · ";
    color: var(--muted); font-weight: 600; font-size: var(--fs-sm);
  }

  /* בשפת העיצוב: כל שורת טבלה = כרטיס מעוגל בצבע הריבועים */
  .tw.cards tr {
    background: var(--tile); color: var(--tile-ink);
    border: 0; border-radius: var(--r-4); padding: .55rem .9rem;
    margin-bottom: .55rem; box-shadow: 0 3px 10px rgba(4,40,50,.22);
  }
  .tw.cards td {
    border: 0; border-bottom: 1px solid rgba(255,255,255,.12);
    padding: .5rem 0; text-align: right;
  }
  .tw.cards tr td:last-child { border-bottom: 0; }
  .tw.cards td[data-label]:not([data-label=""])::before {
    content: attr(data-label); display: block;
    color: rgba(238,247,250,.6); font-weight: 600;
    font-size: var(--fs-xs); margin-bottom: .1rem;
  }
  .tw.cards a { color: var(--tile-ink); text-decoration: underline; }
  .tw.cards .muted { color: rgba(238,247,250,.7); }
  .tw.cards .inl { display: inline-block; margin: .25rem .25rem 0 0; }
  .tw.cards .inl button { min-height: 34px; }
}

/* ── לשונית "מספרים" (Q1) ────────────────────────────────────────────── */
/* שורת המספרים הגדולים בראש הדף */
.stat-row { display: flex; flex-wrap: wrap; gap: .6rem; margin: 0 0 1rem; }
.stat-box {
  flex: 1 1 8.5rem; display: flex; flex-direction: column; gap: .15rem;
  background: var(--card); border: 1px solid var(--line);
  border-radius: var(--r-4); padding: .7rem .85rem;
}
.sb-big { font-size: var(--fs-xl); font-weight: 700; line-height: 1.1; }
.sb-small { font-size: var(--fs-sm); color: var(--muted); }

/* מעבר בין שלושת החלקים */
.segbar { display: flex; gap: .4rem; margin: 0 0 1rem; flex-wrap: wrap; }
.segbar .seg {
  padding: .4rem .9rem; border: 1px solid var(--line); border-radius: var(--r-pill);
  background: var(--card); color: var(--ink); text-decoration: none;
  font-size: var(--fs-base); font-weight: 600;
}
.segbar .seg.on { background: var(--accent); border-color: transparent;
  color: var(--accent-ink); }

/* עמודת הפער — המספר שחשוב */
.tw .gap-cell { white-space: nowrap; color: #18c39a; }
.tw-wrap { overflow-x: auto; }

/* כרטיס "מה נמכר" / "מגמות" לכל מוצר */
.sold-card, .trend-card {
  border: 1px solid var(--line); border-radius: var(--r-4);
  padding: .8rem .9rem; margin: 0 0 .8rem; background: var(--card);
}
.sold-card h3, .trend-card h3 { margin: 0 0 .45rem; font-size: var(--fs-base); }
.sold-est { margin: 0 0 .3rem; font-size: var(--fs-lg); }
.trend-dir { font-size: var(--fs-base); font-weight: 700; }
.trend-dir.up { color: #ff9d9d; }      /* מחיר עולה = פחות טוב לקנייה */
.trend-dir.down { color: #18c39a; }    /* מחיר יורד = הזדמנות */

/* תיבת ספקות — פרטי המודעה בשורה, ובורר "מתאים לדגם אחר" (13/09) */
.doubt-facts { color: var(--muted); font-size: var(--fs-sm); }
/* תקציר המודעה בתוך שורת הספק (14/09) — כדי להכריע בלי לעזוב את הדף */
.doubt-text { display: block; color: var(--muted); font-size: var(--fs-xs);
  margin-top: .15rem; line-height: 1.4; }
.doubt-noad { color: var(--muted); font-style: italic; }
.doubt-move { margin-top: .4rem; }
.doubt-move > summary { cursor: pointer; font-size: var(--fs-sm); color: var(--accent);
  list-style: none; }
.doubt-move > summary::-webkit-details-marker { display: none; }
.doubt-move form { display: flex; gap: .4rem; align-items: center; flex-wrap: wrap;
  margin-top: .35rem; }
.doubt-move select { font: inherit; padding: .3rem .45rem; border-radius: var(--r-2);
  border: 1px solid var(--line); background: var(--field-bg); color: var(--field-ink);
  max-width: 14rem; }

/* ── קטלוג הדגמים (14/09) ─────────────────────────────────────────────── */
.cat-company { margin: 1.1rem 0 .4rem; font-size: var(--fs-base); color: var(--accent); }
.cat-ok { color: #18c39a; }
.cat-none { color: var(--muted); }
.cat-aliases { display: flex; flex-wrap: wrap; gap: .35rem; margin: .5rem 0 .8rem; }
.cat-alias {
  display: inline-flex; align-items: center; gap: .25rem;
  background: rgba(255,255,255,.08); border: 1px solid var(--line);
  border-radius: var(--r-pill); padding: .2rem .3rem .2rem .7rem;
  font-size: var(--fs-sm);
}
.cat-alias button {
  background: transparent; border: 0; color: var(--muted); cursor: pointer;
  font-size: var(--fs-base); line-height: 1; padding: 0 .25rem;
}
.cat-alias button:hover { color: var(--down); }
/* ידע הדגם בדף המוצר */
.model-know { display: flex; flex-wrap: wrap; gap: .4rem; margin: .3rem 0 .6rem; }
.model-know .mk { background: rgba(255,255,255,.06); border: 1px solid var(--line);
  border-radius: var(--r-2); padding: .3rem .6rem; font-size: var(--fs-sm); }
.model-know .mk b { color: var(--muted); font-weight: 600; }

/* "מה השתנה" — שורות שנפתחות, בראש לשונית הסטטיסטיקות (14/09) */
.ch-row { margin-bottom: .35rem; }
.ch-row > summary { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.ch-kind { font-size: var(--fs-xs); font-weight: 700; padding: .12rem .5rem;
  border-radius: var(--r-pill); white-space: nowrap; }
.ch-drop { background: #16814a; color: #fff; }
.ch-rise { background: #8a5a1f; color: #fff; }
.ch-gone { background: var(--danger); color: #fff; }
.ch-back { background: #6b4fa8; color: #fff; }
.ch-new { background: #1f6f8a; color: #fff; }
.ch-retry { background: #7a5c2e; color: #fff; }
.ch-img, .ch-text, .ch-loc { background: rgba(255,255,255,.14); color: var(--fg); }
.ch-link { background: #2563a8; color: #fff; }
.ch-sum { color: var(--muted); font-size: var(--fs-sm); }
.ch-hl { font-size: var(--fs-xs); color: var(--accent); font-weight: 600; }

/* לשונית סטטיסטיקות: שלוש שורות מכווצות (14/09) — כל אחת .row-card,
   ובתוך "מה השתנה" ריבועים במקום כרטיסים מוערמים (כמו מוצרים במעקב). */
.rc-title { font-weight: 600; }
.rc-sub { font-weight: 400; font-size: var(--fs-sm); }
.chg-dates { margin-bottom: .4rem; }
.chg-dates input[type=date] { min-width: 8.5rem; }
.chg-quick { margin-bottom: .5rem; }
.kn-status { margin-inline-start: .5rem; font-size: var(--fs-sm); }
/* לשונית סטטיסטיקות — עץ ריבועים (14/09) */
.gd-sub { margin: 1rem 0 .5rem; font-size: var(--fs-base); color: var(--muted); }

/* דרגת אימות של שדה מידע (14/09) — "איך יודעים שזה נכון" */
.kv { font-size: var(--fs-xs); font-weight: 700; padding: .1rem .45rem;
  border-radius: var(--r-pill); white-space: nowrap; }
.kv-ok { background: var(--ok-bg); color: var(--ok); }
.kv-part { background: var(--warn-bg); color: var(--warn); }
.kv-bad { background: var(--danger-bg); color: var(--danger); }

/* ריבוע "הוספה" — פלוס גדול, אותו משטח כמו שאר הריבועים (הלוח 13/09) */
.tile-add { border-style: dashed; opacity: .92; }
.tile-add .tl-icon { font-weight: 300; }
.chk-row .ar-body .qform { max-width: 100%; }
.chk-inherit { opacity: .9; }
.psearch input[type=search] { min-width: 14rem; }

/* ── מגמות מחירים כריבועים שנפתחים (14/09) ─────────────────────────────
   הכרטיסייה ברוחב מלא הוחלפה בריבוע עם קו זעיר; הגרף המלא נפתח בלחיצה.
   הריבוע יורש את .tile הקיים ומוסיף רק את מה שייחודי לו — כלל רכיב
   חוזר: יורשים, לא כותבים מחדש. */
.trend-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.trend-tile { cursor: pointer; }
.trend-tile > summary {
  list-style: none; display: flex; flex-direction: column; gap: .4rem;
}
.trend-tile > summary::-webkit-details-marker { display: none; }
.trend-tile .tl-spark { color: var(--accent, currentColor); line-height: 0; }
.trend-tile[open] { grid-column: 1 / -1; }   /* פתוח = תופס שורה מלאה */
.trend-tile > .ar-body { padding-top: .6rem; }
.trend-compare > summary .tl-title { font-weight: 700; }

/* מקרא לגרף רב-קווי */
.chart-legend {
  list-style: none; margin: .5rem 0 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: .35rem .9rem; font-size: var(--fs-sm);
}
.chart-legend li { display: flex; align-items: center; gap: .35rem; }
.lg-dot {
  width: .7rem; height: .7rem; border-radius: 50%; display: inline-block;
}

/* שדות שנחשפים לפי בחירה בטופס ההוצאה האחד */
.cat-new[hidden], .rec-only[hidden] { display: none !important; }

/* המלצת העברה בספק "בכותרת X, בתיאור Y" (15/09) — הדגשה ברורה, לא עוד שורה */
.doubt-recommend {
  margin: .5rem 0; padding: .5rem .7rem; border-radius: .6rem;
  background: rgba(255, 190, 80, .14); border-inline-start: 3px solid #f2a65a;
  display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .8rem;
}
.doubt-recommend form { margin: 0; }

/* ── שורת מוכר מצומצמת (15/09) ──────────────────────────────────────────
   בטלפון התוויות דחקו את הטקסט אל מחוץ לשורה. השורה נשארת שורה אחת:
   שם וכמות בצד אחד, שתי התוויות זו מעל זו בצד השני, והשם נחתך בשלוש
   נקודות במקום לגלוש. הפרטים המלאים — רק כשפותחים. */
.seller-row > summary.sl-sum {
  display: flex; align-items: center; justify-content: space-between;
  gap: .6rem; flex-wrap: nowrap; min-width: 0;
}
.sl-main { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.sl-name {
  font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sl-count { font-size: var(--fs-sm); color: var(--muted); }
.sl-tags {
  display: flex; flex-direction: column; align-items: flex-end; gap: .2rem;
  flex: 0 0 auto;
}
.sl-tags .kv { font-size: var(--fs-xs); white-space: nowrap; padding: .1rem .45rem; }

/* ── מסך הקבוצות (16/09): הודעת תוצאה + שורות קבוצה ── */
.flash {
  background: var(--tile); color: var(--tile-ink);
  border-radius: var(--r-4); padding: .7rem 1rem; margin: .4rem 0 .8rem;
}
.grp-list { list-style: none; padding: 0; margin: .5rem 0; display: flex; flex-direction: column; gap: .35rem; }
.grp-row {
  display: flex; align-items: center; justify-content: space-between; gap: .6rem;
  background: var(--tile); color: var(--tile-ink);
  border-radius: var(--r-4); padding: .55rem .9rem; min-width: 0;
}
.grp-row .muted { color: rgba(238,247,250,.75); }
.grp-main { min-width: 0; flex: 1 1 auto; overflow-wrap: anywhere; }
.grp-toggle { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; margin: .3rem 0 .6rem; }

/* קוד QR לחיבור וואטסאפ (16/09) — ריבוע לבן, כי הקוד נסרק ממסך */
.wa-qr {
  background: #fff; padding: .6rem; border-radius: var(--r-2);
  width: 264px; height: 264px; object-fit: contain; display: block;
}

/* מסך המקורות (16/09) — שורה לכל סורק, עם מצב */
.src-list { list-style: none; padding: 0; margin: .6rem 0; display: flex; flex-direction: column; gap: .45rem; }
.src-row {
  display: flex; align-items: flex-start; justify-content: space-between; gap: .8rem;
  background: var(--card); border: 1px solid var(--line);
  border-radius: var(--r-4); padding: .7rem .9rem; min-width: 0;
}
.src-row.src-ok { border-inline-start: 4px solid var(--accent); }
.src-row.src-warn { border-inline-start: 4px solid #e8a33d; }
.src-row.src-off { opacity: .75; }
.src-main { min-width: 0; flex: 1 1 auto; overflow-wrap: anywhere; display: flex; flex-direction: column; gap: .2rem; }
.src-main .kv { align-self: flex-start; }
.src-acts { display: flex; flex-direction: column; gap: .4rem; align-items: stretch; }
.src-err { color: #f0b37e; font-size: var(--fs-sm); }

/* שעות פרסום (17/09) — עמודות לפי שעה */
.hours-bars {
  display: flex; align-items: flex-end; gap: 2px; height: 120px;
  margin: .6rem 0; padding: .4rem; background: var(--bg);
  border-radius: var(--r-2); overflow-x: auto;
}
.hb-bar { flex: 1 1 0; min-width: 10px; display: flex; flex-direction: column;
  align-items: center; justify-content: flex-end; height: 100%; }
.hb-fill { width: 70%; background: var(--accent); border-radius: 3px 3px 0 0; }
.hb-top .hb-fill { background: #e8a33d; }
.hb-h { font-size: var(--chart-label); color: var(--muted); margin-top: 2px; }

/* בדיקות לפי שלבים + בדיקות מצולמות (17/09) */
.chk-stage { margin: .8rem 0 1.1rem; }
.chk-stage-h { font-size: var(--fs-base); margin: 0 0 .4rem; }
.photo-list { margin: .5rem 0; padding-inline-start: 1.2rem; display: flex;
  flex-direction: column; gap: .5rem; }
.photo-item { line-height: 1.5; }
.photo-item .kv { font-size: var(--fs-sm); margin-inline-start: .4rem; }

/* חלוקת המוצרים לתחומים (22/09) */
.dom-h { font-size: var(--fs-base); margin: 1.1rem 0 .3rem; }
.range-pair { display: flex; gap: .4rem; }
.range-pair input { flex: 1 1 0; min-width: 0; }

/* מודעה שהיא "הצעה" ולא התאמה מלאה (22/09) */
.tl-sugg { color: #e8a33d; font-weight: 700; margin-inline-end: .2rem; }

/* לשוניות מקטעים בתוך דף (18/10, תיבת השאלות) — פס עם קו תחתון, כדי שלא יתבלבלו
   עם לשוניות התחום (כדורים) שמתחתן */
.sectabs { display: flex; gap: .2rem; flex-wrap: wrap; margin: 0 0 .8rem; border-bottom: 1px solid var(--line); }
.sectab { display: inline-flex; align-items: center; gap: .35rem; text-decoration: none; color: var(--muted);
  padding: .55rem .8rem; border-bottom: 3px solid transparent; margin-bottom: -1px; }
.sectab:hover { color: var(--ink); }
.sectab.on { color: var(--ink); border-bottom-color: var(--accent); font-weight: 600; }
.sectab .dt-n { font-size: var(--fs-sm); opacity: .75; }

/* לשוניות תחום בדף המוצרים (22/09) — תחום אחד בכל פעם */
.domtabs { display: flex; gap: .4rem; flex-wrap: wrap; margin: .2rem 0 .7rem; }
.domtab {
  display: inline-flex; align-items: center; gap: .4rem; text-decoration: none;
  padding: .45rem 1rem; border-radius: var(--r-pill);
  background: var(--card); color: var(--ink); border: 1px solid var(--line);
}
.domtab.on { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); font-weight: 600; }
.domtab .dt-n { font-size: var(--fs-sm); opacity: .75; }
.domtab-rename { align-self: center; font-size: var(--fs-sm); color: var(--muted);
  text-decoration: none; padding: .3rem .5rem; }
.domtab-rename:hover { color: var(--accent); }
/* שורת בחירת התחום בטופס מוצר חדש — אותה שפה כמו לשוניות התחומים
   במוצרים במעקב, כדי שהמשתמש יזהה שזו אותה חלוקה. */
.domchips { align-items: center; margin-bottom: .9rem; }
.domchips .dc-q { font-size: var(--fs-sm); color: var(--muted); margin-inline-end: .2rem; }
.domchips button.domtab { cursor: pointer; font: inherit; }
.domchips.sub { margin: .2rem 0 .6rem; }
.domchips.sub button.domtab { padding: .3rem .8rem; font-size: var(--fs-sm); }

/* ── בורר עץ הקטגוריות (28/09) — אותם שבבים כמו לשוניות התחומים ── */
.treepick { margin-bottom: .6rem; }
.treepick .tp-prompt { margin: 0 0 .4rem; }
.treepick .tp-q { width: 100%; margin-bottom: .4rem; }
.treepick .tp-row { margin-bottom: .45rem; }
.treepick .tp-row + .tp-row button.domtab { padding: .3rem .8rem; font-size: var(--fs-sm); }
.treepick .tp-n { color: var(--muted); font-size: var(--fs-xs); }
.tp-results { display: flex; flex-direction: column; gap: .3rem; margin: 0 0 .6rem; }
.tp-hit { text-align: start; font: inherit; cursor: pointer; padding: .45rem .7rem;
  background: var(--card); color: var(--ink); border: 1px solid var(--line);
  border-radius: var(--r-2); }
.tp-hit:hover, .tp-hit:focus { border-color: var(--accent); }
.tp-where { margin: .2rem 0 .6rem; font-size: var(--fs-sm); }
/* על משטח כרטיס (08/10): ישבה ישר על הרקע הכחול — ירוק כהה על כחול, כמעט לא נקרא */
.tp-path-line { margin: .2rem 0 .6rem; font-size: var(--fs-sm); display: inline-block;
  background: var(--card); color: var(--ink); border-radius: var(--r-pill); padding: .35rem .9rem; }
.tp-path-line a { text-decoration: underline dotted; }
.tp-path-line .tp-move-link { margin-inline-start: .5rem; text-decoration: none; }
.tp-attrs .qbar select { max-width: 100%; }

/* סימן המקור על ריבוע מודעה (29/09) — ✋ יד2 · 🛒 מרקטפלייס · 🌐 אתר חיצוני */
.tile .tl-src {
  position: absolute; inset-block-start: .5rem; inset-inline-end: .5rem;
  background: rgba(0,0,0,.45); border-radius: var(--r-pill); padding: .12rem .35rem;
  font-size: var(--fs-sm); line-height: 1;
}
/* שורת כתובת של אתר חיצוני ברוטינה */
.ext-row { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; margin-block: .35rem; }
.ext-row input[type=url] { flex: 1 1 14rem; min-width: 0; }
.ext-row .ext-res { flex-basis: 100%; }

/* שורת אתר חיצוני — בטלפון הפעולות יורדות מתחת לטקסט (30/09: הטקסט נדחס
   לעמודה צרה והמשפטים נשברו) */
@media (max-width: 640px) {
  .src-row.src-stack { flex-direction: column; }
  .src-row.src-stack .src-acts { flex-direction: row; flex-wrap: wrap; }
}
/* תיבת סימון באותה שורה עם השאלה */
.qbar label.chk { display: flex; align-items: flex-start; gap: .5rem; }
.qbar label.chk input[type=checkbox] { flex: none; margin-top: .3rem; width: auto; }

/* טבלת ניסוחי החיפוש (05/10): הכפתור גלש מחוץ לשדה ואפשר גלילה הצידה של כל
   הדף בטלפון. עכשיו הטבלה ברוחב השדה בדיוק, הטקסט נשבר, והכפתור קומפקטי. */
.queries-tbl { max-width: 100%; overflow: hidden; }
.q-tbl { width: 100%; table-layout: fixed; }
.q-tbl th, .q-tbl td { padding: .3rem .25rem; }
.q-tbl td.q-text { overflow-wrap: anywhere; }
.q-tbl th:first-child, .q-tbl td.q-text { width: 38%; }
.q-tbl td.q-act { width: 4.6rem; }
.q-tbl td.q-act button { padding: .2rem .45rem; font-size: var(--fs-sm); white-space: nowrap; max-width: 100%; }

/* בדיקה לפני קנייה (01/10): שאלה אחת בכל פעם — רק הכרטיס הראשון שלא נענה
   גלוי; כשעונים, הרכיב המשותף מסתיר אותו והבא עולה. */
.wiz [data-quick-item]:not([hidden]) ~ [data-quick-item] { display: none; }
.wiz-card { border: 1px solid var(--line, #2c5a66); border-radius: 14px; padding: .8rem; margin: .5rem 0; }
.wiz-q { font-size: var(--fs-lg); font-weight: 600; margin: .2rem 0 .4rem; }
.wiz-why { margin: 0 0 .5rem; }
.wiz-tags { margin: 0; }
.wiz-btns { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; margin-top: .4rem; }
.wiz-btns button { min-height: 2.6rem; min-width: 4.2rem; font-size: var(--fs-base); }
.wiz-btns button.sm { min-height: 2rem; min-width: 0; font-size: var(--fs-sm); }
.wiz-num { max-width: 9rem; font-size: var(--fs-lg); }
.wiz-text { width: 100%; }
.wiz-msg { width: 100%; max-width: 100%; box-sizing: border-box; }
.wiz-verdict { font-size: var(--fs-lg); font-weight: 700; margin: .3rem 0; }
.wiz-counts span { display: inline-block; margin-inline-end: .8rem; }
.wiz-done-list { list-style: none; padding: 0; margin: .3rem 0; }
.wiz-done { padding: .35rem 0; border-bottom: 1px solid var(--line, #2c5a66); overflow-wrap: anywhere; }
.wiz-mark { display: inline-block; width: 1.4rem; text-align: center; font-weight: 700; }
.kv-bad { background: #7a2b2b; color: #fff; }

/* בדיקה לפני קנייה — המלצה לפסול (07/10): בולט באדום, אבל המלצה בלבד */
/* הכרטיס תמיד כהה (--card), ולכן אדום בהיר — טקסט בהיר על רקע כהה */
.panel.red-flag { border: 2px solid var(--danger-on-card, #f08a8a); }
.panel.red-flag h2 { color: var(--danger-on-card, #f08a8a); }

/* לב למודעה (לוח 15, 07/10) — בפינה העליונה של הריבוע, מול תיבת הבחירה */
/* מתחת לסימן המקור (.tl-src), באותה פינה */
.ad-cell .fav-form { position: absolute; top: 2.2rem; inset-inline-end: .5rem; z-index: 2; margin: 0; }
.fav-btn {
  background: rgba(0,0,0,.35); border: 0; border-radius: var(--r-pill); padding: .2rem .4rem;
  font-size: var(--fs-lg); line-height: 1; cursor: pointer; min-height: 0;
}
.fav-btn.on { background: rgba(0,0,0,.55); }
.fav-line { display: flex; align-items: center; gap: .5rem; margin: .4rem 0; }
.fav-line .fav-form { display: inline; margin: 0; }

/* חלוקה לקבוצות בסרגל (07/10) — התיבה הראשית בולטת מעט מתיבות הבחירה */
.filterbar .fb-split { font-weight: 600; }
.filterbar label.fb-label { display: inline-flex; align-items: center; gap: .35rem; }
/* בחירת קבוצות — שבבים בשורה (2021 · 2022 · …), לא רשימה ארוכה */
.seg-chips { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; }
.seg-chips label.fb-label {
  border: 1px solid rgba(255,255,255,.22); border-radius: var(--r-pill);
  padding: .2rem .55rem; cursor: pointer;
}
.seg-chips label.fb-label:has(input:checked) { background: var(--accent); color: var(--accent-ink); }

/* פירוק ציון (08/10): היה צבע קשיח בתוך הקוד — ירוק/אדום כהים על משטח כהה */
.delta-up { color: var(--up); }
.delta-down { color: var(--down); }
.score-big { font-size: var(--fs-lg); }

/* טופס עם שדה בתוך "עוד פעולות" ("שם קטגוריה חדשה" + הוסף) — הכפתור הוא כפתור,
   לא שורת תפריט (08/10) */
.ma-item form:has(input:not([type=hidden]), select) button:not(.danger):not(.ghost):not(.domtab) {
  background: var(--accent); color: var(--accent-ink); border-radius: var(--r-pill);
  padding: .42rem 1.05rem; width: auto; font-weight: 600; text-align: center; margin-top: .35rem;
}

/* ── תיבת מספר + כרטיס סיכום (08/10, web/ui.py: stat / summary_card) ── */
.st-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(7rem, 1fr));
  gap: var(--sp-2); margin: var(--sp-2) 0; }
.st-box { display: flex; flex-direction: column; gap: .1rem; background: var(--raise);
  border: 1px solid var(--line); border-radius: var(--r-3); padding: var(--sp-2) var(--sp-3);
  color: var(--ink); text-decoration: none; }
a.st-box:hover { border-color: var(--accent); }
.st-val { font-size: var(--fs-lg); font-weight: 700; }
.st-val.up { color: var(--up); }
.st-val.down { color: var(--down); }
.st-lbl { font-size: var(--fs-sm); color: var(--muted); }
.st-note { font-size: var(--fs-xs); color: var(--muted); }
.summary-card h2 { margin-bottom: var(--sp-2); font-size: var(--fs-lg); }
.sc-actions { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-top: var(--sp-3); }
.sc-foot { margin: var(--sp-3) 0 0; font-size: var(--fs-sm); color: var(--muted); }
.sc-foot a { color: var(--accent); }

/* ── תהליך קנייה (08/10) ── */
.dl-row { display: flex; flex-wrap: wrap; gap: var(--sp-2); align-items: center; margin: var(--sp-2) 0; }
.dl-row input:not([type=date]), .dl-row textarea { flex: 1 1 14rem; min-width: 0; }
.dl-phone { display: flex; gap: var(--sp-2); margin-top: var(--sp-2); }
.dl-log { margin: 0; padding-inline-start: 1.1rem; font-size: var(--fs-sm); }
.dl-log li { margin: .2rem 0; }
.dl-shared { white-space: pre-wrap; background: var(--raise); border-radius: var(--r-2);
  padding: var(--sp-2) var(--sp-3); }

/* ── תמונה שמתרחבת במגע + מסגרת על החלק המדובר (zoom_photo, 13/10) ── */
.q-photos { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin: var(--sp-2) 0; }
.zoom-photo { position: relative; display: inline-block; margin: 0; cursor: zoom-in;
  border-radius: var(--r-2); overflow: hidden; border: 1px solid var(--line); line-height: 0; }
.zoom-photo img { display: block; height: 96px; width: auto; max-width: 160px; object-fit: cover; }
.zoom-box { position: absolute; border: 3px solid var(--warn); border-radius: var(--r-1);
  box-shadow: 0 0 0 2px var(--bg); pointer-events: none; }
.zb-label { position: absolute; top: 100%; inset-inline-start: 0; margin-top: 2px;
  background: var(--warn); color: var(--warn-ink); font-style: normal; font-size: var(--fs-xs);
  line-height: 1.3; padding: 1px var(--sp-1); border-radius: var(--r-1); white-space: nowrap; }
.zoom-photo:not(.big) .zb-label { display: none; }
.q-focus { margin: var(--sp-1) 0; }
.zoom-overlay { position: fixed; inset: 0; z-index: 1000; background: var(--nav-bg);
  display: flex; align-items: center; justify-content: center; padding: var(--sp-3); cursor: zoom-out; }
.zoom-overlay .zoom-photo.big { cursor: zoom-out; border: 0; overflow: visible; }
.zoom-overlay .zoom-photo.big img { height: auto; width: auto; max-width: 94vw; max-height: 84vh;
  object-fit: contain; }

/* ── שאלות דומות מקובצות (13/10) — שורה לכל מודעה, והכרטיס נעלם כשכולן נענו ── */
.q-group .q-sub { border-top: 1px solid var(--line); padding-top: var(--sp-2); margin-top: var(--sp-2); }
.q-group:not(:has([data-quick-item]:not([hidden]))) { display: none; }
.q-group .q-all { display: block; margin-top: var(--sp-3); }

/* ── מתעניינים (14/10): שיחה עם היועץ, והקישור הפרטי ── */
.chat-msg { border: 1px solid var(--line); border-radius: var(--r-2); padding: var(--sp-2) var(--sp-3);
  margin: var(--sp-2) 0; background: var(--card); }
.chat-me { border-inline-start: 3px solid var(--accent); }
.chat-ai { border-inline-start: 3px solid var(--muted); }
.chat-who { font-size: var(--fs-sm); font-weight: 600; margin: 0 0 var(--sp-1); }
.chat-msg p { margin: 0 0 var(--sp-1); }
.public-page { max-width: 46rem; margin: 0 auto; padding: var(--sp-3); }

/* ── סינון AI כפתור אחד בשורה (14/10) — החיפושים האחרונים בתוכו, לא על השורה ── */
.filterbar .ai-menu { display: inline-block; margin: 0; }
.filterbar .ai-menu .ma-list { min-width: 18rem; }
.ai-recent { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-1); }
.chip.ai-active { white-space: nowrap; }
.filterbar.collapsed > .chip.ai-active:not(.fb-toggle) { display: inline-block; }   /* מכווץ — עדיין רואים ומבטלים (חזק מהכלל שמסתיר) */

/* המלצת המודל החזק (14/10) — אותה שפה כמו המלצת העברה בספק, בגוון שונה */
.strong-rec {
  margin: var(--sp-2) 0; padding: var(--sp-2) var(--sp-3); border-radius: var(--r-3);
  background: var(--raise); border-inline-start: 3px solid var(--accent);
}
.strong-rec p { margin: var(--sp-1) 0; }
.strong-rec form { margin: .3rem 0 0; }
.strong-wait { color: var(--muted); }
.strong-ask { display: inline-block; margin: .2rem 0; }

/* שיחה עם היועץ (14/10): כל הודעה = שורה מתקפלת — מי, מתי, ותחילת הטקסט */
details.chat-msg > summary { cursor: pointer; list-style: none; }
details.chat-msg > summary::-webkit-details-marker { display: none; }
details.chat-msg > summary .chat-who { display: block; }
.chat-peek { display: block; color: var(--muted); font-size: var(--fs-sm);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
details.chat-msg[open] .chat-peek { display: none; }

/* סינון פשוט בקישור של מתעניין (14/10): שבבים גדולים ומחוון — בלי "החל" */
.pf-bar { background: var(--card); border-radius: var(--r-4); padding: var(--sp-3);
  margin: 0 0 var(--sp-3); }
.pf-row { margin: 0 0 var(--sp-3); }
.pf-label { display: block; font-size: var(--fs-sm); color: var(--muted); margin: 0 0 var(--sp-1); }
.pf-label b { color: var(--ink); }
.pf-chips { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.pf-chip input { position: absolute; opacity: 0; pointer-events: none; }
.pf-chip span { display: inline-block; padding: var(--sp-1) var(--sp-3); border-radius: var(--r-pill);
  border: 1px solid var(--line); background: var(--raise); cursor: pointer; }
.pf-chip input:checked + span { background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.pf-chip input:focus-visible + span { outline: 2px solid var(--accent); }
.pf-range { width: 100%; accent-color: var(--accent); }
.pf-foot { display: flex; justify-content: space-between; align-items: center; margin: 0;
  font-size: var(--fs-sm); color: var(--muted); }
.pf-img { width: 100%; max-height: 14rem; object-fit: cover; border-radius: var(--r-3);
  margin: 0 0 var(--sp-2); }
.pf-count { font-size: var(--fs-xl); margin: 0 0 var(--sp-1); }
.tech-more summary { cursor: pointer; color: var(--muted); font-size: var(--fs-sm); }
.tech-pre { white-space: pre-wrap; direction: ltr; text-align: left; font-size: var(--fs-xs); max-height: 18rem; overflow: auto; }
.img-gone { display: inline-flex; align-items: center; justify-content: center; min-height: 4rem; min-width: 6rem;
  padding: var(--sp-2); border: 1px dashed var(--line); border-radius: var(--r-2); color: var(--muted);
  font-size: var(--fs-xs); text-align: center; }

/* ── סידור התצוגה (15/10) ─────────────────────────────────────────────── */
/* "הצג עוד" — פריט מעבר למנה לא מצויר (נשאר בדף; ראה app.js) */
.pg-cut { display: none !important; }
.pg-bar { display: flex; gap: .5rem; margin: .7rem 0 .3rem; }
.pg-bar > button { flex: 1 1 0; }
/* "עוד" בשורת הכפתורים הצפים — רק בטלפון */
.fab-more { display: none; }
@media (max-width: 640px) {
  /* לשוניות עליונות (16/10, המשתמש: "שורה אחת, לא נורא שצפוף"): שורה אחת, כל שם במלואו
     (בלי "…"), רוחב לפי השם, טקסט קטן ומרווחים צמודים; אם בכל זאת לא נכנס — השורה גוללת
     הצידה ולא נשברת לשתיים. (15/10 היו שתי שורות — תפסו יותר מדי מקום.) */
  body > nav:not(.crumbs) { display: flex; flex-wrap: nowrap; overflow-x: auto; gap: .1rem;
    padding: .3rem .3rem; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  body > nav:not(.crumbs)::-webkit-scrollbar { display: none; }
  body > nav:not(.crumbs) a { flex: 1 0 auto; min-width: auto; white-space: nowrap; overflow: visible;
    text-overflow: clip; padding: .45rem .22rem; font-size: var(--fs-sm); }
  /* כפתורים צפים: גלויים "חזרה" ו"עוד"; "עוד" פותח את השאר באותה שורה */
  .fab-more { display: inline-flex; }
  .fabs:not(.open) > .fab:not(.fab-back):not(.fab-more) { display: none; }
  .fabs.open .fab-more { filter: brightness(.85); }
  /* לשוניות תחום — שורה אחת שגוללת הצידה (לא שלוש שורות שדוחפות את התוכן) */
  .sectabs { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .sectabs > * { flex: 0 0 auto; white-space: nowrap; }
  .domtabs:not(.domchips) { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch;
    padding-bottom: .2rem; }
  .domtabs:not(.domchips) > * { flex: 0 0 auto; white-space: nowrap; }
}

/* בלאי ושימוש (25/10) — "באותו מקום יהיה כתוב גם בגדול: שים לב לבלאי". לא משנה אחוז מציאה. */
.wear-note {
  background: var(--warn-bg); color: var(--warn-ink); border-inline-start: 4px solid var(--warn);
  border-radius: var(--r-2); padding: .6rem .8rem; margin-bottom: .7rem;
}
.wear-note.wear-severe { border-inline-start-width: 7px; }
.wear-note ul { margin: .3rem 0; padding-inline-start: 1.2rem; }
.wear-head { font-weight: 700; font-size: var(--fs-lg); margin: 0 0 .3rem; }
.wear-head.wear-inline { font-size: var(--fs-sm); color: var(--warn); margin: .25rem 0 0; }
.wear-mild { margin: 0 0 .6rem; }
