/* Custom styles for Radar Address Autocomplete to match the design system */

/* Override Radar's default input styles to match shadcn/ui Input component */
.radar-autocomplete-input {
  display: flex;
  height: 2.5rem;
  width: 100%;
  border-radius: calc(var(--radius) - 2px);
  border: 1px solid hsl(var(--border));
  background-color: hsl(var(--background));
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  color: hsl(var(--foreground));
}

.radar-autocomplete-input::-moz-placeholder {
  color: hsl(var(--muted-foreground));
}

.radar-autocomplete-input::placeholder {
  color: hsl(var(--muted-foreground));
}

.radar-autocomplete-input:focus {
  outline: 2px solid transparent;
  outline-offset: 2px;
  border-color: hsl(var(--ring));
  box-shadow: 0 0 0 2px hsl(var(--ring));
}

.radar-autocomplete-input:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

/* Style the dropdown results */
.radar-autocomplete-results {
  position: absolute;
  z-index: 50;
  width: 100%;
  border-radius: calc(var(--radius) - 2px);
  border: 1px solid hsl(var(--border));
  background-color: hsl(var(--popover));
  color: hsl(var(--popover-foreground));
  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  margin-top: 0.25rem;
  max-height: 12rem;
  overflow-y: auto;
}

.radar-autocomplete-result {
  padding: 0.5rem 0.75rem;
  cursor: pointer;
  border-bottom: 1px solid hsl(var(--border));
  transition-property: background-color;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.radar-autocomplete-result:last-child {
  border-bottom: none;
}

.radar-autocomplete-result:hover,
.radar-autocomplete-result.radar-autocomplete-result-active {
  background-color: hsl(var(--accent));
  color: hsl(var(--accent-foreground));
}

/* Hide the default Radar markers if they don't fit the design */
.radar-autocomplete-result .radar-autocomplete-marker {
  display: none;
}

/* Ensure proper spacing in the container */
.radar-autocomplete-container {
  position: relative;
  width: 100%;
}

/* Loading state styling */
.radar-autocomplete-loading {
  padding: 0.5rem 0.75rem;
  color: hsl(var(--muted-foreground));
  font-size: 0.875rem;
}

/* Error state styling */
.radar-autocomplete-error {
  padding: 0.5rem 0.75rem;
  color: hsl(var(--destructive));
  font-size: 0.875rem;
}

/* No results styling */
.radar-autocomplete-no-results {
  padding: 0.5rem 0.75rem;
  color: hsl(var(--muted-foreground));
  font-size: 0.875rem;
  font-style: italic;
}
