/* NeuroChiro Map - v3 styles */
:root {
  --_primitives---colors--light-cream: #f5f3ef;
  --_typography---font-styles--body: Montserrat, sans-serif;
  --_primitives---colors--neutral-darkest: #131313;
  --_typography---font-styles--heading: Lato, sans-serif;
  --color-scheme-1--text: var(--_primitives---colors--neutral-darkest);
  --_primitives---colors--orange: #d66829;
  --_primitives---colors--white: #fff;
  --_primitives---colors--dark-navy: #1e2d3b;
  --_ui-styles---radius--large: 30px;
  --_primitives---opacity--transparent: transparent;
  --_primitives---colors--neutral-darker: #222;
  --_primitives---opacity--neutral-darkest-60: #0009;
  --_primitives---opacity--white-60: #fff9;
  --_ui-styles---stroke--border-width: 1px;
  --color-scheme-1--border: var(--_primitives---colors--neutral-darkest);
  --_ui-styles---radius--medium: 20px;
  --color-scheme-1--foreground: #eee;
  --_ui-styles---radius--small: 10px;
  --color-scheme-1--background: var(--_primitives---colors--white);
  --_primitives---colors--neutral-lightest: #eee;
  --color-scheme-1--accent: var(--_primitives---colors--neutral-darkest);
  --_ui-styles---stroke--divider-width: 1px;
  --_primitives---colors--neutral-lighter: #ccc;
  --_primitives---colors--neutral-light: #aaa;
  --_primitives---colors--neutral: #666;
  --_primitives---colors--neutral-dark: #444;
  --_primitives---colors--gray: #4b5563;
  --bg: #f7f4ef;
  --card-bg: #fff;
  --accent: #d66829;
  --dark: #1f2a33
}

.nc-page-wrap {
  max-width: 1200px;
  margin: 24px auto;
  padding: 0 18px;
  font-family: Inter, system-ui, Arial
}

.nc-hero {
  display: flex;
  flex-direction: column;

}

/* User Provided Styles */
.search-form {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  border-radius: var(--_ui-styles---radius--large);
  background-color: var(--_primitives---colors--white);
  padding: 10px;
  display: flex;
  align-items: center;
  width: 100%;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.form_input {
  border: 1px none var(--_primitives---colors--neutral-darkest);
  background-color: var(--_primitives---colors--white);
  color: var(--_primitives---colors--neutral-darkest);
  border-radius: 0;
  height: auto;
  min-height: 2.75rem;
  margin-bottom: 0;
  padding: .5rem .75rem;
  font-size: 16px;
  /* Increased font size */
  line-height: 1.6;
  outline: none !important;
}

.form_input:focus {
  border-color: var(--_primitives---colors--neutral-darkest)
}

.form_input::placeholder {
  color: var(--_primitives---opacity--neutral-darkest-60)
}

.form_input.is-select-input {
  background-image: none;
  background-position: 0 0;
  background-repeat: repeat;
  background-size: auto;
  cursor: pointer;
}

/* Custom Select Arrow from previous nice styling but adapted */
.form_input.is-select-input {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2214%22%20height%3D%228%22%20viewBox%3D%220%200%2014%208%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M1%201L7%207L13%201%22%20stroke%3D%22%23333333%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  padding-right: 30px;
}

.line {
  border-right: 2px solid #ddd;
  /* Use hex for visibility */
  width: 2px;
  height: 24px;
  /* Shorter divider */
  margin: 0 16px;
  /* Space around divider */
  flex-shrink: 0;
  /* Don't shrink */
}

.button {
  border: 1px solid var(--_primitives---colors--dark-navy);
  border-radius: var(--_ui-styles---radius--large);
  background-color: var(--_primitives---colors--dark-navy);
  color: var(--_primitives---colors--white);
  text-align: center;
  padding: .75rem 1.5rem;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
}


/* Ensure mapbox geocoder input looks right */
.mapboxgl-ctrl-geocoder--input {
  font-family: inherit;
  color: inherit;
}

/* Responsive adjustments */
@media screen and (max-width: 767px) {
  .search-form {
    flex-direction: column;
    height: auto;
  }

  .line {
    border-right: none;
    border-bottom: 2px solid var(--_primitives---colors--light-cream);
    width: 100%;
    height: 2px;
  }
}

/* FIXES FOR MAPBOX AND INPUTS TO MAKE THEM CLEAN/BORDERLESS */
/* FIXES FOR MAPBOX AND INPUTS TO MAKE THEM CLEAN/BORDERLESS */
.mapboxgl-ctrl-geocoder {
  box-shadow: none !important;
  background-color: transparent !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  height: 100% !important;
  position: relative !important;
  /* Fix for absolute icons */
}

/* The address input container specifically */
.jetboost-map-search-input-6q86 {
  flex: 1.5;
  /* Grow more than others */
  min-width: 0;
  /* Flex fix */
  height: 100%;
  border: none !important;
  padding: 0 !important;
  display: flex;
  align-items: center;
}

.mapboxgl-ctrl-geocoder--input {
  padding: 10px 35px 10px 35px !important;
  /* Padding for both search icon (left) and geolocate icon (right) */
  height: 100% !important;
  border: none !important;
  outline: none !important;
  background: transparent !important;
  font-family: inherit !important;
  font-size: 16px !important;
  /* Increased font size */
  color: #333 !important;
  width: 100% !important;
}

.mapboxgl-ctrl-geocoder--icon-search {
  top: 50% !important;
  transform: translateY(-50%) !important;
  left: 10px !important;
  width: 20px !important;
  height: 20px !important;
  fill: #777 !important;
  position: absolute !important;
  z-index: 10 !important;
  /* Ensure on top */
}

.mapboxgl-ctrl-geocoder--icon-geolocate {
  width: 18px;
  height: 18px;
}

.mapboxgl-ctrl-geocoder--button {
  position: absolute !important;
  right: 10px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10 !important;
  /* Ensure on top */
}

/* Explicitly hide the loading icon that causes shift */

/* Explicitly hide the loading icon that causes shift */
.mapboxgl-ctrl-geocoder--icon-loading {
  display: none !important;
}

/* Keyword input area */
#nc-keyword {
  flex: 1.2;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 10px !important;
  /* reduce padding */
  font-size: 16px;
  /* Increased font size */
  height: 100%;
}

