/* ============================================================
   פלטפורמת "הכנה לפגישה" - עיצוב בסיס, RTL, מותאם מובייל (375 / 768)
   מיתוג פרמטרי: כל הצבעים מגיעים ממשתני --* שמוזרקים ע"י Layout
   מ-brand.config. אין כאן ערך צבע קשיח של מותג.
   ============================================================ */

/* פונטי המותג מוטמעים באתר עצמו (תיקון נתי 19/07) - בלי תלות בשרת חיצוני,
   הפונט הנכון מוצג תמיד: Sora ללטינית, Heebo לעברית.

   ⛔ תיקון נתי 25/07 ("הכתב שמן, לא יודעת אם בולד או לא"):
   קובצי הפונט הם variable fonts - קובץ אחד שמכיל את כל טווח המשקלים (אומת:
   שלושת קובצי heebo-*-hebrew זהים בייט-לבייט, ולכולם יש טבלת fvar). הם היו
   מוצהרים כשלושה @font-face נפרדים עם משקל בודד כל אחד (400/500/700) על אותו
   קובץ ממש. הצהרת משקל בודד על variable font אינה אומרת לדפדפן על איזה נקודה
   בציר לרנדר - הוא נופל למופע ברירת המחדל של הפונט, ולכן טקסט שאמור להיות
   400 יצא כבד ו"שמן", בעיקר בגודל הקטן של המפה.
   הצהרת טווח (100 900) היא הדרך הנכונה לפי מפרט CSS: היא מפעילה אינטרפולציה
   אמיתית על ציר המשקל, וכל font-weight ב-CSS מקבל בדיוק את מה שביקש.
   ⛔ הפונטים עצמם לא הוחלפו - Heebo לעברית ו-Sora ללטינית, כהוראת ספר המותג. */
@font-face { font-family: 'Heebo'; font-weight: 100 900; font-display: swap; src: url('/fonts/heebo-400-hebrew.woff2') format('woff2'); unicode-range: U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F; }
@font-face { font-family: 'Heebo'; font-weight: 100 900; font-display: swap; src: url('/fonts/heebo-400-latin.woff2') format('woff2'); }
@font-face { font-family: 'Sora'; font-weight: 100 900; font-display: swap; src: url('/fonts/sora-400-latin.woff2') format('woff2'); }

:root {
  /* מבניים בלבד (לא צבעי מותג) */
  --radius: 14px;
  --radius-lg: 18px;
  --radius-ctl: 10px;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
}

body {
  /* פונטי המותג בלבד: Sora ללטינית (קודם - Heebo מכסה גם לטינית), Heebo לעברית */
  font-family: 'Sora', 'Heebo', system-ui, sans-serif;
  background: var(--bg);
  color: var(--text);
  direction: rtl;
  text-align: right;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--primary); text-decoration: none; }
a:hover { color: var(--primary-hover); text-decoration: underline; }

/* תיקון נתי 19/07: כפתורים ופקדים יורשים תמיד את פונט המותג */
button, input, select, textarea, .btn { font-family: inherit; }

