/* Kilo Select overrides – styled to match Figma design */

/* Select trigger (renders as a Button, override the button sizing) */
[data-component="select"] [data-slot="select-select-trigger"] {
  height: auto;
  min-height: 32px;
  border-radius: 2px;
  font-size: var(--kilo-font-size-13);
  line-height: var(--kilo-font-size-16);
  padding: 6px 12px !important;
  cursor: pointer;
  background: var(--background-weak);
  border: 1px solid var(--border-base);
  box-shadow: none;
  gap: 8px;
  white-space: nowrap;
  transition: border-color 150ms;
  color: var(--icon-weak-base);
  justify-content: space-between;

  &:hover:not(:disabled) {
    background: var(--background-weak);
    border-color: var(--border-hover);
  }

  &:focus-visible {
    outline: none;
    border-color: var(--border-hover);
    box-shadow: 0 0 0 1px var(--border-focus);
  }

  &[data-expanded] {
    background: var(--background-weak);
    border-color: var(--border-hover);
  }

  &:disabled {
    cursor: not-allowed;
    opacity: 0.5;
  }

  [data-slot="select-select-trigger-value"] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: var(--kilo-font-size-13);
    line-height: var(--kilo-font-size-16);
    color: var(--text-base);
  }

  [data-slot="select-select-trigger-icon"] {
    width: 10px;
    height: 20px;
    flex-shrink: 0;
    color: var(--icon-weak-base);
    background-color: transparent;
  }
}

[data-component="select"][data-trigger-style="settings"] [data-slot="select-select-trigger"] {
  box-sizing: border-box;
  width: 100%;
}

/* Select dropdown content */
[data-component="select-content"] {
  min-width: 200px !important;
  border-radius: 2px;
  border: 1px solid var(--border-focus, var(--vscode-focusBorder, #007fd4));
  padding: 0;
  overflow: hidden;
  background-color: var(--background-stronger);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.36);

  [data-slot="select-select-content-list"] {
    max-height: 328px;
    padding: 4px 0;
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  /* Section headers */
  [data-slot="select-section"] {
    padding: 4px 12px;
    font-size: var(--kilo-font-size-11);
    font-weight: 500;
    color: var(--text-weak);
    text-transform: uppercase;
    letter-spacing: 0.05em;
  }

  [data-slot="select-select-item"] {
    max-width: none !important;
    display: flex;
    width: 100%;
    box-sizing: border-box;
    border-radius: 0;
    padding: 6px 12px;
    font-size: var(--kilo-font-size-13);
    line-height: var(--kilo-font-size-16);
    cursor: pointer;
    gap: 8px;

    [data-slot="select-select-item-label"] {
      flex: 1;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    &[data-highlighted] {
      background-color: var(--surface-interactive-base);
      color: var(--text-on-interactive-base, var(--text-strong));
    }

    [data-slot="select-select-item-indicator"] {
      margin-left: auto;
      width: 16px;
      height: 16px;
    }
  }
}
