/* ============================================================
   ArcHub — שלד, רקע, סרגל עליון, מסכים, ופרימיטיבים משותפים.
============================================================ */
*{box-sizing:border-box;}
html,body{height:100%;margin:0;}
body{
  font-family:var(--font-ui);
  color:var(--text);
  background:var(--bg-1);
  overflow:hidden; /* העמוד עצמו לא נגלל — רק #screen-root. ראו LAYOUT */
  transition:background .5s ease, color .4s ease;
}
button,input,select,textarea{font-family:inherit;}
/* הרשימה הנפתחת של select מצוירת בידי הדפדפן ואינה יורשת את רקע הזכוכית
   השקוף — בלי רקע אטום משלה היא נפתחת לבנה, והטקסט הבהיר של מצב לילה נעלם. */
select option,select optgroup{background-color:var(--select-bg);color:var(--text);}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}
/* הדגשה בתוך טקסט רץ היא משקל ביניים; 700 שמור לכותרות, כפתורים ומספרי מפתח */
b,strong{font-weight:var(--fw-medium);}
.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* ================= BACKGROUND SCENE ================= */
.bg-scene{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;}
.blob{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;transition:background .6s ease, opacity .6s ease;}
.blob1{width:46vw;height:46vw;background:var(--blob-a);top:-14vw;right:-10vw;animation:float1 22s ease-in-out infinite;}
.blob2{width:38vw;height:38vw;background:var(--blob-b);bottom:-12vw;left:-8vw;animation:float2 26s ease-in-out infinite;}
.blob3{width:30vw;height:30vw;background:var(--blob-c);top:40%;left:32%;animation:float3 30s ease-in-out infinite;}
.blob4{width:26vw;height:26vw;background:var(--blob-d);bottom:8%;right:18%;animation:float1 24s ease-in-out infinite reverse;}
@keyframes float1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-30px,40px) scale(1.06)}}
@keyframes float2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(40px,-30px) scale(1.08)}}
@keyframes float3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-20px,-40px) scale(.94)}}

/* ================= GLASS PRIMITIVES ================= */
.glass{
  background:var(--glass-bg);
  backdrop-filter:blur(22px) saturate(160%);
  -webkit-backdrop-filter:blur(22px) saturate(160%);
  border:1px solid var(--glass-border);
  box-shadow:var(--glass-shadow);
}
.glass-strong{
  background:var(--glass-bg-strong);
  backdrop-filter:blur(28px) saturate(170%);
  -webkit-backdrop-filter:blur(28px) saturate(170%);
  border:1px solid var(--glass-border);
  box-shadow:var(--glass-shadow-lg);
}

/* ================= APP BAR ================= */
.appbar{
  position:fixed;top:var(--banner-h);left:0;right:0;z-index:600;height:var(--appbar-h);
  transition:background .5s ease, top .2s ease;
}
.appbar-fill{position:relative;height:100%;}
.ab-left{position:absolute;top:50%;left:20px;transform:translateY(-50%);display:flex;align-items:center;gap:6px;}
.ab-right{position:absolute;top:50%;right:20px;transform:translateY(-50%);display:flex;align-items:center;gap:8px;}
.ab-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:10px;max-width:46vw;}

#theme-toggle,.login-theme{
  width:42px;height:42px;border-radius:50%;background:transparent;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;color:var(--text);border:none;
  transition:transform .25s ease, background .4s ease;
}
#theme-toggle:hover,.login-theme:hover{transform:translateY(-2px) rotate(-8deg);background:var(--input-bg);}
#theme-toggle svg,.login-theme svg{width:19px;height:19px;transition:opacity .2s;stroke:currentColor;}
/* במסך ההתחברות אין סרגל עליון; הכפתור יושב באותה פינה שבה הוא נמצא בסרגל */
.login-theme{position:absolute;top:14px;left:20px;z-index:2;}
.login-stage.leaving .login-theme{opacity:0;transition:opacity .35s ease;}

.ab-home{
  width:42px;height:42px;border-radius:var(--radius-md);border:none;background:transparent;cursor:pointer;color:var(--text);
  display:flex;align-items:center;justify-content:center;transition:.18s;flex-shrink:0;
}
.ab-home:hover{color:var(--accent);background:var(--input-bg);}
.ab-home svg{width:19px;height:19px;stroke:currentColor;}
.ab-screentitle{font-size:var(--fs-heading);font-weight:var(--fw-bold);color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

.ab-navtrigger{
  border:none;background:transparent;cursor:pointer;color:var(--text);display:flex;align-items:center;gap:6px;
  padding:9px 12px;border-radius:var(--radius-md);font-size:var(--fs-body);font-weight:var(--fw-bold);transition:.18s;white-space:nowrap;
}
.ab-navtrigger:hover{background:var(--input-bg);}
.ab-navtrigger svg.chev{width:13px;height:13px;color:var(--text-faint);transition:transform .18s;}
.ab-navtrigger.open svg.chev{transform:rotate(180deg);}

.ab-menu{
  position:absolute;top:calc(100% + 12px);right:0;
  min-width:250px;max-height:calc(100vh - 110px);overflow-y:auto;
  border-radius:var(--radius-md);padding:10px;z-index:610;
  display:none;
  background:var(--menu-bg);
  backdrop-filter:blur(26px) saturate(160%);
  -webkit-backdrop-filter:blur(26px) saturate(160%);
  border:1px solid var(--glass-border);
  box-shadow:var(--glass-shadow-lg);
}
.ab-menu.show{display:block;}

/* ================= MENU MOTION =================
   אנימציה אחת לכל תפריט צף בממשק — תפריט הניווט, רשימת הסינון, ותפריטי
   הקובייה והבניין בלוח: אותו משך, אותה עקומה, אותו מרחק. התפריט מחליק מהכיוון
   של הכפתור שפתח אותו (--menu-shift) ויוצא בחזרה אליו.

   כניסה: המחלקה שמציגה את התפריט מפעילה אותה.
   יציאה: תפריט הניווט נשאר במקומו עם leaving (ראו closeScreenMenu). שאר
   התפריטים יושבים בתוך אזור שמצטייר מחדש בסגירה, ולכן היציאה שלהם מתנגנת על
   העתק צף — ראו menuGhostOut() ב-ui.js. */
.ab-menu.show,.filter-dd-panel.entering,.wb-node-menu.show,.wb-building-menu.show{
  animation:menu-in var(--dur-enter) var(--ease-enter) both;
}
.ab-menu.leaving,.menu-ghost > .leaving{
  animation:menu-out var(--dur-exit) var(--ease-exit) both;pointer-events:none;
}
@keyframes menu-in{from{opacity:0;transform:translateY(var(--menu-shift))}to{opacity:1;transform:none}}
@keyframes menu-out{from{opacity:1;transform:none}to{opacity:0;transform:translateY(var(--menu-shift))}}
/* ההעתק הצף: יושב בדיוק היכן שהתפריט היה, מעל המסך ומתחת לחלונות */
.menu-ghost{position:fixed;z-index:700;pointer-events:none;transform-origin:0 0;}
.menu-ghost > .leaving{position:static;margin:0;}
.ab-menu .am-label{font-size:var(--fs-caption);font-weight:var(--fw-medium);color:var(--text-faint);text-transform:uppercase;letter-spacing:var(--ls-wide);padding:6px 10px 4px;}
.ab-menu .am-item{
  display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:var(--radius-sm);cursor:pointer;font-size:var(--fs-body);color:var(--text-soft);transition:.14s;
  border:none;background:transparent;width:100%;text-align:start;font-family:inherit;
}
.ab-menu .am-item:hover{background:var(--input-bg);color:var(--text);}
.ab-menu .am-item.current{color:var(--accent);font-weight:var(--fw-medium);background:var(--accent-soft);}
.ab-menu .am-item svg{width:15px;height:15px;flex-shrink:0;stroke:currentColor;}
.ab-menu .am-item .am-tail{margin-inline-start:auto;font-size:var(--fs-caption);color:var(--text-faint);}
.ab-menu .am-div{height:1px;background:var(--glass-border);margin:6px 4px;}

.ab-avatar{
  width:42px;height:42px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;
  font-size:var(--fs-small);font-weight:var(--fw-bold);color:var(--on-accent);background:linear-gradient(135deg,var(--accent),var(--accent-2));
  cursor:pointer;border:none;flex-shrink:0;
}

/* ================= LAYOUT ================= */
/* אזור התוכן הוא מכל הגלילה היחיד של האפליקציה, והוא מתחיל מתחת לכותרת
   הקבועה (רצועת משרד + סרגל עליון + סרגל נתיב). כך פס הגלילה נמצא מתחת
   לסרגל הנתיב ולא לצידו, והכותרת לא זזה כשהוא מופיע.
   scrollbar-gutter שומר את מקום הפס גם במסך קצר, כדי שהתוכן לא יקפוץ
   הצידה במעבר בין מסך עם גלילה למסך בלי; both-edges שומר רווח זהה בצד
   השני, כך שהתוכן נשאר ממורכז מול הסרגל העליון. */
#screen-root{
  position:fixed;top:0;left:0;right:0;bottom:0;z-index:1;
  overflow-x:hidden;overflow-y:auto;scrollbar-gutter:stable both-edges;
  overscroll-behavior:contain;
}
#screen-root:has(> .screen.with-appbar){top:var(--header-h);}
#screen-root:focus{outline:none;}
.screen{min-height:100%;display:flex;flex-direction:column;}
.wrap{max-width:1180px;margin:0 auto;padding:36px 28px 70px;width:100%;}

/* ================= BOOT / LOADING ================= */
#boot-splash{
  position:fixed;inset:0;z-index:800;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;
  background:var(--bg-1);color:var(--text-faint);font-size:var(--fs-body);
}
#boot-splash.hidden{display:none;}
.boot-mark{
  width:56px;height:56px;border-radius:var(--radius-md);background:linear-gradient(135deg,var(--accent),var(--accent-2));
  display:flex;align-items:center;justify-content:center;color:var(--on-accent);font-weight:var(--fw-bold);font-size:var(--fs-title);
  animation:hover-float 3s ease-in-out infinite;
}

/* ================= LOGIN ================= */
/* overflow:hidden — ההילה יושבת 30px מתחת לקצה המסך, ובלי זה היא מייצרת גלילה מיותרת */
.login-stage{flex:1;display:flex;align-items:center;justify-content:center;position:relative;padding:60px 20px;overflow:hidden;}
.login-cube{
  width:380px;max-width:92vw;border-radius:var(--radius-lg);padding:40px 34px;
  animation:hover-float 5.5s ease-in-out infinite;
  position:relative;
}
.login-cube::before{
  content:'';position:absolute;inset:-2px;border-radius:var(--radius-lg);z-index:-1;
  background:linear-gradient(135deg, var(--accent), transparent 60%);
  opacity:.35;filter:blur(18px);
}
@keyframes hover-float{0%,100%{transform:translateY(0px)}50%{transform:translateY(-14px)}}
.login-glow{position:absolute;bottom:-30px;left:50%;transform:translateX(-50%);width:70%;height:26px;
  background:radial-gradient(ellipse at center, var(--login-glow), transparent 70%);filter:blur(6px);border-radius:50%;}
