/* SmartPicker demo styles */
.smart-picker {
  position: relative;
  width: 100%;
  user-select: none;
}

.smart-picker__trigger,
.smart-picker__input {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 42px;
  border: 1px solid #cfd7df;
  border-radius: 6px;
  background: #fff;
  color: #0c3b5d;
  padding: 10px 12px;
  text-align: left;
  justify-content: flex-start;
  cursor: pointer;
  outline: 0;
}

.smart-picker__input {
  cursor: text;
}

.smart-picker[data-open=true] .smart-picker__trigger,
.smart-picker[data-open=true] .smart-picker__input {
  border-color: #0c3b5d;
  box-shadow: 0 0 0 0 rgba(12, 59, 93, 0.1215686275);
}

.smart-picker__menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 1000;
  background: var(--ks-dropdown-panel-bg, #fff);
  border: 1px solid #d8dee5;
  border-radius: 6px;
  box-shadow: rgba(15, 23, 42, 0.12) 0 12px 32px;
  max-height: 360px;
  overflow-y: auto;
  padding: 6px 0;
  animation: smartPickerFade 0.2s ease forwards;
}

.smart-picker__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.smart-picker__section {
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #0c3b5d;
  background: #f4f7fa;
}

.smart-picker__option,
.smart-picker__empty {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  color: #0c3b5d;
}

.smart-picker__option {
  cursor: pointer;
}

.smart-picker__option:hover {
  background: #f3f7fb;
  color: #0c3b5d;
}

.smart-picker__option[data-highlighted=true] {
  background: #eef5fb;
}

.smart-picker__option[data-selected=true] {
  font-weight: 600;
  background: rgba(209, 209, 209, 0.2117647059);
  color: #000;
}

.smart-picker__category {
  background: #0c3b5d;
  color: #fff;
  cursor: default;
}

.smart-picker__empty {
  color: #7d8a97;
}

@keyframes smartPickerFade {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}