/* Hover */
/*g.sector:hover .s-polygon { filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.85)); } g.sector:hover text { transform: scale(1.15); }*/

.tmap__svg .s-polygon { will-change: opacity; }

g.sector .s-polygon {
    fill-opacity: 0.5;
}

.filtered g.sector .s-polygon {
    fill-opacity: 0.8;
}

g.sector.sold text {
        /*fill: #000000;*/
        fill: #fff;

    
}

g.sector.new .s-polygon {
    fill: #e9e9e9;
    stroke: #fff;
}

g.sector.active .s-polygon {
    fill: #5fc127;
    stroke: #b7ff8e;
}

g.sector.discount .s-polygon {
    /*fill: #4927c1;*/
    fill:#FF9800;
    stroke: #beb2e9;
}
g.sector.tech .s-polygon {
    fill: transparent;
    fill-opacity: 0.3;
    stroke: #ffffff;
}

.filtered g.sector.tech .s-polygon {
    fill-opacity: 0.65;
}

g.sector.sold .s-polygon {
    stroke: #ffcdce;
}

g.sector.reserv .s-polygon {
    stroke: #ffeab1;
}

/* Подписи */
.tmap__svg .sector text {
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
      /*font-size: 18px;*/
  font-size: 26px;

  /*font-weight: 600;*/
 font-weight: 700;
  /*fill: #000;*/
  fill: #fff;

  paint-order: stroke fill;
  /*stroke: #fff;*/
  stroke-width: 2px;

  pointer-events: none; /* чтобы hover/клик шёл по фигуре */
  user-select: none;
}

.tmap {
  /* Подписи */

   cursor: grab;
}

/* hover только у конкретного полигона */
.tmap__svg .s-polygon.is-hovered {
  fill: var(--tmap-sector-fill-hover) !important;
  stroke: var(--tmap-sector-stroke-hover) !important;
}

/* стабилизация рендера текста */
.tmap__svg text {
  text-rendering: geometricPrecision;
  shape-rendering: geometricPrecision;
}

/*g.sector[data-sector-number]:hover text {*/
/*  transform: scale(1.15);*/
/*}*/

/* сама группа не должна ловить клики */
.tmap-icon,
.tmap-icon * { pointer-events: none; }

.tmap-icon__ring{
  fill: #fff;                 /* если захочешь фон — добавим вторую фигуру, но ты просил 1 circle */
  stroke: #fff;
  /* stroke-width: 1; */
  vector-effect: non-scaling-stroke;
}

.tmap-icon__svg{
  /* можно управлять цветом иконок если они внутри используют currentColor */
  /* color: #6b7280; */
}

    /* ====== Layout ====== */
.tmap {
  position: relative;
  width: 100%;
  min-height: 360px;
}

.tmap__viewport {
  position: relative;
  width: 100%;
  height: 85vh;
  min-height: 600px;
  overflow: hidden;
  background: #f3f3f3;
  touch-action: none;            /* важно для pan/pinch */
  user-select: none;
  outline: none;
}

@media screen and (max-width:640px) {
  .tmap__viewport {
    min-height: 50vh;
    max-height: 70vh;
  }
}

.tmap__stage {
  position: absolute;
  left: 0; top: 0;
  transform-origin: 0 0;
  will-change: transform;
}

.tmap__bg,
.tmap__svg {
  position: absolute;
  left: 0; top: 0;
  width: 100%;
  height: 100%;
}

.tmap__bg {
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 100% 100%;
  opacity: 0;
  transition: opacity 240ms ease;
}

.tmap__bg--blur {
  filter: blur(10px);
  transform: scale(1.03);
}

.tmap__bg.is-visible { opacity: 1; }

/* SVG */
.tmap__svg svg {
  width: 100%;
  height: 100%;
  display: block;
}

.tmap__hit {
  cursor: pointer;
}

.tmap__hit.is-hidden {
  display: none !important;
}

.tmap__hit.is-dimmed {
  opacity: .18;
  pointer-events: none;
}

/* ====== Controls ====== */
.tmap__controls {
  position: absolute;
  right: 12px;
  top: 12px;
  top: 50%;
    transform: translate(0px, -50%);
  display: flex;
  flex-direction: column;
  gap: 10px;
  z-index: 10;
}