/* --- סרגל עליון (כמו אתרי המותג: גדול, גרדיאנט, קו מותג תחתון) --- */
.topbar {
  background: linear-gradient(180deg, var(--topbar), var(--surface));
  color: var(--on-topbar);
  box-shadow: var(--shadow);
  position: relative;
}
.topbar::after {
  content: '';
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--primary-2), var(--primary), var(--accent));
}
/* עדכון נתי 19/07: סרגל רחב על כל המסך, לוגו גדול מיושר לימין */
.topbar-inner {
  max-width: none;
  margin: 0;
  padding: 0 28px;
  min-height: 122px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.brand {
  color: var(--on-topbar);
  display: flex;
  /* יישור לקו התחתון של אותיות הלוגו (הניצוץ מעל ה-I מרים את מרכז הקובץ) */
  align-items: flex-end;
  gap: 16px;
}
.brand:hover { text-decoration: none; }
.brand-logo { height: 76px; width: auto; display: block; }
/* הילה זוהרת נושמת סביב הלוגו - תמיד (נתי 21/07). drop-shadow עוקב אחרי צורת האותיות.
   בריחוף מתעצמת מעט. */
.brand-logo { animation: logo-halo 3.2s ease-in-out infinite; }
.brand:hover .brand-logo { animation-duration: 2s; }
@keyframes logo-halo {
  0%, 100% { filter: drop-shadow(0 0 4px rgba(137, 110, 192, 0.45)); }
  50% { filter: drop-shadow(0 0 16px rgba(180, 168, 228, 0.9)); }
}
/* הסלוגן: פונט המותג לעברית (Heebo) + יישור לקו התחתון של אותיות הלוגו (בסיס ה-P) */
.brand-txt { display: flex; flex-direction: column; line-height: 1.2; white-space: nowrap; padding-bottom: 1px; }
.brand-txt strong { font-family: 'Heebo', sans-serif; font-size: 1.22rem; font-weight: 700; }
@media (max-width: 900px) {
  .brand-logo { height: 54px; }
  .brand-txt { white-space: normal; }
  .brand-txt strong { font-size: 1rem; }
  .mainnav a { padding: 8px 12px; gap: 6px; }
  .topbar-inner {
    min-height: 0;
    flex-wrap: wrap;
    justify-content: center;
    padding: 12px;
    gap: 8px;
  }
  .mainnav { flex-wrap: wrap; justify-content: center; }
}

/* נשימה בריחוף (תיקון נתי 19/07): רק כפתורי הסרגל העליון וסרגל התיק -
   לא כרטיסים/טבלאות (הטבלה "נשמה כל הזמן" - הוסר) */
@keyframes breathe {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.04); }
}
.mainnav a:hover, .actions .btn:hover { animation: breathe 2.2s ease-in-out infinite; }

/* ניצנוצי AI על כפתור התובנות (בקשת נתי 19/07) */
.btn .spark-inline {
  width: 12px; height: 12px; flex: none;
  animation: spark-twinkle 3.5s ease-in-out infinite;
}
.btn .spark-inline.d2 { width: 8px; height: 8px; animation-delay: 1.6s; }

/* ניצוצות המותג בסרגל - הילוך איטי מאוד (בקשת נתי 19/07) */
.topbar .spark {
  position: absolute;
  pointer-events: none;
  color: var(--accent);
  opacity: 0;
  animation: spark-twinkle 11s ease-in-out infinite;
}
@keyframes spark-twinkle {
  0%, 100% { opacity: 0; transform: scale(0.5) rotate(0deg); }
  50% { opacity: 0.85; transform: scale(1) rotate(20deg); }
}
.mainnav { display: flex; gap: 6px; align-items: center; }
.mainnav a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--on-topbar);
  opacity: 0.88;
  padding: 9px 16px;
  border-radius: 999px;
  border: 1px solid transparent;
  font-weight: 500;
}
.mainnav a .icon { color: var(--accent); }
.mainnav a:hover {
  background: var(--surface-2);
  border-color: var(--border);
  opacity: 1;
  text-decoration: none;
}
.mainnav a.active {
  background: linear-gradient(135deg, var(--primary), var(--primary-2));
  color: var(--on-primary);
  opacity: 1;
  box-shadow: 0 2px 10px var(--focus-ring);
}
.mainnav a.active .icon { color: currentColor; }
.mainnav .nav-exit { opacity: 0.65; }
.mainnav .nav-exit:hover { opacity: 1; }

/* --- אייקוני SVG - יורשים את צבע המותג מההקשר --- */
.icon {
  width: 17px;
  height: 17px;
  flex: none;
  vertical-align: -3px;
}
.btn .icon { width: 18px; height: 18px; }
h1 .icon, h2 .icon { width: 20px; height: 20px; color: var(--primary); }

/* --- מיכל ראשי --- */
/* אינפוט 14 + תיקון נתי 19/07: כל האתר ברוחב מלא - בלי שוליים ענקיים */
.container {
  max-width: 100%;
  margin: 0 auto;
  padding: 24px 20px 60px;
  overflow-x: hidden; /* טבלה רחבה גוללת בתוך .table-wrap, לא מזיזה את הדף */
}

