/* ==========================================================================
   asc-idx-client.css
   Shared styles for all ASC IDX widgets:
     - Search widget      (#idx-search, .idx-*)
     - Fixed-search widget (#idx-search + #idx-search-params, .idx-criteria-*)
     - Home widget        (#asc-home-search, .asc-*)
     - Listing detail nav (.idx-listing-back-nav)
   Served at: https://idx.acartarealty.com/widget/asc-idx-client.css
   ========================================================================== */

/* --------------------------------------------------------------------------
   Widget base
   -------------------------------------------------------------------------- */
/* Full-bleed breakout is applied by JS (applyFullBleed in asc-idx-client.js).
   JS uses document.documentElement.clientWidth (excludes scrollbar) and
   getBoundingClientRect().left so it works correctly in Chrome even when the
   OS or user setting causes scrollbars to take up layout space.
   The CSS here only provides layout defaults before JS fires.
   overflow-x: clip (not hidden) is intentional: 'clip' visually clips the full-bleed
   breakout without creating a new scroll container, so position:sticky on the broker
   sidebar still scrolls against the viewport rather than the widget container. */
.idx-widget { overflow-x: clip; padding: 0 20px; box-sizing: border-box; }
.idx-widget * { box-sizing: border-box; font-family: inherit; }

/* Override Ghost Solo theme's word-break: break-word on .gh-about-content / .gh-card-title
   (and any other inherited word-breaking rules) so listing text, addresses, labels,
   and broker card copy never split words at arbitrary characters.
   Covers all widget entry points: search, fixed-search, home, and SSR listing detail. */
.idx-widget,
.idx-widget *,
#idx-ssr-listing,
#idx-ssr-listing * {
  word-break: normal;
  overflow-wrap: normal;
  -webkit-hyphens: none;
  hyphens: none;
}

/* --------------------------------------------------------------------------
   Status badges  (shared: search, fixed-search, home)
   -------------------------------------------------------------------------- */