.tmap__filters {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px;
  background: rgba(255,255,255,.92);
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0,0,0,.12);
  max-width: 220px;
}

.tmap__filter-btn {
  appearance: none;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
  padding: 8px 10px;
  border-radius: 10px;
  font: 14px/1.2 sans-serif;
  text-align: left;
  cursor: pointer;
  display: flex;
  color:#000!important;
}

.tmap__filter-btn.is-active {
  border-color: rgba(0,0,0,.45);
}


.tmap__filters-popover {
  position: absolute;
  right: 56px;     /* слева от кнопок */
  top: 0;
  width: 220px;
  max-height: 60vh;
  overflow: auto;
  padding: 10px;
      margin-right: 20px;
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0,0,0,.12);
  z-index: 11;
}

.tmap__filters-list { display: flex; flex-direction: column; gap: 8px; }

.tmap__btn {
    display:block;
  appearance: none;
  border: 1px solid rgba(0,0,0,.12);
  background: rgba(255,255,255,.92);
  width: 44px;
  height: 44px;
  border-radius: 12px;
  font-size: 22px;
  cursor: pointer;
  box-shadow: 0 10px 30px rgba(0,0,0,.12);
      color: #000 !important;
          max-width: 40px;
}

.tmap__btn--reset { font-size: 18px; }

/* ====== Modal ====== */
.tmap-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: none;
}

.tmap-modal.is-open { display: block; }

.tmap-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.55);
}

.tmap-modal__panel {
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(720px, calc(100% - 32px));
  max-height: calc(100% - 32px);
  transform: translate(-50%, -50%);
  background: #fff;
  border-radius: 16px;
  overflow: auto;
  box-shadow: 0 18px 70px rgba(0,0,0,.35);
  /*padding: 18px 18px 22px;*/
}

.tmap-modal__close {
  position: sticky;
  top: 0;
  margin-left: auto;
  display: block;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  font-size: 22px;
  cursor: pointer;
}

.tmap-card__title {
  font: 600 20px/1.25 sans-serif;
  margin: 6px 0 10px;
}
.tmap-card__meta {
  font: 14px/1.4 sans-serif;
  opacity: .75;
  margin-bottom: 10px;
}
.tmap-card__price {
  font: 600 18px/1.25 sans-serif;
  margin-bottom: 14px;
}
.tmap-card__text {
  font: 14px/1.55 sans-serif;
}
.tmap-card__link {
  margin-top: 14px;
  font: 14px/1.4 sans-serif;
}


.Hstrong {
    font-weight: 600;
}












/*СЛАЙДЕР*/

.tmap-popup__head{
  position: relative;
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding: 14px 14px 0 14px;
  /* padding-right:92px; */
  padding-right: 22px;
}


.tmap-popup__media{ position:relative; cursor:pointer; }
.tmap-popup__slider.siema{ overflow:hidden; border-radius:8px;}
.tmap-popup__slide{ width:100%; }

.tmap-popup__nav{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 29px;
    height: 29px;
    border-radius: 6px;
    border: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 50px;
    line-height: 0;
    padding-bottom: 7px;
    background: rgb(68 105 92 / 0%);
    color: #fff;
}
.tmap-popup__nav--prev{ left:20px; }
.tmap-popup__nav--next{ right:20px; }






    .tmap__filter-color {
  display:inline-block;
  width:14px;
  height:14px;
  border-radius:3px;
  margin-right:6px;
  vertical-align:middle;
}



    /* ===== Modal: scroll on overlay, not inside panel ===== */
.tmap-modal {
  position: fixed;
  inset: 0;
  z-index: 10000;

  display: none;
  background: rgba(0,0,0,.55);

  overflow-y: auto;         /* скроллится вся модалка */
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;

  padding: 24px 16px;       /* отступы от краёв экрана */
}
.tmap-modal::-webkit-scrollbar {width: 0;}


.tmap-modal.is-open { display: block; }

.tmap-modal__panel {
  position: relative;
  margin: 0 auto;
  width: min(720px, 100%);

  background: #fff;
  border-radius: 10px;
  box-shadow: 0 18px 60px rgba(0,0,0,.25);

  overflow: visible;        /* важно: убираем внутренний скролл */
}

