/**
 * Shared search-UI styles (Events / Studios / Teachers) — used on BOTH sites.
 * Moved verbatim from buddyboss-theme-child/assets/css/custom.css (2026-07-06).
 * The `.buddypress .buddypress-wrap` override rules at the bottom only match on
 * the community site and are harmless on insideyoga.org.
 */
/* ==========================================================================
   Shared search-page heading (Events / Studios / Teachers)
   ========================================================================== */
.iy-search-head {
  margin: 40px 0;
}
/* !important + double class to beat BuddyPress' `body.buddypress .buddypress-wrap h1…h6`
   margin override (specificity 0,2,2) on the Teachers directory. */
.iy-search-head .iy-search-head__title {
  margin: 0 0 4px !important;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.2;
  color: var(--bb-headings-color, #1c2b2c);
}
.iy-search-head .iy-search-head__subtitle {
  margin: 0 !important;
  font-size: 15px;
  line-height: 1.5;
  color: var(--bb-alternate-text-color, #6b6b6b);
}

/* Shared white filter box wrapping filters + footer (Events / Studios / Teachers) */
.iy-search-filters {
  background: var(--iy-card, #fff);
  border: 1px solid var(--iy-line, #e4e4e4);
  border-radius: 16px; /* matches result cards */
  padding: 20px 24px;
  margin-bottom: 20px;
  box-sizing: border-box;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Shared footer row inside the filter box: info left, actions right */
.iy-search-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-top: 1px solid var(--bb-content-border-color, #e4e4e4);
  padding-top: 16px;
}
.iy-search-foot__actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Shared result count text (icon + text) */
.iy-search-count {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--bb-alternate-text-color, #6b6b6b);
}
.iy-search-count i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  line-height: 1;
  flex-shrink: 0;
}
.iy-search-count svg {
  width: 15px;
  height: 15px;
  flex-shrink: 0;
}

/* Shared level/filter pill (Studios / Teachers) — base, hover, active.
   !important on the contested visual props makes these win on ANY page,
   independent of BuddyBoss's high-specificity `button`/`.buddypress-wrap` rules. */
.iy-search-pill {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 6px 14px !important;
  border: 1px solid var(--bb-content-border-color, #e4e4e4) !important;
  border-radius: 100px;
  font-family: inherit;
  font-size: 13px;
  font-weight: 500 !important;
  line-height: 1.4;
  letter-spacing: normal;
  text-transform: none;
  color: var(--bb-body-text-color, #555) !important;
  background: var(--bb-body-background-color, #fafafa) !important;
  cursor: pointer;
  transition: all 0.15s ease;
  user-select: none;
  box-shadow: none !important;
}
.iy-search-pill:hover,
.iy-search-pill:focus {
  border-color: var(--bb-primary-color, #007cff) !important;
  color: var(--bb-primary-color, #007cff) !important;
  background: var(--bb-body-background-color, #fafafa) !important;
}
/* Active state — Studios toggles .is-active on the pill; Teachers uses a checked
   checkbox sibling (.iy-filter-pill__input:checked + .iy-search-pill). */
.iy-search-pill.is-active,
.iy-search-pill.is-active:hover,
.iy-filter-pill__input:checked + .iy-search-pill {
  background: var(--bb-primary-color, #007cff) !important;
  border-color: var(--bb-primary-color, #007cff) !important;
  color: #fff !important;
}

/* Shared "Open Map" toggle — solid teal pill (Events / Studios / Teachers) */
.iy-search-maptoggle {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  padding: 8px 20px !important;
  border: none !important;
  border-radius: 100px;
  background-color: var(--iy-teal, #3b6063) !important;
  color: #fff !important;
  font-size: 13px !important; /* BB's #buddypress button rules override it on /members/ */
  font-weight: 500 !important;
  line-height: 1.4;
  white-space: nowrap !important;
  cursor: pointer;
  transition: background-color 0.2s ease;
  box-shadow: none !important;
}
.iy-search-maptoggle svg {
  width: 15px;
  height: 15px;
  flex-shrink: 0;
}
.iy-search-maptoggle:hover:not(:disabled),
.iy-search-maptoggle:focus,
.iy-search-maptoggle.is-active {
  background-color: color-mix(in srgb, var(--iy-teal, #3b6063) 85%, #000) !important;
  color: #fff !important;
}
.iy-search-maptoggle:disabled,
.iy-search-maptoggle.is-inactive {
  opacity: 0.5;
  cursor: default;
}

/* Shared reset link — red text with X icon (Events / Studios / Teachers) */
.iy-search-reset {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
  font-size: 13px;
  font-weight: 500 !important;
  text-decoration: none;
  color: #d94040 !important;
  cursor: pointer;
  transition: color 0.15s ease;
  box-shadow: none !important;
}
.iy-search-reset svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}
.iy-search-reset:hover,
.iy-search-reset:focus {
  color: #b52e2e !important;
  background: transparent !important;
  text-decoration: none;
}
.iy-search-reset.is-inactive {
  color: var(--bb-content-border-color, #ccc) !important;
  pointer-events: none;
  cursor: default;
}

/* ----------------------------------------------------------------------------
   BuddyPress override guard (Teachers directory).
   BuddyBoss wraps directories in `.buddypress .buddypress-wrap` and applies
   high-specificity generic button/link rules (e.g.
   `.buddypress .buddypress-wrap button:hover` = 0,3,1) plus base button styles
   that hijack display/white-space/background on our single-class shared
   components — causing the map toggle to wrap and hovers to look wrong. Re-assert
   the shared look at matching/higher specificity, scoped to those pages only.
   ---------------------------------------------------------------------------- */
.buddypress .buddypress-wrap .iy-search-maptoggle {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  padding: 8px 20px;
  border: none !important;
  border-radius: 100px;
  background-color: var(--iy-teal, #3b6063) !important;
  color: #fff !important;
  font-weight: 500;
  white-space: nowrap !important;
  line-height: 1.4;
}
.buddypress .buddypress-wrap .iy-search-maptoggle:hover,
.buddypress .buddypress-wrap .iy-search-maptoggle:focus,
.buddypress .buddypress-wrap .iy-search-maptoggle.is-active {
  background-color: color-mix(in srgb, var(--iy-teal, #3b6063) 85%, #000) !important;
  color: #fff !important;
  border: none !important;
}
.buddypress .buddypress-wrap .iy-search-pill:hover,
.buddypress .buddypress-wrap .iy-search-pill:focus {
  border-color: var(--bb-primary-color, #007cff) !important;
  color: var(--bb-primary-color, #007cff) !important;
  background: var(--bb-body-background-color, #fafafa) !important;
}
.buddypress .buddypress-wrap .iy-search-pill.is-active,
.buddypress .buddypress-wrap .iy-filter-pill__input:checked + .iy-search-pill {
  background: var(--bb-primary-color, #007cff) !important;
  border-color: var(--bb-primary-color, #007cff) !important;
  color: #fff !important;
}
.buddypress .buddypress-wrap .iy-search-reset:hover,
.buddypress .buddypress-wrap .iy-search-reset:focus {
  background: transparent !important;
  color: #b52e2e !important;
}