/* FR-266 (скан тега v2) → FR-294 (гибрид): блок нашедшего, нижняя панель,
   карточка «Contact {owner}», форма и экран места на странице тега
   (views/parts/tag-finder-info.ejs, tag-panel.ejs, tag-finder-form.ejs,
   owner-phone-contact.ejs, tag-place-popup.ejs, missing-since-chip.ejs,
   tag-no-photo.ejs; /r/ и /microchip/ — finder-form-page.ejs).

   FR-294, круг 2 (Дэн 16.10: «не наш стиль», «поля почему-то квадратные»,
   «не было сборной солянки»; W-20, W-21): вид — основной сайт ДО наших правок
   (решение пользователя 16.10, эталон prod-repo c193b849, docs/site-style.md,
   раздел «Эталон»). Цвет, шрифт, рамку и радиус кнопок и полей задаёт тема:
   - главная кнопка — button.button / a.button (заливка #01b9ff, белый текст);
   - вторая — a.button.border (синий контур и текст); у <button> тема рисует
     border серым, поэтому для синей второй кнопки-<button> ниже повторены
     значения a.button.border темы (.fp-tp-btn--outline) — нового вида нет;
   - нейтральная (Back, Not now, No answer) — button.button.border (серый контур);
   - поля — input/textarea/select темы: 44 px, радиус 20, рамка #dbdbdb.
   Классы .fp-tp-btn* в разметке — опора для скрипта и тестов, здесь у них
   только раскладка (иконка рядом с текстом, ширина в ряду).
   Размер кнопок панели и формы — как «Submit» прежней формы нашедшего
   (.book-now.button, padding 9px, 47 px); «Send message» карточки — как
   прежняя .btn-contact-owner (22 px).

   Классы на <html> ставит parts/contact-bar-head.ejs: fp-tp-page — страница
   нашедшего, fp-tp-owner — хозяин смотрит свою. Телефон и сенсорный
   планшет — панель внизу экрана, форма и место на весь экран; десктоп —
   карточка в правой колонке, форма и место — окном поверх страницы, как
   окна сайта (.modal-box, W-29). */

.fp-tp {
    display: none;
}
/* hidden у кнопок и строк сильнее их display (flex, inline-flex) */
.fp-tp [hidden],
.fp-tp-view [hidden],
.fp-tpi [hidden],
.fp-tp-owner-banner [hidden] {
    display: none !important;
}

/* ---------- кнопки: только раскладка, вид — тема ---------- */
/* специфичнее «a.button.border» темы (display: inline-block): иначе у контурных
   ссылок иконка и текст не выравниваются по центру */
a.button.fp-tp-btn, button.button.fp-tp-btn,
a.button.border.fp-tp-btn, button.button.border.fp-tp-btn,
a.button.border.fp-tpi__row, button.button.border.fp-tpi__row {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 0;
    white-space: nowrap;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
}
.fp-tp-btn span { overflow: hidden; text-overflow: ellipsis; }
/* синяя контурная у <button> — значения a.button.border темы (main-color.css). Вес — 600,
   как у контурных кнопок на страницах эталона c193b849 («Send SMS», «Sign in to edit report»
   на /r/); 500 — только у кнопок шапки (.header-widget), правило a.button.border 500 из
   style.css в bundle.min.css не входит (замер 2026-10-16, e2e V-27) */
button.button.border.fp-tp-btn--outline {
    color: #01b9ff;
    border-color: #01b9ff;
    background-color: #fff;
}
/* наведение — как у a.button.border темы; по фокусу не заливаем: после закрытия
   формы фокус возвращается на кнопку, и она оставалась синей */