.login-mark{
  width:56px;height:56px;border-radius:var(--radius-md);margin:0 auto 18px;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  display:flex;align-items:center;justify-content:center;color:var(--on-accent);font-weight:var(--fw-bold);font-size:var(--fs-title);
  box-shadow:0 10px 24px var(--accent-soft);
}
.login-mark svg,.boot-mark svg{width:34px;height:34px;}
/* הלוגו המלא: סמל ושם. השם לטיני ולכן הכיוון קבוע משמאל לימין */
.brand-lockup{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 auto 20px;direction:ltr;color:var(--text);}
.brand-lockup .brand-mark{width:40px;height:40px;flex-shrink:0;}
.brand-lockup .bm-door{stroke:var(--accent);}
.brand-word{font-size:var(--fs-display);font-weight:var(--fw-regular);letter-spacing:var(--ls-tight);line-height:var(--lh-tight);}
.brand-word b{font-weight:var(--fw-bold);}
.brand-word i{font-style:normal;color:var(--accent);}
.login-cube h1{text-align:center;font-size:var(--fs-title);margin:0 0 2px;font-weight:var(--fw-bold);}
.login-cube .sub{text-align:center;color:var(--text-faint);font-size:var(--fs-small);margin:0 0 26px;}
.glass-field{
  display:flex;align-items:center;gap:10px;background:var(--input-bg);border:1px solid var(--glass-border);
  border-radius:var(--radius-sm);padding:12px 14px;margin-bottom:12px;transition:.2s;
}
.glass-field:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);}
.glass-field svg{width:17px;height:17px;color:var(--text-faint);flex-shrink:0;}
.glass-field input{flex:1;border:none;background:transparent;outline:none;color:var(--text);font-size:var(--fs-heading);min-width:0;}
.glass-field input::placeholder{color:var(--text-faint);}
.login-links{display:flex;justify-content:flex-end;margin:2px 2px 20px;}
.login-links button{font-size:var(--fs-small);color:var(--accent);background:none;border:none;cursor:pointer;padding:0;font-family:inherit;}
.login-links button:hover{text-decoration:underline;}
.btn-glass-primary{
  width:100%;padding:13px;border:none;border-radius:var(--radius-sm);cursor:pointer;font-size:var(--fs-heading);font-weight:var(--fw-bold);color:var(--on-accent);
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  box-shadow:0 10px 26px var(--accent-soft);transition:.18s;
  display:flex;align-items:center;justify-content:center;gap:8px;
}
.btn-glass-primary:hover{transform:translateY(-1px);box-shadow:0 14px 30px var(--accent-soft);}
.btn-glass-primary:disabled{opacity:.7;cursor:default;transform:none;}
.login-version{text-align:center;font-size:var(--fs-caption);color:var(--text-faint);margin:16px 0 0;}
.spinner{width:15px;height:15px;border:2px solid var(--on-accent-faint);border-top-color:var(--on-accent);border-radius:50%;animation:spin .7s linear infinite;}
@keyframes spin{to{transform:rotate(360deg)}}
.login-err{
  display:flex;align-items:center;gap:7px;background:var(--red-soft);color:var(--red);border-radius:var(--radius-sm);
  padding:9px 12px;font-size:var(--fs-small);margin-bottom:14px;
}
.login-err svg{width:14px;height:14px;flex-shrink:0;}
/* יציאת קוביית הכניסה אחרי התחברות מוצלחת. scale ולא transform, כדי לא להתנגש בריחוף */
.login-stage.leaving .login-cube{opacity:0;scale:.94;transition:opacity .35s ease, scale .35s ease;}
.login-stage.leaving .login-glow{opacity:0;transition:opacity .35s ease;}

/* ================= WELCOME ================= */
/* מסך הפתיחה שבין ההתחברות למסך הבית (showWelcome ב-login.js). שכבה שקופה מעל
   הכול: קו משרטט מסגרת סביב לוגו המשרד, אחריו הברכה, ואז הלוגו נוסע למקומו במסך
   הבית בזמן שהסרגל והקוביות נכנסים. האנימציות משתמשות ב-translate וב-scale ולא
   ב-transform, כדי לא לדרוס transform של ריחוף או של מיקום. */
#welcome{
  position:fixed;inset:0;z-index:700;display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:20px;text-align:center;cursor:pointer;
}
/* scale אינו משנה את המקום שהרכיב תופס, ולכן השוליים התחתונים מפצים על ההגדלה */
.wl-mark{position:relative;padding:10px;scale:1.35;margin-bottom:34px;}
.wl-mark .office-logo,.wl-mark .login-mark{margin:0;animation:wl-pop .4s .25s cubic-bezier(.34,1.56,.64,1) both;}
/* משרד בלי לוגו: שם המשרד על אותה לוחית */
.office-logo.wl-name{
  max-height:none;max-width:260px;padding:14px 20px;color:var(--ink);
  font-size:var(--fs-heading);font-weight:var(--fw-bold);line-height:var(--lh-tight);
}
.wl-frame{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;}
.wl-frame rect{
  fill:none;stroke:var(--accent);stroke-width:2;stroke-linecap:round;stroke-dasharray:100;
  animation:wl-draw .6s ease-in-out both;
}
.wl-greet{
  font-size:var(--fs-display);font-weight:var(--fw-bold);letter-spacing:var(--ls-tight);line-height:var(--lh-tight);
  margin:0;animation:wl-up .35s .45s both;
}
.wl-sub{font-size:var(--fs-body);color:var(--text-soft);margin:6px 0 0;animation:wl-up .35s .55s both;}
#welcome.out .wl-greet,#welcome.out .wl-sub,#welcome.out .wl-mark.fade{animation:wl-out .22s both;}
#welcome.out .wl-frame{opacity:0;transition:opacity .22s ease;}
@keyframes wl-draw{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
@keyframes wl-pop{from{opacity:0;scale:.7}to{opacity:1;scale:1}}
@keyframes wl-up{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}
@keyframes wl-out{from{opacity:1;translate:0 0}to{opacity:0;translate:0 -8px}}
@keyframes wl-bar{from{opacity:0;translate:0 -100%}to{opacity:1;translate:0 0}}
/* כניסת מסך הבית מתחת למסך הפתיחה: הסרגל יורד, הכותרת והקוביות עולות בזו אחר זו */
html.wl-in .appbar,html.wl-in .crumbbar,html.wl-in .office-banner{animation:wl-bar .35s .15s both;}
html.wl-in .page-head-center .tb-title{animation:wl-up .3s .3s both;}
html.wl-in .page-head-center .tb-sub{animation:wl-up .3s .37s both;}
html.wl-in .cube-grid>*{animation:wl-up .35s .35s both;}
html.wl-in .cube-grid>:nth-child(2){animation-delay:.43s;}
html.wl-in .cube-grid>:nth-child(3){animation-delay:.51s;}
html.wl-in .cube-grid>:nth-child(n+4){animation-delay:.59s;}
html.wl-in .wrap>:not(.page-head-center):not(.cube-grid){animation:wl-up .35s .5s both;}
/* הלוגו שבמסך הבית מוסתר עד שהלוגו של מסך הפתיחה נוחת עליו */
html.wl-flying .page-head-center .office-logo,html.wl-flying .page-head-center .login-mark{visibility:hidden;}

/* מסך הפרידה שאחרי אישור היציאה (showGoodbye ב-login.js): אותה שכבה, בלי מסגרת */
@keyframes wl-fade{to{opacity:0}}
@keyframes wl-sink{to{translate:0 14px}}
/* המסך הנוכחי יוצא. ההזזה על המסך עצמו ולא על מכל הגלילה: הזזה של המכל הייתה
   משנה את נקודת הייחוס של מסך עבודה ב-position:fixed (הלוח הלבן) */
html.wl-leave #screen-root{animation:wl-fade .26s ease both;}
html.wl-leave #screen-root>.with-appbar{animation:wl-sink .26s ease both;}
html.wl-leave .appbar,html.wl-leave .crumbbar,html.wl-leave .office-banner{animation:wl-bar .3s .06s reverse both;}
/* הלוגו: מופיע במרכז, או (fly) נוסע אליו ממסך הבית ב-JS */
#welcome.bye .wl-mark>*{animation-delay:0s;}
#welcome.bye.fly .wl-mark>*{animation:none;}
#welcome.bye .wl-greet{animation-duration:.3s;animation-delay:.2s;}
#welcome.bye.fly .wl-greet{animation-delay:.4s;}
/* קוביית הכניסה מחכה מוסתרת מתחת למסך הפרידה, ונכנסת בסופו */
html.wl-bye .login-stage>*{opacity:0;}
html.wl-bye .login-cube{scale:.94;}
html.wl-cube-in .login-stage>*{transition:opacity .33s ease, scale .33s ease;}
/* הלוגו של ArcHub בראש המסך שמחוץ למשרד, באותו מרווח כמו לוגו משרד */
.page-head-center .login-mark{margin-bottom:14px;}

/* ================= PAGE HEAD ================= */
.page-head-center{text-align:center;margin:6px 0 30px;}
.page-head-center .tb-title{font-size:var(--fs-display);font-weight:var(--fw-bold);margin:0;letter-spacing:var(--ls-tight);}
.page-head-center .tb-sub{font-size:var(--fs-body);color:var(--text-faint);margin:6px 0 0;}

/* ================= CONTROLS ROW ================= */
.controls-row{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin:6px 0 30px;}
.search-glass{display:flex;align-items:center;gap:9px;padding:10px 15px;border-radius:var(--radius-md);width:280px;max-width:100%;}
.search-glass svg{width:16px;height:16px;color:var(--text-faint);flex-shrink:0;}
.search-glass input{border:none;background:transparent;outline:none;color:var(--text);flex:1;font-size:var(--fs-body);min-width:0;}
.search-glass input::placeholder{color:var(--text-faint);}
.seg-toggle{display:flex;padding:4px;border-radius:var(--radius-md);gap:2px;}
.seg-btn{
  border:none;background:transparent;padding:8px 12px;border-radius:var(--radius-sm);cursor:pointer;color:var(--text-faint);
  display:flex;align-items:center;gap:6px;font-size:var(--fs-small);font-weight:var(--fw-medium);transition:.15s;
}
.seg-btn svg{width:15px;height:15px;}
.seg-btn.active{background:var(--accent);color:var(--on-accent);box-shadow:0 4px 14px var(--accent-soft);}
.group-select-wrap{display:flex;align-items:center;gap:8px;padding:8px 8px 8px 14px;border-radius:var(--radius-md);}
.group-select-wrap label{font-size:var(--fs-small);color:var(--text-faint);font-weight:var(--fw-medium);white-space:nowrap;}
.group-select-wrap select{
  border:none;background:transparent;color:var(--text);font-size:var(--fs-body);font-weight:var(--fw-medium);padding:6px 8px;border-radius:var(--radius-sm);cursor:pointer;outline:none;
}
.group-select-wrap select:hover{background:var(--input-bg);}

/* ================= GROUP SECTIONS ================= */
.group-section{margin:0 auto 36px;max-width:1020px;}
.group-heading{display:flex;align-items:center;gap:10px;margin-bottom:14px;padding:0 2px;max-width:1020px;margin-inline:auto;}
.group-heading h2{font-size:var(--fs-heading);font-weight:var(--fw-bold);margin:0;color:var(--text-soft);white-space:nowrap;}
.group-heading .g-count{font-size:var(--fs-caption);color:var(--text-faint);background:var(--glass-bg);border:1px solid var(--glass-border);padding:2px 9px;border-radius:99px;}
.group-line{flex:1;height:1px;background:var(--glass-border);}

/* ================= CUBE GRID ================= */
/* כלל עיצוב: קוביות ממורכזות מתחת לכותרת שלהן, בכל מסך. השורות נשברות
   וכל שורה מתמרכזת בעצמה, כך שגם שורה אחרונה חלקית יושבת במרכז ולא נצמדת לצד.
   הרוחב קבוע לכל הקוביות; מסך אינו קובע עמודות משלו. */
.cube-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;max-width:1020px;margin-inline:auto;}
.cube-grid>*{flex:0 1 240px;min-width:0;}
.proj-cube{
  border-radius:var(--radius-lg);padding:20px;cursor:pointer;position:relative;overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease;text-align:start;width:100%;font-family:inherit;color:inherit;
  /* כמו ב-.tool-cube: כפתור ממרכז את התוכן אנכית, ולכן קוביות בגבהים שונים
     באותה שורה לא היו מיושרות. התוכן מעוגן לראש, והתגיות מוצמדות לתחתית. */
  display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;
}
.proj-cube:hover{transform:translateY(-5px) scale(1.015);box-shadow:var(--glass-shadow-lg);}
.proj-cube .pc-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:14px;}
.proj-cube .pc-icon{
  width:42px;height:42px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;
  background:var(--accent-soft);color:var(--accent);flex-shrink:0;
}
.proj-cube .pc-icon svg{width:20px;height:20px;}
.proj-cube h3{font-size:var(--fs-heading);margin:0 0 3px;font-weight:var(--fw-bold);line-height:var(--lh-tight);}
.proj-cube .pc-meta{font-size:var(--fs-small);color:var(--text-faint);margin:0;}
.proj-cube .pc-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto;padding-top:14px;}
.tag{font-size:var(--fs-caption);font-weight:var(--fw-medium);padding:4px 9px;border-radius:99px;background:var(--input-bg);color:var(--text-soft);border:1px solid var(--glass-border);}
.tag.stage{color:var(--accent);}
.tag.committee{color:var(--green);}
.dot-status{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
/* צבעי שלב התכנון — המפתחות של STAGE_COLORS */
.dot-status.c-gray{background:var(--text-faint);box-shadow:0 0 0 3px var(--track);}
.dot-status.c-accent{background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);}
.dot-status.c-green{background:var(--green);box-shadow:0 0 0 3px var(--green-soft);}
.dot-status.c-gold{background:var(--gold);box-shadow:0 0 0 3px var(--gold-soft);}
.dot-status.c-red{background:var(--red);box-shadow:0 0 0 3px var(--red-soft);}
.dot-status.c-blue{background:var(--blue);box-shadow:0 0 0 3px var(--blue-soft);}
.dot-status.c-teal{background:var(--teal);box-shadow:0 0 0 3px var(--teal-soft);}
.dot-status.c-orange{background:var(--orange);box-shadow:0 0 0 3px var(--orange-soft);}
.dot-status.c-pink{background:var(--pink);box-shadow:0 0 0 3px var(--pink-soft);}
/* נורת השלב, ולצדה מנעול כשהפרויקט נעול */
.proj-status{display:flex;align-items:center;gap:9px;flex-shrink:0;padding:3px;}
.proj-lock{display:flex;color:var(--gold);}
.proj-lock svg{width:14px;height:14px;stroke:currentColor;}

