/* static/css/components/place-selector.css
   Autocomplete results dropdown for the place-of-residence selector.
   static/js/place-selector.js builds the markup and toggles .active; this file
   only skins it. Token-only: brand defaults on :root, resolving from tokens.css.
   (Pre-teardown these were re-pointed to the legacy look by compat.css on
   not-yet-migrated pages; that layer is gone as of Phase-D slice 4c.) */
:root{
  --place-dd-bg:var(--color-surface);
  --place-dd-border:var(--color-border);
  --place-dd-radius:var(--radius-sm);
  --place-dd-shadow:0 4px 12px color-mix(in srgb, var(--th-ink) 15%, transparent);
  --place-item-pad-block:var(--space-2xs);
  --place-item-pad-inline:var(--space-xs);
  --place-item-fs:var(--fs-sm);
  --place-item-fg:var(--color-text);
  --place-item-hover:color-mix(in srgb, var(--color-action) 12%, transparent);
}
.place-selector-dropdown{
  position:absolute; top:100%; left:0; right:0;
  background:var(--place-dd-bg);
  border:1px solid var(--place-dd-border);
  border-radius:var(--place-dd-radius);
  max-height:240px; overflow-y:auto; z-index:1000;
  box-shadow:var(--place-dd-shadow);
}
.place-selector-item{
  padding:var(--place-item-pad-block) var(--place-item-pad-inline);
  cursor:pointer;
  font-size:var(--place-item-fs);
  color:var(--place-item-fg);
  transition:background-color var(--dur-quick) var(--ease);
}
.place-selector-item:hover,
.place-selector-item.active{ background:var(--place-item-hover); }