/* COMMAND-1257: the favourites (public/favorites) — the star on a record page and a conversation, its description box,
   and the Favourites window's list. No design yet: POC. */
.fav-star-wrap { position: relative; display: inline-flex; vertical-align: middle; margin-left: 6px; }
.fav-star { color: var(--muted, inherit); }
.fav-star.on { color: var(--warn); }
.fav-star.on svg path { fill: currentColor; }
.fav-star[aria-disabled='true'] { opacity: 0.5; }
.fav-box { display: grid; gap: 8px; padding: 10px; border-radius: 10px; background: var(--surface); box-shadow: 0 6px 24px rgb(0 0 0 / 0.16); font-size: 0.95rem; font-weight: 400; }
.fav-box .fav-description { width: 100%; }
.fav-box .actions { display: flex; gap: 8px; align-items: center; }
.fav-star-box { position: absolute; top: calc(100% + 6px); left: 0; z-index: 20; width: min(320px, 80vw); }
/* COMMAND-1429: in a conversation the star is a row of the head's "⋮" menu (public/thread, app.css .thread-more-menu),
   which hangs from the window's right edge: the box opens inside the menu, under the star, instead of to its right. */
.thread-more .thread-more-menu > .fav-star-wrap { flex-direction: column; align-items: stretch; margin-left: 0; padding: 0; }
.thread-more .thread-more-menu > .fav-star-wrap:hover { background: none; }
.thread-more .thread-more-menu .fav-star-box { position: static; width: min(320px, calc(100vw - 48px)); margin: 4px 0; box-shadow: none; background: var(--surface-2, var(--surface)); }
.fav-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.fav-item { border-radius: 10px; background: var(--surface); touch-action: pan-y; }
.fav-item.dragging { position: relative; z-index: 5; box-shadow: 0 6px 18px rgb(0 0 0 / 0.18); }
.fav-row { display: flex; align-items: center; gap: 4px; min-height: 52px; }
.fav-grip { flex: none; cursor: grab; touch-action: none; color: var(--muted, inherit); }
.fav-item.dragging .fav-grip { cursor: grabbing; }
.fav-open { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 8px 4px; background: none; border: 0; text-align: left; color: inherit; cursor: pointer; }
.fav-name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.fav-desc { color: var(--text); overflow-wrap: anywhere; }
.fav-edit { flex: none; }
.fav-item > .fav-box { margin: 0 8px 8px; box-shadow: none; background: var(--surface-2, var(--surface)); }
