/* Elenya Directorist Search Form - Bricks child theme */

:root {
  --elenya-cream: #fffaf6;

  --elenya-border: #eee6df;

  --elenya-text: #161514;

  --elenya-muted: #827a72;

  --elenya-accent: #d96b45;

  --elenya-shadow: 0 18px 45px rgba(30, 22, 16, 0.1);
}

.elenya-directorist-search,
.elenya-directorist-search * {
  box-sizing: border-box;
}

.elenya-directorist-search {
  width: 100%;

  margin: 0;

  padding: 0;

  font-family: Inter, "Helvetica Neue", Arial, sans-serif;
}

.elenya-directorist-search .elenya-search-container {
  width: min(1180px, calc(100% - 48px));

  margin: 0 auto;
}

.elenya-directorist-search .directorist-container,
.elenya-directorist-search .directorist-container-fluid {
  max-width: none !important;

  width: 100% !important;

  padding: 0 !important;
}

.elenya-directorist-search .directorist-search-form {
  margin: 0 !important;
}

.elenya-directorist-search .elenya-search-shell,
.elenya-directorist-search .directorist-search-form__wrap {
  border: 0 !important;

  background: transparent !important;

  box-shadow: none !important;

  padding: 0 !important;
}

.elenya-directorist-search .elenya-search-form__box {
  width: 100%;

  background: #fff;

  border: 1px solid var(--elenya-border);

  border-radius:10px;

  box-shadow: var(--elenya-shadow);

  padding: 22px;
}

.elenya-directorist-search .elenya-search-form__top {
  display: grid !important;

  grid-template-columns: minmax(260px, 1.25fr) minmax(220px, 1fr) minmax(
      200px,
      0.85fr
    ) 232px;

  align-items: center;

  gap: 0;

  width: 100%;
}

.elenya-directorist-search .elenya-search-item {
  position: relative;

  min-height: 52px;

  display: flex;

  align-items: center;

  padding: 0 28px 0 28px;

  border-right: 1px solid #eee8e2;
}

/* First field has no search icon now */

.elenya-directorist-search .elenya-search-item--what {
  padding-left: 0px;
}

.elenya-directorist-search .elenya-search-item--when {
  border-right: 0;
}

.elenya-directorist-search .elenya-search-icon {
  height: 40px;

  width: 40px;

  border-radius: 50%;

  background: var(--elenya-cream);

  display: flex;

  align-items: center;

  justify-content: center;

  margin-right: 12px;

  color: var(--bricks-color-bjamlf);

  line-height: 0;

  z-index: 2;
}

.elenya-directorist-search .directorist-search-field,
.elenya-directorist-search .directorist-form-group,
.elenya-directorist-search .directorist-select,
.elenya-directorist-search .elenya-visible-field {
  width: 100% !important;

  margin: 0 !important;

  padding: 0 !important;

  display: block !important;
}

.elenya-directorist-search .directorist-search-field__label,
.elenya-directorist-search label.directorist-search-field__label {
  display: block !important;

  visibility: visible !important;

  opacity: 1 !important;

  margin: 0 0 5px !important;

  color: var(--elenya-text) !important;

  font-size: 13px !important;

  line-height: 1.1 !important;

  font-weight: 800 !important;

  letter-spacing: -0.01em;

  position: static !important;

  width: auto !important;

  height: auto !important;

  overflow: visible !important;
}

.elenya-directorist-search input.directorist-form-element,
.elenya-directorist-search select.directorist-form-element,
.elenya-directorist-search .directorist-select select,
.elenya-directorist-search .select2-selection,
.elenya-directorist-search
  .select2-container--default
  .select2-selection--single {
  width: 100% !important;

  min-height: 24px !important;

  height: 24px !important;

  border: 0 !important;

  outline: 0 !important;

  box-shadow: none !important;

  background: transparent !important;

  padding: 0 !important;

  color: var(--elenya-muted) !important;

  font-size: 13px !important;

  font-weight: 500 !important;

  line-height: 24px !important;
}

.elenya-directorist-search select.directorist-form-element,
.elenya-directorist-search .directorist-select select {
  appearance: none;

  -webkit-appearance: none;

  cursor: pointer;
}

.elenya-directorist-search .select2-container {
  width: 100% !important;

  min-width: 0 !important;

  display: block !important;
}

.elenya-directorist-search .select2-container .select2-selection__rendered,
.elenya-directorist-search
  .select2-container--default
  .select2-selection--single
  .select2-selection__rendered {
  padding: 0 !important;

  color: var(--elenya-muted) !important;

  font-size: 13px !important;

  font-weight: 500 !important;

  line-height: 24px !important;
}

.elenya-directorist-search .select2-selection__arrow,
.elenya-directorist-search .directorist-search-field__btn,
.elenya-directorist-search .directorist-input-icon {
  display: none !important;
}

