/* ==========================================================================
   Immowelt Homepagemodul – responsive Anpassung
   Das Modul lädt sein eigenes Stylesheet (screen_iwModule.css) NACH dieser
   Datei und arbeitet mit festen Pixelbreiten. Deshalb sind die Selektoren
   bewusst spezifischer (html body …) und teils mit !important versehen.
   ========================================================================== */

/* --- Grundgerüst: Container darf schmaler als 450px werden ---------------- */
html body #iwModule,
html body #iwModule #iwWidget {
  min-width: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  box-sizing: border-box;
}
html body #iwModule #iwWidget *,
html body #iwModule #iwWidget *::before,
html body #iwModule #iwWidget *::after {
  box-sizing: border-box;
}
html body #iwModule #iwWidget .hm_box_01 { min-width: 0 !important; }

/* Bilder skalieren grundsätzlich mit */
html body #iwModule #iwWidget img {
  max-width: 100%;
  height: auto;
}

/* Clearfix für die vielen Float-Zeilen */
html body #iwModule #iwWidget .hm_listbox::after,
html body #iwModule #iwWidget .hm_box_01::after,
html body #iwModule #iwWidget .hm_objectdata::after {
  content: "";
  display: table;
  clear: both;
}

/* Tabellen (z. B. Energieausweis) dürfen horizontal scrollen statt
   das Layout zu sprengen */
html body #iwModule #iwWidget table {
  max-width: 100%;
}

/* --- Exposé-Ansicht: feste 710px / 345px / 406px aufheben ------------------ */
html body #iwModule #iwWidget .hm_expose_full_width { width: 100% !important; }
html body #iwModule #iwWidget .hm_expose_half_width { width: 49% !important; margin-right: 1%; }

html body #iwModule #iwWidget .hm_grid_image_big {
  width: 59% !important;
  max-width: 406px;
}
html body #iwModule #iwWidget .hm_grid_image_thumbs {
  width: 39% !important;
  margin-left: 2%;
}

/* Großes Galeriebild: Box und Bild proportional statt 400 × 300 px */
html body #iwModule #iwWidget .hm_img_thumb_box_400 {
  width: 100% !important;
  height: auto !important;
  float: none !important;
}
html body #iwModule #iwWidget .hm_img_thumb_box_400 .hm_img_thumb,
html body #iwModule #iwWidget .hm_img_thumb_box_400 .hm_image-wrapper {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 3;
}
html body #iwModule #iwWidget .hm_img_thumb_box_400 .hm_img_thumb img {
  max-width: 100% !important;
  max-height: 100% !important;
  width: auto;
  height: auto;
}

/* Vor/Zurück-Flächen der Galerie an die Bildhöhe koppeln */
html body #iwModule #iwWidget .hm_nav-controls .hm_prev,
html body #iwModule #iwWidget .hm_nav-controls .hm_next {
  width: 40% !important;
  height: 100% !important;
}

/* Formulare / Datenschutzhinweis im Modul */
html body #iwModule #iwWidget .hm_datenschutz { width: auto !important; max-width: 100%; }
html body #iwModule #iwWidget .hm_dropdown   { max-width: 100%; }
html body #iwModule #iwWidget .hm_tooltip    { max-width: 90vw; }

/* --- Tablet (bis 991px) ----------------------------------------------------- */
@media (max-width: 991px) {
  html body #iwModule #iwWidget .hm_listinfobox  { width: 40% !important; }
  html body #iwModule #iwWidget .hm_listextrafield { width: 25% !important; }
  html body #iwModule #iwWidget .hm_details,
  html body #iwModule #iwWidget .hm_listaddress  { width: 30% !important; }
}

/* --- Smartphone (bis 767px): alles untereinander ----------------------------- */
@media (max-width: 767px) {

  /* Spalten der Exposé-Ansicht stapeln */
  html body #iwModule #iwWidget .hm_expose_half_width,
  html body #iwModule #iwWidget .hm_grid_image_big,
  html body #iwModule #iwWidget .hm_grid_image_thumbs,
  html body #iwModule #iwWidget .hm_3col,
  html body #iwModule #iwWidget .hm_filter .hm_last {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  html body #iwModule #iwWidget .hm_grid_image_thumbs { margin-top: 10px !important; }

  /* Ergebnisliste: Vorschaubild links, Texte darunter in voller Breite */
  html body #iwModule #iwWidget .hm_listinfobox,
  html body #iwModule #iwWidget .hm_listextrafield,
  html body #iwModule #iwWidget .hm_details,
  html body #iwModule #iwWidget .hm_listaddress {
    float: none !important;
    width: 100% !important;
    text-align: left !important;
    margin: 4px 0 0 0 !important;
  }
  html body #iwModule #iwWidget .hm_listbox .hm_img_thumb_box_100 {
    margin: 0 12px 8px 0;
  }

  /* Rechts-/Links-Floats im Modul neutralisieren, wo sie Zeilen sprengen */
  html body #iwModule #iwWidget .hm_right { float: none !important; }

  /* Objektdaten: Label über Wert */
  html body #iwModule #iwWidget .hm_data_label,
  html body #iwModule #iwWidget .hm_contact_label {
    width: auto !important;
    display: block;
  }

  /* Kontaktformular des Moduls */
  html body #iwModule #iwWidget #hm_contact .hm_box_02,
  html body #iwModule #iwWidget #hm_contact .hm_box_03,
  html body #iwModule #iwWidget .hm_formfield_contact dt,
  html body #iwModule #iwWidget .hm_formfield_contact dd,
  html body #iwModule #iwWidget .hm_formfield_01 dt,
  html body #iwModule #iwWidget .hm_formfield_01 dd,
  html body #iwModule #iwWidget #recommend dt,
  html body #iwModule #iwWidget #recommend dd {
    float: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  html body #iwModule #iwWidget .hm_formfield_contact input[type="text"],
  html body #iwModule #iwWidget .hm_formfield_contact select,
  html body #iwModule #iwWidget .hm_formfield_contact textarea,
  html body #iwModule #iwWidget .hm_formfield_01 dl dd input,
  html body #iwModule #iwWidget #recommend dd input,
  html body #iwModule #iwWidget #recommend dd textarea,
  html body #iwModule #iwWidget select {
    width: 100% !important;
    max-width: 100% !important;
    font-size: 16px; /* verhindert Auto-Zoom auf iOS */
  }
  html body #iwModule #iwWidget input[type="checkbox"] { width: auto !important; }

  /* Seitennavigation im Exposé */
  html body #iwModule #iwWidget .hm_expose_pag { width: auto !important; height: auto !important; }

  /* Energieausweis-Grafik und Tabellen: horizontal scrollbar statt Überlauf */
  html body #iwModule #iwWidget .energy_table,
  html body #iwModule #iwWidget table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  html body #iwModule #iwWidget .hm_energy_bar,
  html body #iwModule #iwWidget .hm_energy_bar_old,
  html body #iwModule #iwWidget .hm_energy_bar_gewerbe {
    max-width: 100%;
    background-size: contain;
  }

  /* Button unter dem Modul auf Handybreite */
  #immobilien .immobilien-button {
    display: block;
    padding: 16px 20px;
    font-size: 17px;
  }
}

/* Letzte Sicherung: nichts im Modul darf die Seite horizontal verbreitern */
#immobilien .col-md-9 { overflow-x: hidden; }