/**
 * LibZen SuggestField — typeahead text field.
 */

.libzen-sf-root {
  position: relative;
  width: 100%;
}

.libzen-sf-input {
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 8px 10px;
  border: 1px solid var(--libzen-sf-border, var(--line, #cbd5e1));
  border-radius: 8px;
  background: var(--libzen-sf-bg, var(--surface, #fff));
  color: var(--libzen-sf-text, var(--text, #0f172a));
  font: inherit;
  line-height: 1.35;
  resize: vertical;
}

.libzen-sf-input:focus {
  outline: 2px solid var(--libzen-sf-focus, var(--accent, #3b82f6));
  outline-offset: 1px;
}

.libzen-sf-input:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.libzen-sf-panel {
  box-sizing: border-box;
  max-height: 240px;
  overflow: auto;
  border: 1px solid var(--libzen-sf-border, var(--line, #cbd5e1));
  border-radius: 8px;
  background: var(--libzen-sf-panel-bg, var(--surface, #fff));
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.14);
}

.libzen-sf-list {
  list-style: none;
  margin: 0;
  padding: 4px;
}

.libzen-sf-option {
  padding: 8px 10px;
  border-radius: 6px;
  cursor: pointer;
  color: var(--libzen-sf-text, var(--text, #0f172a));
  font-size: 14px;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.libzen-sf-option:hover,
.libzen-sf-option-active {
  background: var(--libzen-sf-option-active, rgba(59, 130, 246, 0.12));
}

[data-libzen-suggest-theme='dark'] .libzen-sf-input,
[data-libzen-suggest-theme='dark'] .libzen-sf-panel {
  --libzen-sf-border: #334155;
  --libzen-sf-bg: #1e293b;
  --libzen-sf-panel-bg: #1e293b;
  --libzen-sf-text: #e2e8f0;
  --libzen-sf-option-active: rgba(59, 130, 246, 0.22);
}