/* תיקון נתי 19/07: כותרות בסגול המותג (var --primary - פרמטרי לכל מופע) */
h1 { font-size: 1.6rem; margin: 0 0 4px; color: var(--primary); }
h2 { font-size: 1.25rem; margin: 24px 0 12px; color: var(--primary); }
h3 { color: var(--primary); }
.subtitle { color: var(--muted); margin: 0 0 24px; }

/* --- כרטיסים --- */
.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  padding: 22px;
  margin-bottom: 16px;
}

/* --- דשבורד: מוני סטטוס --- */
.stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 14px;
  margin-bottom: 24px;
}
/* תיקון נתי 19/07: מדדים קטנים ומעודנים */
.stat {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 10px 14px;
  box-shadow: var(--shadow);
}
.stat .num { font-family: 'Sora', 'Heebo', sans-serif; font-size: 1.3rem; font-weight: 700; color: var(--primary); }
.stat.accent .num { color: var(--accent); }
.stat .label { color: var(--muted); font-size: 0.9rem; }
.stat.alert .num { color: var(--warn); }

/* --- טבלאות --- */
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td {
  padding: 10px 12px;
  text-align: right;
  border-bottom: 1px solid var(--border);
}
th { color: var(--muted); font-weight: 500; font-size: 0.9rem; white-space: nowrap; }
tr:hover td { background: var(--surface-2); }

/* --- תגיות סטטוס --- */
.badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 500;
}
/* אינפוט 17 (19/07): תגי סטטוס בצבעי המותג בלבד - לא ירוק/צהוב */
.badge-soon { background: var(--btn-secondary-bg); color: var(--accent); }
.badge-ok { background: var(--focus-ring); color: var(--accent); }
/* תיקון נתי 22/07: תג "קריטי" בסגול המותג במקום אדום (אדום אינו צבע מותג) */
.badge-danger { background: var(--btn-secondary-bg); color: var(--accent); }

/* --- כפתורים --- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 20px;
  border-radius: var(--radius-ctl);
  border: none;
  font-family: inherit;
  font-size: 0.95rem;
  font-weight: 700;
  cursor: pointer;
  background: linear-gradient(135deg, var(--primary), var(--primary-2, var(--primary)));
  color: var(--on-primary);
  transition: opacity 0.15s;
}
.btn:hover { opacity: 0.92; color: var(--on-primary); text-decoration: none; }
.btn-secondary { background: var(--btn-secondary-bg); color: var(--btn-secondary-text); }
.btn-secondary:hover { background: var(--btn-secondary-hover); color: var(--btn-secondary-text); opacity: 1; }
.btn-danger { background: var(--danger); color: #fff; }
.btn-sm { padding: 6px 12px; font-size: 0.85rem; }
.btn:disabled { opacity: 0.5; cursor: default; }

.actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

/* --- טפסים --- */
.form-row { margin-bottom: 14px; }
label { display: block; font-weight: 500; margin-bottom: 6px; font-size: 0.95rem; }
input, select, textarea {
  width: 100%;
  padding: 11px 13px;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-ctl);
  font-family: inherit;
  font-size: 0.95rem;
  direction: rtl;
  text-align: right;
  background: var(--input-bg);
  color: var(--text);
  transition: border-color 0.15s;
}
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 0.7; }
input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px var(--focus-ring);
}
textarea { min-height: 140px; resize: vertical; line-height: 1.6; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.hint { color: var(--muted); font-size: 0.85rem; margin-top: 4px; }

/* --- מודל (חלון קופץ) --- */
.modal-backdrop {
  position: fixed; inset: 0;
  background: rgba(0,0,0,0.55);
  display: flex; align-items: center; justify-content: center;
  padding: 16px; z-index: 100;
}
.modal {
  background: var(--surface); color: var(--text); border-radius: var(--radius);
  border: 1px solid var(--border);
  max-width: 640px; width: 100%; max-height: 90vh; overflow-y: auto;
  padding: 24px; box-shadow: var(--shadow);
}
.modal-close { float: left; background: none; border: none; font-size: 1.4rem; cursor: pointer; color: var(--muted); }

/* --- הודעת toast --- */
.toast {
  position: fixed; bottom: 20px; right: 50%; transform: translateX(50%) translateY(120px);
  background: var(--topbar); color: var(--on-topbar); padding: 12px 22px; border-radius: 8px;
  box-shadow: var(--shadow); transition: transform 0.3s; z-index: 200; max-width: 90vw;
}
.toast.show { transform: translateX(50%) translateY(0); }
.toast.error { background: var(--danger); color: #fff; }

/* --- פס התקדמות מונפש (העלאה / סריקה) --- */
.scan-bar {
  height: 6px;
  border-radius: 999px;
  background: var(--surface-2);
  overflow: hidden;
  margin-bottom: 10px;
}
.scan-bar-fill {
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--primary-2), var(--primary), var(--accent));
  transition: width 0.2s ease;
}
.scan-bar.indet .scan-bar-fill {
  width: 100%;
  background: linear-gradient(90deg, var(--surface-2) 20%, var(--primary) 50%, var(--surface-2) 80%);
  background-size: 200% 100%;
  animation: scanShimmer 1.3s linear infinite;
}
@keyframes scanShimmer {
  from { background-position: 200% 0; }
  to { background-position: -200% 0; }
}

