/* colors.css imported globally via style.css */
/*
  Dev quick-checks: 11-5-2025
  - Save to auto-format (Prettier). If not formatting, check VS Code default formatter.
  - Stylelint enforces color tokens: avoid hex (use var(--kaplon-...)).
  - Light mode: links = var(--kaplon-blue) hover var(--kaplon-red).
  - Dark mode: links = var(--white); non-link breadcrumb text = var(--white-90).
*/

/* ==========================================================================
  _properties.css – Custom Styles for Property Detail & Listing Pages
  ========================================================================== */
/* ==========================================================================
  Table of Contents
  ========================================================================== */
/**
 * 1.0 City Property Pages Layout
 * 2.0 Property Cards
 * 3.0 Property Details Page
 * 4.0 Property Meta Info
 * 5.0 Labels & Status Tags
 * 6.0 Price & CTA Buttons
 * 7.0 Responsive Overrides
 * 8.0 Dark Mode Overrides
 */

/* ==========================================================================
   1.0 City Property Pages Layout
   ========================================================================== */

/* City property links grid layout */
.property-links-row {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-bottom: 2rem;
}

.property-links {
  display: grid;
  max-width: min(100%, 900px);
  margin: var(--space-5) auto;
  padding: 0;
  list-style: none;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  justify-items: center;
}

.property-links li {
  width: 100%;
  margin: 0;
  padding: 0;
}

.property-links li a {
  display: block;
  width: 100%;
  padding: 0.7rem 1.25rem;
  background: var(--button-red-bg);
  border: none;
  border-radius: var(--btn-radius);
  box-shadow: var(--shadow-sm);
  color: var(--kaplon-white);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.35;
  text-align: center;
  text-decoration: none;
  white-space: normal !important;
  transition:
    background-color 0.2s ease,
    color 0.2s ease,
    box-shadow 0.2s ease;
}

.property-links li a:hover,
.property-links li a:focus,
.property-links li a:active {
  background: var(--button-red-bg-hover);
  box-shadow: var(--shadow-md);
  color: var(--kaplon-white);
  outline: none;
}

/* City property image display */
.city-image-row {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-top: 2rem;
}

.city-image {
  display: flex;
  justify-content: center;
  width: 100%;
  max-width: 400px;
  margin: 0;
  padding: 0;
}

.city-image img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  box-shadow: var(--shadow-sm);
}

@media (max-width: 600px) {
  .property-links {
    flex-direction: column;
    gap: 0.75rem;
  }

  .property-links li a {
    width: 100%;
    min-width: 0;
  }

  .city-image {
    max-width: 100%;
  }
}

/* ==========================================================================
   2.0 Property Cards
   ========================================================================== */

/* Ensure all property card text elements have consistent white text with outline */

/* ======================================================
   Burlington Properties Section Styling
   Scoped to .burlington-properties-section for safety
   ====================================================== */

.burlington-properties-section .property-links li a,
.burlington-properties-section a {
  display: inline-block;
  margin: 0;
  padding: 0.5rem 1rem;
  background: transparent;
  border: 1px solid var(--kaplon-green);
  border-radius: 4px;
  color: var(--kaplon-gray-light);
  font-weight: 500;
  text-decoration: none;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.burlington-properties-section .property-links li a:hover,
.burlington-properties-section a:hover,
.burlington-properties-section .property-links li a:focus,
.burlington-properties-section a:focus {
  background: var(--kaplon-green);
  border-color: var(--kaplon-white);
  color: var(--kaplon-white);
  outline: none;
}

.burlington-properties-section .property-links li a:active,
.burlington-properties-section a:active {
  background: var(--kaplon-green-dark);
  border-color: var(--kaplon-white);
  color: var(--kaplon-white);
}

.burlington-properties-section .btn,
.burlington-properties-section button {
  display: inline-block;
  margin: 0;
  padding: 0.5rem 1.2rem;
  background: var(--kaplon-green);
  border: none;
  border-radius: 4px;
  color: var(--kaplon-white);
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}

.burlington-properties-section .btn:hover,
.burlington-properties-section button:hover,
.burlington-properties-section .btn:focus,
.burlington-properties-section button:focus {
  background: var(--kaplon-green-dark);
  color: var(--kaplon-white);
  outline: none;
}

.burlington-properties-section {
  max-width: min(95%, 1400px);
  margin: var(--space-4) auto;
  padding: var(--space-6);
  background-color: var(--kaplon-blue-dark, var(--kaplon-blue)) !important;
  border-radius: var(--radius-2, 8px);
  box-shadow: var(--shadow-md);
  color: var(--kaplon-white) !important;
  text-align: center;
}

.burlington-properties-section .properties-intro h2 {
  margin-bottom: 1rem;
  color: var(--kaplon-red) !important;
  font-size: clamp(1.75rem, 3vw, 2.25rem);
}

.burlington-properties-section .properties-intro p {
  margin-bottom: 1.5rem;
  color: var(--kaplon-white) !important;
  font-size: 1.125rem;
  line-height: 1.6;
}

.burlington-properties-section .property-links {
  display: grid !important;
  max-width: min(95%, 900px) !important;
  margin: var(--space-5) auto !important;
  padding: 0 !important;
  list-style: none !important;
  gap: 0.75rem !important;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
  justify-items: center !important;
}

.burlington-properties-section .property-links li {
  width: 100% !important;
  margin: 0 !important;
}

.burlington-properties-section .property-links li a {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: var(--space-2) calc(var(--space-2) + var(--space-1));
  background: var(--button-red-bg) !important;
  border-radius: var(--btn-radius, var(--radius-1, 6px));
  color: var(--kaplon-white);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.35;
  text-align: center;
  text-decoration: none;
  white-space: normal !important;
  transition: background-color var(--anim-duration-normal, 0.3s) var(--anim-ease-standard, ease);
  box-sizing: border-box !important;
}

.burlington-properties-section .property-links li a:hover {
  background: var(--button-red-bg-hover) !important;
  color: var(--kaplon-white);
}

.burlington-properties-section .burlington-image img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  box-shadow: var(--shadow-sm);
}

.burlington-properties-section .wp-block-rank-math-faq-block {
  margin-top: 2rem;
}

.burlington-properties-section .rank-math-faq-item {
  margin-bottom: 1rem;
  padding: 1rem;
  background: var(--kaplon-white);
  border: 1px solid var(--kaplon-gray-light);
  border-radius: 6px;
  color: var(--kaplon-blue-dark);
}

.burlington-properties-section .rank-math-question {
  margin-bottom: 0.5rem;
  color: var(--kaplon-red);
}

/* (Reverted) No global positioning context for Similar Listings cards */

/* Property card pricing should use brand red with outline */

/* Property card address styling */
.IDX-wrapper-standard .idx-property-card__address,
.IDX-wrapper-standard .idx-property-card .idx-property-card__address {
  /* Address/title strip accent for card variant */
  padding: 6px 10px !important;
  background-color: var(--kaplon-blue-dark, var(--kaplon-blue)) !important;
  border-bottom: 2px solid var(--color-accent-primary) !important;
  color: var(--white) !important;
  text-shadow: var(--shadow-card-sm) !important;
  border-top-left-radius: 4px !important;
  border-top-right-radius: 4px !important;
}

/* Ensure all text within property cards gets consistent styling */
/* Don't override price elements here to preserve brand red; avoid forcing line-height globally to prevent shifts */
/* Performance: target common text containers instead of all descendants */
.IDX-wrapper-standard .idx-property-card .idx-property-card__details,
.IDX-wrapper-standard .idx-property-card .idx-property-card__address,
.IDX-wrapper-standard .idx-property-card .idx-property-card__meta,
.IDX-wrapper-standard .idx-property-card .idx-property-card__courtesy,
.IDX-wrapper-standard .idx-property-card .idx-property-card__single-item {
  color: var(--white) !important;
  text-shadow: var(--shadow-card-sm) !important;
}

/* Feature-safe outline: only apply stroke where supported */
@supports (-webkit-text-stroke: 1px currentColor) {
  .IDX-wrapper-standard .idx-property-card [class*="price" i] {
    text-shadow: var(--shadow-card-xl) !important;
    -webkit-text-stroke: var(--stroke-card-strong) !important;
  }
}

/* Override any inline styles or other CSS that might interfere, but keep price red */
.IDX-wrapper-standard .idx-property-card :where(span[style*="color"], div[style*="color"], [style*="color"]):not([class*="price" i]) {
  color: var(--white) !important;
  text-shadow: var(--shadow-card-sm) !important;
}

/* Ensure nested elements inside price containers inherit current color */
.IDX-wrapper-standard .idx-property-card [class*="price" i] * {
  color: inherit !important;
}

/* Similar Listings: brand-red chip with white text for price (all modes) */
.IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__listingPrice,
.IDX-wrapper-standard .idx-similar-listings--list [class*="price" i] {
  display: inline-block !important;
  padding: 1px 6px !important;
  background-color: var(--kaplon-red) !important;
  /* tighter chip */
  border-radius: 4px !important;
  box-shadow: var(--shadow-card-md) !important;
  color: var(--white) !important;
  text-shadow: none !important;
  white-space: nowrap !important;
  -webkit-text-stroke: 0 !important;
}

.IDX-wrapper-standard .idx-similar-listings--list [class*="price" i] * {
  color: var(--white) !important;
}

/* Similar Listings: start Bedrooms on a new line below price */
.IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__bedrooms {
  display: block !important;
  clear: both !important;
  margin-top: 2px !important;
}

/* Reserve vertical space so the first line (Bedrooms) starts under the price chip */
.IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__details {
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  padding-top: clamp(24px, 2.8vw, 36px) !important;
}

.IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__listingPrice {
  flex: 0 0 100% !important;
  /* occupy full row so next item wraps */
}

/* Ensure the first line (e.g., Bedrooms) starts below the price chip */
.IDX-wrapper-standard .idx-similar-listings--list :where(.idx-property-card__details)::before {
  display: block !important;
  height: clamp(24px, 2.6vw, 32px) !important;
  content: "" !important;
  /* reserve space for chip */
}

/* ==========================================================================
   2.0 Property Details Page
   ========================================================================== */

/* -------------------------------------------------------------
   Listing Header – IDX Detail Page Polish
   Scope: detail-page header panels (safe selector spread)
   Goals:
   - Subtle raised panel using tokens (light/dark aware)
   - Strong address typography; tabular price; muted meta
   - Minimal divider, responsive sizing
   ------------------------------------------------------------- */
.IDX-wrapper-standard :where(.idx-listing-header, .idx-details__header, .IDX-detailsHeader) {
  display: block;
  margin: 0 0 1rem;
  padding: 1rem 1.25rem;
  background: var(--surface-soft);
  border: 1px solid var(--gray-border);
  border-radius: var(--radius-1, 6px);
  box-shadow: var(--shadow-sm);
}

.IDX-wrapper-standard :where(.idx-listing-header, .idx-details__header, .IDX-detailsHeader) :where(.idx-listing-header__address, .idx-header__address, .idx-details__address, .idx-address) {
  margin: 0;
  color: var(--gray-900);
  font-size: clamp(1.25rem, 2.2vw, 1.75rem);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0.01em;
}

.IDX-wrapper-standard :where(.idx-listing-header, .idx-details__header, .IDX-detailsHeader) :where([class*="price" i]) {
  margin: 0;
  color: var(--kaplon-red);
  font-size: clamp(1.1rem, 2vw, 1.35rem);
  font-weight: 800;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
}

.IDX-wrapper-standard :where(.idx-listing-header, .idx-details__header, .IDX-detailsHeader) :where(.idx-listing-header__meta, .idx-header__meta, .idx-details__meta-top, .idx-mls, .idx-mls-id) {
  margin-top: 0.25rem;
  color: var(--gray-700);
  font-size: 0.95rem;
  letter-spacing: 0.01em;
}