.proj-cube.dashed{border:1.5px dashed var(--glass-border);box-shadow:none;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:150px;color:var(--text-faint);}
.proj-cube.dashed:hover{border-color:var(--accent);color:var(--accent);}
.proj-cube.dashed .pc-icon{background:var(--input-bg);color:inherit;margin-bottom:10px;}
.proj-cube .pc-count{font-size:var(--fs-caption);color:var(--text-faint);margin-top:10px;display:flex;align-items:center;gap:5px;}

/* ================= LIST VIEW ================= */
.proj-list{border-radius:var(--radius-lg);overflow:hidden;max-width:70%;margin:0 auto;}
@media(max-width:820px){.proj-list{max-width:100%;}}
.proj-row{
  display:flex;align-items:center;gap:14px;padding:14px 18px;cursor:pointer;transition:.15s;
  border-bottom:1px solid var(--glass-border);width:100%;text-align:start;background:transparent;border-inline:none;border-top:none;color:inherit;font-family:inherit;
}
.proj-row:last-child{border-bottom:none;}
.proj-row:hover{background:var(--input-bg);}
.proj-row .pc-icon{width:36px;height:36px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;background:var(--accent-soft);color:var(--accent);flex-shrink:0;}
.proj-row .pc-icon svg{width:17px;height:17px;}
.proj-row .pr-main{flex:1;min-width:0;}
.proj-row h3{font-size:var(--fs-heading);margin:0 0 2px;font-weight:var(--fw-bold);}
.proj-row .pc-meta{font-size:var(--fs-caption);color:var(--text-faint);margin:0;}
.proj-row .pc-tags{margin-top:0;flex-shrink:0;display:flex;gap:6px;}
@media(max-width:640px){.proj-row .pc-tags{display:none;}}

/* ================= TOOL GRID ================= */
.tool-cube{
  border-radius:var(--radius-lg);padding:26px 20px;text-align:center;cursor:pointer;
  transition:transform .22s ease, box-shadow .22s ease;position:relative;width:100%;font-family:inherit;color:inherit;
  /* כפתור ממרכז את התוכן שלו אנכית כברירת מחדל, ואז קוביה עם תיאור קצר
     נראית "נמוכה" מהשכנה שלה. מעגנים את התוכן לראש הקוביה כדי שהאייקון,
     הכותרת והתיאור יישבו על אותם קווים לאורך כל השורה. */
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
}
.tool-cube:hover{transform:translateY(-6px);box-shadow:var(--glass-shadow-lg);}
.tool-cube.disabled{cursor:not-allowed;opacity:.5;}
.tool-cube.disabled:hover{transform:none;box-shadow:var(--glass-shadow);}
.tool-cube .tc-icon{
  width:58px;height:58px;border-radius:var(--radius-md);margin:0 auto 14px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--accent-soft),transparent);color:var(--accent);
}
.tool-cube .tc-icon svg{width:26px;height:26px;}
.tool-cube h3{font-size:var(--fs-heading);margin:0 0 5px;font-weight:var(--fw-bold);}
.tool-cube p{font-size:var(--fs-caption);color:var(--text-faint);margin:0;line-height:var(--lh-normal);}
.tool-cube .tc-soon{
  position:absolute;top:12px;inset-inline-end:12px;font-size:var(--fs-caption);font-weight:var(--fw-medium);color:var(--text-faint);
  background:var(--input-bg);padding:3px 8px;border-radius:99px;
}
.tool-cube.featured{border:1px solid var(--accent);box-shadow:0 10px 32px var(--accent-soft);}
.tool-cube.featured .tc-icon{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:var(--on-accent);}
.tool-cube.gold{border:1px solid var(--gold);box-shadow:0 10px 32px var(--gold-soft);}
.tool-cube.gold .tc-icon{background:linear-gradient(135deg,var(--gold),var(--gold-deep));color:var(--on-gold-grad);}

/* ================= EMPTY / MISC ================= */
.empty-note{text-align:center;padding:50px 20px;color:var(--text-faint);font-size:var(--fs-body);border-radius:var(--radius-lg);}

/* ================= MODAL / OVERLAY ================= */
.ov{position:fixed;inset:0;z-index:750;display:flex;align-items:center;justify-content:center;
  background:var(--scrim);backdrop-filter:blur(3px);padding:20px;
  animation:ov-in var(--dur-enter) var(--ease-enter) both;}
/* סגירה: הרקע דועך והחלון מחליק חזרה למטה. האלמנט מוסר רק אחרי האנימציה —
   ראו closeOverlay(). */
.ov.leaving{animation:ov-out var(--dur-exit) var(--ease-exit) both;pointer-events:none;}
.ov.leaving .modal-g{animation:modal-out var(--dur-exit) var(--ease-exit) both;}
@keyframes ov-in{from{opacity:0}to{opacity:1}}
@keyframes ov-out{from{opacity:1}to{opacity:0}}
.modal-g{width:480px;max-width:100%;max-height:86vh;overflow-y:auto;border-radius:var(--radius-lg);
  background:var(--menu-bg);backdrop-filter:blur(26px) saturate(160%);-webkit-backdrop-filter:blur(26px) saturate(160%);
  border:1px solid var(--glass-border);box-shadow:var(--glass-shadow-lg);
  animation:modal-in var(--dur-enter) var(--ease-enter) both;}
@keyframes modal-in{from{opacity:0;transform:scale(.97) translateY(var(--slide-dist))}to{opacity:1;transform:none}}
@keyframes modal-out{from{opacity:1;transform:none}to{opacity:0;transform:scale(.97) translateY(var(--slide-dist))}}
.modal-g.wide{width:620px;}
.modal-g.xwide{width:820px;}
.modal-g-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--glass-border);
  position:sticky;top:0;background:var(--menu-bg);z-index:2;}
