/* Team Turner IDX — front-end styles. Brand: maroon #721e35 / hover #5c1729,
   navy #374257. Scoped under .tt-idx / .tt-idx-detail so it won't leak. */

.tt-idx, .tt-idx-detail { --tt-maroon:#721e35; --tt-maroon-dk:#5c1729; --tt-navy:#374257; --tt-ink:#20242b; --tt-line:#e6e6ea; }

/* ---- Search form: one row on desktop, wraps gracefully on narrow screens ---- */
.tt-idx-search { background:#fff; border:1px solid var(--tt-line); border-radius:14px; padding:14px; box-shadow:0 8px 30px rgba(0,0,0,.06); }
.tt-idx-search__row { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.tt-idx-search__field { position:relative; flex:2 1 300px; min-width:0; }
.tt-idx-search__q { width:100%; padding:12px 14px; border:1px solid var(--tt-line); border-radius:10px; font-size:16px; box-sizing:border-box; }
.tt-idx-search__row select { flex:0 1 92px; min-width:78px; padding:12px 8px; font-size:14px; }
.tt-idx-search__btn { flex:0 0 auto; padding:12px 26px; background:var(--tt-maroon); color:#fff; border:0; border-radius:10px; font-size:16px; font-weight:700; cursor:pointer; }
.tt-idx-search__btn:hover { background:var(--tt-maroon-dk); }
/* Force field styling past the theme (which strips borders/backgrounds). */
.tt-idx-search input[type="text"], .tt-idx-search select {
	border:1px solid #c7ced7 !important; background:#f6f7f9 !important; border-radius:9px !important; color:#20242b !important; box-sizing:border-box !important;
}
.tt-idx-search input[type="text"]:focus, .tt-idx-search select:focus {
	outline:none !important; border-color:var(--tt-maroon) !important; background:#fff !important; box-shadow:0 0 0 3px rgba(114,30,53,.12) !important;
}

/* ---- "More Options" panel (Property Facts / Home Type / Stories / Amenities) ---- */
/* background:transparent (a real value) + appearance:none, not background:none --
   an unstyled/"none" background left this <button> falling back to native OS
   widget chrome in some environments (rendered as a solid filled box instead
   of transparent), confirmed live 2026-08-13. Every other button on this site
   sets a real background color (white or maroon) and never hit this. */
.tt-idx-more__toggle { display:inline-flex; align-items:center; gap:6px; margin-top:10px; padding:0; background:transparent; -webkit-appearance:none; appearance:none; border:0; color:var(--tt-navy); font-size:13.5px; font-weight:700; cursor:pointer; }
.tt-idx-more__toggle:hover { color:var(--tt-maroon); }
.tt-idx-more__toggle svg { width:15px; height:15px; transition:transform .18s; }
.tt-idx-more__badge { display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; padding:0 5px; border-radius:999px; background:var(--tt-maroon); color:#fff; font-size:11px; font-weight:700; line-height:1; }
.tt-idx-more__toggle.is-open svg, .tt-idx-more__toggle[aria-expanded="true"] svg { transform:rotate(180deg); }
.tt-idx-more { margin-top:14px; padding-top:14px; border-top:1px solid var(--tt-line); }
.tt-idx-more[hidden] { display:none; }
.tt-idx-more__section { margin-bottom:18px; }
.tt-idx-more__section:last-of-type { margin-bottom:12px; }
.tt-idx-more__section h4 { margin:0 0 10px; font-size:13px; font-weight:800; letter-spacing:.03em; text-transform:uppercase; color:var(--tt-navy); }
.tt-idx-more__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px 14px; }
@media (max-width:720px) { .tt-idx-more__grid { grid-template-columns:repeat(2,1fr); } }
.tt-idx-more__grid label { display:flex; flex-direction:column; gap:5px; font-size:12px; font-weight:600; color:#6b7280; }
.tt-idx-more__grid select { width:100%; padding:9px 10px !important; font-size:14px; }
.tt-idx-more__checks { display:flex; flex-wrap:wrap; gap:10px 20px; }
.tt-idx-more__checks label { display:inline-flex; align-items:center; gap:7px; font-size:14px; color:var(--tt-ink); cursor:pointer; }
.tt-idx-more__checks input[type="checkbox"] { width:16px; height:16px; accent-color:var(--tt-maroon); cursor:pointer; }
.tt-idx-more__inline { display:inline-flex; align-items:center; gap:8px; margin-top:12px; font-size:13px; font-weight:600; color:#6b7280; }
.tt-idx-more__inline select { padding:7px 9px !important; font-size:13px; }
.tt-idx-more__note { margin:10px 0 0; font-size:12px; color:#8a94a0; font-style:italic; }
.tt-idx-more__actions { display:flex; align-items:center; gap:16px; padding-top:8px; }
.tt-idx-more__apply { padding:11px 22px; background:var(--tt-maroon); color:#fff; border:0; border-radius:9px; font-size:14px; font-weight:700; cursor:pointer; }
.tt-idx-more__apply:hover { background:var(--tt-maroon-dk); }
.tt-idx-more__reset { font-size:13px; font-weight:600; color:#6b7280; text-decoration:underline; }
.tt-idx-more__reset:hover { color:var(--tt-maroon); }

/* ---- Search box typeahead dropdown ----
   position:fixed, not absolute -- the homepage hero (.s30hero2, a Kadence
   cover block) has overflow:clip, which hard-crops any absolutely-positioned
   descendant at the hero's own edge with NO scrollbar (confirmed live
   2026-08-13: only ~2 rows visible regardless of this list's own max-height/
   overflow-y, because the ancestor clip cuts the paint before the list's own
   scroll can matter). Fixed positioning escapes ALL ancestor overflow
   clipping; top/left/width are computed in JS (initSearchAutocomplete) off
   the input's real position since a fixed element can't rely on a
   relatively-positioned ancestor for placement the way absolute did. */
.tt-idx-search__suggest { position:fixed; z-index:9999; margin:0; padding:6px; list-style:none; background:#fff; border:1px solid var(--tt-line); border-radius:12px; box-shadow:0 16px 40px rgba(0,0,0,.16); max-height:340px; overflow-y:auto; }
.tt-idx-search__suggest[hidden] { display:none; }
.tt-idx-search__suggest li { padding:7px 12px; border-radius:8px; cursor:pointer; display:flex; align-items:baseline; gap:7px; overflow:hidden; }
.tt-idx-search__suggest li + li { margin-top:1px; }
.tt-idx-search__suggest li:hover, .tt-idx-search__suggest li.is-active { background:#f6ecef; }
.tt-idx-search__suggest .tt-sug__label { font-size:14px; font-weight:600; color:var(--tt-ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; }
.tt-idx-search__suggest .tt-sug__sub { font-size:11px; color:#8a94a0; white-space:nowrap; flex:0 0 auto; }
.tt-idx-search__suggest li[data-type="city"] .tt-sug__sub, .tt-idx-search__suggest li[data-type="subdivision"] .tt-sug__sub, .tt-idx-search__suggest li[data-type="area"] .tt-sug__sub { color:var(--tt-maroon); font-weight:600; text-transform:uppercase; font-size:10px; letter-spacing:.03em; }

/* ---- Results bar ---- */
.tt-idx__bar { display:flex; justify-content:space-between; align-items:center; margin:18px 0 12px; gap:12px; flex-wrap:wrap; }
.tt-idx__count { font-size:18px; font-weight:700; color:var(--tt-ink); }
.tt-idx__sort label { font-size:13px; color:var(--tt-navy); display:flex; align-items:center; gap:6px; }
.tt-idx__sort select { padding:8px 10px; border:1px solid var(--tt-line); border-radius:8px; background:#fff; }

/* ---- Layout: listings (left) + sticky map (right) ---- */
.tt-idx { width:100%; }
.tt-idx__layout { display:grid; grid-template-columns:1.25fr 1fr; gap:24px; align-items:start; }
.tt-idx__map { height:82vh; min-height:460px; border-radius:14px; overflow:hidden; border:1px solid var(--tt-line); background:#eef0f3; }
/* Sticky has to live on the WRAP (the actual grid item, whose containing block
   spans the full tall grid row), not the inner map div -- confirmed live
   2026-08-13 (Darrell: "the map is no longer following you down the page").
   Wrapping the map in .tt-idx__map-wrap (for the draw-tool action bar) meant
   #tt-idx-map's own containing block became the wrap itself, which only hugs
   the map's own height with no extra room for the sticky element to travel as
   the page scrolls -- so it stopped visibly sticking. High specificity (id +
   class) to beat a theme rule that forces position:relative; scoped to the
   results map only (the detail map keeps its own styling). */
#tt-idx-map-wrap.tt-idx__map-wrap { position:sticky !important; top:20px; align-self:start; }
.tt-idx__grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
@media (max-width:1024px){
	.tt-idx__layout{ grid-template-columns:1fr; }
	/* .tt-idx__map-wrap, not .tt-idx__map, is the actual grid item now that the
	   map is wrapped (for the draw-tool action bar) -- order has to go on the
	   grid item itself to move the map above the listing grid. */
	.tt-idx__map-wrap{ order:-1; }
	.tt-idx__map{ height:340px; }
	#tt-idx-map-wrap.tt-idx__map-wrap{ position:relative !important; top:0; }
}
@media (max-width:560px){ .tt-idx__grid{ grid-template-columns:1fr; } }
/* The theme wraps pages in .wp-site-blocks with overflow:clip, which disables
   position:sticky. On results pages restore vertical overflow (keep horizontal
   clip so there's still no sideways scroll). */
body.tt-idx-results .wp-site-blocks { overflow-x:clip !important; overflow-y:visible !important; }

/* No map (e.g. demo feed has no coordinates): listings fill the full width. */
.tt-idx__layout--full { grid-template-columns:1fr; }
.tt-idx__layout--full .tt-idx__grid { grid-template-columns:repeat(3,1fr); }
@media (max-width:1024px){ .tt-idx__layout--full .tt-idx__grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .tt-idx__layout--full .tt-idx__grid{ grid-template-columns:1fr; } }

/* ---- Card ---- */
.tt-card { background:#fff; border:1px solid var(--tt-line); border-radius:14px; overflow:hidden; transition:transform .25s cubic-bezier(.22,.61,.36,1), box-shadow .25s; }
.tt-card:hover, .tt-card--hl { transform:translateY(-4px); box-shadow:0 18px 36px rgba(0,0,0,.16); }
.tt-card--hl { border-color:var(--tt-navy); }
.tt-card__media { display:block; position:relative; aspect-ratio:4/3; background:#e9ebee; }
.tt-card__media-link { position:absolute; inset:0; display:block; }
/* position:absolute (not just width/height:100%) so the photo -- an
   in-flow, non-positioned element otherwise -- actually paints ABOVE
   .tt-card__noimg below. Positioned elements always paint above non-
   positioned ones regardless of DOM order, so without this the "No photo"
   placeholder text was rendering as a watermark over real, loaded photos. */
.tt-card__media img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.tt-card__noimg { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#98a0aa; font-size:14px; }
.tt-card__status { position:absolute; top:10px; left:10px; background:var(--tt-maroon); color:#fff; font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; padding:4px 9px; border-radius:6px; }
/* Card-level photo preview arrows -- same visual language as .tt-gallery__nav
   on the listing-detail page, just sized down for a grid card. Always visible
   (not hover-only) so they work the same on touch/mobile as on desktop. */
.tt-card__nav { position:absolute; top:50%; transform:translateY(-50%); width:28px; height:28px; border:0; border-radius:50%; background:rgba(255,255,255,.88); color:#20242b; font-size:17px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:0 2px 8px rgba(0,0,0,.25); z-index:5; }
.tt-card__nav:hover { background:#fff; }
.tt-card__nav:active { transform:translateY(-50%) scale(.94); }
.tt-card__nav--prev { left:8px; }
.tt-card__nav--next { right:8px; }
.tt-card__badges { display:flex; flex-wrap:wrap; gap:6px; padding:10px 14px 0; }
.tt-card__badge { font-size:11px; font-weight:700; letter-spacing:.03em; padding:4px 9px; border-radius:6px; }
.tt-card__badge--new { background:#e7f0e9; color:#2f6b3f; }
.tt-card__badge--open { background:#eaf0f7; color:var(--tt-navy); }
.tt-card__badge--reduced { background:#f7e9ec; color:var(--tt-maroon); }
.tt-card__body { display:block; padding:12px 14px 16px; text-decoration:none; color:var(--tt-ink); }
.tt-card__price { font-size:20px; font-weight:800; color:var(--tt-ink); }
.tt-card__specs { display:flex; gap:12px; font-size:14px; color:var(--tt-navy); margin:4px 0 6px; }
.tt-card__addr { font-size:13px; color:#6b7280; }
.tt-idx__empty { grid-column:1/-1; padding:40px; text-align:center; color:#6b7280; }

/* ---- Pager ---- */
.tt-idx__pager { display:flex; justify-content:center; gap:6px; margin:26px 0; flex-wrap:wrap; }
.tt-idx__pager a, .tt-idx__pager span { padding:8px 13px; border:1px solid var(--tt-line); border-radius:8px; text-decoration:none; color:var(--tt-navy); }
.tt-idx__pager .current { background:var(--tt-maroon); color:#fff; border-color:var(--tt-maroon); }

/* ---- Compliance footer ---- */
.tt-idx-compliance { margin-top:26px; padding-top:16px; border-top:1px solid var(--tt-line); font-size:12px; line-height:1.55; color:#6b7280; }
.tt-idx-compliance__broker { font-weight:700; color:var(--tt-navy); margin:0 0 4px; }
.tt-idx-compliance__courtesy { margin:0 0 4px; }
.tt-idx-compliance p { margin:0 0 4px; }
.tt-idx-compliance__heading { font-size:14px; color:var(--tt-navy); margin:16px 0 10px; }
.tt-idx-compliance__mls { display:flex; gap:14px; align-items:flex-start; margin:0 0 14px; }
.tt-idx-compliance__logo { flex:0 0 auto; width:92px; height:auto; }
.tt-idx-compliance__text { margin:0; }
@media (max-width:560px){ .tt-idx-compliance__logo { width:64px; } }

/* ---- Detail page ---- */
.tt-idx-detail__wrap { max-width:1080px; margin:0 auto; padding:24px 20px 60px; }
.tt-idx-detail__back { display:inline-block; margin-bottom:14px; color:var(--tt-navy); text-decoration:none; font-size:14px; }
.tt-idx-detail__hero { position:relative; border-radius:16px; overflow:hidden; }
.tt-idx-detail__hero img { width:100%; aspect-ratio:3 / 2; height:auto; max-height:72vh; object-fit:cover; object-position:center; display:block; }
.tt-idx-detail__status { position:absolute; top:14px; left:14px; background:var(--tt-maroon); color:#fff; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:5px 11px; border-radius:7px; }
.tt-idx-detail__thumbs { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:8px; }
.tt-idx-detail__thumbs img { width:100%; height:96px; object-fit:cover; border-radius:8px; }
.tt-idx-detail__head { margin:22px 0 10px; }
.tt-idx-detail__pricerow { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.tt-idx-detail__price { font-size:34px; font-weight:800; color:var(--tt-ink); }
.tt-idx-detail__addr { font-size:24px; margin:2px 0 2px; }

/* Share button + fallback menu (native share sheet is used instead when the browser supports it). */
.tt-idx-share { position:relative; flex:0 0 auto; }
.tt-idx-share__btn { display:inline-flex; align-items:center; gap:8px; padding:10px 18px; background:#fff; border:1px solid var(--tt-line); border-radius:999px; font-size:14px; font-weight:600; color:var(--tt-navy); cursor:pointer; transition:border-color .18s, box-shadow .18s, color .18s, transform .18s; }
.tt-idx-share__btn:hover { border-color:var(--tt-maroon); color:var(--tt-maroon); box-shadow:0 6px 16px rgba(114,30,53,.14); transform:translateY(-1px); }
.tt-idx-share__btn svg { width:16px; height:16px; flex:0 0 auto; }
.tt-idx-share__menu { position:absolute; top:calc(100% + 10px); right:0; z-index:70; min-width:210px; margin:0; padding:7px; list-style:none; background:#fff; border:1px solid var(--tt-line); border-radius:14px; box-shadow:0 20px 48px rgba(0,0,0,.18); opacity:0; visibility:hidden; transform:translateY(-6px) scale(.97); transform-origin:top right; pointer-events:none; transition:opacity .16s ease, transform .16s ease, visibility .16s; }
.tt-idx-share__menu.is-open { opacity:1; visibility:visible; transform:translateY(0) scale(1); pointer-events:auto; }
.tt-idx-share__item { display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:9px; text-decoration:none; color:var(--tt-ink); font-size:14px; font-weight:500; cursor:pointer; }
.tt-idx-share__item:hover { background:#f6ecef; }
.tt-idx-share__item svg { width:18px; height:18px; flex:0 0 auto; color:var(--tt-maroon); }
.tt-idx-share__item--copied { color:#2f6b3f; }
.tt-idx-share__item--copied svg { color:#2f6b3f; }
@media (max-width:640px){ .tt-idx-detail__pricerow { flex-wrap:wrap; } .tt-idx-share__menu { right:0; left:auto; } }
.tt-idx-detail__loc { color:#6b7280; }
.tt-idx-detail__specs { list-style:none; display:flex; gap:22px; padding:14px 0; margin:12px 0; border-top:1px solid var(--tt-line); border-bottom:1px solid var(--tt-line); flex-wrap:wrap; }
.tt-idx-detail__specs li { font-size:15px; color:var(--tt-navy); }
.tt-idx-detail__section { margin:24px 0; }
.tt-idx-detail__section h2 { font-size:20px; margin:0 0 10px; }
.tt-idx-detail__section p { line-height:1.7; color:#374151; }
/* Structured spec table: 3 columns of label/value rows on desktop. */
.tt-idx-detail__facts { display:grid; grid-template-columns:repeat(3,1fr); gap:0 40px; margin:10px 0 22px; }
.tt-idx-detail__fact { display:flex; flex-direction:column; gap:1px; padding:10px 0; border-bottom:1px solid var(--tt-line); min-width:0; }
.tt-idx-detail__fact span { font-size:11px; color:#8a94a0; text-transform:uppercase; letter-spacing:.04em; }
.tt-idx-detail__fact strong { font-size:15px; color:var(--tt-ink); font-weight:600; overflow-wrap:anywhere; word-break:break-word; }
@media (max-width:900px){ .tt-idx-detail__facts { grid-template-columns:repeat(2,1fr); gap:0 28px; } }
@media (max-width:560px){ .tt-idx-detail__facts { grid-template-columns:1fr; } }
.tt-idx-detail__source { font-size:12px; color:#8a94a0; margin:8px 0 0; }

/* ---- Similar homes row ---- */
.tt-idx-similar { margin:34px 0 6px; }
.tt-idx-similar__title { font-size:22px; margin:0 0 14px; }
.tt-idx-similar__row { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.tt-sim-card { display:block; background:#fff; border:1px solid var(--tt-line); border-radius:12px; overflow:hidden; text-decoration:none; color:var(--tt-ink); transition:transform .2s, box-shadow .2s; }
.tt-sim-card:hover { transform:translateY(-4px); box-shadow:0 16px 32px rgba(0,0,0,.14); }
.tt-sim-card__media { display:block; position:relative; aspect-ratio:4/3; background:#e9ebee; }
.tt-sim-card__media img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.tt-sim-card__price { display:block; font-size:18px; font-weight:800; padding:10px 12px 0; }
.tt-sim-card__specs { display:block; font-size:13px; color:var(--tt-navy); padding:2px 12px 0; }
.tt-sim-card__addr { display:block; font-size:12px; color:#6b7280; padding:4px 12px 12px; }
@media (max-width:1024px){ .tt-idx-similar__row{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:700px){ .tt-idx-similar__row{ grid-template-columns:repeat(2,1fr); } }
.tt-idx-detail__map { height:360px; border-radius:14px; overflow:hidden; border:1px solid var(--tt-line); background:#eef0f3; }
/* Legend for the beach-access dots on a 30A listing's map (colors match the
   marker colors set in tt-idx.js's initMap -- keep both in sync if either
   changes). Darrell: "no one knows what the dots are for." */
.tt-maplegend { display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:12px; padding:10px 14px; background:#f7f7f9; border-radius:10px; font-size:12.5px; color:var(--tt-ink); }
.tt-maplegend__item { display:inline-flex; align-items:center; gap:7px; }
.tt-maplegend__dot { display:inline-block; width:11px; height:11px; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 1px rgba(0,0,0,.15); flex:0 0 auto; }
.tt-maplegend__dot--home { background:var(--tt-maroon); }
.tt-maplegend__dot--community { background:#e0912f; }
.tt-maplegend__dot--big { background:#0e4d52; }
.tt-maplegend__dot--nbhd { background:#3d8fb0; }
.tt-idx-detail__cta { background:var(--tt-navy); color:#fff; border-radius:16px; padding:26px; margin:28px 0; text-align:center; }
.tt-idx-detail__cta h2 { color:#fff; margin:0 0 6px; }
.tt-idx-detail__ctabtn { display:inline-block; margin-top:12px; background:var(--tt-maroon); color:#fff; padding:13px 30px; border-radius:10px; text-decoration:none; font-weight:700; }
.tt-idx-detail__ctabtn:hover { background:var(--tt-maroon-dk); }

/* ---- 30A beach-access accordion (right rail, under the contact card) ---- */
.tt-idx-ba { border:1px solid var(--tt-line); border-radius:14px; margin:16px 0 0; overflow:hidden; background:#fff; }
.tt-idx-ba__toggle { width:100%; display:flex; align-items:center; justify-content:space-between; gap:8px; background:#fbf7f8; border:0; border-left:4px solid var(--tt-maroon); padding:14px 16px; font-size:15px; font-weight:700; color:var(--tt-ink); cursor:pointer; text-align:left; }
.tt-idx-ba__toggle:hover { background:#f6ecef; }
.tt-idx-ba__caret { transition:transform .2s; color:var(--tt-maroon); }
.tt-idx-ba__toggle.is-open .tt-idx-ba__caret { transform:rotate(180deg); }
.tt-idx-ba__body { padding:14px 16px 16px; }
.tt-idx-ba__label { font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--tt-maroon); font-weight:700; margin-bottom:8px; }
.tt-idx-ba__home { background:#f7f7f9; border-radius:10px; padding:10px 12px; margin:0 0 12px; font-size:13px; line-height:1.5; }
.tt-idx-ba__home a { color:var(--tt-maroon); font-weight:700; text-decoration:none; }
.tt-idx-ba__home--note { background:#fff4ec; color:#7a3b1f; }
.tt-idx-ba__sub { font-weight:700; color:var(--tt-navy); margin:0 0 10px; font-size:13px; }
.tt-idx-ba__disc { font-size:11px; color:#98a0aa; margin:12px 0 0; line-height:1.45; }

/* Beach-access cards */
.tt-ba-cards { display:flex; flex-direction:column; gap:10px; }
.tt-ba-card { border:1px solid var(--tt-line); border-radius:10px; padding:11px 12px; }
.tt-ba-card__top { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:5px; }
.tt-ba-badge { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; padding:3px 8px; border-radius:20px; color:#fff; }
.tt-ba-badge--rba, .tt-ba-badge--park { background:#0e4d52; }
.tt-ba-badge--nbhd { background:#3d8fb0; }
.tt-ba-badge--community { background:#e0912f; }
.tt-ba-card__dist { font-size:13px; font-weight:700; color:var(--tt-navy); }
.tt-ba-card__name { margin:0 0 6px; font-size:15px; color:var(--tt-ink); }
.tt-ba-card__pill { margin-bottom:6px; }
.tt-ba-card__icons { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:9px; }
.tt-ba-amen { font-size:11px; color:var(--tt-navy); background:#eef1f4; border-radius:6px; padding:2px 7px; }
.tt-ba-card__dir { display:inline-block; background:var(--tt-maroon); color:#fff !important; padding:7px 16px; border-radius:8px; font-size:13px; font-weight:700; text-decoration:none; }
.tt-ba-card__dir:hover { background:var(--tt-maroon-dk); }

/* Room-to-sit pills */
.tt-ba-pill { display:inline-block; font-size:11px; font-weight:700; padding:2px 8px; border-radius:20px; }
.tt-ba-pill--room { background:#e3f2e6; color:#1a7f37; }
.tt-ba-pill--wet { background:#fdf0dd; color:#9a6a00; }
.tt-ba-pill--guests { background:#eceaf3; color:#4a4a72; }

/* ---- "Find the beach nearest me" tool ([tt_idx_beach]) ---- */
.tt-beach { --tt-maroon:#721e35; --tt-maroon-dk:#5c1729; --tt-navy:#374257; --tt-line:#e6e6ea; max-width:900px; margin:0 auto; }
.tt-beach__title { margin:0 0 6px; }
.tt-beach__sub { color:#6b7280; margin:0 0 14px; line-height:1.55; }
.tt-beach__btn { background:var(--tt-maroon); color:#fff; border:0; border-radius:10px; padding:13px 26px; font-size:16px; font-weight:700; cursor:pointer; }
.tt-beach__btn:hover { background:var(--tt-maroon-dk); }
.tt-beach__status { font-size:14px; color:var(--tt-navy); margin-top:10px; min-height:20px; }
.tt-beach__map { height:60vh; min-height:360px; border-radius:14px; overflow:hidden; border:1px solid var(--tt-line); background:#eef0f3; margin:16px 0; }
.tt-beach__results { list-style:none; margin:0; padding:0; counter-reset:ttb; }
.tt-beach__item { display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:11px 0; border-bottom:1px solid var(--tt-line); }
.tt-beach__item::before { counter-increment:ttb; content:counter(ttb); flex:0 0 auto; width:24px; height:24px; border-radius:50%; background:var(--tt-navy); color:#fff; font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.tt-beach__name { flex:1 1 auto; font-weight:700; color:var(--tt-ink); }
.tt-beach__meta { font-size:13px; color:#6b7280; display:flex; align-items:center; gap:8px; }
.tt-beach__dir { flex:0 0 auto; background:var(--tt-maroon); color:#fff; padding:6px 14px; border-radius:8px; font-size:13px; text-decoration:none; }
.tt-beach__dir:hover { background:var(--tt-maroon-dk); }
.tt-beach__credit { font-size:11px; color:#98a0aa; margin:10px 0 0; }

/* ===== Detail two-column layout (image left, sticky contact card right) ===== */
/* Full-bleed: the wrap spans the whole screen; the card stays a fixed width and
   the image + details fill the rest (per Darrell — "make the rest the image"). */
.tt-idx-detail__wrap { max-width:none; padding-left:clamp(16px,3vw,48px); padding-right:clamp(16px,3vw,48px); }
.tt-idx-detail__grid { display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:34px; align-items:start; }
.tt-idx-detail__main { min-width:0; }
.tt-idx-detail__aside { position:static; }
/* Hero framing handled by the 3:2 aspect rule above. */
/* Keep prose readable even when the column is very wide. */
.tt-idx-detail__section p { max-width:1000px; }

/* ---- Photo gallery (main + arrows + one-row thumbnail strip) ---- */
.tt-gallery__stage { position:relative; border-radius:16px; overflow:hidden; background:#e9ebee; }
.tt-gallery__main { width:100%; max-height:74vh; object-fit:cover; display:block; }
.tt-gallery__nav { position:absolute; top:50%; transform:translateY(-50%); width:46px; height:46px; border:0; border-radius:50%; background:rgba(255,255,255,.92); color:#20242b; font-size:26px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:0 2px 12px rgba(0,0,0,.28); transition:background .15s, transform .15s; }
.tt-gallery__nav:hover { background:#fff; }
.tt-gallery__nav:active { transform:translateY(-50%) scale(.94); }
.tt-gallery__nav--prev { left:14px; }
.tt-gallery__nav--next { right:14px; }
.tt-gallery__counter { position:absolute; bottom:12px; right:12px; background:rgba(0,0,0,.62); color:#fff; font-size:13px; padding:4px 11px; border-radius:20px; }
.tt-gallery__thumbs { display:flex; align-items:center; gap:8px; margin-top:10px; }
.tt-gallery__tstrip { display:flex; gap:8px; overflow-x:auto; scroll-behavior:smooth; flex:1 1 auto; min-width:0; padding-bottom:4px; scrollbar-width:thin; }
.tt-gallery__tstrip::-webkit-scrollbar { height:6px; }
.tt-gallery__tstrip::-webkit-scrollbar-thumb { background:#cfd4da; border-radius:3px; }
.tt-gallery__thumb { flex:0 0 auto; width:120px; height:82px; padding:0; border:2px solid transparent; border-radius:8px; overflow:hidden; cursor:pointer; background:#e9ebee; line-height:0; }
.tt-gallery__thumb img { width:100%; height:100%; object-fit:cover; display:block; }
.tt-gallery__thumb.is-active { border-color:var(--tt-maroon); }
.tt-gallery__tscroll { flex:0 0 auto; width:36px; height:36px; border-radius:50%; border:1px solid var(--tt-line); background:#fff; color:var(--tt-navy); font-size:18px; line-height:1; cursor:pointer; }
.tt-gallery__tscroll:hover { background:#f2f2f4; }
@media (max-width:560px){ .tt-gallery__thumb { width:96px; height:66px; } }

/* ---- Contact card ---- */
.tt-lead__card { background:#fff; border:1px solid var(--tt-line); border-radius:16px; overflow:hidden; box-shadow:0 14px 40px rgba(0,0,0,.10); }
.tt-lead__photo img { width:100%; height:404px; object-fit:cover; object-position:center 60%; display:block; }
.tt-lead__intro { padding:16px 18px 4px; }
.tt-lead__eyebrow { font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--tt-maroon); font-weight:700; margin:0 0 4px; }
.tt-lead__title { font-size:20px; margin:0 0 4px; color:var(--tt-ink); }
.tt-lead__sub { font-size:13px; color:#6b7280; margin:0; line-height:1.5; }
.tt-lead__call { display:flex; flex-direction:column; align-items:center; gap:1px; margin:14px 18px 0; padding:10px; border:2px solid var(--tt-navy); border-radius:10px; text-decoration:none; color:var(--tt-navy); }
.tt-lead__call span { font-size:11px; text-transform:uppercase; letter-spacing:.05em; }
.tt-lead__call strong { font-size:18px; }
.tt-lead__call:hover { background:var(--tt-navy); color:#fff; }
.tt-lead__form { padding:14px 18px 18px; }
.tt-lead__hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.tt-lead__row { margin-bottom:9px; }
/* !important: the site theme forces inputs borderless/transparent and out-ranks
   plain selectors, so these need it to render as visible, fillable boxes. */
.tt-lead__form input, .tt-lead__form textarea { width:100% !important; padding:11px 12px !important; border:1px solid #c7ced7 !important; border-radius:9px !important; background:#f6f7f9 !important; color:var(--tt-ink) !important; font-size:15px !important; font-family:inherit !important; box-sizing:border-box !important; -webkit-appearance:none !important; appearance:none !important; margin:0 !important; }
.tt-lead__form input::placeholder, .tt-lead__form textarea::placeholder { color:#8a94a0 !important; opacity:1 !important; }
.tt-lead__form input:focus, .tt-lead__form textarea:focus { outline:none !important; border-color:var(--tt-maroon) !important; background:#fff !important; box-shadow:0 0 0 3px rgba(114,30,53,.12) !important; }
.tt-lead__form textarea { resize:vertical !important; min-height:78px; }
.tt-lead__btn { width:100%; padding:13px; background:var(--tt-maroon); color:#fff; border:0; border-radius:10px; font-size:16px; font-weight:700; cursor:pointer; }
.tt-lead__btn:hover { background:var(--tt-maroon-dk); }
.tt-lead__btn:disabled { opacity:.6; cursor:default; }
.tt-lead__consent { font-size:11px; color:#98a0aa; margin:8px 0 0; line-height:1.45; }
.tt-lead__status { margin-top:8px; font-size:14px; }
.tt-lead__ok, .tt-lead__thanks { color:#1a7f37; font-weight:600; }
.tt-lead__err { color:#b32d2e; }
.tt-lead__thanks { padding:24px 6px; text-align:center; font-size:16px; }

/* ---- Mobile sticky ask bar (hidden on desktop) ---- */
.tt-lead-bar { display:none; }
@media (max-width:900px){
	.tt-idx-detail__grid { grid-template-columns:1fr; gap:24px; }
	.tt-idx-detail__aside { position:static; }
	.tt-idx-detail { padding-bottom:74px; } /* room for the fixed bar */
	.tt-lead-bar { display:flex; position:fixed; left:0; right:0; bottom:0; z-index:9990; gap:0; box-shadow:0 -6px 20px rgba(0,0,0,.16); }
	.tt-lead-bar a { flex:1; text-align:center; padding:16px 10px; font-weight:700; text-decoration:none; font-size:16px; }
	.tt-lead-bar__call { background:var(--tt-navy); color:#fff; flex:0 0 34% !important; }
	.tt-lead-bar__ask { background:var(--tt-maroon); color:#fff; }
}

/* ---- Favorites, saved searches, and buyer accounts ---------------------- */

/* "Save this home" heart -- small circle over the card photo. */
/* Bigger circle + bigger/bolder heart than before -- at the old 34px/18px
   size the thin outline anti-aliased into a barely-visible smudge rather than
   a recognizable heart (Darrell: "you would not know that by looking at it,"
   it read as just a plain dot). Saved state fills solid maroon, which is
   effectively "turns red" within our brand palette. */
.tt-card__fav { position:absolute; top:10px; right:10px; z-index:2; width:38px; height:38px; padding:0 !important; border:0; border-radius:999px; background:rgba(255,255,255,.95); box-shadow:0 4px 12px rgba(0,0,0,.2); display:flex; align-items:center; justify-content:center; cursor:pointer; color:var(--tt-navy); transition:transform .15s, color .15s; }
.tt-card__fav:hover { transform:scale(1.1); }
.tt-card__fav svg { width:22px; height:22px; }
.tt-card__fav.is-active { color:var(--tt-maroon); }
.tt-card__fav.is-active:hover { transform:scale(1.15); }

/* Detail-page pill, matching the share button exactly. */
.tt-idx-fav__btn { display:inline-flex; align-items:center; gap:8px; padding:10px 18px; background:#fff; border:1px solid var(--tt-line); border-radius:999px; font-size:14px; font-weight:600; color:var(--tt-navy); cursor:pointer; transition:border-color .18s, box-shadow .18s, color .18s, background .18s; }
.tt-idx-fav__btn:hover { border-color:var(--tt-maroon); color:var(--tt-maroon); box-shadow:0 6px 16px rgba(114,30,53,.14); }
.tt-idx-fav__btn svg { width:16px; height:16px; }
.tt-idx-fav__btn.is-active { background:var(--tt-maroon); border-color:var(--tt-maroon); color:#fff; }

/* "Save this search" control in the results bar. */
.tt-idx__bar-actions { display:flex; align-items:center; gap:10px; }

/* ---- Draw-your-own search area ---- */
.tt-idx__poly-chip { display:inline-flex; align-items:center; gap:6px; margin-left:10px; padding:4px 11px; background:#f7e9ec; color:var(--tt-maroon); border-radius:999px; font-size:12.5px; font-weight:700; text-decoration:none; vertical-align:middle; }
.tt-idx__poly-chip:hover { background:#f0d3d9; }
.tt-idx__draw-btn { display:inline-flex; align-items:center; gap:7px; padding:9px 16px; background:#fff; border:1px solid var(--tt-line); border-radius:999px; font-size:13.5px; font-weight:600; color:var(--tt-navy); cursor:pointer; }
.tt-idx__draw-btn:hover { border-color:var(--tt-maroon); color:var(--tt-maroon); }
.tt-idx__draw-btn svg { width:15px; height:15px; }
.tt-idx__draw-btn.is-active { background:var(--tt-maroon); border-color:var(--tt-maroon); color:#fff; }
.tt-idx__map-wrap { position:relative; }
/* Single positioned overlay stacking the hint above the action buttons --
   keeping them as two independently-absolute-positioned elements previously
   made them overlap exactly (buttons hidden underneath the hint text). */
.tt-idx__draw-overlay { position:absolute; top:14px; left:14px; z-index:20; display:flex; flex-direction:column; gap:8px; max-width:280px; }
.tt-idx__draw-actions { display:flex; gap:8px; background:#fff; padding:8px; border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.18); }
.tt-idx__draw-actions[hidden] { display:none; }
.tt-idx__draw-apply { background:var(--tt-maroon); color:#fff; border:0; border-radius:8px; padding:8px 14px; font-weight:700; font-size:13px; cursor:pointer; }
.tt-idx__draw-apply:hover { background:var(--tt-maroon-dk); }
.tt-idx__draw-clear { background:#f3f4f6; color:var(--tt-ink); border:0; border-radius:8px; padding:8px 14px; font-weight:600; font-size:13px; cursor:pointer; }
.tt-idx__draw-clear:hover { background:#e8e9ec; }
.tt-idx__draw-hint { margin:0; background:#fff; padding:9px 13px; border-radius:10px; box-shadow:0 10px 30px rgba(0,0,0,.18); font-size:12.5px; color:var(--tt-navy); }
.tt-idx__draw-hint[hidden] { display:none; }
.tt-idx__savesearch { position:relative; }
.tt-idx__savesearch-btn { display:inline-flex; align-items:center; gap:7px; padding:9px 16px; background:#fff; border:1px solid var(--tt-line); border-radius:999px; font-size:13.5px; font-weight:600; color:var(--tt-navy); cursor:pointer; }
.tt-idx__savesearch-btn:hover { border-color:var(--tt-maroon); color:var(--tt-maroon); }
.tt-idx__savesearch-btn svg { width:15px; height:15px; }
.tt-idx__savesearch-pop { position:absolute; top:calc(100% + 8px); right:0; z-index:70; width:260px; padding:14px; background:#fff; border:1px solid var(--tt-line); border-radius:14px; box-shadow:0 18px 44px rgba(0,0,0,.18); opacity:0; visibility:hidden; transform:translateY(-6px); transition:opacity .16s, transform .16s, visibility .16s; }
.tt-idx__savesearch-pop.is-open { opacity:1; visibility:visible; transform:translateY(0); }
.tt-idx__savesearch-pop label { display:block; font-size:12.5px; color:var(--tt-navy); font-weight:600; margin-bottom:10px; }
.tt-idx__savesearch-pop input, .tt-idx__savesearch-pop select { width:100% !important; margin-top:5px !important; padding:9px 10px !important; border:1px solid #c7ced7 !important; border-radius:8px !important; background:#f6f7f9 !important; font-size:13.5px !important; box-sizing:border-box !important; }
.tt-idx__savesearch-confirm { width:100%; padding:10px; background:var(--tt-maroon); color:#fff; border:0; border-radius:8px; font-weight:700; cursor:pointer; }
.tt-idx__savesearch-confirm:hover { background:var(--tt-maroon-dk); }

/* Shared login/register panel styling -- used by both the modal and the standalone [tt_idx_account] page. */
.tt-idx-account__tabs { display:flex; gap:6px; margin-bottom:16px; border-bottom:1px solid var(--tt-line); }
.tt-idx-account__tab { flex:1; padding:10px; background:none; border:0; border-bottom:2px solid transparent; font-weight:700; font-size:14px; color:#8a94a0; cursor:pointer; }
.tt-idx-account__tab.is-active { color:var(--tt-maroon); border-bottom-color:var(--tt-maroon); }
.tt-idx-account__row { margin-bottom:10px; }
.tt-idx-account__form input { width:100% !important; padding:11px 12px !important; border:1px solid #c7ced7 !important; border-radius:9px !important; background:#f6f7f9 !important; color:var(--tt-ink) !important; font-size:15px !important; font-family:inherit !important; box-sizing:border-box !important; -webkit-appearance:none !important; appearance:none !important; margin:0 !important; }
.tt-idx-account__form input:focus { outline:none !important; border-color:var(--tt-maroon) !important; background:#fff !important; box-shadow:0 0 0 3px rgba(114,30,53,.12) !important; }
.tt-idx-account__submit { width:100%; padding:12px; margin-top:4px; background:var(--tt-maroon); color:#fff; border:0; border-radius:9px; font-weight:700; font-size:15px; cursor:pointer; }
.tt-idx-account__submit:hover { background:var(--tt-maroon-dk); }
.tt-idx-account__note { font-size:12px; color:#8a94a0; margin:10px 0 0; line-height:1.5; }
.tt-idx-account__lostpw { text-align:center; font-size:13px; margin:10px 0 0; }
.tt-idx-account__lostpw a { color:var(--tt-navy); }
.tt-idx-account__status { min-height:18px; font-size:13px; color:var(--tt-maroon); margin-top:8px; }
.tt-idx-account__hp { position:absolute; left:-9999px; }

/* Modal chrome (results/detail pages only -- the account page renders the panel inline, no overlay). */
.tt-idx-auth-modal[hidden] { display:none; }
.tt-idx-auth-modal__backdrop { position:fixed; inset:0; background:rgba(20,24,29,.55); z-index:9995; }
.tt-idx-auth-modal__panel { position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); z-index:9996; width:min(360px, 90vw); max-height:90vh; overflow-y:auto; background:#fff; border-radius:16px; padding:24px 22px; box-shadow:0 30px 80px rgba(0,0,0,.3); }
.tt-idx-auth-modal__close { position:absolute; top:12px; right:14px; background:none; border:0; font-size:22px; line-height:1; color:#8a94a0; cursor:pointer; }

/* Standalone [tt_idx_account] page. */
.tt-idx-account { max-width:760px; margin:0 auto; }
.tt-idx-account__auth .tt-idx-account__panel { max-width:380px; margin:20px auto; background:#fff; border:1px solid var(--tt-line); border-radius:16px; padding:24px 22px; box-shadow:0 8px 30px rgba(0,0,0,.06); }
.tt-idx-account__header { display:flex; align-items:center; justify-content:space-between; margin:20px 0; }
.tt-idx-account__logout { font-size:14px; color:var(--tt-navy); }
.tt-idx-account__section { margin:28px 0; }
.tt-idx-account__section h3 { font-size:19px; margin:0 0 12px; }
.tt-idx-account__empty { color:#6b7280; font-size:14.5px; }
.tt-idx-account__searches { display:flex; flex-direction:column; gap:10px; }
.tt-idx-account__search-row { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; padding:14px 16px; border:1px solid var(--tt-line); border-radius:12px; }
.tt-idx-account__search-main { display:flex; align-items:center; gap:10px; }
.tt-idx-account__search-label { font-weight:700; color:var(--tt-ink); text-decoration:none; }
.tt-idx-account__search-label:hover { color:var(--tt-maroon); }
.tt-idx-account__badge { background:var(--tt-maroon); color:#fff; font-size:11px; font-weight:700; padding:3px 9px; border-radius:999px; }
.tt-idx-account__badge--paused { background:#8a94a0; }
.tt-idx-account__search-actions { display:flex; align-items:center; gap:10px; font-size:13px; }
.tt-idx-account__search-actions select { padding:6px 8px; border:1px solid var(--tt-line); border-radius:7px; font-size:13px; }
.tt-idx-account__search-actions button { background:none; border:0; color:var(--tt-navy); font-size:13px; font-weight:600; cursor:pointer; text-decoration:underline; }

/* ---- FEMA flood-zone toggle (2026-08-15) ------------------------------- */
.tt-flood-btn{
	margin:10px 0 0 10px; padding:8px 13px; border:0; border-radius:2px;
	background:#fff; color:#3c4043; font:500 14px/1 Roboto,Arial,sans-serif;
	cursor:pointer; box-shadow:0 1px 4px rgba(0,0,0,.3);
}
.tt-flood-btn:hover{ background:#f1f3f4; }
.tt-flood-btn.is-on{ background:#0b5cab; color:#fff; }
.tt-flood-legend{
	margin:0 0 12px 10px; padding:10px 12px; max-width:250px;
	background:rgba(255,255,255,.96); border-radius:4px;
	box-shadow:0 1px 4px rgba(0,0,0,.3);
	font:400 12px/1.45 Roboto,Arial,sans-serif; color:#3c4043;
}
.tt-flood-legend strong{ display:block; margin-bottom:6px; font-size:12px; }
.tt-flood-legend span{ display:flex; align-items:center; gap:7px; margin:3px 0; }
.tt-flood-legend i{ width:13px; height:13px; border:1px solid rgba(0,0,0,.25); flex:0 0 auto; }
.tt-flood-legend em{ display:block; margin-top:8px; font-size:10.5px; line-height:1.4; color:#5f6368; font-style:normal; }
@media(max-width:600px){ .tt-flood-legend{ display:none; } }