/* Title-box meeting selector (#369, Track 3C) — the "+" new-meeting control,
   the caret history trigger, and the last-20 dropdown. Token-only styling,
   mirroring the sibling .keyword-toggle / .keyword-popover geometry so the
   Incoming panel header reads as one control cluster. Hidden until the
   meeting_selector flag resolves ON (inline display:none -> gateElement). */

.meeting-selector { position: relative; display: inline-flex; align-items: center; gap: 2px; flex-shrink: 0; }

/* Ghost icon buttons — the "+" and the caret. */
.meeting-ctl {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; padding: 0; border-radius: var(--radius-sm);
  border: 1px solid transparent; background: transparent;
  color: var(--text-3); cursor: pointer;
  transition: color var(--duration-fast), background var(--duration-fast),
              border-color var(--duration-fast);
}
.meeting-ctl:hover { color: var(--text); border-color: var(--border); background: var(--surface-hi); }
.meeting-ctl .icon { width: 14px; height: 14px; flex-shrink: 0; }

/* Dropdown — drops below the caret, left-aligned to the cluster; stays within
   the panel box (the panel is overflow:hidden, so it opens downward). */
.meeting-history-menu {
  position: absolute; top: calc(100% + 4px); left: 0; z-index: 60;
  width: 260px; max-width: 82vw; padding: 4px;
  display: flex; flex-direction: column;
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius-md); box-shadow: var(--shadow-md);
  text-transform: none; letter-spacing: 0;
}
.meeting-history-menu[hidden] { display: none; }

.meeting-history-list { display: flex; flex-direction: column; max-height: 320px; overflow-y: auto; }

/* One meeting row — name (left) + date (right), truncating name on overflow. */
.mh-row {
  display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
  width: 100%; padding: 6px 8px; border: none; border-radius: var(--radius-sm);
  background: transparent; color: var(--text); cursor: pointer; text-align: left;
  transition: background var(--duration-fast);
}
.mh-row:hover { background: var(--surface-hi); }
.mh-name {
  font-size: var(--fs-sm); font-weight: 500; line-height: 1.2;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.mh-date { font-size: var(--fs-xs); color: var(--text-3); flex-shrink: 0; }

.meeting-history-empty {
  padding: 10px 8px; font-size: var(--fs-xs); color: var(--text-3); text-align: center;
}
.meeting-history-empty[hidden] { display: none; }

/* "(more)" pager row — a full-width ghost affordance under the list. */
.meeting-history-more {
  width: 100%; padding: 7px 8px; margin-top: 2px;
  border: none; border-top: 1px solid var(--border); border-radius: 0;
  background: transparent; color: var(--text-2); cursor: pointer;
  font-size: var(--fs-xs); font-weight: 500;
  transition: color var(--duration-fast), background var(--duration-fast);
}
.meeting-history-more:hover { color: var(--text); background: var(--surface-hi); }
.meeting-history-more:disabled { color: var(--text-3); cursor: default; background: transparent; }
.meeting-history-more[hidden] { display: none; }