.modal-g-head h3{margin:0;font-size:var(--fs-heading);font-weight:var(--fw-bold);}
.modal-g-close{width:32px;height:32px;border-radius:var(--radius-sm);border:none;background:transparent;color:var(--text-faint);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.modal-g-close:hover{background:var(--input-bg);color:var(--text);}
.modal-g-close svg{width:16px;height:16px;stroke:currentColor;}
.modal-g-body{padding:20px 22px;}
.modal-g-foot{padding:16px 22px;border-top:1px solid var(--glass-border);display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;}
.modal-g-foot.between{justify-content:space-between;}

.btn-g{border:none;border-radius:var(--radius-sm);padding:10px 16px;font-size:var(--fs-body);font-weight:var(--fw-bold);cursor:pointer;transition:.15s;display:inline-flex;align-items:center;gap:7px;font-family:inherit;}
.btn-g svg{width:15px;height:15px;stroke:currentColor;flex-shrink:0;}
.btn-g:disabled{opacity:.55;cursor:default;}
.btn-g-primary{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:var(--on-accent);box-shadow:0 8px 20px var(--accent-soft);}
.btn-g-primary:hover:not(:disabled){filter:brightness(1.06);}
.btn-g-ghost{background:var(--input-bg);color:var(--text-soft);}
.btn-g-ghost:hover:not(:disabled){background:var(--glass-border);color:var(--text);}
.btn-g-danger{background:var(--red-soft);color:var(--red);}
.btn-g-danger:hover:not(:disabled){background:var(--red);color:var(--on-accent);}

/* ================= TABLES / FIELDS ================= */
.g-table{width:100%;border-collapse:collapse;font-size:var(--fs-body);}
.g-table th{text-align:start;padding:8px 6px;font-size:var(--fs-caption);text-transform:uppercase;letter-spacing:var(--ls-wide);color:var(--text-faint);border-bottom:1px solid var(--glass-border);}
.g-table td{padding:10px 6px;border-bottom:1px solid var(--glass-border);}
.g-table tr:last-child td{border-bottom:none;}
.table-scroll{overflow-x:auto;}

.field-g{display:flex;flex-direction:column;gap:5px;font-size:var(--fs-small);}
.field-g label{color:var(--text-faint);font-size:var(--fs-caption);font-weight:var(--fw-medium);}
.field-g input,.field-g select,.field-g textarea{
  border:1px solid var(--glass-border);background:var(--input-bg);border-radius:var(--radius-sm);padding:8px 10px;font-size:var(--fs-body);color:var(--text);outline:none;width:100%;
}
.field-g input:focus,.field-g select:focus,.field-g textarea:focus{border-color:var(--accent);}
.field-g input.invalid,.field-g textarea.invalid,.field-g select.invalid{border-color:var(--red);box-shadow:0 0 0 3px var(--red-soft);}
.field-g .hint{font-size:var(--fs-caption);color:var(--text-faint);line-height:var(--lh-normal);}
.field-g-section{margin-bottom:16px;}
.field-g-section-title{font-size:var(--fs-caption);font-weight:var(--fw-bold);color:var(--accent);margin-bottom:8px;}
.field-g-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
@media(max-width:560px){.field-g-grid{grid-template-columns:1fr;}}
.field-g-section select{width:100%;border:1px solid var(--glass-border);background:var(--input-bg);border-radius:var(--radius-sm);padding:8px 10px;font-size:var(--fs-body);color:var(--text);outline:none;}
.field-g-section select:focus{border-color:var(--accent);}

/* ================= RIGHTS DOC (תב״ע) ================= */
.rights-doc{
  background:var(--menu-bg);border:1px solid var(--glass-border);border-radius:var(--radius-md);padding:22px 24px;margin-bottom:22px;
}
.rights-doc-title{display:flex;align-items:center;gap:9px;font-size:var(--fs-heading);font-weight:var(--fw-bold);margin-bottom:4px;color:var(--text);flex-wrap:wrap;}
.rights-doc-title .tag-tabu{font-size:var(--fs-caption);font-weight:var(--fw-medium);background:var(--gold-soft);color:var(--gold);padding:3px 9px;border-radius:99px;}
.rights-doc-sub{font-size:var(--fs-caption);color:var(--text-faint);margin:0 0 16px;line-height:var(--lh-relaxed);}
.rights-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;margin-bottom:18px;}
.rights-table{width:100%;border-collapse:collapse;font-size:var(--fs-small);margin-bottom:12px;}
.rights-table th,.rights-table td{border:1px solid var(--glass-border);padding:8px 10px;text-align:center;}
.rights-table th{background:var(--input-bg);font-weight:var(--fw-medium);font-size:var(--fs-caption);color:var(--text-soft);text-transform:uppercase;letter-spacing:var(--ls-wide);}
.rights-table td input,.rights-table td select{width:100%;border:none;background:transparent;text-align:center;font-family:var(--font-mono);color:var(--text);outline:none;padding:2px;font-size:var(--fs-small);}
.rights-table td input:focus,.rights-table td select:focus{background:var(--accent-soft);border-radius:var(--radius-xs);}
.rights-table .use-cell{text-align:start;}
/* תקן חניה בשורת הייעוד: בורר שיטה, ותא ערך שתוכנו תלוי בשיטה */
.rights-table .pk-mode{min-width:230px;}
.rights-table .pk-mode select,.rights-table .pk-cell select{font-family:inherit;}
.rights-table .pk-value{min-width:150px;}
.rights-table .pk-cell{display:flex;align-items:center;gap:6px;}
.rights-table .pk-cell input{min-width:56px;}
.rights-table .pk-none{color:var(--text-faint);}
.rights-table.pk-steps{width:auto;min-width:320px;}
.pk-section{padding-top:16px;}
.pk-select{
  border:1px solid var(--glass-border);background:var(--input-bg);border-radius:var(--radius-sm);
  padding:7px 9px;font-size:var(--fs-body);font-family:inherit;color:var(--text);outline:none;
}
.pk-select:focus{border-color:var(--accent);}
/* כפתור אייקון בתא טבלה הוא רכיב flex ברמת בלוק, ולכן אינו מתמרכז מעצמו */
.rights-table td .lr-dot-btn{margin:0 auto;}
.rights-table .use-cell input{text-align:start;font-family:inherit;font-weight:var(--fw-medium);}

