/* ПроКупи · pk_listing.css · pk-lst1 (28.09.2026) — вид страницы объявления (templates/listing.html).
   Всё содержимое — в белых карточках, фон страницы — тема пользователя. В шаблоне нет style="". */
.ls{ --tx:#1e293b; --mu:#64748b; --bd:#e2e8f0; --soft:#f8fafc; --acc:linear-gradient(90deg,#e84142,#f97316); --green:#14503f;
     width:100%; max-width:1320px; margin:0 auto; padding:12px 24px 40px; color:var(--tx); box-sizing:border-box; }
.ls *, .ls *::before, .ls *::after{ box-sizing:border-box; }
.ls [hidden], .ls-lb[hidden]{ display:none !important; }

.ls-crumbs{ font-size:.8rem; color:var(--mu); margin:2px 0 12px; display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.ls-crumbs a{ color:var(--mu); text-decoration:none; }
.ls-crumbs a:hover{ color:var(--tx); }
.ls-crumbs b{ color:var(--tx); font-weight:600; }
.ls-crumbs span{ opacity:.5; }

.ls-adm{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; background:#fff; border:1px solid var(--bd); border-radius:14px;
         padding:10px 14px; margin-bottom:14px; font-size:.8rem; color:var(--mu); }
.ls-adm > b{ color:var(--tx); }
.ls-adm em{ font-style:normal; font-weight:800; }
.ls-adm-geo.flag{ color:#b91c1c; font-weight:700; }
.ls-adm-b{ margin-left:auto; display:flex; gap:6px; flex-wrap:wrap; }
.ls-adm-b a{ border:1px solid var(--bd); border-radius:8px; padding:5px 11px; color:var(--tx); text-decoration:none; font-weight:700; background:#fff; }
.ls-adm-b a.del{ color:#e84142; border-color:rgba(232,65,66,.4); }
.st-active{ color:#16a34a; } .st-pending{ color:#f97316; } .st-rejected{ color:#e84142; } .st-sold{ color:#2563eb; } .st-hidden{ color:var(--mu); }

.ls-grid{ display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:20px; align-items:start; }
.ls-main{ min-width:0; }
.ls-card{ background:#fff; border-radius:16px; box-shadow:0 1px 2px rgba(0,0,0,.05), 0 8px 24px rgba(40,20,10,.08); }
.ls-pad{ padding:18px 22px; }
.ls-h{ font-size:1.22rem; font-weight:800; margin:24px 0 10px; color:var(--text, var(--tx)); }

/* галерея */
.ls-gal{ padding:12px; }
.ls-stage{ position:relative; aspect-ratio:4/3; max-height:72vh; width:100%; border-radius:12px; overflow:hidden; background:#0f172a; }
.ls-stage-bg{ position:absolute; inset:-40px; background:center/cover no-repeat; filter:blur(30px) saturate(1.15); opacity:.8; transform:scale(1.1); }
.ls-stage img{ position:absolute; inset:0; width:100%; height:100%; object-fit:contain; cursor:zoom-in; }
.ls-nav{ position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:44px; height:44px; border:none; border-radius:50%;
         background:rgba(255,255,255,.93); box-shadow:0 4px 14px rgba(0,0,0,.2); font-size:1.5rem; line-height:1; cursor:pointer; color:#1a1a1a; }
.ls-nav.prev{ left:14px; } .ls-nav.next{ right:14px; }
.ls-full, .ls-cnt{ position:absolute; bottom:14px; z-index:3; background:rgba(15,23,42,.7); color:#fff; font:inherit; font-size:.78rem;
                   font-weight:700; border:none; border-radius:14px; padding:6px 12px; }
.ls-full{ left:14px; cursor:pointer; } .ls-cnt{ right:14px; }
.ls-thumbs{ display:flex; gap:10px; margin-top:10px; overflow-x:auto; padding-bottom:2px; scrollbar-width:thin; }
.ls-thumbs button{ flex:0 0 auto; width:92px; height:70px; padding:0; border:2px solid transparent; border-radius:10px; overflow:hidden;
                   background:#f1f5f9; cursor:pointer; }
.ls-thumbs button.on{ border-color:#E8590C; }
.ls-thumbs img{ width:100%; height:100%; object-fit:cover; display:block; }
.ls-nophoto{ aspect-ratio:4/3; border-radius:12px; background:#f1f5f9; display:grid; place-items:center; color:#94a3b8; font-weight:700; }
.is-sold .ls-stage img{ filter:grayscale(.55); }
.ls-sold-band{ position:absolute; left:0; right:0; top:44%; z-index:2; background:rgba(37,99,235,.92); color:#fff; text-align:center;
               font-weight:800; font-size:1.4rem; padding:10px; letter-spacing:.04em; text-transform:uppercase; }
.ls-sold{ margin-top:14px; padding:16px 20px; border-left:5px solid #2563eb; }
.ls-sold b{ font-size:1.05rem; } .ls-sold p{ color:var(--mu); font-size:.88rem; margin:4px 0 12px; }

/* описание: короткое целиком, длинное — ровно по строке и кнопка, без «тумана» */
.ls-desc{ font-size:.95rem; line-height:1.65; white-space:pre-line; overflow-wrap:anywhere; }
.ls-desc.clamp{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:10; overflow:hidden; }
.ls-more{ margin-top:12px; border:1.5px solid var(--bd); background:#fff; border-radius:10px; padding:8px 14px; font:inherit;
          font-weight:800; font-size:.85rem; color:var(--tx); cursor:pointer; }
.ls-more:hover{ border-color:#94a3b8; }

/* характеристики */
.ls-spec{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 28px; }
.ls-spec > div{ display:flex; justify-content:space-between; gap:12px; padding:11px 0; border-bottom:1px solid #f1f5f9; font-size:.9rem; }
.ls-spec span{ color:#94a3b8; flex:none; }
.ls-spec b{ font-weight:700; text-align:right; overflow-wrap:anywhere; }
.ls-chiprow{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:12px; font-size:.84rem; }
.ls-chiprow > span{ color:#94a3b8; margin-right:4px; }
.ls-chip{ font-style:normal; display:inline-flex; align-items:center; gap:6px; border:1.5px solid var(--bd); border-radius:8px; padding:3px 9px;
          font-weight:700; font-size:.8rem; }
.ls-dot{ width:14px; height:14px; border-radius:50%; border:1.5px solid var(--bd); display:inline-block; }
.ls-dot.c-white{ background:#fff; } .ls-dot.c-black{ background:#1e293b; } .ls-dot.c-red{ background:#ef4444; } .ls-dot.c-beige{ background:#d4b896; }
.ls-dot.c-burgundy{ background:#7c2d2d; } .ls-dot.c-blue{ background:#3b82f6; } .ls-dot.c-green{ background:#22c55e; } .ls-dot.c-yellow{ background:#facc15; }
.ls-dot.c-gray{ background:#94a3b8; } .ls-dot.c-brown, .ls-dot.c-wood{ background:#92400e; } .ls-dot.c-pink{ background:#ec4899; }
.ls-dot.c-lightblue{ background:#7dd3fc; } .ls-dot.c-orange{ background:#f97316; } .ls-dot.c-purple{ background:#a855f7; } .ls-dot.c-wenge{ background:#3b2415; }
.ls-dot.c-multicolor{ background:linear-gradient(135deg,#e84142,#f97316,#facc15,#22c55e,#3b82f6,#a855f7); }
.ls-none{ color:#94a3b8; font-size:.88rem; margin:0; }

.ls-staff{ margin-top:14px; background:#fffbeb; border:1px solid #fde68a; box-shadow:none; }
.ls-staff h3{ font-size:1rem; margin:0 0 10px; color:#92400e; } .ls-staff h3 small{ font-weight:500; color:#b45309; font-size:.74rem; }
.ls-vin b{ font-family:monospace; letter-spacing:1px; }
.ls-docs{ display:flex; gap:12px; flex-wrap:wrap; }
.ls-docs a{ text-decoration:none; color:#92400e; font-size:.74rem; text-align:center; }
.ls-docs img{ display:block; max-height:120px; border-radius:8px; border:1.5px solid #fde68a; margin-bottom:3px; }
.ls-video{ width:100%; max-height:520px; border-radius:10px; background:#000; display:block; }

.ls-addr{ font-size:.86rem; color:var(--mu); margin:0 0 10px; line-height:1.5; }
.ls-note{ font-size:.76rem; color:#94a3b8; }
.ls-map{ height:340px; border-radius:12px; overflow:hidden; background:#f1f5f9; margin-top:12px; }
.leaflet-control-attribution, .leaflet-routing-container{ display:none !important; }

/* кнопки */
.ls-btn{ display:inline-flex; align-items:center; justify-content:center; gap:6px; border:1.5px solid var(--bd); background:#fff; color:var(--tx);
         border-radius:12px; padding:11px 14px; font:inherit; font-weight:800; font-size:.9rem; text-decoration:none; cursor:pointer; }
.ls-btn:hover{ border-color:#94a3b8; }
.ls-btn.wide{ width:100%; margin-top:10px; }
.ls-btn.green{ background:var(--green); border-color:var(--green); color:#fff; }
.ls-btn.green:hover{ background:#0f3f31; }
.ls-btn.acc{ background:var(--acc); border:none; color:#fff; }

/* правая колонка */
.ls-side{ position:sticky; top:84px; display:flex; flex-direction:column; gap:14px; }
.ls-buy{ padding:20px; }
.ls-price-row{ display:flex; justify-content:space-between; align-items:center; gap:10px; }
.ls-price{ font-size:2rem; font-weight:800; letter-spacing:-.02em; }
.ls-price.sold{ color:#94a3b8; text-decoration:line-through; }
.ls-acts{ display:flex; gap:8px; }
.ls-ib{ width:40px; height:40px; border:1.5px solid var(--bd); border-radius:50%; background:#fff; cursor:pointer; display:grid; place-items:center; padding:0; }
.ls-ib svg{ width:19px; height:19px; fill:none; stroke:#334155; stroke-width:1.8; stroke-linejoin:round; }
.ls-ib.on svg{ fill:#e11d48; stroke:#e11d48; }
.ls-title{ font-size:1.25rem; font-weight:800; line-height:1.3; margin:8px 0 0; overflow-wrap:anywhere; }
.ls-meta{ font-size:.84rem; color:var(--mu); margin:10px 0 0; display:flex; flex-direction:column; gap:3px; }
.ls-chips{ display:flex; gap:6px; flex-wrap:wrap; margin-top:10px; }
.ls-chips span, .ls-badges .prem{ font-size:.74rem; font-weight:800; border-radius:12px; padding:4px 10px; }
.ls-chips .safe{ background:#ecfdf5; color:#047857; } .ls-chips .sold{ background:#dbeafe; color:#1d4ed8; }
.ls-chips .prem, .ls-badges .prem{ background:#111; color:#fff; }
.ls-safe{ margin-top:14px; border-radius:14px; background:#ecfdf5; padding:14px; }
.ls-safe b{ color:#047857; } .ls-safe p{ font-size:.8rem; color:#475569; margin:4px 0 0; line-height:1.45; }
.ls-two{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:10px; }
.ls-two.one{ grid-template-columns:1fr; }
.ls-own{ margin-top:14px; background:var(--soft); border-radius:12px; padding:11px; text-align:center; font-size:.86rem; }

.ls-seller{ padding:18px; }
.ls-lab{ font-size:.7rem; font-weight:800; color:#94a3b8; letter-spacing:.08em; text-transform:uppercase; }
.ls-seller-top{ display:flex; align-items:center; gap:12px; margin-top:10px; }
.ls-av{ position:relative; width:52px; height:52px; flex:none; }
.ls-av img, .ls-av > span{ width:52px; height:52px; border-radius:50%; object-fit:cover; display:grid; place-items:center;
                            background:var(--green); color:#fff; font-weight:800; font-size:1.2rem; }
.ls-av .pk-dot-av{ position:absolute; right:0; bottom:0; width:13px; height:13px; box-shadow:0 0 0 2.5px #fff; }
.ls-seller-name{ display:block; font-size:1.02rem; }
.ls-rate{ font-size:.8rem; color:var(--mu); text-decoration:none; }
.ls-rate span{ color:#f59e0b; letter-spacing:1px; }
.ls-row{ display:flex; justify-content:space-between; align-items:center; gap:10px; border-top:1px solid #f1f5f9; margin-top:10px; padding-top:10px; font-size:.82rem; }
.ls-row > span:first-child{ color:#94a3b8; }
.ls-copy{ border:1px solid var(--bd); background:none; color:var(--mu); border-radius:8px; padding:2px 9px; font:inherit; font-size:.72rem; cursor:pointer; }
.ls-badges{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin-top:10px; }
.ls-foot{ font-size:.78rem; color:var(--mu); margin:10px 0 0; }
.ls-ad{ height:300px; }
.page-wrap .ad-banner, .ls .ad-banner{ background:#fff !important; border:1px dashed var(--bd) !important; color:#94a3b8 !important; }

/* похожие */
.ls-sim{ display:flex; gap:14px; overflow-x:auto; padding:2px 2px 8px; scroll-snap-type:x proximity; scrollbar-width:thin; }
.ls-sim .pkc{ position:relative; flex:1 0 232px; max-width:320px; scroll-snap-align:start; background:#fff !important; color:var(--tx) !important; border:none;
              border-radius:14px; overflow:hidden; display:flex; flex-direction:column; box-shadow:0 1px 2px rgba(0,0,0,.05), 0 8px 22px rgba(0,0,0,.06); }
.ls-sim .pkc-img{ position:relative; aspect-ratio:4/3; overflow:hidden; cursor:pointer; background:#f1f5f9; }
.ls-sim .pkc-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.ls-sim .pkc-prem{ position:absolute; top:8px; left:8px; background:#111; color:#fff; border-radius:8px; padding:3px 9px; font-size:.68rem; font-weight:700; }
.ls-sim .pkc-fav{ position:absolute; top:8px; right:8px; width:34px; height:34px; border:none; border-radius:50%; background:rgba(255,255,255,.94);
                  box-shadow:0 2px 8px rgba(0,0,0,.16); cursor:pointer; display:grid; place-items:center; padding:0; }
.ls-sim .pkc-fav svg{ width:18px; height:18px; fill:none; stroke:#1a1a1a; stroke-width:1.7; }
.ls-sim .pkc-fav.on svg{ fill:#e11d48; stroke:#e11d48; }
.ls-sim .pkc-body{ padding:11px 12px 13px; display:flex; flex-direction:column; gap:4px; cursor:pointer; }
.ls-sim .pkc-price{ font-size:1.05rem; font-weight:800; }
.ls-sim .pkc-title{ font-size:.86rem; line-height:1.32; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.ls-sim .pkc-place{ font-size:.74rem; color:#94a3b8; display:flex; justify-content:space-between; gap:8px; }

/* просмотр на весь экран */
.ls-lb{ position:fixed; inset:0; z-index:3000; background:rgba(0,0,0,.95); display:flex; align-items:center; justify-content:center; touch-action:pan-y; }
.ls-lb img{ max-width:94vw; max-height:86vh; object-fit:contain; user-select:none; }
.ls-lb button{ position:absolute; border:none; background:rgba(255,255,255,.12); color:#fff; cursor:pointer; border-radius:50%; font:inherit; }
.ls-lb-x{ top:16px; right:16px; width:44px; height:44px; font-size:1.2rem !important; }
.ls-lb-nav{ top:50%; transform:translateY(-50%); width:52px; height:52px; font-size:2rem !important; line-height:1; }
.ls-lb-nav.prev{ left:16px; } .ls-lb-nav.next{ right:16px; }
.ls-lb-cnt{ position:absolute; bottom:22px; left:50%; transform:translateX(-50%); color:#fff; background:rgba(0,0,0,.55); border-radius:16px; padding:5px 14px; font-size:.9rem; }

/* телефон */
.ls-buy-m{ display:none; }
@media (max-width:900px){
  .ls{ padding:8px 10px 30px; }
  .ls-grid{ grid-template-columns:minmax(0,1fr); }
  .ls-side{ position:static; }
  .ls-buy-m{ display:block; margin-top:12px; }
  .ls-spec{ grid-template-columns:minmax(0,1fr); }
  .ls-nav{ display:none; }
  .ls-thumbs button{ width:64px; height:50px; }
  .ls-lb-nav{ display:none; }
  .ls-map{ height:260px; }
  .ls-sim .pkc{ flex-basis:46vw; }
  .ls-ad{ display:none; }  /* пустая заглушка рекламы на телефоне не нужна */
}