/* === 360DocTalk Search Bar Styling === */

/* Outer wrapper */
.elementor-widget-search-form {
  width: 100%;
  max-width: 700px;
  margin-inline: auto;
}

/* Search field & button alignment */
.elementor-search-form {
  display: flex;
  align-items: stretch;
  overflow: hidden;
  border-radius: 50px; /* round corners */
  border: 2px solid #1aa36f; /* brand green */
  background: #fff;
}

/* Input field */
.elementor-search-form__input {
  flex: 1;
  border: none;
  padding: 14px 18px;
  font-size: 16px;
  border-radius: 50px 0 0 50px;
  outline: none;
  background: transparent;
}

/* Placeholder color */
.elementor-search-form__input::placeholder {
  color: #777;
}

/* Search button */
.elementor-search-form__submit {
  background: linear-gradient(90deg, #0e7b51, #1aa36f);
  color: #fff;
  border: none;
  padding: 0 26px;
  cursor: pointer;
  font-weight: 600;
  transition: all 0.25s ease;
  border-radius: 0 50px 50px 0;
}

/* Hover / focus effects */
.elementor-search-form__submit:hover {
  filter: brightness(1.1);
  transform: translateY(-1px);
}

/* Mobile optimization */
@media (max-width: 768px) {
  .elementor-search-form {
    flex-direction: column;
    border-radius: 20px;
  }

  .elementor-search-form__input {
    border-radius: 20px 20px 0 0;
    padding: 12px 16px;
    font-size: 15px;
  }

  .elementor-search-form__submit {
    width: 100%;
    border-radius: 0 0 20px 20px;
    padding: 12px 0;
    font-size: 16px;
  }
}


/* ===== Find a Doctor page only ===== */
body.page-id-XXXX {
  overflow-x: hidden;
}
body.page-id-XXXX html,
body.page-id-XXXX body {
  max-width: 100%;
  overflow-x: hidden !important;
}

/* Keep all containers within viewport */
body.page-id-XXXX .elementor-section,
body.page-id-XXXX .elementor-container,
body.page-id-XXXX .e-con {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0; /* adjust if you need inner padding */
  padding-right: 0; 
}

/* Flex children shouldn't force row wider than screen */
body.page-id-XXXX .e-con > .e-con,
body.page-id-XXXX .elementor-column,
body.page-id-XXXX .elementor-widget {
  min-width: 0 !important;
}

/* Media (images/video/iframe) never exceed screen width */
body.page-id-XXXX img,
body.page-id-XXXX video,
body.page-id-XXXX iframe {
  max-width: 100% !important;
  height: auto;
  display: block;
}

/* JetEngine / Listing Grid common overflow fix (if you use it) */
body.page-id-XXXX .jet-listing-grid,
body.page-id-XXXX .jet-listing-grid__items,
body.page-id-XXXX .jet-listing-grid__item {
  max-width: 100% !important;
  overflow: hidden;
  box-sizing: border-box;
}

/* Cards/boxes in the doctor grid: prevent subtle overflow from borders/shadows */
body.page-id-XXXX .jet-listing-grid__item > * {
  max-width: 100%;
  overflow: hidden;
}

/* Search/filters bar on that page */
body.page-id-XXXX .elementor-widget-search-form {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  display: block !important;
}

/* Elementor sticky/header elements that sometimes use 100vw on iOS */
body.page-id-XXXX .elementor-sticky--effects,
body.page-id-XXXX .elementor-location-header .e-con[style*="100vw"] {
  width: 100% !important;
}

/* Mobile menu/dropdown shouldn't stick off-screen */
@media (max-width: 767px) {
  body.page-id-XXXX .elementor-nav-menu--dropdown,
  body.page-id-XXXX .elementor-menu-toggle + .elementor-nav-menu__container {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    overflow-x: hidden !important;
  }
}


/* Ensure header logo displays and is sized safely */
.elementor-location-header .elementor-widget-theme-site-logo img,
.elementor-location-header .elementor-widget-image img {
  display: block !important;
  max-height: 64px;   /* adjust to your header height */
  height: auto;
  width: auto;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Prevent overflow from hiding it */
.elementor-location-header,
.elementor-location-header .e-con {
  overflow: visible !important;
}



/* Move only the logo container to the right */
.header-logo {
  margin-left: clamp(24px, 6vw, 140px);   /* adjust the max (140px) to taste */
}

/* Ensure flex doesn’t squeeze the logo to 0 */
.header-logo { 
  flex: 0 0 auto !important;
}

/* Keep it tidy on smaller screens */
@media (max-width: 1024px){
  .header-logo { margin-left: clamp(12px, 4vw, 60px); }
}
@media (max-width: 767px){
  .header-logo { margin-left: 12px; }
}