/* ================= LIST PANEL ================= */
.list-panel{border-radius:var(--radius-md);overflow:hidden;}
.list-row{display:flex;align-items:center;gap:14px;padding:16px 20px;border-bottom:1px solid var(--glass-border);}
.list-row:last-child{border-bottom:none;}
.lr-icon{width:38px;height:38px;border-radius:var(--radius-sm);background:var(--input-bg);color:var(--accent);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.lr-icon svg{width:18px;height:18px;stroke:currentColor;}
.lr-main{flex:1;min-width:0;}
/* סיכום המנהלים במסך הפרויקט: צבע האייקון מציין את חומרת השורה */
.lr-icon.sev-over{background:var(--red-soft);color:var(--red);}
.lr-icon.sev-warn{background:var(--gold-soft);color:var(--gold);}
.lr-icon.sev-ok{background:var(--green-soft);color:var(--green);}
.lr-icon.sev-info{color:var(--text-faint);}
button.list-row{width:100%;background:transparent;border-inline:none;border-top:none;color:inherit;font-family:inherit;text-align:start;cursor:pointer;transition:.15s;}
button.list-row:hover{background:var(--input-bg);}.lr-title{font-weight:var(--fw-bold);font-size:var(--fs-heading);color:var(--text);word-break:break-word;}
.lr-title input{border:none;background:transparent;font:inherit;color:inherit;width:100%;outline:none;border-bottom:1px dashed transparent;padding:0;}
.lr-title input:focus{border-bottom-color:var(--accent);}
.lr-sub{font-size:var(--fs-small);color:var(--text-faint);margin-top:2px;}
.lr-sub input{border:1px solid var(--glass-border);background:var(--input-bg);border-radius:var(--radius-xs);padding:3px 7px;font-size:var(--fs-caption);color:var(--text);outline:none;font-family:var(--font-mono);}
.lr-meta{font-size:var(--fs-caption);color:var(--text-faint);white-space:nowrap;flex-shrink:0;}
.status-badge{font-size:var(--fs-caption);font-weight:var(--fw-medium);padding:4px 12px;border-radius:99px;white-space:nowrap;flex-shrink:0;border:none;font-family:inherit;}
.status-badge.done,.status-badge.approved{background:var(--green-soft);color:var(--green);}
.status-badge.active,.status-badge.submitted{background:var(--accent-soft);color:var(--accent);}
.status-badge.pending{background:var(--input-bg);color:var(--text-faint);}
.status-badge.in_review{background:var(--gold-soft);color:var(--gold);}
.status-badge.rejected{background:var(--red-soft);color:var(--red);}
.status-badge.clickable{cursor:pointer;}
.lr-dot-btn{width:30px;height:30px;border-radius:var(--radius-sm);border:none;background:transparent;color:var(--text-faint);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:.15s;}
.lr-dot-btn:hover{background:var(--input-bg);color:var(--accent);}
.lr-dot-btn.danger:hover{background:var(--red-soft);color:var(--red);}
.lr-dot-btn svg{width:15px;height:15px;stroke:currentColor;}

/* ================= SWITCH ================= */
.wb-switch{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 2px;font-size:var(--fs-small);color:var(--text-soft);}
.wb-switch-track{width:36px;height:21px;border-radius:99px;background:var(--track);position:relative;cursor:pointer;transition:.2s;flex-shrink:0;border:none;padding:0;}
.wb-switch-track.on{background:var(--accent);}
.wb-switch-track:disabled{opacity:.55;cursor:not-allowed;}
.wb-switch-thumb{position:absolute;top:2px;right:2px;width:17px;height:17px;border-radius:50%;background:var(--on-accent);transition:right .2s;box-shadow:0 1px 3px var(--shadow-soft);}
.wb-switch-track.on .wb-switch-thumb{right:17px;}

/* ================= BREADCRUMB =================
   נתיב המיקום הנוכחי, בסגנון סייר הקבצים. כל מקטע מלבד האחרון הוא כפתור
   שמחזיר לאותו מסך. נגלל אופקית במסכים צרים במקום להישבר לשתי שורות. */
.crumbbar{
  position:fixed;top:calc(var(--banner-h) + var(--appbar-h));left:0;right:0;z-index:590;
  height:var(--crumb-h);display:none;align-items:center;gap:1px;
  padding:0 18px;overflow-x:auto;overflow-y:hidden;white-space:nowrap;
  background:var(--glass-bg);
  backdrop-filter:blur(18px) saturate(150%);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
  border-bottom:1px solid var(--glass-border);
  scrollbar-width:none;
}
.crumbbar::-webkit-scrollbar{height:0;}
:root.has-crumbs .crumbbar{display:flex;}

.crumb{
  background:none;border:none;font-family:inherit;font-size:var(--fs-caption);color:var(--text-faint);
  cursor:pointer;padding:3px 8px;border-radius:var(--radius-xs);transition:.14s;flex-shrink:0;
  display:flex;align-items:center;gap:5px;max-width:34vw;
}
.crumb span{overflow:hidden;text-overflow:ellipsis;}
.crumb svg{width:12px;height:12px;stroke:currentColor;flex-shrink:0;}
.crumb:hover{background:var(--input-bg);color:var(--accent);}
.crumb.current{color:var(--text);font-weight:var(--fw-medium);cursor:default;}
.crumb.current:hover{background:none;color:var(--text);}
.crumb-sep{
  color:var(--text-faint);opacity:.45;flex-shrink:0;display:flex;align-items:center;
}
/* הדף RTL: הנתיב זורם מימין לשמאל, ולכן החץ המפריד מוסב שמאלה */
.crumb-sep svg{width:11px;height:11px;stroke:currentColor;transform:scaleX(-1);}

/* ================= OFFICE CONTEXT BANNER =================
   מוצגת רק כשמנהל אפליקציה נמצא בתוך נתוני משרד שאינו שלו. היא יושבת מעל
   הסרגל העליון ודוחפת את כל העמוד מטה, כדי שלא תוכל להיעלם מהעין בגלילה. */
.office-banner{
  position:fixed;top:0;left:0;right:0;z-index:650;
  display:none;align-items:center;gap:10px;
  height:var(--banner-h);padding:0 18px;font-size:var(--fs-small);font-weight:var(--fw-medium);
  background:linear-gradient(135deg,var(--gold),var(--gold-deep));color:var(--on-gold-grad);
  box-shadow:0 2px 12px var(--shadow-soft);
}
.office-banner.show{display:flex;}
.office-banner svg{width:16px;height:16px;flex-shrink:0;stroke:currentColor;}
/* שורה אחת תמיד — גלישה לשתי שורות הייתה שוברת את חישוב גובה הכותרת */
.office-banner span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.office-banner b{font-weight:var(--fw-bold);}
.office-banner .btn-g{
  background:var(--on-accent-soft);color:var(--on-gold-grad);padding:6px 12px;font-size:var(--fs-small);flex-shrink:0;
}
.office-banner .btn-g:hover{background:var(--on-accent-soft-hover);color:var(--on-gold-grad);}

/* המחלקות יושבות על :root ולא על body בכוונה: --header-h מחושב שם,
   ומשתנה שמוגדר מחדש על צאצא לא משפיע על calc שכבר נפתר בהורה. */
:root.has-office-banner{--banner-h:40px;}
:root.has-crumbs{--crumb-h:30px;}

@media(max-width:640px){
  .office-banner{padding:0 12px;font-size:var(--fs-caption);}
  .office-banner .btn-g{padding:5px 9px;font-size:var(--fs-caption);}
  .crumbbar{padding:0 10px;}
  .crumb{font-size:var(--fs-caption);padding:3px 6px;max-width:44vw;}
  :root{--appbar-h:58px;}
  :root.has-office-banner{--banner-h:46px;}
  :root.has-crumbs{--crumb-h:28px;}
}

/* אווטאר של מנהל אפליקציה נבדל בצבע — כדי שלא יתבלבל עם חשבון משרדי */
.ab-avatar.super{background:linear-gradient(135deg,var(--gold),var(--gold-deep));color:var(--on-gold-grad);}

/* ================= OFFICE CARDS ================= */
/* קוביית משרד: הקובייה היא כפתור הכניסה, וכפתורי הניהול יושבים לידה בתוך
   .cube-wrap (ראו CUBE WITH ACTION BUTTONS). */
.proj-cube.office-off{opacity:.62;}
.proj-cube.office-off:hover{opacity:.8;}
.proj-cube.office-current{border:1px solid var(--accent);box-shadow:0 8px 30px var(--accent-soft);}
.proj-cube.office-current::after{
  content:'המשרד הנוכחי';position:absolute;bottom:10px;inset-inline-start:14px;
  font-size:var(--fs-caption);font-weight:var(--fw-medium);color:var(--accent);
}

/* בורר דרגה בתוך שורת משתמש */
.role-select-inline{
  border:1px solid var(--glass-border);background:var(--input-bg);border-radius:var(--radius-sm);
  padding:7px 9px;font-size:var(--fs-small);color:var(--text);outline:none;font-family:inherit;flex-shrink:0;
}
.role-select-inline:focus{border-color:var(--accent);}

/* ערך קבוע שאינו ניתן לעריכה, בעיצוב של שדה טופס */
.field-static{
  border:1px solid var(--glass-border);background:var(--input-bg);border-radius:var(--radius-sm);
  padding:8px 10px;font-size:var(--fs-body);color:var(--text-soft);font-weight:var(--fw-medium);
}

.box-inline-warn{
  background:var(--gold-soft);color:var(--gold);border-radius:var(--radius-sm);padding:9px 11px;
  font-size:var(--fs-small);line-height:var(--lh-relaxed);
}
.btn-link{
  background:none;border:none;padding:0;font:inherit;color:inherit;
  text-decoration:underline;cursor:pointer;font-weight:var(--fw-medium);
}

/* ================= COLOR SWATCHES ================= */
.color-swatch-grid{display:flex;flex-wrap:wrap;gap:8px;}
.color-swatch{
  width:28px;height:28px;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0;
  display:flex;align-items:center;justify-content:center;color:var(--text-faint);transition:.15s;
}
.color-swatch svg{width:12px;height:12px;stroke:currentColor;}
.color-swatch.none{background:var(--input-bg);border-color:var(--glass-border);}
.color-swatch.selected{border-color:var(--text);transform:scale(1.12);}
.color-swatch:hover:not(:disabled){transform:scale(1.1);}
.color-swatch:disabled{cursor:not-allowed;opacity:.6;}

/* ================= BUSY INDICATOR =================
   נדלק כל עוד יש קריאה פתוחה לשרת (api.js מוסיף את המחלקה על <html>).
   פס דק בראש העמוד — נראה מיד, ואינו חוסם את הממשק. */
html.api-busy::after{
  content:'';position:fixed;top:0;left:0;right:0;height:2px;z-index:1000;
  background:linear-gradient(90deg,transparent,var(--accent),transparent);
  background-size:40% 100%;background-repeat:no-repeat;
  animation:busy-slide 1s linear infinite;
}
@keyframes busy-slide{from{background-position:120% 0}to{background-position:-40% 0}}

/* ================= TOASTS ================= */
#toast-stack{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);z-index:900;display:flex;flex-direction:column-reverse;gap:8px;max-width:calc(100vw - 32px);}
.toast-g{
  min-width:260px;max-width:420px;border-radius:var(--radius-md);padding:12px 16px;display:flex;align-items:center;gap:10px;
  font-size:var(--fs-body);color:var(--text);
  /* נכנסת בהחלקה למעלה תוך הופעה הדרגתית, ויוצאת בהחלקה למטה תוך דעיכה */
  animation:toast-in var(--dur-enter) var(--ease-enter) both;
}
.toast-g.leaving{animation:toast-out var(--dur-exit) var(--ease-exit) both;pointer-events:none;}
@keyframes toast-in{from{opacity:0;transform:translateY(var(--slide-dist))}to{opacity:1;transform:none}}
@keyframes toast-out{from{opacity:1;transform:none}to{opacity:0;transform:translateY(var(--slide-dist))}}
.toast-g svg{width:16px;height:16px;flex-shrink:0;}
.toast-g.success{color:var(--green);}
.toast-g.error{color:var(--red);}
.toast-g span{flex:1;min-width:0;word-break:break-word;}
.toast-g .t-close{margin-inline-start:auto;background:none;border:none;color:inherit;opacity:.6;cursor:pointer;padding:0;flex-shrink:0;}

::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-thumb{background:var(--glass-border);border-radius:99px;}
::-webkit-scrollbar-track{background:transparent;}

/* ================= SMALL SCREENS ================= */
@media(max-width:640px){
  .wrap{padding:26px 16px 60px;}
  .cube-grid>*{flex:1 1 150px;max-width:240px;}
  /* כל אחד מהצדדים מוצמד לקצה שלו בלבד — קביעת left וגם right על אלמנט
     ממוקם מוחלט הייתה מותחת אותו לרוחב כל הסרגל ומכסה את הכותרת. */
  .ab-left{left:8px;}
  .ab-right{right:8px;gap:2px;}
  .ab-center{max-width:44vw;}
  .ab-home,.ab-avatar,#theme-toggle{width:36px;height:36px;}
  .ab-navtrigger{padding:9px 6px;}
  .modal-g-foot{justify-content:stretch;}
  .modal-g-foot .btn-g{flex:1;justify-content:center;}
}
.status-badge.role-super{background:var(--gold-soft);color:var(--gold);}

/* ================= OFFICE LOGO ================= */
/* הלוגו יושב תמיד על לוחית בהירה: רוב הלוגואים כהים על רקע שקוף, ובמצב לילה
   הם היו נבלעים ברקע הכהה. */
.office-logo{
  display:block;max-width:220px;max-height:72px;object-fit:contain;margin:0 auto 14px;
  background:var(--logo-plate);padding:8px 14px;border-radius:var(--radius-sm);box-shadow:var(--glass-shadow);
}
.proj-cube .pc-icon.has-logo{background:var(--logo-plate);padding:3px;overflow:hidden;}
.proj-cube .pc-icon.has-logo img{width:100%;height:100%;object-fit:contain;}
.logo-preview{
  display:flex;align-items:center;justify-content:center;min-height:120px;
  border:1px dashed var(--glass-border);border-radius:var(--radius-md);background:var(--input-bg);
  color:var(--text-faint);font-size:var(--fs-small);
}
.logo-preview .office-logo{margin:16px auto;}

/* ================= FILTER DROPDOWN (checkboxes) ================= */
/* סינון מרובה: נראה כמו בורר רגיל בשורת הבקרה, ונפתח לרשימת תיבות סימון */
.filter-dd{position:relative;}
/* הרשימה הפתוחה חייבת לעלות מעל לוח המשתמשים שמתחתיה, שיוצר שכבה משלו */
.filter-dd.open{z-index:50;}
.filter-dd-label{font-size:var(--fs-small);color:var(--text-faint);font-weight:var(--fw-medium);white-space:nowrap;}
.filter-dd-btn{
  display:flex;align-items:center;gap:6px;border:none;background:transparent;color:var(--text);cursor:pointer;
  font-size:var(--fs-body);font-weight:var(--fw-medium);padding:6px 8px;border-radius:var(--radius-sm);white-space:nowrap;
}
.filter-dd-btn:hover,.filter-dd.open .filter-dd-btn{background:var(--input-bg);}
.filter-dd-btn.active{color:var(--accent);}
.filter-dd-btn svg{width:13px;height:13px;stroke:currentColor;flex-shrink:0;}
.filter-dd-panel{
  position:absolute;top:calc(100% + 6px);inset-inline-start:0;z-index:50;min-width:220px;max-height:320px;overflow-y:auto;
  padding:6px;border-radius:var(--radius-sm);background:var(--select-bg);border:1px solid var(--glass-border);
  box-shadow:var(--glass-shadow-lg);
}
.filter-dd-opt{
  display:flex;align-items:center;gap:9px;padding:8px 9px;border-radius:var(--radius-xs);cursor:pointer;
  font-size:var(--fs-body);color:var(--text-soft);white-space:nowrap;
}
.filter-dd-opt:hover{background:var(--input-bg);color:var(--text);}
.filter-dd-opt input{width:15px;height:15px;accent-color:var(--accent);flex-shrink:0;cursor:pointer;}
.filter-dd-clear{
  width:100%;margin-top:4px;padding:8px 9px;border:none;border-top:1px solid var(--glass-border);background:transparent;
  color:var(--accent);font-size:var(--fs-small);font-weight:var(--fw-medium);cursor:pointer;text-align:start;
}
.filter-dd-clear:disabled{color:var(--text-faint);cursor:default;}

/* ================= TASKS ================= */
/* יומן המשימות: שורת היצירה המהירה, שורת משימה וכרטיס המשימה */
.task-quick{display:flex;align-items:center;gap:8px;flex-wrap:wrap;max-width:860px;margin:0 auto 14px;padding:10px;border-radius:var(--radius-md);}
.task-quick .field-g{flex:0 0 auto;}
.task-quick .tq-title{flex:1 1 220px;min-width:0;}
.task-controls{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;max-width:860px;margin:0 auto 6px;}
.task-check{
  width:26px;height:26px;border-radius:50%;border:2px solid var(--text-faint);background:transparent;color:transparent;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;cursor:pointer;transition:.15s;padding:0;
}
.task-check svg{width:13px;height:13px;stroke:currentColor;stroke-width:3;}
.task-check:hover:not(:disabled){border-color:var(--green);color:var(--green);}
.task-check.on{background:var(--green);border-color:var(--green);color:var(--on-accent);}
.task-check:disabled{cursor:default;opacity:.55;}
.task-open{flex:1;min-width:0;display:block;border:none;background:transparent;color:inherit;font-family:inherit;text-align:start;cursor:pointer;padding:0;}
.task-open > span{display:block;}
.task-open:hover .lr-title{color:var(--accent);}
/* היומן מחולק תמיד למשימות ידניות ולמשימות מערכת; בתוך כל חלק, כותרת משנה לכל קבוצה */
.task-subhead{max-width:860px;margin:14px auto 8px;font-size:var(--fs-caption);font-weight:var(--fw-bold);color:var(--accent);display:flex;align-items:center;gap:8px;}
.task-level-hint{max-width:860px;margin:0 auto 4px;font-size:var(--fs-small);color:var(--text-faint);line-height:var(--lh-normal);}
.list-row.task-part{font-size:var(--fs-caption);font-weight:var(--fw-bold);color:var(--accent);padding-top:10px;padding-bottom:6px;}
.task-row span.task-check{cursor:default;color:var(--text-faint);}
.task-row.closed .lr-title{color:var(--text-faint);text-decoration:line-through;font-weight:var(--fw-medium);}
.tag.prio-high{color:var(--orange);}
.tag.prio-urgent{color:var(--red);}

.tk-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px 10px;}
.tk-fields .tk-full{grid-column:1 / -1;}
@media(max-width:560px){.tk-fields{grid-template-columns:1fr;}}
.tk-meta{font-size:var(--fs-caption);color:var(--text-faint);margin:14px 0 0;line-height:var(--lh-normal);}
.tk-section{margin-top:16px;padding-top:14px;border-top:1px solid var(--glass-border);}
.tk-row{display:flex;align-items:center;gap:8px;padding:4px 0;font-size:var(--fs-body);color:var(--text);}
.tk-row > svg{width:15px;height:15px;stroke:currentColor;color:var(--text-faint);flex-shrink:0;}
.tk-row input[type=checkbox]{width:15px;height:15px;accent-color:var(--accent);flex-shrink:0;cursor:pointer;}
.tk-grow{flex:1;min-width:0;word-break:break-word;}
.tk-row.done .tk-grow{color:var(--text-faint);text-decoration:line-through;}
.tk-faint,.tk-empty{font-size:var(--fs-caption);color:var(--text-faint);}
.tk-add{display:flex;align-items:flex-start;gap:8px;margin-top:8px;}
.tk-add .field-g{flex:1;min-width:0;}
.tk-comment{padding:8px 0;border-bottom:1px solid var(--glass-border);}
.tk-comment:last-of-type{border-bottom:none;}
.tk-comment-head{display:flex;align-items:center;gap:8px;font-size:var(--fs-caption);color:var(--text-faint);}
.tk-comment-head b{color:var(--text-soft);}
.tk-comment-body{font-size:var(--fs-body);color:var(--text);white-space:pre-wrap;word-break:break-word;margin-top:3px;line-height:var(--lh-normal);}