/* --- אזור גרירה (תיקיות / קבצים / זיפ - הכל ביחד) --- */
.dropzone {
  border: 2px dashed var(--border);
  border-radius: var(--radius);
  padding: 24px 18px;
  display: grid;
  gap: 10px;
  justify-items: center;
  text-align: center;
  transition: border-color 0.15s, background 0.15s;
}
.dropzone > .icon { width: 30px; height: 30px; color: var(--primary); }
.dropzone .dz-hint { color: var(--muted); font-size: 0.88rem; }
/* ===== מפת הלקוח (אינפוטים 10, 13, 14, 21, 22, 36) ===== */
.map-table th { white-space: nowrap; }
/* אינפוט 36: צפיפות - שורות דקות וכתב קטן, לראות כמה שיותר בלי לגלול.
   קריאות הכתב (בחירת נתי 25/07, אופציה ג מתוך שלוש שנבחנו ברינדור אמיתי):
   הכתב היה 0.72rem במשקל 400 עם גובה שורה 1.12, ועל רקע כהה טקסט בהיר בגודל
   כזה נקרא "שמן". משקל 300 (נפתח אחרי הצהרת הפונט כטווח variable), גודל
   0.8rem וגובה שורה 1.32 - דק יותר, עם נשימה בין השורות. */
.map-table th, .map-table td { padding: 2px 6px; font-size: 0.8rem; font-weight: 300; line-height: 1.32; border: 1px solid var(--border); }
/* שורת הכותרות מוגדלת ובולד (בקשת נתי 22/07) */
.map-table thead th { font-size: 0.86rem; font-weight: 700; line-height: 1.32; }
/* אינפוט 36: כותרות הטבלה מוקפאות בגלילה (שורת הכותרות בפועל בלבד).
   העטיפה של המפה היא מכל גלילה (max-height) - חובה כדי ש-sticky יעבוד:
   overflow-x לבדו הופך את overflow-y ל-auto ומצמיד את הכותרת לעטיפה. */
.prep-map .table-wrap { max-height: 82vh; overflow: auto; }
.map-table thead tr:last-child th { position: sticky; top: 0; z-index: 5; background: var(--surface); }
[data-edit] { position: relative; cursor: pointer; }
/* אינפוט 21: עיפרון קטן בפינה השמאלית התחתונה של התא בריחוף */
[data-edit]:hover::after {
  content: '✎';
  position: absolute; bottom: 1px; left: 4px;
  font-size: 0.72rem; color: var(--accent); opacity: 0.9;
}
[data-edit].editing { outline: 2px solid var(--primary); outline-offset: -2px; background: var(--surface-2); cursor: text; }
[data-edit].editing::after { content: none; }
/* מיון בלחיצה על כותרת (בקשת נתי 22/07): כותרות הטבלה לחיצות + חיווי כיוון */
.map-table thead tr:last-child th { cursor: pointer; user-select: none; }
.map-table thead th[data-sort-dir="asc"]::after { content: " ▲"; font-size: 0.7em; opacity: 0.8; }
.map-table thead th[data-sort-dir="desc"]::after { content: " ▼"; font-size: 0.7em; opacity: 0.8; }