/* Distance selects */
#nc-distance {
  flex: 0.8;
}

/* Button spacing */
#nc-searchBtn {
  margin-left: 12px;
color:#fff;
  /* space from last input/line */
}

/* Force borderless look for inputs to blend into pill */
.form_input,
#nc-keyword,
#nc-address-input,
.mapboxgl-ctrl-geocoder--input {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background-color: transparent !important;
  /* Use background-color only to avoid resetting background-image */
}

/* Remove the white box from the keyword input specifically if it persists */
#nc-keyword {
  padding-left: 12px !important;
}

/* Center alignment fixes */
.search-form {
  align-items: center !important;
}

/* Select arrow fix */
/* Select arrow fix */
#nc-distance {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: url("data:image/svg+xml;charset=UTF-8,%3csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23333333' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e") no-repeat right 14px center;
  background-size: 12px 8px;
  background-color: transparent !important;
  /* Ensure transparent background color */
  padding-right: 32px !important;
  cursor: pointer;
  border: none !important;
  /* Reinforce border removal here */
}

.nc-directory-layout {
  display: grid;
  grid-template-columns: 1fr 600px;
  gap: 20px;
  /* Make result container distinct */
  background: transparent;
}

.nc-search-actions {
  display: flex;
  gap: 12px;
  margin-top: 16px;
  justify-content: center;
}

button.nc-filter-pill.active {
  background-color: #1e2d3b !important;
  border-color: #1e2d3b !important;
}


.nc-filter-pill:hover {
  opacity: 1;
}

.nc-filter-pill.active {
  background: #d66829;
  /* Orange active */
  opacity: 1;
}

#nc-map {
  height: 720px;
  border-radius: 18px;
  overflow: hidden;
  background: #eee
}

#nc-results {
  height: 720px;
  overflow: auto;
  padding: 8px;
  /* Grid for cards */
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  align-content: start;
}

/* Single column for cards on smaller screens */
@media(max-width: 1400px) {
  #nc-results {
    grid-template-columns: 1fr;
  }
}

.nc-card {
  background: var(--card-bg);
  padding: 22px;
  border-radius: 18px;
  margin-bottom: 14px;
  text-align: center;
  box-shadow: 0 2px 0 rgba(0, 0, 0, 0.03)
}

.nc-card h3 {
  margin: 0 0 8px;
  font-size: 18px
}

.nc-search-actions {
  grid-column-gap: 30px;
  grid-row-gap: 30px;
  display: flex;
}

button.nc-filter-pill {
  padding: .3rem 1rem !important;
  font-size: .7rem !important;
  line-height: 1.2 !important;
  transition: all .3s cubic-bezier(.77, 0, .175, 1) !important;
  border-color: #d66829 !important;
  background-color: #d66829 !important;
  color: #fff !important;
  font-weight: 600;
}

.nc-card .specialties {
  color: var(--accent);
  font-weight: 600;
  margin-bottom: 8px;
  white-space: pre-line
}

.nc-card .experience {
  font-size: 12px;
  color: #6b7280;
  margin-bottom: 8px
}