/* ================= SUPERVISION ================= */
/* פיקוח עליון: רשימת המשתתפים בחלון הביקור, ופרטי הביקור במסך שלו */
.sv-people{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:2px 12px;padding:6px 10px;border:1px solid var(--glass-border);border-radius:var(--radius-sm);background:var(--input-bg);}
.sv-facts{display:flex;flex-direction:column;gap:8px;font-size:var(--fs-body);color:var(--text);}
.sv-facts > div > span:first-child{display:block;font-size:var(--fs-caption);font-weight:var(--fw-medium);color:var(--text-faint);}
.sv-notes{white-space:pre-wrap;line-height:var(--lh-normal);}
.sv-track td{vertical-align:middle;}
/* מסך הביקור: נבנה קודם לטלפון. כפתורי הבדיקה והמצלמה גדולים, למגע ביד אחת */
.sv-no{width:auto;min-width:46px;padding:0 6px;font-family:var(--font-mono);font-size:var(--fs-caption);font-weight:var(--fw-bold);white-space:nowrap;}
.sv-finding-row .lr-main{display:block;}
.sv-thumbs{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap;}
.sv-thumbs img{width:56px;height:42px;object-fit:cover;border-radius:var(--radius-xs);border:1px solid var(--glass-border);}
.sv-thumbs.big{margin:0 0 14px;}
.sv-thumbs.big img{width:96px;height:72px;}
.sv-review-row{flex-wrap:wrap;gap:10px;}
.sv-review-main{flex:1 1 260px;min-width:0;display:flex;align-items:center;gap:14px;border:none;background:transparent;color:inherit;font-family:inherit;text-align:start;cursor:pointer;padding:0;}
.sv-review-main .lr-main > span{display:block;}
.sv-res-group{display:flex;gap:6px;flex:0 0 auto;}
.sv-res{
  display:flex;align-items:center;justify-content:center;gap:5px;min-height:42px;min-width:42px;padding:0 12px;border-radius:var(--radius-sm);
  border:1px solid var(--glass-border);background:var(--input-bg);color:var(--text-soft);font-family:inherit;font-size:var(--fs-body);font-weight:var(--fw-medium);cursor:pointer;white-space:nowrap;
}
.sv-res svg{width:15px;height:15px;stroke:currentColor;flex-shrink:0;}
.sv-res:disabled{cursor:default;opacity:.6;}
.sv-res.fixed.active{background:var(--green-soft);color:var(--green);border-color:var(--green);}
.sv-res.not_fixed.active{background:var(--red-soft);color:var(--red);border-color:var(--red);}
.sv-res.skip.active{background:var(--glass-border);color:var(--text);}
@media(max-width:640px){.sv-res-group{flex-basis:100%;}.sv-res-group .sv-res{flex:1;padding:0 6px;}}
.sv-capture-bar{position:sticky;bottom:0;display:flex;gap:8px;padding:14px 0 18px;margin-top:20px;z-index:5;}
.sv-capture{flex:1;justify-content:center;min-height:52px;font-size:var(--fs-heading);}
.sv-capture svg{width:20px;height:20px;}
/* "הורדה" בסרגל התחתון: בטלפון אייקון בלבד, כדי שהסרגל יישאר בשורה אחת */
@media (max-width:600px){ .sv-dl span{display:none;} }
.sv-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px;}
.sv-print-actions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:10px;}
.sv-chip{
  min-height:36px;padding:0 13px;border-radius:99px;border:1px solid var(--glass-border);background:var(--input-bg);color:var(--text-soft);
  font-family:inherit;font-size:var(--fs-body);cursor:pointer;
}
.sv-chip.active{background:var(--accent);border-color:var(--accent);color:var(--on-accent);}
.sv-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-bottom:14px;}
.sv-photo-card{margin:0;}
.sv-photo-card img{display:block;width:100%;aspect-ratio:4 / 3;object-fit:cover;border-radius:var(--radius-sm);border:1px solid var(--glass-border);}
.sv-photo-card figcaption{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:var(--fs-caption);color:var(--text-faint);}
.sv-photo-card figcaption input[type=text]{flex:1;min-width:0;border:1px solid var(--glass-border);background:var(--input-bg);border-radius:var(--radius-xs);padding:4px 7px;font-size:var(--fs-caption);color:var(--text);font-family:inherit;}
.sv-photo-card figcaption .tk-row{padding:0;font-size:var(--fs-caption);}
/* חלון ההפצה: בטלפון "סימון כהופץ בלי שליחה" בשורה משלו, מעל ביטול ושיתוף */
@media (max-width:600px){
  .sv-dist-foot{flex-direction:column;align-items:stretch;}
  .sv-dist-foot #svd-mark{justify-content:center;}
  .sv-dist-foot > div{justify-content:flex-end;}
}

/* עבודה בלי קליטה: הרצועה במסך הביקור (supervision-offline.js) */
.sv-sync{max-width:860px;margin:0 auto 20px;flex-wrap:wrap;}
.sv-sync-text{flex:1;min-width:200px;}
/* תמונה שאינה זמינה (בלי קליטה, מביקור קודם) אינה מוצגת כסמל שבור */
.sv-thumbs img.missing,.sv-photo-card img.missing{visibility:hidden;}
.sv-thumbs img.missing{display:none;}

/* תמונה שצולמה לממצא חדש, עם כפתור "סימון" עליה */
.sv-mk-thumb{position:relative;}
.sv-mk-thumb img{display:block;}
.sv-mk-btn{position:absolute;inset-inline-start:4px;bottom:4px;display:inline-flex;align-items:center;gap:3px;padding:2px 6px;
  border:1px solid var(--glass-border);border-radius:var(--radius-xs);background:var(--menu-bg);color:var(--text);
  font:inherit;font-size:var(--fs-caption);font-weight:var(--fw-medium);cursor:pointer;}
.sv-mk-btn svg{width:11px;height:11px;stroke:currentColor;}

