/* Organiser picker (decision 290): core/components/_lg_org_chooser.html.
   Tiles on a grid, 1 column on phones, 2 from 40em, 3 from 64em. A tile is
   one link: mark, name (two lines at most), web address, chevron. Role
   tokens only. */

.lg-orgpick { display: flex; flex-direction: column; gap: var(--space-4); }
.lg-orgpick__head { display: flex; flex-direction: column; gap: var(--space-1); }
.lg-orgpick__text { margin: 0; color: var(--text-muted); font-size: var(--size-body); line-height: var(--leading-body); }

.lg-orgpick__bar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); }
.lg-orgpick__search { position: relative; display: flex; align-items: center; flex: 1 1 18rem; }
.lg-orgpick__search > svg { position: absolute; left: var(--space-3); color: var(--text-muted); pointer-events: none; }
.lg-orgpick__input { padding-left: calc(var(--space-3) + 1rem + var(--space-2)); }
.lg-orgpick__count { margin: 0; color: var(--text-muted); font-size: var(--size-label); line-height: var(--leading-label); white-space: nowrap; }

.lg-orgpick__list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-2);
  margin: 0;
  padding: 0;
  list-style: none;
}
.lg-orgpick__list > li[hidden] { display: none; }
@media (min-width: 40em) { .lg-orgpick__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64em) { .lg-orgpick__list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.lg-orgpick__tile {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  block-size: 100%;
  min-block-size: 3.5rem;
  padding: var(--space-3);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  background: var(--surface);
  color: var(--text);
  text-decoration: none;
  touch-action: manipulation;
  transition: border-color var(--dur-fast) var(--ease), background-color var(--dur-fast) var(--ease);
}
.lg-orgpick__tile .lg-orgmark { inline-size: 2.5rem; block-size: 2.5rem; font-size: var(--size-label); }
.lg-orgpick__tile:hover { border-color: var(--border-strong); background: var(--row-hover); }
.lg-orgpick__tile:hover .lg-orgpick__chevron { color: var(--primary); transform: translateX(2px); }
.lg-orgpick__tile:focus-visible { outline: var(--focus-ring) solid var(--focus); outline-offset: 2px; }
.lg-orgpick__tile:active { transform: scale(0.99); }

.lg-orgpick__text-wrap { display: flex; flex: 1; flex-direction: column; min-inline-size: 0; }
.lg-orgpick__name {
  font-weight: 600;
  font-size: var(--size-card-title);
  line-height: var(--leading-card-title);
  overflow-wrap: anywhere;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
}
.lg-orgpick__slug {
  color: var(--text-muted);
  font-size: var(--size-caption);
  line-height: var(--leading-caption);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.lg-orgpick__chevron { flex: none; display: grid; color: var(--text-muted); transition: transform var(--dur-fast) var(--ease); }
.lg-orgpick__none { margin: 0; color: var(--text-muted); }

@media (max-width: 39.99em) {
  .lg-orgpick__count { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .lg-orgpick__tile, .lg-orgpick__chevron { transition: none; }
  .lg-orgpick__tile:active, .lg-orgpick__tile:hover .lg-orgpick__chevron { transform: none; }
}