.IDX-wrapper-standard :where(.idx-listing-header, .idx-details__header, .IDX-detailsHeader) :where(.idx-listing-header__divider, .idx-header__divider) {
  display: block;
  height: 1px;
  margin: 0.75rem 0;
  background: transparent;
  border-top: 1px solid var(--gray-border);
}

@media (max-width: 640px) {
  .IDX-wrapper-standard :where(.idx-listing-header, .idx-details__header, .IDX-detailsHeader) {
    padding: 0.75rem 1rem;
  }

  .IDX-wrapper-standard :where(.idx-listing-header, .idx-details__header, .IDX-detailsHeader) :where(.idx-listing-header__address, .idx-header__address, .idx-details__address, .idx-address) {
    font-size: clamp(1.1rem, 4.5vw, 1.4rem);
  }

  .IDX-wrapper-standard :where(.idx-listing-header, .idx-details__header, .IDX-detailsHeader) :where([class*="price" i]) {
    font-size: clamp(1rem, 3.8vw, 1.2rem);
  }
}

/* -------------------------------------------------------------
   IDX Details Main – Card Container
   Scope: .idx-details_main grid on property detail view
   Goal: lift content off background with consistent padding/shadow
   ------------------------------------------------------------- */
.IDX-wrapper-standard :where(.idx-details__main,
  .idx-details_main,
  .IDX-details__main,
  .IDX-detailsMain) {
  margin: clamp(20px, 3vw, 28px) 0;
  padding: clamp(20px, 2.8vw, 32px);
  background: var(--surface-soft);
  border: 1px solid var(--gray-border);
  border-radius: var(--radius-2, 10px);
  box-shadow: var(--shadow-card-md);
  color: var(--text-primary, var(--gray-900));
  row-gap: clamp(18px, 2.2vw, 26px);
}

.IDX-wrapper-standard :where(.idx-details__main,
  .idx-details_main,
  .IDX-details__main,
  .IDX-detailsMain) :where(h2, h3, h4) {
  color: var(--kaplon-blue);
}

.IDX-wrapper-standard :where(.idx-details__main,
  .idx-details_main,
  .IDX-details__main,
  .IDX-detailsMain) :where(p, .IDX-text, span) {
  color: var(--gray-700);
}

/* Ensure price field text is brand red in results main info (light mode) */
.IDX-wrapper-standard :where(.IDX-resultsMainInfo) :where(.IDX-field-listingPrice, .IDX-field-price, .IDX-field-listingprice) :where(.IDX-text) {
  color: var(--kaplon-red);
}

/* -------------------------------------------------------------
   IDX Entry Title Override – Address Hero
   Source request: enhance .entry-title for IDX property header
   ------------------------------------------------------------- */
.IDX-wrapper-standard .entry-title {
  position: relative;
  display: block;
  margin: 1.25rem 0;
  padding: var(--space-4, 20px);
  background: var(--surface-soft);
  border: 1px solid var(--gray-border);
  border-radius: var(--radius-2, 8px);
  box-shadow: var(--shadow-sm);
  color: inherit;
  font-family: "Montserrat", "Open Sans", var(--font-sans, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif);
  font-size: 1.8rem;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
  letter-spacing: 0.01em;
}

.IDX-wrapper-standard .entry-title::after {
  display: block;
  height: 1px;
  margin-top: 0.75rem;
  background: var(--gray-border);
  content: "";
}

@media (max-width: 640px) {
  .IDX-wrapper-standard .entry-title {
    padding: 16px;
    font-size: 1.6rem;
  }
}

/* -------------------------------------------------------------
   IDX Listing Pro – collapsible stacks & sidebar polish
   ------------------------------------------------------------- */
.IDX-wrapper-standard #idx-details-page {
  gap: clamp(20px, 3vw, 40px);
}

.IDX-wrapper-standard #idx-details-page .idx-details-card--collapsible {
  margin: clamp(12px, 1.8vw, 20px) 0;
  overflow: hidden;
  background: var(--white);
  border: 1px solid var(--gray-border);
  border-radius: var(--radius-2, 12px);
  box-shadow: var(--shadow-sm);
}

.IDX-wrapper-standard #idx-details-page .idx-details-card--body {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.85rem 1.25rem;
  background: var(--surface-soft);
  gap: 1rem;
}

.IDX-wrapper-standard #idx-details-page .idx-details-card--title {
  margin: 0;
  color: var(--gray-900);
  font-size: 1.05rem;
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0.01em;
}

.IDX-wrapper-standard #idx-details-page .idx-details-card--collapsible .idx-collapse {
  padding: 0 1.25rem 1.25rem;
  background: var(--white);
  border-top: 1px solid var(--gray-border);
}

.IDX-wrapper-standard #idx-details-page .idx-details-card--collapsible .idx-collapse>*+* {
  margin-top: 0.85rem;
}

.IDX-wrapper-standard #idx-details-page .idx-btn-toggle {
  width: 2.45rem;
  height: 2.45rem;
  background: var(--white);
  border: 1px solid var(--gray-border);
  border-radius: 999px;
  box-shadow: none;
  color: var(--kaplon-blue);
  transition:
    background-color var(--anim-duration-fast, 0.2s) var(--anim-ease-standard, ease),
    border-color var(--anim-duration-fast, 0.2s) var(--anim-ease-standard, ease),
    color var(--anim-duration-fast, 0.2s) var(--anim-ease-standard, ease),
    transform var(--anim-duration-fast, 0.2s) var(--anim-ease-standard, ease);
}

.IDX-wrapper-standard #idx-details-page .idx-btn-toggle:hover {
  background: var(--surface-soft);
  border-color: var(--kaplon-blue);
  color: var(--kaplon-blue);
}

.IDX-wrapper-standard #idx-details-page .idx-btn-toggle:active {
  transform: scale(0.96);
}

.IDX-wrapper-standard #idx-details-page .idx-btn-toggle:focus-visible {
  outline: 2px solid var(--kaplon-red);
  outline-offset: 3px;
}

.IDX-wrapper-standard #idx-details-page .idx-details__sidebar .idx-card,
.IDX-wrapper-standard #idx-details-page .idx-details__sidebar .idx-similar-listings {
  overflow: hidden;
  background: var(--white);
  border: 1px solid var(--gray-border);
  border-radius: var(--radius-2, 12px);
  box-shadow: var(--shadow-card-sm);
}

.IDX-wrapper-standard #idx-details-page .idx-card__links .idx-card-header,
.IDX-wrapper-standard #idx-details-page .idx-similar-listings__header {
  padding: 0.95rem 1.25rem;
  background: var(--surface-soft);
  border-bottom: 1px solid var(--gray-border);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.IDX-wrapper-standard #idx-details-page .idx-card__links .idx-card-body,
.IDX-wrapper-standard #idx-details-page .idx-similar-listings--list {
  padding: 1rem 1.25rem 1.25rem;
  background: var(--white);
}

.IDX-wrapper-standard #idx-details-page .idx-details-link--item {
  display: block;
  padding: 0.55rem 0;
  border-bottom: 1px solid var(--gray-border);
  color: var(--kaplon-blue);
  font-weight: 600;
  letter-spacing: 0.01em;
  transition: color var(--anim-duration-fast, 0.2s) var(--anim-ease-standard, ease);
}

.IDX-wrapper-standard #idx-details-page .idx-details-link--item:last-child {
  border-bottom: 0;
}

.IDX-wrapper-standard #idx-details-page .idx-details-link--item:hover,
.IDX-wrapper-standard #idx-details-page .idx-details-link--item:focus {
  color: var(--kaplon-red);
  text-decoration: none;
}

.IDX-wrapper-standard #idx-details-page .idx-property-card__wrap {
  overflow: hidden;
  background: var(--surface-soft);
  border: 1px solid var(--gray-border);
  border-radius: var(--radius-2, 12px);
  box-shadow: var(--shadow-sm);
}

.IDX-wrapper-standard #idx-details-page .idx-property-card+.idx-property-card {
  margin-top: 1rem;
}

.IDX-wrapper-standard #idx-details-page .idx-property-card__courtesy {
  padding: 0.75rem 1rem 0;
  color: var(--gray-600);
  font-size: 0.85rem;
}

.IDX-wrapper-standard #idx-details-page .idx-property-card__details {
  padding: 0.75rem 1rem 1rem;
}

/* Primary Features/Highlights Section - More specific targeting */
.IDX-wrapper-standard .idx-collapse #idx-primary-features,
.IDX-wrapper-standard .idx-collapse .idx-primary-features--icon-group {
  margin: 0 !important;
  padding: 12px 8px !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Individual feature columns - optimize grid spacing */
.IDX-wrapper-standard .idx-primary-features--icon-group .idx-col {
  margin-bottom: 8px !important;
  padding: 8px 12px !important;
}

/* Highlights layout: force full-width by default; 2 columns on tablet+ */
.IDX-wrapper-standard .idx-primary-features--icon-group .idx-col,
.IDX-wrapper-standard .idx-primary-features--icon-group .idx-col-6 {
  /* Override IDX grid half-width inside Highlights */
  flex: 0 0 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

@media (min-width: 768px) {

  .IDX-wrapper-standard .idx-primary-features--icon-group .idx-col,
  .IDX-wrapper-standard .idx-primary-features--icon-group .idx-col-6 {
    flex: 0 0 50% !important;
    width: 50% !important;
    max-width: 50% !important;
  }
}

/* Target actual container used on IDX: #idx-highlights */
.IDX-wrapper-standard #idx-highlights .idx-col,
.IDX-wrapper-standard #idx-highlights .idx-col-6 {
  flex: 0 0 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

@media (min-width: 768px) {

  .IDX-wrapper-standard #idx-highlights .idx-col,
  .IDX-wrapper-standard #idx-highlights .idx-col-6 {
    flex: 0 0 50% !important;
    width: 50% !important;
    max-width: 50% !important;
  }
}

/* Feature media container */
.IDX-wrapper-standard .idx-primary-features--icon-group .idx-media {
  display: flex !important;
  align-items: center !important;
  padding: 4px 0 !important;
  gap: 10px !important;
}

/* Feature icons */
.IDX-wrapper-standard .idx-primary-features--icon-group :where(.idx-media) img {
  flex-shrink: 0 !important;
  width: 28px !important;
  height: 28px !important;
  opacity: 0.8 !important;
}

/* Feature text content */
.IDX-wrapper-standard .idx-primary-features--icon-group .idx-media-body {
  flex: 1 !important;
}

/* Make the Highlights card span full width of the grid */
.IDX-wrapper-standard #idx-highlights {
  width: 100% !important;
}

/* ======================================================================
   IDX Photo Gallery Page (header + actions)
   URL family: /idx/photogallery/*
   Goals:
   - Normalize brand tokens used by IDX inline CSS variables
   - Improve contrast/typography for price, meta, and status
   - Brand the "View Property" button
   Scope narrowly to the photogallery page container
   ====================================================================== */

/* Brand variables override within photogallery only */
.IDX-wrapper-standard .IDX-page-photogallery {
  color: var(--text-primary, var(--gray-900));
  font-family: var(--font-body, var(--font-sans, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif));
  --idx-primary-color: var(--kaplon-red);
  --idx-secondary-color: var(--kaplon-blue-dark, var(--kaplon-blue));
  --idx-button-color: var(--button-red-bg);
  --idx-button-text-color: var(--white);
  --idx-secondary-button-color: var(--kaplon-blue-dark, var(--kaplon-blue));
  --idx-secondary-button-text-color: var(--white);
}