.nc-card .address {
  font-size: 16px;
  color: var(--dark);
  margin-bottom: 12px
}

.nc-card .learn-more {
  display: inline-block;
  background: var(--dark);
  color: #fff;
  padding: 8px 14px;
  border-radius: 20px;
  text-decoration: none
}

.social-icons {
  margin-top: 10px
}

.social-icons a {
  display: inline-block;
  margin: 0 6px;
  color: var(--accent);
  text-decoration: none;
  font-weight: bold
}

/* Google Maps InfoWindow Customization */
.gm-style .gm-style-iw-c {
  padding: 0 !important;
  border-radius: 10px !important;
  box-shadow: 0 14px 32px rgba(0, 0, 0, .18) !important;
}

.gm-style-iw-d {
  overflow: hidden !important;
}

.gm-style .gm-style-iw-t::after {
  box-shadow: 0 14px 32px rgba(0, 0, 0, .18) !important;
}

/* Internal card content */
/* Internal card content */
.nc-hover-card {
  padding: 0px 25px 25px;
  /* More padding top */
  min-width: 280px;
  max-width: 320px;
  background: #fff;
  text-align: center;
  font-family: 'Inter', sans-serif;
  color: #000;
}

.nc-hover-title {
  font-weight: 800;
  /* Extra bold */
  font-size: 20px;
  margin-bottom: 8px;
  line-height: 1.2;
  color: #111;
}

.nc-hover-specialty {
  font-size: 15px;
  color: #d66829;
  /* Orange accent */
  font-weight: 700;
  margin-bottom: 16px;
  line-height: 1.4;
  display: block;
}

.nc-hover-meta {
  font-size: 13px;
  color: #333;
  font-weight: 500;
  margin-bottom: 4px;
}

.nc-hover-address {
  font-size: 13px;
  color: #666;
  margin-bottom: 24px;
  padding: 0 10px;
  line-height: 1.5;
}

.nc-hover-btn {
  display: inline-block;
  background: #0f172a;
  /* Dark blue/black */
  color: #fff !important;
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  padding: 10px 32px;
  border-radius: 999px;
  /* Pill shape */
  margin-bottom: 24px;
  transition: opacity 0.2s;
}

.nc-hover-btn:hover {
  opacity: 0.9;
}

.nc-hover-socials {
  display: flex;
  gap: 16px;
  justify-content: center;
  margin-top: 0;
}

.nc-directory-layout {
  padding-top: 80px;
}

#nc-results .nc-card h3 {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.4;
  font-family: Lato, sans-serif;
}

.specialties {
  font-size: .875rem;
}

a.learn-more {
  display: none !important;
}

.nc-hover-socials a {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #d66829;
  /* Orange background */
  color: #fff !important;
  /* White icon */
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: transform 0.2s;
  border: none;
}

.nc-hover-socials a:hover {
  transform: scale(1.1);
}

.nc-hover-socials a svg {
  width: 18px;
  height: 18px;
}

/* Hide default Google Maps close button if it overlaps or looks bad (optional) */
.gm-style .gm-style-iw-c button[title="Close"] {
  top: 6px !important;
  right: 6px !important;
}
.gm-style-iw-d h3.nc-hover-title {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.4;
}
.gm-style-iw-d .nc-hover-specialty {
    font-size: .875rem;
}
.gm-style-iw-d .nc-hover-meta {
    font-size: .75rem;
}
.gm-style-iw-d .nc-hover-address {
    font-size: .75rem;
}
.gm-style-iw-d a.nc-hover-btn {
    padding: .3rem 1rem;
    font-size: .7rem;
    line-height: 1.2;
}
.gm-style-iw-chr span {
    width: 20px !important;
    height: 20px !important;
}
button.gm-ui-hover-effect {
    width: 40px !important;
    height: 25px !important;
}

/* responsive */
@media(max-width:1024px) {
.nc-hover-content {
    max-width: 80%;
    padding: 0px;
}
}
@media(max-width:767px) {
a#nc-searchBtn {
    width: 100%;
}
input#nc-keyword {
    border-bottom: 2px solid var(--_primitives---colors--light-cream) !important;
}
.mapboxgl-ctrl-geocoder--icon-geolocate {
  width: 25px;
  height: 22px;
}

.mapboxgl-ctrl-geocoder--icon-search {
    left: 2px !important;
    width: 23px !important;
    height: 23px !important;
}
.nc-hover-content {
    overflow-y: auto;
    max-height: 200px !important;
}
  .nc-directory-layout {
    grid-template-columns: 1fr
  }

  #nc-map {
    height: 420px
  }

  #nc-results {
    height: auto
  }
}