/*
 * RR Custom — HOMEPAGE COMMUNITY TABS (migrated 2026-07-09)
 *
 * Source: Elementor -> Site Settings -> Custom CSS (kit post 10), verbatim.
 *
 * The tabbed community switcher on Home (and Ocala): .rr-nav-item tabs swap
 * .rr-panel panels, each hosting an IDX Broker listings widget in .rr-idx-host.
 * Paired markup + JS live in an Elementor HTML widget (Home) -- the JS also
 * injects CSS into the IDX widget's shadow DOM, so it is migrated separately.
 *
 * NAME WARNING: `rr-savedlink-nav` / `rr-savedlink-panels` are the tab-strip and
 * panel-wrapper of THIS component. Despite the name there is no saved-search /
 * favourites feature. The 2026-06-22 code inventory guessed they were dead code;
 * they are load-bearing. Do not remove.
 */

/* IDX Broker Communities widget on Homepage */
.rr-communities-section {
  width: 100%;
}

.rr-savedlink-nav {
  display: flex;
  gap: 56px; /* increased for more luxury spacing */
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 52px;
}

/* NAV ITEMS (UPDATED) */
.rr-nav-item {
  background: transparent !important;
  border: 0;
  padding: 14px 0;
  cursor: pointer;
  font-family: "Inter", Arial, sans-serif;

  font-size: 15px; /* increased */
  font-weight: 700;
  letter-spacing: .18em;

  text-transform: uppercase;
  color: #FAFAF7;

  opacity: .75;
  position: relative;
  transition: opacity .25s ease;
}

/* REMOVE GOLD HOVER */
.rr-nav-item:hover,
.rr-nav-item:focus {
  color: #FAFAF7 !important;
  background: transparent !important;
  opacity: 1;
  outline: none;
}

/* ACTIVE */
.rr-nav-item.is-active {
  opacity: 1;
}

/* UNDERLINE */
.rr-nav-item.is-active::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -14px;
  height: 1px;
  background: #FAFAF7;
}

.rr-savedlink-panels {
  width: 100%;
}

.rr-panel {
  display: none;
}

.rr-panel.is-active {
  display: block;
}

.rr-idx-host {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0 40px;
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s ease;
}

.rr-idx-host.is-ready {
  opacity: 1;
  visibility: visible;
}

.rr-idx-host idx-listings-showcase {
  display: block;
  width: 100%;
}

.rr-community-cta {
  text-align: center;
  margin-top: 34px;
}

.rr-view-all-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 220px;
  padding: 15px 30px;
  border: 0;
  border-radius: 999px;
  background: #FAFAF7;
  color: #0A1F3B;
  text-decoration: none;
  font-family: "Inter", Arial, sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  transition: background-color .25s ease, color .25s ease, opacity .25s ease;
}

.rr-view-all-btn:hover,
.rr-view-all-btn:focus {
  background: #C9A875;
  color: #0A1F3B;
  text-decoration: none;
  opacity: 1;
}

/* RESPONSIVE */

@media (max-width: 1320px) {
  .rr-savedlink-nav {
    gap: 36px;
    margin-bottom: 42px;
  }

  .rr-nav-item {
    font-size: 13px;
  }

  .rr-idx-host {
    padding: 0 32px;
  }
}

@media (max-width: 1024px) {
  .rr-savedlink-nav {
    gap: 24px;
    margin-bottom: 34px;
  }

  .rr-nav-item {
    font-size: 12px;
    letter-spacing: .14em;
  }

  .rr-idx-host {
    padding: 0 24px;
  }

  .rr-view-all-btn {
    min-width: 210px;
    font-size: 12px;
  }
}

@media (max-width: 767px) {
  .rr-savedlink-nav {
    gap: 16px;
    margin-bottom: 24px;
  }

  .rr-nav-item {
    font-size: 11px;
    letter-spacing: .12em;
  }

  .rr-idx-host {
    padding: 0 16px;
  }

  .rr-view-all-btn {
    min-width: 190px;
    padding: 13px 24px;
    font-size: 11px;
  }
}

/* KEEP SCROLL HIDDEN AT SECTION LEVEL ONLY */
/*
 * Doubled class = specificity (0,2,0) rather than (0,1,0). This is the ONE deliberate
 * deviation from the verbatim kit CSS. Elementor's frontend.min.css carries
 * `.e-con { overflow: var(--overflow) }` at the same (0,1,0) specificity, so the winner
 * was decided by source order alone. Emitted inside the kit, this rule came later and
 * won; as a standalone stylesheet it loads before frontend.min.css and lost -- the
 * homepage community strip started scrolling sideways. Raising specificity makes the
 * outcome independent of load order.
 */
.rr-communities-wrap.rr-communities-wrap {
  overflow-x: hidden;
}

/* REMOVE ANY BORDER / OUTLINE ON NAV (INCLUDING HOVER + FOCUS) */
.rr-nav-item,
.rr-nav-item:hover,
.rr-nav-item:focus,
.rr-nav-item:active {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}