/* Header typography + price emphasis */
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH__price {
  color: var(--kaplon-red);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH__label-secondary {
  color: var(--gray-700);
  letter-spacing: normal;
}

.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH__value {
  color: var(--gray-800);
  font-weight: 600;
}

/* Additional meta/address pieces in header */
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH__address,
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH__bedBathArea,
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH__city,
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH__state,
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH__zip,
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH__zip5,
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH__vertical-divider {
  color: inherit;
}

/* Layout guard: photogallery header/actions must sit above hero image.
   Normalize legacy float-based rows so titles/buttons do not overlap media. */
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH {
  display: grid;
  row-gap: 0.75rem;
}

.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH :where(.IDX-PIH__row--listingID,
  .IDX-PIH__row--details,
  .IDX-PIH__row--action) {
  float: none !important;
  clear: both;
}

.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}

.IDX-wrapper-standard .IDX-page-photogallery #IDX-photoGallery,
.IDX-wrapper-standard .IDX-page-photogallery .IDX-photo-gallery__container {
  clear: both;
  margin-top: 0.75rem;
}

/* Primary CTA: View Property */
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action .IDX-btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 40px;
  padding: 0.5rem 1rem;
  background-color: var(--button-red-bg);
  border: none;
  border-radius: var(--radius-1, 6px);
  color: var(--white);
  font-weight: 700;
}

/* Variant: outline button in photogallery */
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action .IDX-btn.IDX-btn__outline {
  background-color: transparent;
  border: 2px solid var(--kaplon-red);
  color: var(--kaplon-red);
}

.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action .IDX-btn.IDX-btn__outline:hover,
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action .IDX-btn.IDX-btn__outline:focus {
  background-color: var(--kaplon-blue);
  border-color: var(--kaplon-blue);
  color: var(--white);
}

/* Also brand any hyphenated primary variant or bootstrap-style within photogallery */
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action .IDX-btn-primary,
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action .btn,
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action .btn-primary {
  background-color: var(--button-red-bg);
  border: none;
  color: var(--white);
}

.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action .btn:hover,
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action .btn-primary:hover,
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action .IDX-btn-primary:hover {
  background-color: var(--kaplon-blue);
  color: var(--white);
}

.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action .IDX-btn:hover,
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action .IDX-btn:focus {
  background-color: var(--kaplon-blue);
  color: var(--white);
}

/* Link-style secondary action should still reflect brand */
.IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-btn--link {
  color: var(--kaplon-red) !important;
  text-decoration: underline;
}

/* Dark mode adjustments for photogallery */

/* Prefer parent column override when supported */
/* Enhancement-only: modern browsers widen highlights to full width via :has().
  Safe to remove without visual regressions due to base width overrides above. */
@supports selector(.x:has(> y)) {

  .IDX-wrapper-standard .idx-col-6:has(> #idx-highlights),
  .IDX-wrapper-standard .idx-col:has(> #idx-highlights) {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Feature titles */
.IDX-wrapper-standard .idx-primary-features--icon-group .idx-icon-group--title {
  margin-bottom: 2px !important;
  line-height: 1.2 !important;
}

.IDX-wrapper-standard .idx-property-card .idx-property-card__listingPrice,
.IDX-wrapper-standard .idx-property-card [class*="price"],
.IDX-wrapper-standard .idx-property-card [class*="Price"] {
  margin: 0 !important;
  color: var(--kaplon-red) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

/* Favorite Heart Icon Styling - Red outline only when not favorited */

/* Hide the filled heart by default (not favorited state) */
.IDX-wrapper-standard :where(.idx-details__favorite) :where(.fa-layers) .fa-heart[data-prefix="fas"],
.IDX-wrapper-standard :where(.idx-details__favorite) :where(.svg-inline--fa.fa-heart)[data-prefix="fas"] {
  opacity: 0 !important;
}

/* Show and style the outline heart (not favorited state) */
.IDX-wrapper-standard :where(.idx-details__favorite) :where(.fa-layers) .fa-heart[data-prefix="far"],
.IDX-wrapper-standard :where(.idx-details__favorite) :where(.svg-inline--fa.fa-heart)[data-prefix="far"] {
  opacity: 1 !important;
  color: var(--kaplon-red) !important;
  transition: color var(--anim-duration-fast, 0.2s) var(--anim-ease-standard, ease) !important;
  fill: currentcolor !important;
}

/* When favorited, show filled heart and hide outline */
.IDX-wrapper-standard :where(.idx-details__favorite):where(.favorited, [data-favorited="true"], .active, .is-favorite, .saved) .fa-heart[data-prefix="fas"] {
  opacity: 1 !important;
  color: var(--kaplon-red) !important;
  fill: currentcolor !important;
}

.IDX-wrapper-standard :where(.idx-details__favorite):where(.favorited, [data-favorited="true"], .active, .is-favorite, .saved) .fa-heart[data-prefix="far"] {
  opacity: 0 !important;
}

/* Hover effect */
.IDX-wrapper-standard .idx-details__favorite:hover {
  transform: scale(1.05) !important;
}

.IDX-wrapper-standard .idx-details__favorite:hover :where(.fa-heart[data-prefix="far"]) {
  color: var(--kaplon-red-dark) !important;
}

.IDX-wrapper-standard .idx-details__favorite:hover :where(.fa-heart[data-prefix="fas"]) {
  color: var(--kaplon-red-dark) !important;
}

/* Breadcrumb base styles (applies to light & dark) */
.IDX-wrapper-standard #idx-details-header-breadcrumbs {
  position: relative;
  z-index: 2;
  display: block;
  width: 100%;
  margin-bottom: 2rem;
}

.IDX-wrapper-standard #idx-details-header-breadcrumbs span {
  display: block;
  margin-bottom: 0.5rem;
  font-size: 1.1em;
  font-weight: 600;
  letter-spacing: 0.02em;
  /* Note: color handled in mode theming blocks below */
}

/* IDX detail surfaces: use dark tokens when data-theme toggles */
body[data-theme="dark"] .prop-details,
body[data-theme="dark"] .property-info,
body[data-theme="dark"] .dsidx-info {
  background: var(--dark-surface) !important;
  color: var(--dark-text) !important;
}

body[data-theme="dark"] .idx-breadcrumbs,
body[data-theme="dark"] .idx-breadcrumbs * {
  color: var(--dark-text-strong) !important;
}

body[data-theme="dark"] .idx-photo-nav *,
body[data-theme="dark"] .idx-gallery-controls * {
  filter: invert(100%) brightness(150%);
}

/* Breadcrumb color theming */

/* Breadcrumb text color (base/light mode) */
.IDX-wrapper-standard :where(#idx-details-header-breadcrumbs, #idx-details-header-breadcrumbs *, .idx-topbar__breadcrumbs, .idx-topbar__breadcrumbs *) {
  color: var(--kaplon-blue) !important;
}

/* Breadcrumb text color (forced override for JS-driven dark theme toggle) */
body[data-theme="dark"] .IDX-wrapper-standard :where(#idx-details-header-breadcrumbs, #idx-details-header-breadcrumbs *, .idx-topbar__breadcrumbs, .idx-topbar__breadcrumbs *) {
  color: var(--white) !important;
  text-shadow: var(--shadow-text-strong);
}

/* Breadcrumb container visuals (base/light mode) */
.IDX-wrapper-standard :where(.idx-topbar__breadcrumbs) {
  background-color: transparent !important;
  border-color: var(--gray-border) !important;
}

/* Standard details topbar: contain JS-injected floats/actions so the hero image starts below it */
.IDX-wrapper-standard :where(#idx-details-header, .idx-details__topbar) {
  display: flow-root;
  width: 100%;
  margin-bottom: 1rem;
}

.IDX-wrapper-standard :where(#idx-details-header, .idx-details__topbar) :where(.idx-topbar__header, .idx-topbar__actions) {
  float: none;
  clear: both;
  max-width: 100%;
}

.IDX-wrapper-standard .idx-details__topbar .idx-topbar__header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.75rem 1rem;
}

.IDX-wrapper-standard .idx-details__topbar .idx-topbar__header>* {
  min-width: 0;
}

.IDX-wrapper-standard .idx-details__topbar .idx-topbar__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  margin-top: 0.75rem;
  gap: 0.75rem;
}

.IDX-wrapper-standard .idx-details__topbar .idx-topbar__actions .idx-btn,
.IDX-wrapper-standard .idx-details__topbar .idx-topbar__actions .IDX-btn,
.IDX-wrapper-standard .idx-details__topbar .idx-topbar__actions a {
  margin: 0;
}

.IDX-wrapper-standard :where(#idx-details-page .idx-details__featured-image, #idx-details-page .idx-grid.idx-details__featured-image) {
  clear: both;
  margin-top: 1rem;
}

/* Link colors in property details, sidebar, and similar listings (base/light mode) */
.IDX-wrapper-standard :where(.idx-details__main a, #idx-details-sidebar a, .idx-similar-listings a) {
  color: var(--kaplon-blue) !important;
}

.IDX-wrapper-standard :where(.idx-details__main a:hover, #idx-details-sidebar a:hover, .idx-similar-listings a:hover) {
  color: var(--kaplon-red) !important;
}

/* Similar Listings: courtesy text (base/light mode) */
.IDX-wrapper-standard .idx-similar-listings .idx-property-card__courtesy {
  color: var(--kaplon-blue) !important;
  font-weight: 500 !important;
  text-shadow: var(--shadow-dark-sm) !important;
  letter-spacing: 0.01em !important;
}

.IDX-wrapper-standard #idx-results-navigation {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  max-width: 720px;
  margin: 0.75rem auto 1.25rem;
  padding: 0.25rem 0;
  gap: 0.875rem;
}

.IDX-wrapper-standard #idx-results-navigation .idx-btn {
  flex: 1 1 168px;
  min-width: 168px;
  margin: 0;
  text-align: center;
}

/* Remarks text: brand blue by default (light mode) */

/* Responsive adjustments for smaller screens */
@media (max-width: 768px) {
  .IDX-wrapper-standard .idx-primary-features--icon-group .idx-col {
    margin-bottom: 0 !important;
    padding: 2px 4px !important;
  }

  .IDX-wrapper-standard .idx-primary-features--icon-group .idx-media {
    padding: 1px 0 !important;
    gap: 6px !important;
  }

  .IDX-wrapper-standard .idx-collapse #idx-primary-features,
  .IDX-wrapper-standard .idx-collapse .idx-primary-features--icon-group {
    padding: 4px 0 !important;
  }
}

/* ==========================================================================
   3.0 Property Meta Info
   ========================================================================== */

/* ==========================================================================
   4.0 Labels & Status Tags
   ========================================================================== */

/*
  Status badges on IDX cards/results
  Goals:
  - Ensure the status badge sits clearly over the image (top-left)
  - Provide color-coded styles for common statuses using brand tokens
  - Avoid reliance on markup changes; target common IDX selectors
*/

/* Establish positioning context on cards (covers Similar Listings and results cards) */
.IDX-wrapper-standard :where(.idx-property-card, .IDX-results--cell, .IDX-results--card-content) {
  position: relative !important;
}

/* Base status badge styling and placement (card-level fallback overlay) */
.IDX-wrapper-standard :where(.idx-property-card, .IDX-results--cell) :where(.idx-status,
  .idx-status-badge,
  .idx-label--status,
  .IDX-resultsPropStatus,
  .idx-badge--status,
  .idx-property-card__status,
  .IDX-featuredStatus,
  .IDX-resultsStatus) {
  position: absolute !important;
  top: 8px !important;
  left: 8px !important;
  z-index: 3 !important;
  /* above gradient/details overlays */
  display: inline-block !important;
  padding: 2px 8px !important;
  background-color: var(--kaplon-blue) !important;
  /* default fallback */
  border-radius: var(--radius-1, 6px) !important;
  box-shadow: var(--shadow-card-md) !important;
  color: var(--white) !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
  pointer-events: none !important;
}