/* Если у вас было max-height + overflow:auto — УДАЛИТЬ */
.tmap-modal__content {
  /*padding: 18px 18px 22px 18px;*/
}


/* Close фиксирован в окне, а не внутри панели */
.tmap-modal__close {
  position: fixed;
  top: 14px;
  right: 25px;
  z-index: 10001;

  width: 44px;
  height: 44px;
  border-radius: 10px;

  border: 1px solid rgba(255,255,255,.35);
  background: rgba(0,0,0,.55);
  color: #fff;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  cursor: pointer;
}

/* чтобы на светлой панели кнопка не терялась — можно так */
@media (min-width: 880px) {
  .tmap-modal__close {
    background: rgba(0,0,0,.45);
  }

}



.tmap-popup { display: block; }


.tmap-badge {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #999;
}

.tmap-popup__status--free  { background: #2ecc71; }
.tmap-popup__status--reserved  { background: #f1c40f; }
.tmap-popup__status--sold { background: #e74c3c; }
.tmap-popup__status--soon { background: #3498db; }
.tmap-popup__status--loading { background: rgba(0,0,0,.15); }

.tmap-popup__title-text {
    font-size: 20px; font-weight: 700; line-height: 1.2; }
.tmap-popup__descr {
    margin-top: 6px; color: rgba(0,0,0,.68);
    padding: 6px 14px 0 14px;
}

.tmap-popup {
        font-family: 'Montserrat';
}

.tmap-popup__media { padding: 10px 14px 0 14px; }
.tmap-popup__img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 12px;
    background: rgba(0,0,0,.04);
    min-height: 360px;
    max-height: 360px;
    object-fit: cover;
}

.tmap-popup__tiles {
  padding: 14px;
  display: grid;
  gap: 10px;
}


.tmap-popup__tiles { padding: 14px; display: grid; gap: 10px; grid-template-columns: repeat(4, minmax(0, 1fr));  }
.tmap-popup__tiles--c3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

@media (max-width: 720px) {
  .tmap-popup__tiles--c3, .tmap-popup__tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  
    .tmap-modal__close {
      /*top: 34px;*/
      /*right: 26px;*/
              top: 12px;
        right: 16px;
  }
  .tmap-tile__label, .tmap-tile__k {
      font-size: 10px;
  }
  .tmap-tile__value, .tmap-tile__v {
          font-size: 18px;
  }
  .tmap-tile {
      min-height: 54px;
  }
  .tmap-popup__descr {
      font-size:14px;
  }
  .tmap-line__k, .tmap-line__v {
          font-size: 12px;
  }
  .tmap-popup__img {
    min-height: 200px;
    max-height: 200px;
  }
}

.tmap-tile {
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 12px;
  padding: 10px 10px 12px 10px;
  background: rgba(0,0,0,.02);
  min-height: 74px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.tmap-tile__label { font-size: 12px; color: rgba(0,0,0,.55); }
.tmap-tile__value { font-size: 16px; font-weight: 700; color: rgba(0,0,0,.88); }

.tmap-popup__extra { padding: 0 14px 14px 14px; }
.tmap-kv { padding: 10px 0; border-top: 1px solid rgba(0,0,0,.06); }
.tmap-kv__k { font-size: 12px; color: rgba(0,0,0,.55); }
.tmap-kv__v { margin-top: 4px; font-size: 14px; color: rgba(0,0,0,.88); }

.tmap-popup__price { padding: 0 14px 14px 14px; font-size: 20px; font-weight: 800; }

.tmap-popup__actions {
  padding: 0 14px 16px 14px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.tmap-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;

  padding: 10px 20px;
  border-radius: 6px;
  text-decoration: none;
  font-weight: 500;
  
          font-size: 14px;
    font-family: 'Montserrat';
        font-weight: 500;
}
.tmap-btn--primary {
    background: #111;
    color: #fff !important;
}

.tmap-btn--ghost {
        background: #44695c;
    color: #fff !important;
}

.tmap-btn--secondary {
    background: rgba(0,0,0,.06);
    color: #111!important;
}

/* ===== Skeleton ===== */
.tmap-skel {
  display: inline-block;
  height: 12px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(0,0,0,.06), rgba(0,0,0,.12), rgba(0,0,0,.06));
  background-size: 200% 100%;
  animation: tmap-skel 1.2s infinite linear;
}
.tmap-skel--h28 { height: 28px; width: 100%; border-radius: 12px; }
.tmap-skel--w120 { width: 120px; }
.tmap-skel--w220 { width: 220px; }
.tmap-skel--w90 { width: 90px; }
.tmap-skel--w140 { width: 140px; }
.tmap-skel--media { width: 100%; height: 220px; border-radius: 12px; }
.tmap-skel--btn { width: 180px; height: 44px; border-radius: 12px; }
@keyframes tmap-skel { 0% { background-position: 0% 0; } 100% { background-position: 200% 0; } }









/* ===== Popup content ===== */
.tmap-popup__status {
    display: flex;
    /*position: absolute;*/
    top: 12px;
    left: 14px;
    align-items: center;
    gap: 10px;
    padding: 6px 12px;
    border-radius: 5px;
    color: #fff;
    font-size: 12px;
}

.tmap-badge { width: 10px; height: 10px; border-radius: 999px; background: #999; }


.tmap-popup__title { padding: 48px 14px 6px; }
.tmap-popup__title-text { font-size: 20px; font-weight: 700; line-height: 1.2; }
.tmap-popup__descr { margin-top: 6px; color: rgba(0,0,0,.68); }

.tmap-popup__media { padding: 10px 14px 0; }

.tmap-popup__text {
        padding: 10px 14px 14px;
        font-size: 14px; }




.tmap-tile {
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 12px;
  padding: 10px 10px 12px;
  background: rgba(0,0,0,.02);
  min-height: 50px;
  display: flex; flex-direction: column; justify-content: space-between;
  
  font-family: 'Montserrat';
}
.tmap-tile__label, .tmap-tile__k { font-size: 12px; color: rgba(0,0,0,.55); }
.tmap-tile__value, .tmap-tile__v { font-size: 18px; font-weight: 700; color: rgba(0,0,0,.88); }

.tmap-popup__extra { padding: 0 14px 14px; }
.tmap-kv { padding: 10px 0; border-top: 1px solid rgba(0,0,0,.06); }
.tmap-kv__k { font-size: 12px; color: rgba(0,0,0,.55); }
.tmap-kv__v { margin-top: 4px; font-size: 14px; color: rgba(0,0,0,.88); }

.tmap-popup__price { padding: 0 14px 14px; font-size: 20px; font-weight: 800; display:none;}

.tmap-popup__actions { padding: 0 14px 16px; display: flex; gap: 10px; flex-wrap: wrap; }

.tmap-btn--primary { background: #111; color: #fff; }
.tmap-btn--secondary { background: rgba(0,0,0,.06); color: #111; }

/* ===== Skeleton ===== */
.tmap-skel {
  display: inline-block;
  height: 12px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(0,0,0,.06), rgba(0,0,0,.12), rgba(0,0,0,.06));
  background-size: 200% 100%;
  animation: tmap-skel 1.2s infinite linear;
}
.tmap-skel--h28 { height: 28px; width: 100%; border-radius: 12px; }
.tmap-skel--w120 { width: 120px; }
.tmap-skel--w220 { width: 220px; }
.tmap-skel--w90  { width: 90px; }
.tmap-skel--w140 { width: 140px; }
.tmap-skel--media { width: 100%; height: 220px; border-radius: 12px; }
.tmap-skel--btn { width: 180px; height: 44px; border-radius: 12px; }
@keyframes tmap-skel { 0% { background-position: 0% 0; } 100% { background-position: 200% 0; } }




.tmap-modal {
    overflow-y: auto;
        padding: 64px 16px 24px 16px;
}
.tmap-modal__panel { position: relative; margin: 0 auto; left:auto; top:auto; transform:none; overflow: visible; max-height:none; }


.tmap__viewport{ touch-action:none; overscroll-behavior:contain; }
.tmap__stage{ transform-origin:0 0; }

.tmap-popup__status--discount{
  background:#FF9800;
  color:#fff;
}