/* סרגל סינון המפה - בחירה מרובה מודרנית (בקשת נתי 22/07) */
.map-filter { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; padding: 8px 12px; position: relative; z-index: 30; }
.ms { position: relative; }
.ms-btn {
  display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; border-radius: 999px;
  border: 1px solid var(--border); background: var(--surface-2); color: inherit; cursor: pointer;
  font-family: inherit; font-size: 0.82rem; transition: border-color 0.15s, background 0.15s;
}
.ms-btn:hover { border-color: var(--primary); }
.ms.ms-active .ms-btn { border-color: var(--primary); color: var(--primary); background: var(--focus-ring); font-weight: 600; }
.ms-caret { opacity: 0.6; font-size: 0.7em; }
.ms-count { color: var(--primary); font-weight: 700; }
.ms-panel {
  position: absolute; top: calc(100% + 5px); right: 0; z-index: 70; min-width: 230px; max-width: 320px;
  background: var(--surface); border: 1px solid var(--border); border-radius: 14px;
  box-shadow: var(--shadow); padding: 8px;
}
.ms-search { width: 100%; margin-bottom: 6px; padding: 7px 10px; font-size: 0.82rem; border-radius: 8px; }
.ms-opts { max-height: 280px; overflow: auto; }
.ms-opt { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 8px; cursor: pointer; font-size: 0.85rem; font-weight: 400; white-space: nowrap; }
.ms-opt:hover { background: var(--surface-2); }
.ms-opt input { width: auto; accent-color: var(--primary); cursor: pointer; }

/* ⛔ תיקון נתי 25/07: הערה ארוכה (רשימת כיסויים שלמה מהמסלקה) מתחה שורת
   פוליסה אחת לגובה של עשר שורות והרסה את הפרופורציה של כל הטבלה. ההערה
   מקוצצת לשתי שורות; הטקסט המלא נפתח בריחוף ובלחיצה על התא (עריכה). */
