/**
 * ========================================================================
 * QLUNAR2 INLINE DROPDOWN
 * Entity picker: surface + add + select + clear + inline search
 * Glass stack: q2 surfaces, elev, focus — veil-safe (light / dark / q2-veil)
 *
 * Variants (optional):
 *   .q2-inline-dropdown--chrome-soft    — мягче rail-тень
 *   .q2-inline-dropdown--list-elevated  — выше подъём списка
 * ========================================================================
 */

@layer components {
  /* ============================================
     COMPONENT TOKENS (override per instance if needed)
     ============================================ */

  .q2-inline-dropdown {
    --q2-inline-dd-inner-h: var(--q2-control-h);
    --q2-inline-dd-pad: var(--space-1);
    --q2-inline-dd-track: calc(var(--q2-inline-dd-inner-h) - 2 * var(--q2-inline-dd-pad));
    --q2-inline-dd-divider: color-mix(in srgb, var(--q2-control-rest-border, var(--q2-glass-control-border)) 30%, transparent);
    --q2-inline-dd-surface-ring: 0 0 0 1px color-mix(in srgb, var(--q2-control-rest-border, var(--q2-glass-control-border)) 42%, transparent);
    --q2-inline-dd-surface-shadow: var(--q2-inline-dd-surface-ring), var(--q2-elev-1);
    --q2-inline-dd-list-outer: var(--q2-elev-3);
    /* Frost popover: sheet-like — прозрачнее + blur + sat/bright (как ql-sheet elevated) */
    --q2-inline-dd-frost-blur: 8px;
    --q2-inline-dd-frost-sat: var(--q2-dropdown-frost-sat, 158%);
    --q2-inline-dd-frost-bright: var(--q2-dropdown-frost-bright, 114%);
    --q2-inline-dd-frost-bg: color-mix(in srgb, var(--color-paper) 44%, transparent);
    --q2-inline-dd-frost-air: 0 10px 36px color-mix(in srgb, var(--secondary-500) 9%, transparent),
      0 18px 56px color-mix(in srgb, var(--default-950) 4%, transparent);
    position: relative;
    display: inline-flex;
    flex-direction: column;
    width: 100%;
    gap: var(--space-2);
    font-family: inherit;
  }

  :where(.q2-root, [data-qlunar="2"])[data-theme="dark"] .q2-inline-dropdown,
  :where(.q2-root, [data-qlunar="2"]) [data-theme="dark"] .q2-inline-dropdown {
    --q2-inline-dd-frost-bg: color-mix(in srgb, var(--default-900) 38%, transparent);
    --q2-inline-dd-frost-air: 0 10px 36px color-mix(in srgb, var(--secondary-400) 7%, transparent),
      0 16px 48px rgba(0, 0, 0, 0.28);
  }

  /* Dark lunar veils: match dropdown frost law (surface still under #q2-surface; sat/bright follow veil) */
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="waning-gibbous"] .q2-inline-dropdown,
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="last-quarter"] .q2-inline-dropdown,
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="waning-crescent"] .q2-inline-dropdown,
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="eclipse"] .q2-inline-dropdown,
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="total-eclipse"] .q2-inline-dropdown,
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="waning-gibbous"] .q2-inline-dropdown,
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="last-quarter"] .q2-inline-dropdown,
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="waning-crescent"] .q2-inline-dropdown,
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="eclipse"] .q2-inline-dropdown,
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="total-eclipse"] .q2-inline-dropdown {
    --q2-inline-dd-frost-sat: var(--q2-dropdown-frost-sat, 76%);
    --q2-inline-dd-frost-bright: var(--q2-dropdown-frost-bright, 86%);
    --q2-inline-dd-frost-bg: color-mix(in srgb, var(--default-900) 38%, transparent);
    --q2-inline-dd-frost-air: 0 10px 36px color-mix(in srgb, var(--secondary-400) 7%, transparent),
      0 16px 48px rgba(0, 0, 0, 0.28);
  }

  .q2-inline-dropdown--chrome-soft {
    --q2-inline-dd-surface-shadow: var(--q2-inline-dd-surface-ring), 0 6px 20px color-mix(in srgb, var(--default-950) 3%, transparent);
    --q2-inline-dd-list-outer: var(--q2-elev-2);
  }

  .q2-inline-dropdown--list-elevated {
    --q2-inline-dd-list-outer: var(--q2-elev-4);
  }

  [data-ql-density="compact"].q2-inline-dropdown,
  [data-ql-density="compact"] .q2-inline-dropdown {
    --q2-inline-dd-inner-h: var(--q2-control-h-compact);
    --q2-inline-dd-pad: 2px;
  }

  [data-ql-density="cozy"].q2-inline-dropdown,
  [data-ql-density="cozy"] .q2-inline-dropdown {
    --q2-inline-dd-inner-h: var(--q2-control-h-cozy);
    --q2-inline-dd-pad: var(--space-2);
  }

  .q2-field > .q2-inline-dropdown {
    margin-top: 0;
    margin-bottom: 0;
  }

  /* ============================================
     SURFACE (один контур: сегменты без «рамки в рамке», только разделители)
     ============================================ */

  .q2-inline-dropdown__surface {
    position: relative;
    display: flex;
    align-items: stretch;
    gap: 0;
    width: 100%;
    min-height: var(--q2-inline-dd-inner-h);
    height: var(--q2-inline-dd-inner-h);
    padding: var(--q2-inline-dd-pad);
    border-radius: var(--q2-radius-md);
    box-sizing: border-box;
    isolation: isolate;

    background: var(--q2-glass-control-bg);
    border: none;
    backdrop-filter: blur(var(--q2-glass-control-blur, 8px)) saturate(var(--q2-glass-control-sat, 120%))
      brightness(var(--q2-glass-control-bright, 105%));
    -webkit-backdrop-filter: blur(var(--q2-glass-control-blur, 8px)) saturate(var(--q2-glass-control-sat, 120%))
      brightness(var(--q2-glass-control-bright, 105%));
    box-shadow: var(--q2-inline-dd-surface-shadow);

    transition:
      background var(--motion-default),
      box-shadow var(--motion-default);
  }

  /* Вертикальные разделители между сегментами (не отдельные бордеры у кнопок) */
  .q2-inline-dropdown__surface > *:not(:first-child) {
    box-shadow: -1px 0 0 var(--q2-inline-dd-divider);
  }

  .q2-inline-dropdown__surface:hover {
    --q2-inline-dd-surface-ring: 0 0 0 1px color-mix(in srgb, var(--q2-control-hover-border, var(--default-300)) 50%, transparent);
  }

  .q2-inline-dropdown__surface:focus-within {
    --q2-inline-dd-surface-ring: 0 0 0 1px color-mix(in srgb, var(--q2-control-focus-border, var(--color-primary)) 55%, transparent);
    box-shadow: var(--q2-focus-ring), var(--q2-inline-dd-surface-ring), var(--q2-elev-1);
  }

  @supports not (backdrop-filter: blur(1px)) {
    .q2-inline-dropdown__surface {
      background: var(--q2-glass-solid-control-bg);
    }
  }

  /* ============================================
     RAIL CHIPS: add · clear · filter (квадрат = высоте трека, без отдельных рамок)
     ============================================ */

  .q2-inline-dropdown__add,
  .q2-inline-dropdown__clear,
  .q2-inline-dropdown__filter {
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--q2-inline-dd-track);
    min-width: var(--q2-inline-dd-track);
    height: var(--q2-inline-dd-track);
    padding: 0;
    border: none;
    border-radius: var(--q2-radius-sm);
    background: transparent;
    color: var(--text-muted);
    cursor: pointer;
    flex-shrink: 0;
    box-shadow: none;
    transition:
      background var(--motion-fast),
      color var(--motion-fast),
      transform var(--motion-fast);
  }

  .q2-inline-dropdown__add:hover:not(:disabled),
  .q2-inline-dropdown__clear:hover:not(:disabled),
  .q2-inline-dropdown__filter:hover:not(:disabled) {
    background: color-mix(in srgb, var(--q2-control-hover-bg) 55%, transparent);
    color: var(--text);
  }

  .q2-inline-dropdown__add:active:not(:disabled),
  .q2-inline-dropdown__clear:active:not(:disabled),
  .q2-inline-dropdown__filter:active:not(:disabled) {
    transform: scale(0.97);
  }

  .q2-inline-dropdown__add:focus-visible,
  .q2-inline-dropdown__clear:focus-visible,
  .q2-inline-dropdown__filter:focus-visible {
    outline: none;
    box-shadow: var(--q2-focus-ring);
  }

  .q2-inline-dropdown__add:disabled,
  .q2-inline-dropdown__filter:disabled {
    opacity: 0.45;
    cursor: not-allowed;
  }

  .q2-inline-dropdown__add-icon,
  .q2-inline-dropdown__clear-icon,
  .q2-inline-dropdown__filter-icon {
    width: 16px;
    height: 16px;
  }

  /* ============================================
     TRIGGER (без внутренней рамки — только фон при hover / open)
     ============================================ */

  .q2-inline-dropdown__trigger {
    flex: 1;
    min-width: 0;
    align-self: stretch;
    position: relative;
    display: flex;
    align-items: center;
    min-height: 0;
    padding: 0 var(--space-3);
    gap: var(--space-2);
    z-index: 1;

    background: transparent;
    border: none;
    border-radius: var(--q2-radius-sm);
    box-shadow: none;

    font-size: var(--font-size-body-m, 14px);
    line-height: 1.5;
    color: var(--text);
    text-align: left;
    cursor: pointer;

    transition:
      background var(--motion-fast),
      transform var(--motion-fast);
  }

  .q2-inline-dropdown__trigger:hover:not(:disabled) {
    background: color-mix(in srgb, var(--q2-control-hover-bg) 50%, transparent);
  }

  .q2-inline-dropdown__trigger:active:not(:disabled) {
    transform: scale(0.998);
  }

  .q2-inline-dropdown__trigger:focus-visible {
    outline: none;
    box-shadow: var(--q2-focus-ring);
  }

  .q2-inline-dropdown__trigger[aria-expanded="true"] {
    background: color-mix(in srgb, var(--q2-control-focus-bg) 62%, transparent);
  }

  .q2-inline-dropdown__trigger:disabled {
    cursor: not-allowed;
    opacity: 0.58;
  }

  .q2-inline-dropdown__trigger-icon-prefix {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    min-width: 16px;
    flex-shrink: 0;
    color: var(--text-muted);
  }

  .q2-inline-dropdown__trigger-icon-prefix svg {
    width: 100%;
    height: 100%;
  }

  .q2-inline-dropdown__trigger-icon-prefix.q2-inline-dropdown__trigger-symbol {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--text);
  }

  .q2-inline-dropdown__trigger-content {
    flex: 1;
    display: flex;
    align-items: center;
    gap: var(--space-2);
    min-width: 0;
    overflow: hidden;
  }

  .q2-inline-dropdown__trigger-label {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .q2-inline-dropdown__trigger-label--placeholder {
    color: var(--text-placeholder, var(--text-muted));
  }

  .q2-inline-dropdown__trigger-icon {
    width: 16px;
    height: 16px;
    min-width: 16px;
    flex-shrink: 0;
    margin-left: auto;
    color: var(--text-muted);
    transition: transform var(--motion-default);
  }

  .q2-inline-dropdown__trigger-icon svg {
    width: 100%;
    height: 100%;
  }

  .q2-inline-dropdown__trigger[aria-expanded="true"] .q2-inline-dropdown__trigger-icon {
    transform: rotate(180deg);
  }

  .q2-inline-dropdown__clear[hidden] {
    display: none;
  }

  /* Фильтр — тот же rail-chip; иконка чуть мягче до hover */
  .q2-inline-dropdown__filter {
    color: color-mix(in srgb, var(--text-muted) 88%, var(--text));
  }

  .q2-inline-dropdown__filter:hover:not(:disabled) {
    color: var(--text);
  }

  /* ============================================
     OPTIONAL VALUE INPUT (narrow trigger)
     ============================================ */

  .q2-inline-dropdown__input {
    flex: 1;
    min-width: 0;
    height: var(--q2-inline-dd-track);
    padding: 0 var(--space-3);
    border: none;
    outline: none;
    background: transparent;
    border-radius: var(--q2-radius-md);
    font-size: var(--font-size-body-m, 14px);
    line-height: 1.5;
    color: var(--text);
    font-family: inherit;
  }

  .q2-inline-dropdown__input::placeholder {
    color: var(--text-placeholder, var(--text-muted));
  }

  .q2-inline-dropdown__input:focus {
    outline: none;
  }

  .q2-inline-dropdown--with-input .q2-inline-dropdown__trigger,
  .q2-inline-dropdown__surface:has(.q2-inline-dropdown__input) .q2-inline-dropdown__trigger {
    flex: 0 0 auto;
    width: auto;
    min-width: 0;
    max-width: 56px;
    padding: 0 var(--space-2);
    gap: var(--space-1);
  }

  .q2-inline-dropdown--with-input .q2-inline-dropdown__trigger-content,
  .q2-inline-dropdown__surface:has(.q2-inline-dropdown__input) .q2-inline-dropdown__trigger-content {
    display: none;
  }

  /* ============================================
     RIGHT-SIDE ACTIONS (icons: edit / open) — rare; stays token-safe
     ============================================ */

  .q2-inline-dropdown__actions {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    flex-shrink: 0;
    margin-left: auto;
  }

  .q2-inline-dropdown__action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    padding: 0;
    border: none;
    background: transparent;
    color: var(--text-muted);
    cursor: pointer;
    border-radius: var(--q2-radius-xs);
    transition:
      background var(--motion-fast),
      color var(--motion-fast);
  }

  .q2-inline-dropdown__action:hover:not(:disabled) {
    background: var(--q2-control-hover-bg);
    color: var(--text);
  }

  .q2-inline-dropdown__action:focus-visible {
    outline: none;
    box-shadow: var(--q2-focus-ring);
  }

  .q2-inline-dropdown__action:disabled {
    opacity: 0.4;
    cursor: not-allowed;
  }

  .q2-inline-dropdown__action-icon {
    width: 14px;
    height: 14px;
  }

  /* ============================================
     POPOVER LIST
     ============================================ */

  .q2-inline-dropdown__list {
    /* Overlay manager moves this element into #q2-overlay-root.
       CSS variables defined on the original .q2-inline-dropdown parent stop inheriting,
       so we must provide safe defaults here for frost bg/blur and shadow. */
    --q2-inline-dd-divider: color-mix(in srgb, var(--q2-control-rest-border, var(--q2-glass-control-border)) 30%, transparent);
    --q2-inline-dd-frost-blur: 8px;
    --q2-inline-dd-frost-sat: var(--q2-dropdown-frost-sat, 158%);
    --q2-inline-dd-frost-bright: var(--q2-dropdown-frost-bright, 114%);
    --q2-inline-dd-frost-bg: color-mix(in srgb, var(--color-paper) 44%, transparent);
    --q2-inline-dd-frost-air: 0 10px 36px color-mix(in srgb, var(--secondary-500) 9%, transparent),
      0 18px 56px color-mix(in srgb, var(--default-950) 4%, transparent);
    --q2-inline-dd-list-outer: var(--q2-elev-3);

    min-width: 200px;
    max-width: min(400px, 92vw);
    max-height: min(300px, 52vh);
    overflow-y: auto;
    overflow-x: hidden;
    padding: var(--space-1);
    border-radius: var(--q2-radius-lg);
    box-sizing: border-box;
    scrollbar-gutter: stable;

    background: var(--q2-inline-dd-frost-bg);
    border: none;
    backdrop-filter: blur(var(--q2-inline-dd-frost-blur)) saturate(var(--q2-inline-dd-frost-sat))
      brightness(var(--q2-inline-dd-frost-bright));
    -webkit-backdrop-filter: blur(var(--q2-inline-dd-frost-blur)) saturate(var(--q2-inline-dd-frost-sat))
      brightness(var(--q2-inline-dd-frost-bright));
    /* Как ql-sheet elevated: тонкое кольцо + «воздух» + глубина */
    box-shadow:
      0 0 0 1px color-mix(in srgb, var(--q2-ink-inversed) 11%, transparent),
      var(--q2-inline-dd-frost-air),
      var(--q2-inline-dd-list-outer);
  }

  @supports not (backdrop-filter: blur(1px)) {
    .q2-inline-dropdown__list {
      background: color-mix(in srgb, var(--q2-glass-solid-surface-bg) 92%, var(--q2-inline-dd-frost-bg));
    }
  }

  /* ============================================
     SEARCH (list header)
     ============================================ */

  .q2-inline-dropdown__search {
    position: sticky;
    top: 0;
    z-index: 1;
    width: 100%;
    box-sizing: border-box;
    padding: var(--space-2) var(--space-3);
    margin: 0 0 var(--space-1) 0;
    font-size: var(--font-size-body-m, 14px);
    line-height: 1.5;
    color: var(--q2-ink-primary, var(--text));

    background: color-mix(in srgb, transparent 20%, var(--q2-inline-dd-frost-bg));
    border: none;
    border-radius: var(--q2-radius-sm);
    outline: none;
    backdrop-filter: var(--q2-dropdown-search-backdrop, blur(10px) saturate(140%) brightness(100%));
    -webkit-backdrop-filter: var(--q2-dropdown-search-backdrop, blur(10px) saturate(140%) brightness(100%));
    box-shadow: inset 0 -1px 0 var(--q2-inline-dd-divider);

    transition:
      box-shadow var(--motion-default),
      background var(--motion-default);
  }

  .q2-inline-dropdown__search:focus {
    outline: none;
    box-shadow: var(--q2-focus-ring), inset 0 -1px 0 color-mix(in srgb, var(--q2-control-focus-border, var(--color-primary)) 45%, transparent);
    background: color-mix(in srgb, var(--q2-control-focus-bg) 35%, transparent);
  }

  .q2-inline-dropdown__search::placeholder {
    color: var(--text-placeholder, var(--q2-ink-muted, var(--text-muted)));
  }

  @supports not (backdrop-filter: blur(1px)) {
    .q2-inline-dropdown__search {
      background: var(--q2-glass-solid-control-bg);
    }
  }

  /* ============================================
     LIST ITEMS
     ============================================ */

  .q2-inline-dropdown__item {
    display: flex;
    align-items: flex-end;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    font-size: var(--font-size-body-m, 14px);
    line-height: 1.5;
    color: var(--q2-ink-primary, var(--text));
    cursor: pointer;
    border-radius: var(--q2-radius-md);
    transition:
      background var(--motion-fast),
      color var(--motion-fast);
    min-height: 36px;
    box-sizing: border-box;
  }

  .q2-inline-dropdown__item:hover:not([aria-disabled="true"]) {
    background: var(--q2-control-hover-bg);
  }

  /* Light: ink + hover on paper */
  :where(.q2-root, [data-qlunar="2"])[data-theme="light"] .q2-inline-dropdown__list .q2-inline-dropdown__item,
  :where(.q2-root, [data-qlunar="2"]) [data-theme="light"] .q2-inline-dropdown__list .q2-inline-dropdown__item {
    color: var(--q2-ink-primary, var(--default-800));
  }

  :where(.q2-root, [data-qlunar="2"])[data-theme="light"] .q2-inline-dropdown__item:hover:not([aria-disabled="true"]):not([aria-selected="true"]),
  :where(.q2-root, [data-qlunar="2"]) [data-theme="light"] .q2-inline-dropdown__item:hover:not([aria-disabled="true"]):not([aria-selected="true"]) {
    background: var(--tertiary-100);
    color: var(--q2-ink-primary, var(--default-800));
  }

  :where(.q2-root, [data-qlunar="2"])[data-theme="light"] .q2-inline-dropdown__list .q2-inline-dropdown__item-secondary:not(.q2-tag),
  :where(.q2-root, [data-qlunar="2"]) [data-theme="light"] .q2-inline-dropdown__list .q2-inline-dropdown__item-secondary:not(.q2-tag) {
    color: var(--q2-ink-muted, var(--default-600));
  }

  :where(.q2-root, [data-qlunar="2"])[data-theme="light"] .q2-inline-dropdown__list .q2-inline-dropdown__item-meta:not(.q2-badge),
  :where(.q2-root, [data-qlunar="2"]) [data-theme="light"] .q2-inline-dropdown__list .q2-inline-dropdown__item-meta:not(.q2-badge) {
    background: var(--tertiary-200);
    color: var(--default-700);
  }

  /* Dark + dark veils: keep separation from list glass */
  :where(.q2-root, [data-qlunar="2"])[data-theme="dark"] .q2-inline-dropdown__item:hover:not([aria-disabled="true"]):not([aria-selected="true"]),
  :where(.q2-root, [data-qlunar="2"]) [data-theme="dark"] .q2-inline-dropdown__item:hover:not([aria-disabled="true"]):not([aria-selected="true"]),
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="waning-gibbous"] .q2-inline-dropdown__item:hover:not([aria-disabled="true"]):not([aria-selected="true"]),
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="last-quarter"] .q2-inline-dropdown__item:hover:not([aria-disabled="true"]):not([aria-selected="true"]),
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="waning-crescent"] .q2-inline-dropdown__item:hover:not([aria-disabled="true"]):not([aria-selected="true"]),
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="eclipse"] .q2-inline-dropdown__item:hover:not([aria-disabled="true"]):not([aria-selected="true"]),
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="total-eclipse"] .q2-inline-dropdown__item:hover:not([aria-disabled="true"]):not([aria-selected="true"]),
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="waning-gibbous"] .q2-inline-dropdown__item:hover:not([aria-disabled="true"]):not([aria-selected="true"]),
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="last-quarter"] .q2-inline-dropdown__item:hover:not([aria-disabled="true"]):not([aria-selected="true"]),
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="waning-crescent"] .q2-inline-dropdown__item:hover:not([aria-disabled="true"]):not([aria-selected="true"]),
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="eclipse"] .q2-inline-dropdown__item:hover:not([aria-disabled="true"]):not([aria-selected="true"]),
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="total-eclipse"] .q2-inline-dropdown__item:hover:not([aria-disabled="true"]):not([aria-selected="true"]) {
    background: color-mix(in srgb, var(--default-50) 14%, var(--q2-control-hover-bg));
  }

  .q2-inline-dropdown__item[aria-selected="true"] {
    background: color-mix(in srgb, var(--color-primary) 15%, transparent);
    color: var(--color-primary);
  }

  :where(.q2-root, [data-qlunar="2"])[data-theme="light"] .q2-inline-dropdown__item[aria-selected="true"],
  :where(.q2-root, [data-qlunar="2"]) [data-theme="light"] .q2-inline-dropdown__item[aria-selected="true"] {
    background: var(--primary-100);
    color: var(--color-primary);
  }

  :where(.q2-root, [data-qlunar="2"])[data-theme="light"] .q2-inline-dropdown__item[aria-selected="true"]:hover,
  :where(.q2-root, [data-qlunar="2"]) [data-theme="light"] .q2-inline-dropdown__item[aria-selected="true"]:hover {
    background: var(--primary-200);
    color: var(--color-primary);
  }

  :where(.q2-root, [data-qlunar="2"])[data-theme="dark"] .q2-inline-dropdown__item[aria-selected="true"],
  :where(.q2-root, [data-qlunar="2"]) [data-theme="dark"] .q2-inline-dropdown__item[aria-selected="true"],
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="waning-gibbous"] .q2-inline-dropdown__item[aria-selected="true"],
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="last-quarter"] .q2-inline-dropdown__item[aria-selected="true"],
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="waning-crescent"] .q2-inline-dropdown__item[aria-selected="true"],
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="eclipse"] .q2-inline-dropdown__item[aria-selected="true"],
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="total-eclipse"] .q2-inline-dropdown__item[aria-selected="true"],
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="waning-gibbous"] .q2-inline-dropdown__item[aria-selected="true"],
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="last-quarter"] .q2-inline-dropdown__item[aria-selected="true"],
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="waning-crescent"] .q2-inline-dropdown__item[aria-selected="true"],
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="eclipse"] .q2-inline-dropdown__item[aria-selected="true"],
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="total-eclipse"] .q2-inline-dropdown__item[aria-selected="true"] {
    background: var(--default-600);
    color: var(--primary-100);
  }

  :where(.q2-root, [data-qlunar="2"])[data-theme="dark"] .q2-inline-dropdown__item[aria-selected="true"]:hover,
  :where(.q2-root, [data-qlunar="2"]) [data-theme="dark"] .q2-inline-dropdown__item[aria-selected="true"]:hover,
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="waning-gibbous"] .q2-inline-dropdown__item[aria-selected="true"]:hover,
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="last-quarter"] .q2-inline-dropdown__item[aria-selected="true"]:hover,
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="waning-crescent"] .q2-inline-dropdown__item[aria-selected="true"]:hover,
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="eclipse"] .q2-inline-dropdown__item[aria-selected="true"]:hover,
  :where(.q2-root, [data-qlunar="2"])[data-ql-veil="total-eclipse"] .q2-inline-dropdown__item[aria-selected="true"]:hover,
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="waning-gibbous"] .q2-inline-dropdown__item[aria-selected="true"]:hover,
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="last-quarter"] .q2-inline-dropdown__item[aria-selected="true"]:hover,
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="waning-crescent"] .q2-inline-dropdown__item[aria-selected="true"]:hover,
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="eclipse"] .q2-inline-dropdown__item[aria-selected="true"]:hover,
  :where(.q2-root, [data-qlunar="2"]) [data-ql-veil="total-eclipse"] .q2-inline-dropdown__item[aria-selected="true"]:hover {
    background: color-mix(in srgb, var(--color-primary) 44%, var(--default-900));
  }

  .q2-inline-dropdown__item[aria-disabled="true"] {
    opacity: 0.5;
    cursor: not-allowed;
  }

  .q2-inline-dropdown__item:focus-visible {
    outline: none;
    box-shadow: var(--q2-focus-ring);
  }

  .q2-inline-dropdown__item-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: var(--space-unit-0_5, 2px);
    min-width: 0;
  }

  .q2-inline-dropdown__item-icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    border-radius: var(--q2-radius-round);
    object-fit: cover;
  }

  .q2-inline-dropdown__item-label {
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .q2-inline-dropdown__item-secondary {
    /* When we reuse qlunar2 tags, visual styling is handled by `.q2-tag`.
       This class keeps ellipsis/layout behavior inside list rows. */
    font-size: inherit;
    color: inherit;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .q2-inline-dropdown__item[aria-selected="true"] .q2-inline-dropdown__item-secondary {
    color: inherit;
  }

  .q2-inline-dropdown__item-meta {
    /* When we reuse qlunar2 badges, visual styling is handled by `.q2-badge`. */
    flex-shrink: 0;
  }

  :where(.q2-root, [data-qlunar="2"])[data-theme="dark"] .q2-inline-dropdown__item-meta,
  :where(.q2-root, [data-qlunar="2"]) [data-theme="dark"] .q2-inline-dropdown__item-meta {
    /* no-op: q2-badge is responsible for theme/veil coloring */
  }

  .q2-inline-dropdown__item[aria-selected="true"] .q2-inline-dropdown__item-meta {
    /* no-op: q2-badge is responsible for state coloring */
  }

  :where(.q2-root, [data-qlunar="2"])[data-theme="dark"] .q2-inline-dropdown__item[aria-selected="true"] .q2-inline-dropdown__item-meta,
  :where(.q2-root, [data-qlunar="2"]) [data-theme="dark"] .q2-inline-dropdown__item[aria-selected="true"] .q2-inline-dropdown__item-meta {
    /* no-op: q2-badge is responsible for state coloring */
  }

  .q2-inline-dropdown__load-more {
    min-height: 4px;
    pointer-events: none;
  }

  /* ============================================
     EMPTY / LOADING / ERROR
     ============================================ */

  .q2-inline-dropdown__no-results {
    padding: var(--space-4);
    text-align: center;
    color: var(--q2-ink-muted, var(--text-muted));
    font-size: var(--font-size-body-m, 14px);
  }

  .q2-inline-dropdown__state {
    padding: var(--space-4);
    text-align: center;
    color: var(--q2-ink-muted, var(--text-muted));
    font-size: var(--font-size-body-m, 14px);
  }

  .q2-inline-dropdown__state--loading {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
  }

  .q2-inline-dropdown__state--empty {
    color: var(--q2-ink-muted, var(--text-muted));
  }

  .q2-inline-dropdown__state--error {
    color: var(--danger-600);
  }

  .q2-inline-dropdown__spinner {
    width: 16px;
    height: 16px;
    border: 2px solid var(--default-200);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: q2-spin 0.6s linear infinite;
  }

  @media (prefers-reduced-motion: reduce) {
    .q2-inline-dropdown__spinner {
      animation: none;
    }
  }

  [data-ql-motion="reduced"] .q2-inline-dropdown__spinner {
    animation: none;
  }

  :where(.q2-root, [data-qlunar="2"])[data-theme="dark"] .q2-inline-dropdown__spinner,
  :where(.q2-root, [data-qlunar="2"]) [data-theme="dark"] .q2-inline-dropdown__spinner {
    border-color: var(--default-600);
    border-top-color: var(--color-primary);
  }

  /* ============================================
     DENSITY (высота rail через --q2-inline-dd-inner-h на корне)
     ============================================ */

  [data-ql-density="compact"] .q2-inline-dropdown__trigger {
    padding: 0 var(--space-2);
  }

  [data-ql-density="compact"] .q2-inline-dropdown__item {
    min-height: 32px;
    padding: var(--space-1) var(--space-2);
  }

  [data-ql-density="cozy"] .q2-inline-dropdown__trigger {
    padding: 0 var(--space-4);
  }

  [data-ql-density="cozy"] .q2-inline-dropdown__item {
    min-height: 40px;
    padding: var(--space-3) var(--space-4);
  }

  /* ============================================
     REDUCED MOTION
     ============================================ */

  @media (prefers-reduced-motion: reduce) {
    .q2-inline-dropdown__surface,
    .q2-inline-dropdown__trigger,
    .q2-inline-dropdown__trigger-icon,
    .q2-inline-dropdown__add,
    .q2-inline-dropdown__clear,
    .q2-inline-dropdown__filter,
    .q2-inline-dropdown__item {
      transition: none;
    }
    .q2-inline-dropdown__add:hover:not(:disabled),
    .q2-inline-dropdown__trigger:hover:not(:disabled),
    .q2-inline-dropdown__clear:hover:not(:disabled),
    .q2-inline-dropdown__filter:hover:not(:disabled) {
      transform: none;
    }
    .q2-inline-dropdown__trigger:active:not(:disabled) {
      transform: none;
    }
  }
}