@media (hover: hover) {
    button.button.border.fp-tp-btn--outline:hover {
        background-color: #01b9ff;
        color: #fff;
    }
}
a.button.fp-tp-btn:hover, a.button.fp-tp-btn:focus { text-decoration: none; }
.fp-tp-btn.button[disabled],
.fp-tp-btn.button[aria-disabled="true"] { background-color: #ccc; border-color: #ccc; color: #fff; cursor: default; }
.fp-tp-btn.button.border[disabled],
.fp-tp-btn.button.border[aria-disabled="true"] { background-color: #fff; color: #aaa; }
.fp-tp-btn:focus-visible,
.fp-tp__place:focus-visible,
.fp-tpi__row:focus-visible,
.fp-tp-link:focus-visible,
.fp-opc__num:focus-visible,
.fp-tp-view__close:focus-visible,
.fp-tp-photos__add:focus-within {
    outline: 3px solid #0b2533;
    outline-offset: 2px;
}
.fp-tp-icon { flex: 0 0 auto; }
.fp-tp-link {
    padding: 0;
    border: 0;
    background: none;
    color: #01b9ff;
    font-weight: 600;
    min-height: 44px;
}

/* ---------- чип Missing since (в ряду .listing-tag сайта) ---------- */
#titlebar.listing-titlebar span.listing-tag.fp-missing-chip,
span.listing-tag.fp-missing-chip {
    border-color: #c62828;
    color: #c62828;
}

/* ---------- без фото: круг-аватар вместо серой заглушки (AC-04) ---------- */
.fp-tp-nophoto {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px 0 4px;
}
.fp-tp-nophoto__circle {
    width: 88px;
    height: 88px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #f2f2f2;
    color: #9a9a9a;
}

/* ---------- блок нашедшего под чипами (все ширины): текст — как у страницы ---------- */
.fp-tpi { margin: 12px 0 24px; }
.fp-tpi__todo { margin: 0 0 10px; }
.fp-tpi__note { margin: 0 0 10px; padding: 10px 15px; border-left: 3px solid #01b9ff; background: #f7f7f7; }
.fp-tpi__note-label { margin: 0; font-size: 14px; line-height: 20px; }
.fp-tpi__note-text {
    margin: 0; white-space: pre-line; color: #333;
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;
}
.fp-tpi__note-text.fp-tp-open { display: block; -webkit-line-clamp: none; }
.fp-tpi__notify { margin: 0 0 8px; font-size: 14px; line-height: 20px; }
/* «Other ways to help» (W-27): контурные кнопки на всю ширину, как «Sign in to
   edit report» правой колонки прежней страницы тега */
.fp-tpi__help { display: flex; flex-direction: column; gap: 10px; margin-top: 16px; }
.fp-tpi__help-title { margin: 0; font-size: 18px; line-height: 24px; }
a.button.border.fp-tpi__row, button.button.border.fp-tpi__row { width: 100%; white-space: normal; text-align: center; }

/* ---------- всплывашка места (FR-294, таблица 4.4) ----------
   телефон: на месте строки места панели; компьютер: снизу слева окна (чат
   справа её не закрывает); поиск по чипу на телефоне: снизу экрана */
.fp-tp__popup {
    position: relative;
    padding: 12px 48px 12px 12px;
    border-radius: 4px;
    background: #fff;
}
.fp-tp__popup[hidden] { display: none !important; }
.fp-tp__popup-close {
    position: absolute; top: 2px; right: 2px; width: 44px; height: 44px; padding: 0;
    border: 0; background: none; color: #777; font-size: 26px; line-height: 44px; cursor: pointer;
}
.fp-tp__popup-close:focus-visible { outline: 3px solid #0b2533; outline-offset: -3px; }
.fp-tp__popup-title { margin: 0 0 4px; font-size: 16px; font-weight: 600; line-height: 22px; color: #333; }
.fp-tp__popup-text { margin: 0; font-size: 14px; line-height: 20px; }
.fp-tp__popup-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.fp-tp__popup-actions .fp-tp-btn { flex: 1 1 auto; }
.fp-tp__popup[data-actions="off"] .fp-tp__popup-actions { display: none; }
.fp-tp__popup[data-kind="phone"] [data-desk-only],
.fp-tp__popup[data-kind="desk"] [data-phone-only] { display: none; }
.fp-tp__popup[data-kind="desk"] {
    position: fixed; left: 24px; bottom: 24px; z-index: 998;
    width: 420px; max-width: calc(100vw - 48px);
    padding: 16px 48px 16px 16px;
    box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.12);
}
.fp-tp__popup--page[data-kind="phone"] {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 997;
    padding: 16px 48px calc(16px + env(safe-area-inset-bottom, 0px)) 16px;
    box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.15);
}
html.fp-tp-view-open .fp-tp__popup--page,
html.fp-tp-view-open .fp-tp__popup[data-kind="desk"] { display: none !important; }

/* ---------- номер владельца: tel: + Copy (AC-11, AC-12; W-25) ---------- */
.fp-opc { margin: 0; }
.fp-opc__label { margin: 0 0 2px; font-size: 14px; line-height: 20px; }
.fp-opc__row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; }
.fp-opc__num {
    display: inline-flex; align-items: center; min-height: 44px;
    font-size: 18px; font-weight: 600; text-decoration: none; white-space: nowrap;
}
.fp-opc__num:hover, .fp-opc__num:focus { text-decoration: underline; }
.fp-opc__hint { margin: 0; font-size: 14px; line-height: 20px; }
.fp-opc__sms { margin-top: 8px; }
.fp-opc__status { display: block; font-size: 13px; line-height: 18px; color: #2e7d32; }
.fp-opc__status--error { color: #c62828; }

/* ---------- строка места: строка текста с иконкой и ссылкой, без своей карточки ---------- */
.fp-tp__place {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 44px;
    padding: 4px 0;
    border: 0;
    background: none;
    color: inherit;
    text-align: left;
    cursor: pointer;
}
.fp-tp__place-icon { flex: 0 0 auto; color: #01b9ff; display: inline-flex; }
.fp-tp__place-text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.fp-tp__place-title { font-size: 15px; font-weight: 600; line-height: 20px; color: #333; }
.fp-tp__place-sub {
    font-size: 14px; line-height: 20px; overflow: hidden; overflow-wrap: anywhere;
    /* отправленный адрес виден целиком (до трёх строк), а не «Seat…» (ui-review UI-14) */
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3;
}
.fp-tp__place-action { flex: 0 0 auto; font-size: 15px; font-weight: 600; color: #01b9ff; }
.fp-tp__place[data-place="exact"] .fp-tp__place-icon,
.fp-tp__place[data-place="marked"] .fp-tp__place-icon { color: #2e7d32; }
.fp-tp__place[data-place="rough"] .fp-tp__place-icon { color: #777; }
.fp-tp__place[data-place="locating"] .fp-tp__place-icon svg { animation: fp-tp-spin 1s linear infinite; }
@keyframes fp-tp-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    .fp-tp__place[data-place="locating"] .fp-tp__place-icon svg { animation: none; }
}

.fp-tp__row { display: flex; gap: 8px; }
.fp-tp__row > .fp-tp-btn { flex: 1 1 0; min-width: 0; }
/* высота кнопок панели и формы — как «Submit» прежней формы (.book-now.button) */
.fp-tp__row > .button,
.fp-tp__call-now.button,
.fp-tp-view__submit .button,
.fp-tp__popup-actions .button { padding-top: 9px; padding-bottom: 9px; }
.fp-tp__row > .button.border,
.fp-tp__popup-actions .button.border { padding-top: 8px; padding-bottom: 8px; }
.fp-tp__call { flex: 3 1 0 !important; }
.fp-tp__sms { flex: 2 1 0 !important; }
.fp-tp__wide { width: 100%; }
.fp-tp__ask-title { margin: 0 0 4px; font-size: 16px; font-weight: 600; line-height: 22px; color: #333; }
.fp-tp__ask-sub { margin: 0 0 10px; font-size: 14px; line-height: 20px; }
.fp-tp__sent-sub { margin: 0; font-size: 14px; line-height: 20px; }
.fp-tp__status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
/* «отправлено» (W-28): одна строка, подсказка, «Send another message» и одна
   кнопка звонка — без строки места, SMS и второй кнопки сообщения */
.fp-tp[data-state="sent"] .fp-tp__place,
.fp-tp[data-state="sent"] .fp-tp__sms,
/* «Only José and Findpet see your details» — про форму; после отправки это хвост (UI-review UI2-08) */
.fp-tp[data-state="sent"] .fp-tp__who,
.fp-tp[data-state="sent"] .fp-tp__actions [data-fp-tp-open] { display: none !important; }
.fp-tp__again { min-height: 44px; text-align: left; }
/* только для карточки десктопа */
.fp-tp__desk { display: none; }

/* ---------- телефон и сенсорный планшет ---------- */
@media (max-width: 991px), (hover: none) and (pointer: coarse) {
    html.fp-tp-page .fp-tp {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        /* под окнами сайта (.modal-box 1999, magnific 1042), над страницей */
        z-index: 997;
        display: flex;
        flex-direction: column;
        gap: 8px;
        padding: 12px 12px calc(12px + env(safe-area-inset-bottom, 0px));
        background: #fff;
        box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.15);
    }
    html.fp-tp-page .fp-tp__desk-msg { display: none; }
    /* полоса «Manage report» — не для нашедшего (как у FR-191) */
    html.fp-tp-page .right-sidebar:not(.expanded) { display: none; }
    html.fp-tp-page #backtotop { display: none !important; }
    /* брендовые шаблоны (1T103, 2T103, 3T103): логотип и «Cesar Millan's dog is
       protected by Findpet ID» — одной строкой ~56 px вместо ~230 px, чтобы
       кличка и заметка помещались над панелью (AC-03, AC-07; ui-review UI-05) */
    html.fp-tp-page .fp-brand-strip {
        display: flex; align-items: center; justify-content: center; gap: 10px;
        margin: 0; padding: 8px 16px !important; font-size: 14px !important; line-height: 18px; text-align: left;
    }
    html.fp-tp-page .fp-brand-strip img { width: 40px !important; margin: 0 !important; flex: 0 0 40px; }
    html.fp-tp-page .fp-brand-strip br.visible-xs { display: none !important; }
    /* шаблон 106: баннер Cesar Millan ниже (~72 px вместо ~110 px) — тоже ради
       первого экрана (AC-03) */
    html.fp-tp-page .layout__center-content img { width: auto; max-width: 100%; height: 72px; max-height: 72px; }
    /* плавающие «поделиться» (Facebook, Nextdoor) у правого края закрывали
       заметку владельца; те же кнопки есть ниже на странице */
    html.fp-tp-page #report-look-sharing-container { display: none !important; }
    /* панель уступает формам и окнам сайта */
    html.fp-tp-view-open .fp-tp,
    html.fp-tp-page.fp-tp-modal .fp-tp { visibility: hidden; }
}

/* ---------- узкий экран: страница сайта компактнее (AC-03) ---------- */
@media (max-width: 991px) {
    /* слайдер до 200 px (решение «норм» 14.10), не 40vh / 400 px сайта */
    html.fp-tp-page .listing-slider,
    html.fp-tp-page .listing-slider .item {
        height: clamp(140px, 24svh, 200px);
        min-height: 0;
    }
    html.fp-tp-page #titlebar.listing-titlebar { margin: 0; padding: 8px 0 0; }
    html.fp-tp-page #titlebar.listing-titlebar h1 { font-size: 24px; line-height: 30px; word-break: break-word; }
    html.fp-tp-page #titlebar.listing-titlebar h1 img { width: 32px; height: 32px; }
    html.fp-tp-page #titlebar.listing-titlebar .listing-titlebar-title p { margin: 6px 0 4px !important; }
    html.fp-tp-page #titlebar.listing-titlebar span.listing-tag { padding: 5px 12px; letter-spacing: 1.5px; font-size: 12px; }
    .fp-tpi { margin: 8px 0 16px; }
}
@media (max-height: 600px) and (max-width: 991px) {
    .fp-tpi__note-text { -webkit-line-clamp: 2; }
}

/* ---------- десктоп: карточка «Contact {owner}» в правой колонке ----------
   как правая колонка прежней страницы тега (.right-sidebar: белая, тень
   0 0 12px rgba(0,0,0,.08), заголовок по центру; «Send message» — 22 px) */
@media (min-width: 992px) and (hover: hover), (min-width: 992px) and (pointer: fine) {
    html.fp-tp-page .fp-tp {
        display: flex;
        flex-direction: column;
        gap: 12px;
        margin: 0 0 20px;
    }
    html.fp-tp-page .fp-tp__desk { display: block; }
    .fp-tp__title { margin: 0; font-size: 24px; line-height: 30px; text-align: center; }
    .fp-tp__notify { margin: -6px 0 0; font-size: 14px; line-height: 20px; text-align: center; }
    html.fp-tp-page .fp-tp__or {
        display: flex; align-items: center; gap: 10px; margin: 0;
        font-size: 14px; line-height: 20px;
    }
    .fp-tp__or::before, .fp-tp__or::after { content: ""; flex: 1 1 auto; border-top: 1px solid #e8e8e8; }
    .fp-tp__who { margin: 0; font-size: 14px; line-height: 20px; }
    /* «Send message» карточки — как прежняя .btn-contact-owner этой страницы */
    html.fp-tp-page .fp-tp__desk-msg.button { align-self: center; width: auto; padding: 15px 20px; font-size: 22px; }
    /* «написать вместо звонка» — на десктопе это «Send message» карточки (AC-08);
       что получит владелец — там же */
    .fp-tpi__row--phone,
    .fp-tpi .fp-tpi__notify { display: none !important; }
    html.fp-tp-page .fp-tp__call,
    html.fp-tp-page .fp-tp__sms,
    html.fp-tp-page .fp-tp__call-now,
    html.fp-tp-page .fp-tp__ask,
    html.fp-tp-page .fp-tp__reach { display: none !important; }
    /* «Other ways to help» в правой колонке — под карточкой (tag-panel.js переносит) */
    .right-sidebar .fp-tpi__help { margin: 0 0 20px; }
}

/* ---------- форма и место ---------- */
/* телефон: полноэкранный вид в том же документе (pushState) */
.fp-tp-view {
    position: fixed;
    inset: 0;
    z-index: 1990;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 8px 16px 0;
    background: #fff;
}
.fp-tp-view[hidden] { display: none; }
.fp-tp-view__close { display: none; }
@media (max-width: 991px), (hover: none) and (pointer: coarse) {
    /* под полноэкранным видом страница не прокручивается */
    html.fp-tp-view-open { overflow: hidden; }
}
/* десктоп (W-29, Дэн 16.10 «попап формы лучше, фокусирует на ней»): окно по
   центру, как .modal-box сайта — белое, радиус 10, затемнение rgba(0,0,0,.5),
   крестик справа вверху (.modal-box-container > .btn-close) */
.fp-tp-backdrop { display: none; }
@media (min-width: 992px) and (hover: hover), (min-width: 992px) and (pointer: fine) {
    html.fp-tp-view-open { overflow: hidden; }
    html.fp-tp-view-open .fp-tp-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 1989;
        background-color: rgba(0, 0, 0, 0.5);
        cursor: pointer;
    }
    .fp-tp-view {
        inset: auto;
        top: 20px;
        left: 50%;
        transform: translateX(-50%);
        width: 720px;
        max-width: calc(100vw - 48px);
        max-height: calc(100vh - 40px);
        padding: 20px 30px 0;
        border-radius: 10px;
    }
    .fp-tp-view .fp-tp-view__back { display: none !important; }
    .fp-tp-view__close {
        display: block;
        position: absolute;
        top: 10px;
        right: 10px;
        width: 44px;
        height: 44px;
        padding: 0;
        border: 0;
        background: none;
        color: #777;
        font-size: 1.5em;
        line-height: 44px;
        cursor: pointer;
    }
    .fp-tp-view .fp-tp-view__title { margin-top: 0; padding-right: 44px; }
    .fp-tp-view .fp-tp-view__submit { margin: 0 -30px; padding: 12px 30px 20px; }
}
.fp-tp-view__back { align-self: flex-start; }
.fp-tp-view__title { margin: 12px 0 4px; font-size: 24px; line-height: 30px; }
.fp-tp-view__sub { margin: 0 0 12px; font-size: 14px; line-height: 20px; }
.fp-tp-form { display: flex; flex-direction: column; gap: 14px; padding-bottom: 12px; }
.fp-tp-view[data-mode="message"] .fp-tp-field--message { order: -1; }
/* подпись над полем — как подписи фильтров /laf (15 px, жирная) */
.fp-tp-field label,
.fp-tp-photos__label { display: block; margin: 0 0 8px; font-size: 15px; font-weight: bold; line-height: 20px; }
.fp-tp-optional { font-weight: normal; }
/* «label span» темы — 14 px обычным: подпись «Or your email» (в span) была тоньше остальных */
.fp-tp-field label > span:not(.fp-tp-optional) { font-size: inherit; font-weight: inherit; color: inherit; }
/* поля — тема (44 px, радиус 20, рамка #dbdbdb); здесь только без нижнего
   отступа темы (его даёт сетка формы) и 16 px — iOS не увеличивает страницу
   на фокусе (отступление от 15 px темы, docs/site-style.md «Эталон и пороги») */
.fp-tp-field input,
.fp-tp-field textarea,
.fp-tp-field select { margin: 0; font-size: 16px; }
.fp-tp-field textarea { min-height: 110px; resize: vertical; }
.fp-tp-field .iti { width: 100%; }
.fp-tp-field input[aria-invalid="true"],
.fp-tp-field textarea[aria-invalid="true"],
.fp-tp-field select[aria-invalid="true"] { border-color: #c62828; }
.fp-tp-hint { margin: 4px 0 0; font-size: 14px; line-height: 20px; }
.fp-tp-error { margin: 4px 0 0; font-size: 13px; line-height: 18px; color: #c62828; }
.fp-tp-check { display: flex; align-items: center; gap: 10px; min-height: 44px; margin: 0; font-size: 15px; font-weight: normal; cursor: pointer; }
.fp-tp-check input { width: 22px; height: 22px; margin: 0; flex: 0 0 auto; box-shadow: none; }
.fp-tp-more summary,
.fp-tp-howto summary,
.fp-tp-howto__other summary { min-height: 44px; display: flex; align-items: center; color: #01b9ff; font-weight: 600; cursor: pointer; }
.fp-tp-howto p { font-size: 14px; line-height: 20px; }
.fp-tp-view__submit {
    position: sticky;
    bottom: 0;
    margin: 0 -16px;
    padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
    background: #fff;
    box-shadow: 0 -1px 0 #e8e8e8;
}
/* галочка Turnstile — над закреплённой полосой Send: scrollIntoView({block:
   'nearest'}) считал её видимой, хотя полоса закрывала её (окно на десктопе,
   съёмка круга 2). Полоса — 12 + 47 + 12 px и вырез экрана */
.fp-tp-captcha { scroll-margin-bottom: calc(96px + env(safe-area-inset-bottom, 0px)); }
/* поверх открытой формы ничего не лежит: плавающие «поделиться» страницы и
   кружок чата HubSpot закрывали поля и кнопку Send */
html.fp-tp-view-open #report-look-sharing-container,
html.fp-tp-view-open #hubspot-messages-iframe-container { display: none !important; }
@media (max-width: 991px), (hover: none) and (pointer: coarse) {
    html.fp-tp-popup-open #hubspot-messages-iframe-container { display: none !important; }
}
/* экран места (круг 2, W-23): большая карта, точка закреплена в центре —
   остриём булавки в центр карты; красная, как место нашедшего на /f/ */
.fp-tp-bigmap {
    position: relative;
    height: clamp(260px, 45vh, 420px);
    border: 1px solid #dbdbdb;
    border-radius: 4px;
    overflow: hidden;
    background: #e5e3df;
}
.fp-tp-bigmap:focus-visible { outline: 3px solid #0b2533; outline-offset: 2px; }
.fp-tp-bigmap__pin {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 500; /* над тайлами (400), под кнопками +/− Leaflet (1000) */
    transform: translate(-50%, -100%);
    color: #c62828;
    pointer-events: none;
    line-height: 0;
}
.fp-tp-bigmap__pin svg { fill: #fff; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.35)); }
.fp-tp-bigmap__addr { margin: 0; min-height: 20px; font-size: 15px; line-height: 20px; color: #333; overflow-wrap: anywhere;
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.fp-tp-mylocation.button { align-self: flex-start; }
.fp-tp-mylocation.button[hidden] { display: none; }
#fp-tp-address[hidden], .fp-tp-field label[hidden] { display: none; }
.fp-tp-map-hint { margin: 0 0 8px; }
.fp-tp-map-hint[hidden] { display: none; }

/* ---------- фото (W-07, W-20): «+ Add photos» ссылкой, как в прежней форме ---------- */
.fp-tp-photos__list { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 8px; padding: 0; list-style: none; }
.fp-tp-photos__list:empty { display: none; }
/* 96 px, а не 72: «×» удаления — цель 44×44 в углу, на 72 px она закрывала середину превью,
   и нажатие на фото удаляло его вместо просмотра (круг 2, W-35) */
.fp-tp-photos__item { position: relative; width: 96px; height: 96px; border-radius: 4px; overflow: hidden; background: #f2f2f2; }
.fp-tp-photos__item img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* превью нажимается — фото на весь экран (W-35, fp-lightbox.js) */
.fp-tp-photos__view { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
.fp-tp-photos__view:focus-visible { outline: 3px solid #0b2533; outline-offset: -3px; }
.fp-tp-photos__progress {
    position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
    background: rgba(255, 255, 255, 0.8); font-size: 12px; color: #333;
}
.fp-tp-photos__remove {
    position: absolute; top: 0; right: 0; width: 44px; height: 44px; padding: 0;
    border: 0; background: transparent; color: #fff; font-size: 18px; line-height: 1; cursor: pointer;
}
/* видимый кружок на любой фотографии; цель нажатия — вся кнопка 44×44 (ui-review UI-09) */
.fp-tp-photos__remove::before {
    content: ""; position: absolute; top: 4px; right: 4px; width: 26px; height: 26px; border-radius: 50%;
    background: rgba(0, 0, 0, 0.65); box-shadow: 0 0 0 2px #fff;
}
.fp-tp-photos__remove span { position: absolute; z-index: 1; top: 4px; right: 4px; width: 26px; height: 26px; line-height: 26px; text-align: center; }
.fp-tp-photos__remove:focus-visible { outline: 3px solid #0b2533; outline-offset: -3px; }
/* «+ Add photos» — label поля файла: правило подписей поля (block, жирная) ей не подходит */
.fp-tp-field label.fp-tp-photos__add {
    position: relative; display: inline-flex; align-items: center; gap: 6px;
    min-height: 44px; margin: 0; color: #01b9ff; font-size: 15px; font-weight: normal; cursor: pointer;
}
.fp-tp-photos__add[hidden] { display: none !important; }
/* поле файла — под ссылкой: нажимается и с клавиатуры, видна рамка фокуса.
   style.css сайта задаёт input[type="file"] размеры и рамку: после выбора файла
   (фокус в поле) проступал системный «Choose» поверх «+ Add photos» */
.fp-tp-photos__input,
.fp-tp-field input.fp-tp-photos__input[type="file"] {
    position: absolute; top: 0; left: 0; width: 1px; height: 1px; min-height: 0;
    padding: 0; border: 0; margin: 0; opacity: 0; overflow: hidden; clip: rect(0 0 0 0);
}
.fp-tp-photos__status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.fp-tp__place--picked .fp-tp__place-title { white-space: normal; }
.fp-tp-view__pet { display: block; width: 72px; height: 72px; margin: 8px 0 0; border-radius: 50%; object-fit: cover; }
.fp-tp-view__pet[hidden] { display: none; }

/* Places: список подсказок Google над видом и окном */
.pac-container { z-index: 2100 !important; }

/* ---------- баннер хозяина ---------- */
.fp-tp-owner-banner {
    display: flex; flex-wrap: wrap; align-items: center; gap: 12px;
    margin: 12px 0 20px; padding: 12px 16px;
    background: #f7f7f7; font-size: 15px; line-height: 22px;
}
.fp-tp-owner-banner p { margin: 0; flex: 1 1 240px; }