/* ============================================================
   gj-code-drop-4 — sidebar rebuild, sold-showcase fixes,
   schools section, explore search & map behavior.
   Pairs with js/gj-patch4.js (+ js/gj-patch4-data.js).
   ============================================================ */

/* ---------- 1. Listing sidebar: buttons first (r3-5) ---------- */
.gj-ldside__cta{display:flex;flex-direction:column;gap:10px;margin:2px 0 4px}
.gj-ldside__cta .gj-btn{width:100%;text-align:center;cursor:pointer;font:inherit}
.gj-btn--ghost{background:#fff;color:#121619;border:1.5px solid #121619}
.gj-btn--ghost:hover{background:#121619;color:#fff}
.gj-ldside__cta .gj-btn[aria-expanded="true"]{opacity:.92;box-shadow:inset 0 0 0 2px rgba(0,0,0,.18)}

.gj-ldside__panel{display:none;margin-top:14px}
.gj-ldside--open .gj-ldside__panel{display:block}
.gj-ldside__panel h4{margin:0 0 10px}

/* Contact fields render only when signed out (Gary's spec) */
.gj-ldside__contact-fields{display:block}
.gj-signed-in .gj-ldside__contact-fields{display:none}
.gj-ldside__signin-note{font-size:13px;line-height:1.45;color:#5a6067;margin:0 0 10px}
.gj-ldside__signin-note a{text-decoration:underline;cursor:pointer}
.gj-ldside__asuser{display:none;font-size:13px;color:#5a6067;margin:0 0 10px}
.gj-signed-in .gj-ldside__asuser{display:block}

.gj-ldside__send{width:100%;cursor:pointer;font:inherit}
.gj-ldside__status{font-size:14px;line-height:1.5;margin:10px 0 0}
.gj-ldside__status.is-ok{color:#1c7c3c}
.gj-ldside__status.is-err{color:#b3261e}
.gj-ldside__call{font-size:13px;text-align:center;color:#5a6067;margin:12px 0 0}
.gj-ldside__call a{font-weight:600}

/* ---------- 2. Sold showcase (soldqa-0/1/3/5/6 + stray offsets) ---------- */
/* Hero: cap the full-screen opener and keep the kicker clear of the fixed header */
.gj-l3hero{min-height:clamp(480px,64vh,760px)!important}
.gj-l3hero .gj-row{padding-top:calc(55px + 4.5vh)!important}
.gj-l3hero .gj-col{padding-bottom:5vh!important}
@media (max-width:640px){
  .gj-l3hero{min-height:0!important}
  .gj-l3hero .gj-row{padding-top:calc(46px + 18px)!important}
  .gj-l3hero .gj-col{padding-bottom:22px!important}
}

/* Hero stat band: JS hides the non-money tiles; keep the five money fields readable */
.gj-p4-hide{display:none!important}
.gj-l3f--hero{gap:10px 26px}

/* Dark-text rescue for "--dark" sections that actually have light backgrounds */
section.gj-fixdark,
.gj-fixdark h1,.gj-fixdark h2,.gj-fixdark h3,.gj-fixdark h4,
.gj-fixdark p,.gj-fixdark li,
.gj-fixdark .cbl__text,.gj-fixdark .cbl__text p,
.gj-fixdark .gj-review__text,.gj-fixdark .gj-review__name,.gj-fixdark .gj-review__loc{color:#121619!important}
.gj-fixdark .gj-kicker .cbl__text,.gj-fixdark .gj-kicker p{color:#6b6b6b!important}
.gj-fixdark a:not(.gj-btn){color:inherit}

/* Highlights: spread the label/value pairs across the content width */
.gj-sold-page .gj-l3f--full{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 36px;max-width:none}
@media (max-width:760px){.gj-sold-page .gj-l3f--full{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 20px}}
.gj-sold-page .gj-l3f--full .gj-l3f__col{min-width:0}

/* Property map relocated directly after the description/highlights section */
.gj-mapmoved{padding:2.5rem 0 3rem}
.gj-mapmoved .gj-container{max-width:1200px}
.gj-mapmoved .gj-ldmap__map{min-height:430px;border-radius:10px}
@media (max-width:640px){.gj-mapmoved .gj-ldmap__map{min-height:320px}}
/* On phones, if the map stays in its original section, lead with it */
@media (max-width:991px){.gj-sold-page .fd-listings__sold-map{order:-1!important}}

/* ---------- 3. Schools in the area (gaps-3) ---------- */
.gj-schools{margin:34px 0 10px}
.gj-schools h2{font-size:24px;line-height:1.3;margin:0 0 14px}
.gj-schools__grp{margin:0 0 12px}
.gj-schools__grp b{display:block;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#6b6b6b;margin:0 0 7px}
.gj-schools__chips{display:flex;flex-wrap:wrap;gap:8px}
.gj-schools__chip{border:1px solid #d9d9d9;border-radius:999px;padding:7px 14px;font-size:13.5px;line-height:1.2;background:#fff;color:#121619}
.gj-schools__chip small{color:#6b6b6b;margin-left:6px}
.gj-schools__src{font-size:12px;color:#6b6b6b;margin:10px 0 0;line-height:1.5}

/* ---------- 4. Explore search: cross-area results + empty state (explore-2) ---------- */
/* Mirrors the theme's #gj-tr2 .grp/.item look without reusing those classes
   (the map's own code iterates .grp/.item and must never see our rows). */
#gj-tr2 .gj-xgrp{margin:8px 8px 4px}
#gj-tr2 .gj-xgrp h3{text-transform:uppercase;color:var(--ink-3,#8a8f98);font-family:inherit;margin:10px 6px 4px!important;font-size:11px!important;line-height:1!important;font-weight:700!important;letter-spacing:.08em!important}
#gj-tr2 .gj-xitem{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:9px;cursor:pointer;color:var(--ink,#121619);font-size:13.5px!important;line-height:1.3!important;margin:0!important;text-decoration:none!important}
#gj-tr2 .gj-xitem:hover,#gj-tr2 .gj-xitem:focus-visible{background:var(--paper-2,#f3eee8);outline:none}
#gj-tr2 .gj-xitem i{width:8px;height:8px;border-radius:50%;flex:0 0 auto;background:#8a8f98}
#gj-tr2 .gj-xitem small{margin-left:auto;color:var(--ink-3,#8a8f98);font-size:11px!important;padding-left:10px;white-space:nowrap}
#gj-tr2 .gj-exsearch__empty{padding:12px 14px;font-size:14px;color:#5a6067}

/* ---------- 5. Map wheel-zoom hint (explore-3) ---------- */
.gj-zoomhint{position:absolute;inset:0;z-index:800;display:flex;align-items:center;justify-content:center;text-align:center;padding:16px;background:rgba(18,22,25,.45);color:#fff;font-size:15px;font-weight:600;letter-spacing:.01em;opacity:0;transition:opacity .25s;pointer-events:none;border-radius:inherit}
.gj-zoomhint.is-on{opacity:1}