#map-cover {
    display: flex;
    justify-content: center;
    background: transparent;
    padding: 15px 0 12px 0;
    margin-left: auto;
    overflow-x: auto;
    overflow-y: hidden;
  }
  #map-container {
    position: relative;
    font-family: Arial;
  }
  #map-overlay { position: absolute; top: 0; left: 0; }
  #legenda {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 24px;
    margin: 14px 0 40px;
  }
  #legenda > span {
    display: inline-flex;
    align-items: center;
  }
  #legenda .partner-plan-key {
    border: 1px solid grey;
    width: 35px;
    height: 35px;
    margin: 0 8px 0 0;
  }
  polygon { stroke: #472F1D; opacity: 0.5; }
  polygon.action { fill: #FFFF00; cursor: pointer; }
  #legenda .partner-plan-key.action { background-color: #FFFF00; }
  polygon.free { fill: #5f8e5f; cursor: pointer; }
  #legenda .partner-plan-key.free { background-color: #5f8e5f; }
  polygon.house { fill: #0066FF; cursor: pointer; }
  #legenda .partner-plan-key.house { background-color: #0066FF; }
  polygon.sell { fill: #FF0000; }
  #legenda .partner-plan-key.sell { background-color: #FF0000; }
  polygon.booked { fill: #ffa500; }
  #legenda .partner-plan-key.booked { background-color: #ffa500; }
  polygon.deposit { fill: #b87432; }
  #legenda .partner-plan-key.deposit { background-color: #b87432; }
  polygon.unavailable { fill: #BBBBBB; }
  #legenda .partner-plan-key.unavailable { background-color: #BBBBBB; }
  polygon:hover { fill: #fff; }
  #map-hover {
    display: none;
    visibility: hidden;
    position: absolute;
    width: 520px;
    height: auto;
    min-height: 150px;
    background: #fff;
    box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.8);
    border-radius: 0 10px;
  }
  #map-hover::after {
    content: "";
    position: absolute;
    bottom: -20px; /* Расположение ниже нижней границы div */
    left: 50%; /* Центрирование относительно div */
    border-width: 20px 10px 0 10px;
    border-style: solid;
    border-color: white transparent transparent transparent; /* Нижняя граница видимая, остальные прозрачные */
    transform: translateX(-50%); /* Дополнительное центрирование треугольника */
  }
  #map-hover::before {
    content: "";
    position: absolute;
    bottom: -22px; /* Немного ниже, чем сама стрелка */
    left: 50%;
    border-width: 22px 15px 0 15px;
    border-style: solid;
    border-color: rgba(0, 0, 0, .1) transparent transparent transparent; /* Цвет тени */
    transform: translateX(-50%); /* Небольшое искажение для имитации тени */
    z-index: 0; /* Убедитесь, что тень находится под самим треугольником */
  }
  #map-hover-info {
    flex: 4;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 10px 10px 20px 10px;
    font-size: 14px;
  }
  #map-hover-info header {
    font-size: 20px;
    font-weight: 900;
  }
  #map-hover-info .partner-plan-name {
    float: left;
    max-width: 150px;
    width: 150px;
    text-align: right;
    margin-right: 10px;
  }
  #map-hover-info .partner-plan-total {
    display: flex;
  }
  #map-hover-info .partner-plan-total .partner-plan-value {
    font-size: 20px;
    font-weight: 900;
    margin-top: 10px;
  }
  #map-hover-info .partner-plan-status {
    font-size: 20px;
    font-weight: 900;
    text-align: center;
    padding-top: 25px;
  }
  #map-hover-image {
    flex: 3;
    background-size: cover;
    border-radius: 0 10px 0 0;
  }
  @media (max-width: 900px), (hover: none) and (pointer: coarse) {
    #map-hover {
      display: none !important;
      visibility: hidden !important;
    }
  }