/* Card-level color variants to match requested palette */
.IDX-wrapper-standard :where(.idx-property-card, .IDX-results--cell) :where(.idx-status-active) {
  background-color: var(--color-badge-green) !important;
  /* #28a745 */
}

.IDX-wrapper-standard :where(.idx-property-card, .IDX-results--cell) :where(.idx-status-pending) {
  background-color: var(--color-badge-yellow) !important;
  /* #ffc107 */
}

.IDX-wrapper-standard :where(.idx-property-card, .IDX-results--cell) :where(.idx-status-sold) {
  background-color: var(--color-badge-red) !important;
  /* #dc3545 */
}

.IDX-wrapper-standard :where(.idx-property-card, .IDX-results--cell) :where(.idx-status-comingsoon) {
  background-color: var(--kaplon-blue) !important;
}

/* Generic inline status badge (for featured/inline contexts) */
.IDX-wrapper-standard :where(.status-badge,
  .IDX-featuredStatus,
  .IDX-resultsStatus,
  .IDX-results--status) {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 8px !important;
  background-color: var(--kaplon-blue) !important;
  /* default fallback */
  border-radius: var(--radius-1, 6px) !important;
  color: var(--white) !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
}

/* Optional status-badge modifiers (apply when wrapper injects classes) */
.IDX-wrapper-standard .status-badge--active {
  background-color: var(--status-active) !important;
}

.IDX-wrapper-standard .status-badge--pending {
  background-color: var(--status-pending) !important;
}

.IDX-wrapper-standard .status-badge--sold {
  background-color: var(--status-sold) !important;
}

.IDX-wrapper-standard .status-badge--comingsoon {
  background-color: var(--status-comingsoon) !important;
}

/* Ensure badges are not clipped by image wrappers */
.IDX-wrapper-standard :where(.idx-property-card__media, .IDX-results--image, .listing-image-wrapper) {
  overflow: visible !important;
}

/* Ensure image wrappers provide positioning context for overlay */
.IDX-wrapper-standard :where(.idx-property-card__media, .IDX-results--image, .listing-image-wrapper, .IDX-resultsPhoto) {
  position: relative !important;
}

/*
  Overlay status badge (.status-badge) inside image wrappers
  - Absolute positioned at top-left of the property image
  - Uppercase white text, rounded corners, subtle shadow for readability
  - Padding 0.2rem 0.6rem, font-size 0.8rem, bold text
*/
.IDX-wrapper-standard :where(.idx-property-card__media, .IDX-results--image, .listing-image-wrapper, .IDX-resultsPhoto) :where(.status-badge) {
  position: absolute !important;
  top: 8px !important;
  left: 8px !important;
  z-index: 3 !important;
  /* above gradients/details */
  display: inline-flex !important;
  align-items: center !important;
  padding: 0.2rem 0.6rem !important;
  background-color: var(--kaplon-blue) !important;
  /* default fallback */
  border-radius: var(--radius-1, 6px) !important;
  box-shadow: var(--shadow-sm) !important;
  /* subtle shadow for readability */
  color: var(--white) !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
}

/* Map native IDX status elements to the same overlay style when present in image wrappers */
.IDX-wrapper-standard :where(.idx-property-card__media, .IDX-results--image, .listing-image-wrapper, .IDX-resultsPhoto) :where(.idx-status,
  .idx-status-badge,
  .idx-label--status,
  .IDX-resultsPropStatus,
  .idx-badge--status,
  .idx-property-card__status,
  .IDX-featuredStatus,
  .IDX-resultsStatus) {
  position: absolute !important;
  top: 8px !important;
  left: 8px !important;
  z-index: 3 !important;
  display: inline-flex !important;
  align-items: center !important;
  padding: 0.2rem 0.6rem !important;
  background-color: var(--kaplon-blue) !important;
  border-radius: var(--radius-1, 6px) !important;
  box-shadow: var(--shadow-sm) !important;
  color: var(--white) !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
}

/* Color variants for native elements inside image wrappers */
.IDX-wrapper-standard :where(.idx-property-card__media, .IDX-results--image, .listing-image-wrapper, .IDX-resultsPhoto) :where(.idx-status-active) {
  background-color: var(--color-badge-green) !important;
}

.IDX-wrapper-standard :where(.idx-property-card__media, .IDX-results--image, .listing-image-wrapper, .IDX-resultsPhoto) :where(.idx-status-pending) {
  background-color: var(--color-badge-yellow) !important;
}

.IDX-wrapper-standard :where(.idx-property-card__media, .IDX-results--image, .listing-image-wrapper, .IDX-resultsPhoto) :where(.idx-status-sold) {
  background-color: var(--color-badge-red) !important;
}

.IDX-wrapper-standard :where(.idx-property-card__media, .IDX-results--image, .listing-image-wrapper, .IDX-resultsPhoto) :where(.idx-status-comingsoon) {
  background-color: var(--kaplon-blue) !important;
}

/* Overlay badge color variants (exact requested palette via tokens) */
.IDX-wrapper-standard :where(.idx-property-card__media, .IDX-results--image, .listing-image-wrapper, .IDX-resultsPhoto) :where(.status-badge--active) {
  background-color: var(--color-badge-green) !important;
  /* #28a745 */
}

.IDX-wrapper-standard :where(.idx-property-card__media, .IDX-results--image, .listing-image-wrapper, .IDX-resultsPhoto) :where(.status-badge--pending) {
  background-color: var(--color-badge-yellow) !important;
  /* #ffc107 */
}

.IDX-wrapper-standard :where(.idx-property-card__media, .IDX-results--image, .listing-image-wrapper, .IDX-resultsPhoto) :where(.status-badge--sold) {
  background-color: var(--color-badge-red) !important;
  /* #dc3545 */
}

/* Coming Soon not specified; use brand blue for consistency */
.IDX-wrapper-standard :where(.idx-property-card__media, .IDX-results--image, .listing-image-wrapper, .IDX-resultsPhoto) :where(.status-badge--comingsoon) {
  background-color: var(--kaplon-blue) !important;
}

/* Status color system (tokenized) */
.IDX-wrapper-standard :where(.idx-status-active,
  .IDX-badge--success) {
  background-color: var(--status-active) !important;
  color: var(--status-text) !important;
}

.IDX-wrapper-standard :where(.idx-status-pending,
  .IDX-badge--warning) {
  background-color: var(--status-pending) !important;
  color: var(--status-text) !important;
}

.IDX-wrapper-standard :where(.idx-status-sold,
  .IDX-badge--danger) {
  background-color: var(--status-sold) !important;
  color: var(--status-text) !important;
}

.IDX-wrapper-standard :where(.idx-status-comingsoon) {
  background-color: var(--status-comingsoon) !important;
  color: var(--status-text) !important;
}

.IDX-wrapper-standard :where(.idx-status-withdrawn,
  .idx-status-cancelled) {
  background-color: var(--gray-dark) !important;
  color: var(--status-text) !important;
}

/* Detail page hero badge (e.g., ACTIVE/PENDING in overview) */
:where(.IDX-wrapper-standard, .idx-wrapper-full, #IDX-main) :where([class*="prop-status" i]) .idx-badge {
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
  min-width: 120px;
  padding: 0.4rem 1.25rem !important;
  background-color: var(--kaplon-blue) !important;
  border-radius: var(--radius-1, 6px) !important;
  box-shadow: var(--shadow-card-md);
  color: var(--status-text) !important;
  font-family: var(--font-sans, "Montserrat", "Open Sans", sans-serif) !important;
  font-size: 0.9rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
}

