/* ============================================
   recently-sold.css -- Full-page recently sold iframe
   Same layout approach as featured-listings.css.
   No scrolling. Header + title bar + iframe = 100vh.
   ============================================ */


/* --- Slim Title Bar --- */
.search-title-bar {
  background: var(--color-primary-dark);
  padding: 0.5rem 1.5rem;
  text-align: center;
}

.search-title-bar h1 {
  color: var(--color-white);
  font-size: var(--text-lg);
  font-weight: var(--weight-medium);
  margin: 0;
  line-height: 1.4;
}


/* --- Full-Page Iframe Section --- */
.search-fullpage {
  width: 100%;
  overflow: hidden;
}

/*
 * Crop container: hides the top 134px of the iframe
 * (BoldTrail's own header) by clipping overflow.
 * If their header height changes, adjust --iframe-crop.
 */
.iframe-crop {
  --iframe-crop: 134px;

  /* Title bar is ~38px. Header is ~80px. Total offset ~118px. */
  --title-bar: 38px;
  --header: var(--header-height, 80px);

  overflow: hidden;
}

.iframe-crop iframe {
  display: block;
  width: 100%;
  border: none;

  /* Pull the iframe up to hide BoldTrail's header */
  margin-top: calc(-1 * var(--iframe-crop));

  /*
   * Fill the entire remaining viewport:
   * 100vh - header - title bar + cropped portion added back
   */
  height: calc(100vh - var(--header) - var(--title-bar) + var(--iframe-crop));
}


/* --- Responsive --- */
@media (max-width: 768px) {
  .search-title-bar {
    padding: 0.4rem 1rem;
  }

  .search-title-bar h1 {
    font-size: var(--text-base);
  }

  .iframe-crop iframe {
    -webkit-overflow-scrolling: touch;
  }
}