/* עורך הסימון על תמונה (photo-markup.js) */
.mk-bar{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin-bottom:8px;}
.mk-group{display:flex;gap:4px;align-items:center;}
.mk-tool{display:inline-flex;align-items:center;gap:5px;height:34px;padding:0 10px;border:1px solid var(--glass-border);background:var(--input-bg);
  color:var(--text-soft);border-radius:var(--radius-sm);font:inherit;font-size:var(--fs-small);font-weight:var(--fw-medium);cursor:pointer;}
.mk-tool svg{width:15px;height:15px;stroke:currentColor;flex-shrink:0;}
.mk-tool.active{background:var(--accent-soft);color:var(--accent);border-color:var(--accent);}
.mk-tool:disabled{opacity:.45;cursor:default;}
.mk-sw{width:28px;height:28px;border-radius:50%;border:2px solid var(--glass-border);padding:0;cursor:pointer;}
.mk-sw.red{background:var(--mark-red);}
.mk-sw.yellow{background:var(--mark-yellow);}
.mk-sw.white{background:var(--mark-white);}
.mk-sw.active{outline:2px solid var(--accent);outline-offset:2px;}
.mk-hint{margin:0 0 8px;font-size:var(--fs-small);color:var(--text-faint);}
.mk-stage{display:flex;justify-content:center;align-items:center;min-height:220px;background:var(--input-bg);border-radius:var(--radius-sm);overflow:hidden;}
.mk-stage canvas{display:block;touch-action:none;cursor:crosshair;}
.mk-loading{color:var(--text-faint);font-size:var(--fs-small);}
.mk-textbar{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;}
.mk-textbar[hidden]{display:none;}
.mk-textbar input{flex:1;min-width:140px;border:1px solid var(--glass-border);background:var(--input-bg);border-radius:var(--radius-sm);
  padding:9px 12px;font:inherit;font-size:var(--fs-body);color:var(--text);}
@media (max-width:600px){
  .mk-modal .modal-g-body{padding:12px;}
  .mk-tool{padding:0 8px;}
  .mk-tool span{display:none;}
}

/* ================= NOTIFICATIONS ================= */
/* הפעמון שבסרגל העליון. הרשימה שלו היא .ab-menu, עם אותה אנימציה כמו תפריט הניווט */
.ab-bell{position:relative;}
.ab-badge{
  position:absolute;top:4px;inset-inline-end:2px;min-width:17px;height:17px;padding:0 4px;border-radius:99px;
  background:var(--red);color:var(--on-accent);font-size:var(--fs-caption);font-weight:var(--fw-bold);
  display:flex;align-items:center;justify-content:center;line-height:var(--lh-tight);
}
#ab-notif{width:340px;max-width:calc(100vw - 40px);}
.ab-menu .notif-item{align-items:flex-start;}
.ab-menu .notif-item > span:first-child{display:flex;padding-top:2px;}
.notif-text{display:flex;flex-direction:column;gap:2px;min-width:0;line-height:var(--lh-normal);}
.notif-sub{font-size:var(--fs-caption);color:var(--text-faint);}
.ab-menu .notif-item.unread{color:var(--text);font-weight:var(--fw-medium);}
.ab-menu .notif-item.unread .notif-sub{font-weight:var(--fw-regular);}
.notif-empty{padding:14px 10px;font-size:var(--fs-small);color:var(--text-faint);text-align:center;}

/* ================= ICON PICKER ================= */
/* בורר אייקון בטופס: רשת אפשרויות, כל אחת עם האייקון עצמו ושמו */
.icon-pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:6px;}
.icon-pick-opt{
  display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:var(--radius-sm);cursor:pointer;
  border:1px solid var(--glass-border);background:var(--input-bg);color:var(--text-soft);
  font-size:var(--fs-small);text-align:start;transition:.15s;
}
.icon-pick-opt svg{width:17px;height:17px;stroke:currentColor;flex-shrink:0;}
.icon-pick-opt:hover{border-color:var(--accent);color:var(--text);}
.icon-pick-opt.active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent);font-weight:var(--fw-medium);}

/* ================= CUBE WITH ACTION BUTTONS ================= */
.cube-wrap{position:relative;display:flex;}
/* כפתורי הפעולה שליד הקובייה: מופיעים בריחוף ובפוקוס מקלדת */
.cube-wrap > .pc-actions{position:absolute;top:12px;inset-inline-end:12px;z-index:1;display:flex;gap:4px;opacity:0;transition:.15s;}
.cube-wrap:hover > .pc-actions,.cube-wrap:focus-within > .pc-actions{opacity:1;}
/* כשבפינת הקובייה יש נורת חיווי, הכפתורים זזים הצידה ולא מכסים אותה */
.cube-wrap:has(.dot-status) > .pc-actions{inset-inline-end:38px;}

/* ================= OFFICE SETTINGS ================= */
.settings-panel{border-radius:var(--radius-md);padding:22px 24px;}
.settings-hint{font-size:var(--fs-small);color:var(--text-faint);line-height:var(--lh-relaxed);margin:0 0 12px;}
.stage-row{display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding:7px 0;border-bottom:1px solid var(--glass-border);}
/* סימוני השלב (נועל, ביצוע, סיום) בשורה משלהם, מתחת לשם ולצבע */
.stage-flags{flex-basis:100%;display:flex;flex-wrap:wrap;gap:4px 14px;padding-inline-start:66px;}
.stage-row input[type="text"]{
  flex:1;min-width:0;border:1px solid var(--glass-border);background:var(--input-bg);border-radius:var(--radius-sm);
  padding:8px 10px;font-size:var(--fs-body);color:var(--text);outline:none;
}
.stage-row input[type="text"]:focus{border-color:var(--accent);}
.stage-colors{display:flex;align-items:center;gap:2px;flex-shrink:0;}
.stage-color{
  width:24px;height:24px;border-radius:50%;border:1px solid transparent;background:transparent;cursor:pointer;
  display:flex;align-items:center;justify-content:center;padding:0;transition:.15s;
}
.stage-color:hover{background:var(--input-bg);}
.stage-color.active{border-color:var(--text-soft);background:var(--input-bg);}
.stage-lock{display:flex;align-items:center;gap:6px;font-size:var(--fs-small);color:var(--text-soft);white-space:nowrap;cursor:pointer;padding:0 6px;}
.stage-lock input{width:15px;height:15px;accent-color:var(--accent);cursor:pointer;}
.stage-lock input:disabled{cursor:default;}
/* חלון המעבר לשלב סיום: כל פריט פתוח בשורה, עם בורר הסגירה שלו */
.cp-group{margin-top:16px;}
.cp-row{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid var(--glass-border);}
.cp-row:last-child{border-bottom:none;}
.cp-main{flex:1;min-width:0;}
.cp-title{font-size:var(--fs-body);font-weight:var(--fw-medium);color:var(--text);word-break:break-word;}
.cp-sub{font-size:var(--fs-caption);color:var(--text-faint);margin-top:2px;}
.cp-row .field-g{flex:0 0 150px;}
.lr-dot-btn:disabled{opacity:.3;cursor:default;}
.flip-v{transform:rotate(180deg);}

/* ================= PLOTS IN THE RIGHTS EDITOR ================= */
/* לוחות הזכויות יושבים זה מתחת לזה: פרטי התכנית, ואחריהם לוח לכל מגרש */
.rights-doc + .rights-doc{margin-top:14px;}
.plot-head{display:flex;align-items:center;gap:8px;margin-bottom:16px;}
.plot-name{
  flex:1;min-width:0;max-width:340px;border:1px solid var(--glass-border);background:var(--input-bg);border-radius:var(--radius-sm);
  padding:8px 10px;font-size:var(--fs-heading);font-weight:var(--fw-bold);color:var(--text);outline:none;
}
.plot-name:focus{border-color:var(--accent);}
.plot-add{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:14px 0 20px;font-size:var(--fs-small);color:var(--text-faint);}

/* ================= TRANSFER RULES ================= */
.rule-check{display:flex;align-items:center;gap:8px;font-size:var(--fs-body);color:var(--text);cursor:pointer;}
.rule-check input{width:15px;height:15px;accent-color:var(--accent);flex-shrink:0;cursor:pointer;}
.rule-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:12px 0;border-bottom:1px solid var(--glass-border);}
.rule-row .rule-check{min-width:180px;font-weight:var(--fw-medium);}
.rule-pct{display:flex;align-items:center;gap:8px;font-size:var(--fs-small);color:var(--text-soft);}
.rule-pct input{
  width:76px;border:1px solid var(--glass-border);background:var(--input-bg);border-radius:var(--radius-sm);
  padding:7px 9px;font-size:var(--fs-body);font-family:var(--font-mono);color:var(--text);outline:none;text-align:center;
}
.rule-pct input:focus{border-color:var(--accent);}
.rule-pct input:disabled{opacity:.4;}
.rule-hint{flex:1;min-width:220px;font-size:var(--fs-caption);color:var(--text-faint);line-height:var(--lh-normal);}

/* ================= DEPARTMENTS ================= */
/* "ניהול מחלקות": רשימת המחלקות מצד אחד ולוח המחלקה שנבחרה מצד שני.
   במסך צר הלוח יורד מתחת לרשימה. */
.dept-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:18px;max-width:1020px;margin-inline:auto;align-items:start;}
@media(max-width:820px){.dept-layout{grid-template-columns:minmax(0,1fr);}}
.dept-list-btn{
  display:flex;align-items:center;gap:10px;width:100%;padding:14px 16px;border:none;background:transparent;
  color:var(--text-soft);font-family:inherit;font-size:var(--fs-body);text-align:start;cursor:pointer;
  border-bottom:1px solid var(--glass-border);transition:.15s;
}
.dept-list-btn:last-child{border-bottom:none;}
.dept-list-btn:hover{background:var(--input-bg);color:var(--text);}
.dept-list-btn.active{background:var(--accent-soft);color:var(--text);font-weight:var(--fw-medium);}
.dept-list-btn .dl-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.dept-list-btn .dl-warn{display:flex;color:var(--gold);}
.dept-list-btn .dl-warn svg{width:15px;height:15px;stroke:currentColor;}
.dept-list-btn .g-count{font-size:var(--fs-caption);color:var(--text-faint);}
.dept-panel .rc-summary{margin:14px 0 0;}
.dept-section-head{display:flex;align-items:center;gap:8px;margin-top:24px;padding-bottom:6px;border-bottom:1px solid var(--glass-border);min-height:38px;}
.dept-section-head:first-child{margin-top:0;}
.dept-section-head .field-g-section-title{margin:0;}
.dept-section-head .g-count{font-size:var(--fs-caption);color:var(--text-faint);}
.dept-spacer{flex:1;}
.dept-details{padding-top:12px;}
.dept-details .settings-hint{margin:10px 0 0;}
.dept-section-head + .settings-hint{margin:10px 0 0;}
/* שורות בתוך לוח או חלון: בלי הריפוד הרחב של רשימה שעומדת בפני עצמה */
.dept-rows .list-row{padding:11px 0;gap:12px;}
.dept-rows > .settings-hint{margin:12px 0 0;}
.dept-mgr-switch{display:flex;align-items:center;gap:8px;font-size:var(--fs-small);color:var(--text-faint);white-space:nowrap;cursor:pointer;}
.dept-tag{display:inline-flex;align-items:center;gap:7px;}
.dept-tag .dot-status{box-shadow:none;}
.dept-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;}

