/* ==========================================================================
   Horizon – zakładka Apartamenty (punkt A uwag, 02.10.2026)
   Szablony Elementora: 255 = archiwum /apartamenty/, 258 = karta (Loop Item),
   467 = strona apartamentu
   ========================================================================== */

:root {
  --hz-navy: #061523;
  --hz-gold: #af801d;
  --hz-line: #e6e3dd;
  --hz-sticky-top: 180px;     /* = Sticky offset mapy w Elementorze (widget a31a874) */
}

/* ---------- 1. Lista + mapa: lista główna, mapa ≤ 1/3, więcej światła ---------- */
@media (min-width: 1025px) {
  .elementor-255 .elementor-element-0f9e62b {
    flex-wrap: nowrap !important;
    column-gap: 56px !important;
    padding-right: 40px !important;
    align-items: stretch !important;
  }
  .elementor-255 .elementor-element-0954688 {
    flex: 1 1 0 !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0;
  }
  .elementor-255 .elementor-element-0e80899 {
    flex: 0 0 min(33.333%, 560px) !important;
    width: auto !important;
    max-width: 560px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  /* mapa jest przyklejona ustawieniem Elementora (Sticky, offset 180 px) –
     tu tylko dopasowanie wysokości do ekranu */
  .elementor-255 .elementor-element-a31a874 .horizon-map-container {
    height: calc(100vh - var(--hz-sticky-top) - 30px) !important;
    min-height: 420px;
    border-radius: 6px;
    overflow: hidden;
  }
  .elementor-255 .elementor-element-3ef7162 .elementor-grid {
    column-gap: 32px !important;
    row-gap: 40px !important;
  }
}

/* ---------- 2. Karty: równe, spokojne, bez „skakania” ---------- */
.elementor-258.e-loop-item {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.elementor-258 .elementor-element-8bd6600 {
  flex: 1 1 auto;
  height: 100%;
}
.elementor-258 .elementor-element-8bd6600 > .e-con-inner {
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* techniczny numer z Previo nad zdjęciem – niewidoczny dla gościa */
.elementor-258 .elementor-element-855a2fa {
  display: none !important;
}

/* zdjęcie zawsze w tych samych proporcjach */
.elementor-258 .elementor-element-5209c34 img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
}

/* rząd informacji: jedna linia */
.elementor-258 .elementor-element-adec453 .elementor-icon-list-items {
  flex-wrap: nowrap !important;
  white-space: nowrap;
}

/* tekst: stała wysokość */
.elementor-258 .elementor-element-c01b9f2,
.elementor-258 .elementor-element-993448c {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
.elementor-258 .elementor-element-e66ae54 .elementor-heading-title {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 2.6em;            /* zawsze miejsce na 2 linie */
  line-height: 1.3;
}
.elementor-258 .elementor-element-f537b50 .elementor-icon-list-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.elementor-258 .elementor-element-96ac1d9,
.elementor-258 .elementor-element-96ac1d9 p {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.elementor-258 .elementor-element-96ac1d9 {
  min-height: 3.2em;
}
/* cena zawsze na dole karty */
.elementor-258 .elementor-element-7ee934d {
  margin-top: auto !important;
}

/* ikona sypialni: rzut pomieszczenia zamiast łóżka */
.elementor-258 .elementor-element-adec453 .elementor-icon-list-item:nth-child(2) .elementor-icon-list-icon svg {
  display: none !important;
}
.elementor-258 .elementor-element-adec453 .elementor-icon-list-item:nth-child(2) .elementor-icon-list-icon::before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 18px;
  background-color: var(--hz-navy);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18' fill='none' stroke='%23000' stroke-width='1.3' stroke-linecap='square'%3E%3Cpath d='M1.5 1.5h15v15h-15z'/%3E%3Cpath d='M9 1.5v5.5M9 10.5v6M1.5 9h4.5M12 9h4.5'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18' fill='none' stroke='%23000' stroke-width='1.3' stroke-linecap='square'%3E%3Cpath d='M1.5 1.5h15v15h-15z'/%3E%3Cpath d='M9 1.5v5.5M9 10.5v6M1.5 9h4.5M12 9h4.5'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---------- 3. Strona apartamentu: przycisk „Udostępnij” ---------- */
.hz-share {
  position: relative;
  display: inline-flex;
  align-self: flex-start;
  width: auto !important;
  max-width: max-content;
  align-items: center;
  margin: 12px 0 4px;
}
.hz-share__btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 18px;
  border: 1px solid var(--hz-navy) !important;
  border-radius: 0;
  background: transparent !important;
  color: var(--hz-navy) !important;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .02em;
  line-height: 1;
  cursor: pointer;
  transition: background-color .2s ease, color .2s ease;
}
.hz-share__btn svg {
  color: var(--hz-gold);
  flex: 0 0 auto;
}
.hz-share__btn:hover,
.hz-share__btn:focus-visible {
  background: var(--hz-navy) !important;
  color: #fff !important;
}
.hz-share__btn:focus-visible {
  outline: 2px solid var(--hz-gold);
  outline-offset: 2px;
}
/* Przycisk „Rezerwuj” obok „Udostępnij” (panel rezerwacyjny wysuwany z prawej – podpięcie w przygotowaniu) */
.hz-share { gap: 12px; }
.hz-book__btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 22px;
  border: 1px solid var(--hz-navy) !important;
  border-radius: 0;
  background: var(--hz-navy) !important;
  color: #fff !important;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .02em;
  line-height: 1;
  cursor: pointer;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.hz-book__btn svg { color: var(--hz-gold); flex: 0 0 auto; transition: color .2s ease; }
.hz-book__btn:hover svg,
.hz-book__btn:focus-visible svg { color: #fff; }
.hz-book__btn:hover,
.hz-book__btn:focus-visible {
  background: var(--hz-gold) !important;
  border-color: var(--hz-gold) !important;
  color: #fff !important;
}
.hz-book__btn:focus-visible {
  outline: 2px solid var(--hz-gold);
  outline-offset: 2px;
}
.hz-share__toast {
  position: absolute;
  left: calc(100% + 12px);
  white-space: nowrap;
  font-size: 13px;
  color: var(--hz-navy);
  opacity: 0;
  transition: opacity .2s ease;
  pointer-events: none;
}
.hz-share__toast.is-visible {
  opacity: 1;
}
@media (max-width: 767px) {
  .hz-share__toast { left: 0; top: calc(100% + 6px); }
}

/* ---------- 4. Strona apartamentu: sekcja Lokalizacja – kwadratowa mapa + W pobliżu ---------- */
.hz-location {
  width: 100%;
  background: #f4f3f1;              /* przeplatane tła sekcji: biała / beżowa */
  padding: 64px 30px;               /* jak kontenery Elementora: max 1270px + 30px po bokach */
  font-family: 'Poppins', sans-serif;
}
.hz-location__inner {
  max-width: 1270px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 560px) minmax(0, 1fr);
  gap: 64px;
  align-items: center;
}
.hz-location__map .horizon-map-container {
  width: 100%;
  height: auto !important;
  aspect-ratio: 1 / 1;
  min-height: 0 !important;
  margin: 0;
  border-radius: 0;
  box-shadow: none;
  overflow: hidden;
}
.hz-location__map .horizon-map {
  height: 100% !important;
}
.hz-location__title {
  margin: 0 0 10px !important;
  color: var(--hz-navy, #061523);
  font-size: 26px !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  text-transform: uppercase;
}
.hz-location__addr {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 !important;
  color: var(--hz-gold, #af801d);
  font-size: 14px;
  font-weight: 300;
}
.hz-location__addr svg { flex: 0 0 auto; }
.hz-location .hz-nearby,
.hz-location .hz-nearby__admin {
  width: 100%;
  margin: 24px 0 0;
}
@media (max-width: 1024px) {
  .hz-location__inner {
    grid-template-columns: minmax(0, 1fr);
    gap: 28px;
  }
  .hz-location__map { max-width: 560px; }
}
@media (max-width: 767px) {
  .hz-location { padding: 40px 20px; }
  .hz-location__title { font-size: 22px !important; }
}

/* ---------- 5. Mapy: dymek apartamentu i kontrolki w stylu Horizon ---------- */
.horizon-map-container {
  background: #f4f3f1;               /* zamiast szarego tła przed wczytaniem kafelków */
}
.horizon-map .gm-style .gm-style-iw-c {
  border-radius: 4px;
  padding: 12px !important;
  box-shadow: 0 8px 24px rgba(6, 21, 35, .18);
}
.horizon-map .gm-style .gm-style-iw-d {
  overflow: hidden !important;
}
.horizon-map .gm-style .gm-style-iw-chr {
  position: absolute;
  top: 4px;
  right: 4px;
  z-index: 5;
}
.horizon-map .gm-style .gm-style-iw-chr button {
  background: rgba(255, 255, 255, .92) !important;
  border-radius: 50%;
  width: 32px !important;
  height: 32px !important;
}
.horizon-map .gm-style .gm-style-iw-chr button span {
  background-color: var(--hz-navy) !important;
  margin: 8px !important;
  width: 16px !important;
  height: 16px !important;
}
.horizon-map .gm-style .gm-style-iw-tc::after {
  background: #fff;
}
.horizon-map .apartment-popup,
.horizon-map .apartment-popup * {
  font-family: 'Poppins', sans-serif;
}
.horizon-map .apartment-popup .apartment-image {
  border: 0 !important;
  border-radius: 2px !important;
}
.horizon-map .apartment-popup .apartment-title {
  margin-top: 4px;
  color: var(--hz-navy);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.35;
}
.horizon-map .apartment-popup .apartment-address {
  color: var(--hz-gold);
  font-size: 13px;
  line-height: 1.8;
}
.horizon-map .apartment-popup .apartment-details .detail-item span {
  color: #2e3236;
  font-size: 12px;
  font-weight: 400;
}
.horizon-map .apartment-popup .apartment-price {
  margin-top: 6px;
  color: var(--hz-navy);
  font-size: 15px;
  font-weight: 600;
}
.horizon-map .gm-bundled-control .gmnoprint > div,
.horizon-map .gm-control-active {
  box-shadow: 0 2px 8px rgba(6, 21, 35, .12) !important;
}
.horizon-map .gm-control-active img {
  filter: brightness(0) saturate(100%) invert(7%) sepia(28%) saturate(1500%) hue-rotate(178deg) brightness(95%); /* granatowe +/- */
}

/* ---------- Lista apartamentów (archiwum 255) – mobile: kontener z kartami i mapą (0f9e62b) ma w Elementorze
   margines z lewej 20 px przy szerokości 100% (a kolumny 30 px marginesu z prawej) → wystawał 20 px poza prawą krawędź ekranu ---------- */
@media (max-width: 767px) {
  html body .elementor-element.elementor-element-0f9e62b {
    --margin-left: 0px;
    margin-left: 0 !important;
    padding-left: 20px !important;   /* równe marginesy jak w reszcie strony na telefonie */
    padding-right: 20px !important;
  }
  /* siatka kart: kolumna nie może być szersza niż ekran (treść karty wymuszała 342 px) */
  html body .elementor-element.elementor-element-0f9e62b .elementor-loop-container.elementor-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  html body .elementor-element.elementor-element-0f9e62b .e-loop-item {
    min-width: 0;
    max-width: 100%;
  }
  html body .elementor-element.elementor-element-0f9e62b > .elementor-element {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* Lokalizacja na beżowym tle: biała ramka informacji o dojeździe, żeby nie zlewała się z tłem */
.hz-location .hz-nearby__transport { background: #fff; }
