/* Start:/local/templates/erda_2021/components/bitrix/news.list/map/style.css?17912017326951*/
:root {
  --c-phone: #D91B5C;
  --c-btn-soft-bg: #E7E9FF;
  --c-btn-soft-text: #6A73DA;
  --c-btn-primary: #D91B5C;
  --c-text: #1a1a1a;
  --c-muted: #6b6b6b;
  --c-line: #ececec;
}
/* ---------- Блок с картой ---------- */
.branches {
  position: relative;
  max-width: 1210px;
  height: 540px;
  margin: 0 auto;
  border-radius: 24px;
  overflow: hidden;
}
.branches__map { position: absolute; inset: 0; background: #e8eef0; }

/* ---------- Плавающая панель ---------- */
.branches__panel {
  position: absolute;
  top: 22px;
  left: 16px;
  z-index: 10;
  width: 358px;
  max-height: calc(100% - 44px);
  padding: 30px 25px;
  background: #fff;
  border-radius: 28px;
  overflow-y: auto;
  box-shadow: 0 4px 24px rgba(0, 0, 0, .06);
}

.view { display: none; }
.view.is-active { display: block; animation: fade .25s ease; }
@keyframes fade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

/* ---------- Список ---------- */
.view__title {
  margin: 0 0 20px;
  font-size: 22px;
  font-weight: 500;
  line-height: 1.2;
}

.branches .list { margin: 0; padding: 0; list-style: none; border-bottom: 0}
.page ul > li.list__item {
    margin-bottom: initial; 
    position: initial;
    padding-left: initial; 
}
.list__item {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: end;
  column-gap: 12px;
  padding: 14px 0;
  border-bottom: 1px solid var(--c-line);
}
.list__item:first-child { padding-top: 0; }
.list__item:last-child { border-bottom: 0; padding-bottom: 0; }

.list__address { grid-column: 1 / -1; margin: 0 0 6px; font-size: 16px; line-height: 1.3; }
.list__hours   { font-size: 13px; line-height: 1.25; color: var(--c-muted); }
.list__phone   { display: inline-block; margin-top: 6px; font-size: 16px; color: var(--c-phone); text-decoration: none; }

/* ---------- Кнопки ---------- */
.branches .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 34px;
  padding: 0 18px;
  border: 0;
  border-radius: 20px;
  font: inherit;
  font-size: 14px;
  text-decoration: none;
  cursor: pointer;
  transition: filter .15s ease, transform .15s ease;
}
.branches .btn:hover { filter: brightness(.96); }
.branches .btn:active { transform: scale(.98); }

.branches .btn--soft { background: var(--c-btn-soft-bg); color: var(--c-btn-soft-text); min-width: 94px; }

.branches .btn--primary {
  height: 38px;
  min-width: 175px;
  margin-top: 22px;
  background: var(--c-btn-primary);
  color: #fff;
}

/* ---------- Карточка филиала ---------- */
.back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 22px;
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  font-size: 15px;
  color: var(--c-phone);
  cursor: pointer;
}

.detail__address {
  margin: 0 0 20px;
  font-style: normal;
  font-size: 16px;
  line-height: 1.3;
}
.detail__label { margin-bottom: 4px; font-size: 14px; color: var(--c-muted); }
.detail__hours { margin-bottom: 16px; font-size: 14px; line-height: 1.3; }
.detail__phones a {
  display: block;
  font-size: 17px;
  line-height: 1.5;
  color: var(--c-text);
  text-decoration: none;
}

/* ---------- Адаптив ---------- */
@media (max-width: 640px) {
  body { padding: 12px; }
  .branches { height: 620px; }
  .branches__panel {
    top: auto; left: 12px; right: 12px; bottom: 12px;
    width: auto;
    max-height: 60%;
  }
}



/* ---------- Планшеты и небольшие ноутбуки ---------- */
@media (max-width: 1024px) {
  .branches {
    height: 560px;
    border-radius: 20px;
  }

  .branches__panel {
    width: 330px;
    padding: 24px 20px;
  }

  .view__title {
    font-size: 20px;
  }
}

/* ---------- Мобильные устройства ---------- */
@media (max-width: 640px) {
  /* Блок занимает весь экран */
  .branches {
    display: flex;
    flex-direction: column;
    height: 100vh;
    height: 100dvh; /* корректная высота с учётом адресной строки */
    max-width: none;
    border-radius: 0;
    overflow: hidden;
  }

  /* Карта — верхняя часть */
  .branches__map {
    position: relative;
    flex: 1 1 auto;
    min-height: 45vh;
    inset: auto;
  }

  /* Панель — нижний «шторкой» блок */
  .branches__panel {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    z-index: 10;

    width: 100%;
    max-height: 55vh;
    padding: 20px 16px calc(20px + env(safe-area-inset-bottom));
    margin-top: -20px;            /* лёгкое наложение на карту */
    border-radius: 24px 24px 0 0;
    box-shadow: 0 -6px 24px rgba(0, 0, 0, .08);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* Заголовок */
  .view__title {
    margin-bottom: 16px;
    font-size: 19px;
  }

  /* ---------- Список филиалов ---------- */
  .branches .list__item {
    grid-template-columns: 1fr;
    align-items: stretch;
    row-gap: 10px;
    padding: 16px 0;
  }

  .list__address {
    margin-bottom: 4px;
    font-size: 15px;
  }

  .list__hours {
    font-size: 12.5px;
  }

  .list__phone {
    margin-top: 4px;
    font-size: 15px;
  }

  /* Кнопка «Подробнее» — на всю ширину */
  .branches .btn--soft {
    width: 100%;
    min-width: 0;
    height: 40px;
    margin-top: 4px;
    font-size: 15px;
  }

  /* ---------- Карточка филиала ---------- */
  .back {
    margin-bottom: 18px;
    font-size: 14px;
  }

  .detail__address {
    margin-bottom: 16px;
    font-size: 15px;
  }

  .detail__hours {
    font-size: 13.5px;
  }

  .detail__phones a {
    font-size: 16px;
  }

  .branches .btn--primary {
    width: 100%;
    min-width: 0;
    height: 44px;
    margin-top: 18px;
    font-size: 15px;
  }
}

/* ---------- Очень узкие экраны ---------- */
@media (max-width: 360px) {
  .branches__panel {
    padding: 16px 12px calc(16px + env(safe-area-inset-bottom));
  }

  .view__title {
    font-size: 18px;
  }

  .list__address {
    font-size: 14.5px;
  }

  .list__phone {
    font-size: 14.5px;
  }
}

/* ---------- Ландшафтная ориентация на телефоне ---------- */
@media (max-width: 900px) and (orientation: landscape) {
  .branches {
    flex-direction: row;
    height: 100vh;
    height: 100dvh;
  }

  .branches__map {
    flex: 1 1 auto;
    min-height: 0;
  }

  .branches__panel {
    width: 320px;
    max-height: 100%;
    margin-top: 0;
    margin-left: -16px;
    border-radius: 20px 0 0 20px;
    box-shadow: -6px 0 24px rgba(0, 0, 0, .08);
  }
}

/* ---------- Уважение к настройкам доступности ---------- */
@media (prefers-reduced-motion: reduce) {
  .view.is-active {
    animation: none;
  }

  .branches .btn {
    transition: none;
  }
}
/* End */
/* /local/templates/erda_2021/components/bitrix/news.list/map/style.css?17912017326951 */