/* ===========================================================
   МУР-МУР — общие компоненты новой темы, не вошедшие в
   tokens.css / chrome.css. Подключается во всех макетах.
   Уникальные стили страниц живут инлайн в самих view.
   =========================================================== */

.main-content { min-height: 50vh; }
@media (max-width: 720px) { body { padding-bottom: 72px; } }

/* фото-кадры карточки анкеты (класс .ph рассчитан на div — для img задаём cover) */
.card-media img.frame { width: 100%; height: 100%; object-fit: cover; }
.card-media .ph.frame { position: absolute; inset: 0; }

/* брендовая марка в шапке/футере/гейте */
.lk-mark { display: block; width: auto; height: 30px; }
.brand .lk-mark { height: 30px; }
.gate-mark .lk-mark { height: 50px; }
.botnav .fab .lk-mark { height: 30px; filter: brightness(0) invert(1); }

/* ===== Мобильное меню (sheet поверх drawer-каркаса) ===== */
.mobile-menu-drawer .drawer-body { padding-bottom: calc(24px + env(safe-area-inset-bottom)); }
.mobile-menu-drawer .mm-owner { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; }
.mm-section { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-muted); margin: 18px 0 8px; }
.mm-link { display: block; padding: 11px 0; font-size: 15px; font-weight: 600; color: var(--text-soft); border-bottom: 1px solid var(--line); transition: .14s; }
.mm-link:hover { color: var(--rose-soft); }

/* ===== Лайтбокс ===== */
.lightbox { position: fixed; inset: 0; z-index: 120; display: none; align-items: center; justify-content: center; background: rgba(8, 5, 5, .94); backdrop-filter: blur(6px); }
.lightbox.active { display: flex; }
.lightbox__img { max-width: 92vw; max-height: 86vh; border-radius: var(--r-md); box-shadow: var(--shadow-lg); }
.lightbox__close, .lightbox__prev, .lightbox__next { position: absolute; background: rgba(33, 25, 24, .8); border: 1px solid var(--line-strong); color: #fff; border-radius: 50%; width: 48px; height: 48px; font-size: 24px; line-height: 1; display: grid; place-items: center; cursor: pointer; transition: .16s; }
.lightbox__close:hover, .lightbox__prev:hover, .lightbox__next:hover { background: var(--rose); border-color: transparent; }
.lightbox__close { top: 18px; right: 18px; }
.lightbox__prev { left: 18px; top: 50%; transform: translateY(-50%); }
.lightbox__next { right: 18px; top: 50%; transform: translateY(-50%); }
.lightbox__counter { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); color: var(--text-soft); font-size: 14px; font-weight: 700; }
@media (max-width: 600px) { .lightbox__close, .lightbox__prev, .lightbox__next { width: 40px; height: 40px; font-size: 20px; } }

/* ===== Cookie-баннер ===== */
.cookie-banner { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 90; background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--r-lg); box-shadow: var(--shadow-lg); padding: 16px 18px; display: none; }
.cookie-banner--visible { display: block; }
.cookie-confirmed .cookie-banner { display: none !important; }
.cookie-banner__inner { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; max-width: var(--maxw); margin: 0 auto; }
.cookie-banner__text { margin: 0; font-size: 13.5px; color: var(--text-soft); flex: 1; min-width: 220px; line-height: 1.5; }
.cookie-banner__text a { color: var(--rose-soft); font-weight: 700; }
.cookie-banner__actions { display: flex; gap: 10px; }
@media (max-width: 720px) { .cookie-banner { bottom: 84px; } }

/* ===== Хлебные крошки / заголовок страницы (контейнер) ===== */
.crumbs .wrap, .page-head .wrap { padding-left: 24px; padding-right: 24px; }
@media(max-width:720px){.crumbs .wrap,.page-head .wrap{padding-left:16px;padding-right:16px}}

/* ===== Универсальная «пустая выдача» ===== */
.empty-state { text-align: center; padding: 60px 20px; color: var(--text-muted); }
.empty-state h2 { font-family: var(--font-display); font-weight: 400; font-size: 26px; color: var(--text); margin: 0 0 10px; }
.empty-state p { margin: 0 0 18px; font-size: 15px; }

/* ===== Карточка салона (общая) ===== */
.salon-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; transition: transform .2s, box-shadow .25s, border-color .2s; }
.salon-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: var(--line-strong); }
.salon-card__media { position: relative; aspect-ratio: 16/10; background: var(--surface-2); }
.salon-card__media img { width: 100%; height: 100%; object-fit: cover; }
.salon-card__body { padding: 16px 18px; }
.salon-card__name { font-family: var(--font-display); font-size: 20px; margin: 0 0 6px; }
.salon-card__meta { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-soft); font-weight: 600; }
.salon-card__meta svg { width: 14px; height: 14px; color: var(--rose-soft); }
.salon-card__thumbs { display: flex; gap: 8px; padding: 0 18px 18px; flex-wrap: wrap; }
.salon-card__thumb { width: 48px; height: 60px; border-radius: var(--r-sm); overflow: hidden; background: var(--surface-3); display: grid; place-items: center; font-size: 13px; color: var(--text-muted); }
.salon-card__thumb img { width: 100%; height: 100%; object-fit: cover; }
.salon-card__thumb--more { font-size: 11px; font-weight: 700; color: var(--rose-soft); text-align: center; line-height: 1.2; padding: 4px; }