:where(.IDX-wrapper-standard, .idx-wrapper-full, #IDX-main) :where([class*="prop-status" i]) .idx-badge,
:where(.IDX-wrapper-standard, .idx-wrapper-full, #IDX-main) :where([class*="prop-status" i]) .idx-badge *,
:where(.IDX-wrapper-standard, .idx-wrapper-full, #IDX-main) :where([class*="prop-status" i]) .IDX-field-propStatus,
:where(.IDX-wrapper-standard, .idx-wrapper-full, #IDX-main) :where([class*="prop-status" i]) .IDX-field-propStatus * {
  color: var(--white) !important;
}

:where(.IDX-wrapper-standard, .idx-wrapper-full, #IDX-main) :where([class*="prop-status" i]) .idx-status-active {
  background-color: var(--status-active) !important;
}

:where(.IDX-wrapper-standard, .idx-wrapper-full, #IDX-main) :where([class*="prop-status" i]) .idx-status-pending {
  background-color: var(--status-pending) !important;
}

:where(.IDX-wrapper-standard, .idx-wrapper-full, #IDX-main) :where([class*="prop-status" i]) .idx-status-sold {
  background-color: var(--status-sold) !important;
}

:where(.IDX-wrapper-standard, .idx-wrapper-full, #IDX-main) :where([class*="prop-status" i]) .idx-status-comingsoon {
  background-color: var(--status-comingsoon) !important;
}

:where(.IDX-wrapper-standard, .idx-wrapper-full, #IDX-main) :where([class*="prop-status" i]) :where(.idx-status-withdrawn, .idx-status-cancelled) {
  background-color: var(--gray-dark) !important;
}

/* ==========================================================================
   5.0 Price & CTA Buttons
   ========================================================================== */

/* --------------------------------------------------------------------------
   IDX Price Badges – Spacing & Legibility Resets
   Scope: Similar Listings, IDX sidebar, and IDX results areas
   Rationale: Neutralize global tracking/casing and ensure compact, readable chips
--------------------------------------------------------------------------- */
.IDX-wrapper-standard :where(.idx-similar-listings, #idx-details-sidebar, .IDX-results) :where([class*="price" i]) {
  display: inline-block !important;
  padding: 0.15rem 0.5rem !important;
  line-height: 1.1 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  word-spacing: normal !important;
  white-space: nowrap !important;
  font-kerning: normal !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  font-variant-numeric: tabular-nums !important;
}

/* Keep nested nodes inheriting current color inside price containers */
.IDX-wrapper-standard :where(.idx-similar-listings, #idx-details-sidebar, .IDX-results) :where([class*="price" i]) * {
  color: inherit !important;
}

/* --------------------------------------------------------------------------
   IDX Address Strip – Color & Contrast
   Goals: Force inner anchors to white, remove tracking/casing, protect :visited
--------------------------------------------------------------------------- */
.IDX-wrapper-standard :where(.idx-similar-listings, #idx-details-sidebar, .IDX-results) :where([class*="address" i] a) {
  color: var(--white) !important;
  line-height: 1.2 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
}

/* Prevent visited turning purple/gray */
.IDX-wrapper-standard :where(.idx-similar-listings, #idx-details-sidebar, .IDX-results) :where([class*="address" i] a:link,
  [class*="address" i] a:visited) {
  color: var(--white) !important;
}

/* Optional readability boost over imagery */
.IDX-wrapper-standard :where(.idx-similar-listings, #idx-details-sidebar) :where([class*="address" i]) {
  text-shadow: 0 1px 1px color-mix(in srgb, black 40%, transparent) !important;
}

/* ==========================================================================
   6.0 Responsive Overrides
   ========================================================================== */

/* ==========================================================================
   7.0 Mode-agnostic defaults (layout & typography moved here)
   --------------------------------------------------------------------------
   Keep layout, spacing and typography in mode-agnostic rules. Dark-mode
   blocks must only change color/visual tokens. These defaults are minimal
   and conservative: they replicate the layout/typography values used below
   so the dark-mode section can remain colors-only.
   ========================================================================== */

/* Mode-agnostic: section header layout / typography (used by IDX panels) */
.IDX-wrapper-standard .IDX-section>.IDX-section-header,
.IDX-wrapper-standard .IDX-panel>.IDX-panel-header {
  padding: 10px 18px;
  box-shadow: var(--shadow-dark-sm);
  font-size: 1.08rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

/* Mode-agnostic: card-style inner containers for details/main data */
.IDX-wrapper-standard .IDX-details__main,
.IDX-wrapper-standard .IDX-results--cell-inner-wrapper {
  margin-bottom: 18px;
  padding: 18px 22px;
  border-radius: 8px;
  box-shadow: var(--shadow-dark-sm);
  color: var(--text-primary, var(--gray-900));
}

/* Mode-agnostic: spacing for section/panel groups */
.IDX-wrapper-standard .IDX-section,
.IDX-wrapper-standard .IDX-fieldGroup,
.IDX-wrapper-standard .IDX-panel,
.IDX-wrapper-standard .IDX-panel-default {
  margin-bottom: 24px;
}

/* Mode-agnostic: similar-listings card wrap (keep layout out of dark-mode) */
.IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__wrap {
  padding: 0 !important;
  background-color: var(--surface-1) !important;
  border-color: var(--gray-border) !important;
}

/* Mode-agnostic: label weight inside price fields */
.IDX-wrapper-standard :where(.IDX-field-listingPrice, .IDX-field-price, .IDX-field-listingprice) :where(.IDX-label) {
  font-weight: 600 !important;
}

/* Mode-agnostic: listing description/body copy line-height */
.IDX-wrapper-standard :where(.idx-details-overview__remarks,
  .idx-details__description,
  .idx-description,
  .idx-section__body p) {
  line-height: 1.6 !important;
}

/* Mode-agnostic: price field text weight/number shaping */
.IDX-wrapper-standard :where(.IDX-field-listingPrice, .IDX-field-price, .IDX-field-listingprice) :where(.IDX-text) {
  font-weight: 700 !important;
  font-variant-numeric: tabular-nums !important;
}

/* ==========================================================================
   7.1 Dark Mode Overrides
   ========================================================================== */

/* Match Helpful Tools card header color to button color */
.IDX-wrapper-standard .idx-card-header {
  color: var(--kaplon-blue) !important;
}

/* No dark-mode override needed; same color in both modes */

/* --------------------------------------------------------------------------
   PATCH: Ensure Similar Listings price stays white (anchor-safe)
   Scope: Similar Listings list items only
   Rationale: Parent theme and generic price rules color anchors red.
----------------------------------------------------------------------------*/
.IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__listingPrice,
.IDX-wrapper-standard .idx-similar-listings--list [class*="price" i],
/* if price is an <a> or nested inside one */
.IDX-wrapper-standard .idx-similar-listings--list :where(a[class*="price" i], a .idx-property-card__listingPrice, .idx-property-card__listingPrice a) {
  padding: 1px 6px !important;
  background-color: var(--kaplon-red) !important;
  color: var(--white) !important;
  text-shadow: none !important;
  -webkit-text-stroke: 0 !important;
}

/* Neutralize theme link color inside the Similar Listings card overlay */
.IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__link {
  color: inherit !important;
  text-decoration: none !important;
}

/* Keep price chip white on hover/focus, even if it’s an anchor */
.IDX-wrapper-standard .idx-similar-listings--list :where([class*="price" i]):where(:hover, :focus),
.IDX-wrapper-standard .idx-similar-listings--list :where(a[class*="price" i]):where(:hover, :focus) {
  color: var(--white) !important;
}

/* Ensure other text in Similar Listings remains white, not link-red */
.IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__details,
.IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__address,
.IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__meta {
  color: var(--white) !important;
  text-shadow: var(--shadow-card-sm) !important;
}

/* -------------------------------------------------------------
   FIX: Remove blue block behind address on Similar Listings
   Keep image visible; force white text and stable visited color
--------------------------------------------------------------*/
.IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__address {
  background-color: transparent !important;
  border-bottom: 0 !important;
  color: var(--white) !important;
  text-shadow: var(--shadow-card-sm) !important;
}

.IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__address a:link,
.IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__address a:visited {
  color: var(--white) !important;
}

/* =======================================================================
   8.0 Duplication / Layout Cleanup
   -----------------------------------------------------------------------
   Hide obvious duplicate agent/detail blocks when the same component is
   injected twice by upstream templates. This is a non-destructive visual
   guardrail and only affects immediate duplicates.
   ======================================================================= */

/* Common IDX agent card patterns */
.IDX-wrapper-standard :where(.idx-agent-card + .idx-agent-card,
  .IDX-agent + .IDX-agent,
  .idx-agent + .idx-agent,
  .IDX-resultsAgent + .IDX-resultsAgent) {
  display: none !important;
}

/* ==========================================================================
   Dark Mode Section Contrast – IDX Major Sections
   --------------------------------------------------------------------------
   Enhanced contrast for IDX Broker sections in dark mode.
   Scope: Only in dark mode, for .IDX-wrapper-standard containers.
   ========================================================================== */
@media (prefers-color-scheme: dark) {

  /* Single-property landing hero: keep imagery bright + headings readable */
  html[data-kaplon-color-mode=system] .single-property-page :is(.kaplon-hero-section, .kaplon-hero-intro, .hero-intro.wp-block-cover) {
    background: none !important;
    box-shadow: var(--shadow-md);
  }

  html[data-kaplon-color-mode=system] .single-property-page :is(h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    .kaplon-hero-intro .hero-title,
    .kaplon-hero-intro .tagline,
    .kaplon-hero-section h2) {
    color: var(--white) !important;
    text-shadow: none !important;
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-listing-header, .idx-details__header, .IDX-detailsHeader) {
    background-color: var(--kaplon-blue-dark);
    border-color: color-mix(in oklab, var(--kaplon-blue-dark) 65%, var(--black));
    color: var(--white);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-listing-header, .idx-details__header, .IDX-detailsHeader) :where(.idx-listing-header__address, .idx-header__address, .idx-details__address, .idx-address) {
    color: var(--white);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-listing-header, .idx-details__header, .IDX-detailsHeader) :where(.idx-listing-header__meta, .idx-header__meta, .idx-details__meta-top, .idx-mls, .idx-mls-id) {
    color: var(--white-80);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-listing-header, .idx-details__header, .IDX-detailsHeader) :where(.idx-listing-header__divider, .idx-header__divider) {
    border-top-color: color-mix(in oklab, var(--kaplon-blue-dark) 55%, var(--black));
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-details__main,
    .idx-details_main,
    .IDX-details__main,
    .IDX-detailsMain) {
    background: color-mix(in oklab, var(--kaplon-blue-dark) 88%, var(--black));
    border-color: color-mix(in oklab, var(--kaplon-blue-dark) 60%, var(--black));
    box-shadow: var(--shadow-dark-md);
    color: var(--white-85);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-details__main,
    .idx-details_main,
    .IDX-details__main,
    .IDX-detailsMain) :where(h2, h3, h4) {
    color: var(--white);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-details__main,
    .idx-details_main,
    .IDX-details__main,
    .IDX-detailsMain) :where(p, .IDX-text, span) {
    color: var(--white-80);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .entry-title {
    background: var(--kaplon-blue-dark);
    border-color: color-mix(in oklab, var(--kaplon-blue-dark) 55%, var(--black));
    color: var(--white);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .entry-title::after {
    background: color-mix(in oklab, var(--kaplon-blue-dark) 55%, var(--black));
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-details-page .idx-details-card--collapsible {
    background: color-mix(in oklab, var(--kaplon-blue-dark) 85%, var(--black));
    border-color: color-mix(in oklab, var(--kaplon-blue-dark) 55%, var(--black));
    box-shadow: var(--shadow-dark-sm);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-details-page .idx-details-card--body {
    background: color-mix(in oklab, var(--kaplon-blue-dark) 78%, var(--black));
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-details-page .idx-details-card--title {
    background: none;
    color: var(--white);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-details-page .idx-details-card--collapsible .idx-collapse {
    background: color-mix(in oklab, var(--kaplon-blue-dark) 88%, var(--black));
    border-top-color: color-mix(in oklab, var(--kaplon-blue-dark) 55%, var(--black));
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-details-page .idx-btn-toggle {
    background: color-mix(in oklab, var(--kaplon-blue-dark) 70%, var(--black));
    border-color: color-mix(in oklab, var(--kaplon-blue-dark) 50%, var(--black));
    color: var(--white);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-details-page .idx-details__sidebar .idx-card,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard #idx-details-page .idx-details__sidebar .idx-similar-listings {
    background: color-mix(in oklab, var(--kaplon-blue-dark) 85%, var(--black));
    border-color: color-mix(in oklab, var(--kaplon-blue-dark) 55%, var(--black));
    box-shadow: var(--shadow-dark-sm);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-details-page .idx-card__links .idx-card-header,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard #idx-details-page .idx-similar-listings__header {
    background: color-mix(in oklab, var(--kaplon-blue-dark) 78%, var(--black));
    color: var(--white);
    border-bottom-color: color-mix(in oklab, var(--kaplon-blue-dark) 55%, var(--black));
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-details-page .idx-card__links .idx-card-body,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard #idx-details-page .idx-similar-listings--list {
    background: color-mix(in oklab, var(--kaplon-blue-dark) 85%, var(--black));
    border-color: color-mix(in oklab, var(--kaplon-blue-dark) 55%, var(--black));
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-details-page .idx-details-link--item {
    color: var(--white-90);
    border-bottom-color: color-mix(in oklab, var(--kaplon-blue-dark) 50%, var(--black));
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-details-page .idx-property-card__courtesy,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard #idx-details-page .idx-property-card__details {
    color: var(--white-80);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-details-page .idx-property-card__wrap {
    border-color: color-mix(in oklab, var(--kaplon-blue-dark) 55%, var(--black));
    box-shadow: var(--shadow-dark-sm);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .IDX-page-photogallery {
    background-color: color-mix(in oklab, var(--kaplon-blue-dark) 90%, var(--black));
    color: var(--white-90);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH__value,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH__label-secondary,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH__address {
    color: var(--white);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH__price {
    color: var(--kaplon-red);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action .IDX-btn {
    background-color: var(--button-red-bg);
    color: var(--white);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action .IDX-btn:hover,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action .IDX-btn:focus {
    background-color: var(--kaplon-blue);
    color: var(--white);
  }

  /* Gallery containers (dark surface) */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .IDX-page-photogallery .IDX-photoGallery,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-page-photogallery .IDX-photo-gallery__container,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-page-photogallery .IDX-enhancedPhotoGallery,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-page-photogallery .IDX-enhanced-gallery {
    background-color: var(--dark-surface);
  }

  /* Breadcrumb colors: dim non-links/separators, keep links white */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(#idx-details-header-breadcrumbs, .idx-details__topbar .idx-topbar__breadcrumbs) {
    color: var(--white) !important;
    text-shadow: var(--shadow-text-strong);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(#idx-details-header-breadcrumbs a, .idx-details__topbar .idx-topbar__breadcrumbs a) {
    color: var(--white) !important;
    text-shadow: var(--shadow-text-strong);
  }

  /* Breadcrumb container visuals in dark mode */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-details__topbar .idx-topbar__breadcrumbs) {
    background-color: color-mix(in oklab, var(--kaplon-blue-dark) 70%, var(--white)) !important;
    border-color: color-mix(in oklab, var(--kaplon-blue-dark) 45%, var(--white)) !important;
  }

  /* Dark mode IDX listing corrections */

  /* IDX content dark mode text fix */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .idx-details *,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-section *,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-details-overview * {
    color: var(--text-primary-dark) !important;
  }

  /* Ensure top header and navigation wrappers use dark surface */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-details__topbar,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard #idx-details-header,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard #idx-results-navigation,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-topbar__header {
    background-color: var(--dark-surface) !important;
    border-color: var(--dark-border) !important;
    color: var(--white) !important;
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-details__main),html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard :where(.idx-details__main) :where(.idx-details-overview__remarks) {
    background-color: var(--dark-surface) !important;
    border-color: var(--dark-border) !important;
    color: var(--text-primary-dark) !important;
  }

  /* Override the broad page-county.css rule for IDX details page */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .idx-details {
    background-color: var(--dark-surface) !important;
    color: var(--text-primary-dark) !important;
  }

  /* Ensure hero image is visible in dark mode */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-details-hero {
    background-color: transparent !important;
  }

  /* Property remarks/details head: ensure text is readable */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .idx-details-overview__remarks,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-details-overview__remarks * {
    background-color: var(--dark-surface) !important;
    color: var(--text-primary-dark) !important;
  }

  /* Override blue text in remarks for dark mode readability */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .idx-details__main .idx-details-overview__remarks {
    color: var(--text-primary-dark) !important;
  }

  /* Info boxes in property details */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .IDX-detailsPropertyInfo,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-listing-info,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-detailsAddress,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-detailsDetails {
    background-color: var(--dark-surface) !important;
    border-color: var(--dark-border) !important;
    color: var(--text-primary-dark) !important;
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .IDX-detailsPropertyInfo a,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-detailsPropertyInfo span {
    color: var(--text-primary-dark) !important;
  }

  /* Brand disclaimer styling */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #IDX-resultsDisclaimer,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard #IDX-resultsDisclaimer div {
    background: var(--gray-800) !important;
    color: var(--text-secondary-dark) !important;
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-details-sidebar,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard #idx-details-sidebar .idx-card,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard #idx-details-sidebar .idx-card__wrapper,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard #idx-details-sidebar .idx-card-body {
    background-color: var(--dark-surface) !important;
    border-color: var(--dark-border) !important;
    color: var(--text-primary-dark) !important;
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .idx-similar-listings,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-similar-listings__header,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-similar-listings--list,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-similar-listings--list .idx-property-card,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__details {
    background-color: transparent !important;
    border-color: var(--dark-border) !important;
    color: var(--text-primary-dark) !important;
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__wrap {
    background-color: var(--surface-1) !important;
    border-color: var(--gray-border) !important;
  }

  /* Dark mode: link contrast inside property details, sidebar, and similar listings */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .idx-details__main a,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard #idx-details-sidebar a,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-similar-listings a {
    color: var(--text-link-dark) !important;
    text-decoration: underline;
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-details__main a:hover, #idx-details-sidebar a:hover, .idx-similar-listings a:hover) {
    color: var(--kaplon-blue-light) !important;
  }

  /* Override link color in remarks to match text */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .idx-details-overview__remarks a {
    color: var(--white) !important;
  }

  /* Safety: any IDX containers that explicitly set white backgrounds */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard [class*="idx-"][style*="background: var(--white)"],html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard [class*="idx-"][style*="background-color: var(--white)"],html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard [class*="IDX-"][style*="background: var(--white)"],html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard [class*="IDX-"][style*="background-color: var(--white)"] {
    background-color: var(--dark-surface) !important;
  }

  /* Price, meta, and labels readability */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-property-card__listingPrice, .idx-details__price, .idx-details__meta, .idx-details__labels, .idx-listing-info) {
    color: var(--text-primary-dark) !important;
  }

  /* Reduce heavy text shadows designed for light mode */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-similar-listings--list .idx-property-card__details,
    .idx-similar-listings--list .idx-property-card__address,
    .idx-similar-listings--list .idx-property-card__meta) {
    text-shadow: none !important;
  }

  /* Courtesy text: ensure readable color on dark surfaces */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .idx-property-card__courtesy,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-similar-listings .idx-property-card__courtesy,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__courtesy,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-results .idx-property-card__courtesy,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-results .IDX-resultsCourtesy,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-courtesy,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-listing__courtesy {
    color: var(--text-secondary-dark) !important;
    text-shadow: none !important;
  }

  /* Ensure courtesy links don't revert to blue/purple in dark mode */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .idx-property-card__courtesy a:link,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-property-card__courtesy a:visited,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-similar-listings .idx-property-card__courtesy a:link,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-similar-listings .idx-property-card__courtesy a:visited,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__courtesy a:link,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__courtesy a:visited,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-results .idx-property-card__courtesy a:link,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-results .idx-property-card__courtesy a:visited,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-results .IDX-resultsCourtesy a:link,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-results .IDX-resultsCourtesy a:visited,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-courtesy a:link,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-courtesy a:visited,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-listing__courtesy a:link,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-listing__courtesy a:visited {
    color: var(--text-secondary-dark) !important;
  }

  /* Feature icons (beds/baths/garage) – invert for dark mode */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .idx-primary-features--icon-group :where(.idx-media) img,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard :where(.idx-details__icon, .idx-meta__icon) img,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard :where(.idx-details__icon, .idx-meta__icon) svg {
    filter: invert(100%) brightness(140%);
  }

  /* Pagination / results nav on details pages */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-results-navigation .idx-btn {
    color: var(--text-primary-dark) !important;
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-results-navigation .idx-btn:where(:hover, :focus) {
    color: var(--dark-text-strong) !important;
  }

  /* Map controls and labels: ensure they don't blend into dark bg */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-map, .IDX-detailsMap, .idx-details__map) :where(.leaflet-control, .leaflet-bar a) {
    background: var(--dark-surface-raised) !important;
    border-color: var(--dark-border) !important;
    color: var(--text-primary-dark) !important;
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-map, .IDX-detailsMap, .idx-details__map) :where(.leaflet-control a:hover, .leaflet-bar a:hover) {
    color: var(--dark-text-strong) !important;
  }

  /* Footer text & links */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-details__footer, .idx-footer) {
    color: var(--text-secondary-dark) !important;
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-details__footer a, .idx-footer a) {
    color: var(--text-link-dark) !important;
    text-decoration: underline;
  }

  /* IDX container backgrounds for dark mode */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .idx-omnibar-form,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-panel,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-card,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-round-box,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-details,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-wrapper-inner {
    background-color: var(--gray-darkest) !important;
    color: var(--gray-100) !important;
  }

  /* IDX input backgrounds for dark mode */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .idx-omnibar-form input,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-panel input,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-card input,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-round-box input,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-details input,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .idx-wrapper-inner input {
    background-color: var(--gray-dark) !important;
    border-color: var(--gray) !important;
    color: var(--gray-100) !important;
  }

  /* ------------------------------------------------------------
     Dark-mode typography normalization for details pages
     Goal: ensure sufficient contrast for meta text, links, and badges
     ------------------------------------------------------------ */
  /* Meta rows (Beds | Baths | SqFt | Acres) */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-details__meta,
    .idx-details__meta *,
    .idx-meta,
    .idx-meta__item,
    .idx-meta__value,
    .idx-meta__label) {
    color: var(--text-primary-dark) !important;
  }

  /* Slightly dim labels only, keep values bright */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-meta__label,
    .idx-details__meta .label,
    .idx-details__meta .idx-label) {
    color: var(--text-secondary-dark) !important;
  }

  /* Listing description/body copy */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-details-overview__remarks,
    .idx-details__description,
    .idx-description,
    .idx-section__body p) {
    color: var(--text-primary-dark) !important;
  }

  /* Override vendor mobile-first theme panels inside results main info */
  /* Case 1: panel element nested inside .IDX-resultsMainInfo */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.IDX-resultsMainInfo) :where(.IDX-panel, .IDX-panel-default),html[data-kaplon-color-mode=system] 
  
  .IDX-wrapper-standard :where(.IDX-resultsMainInfo.IDX-panel,
    .IDX-resultsMainInfo.IDX-panel-default) {
    background: var(--dark-surface) !important;
    border-color: var(--dark-border) !important;
    box-shadow: var(--shadow-dark-sm) !important;
    color: var(--text-primary-dark) !important;
  }

  /* RESULTS LEFT COLUMN: ensure outer container uses dark surface (hosted + embedded) */
  html[data-kaplon-color-mode=system] :where(#IDX-wrapper, .IDX-wrapper-standard) :where(#IDX-resultsMainInfoLeft) {
    background-color: var(--dark-surface) !important;
    border: 1px solid var(--dark-border) !important;
    color: var(--text-primary-dark) !important;
  }

  html[data-kaplon-color-mode=system] :where(#IDX-wrapper, .IDX-wrapper-standard) :where(#IDX-resultsMainInfoLeft) * {
    color: inherit !important;
  }

  /* Stronger price field text color to beat vendor rgba white */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.IDX-resultsMainInfo) :where(.IDX-field-listingPrice, .IDX-field-price, .IDX-field-listingprice) :where(.IDX-text) {
    color: var(--kaplon-red) !important;
  }

  /* Muted label color inside panel */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.IDX-resultsMainInfo) :where(.IDX-field-listingPrice, .IDX-field-price, .IDX-field-listingprice) :where(.IDX-label) {
    color: var(--text-secondary-dark) !important;
  }

  /* Price field component (listingPrice) – prevent white box in dark mode */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.IDX-field-listingPrice, .IDX-field-price, .IDX-field-listingprice) {
    background: transparent !important;
    border: 0 !important;
    color: var(--kaplon-red) !important;
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.IDX-field-listingPrice, .IDX-field-price, .IDX-field-listingprice) :where(.IDX-label) {
    color: var(--text-secondary-dark) !important;
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.IDX-field-listingPrice, .IDX-field-price, .IDX-field-listingprice) :where(.IDX-text) {
    color: var(--kaplon-red) !important;
  }

  /* Helpful Tools and other sidebar links */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-details-sidebar :where(.idx-card a:not(.idx-btn)) {
    color: var(--text-link-dark) !important;
    text-decoration: underline !important;
  }

  /* Ensure sidebar buttons are high-contrast */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-details-sidebar :where(.idx-btn,
    .idx-button,
    a.idx-btn,
    button.idx-btn) {
    background-color: var(--button-red-bg) !important;
    border-color: transparent !important;
    color: var(--white) !important;
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard #idx-details-sidebar :where(.idx-btn:hover,
    .idx-button:hover,
    a.idx-btn:hover,
    button.idx-btn:hover,
    .idx-btn:focus,
    .idx-button:focus) {
    background-color: var(--button-red-bg-hover) !important;
    color: var(--white) !important;
  }

  /* Badges / small labels (avoid price chip selectors) */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-badge,
    .idx-label,
    .idx-chip):not([class*="price" i]) {
    background-color: var(--dark-surface-raised) !important;
    border-color: var(--dark-border) !important;
    color: var(--text-primary-dark) !important;
  }

  /* Listing IDs or small print */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard :where(.idx-listing-info small,
    .idx-listing__id,
    .idx-details__id,
    .idx-mls-id,
    .idx-disclaimer,
    .idx-courtesy) {
    color: var(--text-secondary-dark) !important;
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .IDX-section,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-fieldGroup,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-panel,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-panel-default {
    background: var(--dark-surface);
    border: 1px solid var(--dark-border);
    box-shadow: var(--shadow-dark-md);
    color: var(--white);
  }

  /* Alternate section backgrounds for visual hierarchy */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .IDX-section:nth-of-type(even),html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-fieldGroup:nth-of-type(even) {
    background: var(--dark-surface-base);
  }

  /* Accent header bars for major groups */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .IDX-section>.IDX-section-header,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-panel>.IDX-panel-header {
    background: var(--kaplon-red);
    border-bottom: 2px solid var(--kaplon-blue);
    color: var(--white);
  }

  /* Card-style inner containers for details/main data */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .IDX-details__main,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-results--cell-inner-wrapper {
    background: var(--dark-surface);
    border: 1px solid var(--dark-border);
    color: var(--white);
  }

  /* Text colors for labels and values */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .IDX-section label,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-fieldGroup label {
    color: var(--text-secondary-dark);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .IDX-section h1,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-section h2,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-section h3,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-section h4,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-section h5,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-section h6,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-fieldGroup h1,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-fieldGroup h2,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-fieldGroup h3,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-fieldGroup h4,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-fieldGroup h5,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-fieldGroup h6 {
    color: var(--text-primary-dark);
  }

  /* Hover/active states for links and buttons */
  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .IDX-section a:hover,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-fieldGroup a:hover,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-panel a:hover,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-panel-default a:hover {
    color: var(--kaplon-red);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .IDX-section button:hover,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-fieldGroup button:hover,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-panel button:hover,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-panel-default button:hover {
    background-color: var(--kaplon-red);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .IDX-section a:active,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-fieldGroup a:active,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-panel a:active,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-panel-default a:active {
    color: var(--kaplon-red);
  }

  html[data-kaplon-color-mode=system] .IDX-wrapper-standard .IDX-section button:active,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-fieldGroup button:active,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-panel button:active,html[data-kaplon-color-mode=system] 
  .IDX-wrapper-standard .IDX-panel-default button:active {
    background-color: var(--kaplon-red);
  }

}
/* Single-property landing hero: keep imagery bright + headings readable */
/* Gallery containers (dark surface) */
/* Breadcrumb colors: dim non-links/separators, keep links white */
/* Breadcrumb container visuals in dark mode */
/* Dark mode IDX listing corrections */
/* IDX content dark mode text fix */
/* Ensure top header and navigation wrappers use dark surface */
/* Override the broad page-county.css rule for IDX details page */
/* Ensure hero image is visible in dark mode */
/* Property remarks/details head: ensure text is readable */
/* Override blue text in remarks for dark mode readability */
/* Info boxes in property details */
/* Brand disclaimer styling */
/* Dark mode: link contrast inside property details, sidebar, and similar listings */
/* Override link color in remarks to match text */
/* Safety: any IDX containers that explicitly set white backgrounds */
/* Price, meta, and labels readability */
/* Reduce heavy text shadows designed for light mode */
/* Courtesy text: ensure readable color on dark surfaces */
/* Ensure courtesy links don't revert to blue/purple in dark mode */
/* Feature icons (beds/baths/garage) – invert for dark mode */
/* Pagination / results nav on details pages */
/* Map controls and labels: ensure they don't blend into dark bg */
/* Footer text & links */
/* IDX container backgrounds for dark mode */
/* IDX input backgrounds for dark mode */
/* ------------------------------------------------------------
     Dark-mode typography normalization for details pages
     Goal: ensure sufficient contrast for meta text, links, and badges
     ------------------------------------------------------------ */
/* Meta rows (Beds | Baths | SqFt | Acres) */
/* Slightly dim labels only, keep values bright */
/* Listing description/body copy */
/* Override vendor mobile-first theme panels inside results main info */
/* Case 1: panel element nested inside .IDX-resultsMainInfo */
/* RESULTS LEFT COLUMN: ensure outer container uses dark surface (hosted + embedded) */
/* Stronger price field text color to beat vendor rgba white */
/* Muted label color inside panel */
/* Price field component (listingPrice) – prevent white box in dark mode */
/* Helpful Tools and other sidebar links */
/* Ensure sidebar buttons are high-contrast */
/* Badges / small labels (avoid price chip selectors) */
/* Listing IDs or small print */
/* Alternate section backgrounds for visual hierarchy */
/* Accent header bars for major groups */
/* Card-style inner containers for details/main data */
/* Text colors for labels and values */
/* Hover/active states for links and buttons */
/* Single-property landing hero: keep imagery bright + headings readable */
html[data-kaplon-color-mode=dark] .single-property-page :is(.kaplon-hero-section, .kaplon-hero-intro, .hero-intro.wp-block-cover) {
    background: none !important;
    box-shadow: var(--shadow-md);
  }
html[data-kaplon-color-mode=dark] .single-property-page :is(h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    .kaplon-hero-intro .hero-title,
    .kaplon-hero-intro .tagline,
    .kaplon-hero-section h2) {
    color: var(--white) !important;
    text-shadow: none !important;
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-listing-header, .idx-details__header, .IDX-detailsHeader) {
    background-color: var(--kaplon-blue-dark);
    border-color: color-mix(in oklab, var(--kaplon-blue-dark) 65%, var(--black));
    color: var(--white);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-listing-header, .idx-details__header, .IDX-detailsHeader) :where(.idx-listing-header__address, .idx-header__address, .idx-details__address, .idx-address) {
    color: var(--white);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-listing-header, .idx-details__header, .IDX-detailsHeader) :where(.idx-listing-header__meta, .idx-header__meta, .idx-details__meta-top, .idx-mls, .idx-mls-id) {
    color: var(--white-80);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-listing-header, .idx-details__header, .IDX-detailsHeader) :where(.idx-listing-header__divider, .idx-header__divider) {
    border-top-color: color-mix(in oklab, var(--kaplon-blue-dark) 55%, var(--black));
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-details__main,
    .idx-details_main,
    .IDX-details__main,
    .IDX-detailsMain) {
    background: color-mix(in oklab, var(--kaplon-blue-dark) 88%, var(--black));
    border-color: color-mix(in oklab, var(--kaplon-blue-dark) 60%, var(--black));
    box-shadow: var(--shadow-dark-md);
    color: var(--white-85);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-details__main,
    .idx-details_main,
    .IDX-details__main,
    .IDX-detailsMain) :where(h2, h3, h4) {
    color: var(--white);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-details__main,
    .idx-details_main,
    .IDX-details__main,
    .IDX-detailsMain) :where(p, .IDX-text, span) {
    color: var(--white-80);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .entry-title {
    background: var(--kaplon-blue-dark);
    border-color: color-mix(in oklab, var(--kaplon-blue-dark) 55%, var(--black));
    color: var(--white);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .entry-title::after {
    background: color-mix(in oklab, var(--kaplon-blue-dark) 55%, var(--black));
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-details-page .idx-details-card--collapsible {
    background: color-mix(in oklab, var(--kaplon-blue-dark) 85%, var(--black));
    border-color: color-mix(in oklab, var(--kaplon-blue-dark) 55%, var(--black));
    box-shadow: var(--shadow-dark-sm);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-details-page .idx-details-card--body {
    background: color-mix(in oklab, var(--kaplon-blue-dark) 78%, var(--black));
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-details-page .idx-details-card--title {
    background: none;
    color: var(--white);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-details-page .idx-details-card--collapsible .idx-collapse {
    background: color-mix(in oklab, var(--kaplon-blue-dark) 88%, var(--black));
    border-top-color: color-mix(in oklab, var(--kaplon-blue-dark) 55%, var(--black));
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-details-page .idx-btn-toggle {
    background: color-mix(in oklab, var(--kaplon-blue-dark) 70%, var(--black));
    border-color: color-mix(in oklab, var(--kaplon-blue-dark) 50%, var(--black));
    color: var(--white);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-details-page .idx-details__sidebar .idx-card,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard #idx-details-page .idx-details__sidebar .idx-similar-listings {
    background: color-mix(in oklab, var(--kaplon-blue-dark) 85%, var(--black));
    border-color: color-mix(in oklab, var(--kaplon-blue-dark) 55%, var(--black));
    box-shadow: var(--shadow-dark-sm);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-details-page .idx-card__links .idx-card-header,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard #idx-details-page .idx-similar-listings__header {
    background: color-mix(in oklab, var(--kaplon-blue-dark) 78%, var(--black));
    color: var(--white);
    border-bottom-color: color-mix(in oklab, var(--kaplon-blue-dark) 55%, var(--black));
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-details-page .idx-card__links .idx-card-body,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard #idx-details-page .idx-similar-listings--list {
    background: color-mix(in oklab, var(--kaplon-blue-dark) 85%, var(--black));
    border-color: color-mix(in oklab, var(--kaplon-blue-dark) 55%, var(--black));
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-details-page .idx-details-link--item {
    color: var(--white-90);
    border-bottom-color: color-mix(in oklab, var(--kaplon-blue-dark) 50%, var(--black));
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-details-page .idx-property-card__courtesy,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard #idx-details-page .idx-property-card__details {
    color: var(--white-80);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-details-page .idx-property-card__wrap {
    border-color: color-mix(in oklab, var(--kaplon-blue-dark) 55%, var(--black));
    box-shadow: var(--shadow-dark-sm);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .IDX-page-photogallery {
    background-color: color-mix(in oklab, var(--kaplon-blue-dark) 90%, var(--black));
    color: var(--white-90);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH__value,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH__label-secondary,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH__address {
    color: var(--white);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH__price {
    color: var(--kaplon-red);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action .IDX-btn {
    background-color: var(--button-red-bg);
    color: var(--white);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action .IDX-btn:hover,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-page-photogallery .IDX-PIH .IDX-PIH__row--action .IDX-btn:focus {
    background-color: var(--kaplon-blue);
    color: var(--white);
  }
/* Gallery containers (dark surface) */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .IDX-page-photogallery .IDX-photoGallery,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-page-photogallery .IDX-photo-gallery__container,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-page-photogallery .IDX-enhancedPhotoGallery,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-page-photogallery .IDX-enhanced-gallery {
    background-color: var(--dark-surface);
  }
/* Breadcrumb colors: dim non-links/separators, keep links white */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(#idx-details-header-breadcrumbs, .idx-details__topbar .idx-topbar__breadcrumbs) {
    color: var(--white) !important;
    text-shadow: var(--shadow-text-strong);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(#idx-details-header-breadcrumbs a, .idx-details__topbar .idx-topbar__breadcrumbs a) {
    color: var(--white) !important;
    text-shadow: var(--shadow-text-strong);
  }
/* Breadcrumb container visuals in dark mode */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-details__topbar .idx-topbar__breadcrumbs) {
    background-color: color-mix(in oklab, var(--kaplon-blue-dark) 70%, var(--white)) !important;
    border-color: color-mix(in oklab, var(--kaplon-blue-dark) 45%, var(--white)) !important;
  }
/* Dark mode IDX listing corrections */
/* IDX content dark mode text fix */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .idx-details *,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-section *,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-details-overview * {
    color: var(--text-primary-dark) !important;
  }
/* Ensure top header and navigation wrappers use dark surface */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-details__topbar,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard #idx-details-header,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard #idx-results-navigation,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-topbar__header {
    background-color: var(--dark-surface) !important;
    border-color: var(--dark-border) !important;
    color: var(--white) !important;
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-details__main),html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard :where(.idx-details__main) :where(.idx-details-overview__remarks) {
    background-color: var(--dark-surface) !important;
    border-color: var(--dark-border) !important;
    color: var(--text-primary-dark) !important;
  }
/* Override the broad page-county.css rule for IDX details page */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .idx-details {
    background-color: var(--dark-surface) !important;
    color: var(--text-primary-dark) !important;
  }
/* Ensure hero image is visible in dark mode */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-details-hero {
    background-color: transparent !important;
  }
/* Property remarks/details head: ensure text is readable */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .idx-details-overview__remarks,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-details-overview__remarks * {
    background-color: var(--dark-surface) !important;
    color: var(--text-primary-dark) !important;
  }
/* Override blue text in remarks for dark mode readability */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .idx-details__main .idx-details-overview__remarks {
    color: var(--text-primary-dark) !important;
  }
/* Info boxes in property details */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .IDX-detailsPropertyInfo,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-listing-info,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-detailsAddress,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-detailsDetails {
    background-color: var(--dark-surface) !important;
    border-color: var(--dark-border) !important;
    color: var(--text-primary-dark) !important;
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .IDX-detailsPropertyInfo a,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-detailsPropertyInfo span {
    color: var(--text-primary-dark) !important;
  }
/* Brand disclaimer styling */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #IDX-resultsDisclaimer,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard #IDX-resultsDisclaimer div {
    background: var(--gray-800) !important;
    color: var(--text-secondary-dark) !important;
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-details-sidebar,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard #idx-details-sidebar .idx-card,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard #idx-details-sidebar .idx-card__wrapper,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard #idx-details-sidebar .idx-card-body {
    background-color: var(--dark-surface) !important;
    border-color: var(--dark-border) !important;
    color: var(--text-primary-dark) !important;
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .idx-similar-listings,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-similar-listings__header,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-similar-listings--list,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-similar-listings--list .idx-property-card,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__details {
    background-color: transparent !important;
    border-color: var(--dark-border) !important;
    color: var(--text-primary-dark) !important;
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__wrap {
    background-color: var(--surface-1) !important;
    border-color: var(--gray-border) !important;
  }
/* Dark mode: link contrast inside property details, sidebar, and similar listings */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .idx-details__main a,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard #idx-details-sidebar a,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-similar-listings a {
    color: var(--text-link-dark) !important;
    text-decoration: underline;
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-details__main a:hover, #idx-details-sidebar a:hover, .idx-similar-listings a:hover) {
    color: var(--kaplon-blue-light) !important;
  }
/* Override link color in remarks to match text */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .idx-details-overview__remarks a {
    color: var(--white) !important;
  }
/* Safety: any IDX containers that explicitly set white backgrounds */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard [class*="idx-"][style*="background: var(--white)"],html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard [class*="idx-"][style*="background-color: var(--white)"],html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard [class*="IDX-"][style*="background: var(--white)"],html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard [class*="IDX-"][style*="background-color: var(--white)"] {
    background-color: var(--dark-surface) !important;
  }
/* Price, meta, and labels readability */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-property-card__listingPrice, .idx-details__price, .idx-details__meta, .idx-details__labels, .idx-listing-info) {
    color: var(--text-primary-dark) !important;
  }
/* Reduce heavy text shadows designed for light mode */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-similar-listings--list .idx-property-card__details,
    .idx-similar-listings--list .idx-property-card__address,
    .idx-similar-listings--list .idx-property-card__meta) {
    text-shadow: none !important;
  }
/* Courtesy text: ensure readable color on dark surfaces */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .idx-property-card__courtesy,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-similar-listings .idx-property-card__courtesy,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__courtesy,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-results .idx-property-card__courtesy,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-results .IDX-resultsCourtesy,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-courtesy,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-listing__courtesy {
    color: var(--text-secondary-dark) !important;
    text-shadow: none !important;
  }
/* Ensure courtesy links don't revert to blue/purple in dark mode */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .idx-property-card__courtesy a:link,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-property-card__courtesy a:visited,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-similar-listings .idx-property-card__courtesy a:link,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-similar-listings .idx-property-card__courtesy a:visited,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__courtesy a:link,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-similar-listings--list .idx-property-card__courtesy a:visited,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-results .idx-property-card__courtesy a:link,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-results .idx-property-card__courtesy a:visited,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-results .IDX-resultsCourtesy a:link,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-results .IDX-resultsCourtesy a:visited,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-courtesy a:link,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-courtesy a:visited,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-listing__courtesy a:link,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-listing__courtesy a:visited {
    color: var(--text-secondary-dark) !important;
  }
/* Feature icons (beds/baths/garage) – invert for dark mode */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .idx-primary-features--icon-group :where(.idx-media) img,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard :where(.idx-details__icon, .idx-meta__icon) img,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard :where(.idx-details__icon, .idx-meta__icon) svg {
    filter: invert(100%) brightness(140%);
  }
/* Pagination / results nav on details pages */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-results-navigation .idx-btn {
    color: var(--text-primary-dark) !important;
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-results-navigation .idx-btn:where(:hover, :focus) {
    color: var(--dark-text-strong) !important;
  }
/* Map controls and labels: ensure they don't blend into dark bg */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-map, .IDX-detailsMap, .idx-details__map) :where(.leaflet-control, .leaflet-bar a) {
    background: var(--dark-surface-raised) !important;
    border-color: var(--dark-border) !important;
    color: var(--text-primary-dark) !important;
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-map, .IDX-detailsMap, .idx-details__map) :where(.leaflet-control a:hover, .leaflet-bar a:hover) {
    color: var(--dark-text-strong) !important;
  }
/* Footer text & links */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-details__footer, .idx-footer) {
    color: var(--text-secondary-dark) !important;
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-details__footer a, .idx-footer a) {
    color: var(--text-link-dark) !important;
    text-decoration: underline;
  }
/* IDX container backgrounds for dark mode */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .idx-omnibar-form,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-panel,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-card,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-round-box,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-details,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-wrapper-inner {
    background-color: var(--gray-darkest) !important;
    color: var(--gray-100) !important;
  }
/* IDX input backgrounds for dark mode */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .idx-omnibar-form input,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-panel input,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-card input,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-round-box input,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-details input,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .idx-wrapper-inner input {
    background-color: var(--gray-dark) !important;
    border-color: var(--gray) !important;
    color: var(--gray-100) !important;
  }
/* ------------------------------------------------------------
     Dark-mode typography normalization for details pages
     Goal: ensure sufficient contrast for meta text, links, and badges
     ------------------------------------------------------------ */
/* Meta rows (Beds | Baths | SqFt | Acres) */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-details__meta,
    .idx-details__meta *,
    .idx-meta,
    .idx-meta__item,
    .idx-meta__value,
    .idx-meta__label) {
    color: var(--text-primary-dark) !important;
  }
/* Slightly dim labels only, keep values bright */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-meta__label,
    .idx-details__meta .label,
    .idx-details__meta .idx-label) {
    color: var(--text-secondary-dark) !important;
  }
/* Listing description/body copy */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-details-overview__remarks,
    .idx-details__description,
    .idx-description,
    .idx-section__body p) {
    color: var(--text-primary-dark) !important;
  }
/* Override vendor mobile-first theme panels inside results main info */
/* Case 1: panel element nested inside .IDX-resultsMainInfo */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.IDX-resultsMainInfo) :where(.IDX-panel, .IDX-panel-default),html[data-kaplon-color-mode=dark] 
  
  .IDX-wrapper-standard :where(.IDX-resultsMainInfo.IDX-panel,
    .IDX-resultsMainInfo.IDX-panel-default) {
    background: var(--dark-surface) !important;
    border-color: var(--dark-border) !important;
    box-shadow: var(--shadow-dark-sm) !important;
    color: var(--text-primary-dark) !important;
  }
/* RESULTS LEFT COLUMN: ensure outer container uses dark surface (hosted + embedded) */
html[data-kaplon-color-mode=dark] :where(#IDX-wrapper, .IDX-wrapper-standard) :where(#IDX-resultsMainInfoLeft) {
    background-color: var(--dark-surface) !important;
    border: 1px solid var(--dark-border) !important;
    color: var(--text-primary-dark) !important;
  }
html[data-kaplon-color-mode=dark] :where(#IDX-wrapper, .IDX-wrapper-standard) :where(#IDX-resultsMainInfoLeft) * {
    color: inherit !important;
  }
/* Stronger price field text color to beat vendor rgba white */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.IDX-resultsMainInfo) :where(.IDX-field-listingPrice, .IDX-field-price, .IDX-field-listingprice) :where(.IDX-text) {
    color: var(--kaplon-red) !important;
  }
/* Muted label color inside panel */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.IDX-resultsMainInfo) :where(.IDX-field-listingPrice, .IDX-field-price, .IDX-field-listingprice) :where(.IDX-label) {
    color: var(--text-secondary-dark) !important;
  }
/* Price field component (listingPrice) – prevent white box in dark mode */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.IDX-field-listingPrice, .IDX-field-price, .IDX-field-listingprice) {
    background: transparent !important;
    border: 0 !important;
    color: var(--kaplon-red) !important;
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.IDX-field-listingPrice, .IDX-field-price, .IDX-field-listingprice) :where(.IDX-label) {
    color: var(--text-secondary-dark) !important;
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.IDX-field-listingPrice, .IDX-field-price, .IDX-field-listingprice) :where(.IDX-text) {
    color: var(--kaplon-red) !important;
  }
/* Helpful Tools and other sidebar links */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-details-sidebar :where(.idx-card a:not(.idx-btn)) {
    color: var(--text-link-dark) !important;
    text-decoration: underline !important;
  }
/* Ensure sidebar buttons are high-contrast */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-details-sidebar :where(.idx-btn,
    .idx-button,
    a.idx-btn,
    button.idx-btn) {
    background-color: var(--button-red-bg) !important;
    border-color: transparent !important;
    color: var(--white) !important;
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard #idx-details-sidebar :where(.idx-btn:hover,
    .idx-button:hover,
    a.idx-btn:hover,
    button.idx-btn:hover,
    .idx-btn:focus,
    .idx-button:focus) {
    background-color: var(--button-red-bg-hover) !important;
    color: var(--white) !important;
  }
/* Badges / small labels (avoid price chip selectors) */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-badge,
    .idx-label,
    .idx-chip):not([class*="price" i]) {
    background-color: var(--dark-surface-raised) !important;
    border-color: var(--dark-border) !important;
    color: var(--text-primary-dark) !important;
  }
/* Listing IDs or small print */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard :where(.idx-listing-info small,
    .idx-listing__id,
    .idx-details__id,
    .idx-mls-id,
    .idx-disclaimer,
    .idx-courtesy) {
    color: var(--text-secondary-dark) !important;
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .IDX-section,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-fieldGroup,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-panel,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-panel-default {
    background: var(--dark-surface);
    border: 1px solid var(--dark-border);
    box-shadow: var(--shadow-dark-md);
    color: var(--white);
  }
/* Alternate section backgrounds for visual hierarchy */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .IDX-section:nth-of-type(even),html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-fieldGroup:nth-of-type(even) {
    background: var(--dark-surface-base);
  }
/* Accent header bars for major groups */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .IDX-section>.IDX-section-header,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-panel>.IDX-panel-header {
    background: var(--kaplon-red);
    border-bottom: 2px solid var(--kaplon-blue);
    color: var(--white);
  }
/* Card-style inner containers for details/main data */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .IDX-details__main,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-results--cell-inner-wrapper {
    background: var(--dark-surface);
    border: 1px solid var(--dark-border);
    color: var(--white);
  }
/* Text colors for labels and values */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .IDX-section label,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-fieldGroup label {
    color: var(--text-secondary-dark);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .IDX-section h1,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-section h2,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-section h3,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-section h4,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-section h5,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-section h6,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-fieldGroup h1,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-fieldGroup h2,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-fieldGroup h3,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-fieldGroup h4,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-fieldGroup h5,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-fieldGroup h6 {
    color: var(--text-primary-dark);
  }
/* Hover/active states for links and buttons */
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .IDX-section a:hover,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-fieldGroup a:hover,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-panel a:hover,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-panel-default a:hover {
    color: var(--kaplon-red);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .IDX-section button:hover,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-fieldGroup button:hover,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-panel button:hover,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-panel-default button:hover {
    background-color: var(--kaplon-red);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .IDX-section a:active,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-fieldGroup a:active,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-panel a:active,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-panel-default a:active {
    color: var(--kaplon-red);
  }
html[data-kaplon-color-mode=dark] .IDX-wrapper-standard .IDX-section button:active,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-fieldGroup button:active,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-panel button:active,html[data-kaplon-color-mode=dark] 
  .IDX-wrapper-standard .IDX-panel-default button:active {
    background-color: var(--kaplon-red);
  }