.elenya-directorist-search input::placeholder {
  color: var(--elenya-muted) !important;

  opacity: 1;
}

/* Guaranteed visible placeholders. This fixes themes/plugins that hide native placeholder text. */

.elenya-directorist-search .elenya-input-wrap {
  position: relative;

  width: 100%;

  min-height: 24px;
}

.elenya-directorist-search .elenya-placeholder-input {
  position: relative !important;

  z-index: 2;

  background: transparent !important;
}

.elenya-directorist-search .elenya-placeholder-input::placeholder {
  color: transparent !important;

  opacity: 0 !important;
}

.elenya-directorist-search .elenya-fake-placeholder {
  position: absolute;

  inset: 0 auto auto 0;

  height: 24px;

  line-height: 24px;

  max-width: 100%;

  color: var(--elenya-muted);

  font-size: 13px;

  font-weight: 500;

  white-space: nowrap;

  overflow: hidden;

  text-overflow: ellipsis;

  pointer-events: none;

  z-index: 1;
}

.elenya-directorist-search
  .elenya-input-wrap.is-filled
  .elenya-fake-placeholder,
.elenya-directorist-search
  .elenya-input-wrap:has(input:not(:placeholder-shown))
  .elenya-fake-placeholder {
  display: none;
}

.elenya-directorist-search .elenya-date-input {
  cursor: pointer;
}

.elenya-directorist-search
  input[type="date"].elenya-date-input::-webkit-calendar-picker-indicator {
  opacity: 0;

  cursor: pointer;

  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;
}

.elenya-directorist-search .elenya-search-submit {
  display: flex;

  align-items: center;

  justify-content: flex-end;

  padding-left: 22px;
}

.elenya-directorist-search .elenya-search-button,
.elenya-directorist-search .directorist-btn-search {
  width: 100% !important;

  min-width: 0 !important;

  height: 54px !important;

  border: 0 !important;

  border-radius: 5px !important;

  background: #191919 !important;

  color: #fff !important;

  display: flex !important;

  align-items: center !important;

  justify-content: center !important;

  padding: 0 22px !important;

  font-size: 14px !important;

  line-height: 1 !important;

  font-weight: 800 !important;

  letter-spacing: -0.01em;

  box-shadow: none !important;

  transition:
    transform 0.18s ease,
    background 0.18s ease;
}

.elenya-directorist-search .elenya-search-button:hover,
.elenya-directorist-search .directorist-btn-search:hover {
  background:var(--bricks-color-bjamlf) !important;
}

.elenya-directorist-search .elenya-search-extra-fields,
.elenya-directorist-search .elenya-search-advanced-trigger {
  display: none !important;
}

.elenya-directorist-search .directorist-search-modal--advanced {
  display: none;
}

/* Select2 dropdown opened from this form */

body .select2-container--open .select2-dropdown {
  border: 1px solid #eee6df !important;

  border-radius: 10px !important;

  box-shadow: 0 18px 40px rgba(30, 22, 16, 0.12) !important;

  overflow: hidden;
}

body .select2-results__option {
  font-size: 13px !important;

  padding: 10px 14px !important;
}

body .select2-results__option--highlighted {
  background: #d96b45 !important;

  color: #fff !important;
}

@media (max-width: 1024px) {
  .elenya-directorist-search .elenya-search-container {
    width: min(92vw, 760px);
  }

  .elenya-directorist-search .elenya-search-form__top {
    grid-template-columns: 1fr 1fr;

    row-gap: 18px;
  }

  .elenya-directorist-search .elenya-search-item--where {
    border-right: 0;
  }

  .elenya-directorist-search .elenya-search-item--when {
    border-right: 1px solid #eee8e2;

    padding-left: 0;
  }
}

@media (max-width: 767px) {
  .elenya-directorist-search .elenya-search-form__box {
    padding: 16px;

    border-radius: 14px;
  }

  .elenya-directorist-search .elenya-search-form__top {
    display: flex !important;

    flex-direction: column;

    gap: 0;
  }

  .elenya-directorist-search .elenya-search-item {
    width: 100%;

    min-height: 64px;

    padding: 12px 8px 12px 12px;

    border-right: 0 !important;

    border-bottom: 1px solid #eee8e2;
  }

  .elenya-directorist-search .elenya-search-item--what {
    padding-left: 8px;
  }

  .elenya-directorist-search .elenya-search-icon {
    left: 12px;
  }

  .elenya-directorist-search .elenya-search-submit {
    width: 100%;

    padding: 16px 0 0;
  }

  .elenya-directorist-search .elenya-search-button,
  .elenya-directorist-search .directorist-btn-search {
    height: 52px !important;
  }
}

/* Keep the fake placeholder visible on empty native date inputs. */

.elenya-directorist-search
  .elenya-input-wrap:not(.is-filled):has(input[type="date"])
  .elenya-fake-placeholder {
  display: block;
}