.idx-status-badge { font-size: 11px; font-weight: 700; padding: 3px 8px; border-radius: 3px; text-transform: uppercase; letter-spacing: .5px; }
.idx-status-active  { background: #dcfce7; color: #166534; }
.idx-status-pending { background: #fef9c3; color: #854d0e; }
.idx-status-other   { background: #f3f4f6; color: #6b7280; }
.idx-status-unknown { background: #f3f4f6; color: #6b7280; }

/* --------------------------------------------------------------------------
   Search form  (search widget only)
   -------------------------------------------------------------------------- */
.idx-form { background: #C0C0C0; border-radius: 8px; padding: 20px; margin-bottom: 24px; }
.idx-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.idx-form-full { grid-column: span 2; }
.idx-form-group { display: flex; flex-direction: column; gap: 4px; }
.idx-form-group label { font-size: 12px; font-weight: 600; color: #555; text-transform: uppercase; letter-spacing: .5px; }
.idx-form-group input,
.idx-form-group select { height: 40px; padding: 0 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px; background: #fff; width: 100%; -webkit-appearance: none; appearance: none; color: inherit; }
.idx-form-group input:focus,
.idx-form-group select:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 2px rgba(37,99,235,.15); }
/* Custom chevron replaces the native OS dropdown arrow stripped by appearance:none */
.idx-form-group select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; padding-right: 32px; }
/* Custom price combo — plain input + fully-styled JS-driven dropdown (no <datalist>).
   <datalist> cannot be styled cross-browser; this replaces it entirely. */
.idx-combo-wrap { position: relative; display: block; }
.idx-combo-wrap::after { content: ''; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); width: 12px; height: 8px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-size: contain; pointer-events: none; }
.idx-combo-wrap input { padding-right: 32px; }
.idx-combo-list { position: absolute; top: calc(100% + 2px); left: 0; right: 0; background: #fff; border: 1px solid #d1d5db; border-radius: 4px; box-shadow: 0 4px 12px rgba(0,0,0,.12); z-index: 9999; max-height: 200px; overflow-y: auto; }
.idx-combo-list[hidden] { display: none; }
.idx-combo-opt { padding: 8px 12px; font-size: 14px; color: #1e293b; cursor: pointer; white-space: nowrap; }
.idx-combo-opt:hover, .idx-combo-opt.idx-combo-active { background: #f1f5f9; }
.idx-form-actions { display: flex; gap: 10px; margin-top: 14px; }

/* --------------------------------------------------------------------------
   Advanced search toggle  (search + fixed-search "New Search" form)
   -------------------------------------------------------------------------- */
/* Inner 2-column grid mirrors idx-form-grid but is nested inside a full-width
   advanced-fields wrapper so the whole section can be shown/hidden at once. */
.idx-advanced-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media(max-width:600px) { .idx-advanced-inner { grid-template-columns: 1fr; } }
.idx-advanced-toggle-wrap { display: flex; align-items: center; }
.idx-advanced-toggle-btn { background: none; border: none; border-top: 1px solid #e5e7eb; padding: 10px 0 2px; font-size: 13px; font-family: inherit; color: #2563eb; cursor: pointer; text-decoration: underline; width: 100%; text-align: left; }
.idx-advanced-toggle-btn:hover { color: #1d4ed8; }
.idx-advanced-fields { padding-top: 4px; }
.idx-advanced-hide-wrap { margin-top: 10px; }

/* --------------------------------------------------------------------------
   Two-column layout — content left (2/3), broker sidebar right (1/3)
   Used on both the search page and listing detail page.
   -------------------------------------------------------------------------- */
.idx-search-layout  { display: flex; gap: 24px; }
.idx-search-main    { flex: 4; min-width: 0; }
.idx-detail-layout  { display: flex; gap: 24px; }
.idx-detail-main    { flex: 4; min-width: 0; }
.idx-broker-sidebar { flex: 0 0 300px; width: 300px; }
.idx-broker-card    { position: sticky; top: 20px; background: #fff; border: 1px solid #e5e7eb; border-radius: 10px; padding: 20px; text-align: center; box-shadow: 0 1px 4px rgba(0,0,0,.07); }
.idx-broker-logo    { max-width: 160px; height: auto; display: block; margin: 0 auto 14px; }
.idx-broker-photo   { width: 130px; height: 130px; border-radius: 50%; object-fit: cover; display: block; margin: 0 auto 14px; border: 3px solid #e5e7eb; }
.idx-broker-name    { font-size: 17px; font-weight: 700; color: #111827; margin-bottom: 3px; }
.idx-broker-company { font-size: 14px; font-weight: 600; color: #2563eb; margin-bottom: 3px; }
.idx-broker-title   { font-size: 13px; color: #6b7280; margin-bottom: 14px; }
.idx-broker-contact { font-size: 13px; color: #374151; line-height: 2.1; }
.idx-broker-contact a { color: #2563eb; text-decoration: none; }
.idx-broker-contact a:hover { text-decoration: underline; }
/* Broker sidebar is always exactly 300px wide. Grid uses auto-fill so listing
   cards are never narrower than 350px; columns reduce automatically so no
   horizontal scroll is ever needed. Sidebar (and its 300px) hides below 800px. */
@media(max-width:800px) {
  .idx-search-layout  { flex-direction: column; }
  .idx-detail-layout  { flex-direction: column; }
  .idx-broker-sidebar { display: none; }
}
.idx-btn { padding: 9px 20px; border: none; border-radius: 4px; cursor: pointer; font-size: 14px; font-weight: 600; }
.idx-btn-primary { background: #2563eb; color: #fff; }
.idx-btn-primary:hover { background: #1d4ed8; }
.idx-btn-secondary { background: #e5e7eb; color: #374151; }
.idx-btn-secondary:hover { background: #d1d5db; }

/* --------------------------------------------------------------------------
   Criteria bar  (fixed-search widget)
   -------------------------------------------------------------------------- */
.idx-criteria-bar { background: #1a3c5e; color: #fff; border-radius: 8px; padding: 14px 20px; margin-bottom: 24px; display: flex; align-items: center; flex-wrap: wrap; gap: 10px; max-width: 900px; margin-left: auto; margin-right: auto; }
.idx-criteria-bar h2 { font-size: 1.5rem; font-weight: 600; margin: 0; flex: 1; min-width: 0; color: #fff; }
.idx-criteria-chip { padding: 0 4px; font-size: 18px; white-space: nowrap; }
.idx-criteria-new-search { background: rgba(255,255,255,.15); border: none; border-radius: 20px; padding: 4px 12px; font-size: 18px; white-space: nowrap; color: #fff; font-family: inherit; line-height: inherit; cursor: pointer; margin: 0 auto 0 0; }
.idx-criteria-new-search:hover { background: rgba(255,255,255,.28); }

/* --------------------------------------------------------------------------
   Results header  (search + fixed-search)
   -------------------------------------------------------------------------- */
.idx-results-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; flex-wrap: wrap; gap: 10px; }
.idx-result-count { font-size: 14px; color: #6b7280; }
.idx-sort { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.idx-sort select { height: 34px; padding: 0 10px; border: 1px solid #ddd; border-radius: 4px; }

/* --------------------------------------------------------------------------
   Property card grid  (search + fixed-search)
   -------------------------------------------------------------------------- */
/* min(350px, 100%) ensures a single card never forces horizontal scroll when
   the container is narrower than 350px (e.g. very small phones). */
.idx-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(350px, 100%), 1fr)); gap: 20px; }

.idx-card { border: 1px solid #e5e7eb; border-radius: 8px; overflow: hidden; cursor: pointer; transition: box-shadow .2s, transform .1s; background: #fff; }
.idx-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.12); transform: translateY(-2px); }
.idx-card-img-wrap { position: relative; display: block; }
.idx-card-img { width: 100%; height: 200px; object-fit: cover; display: block; background: #f3f4f6; }
.idx-card-img-placeholder { width: 100%; height: 200px; background: #f3f4f6; display: flex; align-items: center; justify-content: center; color: #9ca3af; font-size: 13px; }
/* Badge group — absolutely positioned flex row top-left of card photo.
   Spotlight (if present) is always leftmost; condition badge follows to its right. */
.idx-card-badges { position: absolute; top: 10px; left: 10px; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; pointer-events: none; }
.idx-card-condition-badge { border-radius: 4px; padding: 4px 10px; font-size: 11px; font-weight: 700; letter-spacing: .4px; text-transform: uppercase; }
.idx-card-badge--spotlight { background: #7c3aed; color: #fff; }
.idx-card-badge--new-listing { background: #059669; color: #fff; }
.idx-card-badge--new { background: #1a3c5e; color: #fff; }
.idx-card-badge--pre { background: #b45309; color: #fff; }
.idx-card-badge--under { background: #ea580c; color: #fff; }
.idx-card-body { padding: 14px; }
.idx-card-price { font-size: 20px; font-weight: 700; color: #111; margin-bottom: 4px; }
.idx-card-address { font-size: 13px; color: #374151; margin-bottom: 8px; }
.idx-card-meta { font-size: 13px; color: #6b7280; display: flex; gap: 12px; flex-wrap: wrap; }
.idx-card-meta span { white-space: nowrap; }
.idx-card-footer { padding: 10px 14px; background: #f9fafb; border-top: 1px solid #f3f4f6; display: flex; justify-content: space-between; align-items: center; }

/* --------------------------------------------------------------------------
   Pagination  (search + fixed-search)
   -------------------------------------------------------------------------- */
.idx-pagination { display: flex; justify-content: center; gap: 8px; margin-top: 28px; flex-wrap: wrap; }
.idx-page-btn { padding: 7px 13px; border: 1px solid #d1d5db; border-radius: 4px; cursor: pointer; background: #fff; font-size: 13px; }
.idx-page-btn:hover { background: #f3f4f6; }
.idx-page-btn.active { background: #2563eb; color: #fff; border-color: #2563eb; }
.idx-page-btn:disabled { opacity: .4; cursor: default; }

/* --------------------------------------------------------------------------
   State messages  (search + fixed-search)
   -------------------------------------------------------------------------- */
.idx-loading  { text-align: center; padding: 40px; color: #6b7280; }
.idx-error    { text-align: center; padding: 40px; color: #dc2626; }
.idx-no-results { text-align: center; padding: 40px; color: #6b7280; }

/* --------------------------------------------------------------------------
   Listing detail map
   -------------------------------------------------------------------------- */
.idx-map-wrap  { margin: 20px 0; }
.idx-map-label { font-size: 14px; font-weight: 600; color: #374151; margin: 0 0 6px; }
.idx-map       { width: 100%; height: 320px; border-radius: 8px; overflow: hidden; display: block; }

/* --------------------------------------------------------------------------
   Listing detail back/prev/next nav  (listing detail page)
   -------------------------------------------------------------------------- */
.idx-listing-back-nav { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.idx-listing-back-nav a { color: #2563eb; font-size: 14px; text-decoration: none; border: 1px solid #d1d5db; border-radius: 4px; padding: 6px 14px; line-height: 1; white-space: nowrap; }
.idx-listing-back-nav a:hover { background: #f3f4f6; border-color: #9ca3af; }
.idx-nav-prevnext { display: flex; gap: 12px; }
@media(max-width:600px) {
  .idx-listing-back-nav { flex-wrap: wrap; gap: 0; }
  .idx-nav-back { width: 100%; margin-bottom: 8px; }
  .idx-nav-prevnext { width: 100%; justify-content: space-between; }
}

/* --------------------------------------------------------------------------
   Home widget
   -------------------------------------------------------------------------- */
.asc-hero { background: linear-gradient(135deg,#1a3c5e 0%,#2d6a9f 100%); padding: 64px 24px; text-align: center; }
.asc-hero h2 { color: #fff; font-size: 2rem; font-weight: 700; margin: 0 0 8px; }
.asc-hero p { color: rgba(255,255,255,.8); font-size: 1.1rem; margin: 0 0 28px; }
.asc-hero-compact { background: #1a3c5e; padding: 16px 24px; }

.asc-search-bar { display: flex; max-width: 620px; margin: 0 auto; background: #fff; border-radius: 50px; box-shadow: 0 4px 24px rgba(0,0,0,.18); overflow: hidden; }
.asc-search-bar input { flex: 1; border: none; outline: none; padding: 16px 24px; font-size: 1rem; background: transparent; color: #1e293b; min-width: 0; }
.asc-search-bar button { background: #e63946; color: #fff; border: none; padding: 16px 28px; font-size: 1rem; font-weight: 600; cursor: pointer; white-space: nowrap; transition: background .2s; flex-shrink: 0; }
.asc-search-bar button:hover { background: #c1121f; }

.asc-results-bar { display: flex; justify-content: space-between; align-items: center; margin: 24px 0 16px; }
.asc-results-bar h3 { font-size: 1.1rem; color: #1e293b; font-weight: 600; margin: 0; }
.asc-view-all { color: #2d6a9f; font-size: .9rem; font-weight: 600; text-decoration: none; }
.asc-view-all:hover { text-decoration: underline; }

.asc-home-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
@media(max-width:900px) { .asc-home-grid { grid-template-columns: repeat(2,1fr); } }
@media(max-width:560px) { .asc-home-grid { grid-template-columns: 1fr; } }

.asc-home-card { display: block; text-decoration: none; color: inherit; border: 1px solid #e2e8f0; border-radius: 10px; overflow: hidden; background: #fff; box-shadow: 0 2px 8px rgba(0,0,0,.08); transition: transform .15s, box-shadow .15s; }
.asc-home-card:hover { transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0,0,0,.12); }
.asc-home-card-img { width: 100%; height: 180px; object-fit: cover; display: block; background: #f1f5f9; }
.asc-home-card-no-photo { width: 100%; height: 180px; background: #f1f5f9; display: flex; align-items: center; justify-content: center; color: #94a3b8; font-size: .8rem; }
.asc-home-card-body { padding: 14px 16px; }
.asc-home-card-price { font-size: 1.2rem; font-weight: 700; color: #0f172a; margin: 0 0 4px; }
.asc-home-card-meta  { font-size: .82rem; color: #64748b; margin: 0 0 6px; }
.asc-home-card-addr  { font-size: .85rem; color: #475569; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0; }
.asc-spinner    { text-align: center; padding: 48px; color: #64748b; font-size: .95rem; }
.asc-home-error { text-align: center; padding: 32px; color: #dc2626; }
.asc-no-results { text-align: center; padding: 48px; color: #64748b; }

@media(max-width:560px) {
  .asc-hero { padding: 48px 16px; }
  .asc-hero h2 { font-size: 1.5rem; }
  .asc-search-bar button { padding: 16px 18px; font-size: .9rem; }
}

/* --------------------------------------------------------------------------
   Responsive overrides  (search + fixed-search)
   -------------------------------------------------------------------------- */
@media(max-width:600px) {
  .idx-form { padding: 12px 10px; }
  .idx-form-grid { grid-template-columns: 1fr !important; }
  .idx-form-full { grid-column: span 1 !important; }
}

/* ==========================================================================
   SSR search result cards  (rendered by ssr.js / renderListingCards)
   ========================================================================== */
.idx-ssr-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; margin-bottom: 24px; }
@media(max-width:900px) { .idx-ssr-grid { grid-template-columns: repeat(3,1fr); } }
@media(max-width:600px) { .idx-ssr-grid { grid-template-columns: repeat(2,1fr); } }
@media(max-width:480px) { .idx-ssr-grid { grid-template-columns: 1fr; } }

.idx-ssr-card { border: 1px solid #e5e7eb; border-radius: 8px; overflow: hidden; background: #fff; transition: box-shadow .2s, transform .1s; }
.idx-ssr-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.12); transform: translateY(-2px); }
.idx-ssr-card-link { display: block; text-decoration: none; color: inherit; }
.idx-ssr-photo img { width: 100%; height: 200px; object-fit: cover; display: block; }
.idx-ssr-no-photo { width: 100%; height: 200px; background: #f3f4f6; display: flex; align-items: center; justify-content: center; color: #9ca3af; font-size: 13px; }
.idx-ssr-card-body { padding: 14px; }
.idx-ssr-price { font-size: 18px; font-weight: 700; color: #111; display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.idx-ssr-status { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 3px; text-transform: uppercase; letter-spacing: .4px; white-space: nowrap; }
.idx-ssr-status--active { background: #dcfce7; color: #166534; }
.idx-ssr-status--pending,
.idx-ssr-status--active-under-contract { background: #fef9c3; color: #854d0e; }
.idx-ssr-address { font-size: 13px; color: #374151; font-style: normal; margin-bottom: 8px; line-height: 1.4; }
.idx-ssr-specs { list-style: none; margin: 0; padding: 0; display: flex; gap: 10px; flex-wrap: wrap; font-size: 13px; color: #6b7280; }
.idx-ssr-no-results { text-align: center; padding: 40px; color: #6b7280; }
.idx-ssr-disclaimer { font-size: 11px; color: #9ca3af; line-height: 1.6; margin-top: 24px; padding-top: 16px; border-top: 1px solid #e5e7eb; }

/* SSR pagination */
.idx-ssr-pagination { display: flex; justify-content: center; align-items: center; gap: 16px; margin: 32px 0; flex-wrap: wrap; }
.idx-ssr-page-link { padding: 8px 18px; border: 1px solid #d1d5db; border-radius: 4px; font-size: 14px; text-decoration: none; color: #374151; background: #fff; transition: background .15s, border-color .15s; }
.idx-ssr-page-link:hover { background: #f3f4f6; border-color: #9ca3af; }
.idx-ssr-page-disabled { opacity: .4; pointer-events: none; }
.idx-ssr-page-count { font-size: 14px; color: #6b7280; }

/* ==========================================================================
   Listing detail  — matches old inject CSS exactly
   ========================================================================== */

/* Ghost page H1 moved into .idx-detail-main by JS so it spans the content
   column with the broker card to the right. Reset Ghost theme sizing/margin
   and treat it as an in-column heading above the listing content. */
.idx-listing-h1 {
  font-size: 1.35rem;
  font-weight: 700;
  color: #111827;
  line-height: 1.35;
  margin: 0 0 12px;
}

/* Nav bar gets the same in-column treatment — sits below H1, above gallery */
.idx-detail-main > .idx-listing-back-nav { margin-bottom: 16px; }

.idx-detail { background: #fff; max-width: 960px; margin: 0 auto; }

/* Gallery: black background, contain (not crop), nav buttons inside */
.idx-gallery { position: relative; margin-bottom: 20px; background: #000; border-radius: 8px; overflow: hidden; }
.idx-gallery-main { width: 100%; max-height: 480px; object-fit: contain; display: block; }
.idx-gallery-nav { position: absolute; top: 12px; background: rgba(0,0,0,.5); color: #fff; border: none; width: 40px; height: 40px; border-radius: 50%; cursor: pointer; font-size: 18px; display: flex; align-items: center; justify-content: center; z-index: 2; }
.idx-gallery-prev { left: 12px; }
.idx-gallery-next { right: 12px; }
.idx-gallery-nav:hover { background: rgba(0,0,0,.75); }
.idx-gallery-counter { position: absolute; bottom: 12px; right: 16px; background: rgba(0,0,0,.5); color: #fff; font-size: 12px; padding: 3px 8px; border-radius: 3px; pointer-events: none; }

/* Thumbnail strip: separate row below gallery */
.idx-thumbs { display: flex; gap: 8px; overflow-x: auto; padding: 8px 0; margin-bottom: 24px; }
.idx-thumbs::-webkit-scrollbar { height: 4px; }
.idx-thumbs::-webkit-scrollbar-thumb { background: #d1d5db; border-radius: 2px; }
.idx-thumb { width: 80px; height: 60px; object-fit: cover; border-radius: 4px; cursor: pointer; opacity: .6; border: 2px solid transparent; flex-shrink: 0; transition: opacity .15s, border-color .15s; }
.idx-thumb:hover,
.idx-thumb.active { opacity: 1; border-color: #2563eb; }

/* Detail header */
.idx-detail-header { margin-bottom: 16px; }
.idx-detail-price { font-size: 28px; font-weight: 700; margin-bottom: 4px; }
.idx-detail-address { font-size: 16px; color: #374151; margin-bottom: 8px; font-style: normal; line-height: 1.4; }
.idx-detail-meta { display: flex; gap: 20px; flex-wrap: wrap; font-size: 14px; color: #374151; margin-bottom: 16px; }
.idx-detail-meta span { display: flex; align-items: center; gap: 5px; }

/* Data grid */
.idx-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 24px; }
@media(max-width:600px) { .idx-detail-grid { grid-template-columns: 1fr; } }
.idx-detail-section h3 { font-size: 15px; font-weight: 700; border-bottom: 1px solid #e5e7eb; padding-bottom: 6px; margin-bottom: 12px; }
.idx-detail-row { display: flex; justify-content: space-between; font-size: 13px; padding: 5px 0; border-bottom: 1px solid #f3f4f6; }
.idx-detail-row .label { color: #6b7280; }
.idx-detail-row .value { font-weight: 500; text-align: right; max-width: 60%; }

/* Description, attribution, disclaimer */
.idx-remarks { font-size: 14px; line-height: 1.6; color: #374151; white-space: pre-wrap; margin-bottom: 24px; }
.idx-attribution { font-size: 12px; color: #6b7280; margin-bottom: 12px; }
.idx-disclaimer { font-size: 11px; color: #9ca3af; line-height: 1.5; border-top: 1px solid #e5e7eb; padding-top: 16px; margin-top: 16px; }

@media(max-width:600px) {
  .idx-detail-price { font-size: 22px; }
  .idx-detail-meta { gap: 12px; font-size: 13px; }
  .idx-gallery-main { max-height: 260px; }
}

/* --------------------------------------------------------------------------
   Request a Showing — broker card button + listing detail wrap
   -------------------------------------------------------------------------- */
.idx-broker-showing-btn { display: block; width: 100%; margin-top: 14px; }
.idx-detail-showing-wrap { margin: 16px 0; }

/* --------------------------------------------------------------------------
   Request a Showing modal
   -------------------------------------------------------------------------- */
.idx-modal-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,.55);
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
}
/* display:flex on .idx-modal-overlay beats the UA's [hidden]{display:none} because
   author styles always win over user-agent styles regardless of specificity.
   This higher-specificity (class + attribute) rule ensures hidden=true actually hides. */
.idx-modal-overlay[hidden] { display: none; }
.idx-modal-box {
  background: #fff; border-radius: 10px; padding: 32px 28px 24px;
  width: 100%; max-width: 440px; position: relative;
  box-shadow: 0 8px 40px rgba(0,0,0,.22);
}
.idx-modal-close {
  position: absolute; top: 14px; right: 16px; z-index: 1;
  background: none; border: none; font-size: 22px; line-height: 1;
  color: #6b7280; cursor: pointer; padding: 0;
}
.idx-modal-close:hover { color: #111; }
.idx-modal-title { margin: 0 0 4px; font-size: 20px; font-weight: 700; color: #111; }
.idx-modal-subtitle { margin: 0 0 20px; font-size: 14px; color: #6b7280; min-height: 1em; }
.idx-modal-actions { display: flex; gap: 10px; margin-top: 20px; }
.idx-modal-actions .idx-btn { flex: 1; }
.idx-modal-error {
  background: #fef2f2; border: 1px solid #fecaca; color: #991b1b;
  border-radius: 4px; padding: 10px 12px; font-size: 13px; margin-top: 12px;
}
.idx-modal-success {
  text-align: center; padding: 24px 8px;
  font-size: 15px; line-height: 1.6; color: #166534;
  background: #f0fdf4; border-radius: 6px; margin-top: 8px;
}
@media(max-width:480px) {
  .idx-modal-box { padding: 24px 16px 20px; }
  .idx-modal-actions { flex-direction: column; }
}