/* ================= BASE TEMPLATES ================= */
/* כרטיס תבנית אינו כפתור: יש בו כפתורי "הורדה" ו"ניהול" משלו */
.tpl-card{border-radius:var(--radius-lg);padding:14px;display:flex;flex-direction:column;gap:9px;text-align:start;}
.tpl-card.removed{opacity:.6;}
.tpl-thumb{
  aspect-ratio:4 / 3;border-radius:var(--radius-sm);overflow:hidden;background:var(--input-bg);color:var(--text-faint);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
}
.tpl-thumb img{width:100%;height:100%;object-fit:cover;object-position:top;display:block;}
.tpl-thumb svg{width:34px;height:34px;stroke:currentColor;}
.tpl-thumb span{font-size:var(--fs-caption);font-weight:var(--fw-medium);letter-spacing:var(--ls-wide);}
.tpl-thumb.f-word{background:var(--blue-soft);color:var(--blue);}
.tpl-thumb.f-ppt{background:var(--orange-soft);color:var(--orange);}
.tpl-thumb.f-excel{background:var(--green-soft);color:var(--green);}
.tpl-thumb.f-pdf{background:var(--red-soft);color:var(--red);}
.tpl-card h3{font-size:var(--fs-heading);font-weight:var(--fw-bold);margin:2px 0 0;line-height:var(--lh-tight);overflow-wrap:anywhere;}
.tpl-meta{font-size:var(--fs-small);color:var(--text-faint);margin:0;}
.tpl-notes{font-size:var(--fs-small);color:var(--text-soft);margin:0;line-height:var(--lh-normal);}
.tpl-tags{display:flex;flex-wrap:wrap;gap:6px;}
.tag.fresh{background:var(--green-soft);color:var(--green);border-color:transparent;}
.tag.warn{background:var(--gold-soft);color:var(--gold);border-color:transparent;}
.tag.bad{background:var(--red-soft);color:var(--red);border-color:transparent;}
/* תגי מצב על קוביית תמהיל: זכויות וחניה */
.proj-cube .pc-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px;}
.tpl-foot{display:flex;gap:8px;margin-top:auto;padding-top:4px;}
.tpl-foot .btn-g{flex:1;justify-content:center;}
.tpl-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}
.tpl-actions.flush{margin-top:0;}
.tpl-sec{margin-top:26px;padding-bottom:6px;border-bottom:1px solid var(--glass-border);}
.tpl-return{color:var(--red);}
.lr-title .status-badge{margin-inline-start:6px;}

/* ================= SHEET DESIGN EDITOR ================= */
/* עורך "עיצוב גיליון התמהיל": ההגדרות מצד אחד, תצוגה לדוגמה מצד שני */
.sd-layout{display:grid;grid-template-columns:340px minmax(0,1fr);gap:18px;max-width:1020px;margin-inline:auto;align-items:start;}
@media(max-width:860px){.sd-layout{grid-template-columns:minmax(0,1fr);}}
.sd-field{margin-top:14px;}
.sd-swatches{display:flex;flex-wrap:wrap;gap:6px;}
.sd-swatch{
  width:32px;height:32px;border-radius:50%;border:1px solid transparent;background:transparent;cursor:pointer;padding:0;
  display:flex;align-items:center;justify-content:center;transition:.15s;
}
.sd-swatch span{width:20px;height:20px;border-radius:50%;border:1px solid var(--glass-border);}
.sd-swatch:hover{background:var(--input-bg);}
.sd-swatch.active{border-color:var(--text-soft);background:var(--input-bg);}
.sd-chip{width:16px;height:16px;border-radius:50%;border:1px solid var(--glass-border);}
.sd-after{margin:12px 0 0;}
.sd-preview-bar{justify-content:flex-start;margin:0 0 12px;}
/* הגיליון לדוגמה הוא SVG שמצייר את הרקע הלבן שלו בעצמו */
.sd-sheet{border:1px solid var(--glass-border);border-radius:var(--radius-xs);overflow:hidden;box-shadow:var(--glass-shadow);}
.sd-sheet svg{display:block;width:100%;height:100%;}
.sd-data{margin-top:14px;border:1px solid var(--glass-border);}
/* הדוח לדוגמה בעורך עיצוב דוח הפיקוח: דף לבן, כמו בהדפסה */
.sd-report{border:1px solid var(--glass-border);border-radius:var(--radius-xs);overflow:hidden;box-shadow:var(--glass-shadow);}
/* בטלפון התצוגה של הדוח אינה דף A4: שוליים צרים, והתאריך ופרטי המשרד יורדים מתחת לכותרת.
   ההדפסה וקובץ ה-Word אינם עוברים כאן ונשארים בפריסת הדף. */
@media (max-width:600px){
  .sd-report .sr-doc{padding:6mm 5mm 8mm;}
  .sd-report .sr-h-band .sr-head{margin:-6mm -5mm 0;}
  .sd-report .sr-head{flex-wrap:wrap;gap:3mm;}
  .sd-report .sr-title{flex-basis:60%;}
  .sd-report .sr-date{white-space:normal;text-align:start;flex-basis:100%;}
  .sd-report .sr-meta th{width:22mm;}
  .sd-report .sr-doc .sr-photos{grid-template-columns:repeat(2,1fr);}
  .sd-report .sr-doc.sr-p-l .sr-photos{grid-template-columns:1fr;}
}
.sd-preview > .settings-hint{margin:10px 0 0;}
.sd-versions{max-width:1020px;margin-inline:auto;}

/* ================= SIGNATURE GENERATOR ================= */
/* הדף שעליו מוצגת החתימה: לבן בשתי הערכות, כמו המסמך שהיא נכנסת אליו */
.sg-paper{background:var(--logo-plate);border:1px solid var(--glass-border);border-radius:var(--radius-xs);padding:22px;overflow-x:auto;box-shadow:var(--glass-shadow);}
.sg-table{border-collapse:collapse;table-layout:fixed;margin:0 auto;line-height:var(--lh-tight);}
.sg-table td{overflow:hidden;}
.sg-table.editing td{cursor:pointer;outline:1px dashed var(--track);outline-offset:-1px;}
.sg-table.editing td:hover{outline-color:var(--accent);}
.sg-table.editing td.sel{outline:2px solid var(--accent);outline-offset:-2px;}
.sg-table.editing tr.sg-row-off td{opacity:.45;}
.sg-strip{max-width:1020px;margin:0 auto 18px;}
.sg-toggles{display:flex;flex-direction:column;gap:8px;margin-top:14px;}
.sg-toggle{padding:0;white-space:normal;}
.sg-howto{margin-top:16px;}
.sg-howto .settings-hint{margin:0 0 6px;}
/* העורך: הקנבס מצד אחד, מאפייני התא שנבחר מצד שני */
.sg-ed{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:18px;max-width:1180px;margin-inline:auto;align-items:start;}
@media(max-width:1000px){.sg-ed{grid-template-columns:minmax(0,1fr);}}
.sg-ed-main > .settings-hint{margin:10px 0 0;}
.sg-struct{margin-bottom:12px;}
.sg-struct .btn-g,.sg-ed-side .tpl-actions .btn-g{padding:7px 11px;font-size:var(--fs-small);}
.sg-canvas-wrap{min-height:150px;}
.sg-nums{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap;}
.sg-num{flex:1;min-width:96px;}
.sg-ed-side > .sg-toggle{margin-top:12px;}
.sg-seg{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:8px 0;border-bottom:1px solid var(--glass-border);}
.sg-seg input[type="text"],.sg-seg input[type="number"],.sg-seg select{
  border:1px solid var(--glass-border);background:var(--input-bg);border-radius:var(--radius-xs);padding:6px 8px;
  font-size:var(--fs-small);color:var(--text);outline:none;font-family:inherit;min-width:0;
}
.sg-seg input:focus,.sg-seg select:focus{border-color:var(--accent);}
.sg-seg-kind{font-size:var(--fs-caption);font-weight:var(--fw-medium);color:var(--text-faint);width:38px;flex-shrink:0;}
.sg-grow{flex:1;min-width:90px;}
.sg-affix{width:62px;}
.sg-mini{width:58px;}
.sg-color{width:30px;height:30px;padding:0;border:1px solid var(--glass-border);border-radius:var(--radius-xs);background:transparent;cursor:pointer;flex-shrink:0;}
.sg-thumb{width:28px;height:28px;object-fit:contain;background:var(--logo-plate);border-radius:var(--radius-xs);flex-shrink:0;}
.sg-save{max-width:1180px;margin:18px auto 0;}
.sg-assets{display:flex;flex-wrap:wrap;gap:12px;margin-top:12px;}
.sg-asset{width:104px;display:flex;flex-direction:column;align-items:center;gap:6px;}
.sg-asset-pick{
  width:100%;height:72px;border:1px solid var(--glass-border);border-radius:var(--radius-sm);background:var(--logo-plate);
  cursor:pointer;display:flex;align-items:center;justify-content:center;padding:8px;transition:.15s;
}
.sg-asset-pick:hover{border-color:var(--accent);}
.sg-asset-pick img,.sg-asset-pick svg{max-width:100%;max-height:100%;object-fit:contain;}
.sg-asset-name{font-size:var(--fs-caption);color:var(--text-soft);text-align:center;overflow-wrap:anywhere;}
/* הגדרות משרד: פרטי המשרד בשתי עמודות, והכתובת לכל הרוחב */
.os-contact{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 14px;}
.os-contact .wide{grid-column:1 / -1;}
@media(max-width:560px){.os-contact{grid-template-columns:minmax(0,1fr);}}
.os-self{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px;}
@media(max-width:560px){.os-self{grid-template-columns:minmax(0,1fr);}}

.sg-center{text-align:center;justify-content:center;}
.sg-paper + .sg-center,.sg-howto{margin-top:16px;}
/* ייבוא משתמשים מאקסל: תצוגה מקדימה של השורות */
.imp-rows{max-height:46vh;overflow-y:auto;border:1px solid var(--glass-border);border-radius:var(--radius-sm);margin-top:12px;}
.imp-rows .list-row{padding:9px 14px;gap:10px;}
.imp-line{font-size:var(--fs-caption);color:var(--text-faint);width:34px;flex-shrink:0;font-family:var(--font-mono);}
.imp-err{color:var(--red);}