/* כרטיס המשתמש + תפריט מעבר-דשבורדים — משותף לכל דפי הדשבורד (ראו assets/js/header.js).
   מסתמך על משתני --green/--green-dark/--mint/--orange-ink/--orange-soft/--cream-2/
   --text/--muted/--faint/--line שכל דף כבר מגדיר ב-:root שלו. */

.me{position:relative;margin-top:auto;display:flex;align-items:center;gap:4px;background:var(--cream-2);border-radius:14px;padding:8px 8px 8px 14px}

.me-id{flex:1;min-width:0;display:flex;align-items:center;gap:11px;background:none;border:0;padding:4px 6px;margin:0;
  font-family:inherit;text-align:right;cursor:pointer;border-radius:10px}
.me-id:hover{background:rgba(16,42,32,.05)}
.me-id .av{width:38px;height:38px;border-radius:50%;background:var(--green);color:#fff;font-size:15px;font-weight:600;display:grid;place-items:center;flex:none}
.me-id .me-txt{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:1px}
.me-id .n{font-size:14.5px;font-weight:500;color:var(--text);max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.me-id .r{font-size:12.5px;color:var(--faint);max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.me-id .car{flex:none;font-size:10px;color:var(--faint);transition:transform .15s}
.me-id[aria-expanded="true"] .car{transform:rotate(180deg)}

.me-logout{flex:none;font-size:12.5px;color:var(--faint);background:none;border:0;
  font-family:inherit;cursor:pointer;padding:6px 10px;border-radius:8px}
.me-logout:hover{color:var(--orange-ink);background:#F4F1E7}

/* התפריט צף מעל סיידבר לבן, ולכן צריך גבול + צל ממשי כדי להיקרא כשכבה נפרדת —
   var(--shadow) של הדפים עדין מדי בשביל זה ולבן-על-לבן פשוט נבלע. */
.me-menu{position:absolute;bottom:calc(100% + 10px);right:0;left:0;background:#fff;
  border:1px solid var(--line);border-radius:14px;
  box-shadow:0 4px 12px rgba(16,42,32,.10), 0 20px 44px rgba(16,42,32,.16);
  padding:7px;display:flex;flex-direction:column;gap:1px;z-index:40}
/* חובה: ה-display:flex שלמעלה דורס את [hidden]{display:none} של הדפדפן (כלל מחבר גובר על
   כלל ה-UA), ובלעדי השורה הזו התפריט פשוט תמיד פתוח — ה-hidden ש-toggleMenu() מציב לא משפיע. */
.me-menu[hidden]{display:none}
.me-menu-label{font-size:11.5px;letter-spacing:.06em;color:var(--faint);font-weight:600;padding:6px 10px 5px}

/* שורה = קישור מעבר + כפתור כוכב "ברירת מחדל". הם אחים ולא מקוננים, כי <button> בתוך <a>
   אינו חוקי והלחיצה על הכוכב הייתה גוררת ניווט. */
.me-menu-row{display:flex;align-items:center;border-radius:9px}
.me-menu-row:hover{background:#F4F8F5}
.me-menu-row.active{background:var(--mint)}
.me-menu-item{flex:1;min-width:0;font-size:14.5px;color:var(--text);text-decoration:none;
  border-radius:9px;padding:9px 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.me-menu-row:hover .me-menu-item{color:var(--green-dark)}
.me-menu-row.active .me-menu-item{color:var(--green-dark);font-weight:600}

/* הכוכב מחליף את המשפט "הפוך את «X» לברירת המחדל שלך": מתאר דק ואפור כשהוא כבוי, מלא
   וירוק כשזו ברירת המחדל. הטקסט המלא נשאר ב-aria-label/title לקוראי מסך וב-hover.
   בלי opacity על מצב המנוחה: --faint על לבן נותן ~3:1, וכל שקיפות מורידה את הפקד
   האינטראקטיבי הזה אל מתחת לסף הניגודיות ולמעשה מעלימה אותו. ההבדל בין מנוחה ל-hover
   נעשה בצבע (--faint→--muted), לא בשקיפות. */
.me-menu-star{flex:none;background:none;border:0;font-family:inherit;cursor:pointer;
  font-size:15px;line-height:1;padding:5px;margin-inline-end:4px;border-radius:7px;
  color:var(--faint);transition:color .12s}
.me-menu-row:hover .me-menu-star{color:var(--muted)}
.me-menu-star:hover{color:var(--orange-ink);background:var(--orange-soft)}
.me-menu-star[aria-checked="true"],
.me-menu-row:hover .me-menu-star[aria-checked="true"]{color:var(--green);cursor:default}
.me-menu-star[aria-checked="true"]:hover{background:none;color:var(--green)}
.me-menu-star.failed{color:var(--orange-ink)}