/**
 * SEARCH BAR COMPONENT
 * Componente di ricerca con autocomplete
 */
@layer components {
    .rtds-search-bar {
        --_autocomplete-max-height: var(--autocomplete-max-height, 25rem);
        @apply rtds-relative rtds-w-full;
    }

    .rtds-search-bar__form {
        @apply rtds-w-full;
    }

    .rtds-search-bar__wrapper {
        @apply rtds-flex;
    }

    .rtds-search-bar__input-wrapper {
        @apply rtds-relative rtds-flex-1 rtds-flex rtds-items-center rtds-rounded-lg rtds-bg-white rtds-h-16;
        transition: border-color 0.2s ease;
    }

    /*.rtds-search-bar__input-wrapper:hover:not(:has(.autocomplete__input:focus)) {
        @apply rtds-border-gray-03;
    }*/

    /*.rtds-search-bar--focus .rtds-search-bar__input-wrapper {
        @apply rtds-border-primary;
    }*/

    .rtds-search-bar__autocomplete {
        @apply rtds-h-full rtds-flex-1;
    }

    .rtds-search-bar .autocomplete__wrapper {
        @apply rtds-h-full;
    }

    /* Autocomplete input styling */
    .rtds-search-bar .autocomplete__input {
        @apply rtds-w-full rtds-py-2 rtds-pl-3 rtds-pr-28 rtds-border rtds-bg-transparent rtds-text-sm rtds-font-medium rtds-content-03 rtds-rounded-lg rtds-h-full rtds-border-input;
        transition: border-color 0.2s ease;
    }

    .rtds-search-bar .autocomplete__input:hover,
    .rtds-search-bar .autocomplete__input:focus:not(:focus-visible) {
        @apply rtds-border-input;
    }

    .rtds-search-bar .autocomplete__input:hover,
    .rtds-search-bar .autocomplete__input:focus:where(:not(:focus-visible)),
    .rtds-search-bar .autocomplete__input--focused:where(:not(:focus-visible)),
    .is-opened-by-pointer .autocomplete__input--focused {
        @apply rtds-outline-0;
        outline: 2px solid transparent;
        box-shadow: none;
    }

    .rtds-search-bar .autocomplete__input::placeholder {
        @apply rtds-content-03 rtds-text-base;
    }

    /* Clear button */
    .rtds-search-bar__clear {
        @apply rtds-absolute rtds-right-16 rtds-top-1/2 rtds--translate-y-1/2 rtds-z-10;
        transition: background-color 0.2s ease;
    }

    /*.rtds-search-bar__clear:hover {
        @apply rtds-background-secondary rtds-text-white;
    }*/

    /* Submit button */
    .rtds-search-bar__submit {
        @apply rtds-absolute rtds-right-2 rtds-top-1/2 rtds--translate-y-1/2 rtds-shrink-0 rtds-z-10;
    }


    /* Variant: Compact */
   /* .rtds-search-bar--compact .rtds-search-bar__input-wrapper {
        @apply rtds-h-12;
    }

    .rtds-search-bar--compact .autocomplete__input {
        @apply rtds-py-1 rtds-pl-2 rtds-pr-16 rtds-text-sm rtds-h-full;
    }

    .rtds-search-bar--compact .rtds-search-bar__submit {
        @apply rtds-w-8 rtds-h-8;
    }

    .rtds-search-bar--compact .rtds-search-bar__clear {
        @apply rtds-w-5 rtds-h-5 rtds-right-10;
    }*/

    /* Variant: Full width */
   /* .rtds-search-bar--full-width {
        @apply rtds-w-full;
    }*/

    /* Autocomplete menu styling */
    :where(.rtds-search-bar) .autocomplete__menu {
        @apply rtds-border rtds-border-gray-01 rtds-rounded-lg rtds-shadow-md rtds-background-01 rtds-mt-2;
        max-height: var(--_autocomplete-max-height);
        overflow-y: auto;
    }

   :where(.rtds-search-bar) .autocomplete__option {
        @apply rtds-px-3 rtds-py-2 rtds-text-sm rtds-font-medium rtds-background-01 rtds-content-03 rtds-border-0;
    }

    :where(.rtds-search-bar) .autocomplete__option:hover,
    :where(.rtds-search-bar) .autocomplete__option--focused {
        @apply rtds-background-02;
    }

    :where(.rtds-search-bar) .autocomplete__option--focused {
      outline-style: solid;
      outline-width: 2px;
      outline-offset: -2px;
      @apply rtds-outline-focusring;
    }

    :where(.rtds-search-bar) .autocomplete__option--focused:where(:not(:focus-visible)) {
      outline: 2px solid transparent;
      box-shadow: none;
    }
    /* Hide default dropdown arrow */
    .rtds-search-bar .autocomplete__dropdown-arrow-down-wrapper {
        @apply rtds-hidden;
    }

    /* Autocomplete suggestion styling */
    .rtds-search-bar__autocomplete-suggestion {
        @apply rtds-flex rtds-flex-col rtds-gap-1;
    }

    .rtds-search-bar__suggestion-title {
        @apply rtds-text-sm rtds-font-bold rtds-content-01;
    }

    .rtds-search-bar__suggestion-type {
        @apply rtds-text-xs rtds-font-normal rtds-content-03;
    }

    /* All results option content wrapper */
    /* All results option styling */
    .autocomplete__option.rtds-search-bar__all-results-option-wrapper {
        @apply rtds-flex rtds-justify-end rtds-px-3;
    }

    .autocomplete__option.rtds-search-bar__all-results-option-wrapper:hover,
    .autocomplete__option.rtds-search-bar__all-results-option-wrapper:focus {
        @apply rtds-background-01;
    }

    .rtds-search-bar__all-results-option {
        @apply rtds-border-t rtds-border-gray-03 rtds-py-2 rtds-w-full rtds-flex rtds-justify-end rtds-flex-row;
    }

    .rtds-search-bar__all-results-option:hover .rtds-search-bar__all-results-link {
        @apply rtds-underline;
    }

    .rtds-search-bar__all-results-link {
        @apply rtds-flex rtds-items-center rtds-gap-2 hover:rtds-underline;
    }

    /* Mobile Search Modal */
    .rtds-search-bar__mobile-wrapper {
        @apply rtds-inline-flex;
    }

    .rtds-search-bar__modal {
        @apply rtds-z-50;
    }

    .rtds-search-bar__modal[aria-hidden="false"] {
        @apply rtds-flex;
    }

    .rtds-search-bar__modal > div {
        @apply rtds-max-w-full;
    }
}