.map-table td[data-edit$=":notes"] {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.map-table td[data-edit$=":notes"].editing {
  display: table-cell;
  -webkit-line-clamp: none;
  overflow: visible;
}
/* עמודת הערות (בקשת נתי 22/07): גולשת לשורות במקום שורה אחת רחבה עם סרגל אופקי.
   מנצלת רוחב מינימלי, שוברת בין מילים (לא באמצע מילה). */
.map-table td[data-edit$=":notes"] {
  white-space: normal;
  overflow-wrap: break-word;
  word-break: normal;
  max-width: 340px;
  min-width: 150px;
}
/* עמודת "סוג פוליסה" (בקשת נתי 22/07): הטבלה נמתחת ל-100%, ואחרי שירדה עמודה
   "סוג פוליסה" בלעה את המקום. מגבילים אותה לרוחב קומפקטי שגולש לשורות כמו קודם. */
.map-table td[data-edit$=":policy_type"] {
  white-space: normal;
  overflow-wrap: break-word;
  max-width: 190px;
}
/* צמצום שם-מבוטח + חברה, והרחבת המלצות (בקשת נתי 22/07) - פינוי מקום להמלצות */
.map-table td[data-edit$=":insured"] { max-width: 88px; white-space: normal; overflow-wrap: break-word; }
.map-table td[data-edit$=":company"] { max-width: 100px; white-space: normal; overflow-wrap: break-word; }
.rec-cell { min-width: 150px; }

/* ⛔⛔ רוחב עמודות - בקשה חוזרת של נתי שלא בוצעה עד 25/07:
   עמודה שיש בה מספר קצר לא צריכה לתפוס רוחב של עמודת טקסט. table-layout: fixed
   מכריח את הדפדפן לכבד את הרוחב שנקבע במקום "לחלק לפי התוכן" ולמתוח מספרים.
   הרוחב נקבע לפי מה שבאמת יושב בעמודה: פרמיה וסכום = מספר, מס' פוליסה = 9-12
   ספרות, סוג = מילה או שתיים. המקום שמתפנה הולך להערות ולהמלצות. */
/* ⛔ הרוחב נקבע ב-colgroup ולא ב-nth-child: בלוק פוליסה משתמש ב-rowspan,
   ובשורות ההמשך מספר התאים קטן יותר - כך ש-nth-child מצביע על עמודה אחרת
   בכל שורה. colgroup מגדיר עמודות אמיתיות ועובד נכון עם rowspan. הכללים גם
   הוגבלו לטבלת העלויות בלבד (cost-table), אחרת הם שברו את המטריצה. */
/* בקשת נתי 02/08: מקום רחב יותר להערות ולהמלצות. שבע העמודות הראשונות
   נשארות ברוחב הקבוע שלהן (614 פיקסלים בסך הכל), והערות והמלצות מוגדרות
   בלי רוחב - ב-table-layout: fixed הן חולקות ביניהן את כל השטח שנשאר במסך.
   min-width שומר על הרוחב הקודם: מסך צר מזה גולל בעטיפה, הגוף לא גולש. */
.cost-table { table-layout: fixed; width: 100%; min-width: 1124px; }
.prep-map .table-wrap, .card > .table-wrap { max-width: 100%; overflow-x: auto; }
.cost-table td, .cost-table th { overflow-wrap: break-word; }
/* מספר לא נשבר לשתי שורות - "1,183,565" ו-"2944535083" יושבים בשורה אחת */
.cost-table col.c-num + col {}
.cost-table td.num, .cost-table th.num { text-align: left; white-space: nowrap; }
/* תא המלצות - בורר מובנה (לא עריכת טקסט), פותח חלונית בלחיצה */
.rec-cell { cursor: pointer; }
.rec-cell:hover { background: var(--surface-2); }
.rec-chip { display: inline-block; background: var(--accent); color: var(--on-primary); border-radius: 999px; padding: 1px 8px; font-size: 0.7rem; line-height: 1.3; }
.rec-add { color: var(--accent); opacity: 0.85; font-size: 0.72rem; white-space: nowrap; }
/* בקשת נתי 22/07: כל תאי המטריצה ממורכזים (לא רק ה-X) */
.matrix-table td, .matrix-table th { text-align: center; }
/* מטריצה מאוחסנת - תאים נערכים + כפתורי מחיקת שורה/עמודה (בקשת נתי 22/07) */
[data-mx] { cursor: pointer; }
[data-mx].editing { outline: 2px solid var(--primary); outline-offset: -2px; background: var(--surface-2); cursor: text; }
.mx-del { background: none; border: none; color: var(--muted); cursor: pointer; font-size: 0.85rem; margin-inline-start: 4px; padding: 0 2px; line-height: 1; }
.mx-del:hover { color: var(--danger); }
.matrix-table td.mx-none { color: var(--muted); opacity: 0.55; text-align: center; }
.matrix-table td.mx-has { color: var(--accent); font-weight: 600; }
.matrix-table td.mx-missing { font-size: 0.85rem; color: var(--muted); }
.doc-list li { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 2px 0; }
/* אינפוט 34: בנק המסמכים - חלון פנימי + שורות עם צ'ק-בוקס וכפתורים */
.doc-bank-modal { max-width: 820px; width: 92vw; max-height: 86vh; overflow-y: auto; text-align: right; }
.doc-bank-list { list-style: none; padding: 0; margin: 0; }
.doc-bank-list li { padding: 8px 4px; border-bottom: 1px solid var(--border); gap: 10px; flex-wrap: wrap; }
.doc-other-summary { flex-basis: 100%; color: var(--muted); font-size: 0.82rem; margin: 2px 0 0; line-height: 1.4; }
.doc-check-wrap { flex: 0 0 auto; display: flex; align-items: center; }
.doc-check { width: 17px; height: 17px; cursor: pointer; accent-color: var(--primary); }
.doc-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.doc-meta { flex: 0 0 auto; color: var(--muted); font-size: 0.85rem; white-space: nowrap; }
.doc-row-actions { flex: 0 0 auto; display: flex; gap: 6px; }
.doc-add-chip { cursor: pointer; border: none; font-family: inherit; font-size: 0.8rem; }
/* אינפוט 22: חיווי "V עודכן" שנעלם אחרי שנייה */
.saved-flash {
  position: absolute; top: -20px; left: 4px; z-index: 30;
  background: var(--primary); color: var(--on-primary);
  font-size: 0.72rem; border-radius: 6px; padding: 2px 8px;
  animation: saved-fade 1s forwards;
}
@keyframes saved-fade { 70% { opacity: 1; } 100% { opacity: 0; } }
/* אינפוט 31: חץ קבוע לגלילה חזרה למעלה */
.back-to-top {
  position: fixed; bottom: 18px; left: 18px; z-index: 150;
  width: 42px; height: 42px; border-radius: 50%; border: 0;
  background: var(--primary); color: var(--on-primary);
  font-size: 1.2rem; cursor: pointer; box-shadow: var(--shadow);
  display: none; align-items: center; justify-content: center;
}
.back-to-top.show { display: flex; }

/* אינפוט 3: "ביחד" בולט עם זוהר בצבעי המותג */
.dz-glow {
  color: var(--accent);
  font-weight: 800;
  text-shadow: 0 0 8px var(--focus-ring);
  animation: dz-glow-pulse 1.6s ease-in-out infinite alternate;
}
@keyframes dz-glow-pulse {
  from { text-shadow: 0 0 6px var(--focus-ring); }
  to { text-shadow: 0 0 16px var(--primary), 0 0 26px var(--focus-ring); }
}
.dropzone.drag {
  border-color: var(--primary);
  background: var(--surface-2);
  box-shadow: 0 0 0 3px var(--focus-ring);
}

/* --- הודעה ריקה --- */
.empty { text-align: center; color: var(--muted); padding: 40px 20px; }

/* --- מסך התחברות (כמו אתרי המותג) --- */
.auth-wrap {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
.auth-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow);
  width: 100%;
  max-width: 430px;
  padding: 38px 32px;
}
.auth-logo { height: 44px; display: block; margin: 0 auto 14px; }
.auth-card h1 { font-size: 21px; font-weight: 800; text-align: center; margin: 0; }
.auth-sub { font-size: 13.5px; color: var(--muted); text-align: center; margin: 6px 0 26px; line-height: 1.6; }
.auth-card label { font-size: 13.5px; font-weight: 600; color: var(--accent); }
.auth-foot { margin-top: 26px; font-size: 11.5px; color: var(--muted); text-align: center; line-height: 1.5; }
.auth-error {
  margin: 0 0 12px;
  background: var(--badge-danger-bg);
  border: 1px solid var(--border);
  color: var(--danger);
  font-size: 13.5px;
  padding: 10px 12px;
  border-radius: 8px;
  text-align: center;
}

