/* =====================================================================
 * YARMETRO_DESKTOP_KIT_ROUND31 -- ДЕСКТОП: ДЕЙСТВИЯ У ОБЪЕКТА, ИКОНКИ
 * ИЗБРАННОГО И ЧАТА В ШАПКЕ, ВЫБОР НЕСКОЛЬКИХ ОБЪЕКТОВ В ИЗБРАННОМ.
 *
 * Почему отдельный файл, а не mobile-redesign.css: там всё живёт внутри
 * @media (max-width: 767px). Здесь наоборот -- всё от 768px и выше.
 * Разметка у карточки на десктопе и на телефоне ОДНА (см. шаблон каталога),
 * разное только оформление: на телефоне действия прячутся в шторку "•••",
 * на десктопе стоят строкой под карточкой -- мышью попадать проще, чем
 * пальцем, и прятать их незачем.
 *
 * Подключается ПОСЛЕДНИМ из наборов ui/ (см. header.php).
 * ===================================================================== */

@media (min-width: 768px) {

/* ---- 1. КАРТОЧКА ВЫДАЧИ ------------------------------------------- */

/* сердечко поверх фото -- привычное место, как у всех досок объявлений */
.metro-catalog-card .metro-catalog-card__media { position: relative; }
.metro-catalog-card .metro-catalog-card__save-actions {
    display: flex;
    gap: 8px;
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 4;
}
/* кнопка "•••" -- мобильная: она открывает шторку действий, а на десктопе
 * все эти действия и так стоят строкой под карточкой */
.metro-catalog-card .metro-catalog-card__save-actions [data-mobile-object-more] { display: none; }
.metro-catalog-card .metro-catalog-card__save-actions [data-mobile-save] {
    width: 38px;
    height: 38px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .93);
    color: #07183f;
    font-size: 19px;
    line-height: 1;
    display: grid;
    place-items: center;
    cursor: pointer;
    box-shadow: 0 2px 10px rgba(7, 24, 63, .18);
    transition: transform .15s ease, background .15s ease, color .15s ease;
}
.metro-catalog-card .metro-catalog-card__save-actions [data-mobile-save]:hover { transform: scale(1.09); }
.metro-catalog-card .metro-catalog-card__save-actions [data-mobile-save].is-active {
    background: var(--tenant-accent, #e7182c);
    color: #fff;
}

/* строка действий под карточкой */
.metro-catalog-card .ym-card-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: auto;
    padding: 0 18px 18px;
}
.metro-catalog-card .ym-card-actions a,
.metro-catalog-card .ym-card-actions button {
    height: 40px;
    border: 1px solid #dce2ea;
    border-radius: 12px;
    background: #fff;
    color: #07183f;
    font: 600 13.5px/1 "Golos Text", "Segoe UI", system-ui, sans-serif;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    display: inline-grid;
    place-items: center;
    transition: border-color .15s ease, color .15s ease, background .15s ease;
}
.metro-catalog-card .ym-card-actions a,
.metro-catalog-card .ym-card-actions [data-ym-chat-open] { padding: 0 16px; }
.metro-catalog-card .ym-card-actions [data-mobile-copy],
.metro-catalog-card .ym-card-actions [data-mobile-share] {
    width: 40px;
    flex: none;
    color: #6b7893;
}
.metro-catalog-card .ym-card-actions a:hover,
.metro-catalog-card .ym-card-actions button:hover {
    border-color: var(--tenant-accent, #e7182c);
    color: var(--tenant-accent, #e7182c);
}
/* "Написать в чат" -- главное действие строки, поэтому залитая кнопка */
.metro-catalog-card .ym-card-actions [data-ym-chat-open] {
    margin-left: auto;
    border-color: var(--tenant-accent, #e7182c);
    background: var(--tenant-accent, #e7182c);
    color: #fff;
}
.metro-catalog-card .ym-card-actions [data-ym-chat-open]:hover {
    border-color: #b8101f;
    background: #b8101f;
    color: #fff;
}
/* галочка вместо иконки на секунду после нажатия -- тот же приём, что на
 * телефоне (YARMETRO_ITEM84_ROUND28), но правило там внутри max-width */
.metro-catalog-card .ym-card-actions button .ym-icon-check { display: none; color: #1a9d5c; }
.metro-catalog-card .ym-card-actions button svg { width: 20px; height: 20px; }
.metro-catalog-card .ym-card-actions button.is-success {
    border-color: #1a9d5c;
    background: #eafff3;
    color: #1a9d5c;
}
.metro-catalog-card .ym-card-actions button.is-success .ym-icon-default { display: none; }
.metro-catalog-card .ym-card-actions button.is-success .ym-icon-check { display: block; }

/* ---- 2. СТРАНИЦА ОБЪЕКТА ------------------------------------------ */

.apartment-btns { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.apartment-btns .ym-obj-act {
    height: 40px;
    padding: 0 16px;
    border: 1px solid #dce2ea;
    border-radius: 12px;
    background: #fff;
    color: #07183f;
    font: 600 13.5px/1 "Golos Text", "Segoe UI", system-ui, sans-serif;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    transition: border-color .15s ease, color .15s ease, background .15s ease;
}
.apartment-btns .ym-obj-act:hover {
    border-color: var(--tenant-accent, #e7182c);
    color: var(--tenant-accent, #e7182c);
}
.apartment-btns .ym-obj-act svg { width: 18px; height: 18px; }
.apartment-btns .ym-obj-act .ym-icon-check { display: none; color: #1a9d5c; }
.apartment-btns .ym-obj-act.is-success { border-color: #1a9d5c; color: #1a9d5c; background: #eafff3; }
.apartment-btns .ym-obj-act.is-success .ym-icon-default { display: none; }
.apartment-btns .ym-obj-act.is-success .ym-icon-check { display: inline; }
.apartment-btns .ym-obj-act--chat {
    border-color: var(--tenant-accent, #e7182c);
    background: var(--tenant-accent, #e7182c);
    color: #fff;
}
.apartment-btns .ym-obj-act--chat:hover { border-color: #b8101f; background: #b8101f; color: #fff; }

/* ---- 2а. ВЕРХНЯЯ СТРОКА ШАПКИ (НА ПАУЗЕ, 17.09) -------------------
 * Перестановка под личный кабинет: «Заказать звонок» уезжал к контактам
 * колл-центра, e-mail придвигался к телефону, справа вставала кнопка
 * «Личный кабинет». Кабинет с сайта пока скрыт (header.php вернули как
 * было), правила ниже выключены вместе с ним. Включать разом с кнопкой
 * в header.php -- поодиночке шапка разъезжается.
 *
 * .header-phone--2 { left: 46%; }
 * .header-phone--callback { position: absolute; top: 16px; left: 63%; }
 * .header-phone--callback a {
 *     border-bottom: 1px dashed currentColor;
 *     text-decoration: none;
 * }
 * ------------------------------------------------------------------- */

/* ---- 3. ИКОНКИ В ШАПКЕ -------------------------------------------- */

/* Иконки стоят в одном ряду с пунктами меню: высота строки та же (24px),
   цвет и толщина линий — как у букв, иначе они выглядят тяжелее текста. */
.ym-head-chat-m { display: none; } /* мобильный значок чата -- только на телефоне */

.top-menu .ym-head-ico { position: relative; vertical-align: middle; }
.top-menu .ym-head-ico > a {
    display: inline-grid;
    place-items: center;
    width: 32px;
    height: 24px;
    border-radius: 8px;
    color: #14171a;
    transition: background .15s ease, color .15s ease;
}
.top-menu .ym-head-ico > a:hover { background: #f1f4f9; color: var(--tenant-accent, #e7182c); }
.top-menu .ym-head-ico svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.top-menu .ym-head-ico__count {
    position: absolute;
    top: -7px;
    right: -5px;
    min-width: 17px;
    height: 17px;
    padding: 0 4px;
    border-radius: 9px;
    background: var(--tenant-accent, #e7182c);
    color: #fff;
    font: 700 11px/17px "Golos Text", "Segoe UI", system-ui, sans-serif;
    text-align: center;
    pointer-events: none;
}
.top-menu .ym-head-ico__count[hidden] { display: none; }

}

@media (max-width: 767px) {

/* На телефоне у карточки своя шторка "•••" -- четвёртая кнопка в узкой
 * строке действий просто не помещается. Разметка общая, поэтому прячем
 * стилем, а не условием в скрипте. */
.metro-catalog-card .ym-card-actions [data-ym-chat-open] { display: none; }

.ym-offer-row.ym-offer-row--m { display: block; margin: 4px 0 14px; }
.ym-offer-row--m .ym-offer-chat { width: 100%; text-align: center; padding: 12px 14px; }

/* Вход в чат на телефоне -- значок справа от лого: плавающая кнопка
 * закрывала пункт «О нас» в нижнем меню (решение Сергея, 16.09). */
.header-top { position: relative; }
.header-top .ym-head-chat-m {
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--tenant-accent, #e7182c);
    color: #fff;
    box-shadow: 0 4px 12px rgba(216, 33, 58, .3);
}
.header-top .ym-head-chat-m svg {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

}

/* ---- Торг: «Предложить свою цену» (YARMETRO_OFFER_CHAT_ROUND31) ----
 * Кнопка стоит отдельным блоком под рядом действий карточки объекта --
 * из блока цены она убрана (склеивалась с суммой). Открывает ЧАТ с
 * заготовкой текста, не форму. Вне медиа-запросов: нужна и на десктопе,
 * и на телефоне. */
.ym-offer-row { margin-top: 10px; }
/* мобильная копия кнопки: её вставляет скрипт под ценой, показывается
 * только на телефоне (десктопный блок там скрыт вместе со своим рядом) */
.ym-offer-row--m { display: none; }
.ym-offer-chat {
    border: 1px dashed #c9d2e0;
    border-radius: 10px;
    background: #f7f9fc;
    color: #07183f;
    padding: 9px 14px;
    font: 600 13.5px/1 "Golos Text", "Segoe UI", system-ui, sans-serif;
    cursor: pointer;
    transition: border-color .15s ease, color .15s ease;
}
.ym-offer-chat:hover {
    border-color: var(--tenant-accent, #e7182c);
    color: var(--tenant-accent, #e7182c);
}

/* «Показать ещё» похожих упирался в блок «Связаться с нами» -- поля
 * заезжали друг на друга (скрин Сергея, 17.09) */
.metro-related { margin-bottom: 48px; }

/* ---- 4. ВЫБОР НЕСКОЛЬКИХ ОБЪЕКТОВ В ИЗБРАННОМ ---------------------
 * Панель выбора нужна и на телефоне (в шторке "Избранное"), и на десктопе
 * (страница /favorites/), поэтому она ВНЕ медиа-запроса выше.
 * ------------------------------------------------------------------- */
.ym-pick-bar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 16px;
    padding: 10px 12px;
    border: 1px solid #e4e9f2;
    border-radius: 14px;
    background: #f7f9fc;
    font: 400 13.5px/1.2 "Golos Text", "Segoe UI", system-ui, sans-serif;
    color: #07183f;
}
.ym-pick-bar__count { margin-right: auto; color: #6b7893; }
.ym-pick-bar button {
    height: 36px;
    padding: 0 14px;
    border: 1px solid #dce2ea;
    border-radius: 10px;
    background: #fff;
    color: #07183f;
    font: 600 13px/1 inherit;
    cursor: pointer;
    transition: border-color .15s ease, color .15s ease, background .15s ease;
}
.ym-pick-bar button:hover:not(:disabled) { border-color: var(--tenant-accent, #e7182c); color: var(--tenant-accent, #e7182c); }
.ym-pick-bar button:disabled { opacity: .45; cursor: default; }
.ym-pick-bar button.is-primary {
    border-color: var(--tenant-accent, #e7182c);
    background: var(--tenant-accent, #e7182c);
    color: #fff;
}
.ym-pick-bar button.is-primary:hover:not(:disabled) { border-color: #b8101f; background: #b8101f; color: #fff; }
.ym-pick-bar button.is-danger:hover:not(:disabled) { border-color: #d8213a; color: #d8213a; }
.ym-pick-bar__done { color: #1a9d5c; font-weight: 600; }

/* отметка выбора: на карточке выдачи и на строке мобильного списка */
.ym-pick-mark {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 5;
    width: 28px;
    height: 28px;
    /* пустая отметка была белой на белом, и её просто не находили --
     * теперь у неё всегда заметная рамка (скрин Сергея, 16.09) */
    border: 2px solid #8d99b2;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(7, 24, 63, .2);
    cursor: pointer;
    display: grid;
    place-items: center;
    padding: 0;
}
.ym-pick-mark::after {
    content: "";
    width: 12px;
    height: 7px;
    border-left: 2.5px solid #fff;
    border-bottom: 2.5px solid #fff;
    transform: rotate(-45deg) translate(1px, -2px);
    opacity: 0;
}
.ym-pick-mark.is-on { background: var(--tenant-accent, #e7182c); border-color: var(--tenant-accent, #e7182c); }
.ym-pick-mark.is-on::after { opacity: 1; }
.ym-pick-on .metro-catalog-card { position: relative; }
.ym-pick-on .metro-catalog-card.is-picked { outline: 2px solid var(--tenant-accent, #e7182c); outline-offset: 2px; border-radius: 16px; }

/* Строка мобильного списка: отметка стоит в потоке, слева от карточки.
 * Рамку и фон здесь приходится ПОВТОРИТЬ: у строки есть своё правило
 * «.ym-mobile-saved-row button { border:0; background:transparent }»
 * (mobile-redesign.css), оно специфичнее базового .ym-pick-mark и делало
 * пустую отметку невидимой -- ровно та жалоба со скрина 16.09. */
.ym-mobile-saved-row .ym-pick-mark {
    position: static;
    flex: none;
    align-self: center;
    margin-right: 10px;
    width: 28px;
    height: 28px;
    border: 2px solid #8d99b2;
    border-radius: 8px;
    background: #fff;
    box-shadow: none;
}
.ym-mobile-saved-row .ym-pick-mark.is-on {
    border-color: var(--tenant-accent, #e7182c);
    background: var(--tenant-accent, #e7182c);
}
.ym-mobile-saved-row .ym-pick-mark::after { border-color: #fff; }
.ym-pick-on .ym-mobile-saved-row { display: flex; align-items: stretch; }
.ym-pick-on .ym-mobile-saved-row > a { flex: 1; min-width: 0; }
.ym-pick-on .ym-mobile-saved-row > button:not(.ym-pick-mark) { display: none; }

/* YARMETRO_NEWS_PLACEHOLDER_ROUND42 (п.241, 21.09.2026). Карточка новости без
   фото: вместо пустого серого поля — нейтральная обложка в цветах сайта.
   Ловим пустой url() в style, который ставят шаблоны списков новостей (главная,
   /news/, блоки на страницах услуг). Картинка — images/news-placeholder.svg. */
.news-item__img[style*="url()"],
.news-item__img[style*="url('')"],
.news-item__img[style*='url("")'],
.news-item__img:not([style]){
  background-image:url(/local/templates/metro/images/news-placeholder.svg)!important;
  background-size:cover!important;
  background-position:center!important;
}

/* YARMETRO_BREADCRUMBS_ROUND42 (п.269, п.358): крошки — полный путь с текущей
   страницей «Главная › Каталог недвижимости» (текущая — тёмным, без ссылки);
   на телефоне — одна ссылка «‹ <раздел выше>» (ym-bc__up) */
.breadcrumbs.ym-bc{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:13px;line-height:18px;margin:0 0 10px;padding:0;color:#8a8f98}
.breadcrumbs.ym-bc .ym-bc__it,.breadcrumbs.ym-bc .ym-bc__it span{display:inline;padding:0;margin:0;font-size:inherit;color:inherit}
.breadcrumbs.ym-bc a{color:#8a8f98;text-decoration:none;transition:color .15s}
.breadcrumbs.ym-bc a:hover{color:#e7182c}
.breadcrumbs.ym-bc .ym-bc__sep{display:inline-block;width:6px;height:6px;border-top:1.5px solid #b8bec8;border-right:1.5px solid #b8bec8;transform:rotate(45deg);margin:0 2px 0 0}
.breadcrumbs.ym-bc .ym-bc__cur,.breadcrumbs.ym-bc .ym-bc__cur span{color:#3e444d}
@media (max-width:767px){
  .breadcrumbs.ym-bc .ym-bc__sep,.breadcrumbs.ym-bc .ym-bc__it:not(.ym-bc__up){display:none}
  .breadcrumbs.ym-bc .ym-bc__up a:before{content:"";display:inline-block;width:7px;height:7px;border-left:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin:0 6px 1px 2px}
}

/* YARMETRO_REQUEST_AGREE_ROUND42 (п.270): галочка согласия в формах заявки
   на компьютере стояла посреди строки, а текст — у правого края */
@media (min-width:1024px){
  .request-btns .check-wrap{display:flex!important;justify-content:flex-end;align-items:flex-start;gap:10px;padding-left:0!important}
  .request-btns .check-wrap .jq-checkbox{position:relative!important;left:auto!important;top:auto!important;flex:none;margin-top:3px}
  .request-btns .check-wrap .agree{padding-left:0!important;text-align:left;max-width:520px}
}

/* YARMETRO_INPUT_INK_ROUND42 (п.302): в формах сайта введённый текст был
   почти невидимым (светло-серый). Пишем тёмным, подсказку оставляем серой. */
.input,input.input,.input-wrap .input,form[action^="/local/forms/"] input[type="text"],
form[action^="/local/forms/"] input[type="tel"],form[action^="/local/forms/"] input[type="email"]{color:#07183f}
.input::placeholder,form[action^="/local/forms/"] input::placeholder{color:#8b93a7}