/* --- קרדיט מותג (Built and designed by) --- */
.brand-credit {
  display: flex; align-items: baseline; justify-content: center;
  gap: 8px; margin-top: 18px;
  font-size: 11px; color: var(--muted);
  direction: ltr;
}
.brand-credit img { height: 15px; display: block; }
.brand-credit a { display: flex; align-items: center; }
.site-credit {
  max-width: 960px; margin: 0 auto; padding: 8px 16px 24px;
}

/* --- שורות משימה --- */
.task-row {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 4px; border-bottom: 1px solid var(--border);
}
.task-row:last-child { border-bottom: none; }
.task-check {
  flex: none; width: 26px; height: 26px; border-radius: 50%;
  border: 2px solid var(--primary); background: var(--surface); color: var(--primary);
  cursor: pointer; font-size: 1rem; line-height: 1; padding: 0;
}
.task-check:hover { background: var(--surface-2); }
.task-title { flex: 1; }
.task-customer { color: var(--primary); font-size: 0.9rem; }
.task-row.done .task-title { text-decoration: line-through; color: var(--muted); }
.task-row.done .task-check { background: var(--success); border-color: var(--success); color: #fff; }

/* --- אזור AI --- */
.ai-output { background: var(--surface-2); border: 1px solid var(--border); border-radius: 8px; padding: 16px; white-space: pre-wrap; margin-top: 12px; }
.spinner { display: inline-block; width: 16px; height: 16px; border: 2px solid var(--on-primary); border-top-color: transparent; border-radius: 50%; animation: spin 0.7s linear infinite; vertical-align: middle; }
@keyframes spin { to { transform: rotate(360deg); } }
.htmx-request .spinner-host { display: inline; }
.spinner-host { display: none; }

/* --- הדפסה / PDF: לרוחב, רקע בהיר, בלי פקדים (האפיון סעיף 7) --- */
@media print {
  @page { size: A4 landscape; margin: 12mm; }
  body { background: #fff !important; color: #000 !important; }
  .topbar { background: #fff !important; box-shadow: none; border-bottom: 1px solid #ccc; }
  .mainnav, .actions button, .actions a.btn, [data-scan-progress], input[type="file"] { display: none !important; }
  .card { background: #fff !important; border-color: #ccc; box-shadow: none; color: #000 !important; }
  .card h2, .card h3, h1 { color: #000 !important; }
  th, td { color: #000 !important; border-color: #bbb; }
  th { color: #333 !important; }
  .subtitle, .hint, .stat .label { color: #444 !important; }
  a { color: #000 !important; text-decoration: none; }
  .badge { border: 1px solid #999; background: #fff !important; color: #000 !important; }
  .ai-output { background: #fff !important; border-color: #ccc; color: #000 !important; }
}

/* --- מובייל --- */
html, body { max-width: 100%; overflow-x: hidden; }
.mainnav a { white-space: nowrap; }
@media (max-width: 768px) {
  .form-grid { grid-template-columns: 1fr; }
  h1 { font-size: 1.4rem; }
}
@media (max-width: 640px) {
  .brand-logo { height: 38px; }
  .mainnav a { padding: 7px 12px; font-size: 0.9rem; }
}
@media (max-width: 375px) {
  .brand-logo { height: 32px; }
  .brand-txt strong { font-size: 0.95rem; }
  .mainnav a { padding: 6px 9px; gap: 5px; }
  .container { padding: 16px 10px 40px; }
  .card { padding: 16px; }
}

/* ============================================================
   שקיפות מקור הנתון (ה-5, אישור נתי 28/07)
   תא ריק שהנתון בו אינו מדווח במסמך המקור מסומן עדין, וריחוף עליו
   מציג מאיפה הנתון היה אמור להגיע ולמה אין אותו.
   ⛔ הצבע מ-var(--muted) של המותג בלבד; המפה נשארת כהה.
   ⛔ הסימון פר-תא: מסמך שכן נושא ערך מספרי בשדה אחר לא מסומן שם.
   ============================================================ */
.map-table td.no-data { position: relative; }
.map-table td.no-data::after {
  content: '';
  position: absolute;
  inset-inline: 6px;
  bottom: 3px;
  height: 1px;
  border-bottom: 1px dotted var(--muted);
  opacity: 0.45;
  pointer-events: none;
}
.map-table td.no-data:hover::after { opacity: 0.9; }

/* ה-9: כיסוי שמופיע במקור אחד בלבד (הצלבת מסלקה מול הר הביטוח).
   סימון על השורה, לא על תא בודד - הפער הוא ברמת הפוליסה.
   ⛔ צבע המותג בלבד (--accent = לבנדר). */
.map-table tr.cross-gap > td:first-child {
  box-shadow: inset 3px 0 0 var(--accent);
}
.map-table tr.cross-gap > td:first-child::before {
  content: '⇄ ';
  color: var(--accent);
  font-size: 0.9em;
  opacity: 0.85;
}