/* woch-listing.css — сторінка оголошення (show_live.ex), listing_v1 */
.lp{max-width:1280px !important;padding:16px 32px 48px !important;}
body:has(.lp) .site-back-bar{max-width:1280px !important;padding:12px 32px 0 !important;box-sizing:border-box;}
.lp .listing-photo-grid{gap:40px !important;}

/* Фото */
.lp .lp-photo{background:#fff !important;border:1px solid #ebe6f5;border-radius:18px !important;height:460px !important;box-shadow:0 1px 2px rgba(31,22,64,.04),0 8px 24px rgba(51,20,94,.07);}
.lp .lp-photo-img{max-height:436px !important;max-width:calc(100% - 24px) !important;border-radius:10px;}
.lp .lp-thumb{width:76px !important;height:76px !important;border-radius:12px !important;border:2px solid transparent;box-sizing:border-box;opacity:.8;transition:opacity .15s,border-color .15s;}
.lp .lp-thumb:hover{opacity:1;}
.lp .lp-thumb.is-on{border-color:#7c3aed;opacity:1;}
.lp .lp-thumb img{width:100% !important;height:100% !important;border-radius:9px;}

/* Картки */
.lp .lp-card{background:#fff !important;border:1px solid #ebe6f5;border-radius:16px !important;box-shadow:0 1px 2px rgba(31,22,64,.04),0 8px 24px rgba(51,20,94,.07);padding:18px !important;}
.lp .lp-seller{margin-top:18px !important;margin-bottom:14px !important;}
.lp .lp-seller > div:first-child{width:52px !important;height:52px !important;background:#f3f0fa !important;color:#7c3aed;display:flex;align-items:center;justify-content:center;}
.lp .lp-seller > div:first-child img{width:52px !important;height:52px !important;}
.lp .lp-ava svg{width:26px;height:26px;}
.lp .lp-phone{display:inline-flex;align-items:center;gap:6px;color:#5b21b6 !important;}
.lp .lp-phone svg{width:16px;height:16px;flex:0 0 auto;}

/* Безпечна угода */
.lp .lp-safe{display:flex !important;align-items:center;gap:8px;margin-top:0 !important;padding:11px 14px !important;border-radius:12px !important;background:#ecfdf5 !important;border:1px solid #a7f3d0;color:#047857 !important;font-size:14px !important;}
.lp .lp-safe svg{width:18px;height:18px;flex:0 0 auto;}

/* Кнопки дій */
.lp .lp-actions{margin-top:16px !important;gap:10px !important;}
.lp .lp-actions > button,.lp .lp-actions > a,.lp .lp-actions > div > button{min-height:54px !important;padding:0 24px !important;border-radius:14px !important;font-size:17px !important;font-weight:600 !important;display:flex !important;align-items:center !important;justify-content:center !important;gap:10px !important;box-sizing:border-box !important;transition:filter .15s,box-shadow .15s;}
.lp .lp-actions > button[style*="background:#7c3aed"],.lp .lp-actions > a[style*="background:#7c3aed"],.lp .lp-actions > div > button[style*="background:#7c3aed"]{background:linear-gradient(135deg,#7c3aed,#6d28d9) !important;box-shadow:0 8px 20px rgba(124,58,237,.28);}
.lp .lp-actions > button:hover,.lp .lp-actions > a:hover{filter:brightness(1.06);}
.lp .lp-actions svg{width:22px;height:22px;flex:0 0 auto;}
.lp .message-seller-btn{background:#fff !important;border:1.5px solid #c4b5fd !important;color:#5b21b6 !important;}
.lp .message-seller-btn:hover{background:#f7f5fc !important;filter:none;}
.lp .deposit-btn{font-size:17px !important;}

/* Деталі */
.lp .lp-info h1{font-size:28px !important;font-weight:700 !important;line-height:1.25 !important;color:var(--color-text);margin:4px 0 8px !important;letter-spacing:-.01em;}
.lp .favorite-btn{height:40px;padding:0 16px !important;border-radius:999px !important;border:1px solid #ddd6ee !important;background:#fff !important;color:#5b21b6 !important;font-weight:600 !important;font-size:14px !important;font-family:inherit;cursor:pointer;}
.lp .favorite-btn:hover{border-color:#c4b5fd !important;}
.lp .favorite-btn--active{background:#f3f0fa !important;border-color:#c4b5fd !important;}
.lp .lp-price{font-size:32px !important;font-weight:800 !important;color:#5b21b6 !important;margin:10px 0 14px !important;letter-spacing:-.01em;}
.lp .listing-description{font-size:16px !important;line-height:1.65 !important;white-space:pre-line !important;color:var(--color-text);}
@media (min-width:768px){.lp .listing-description{font-size:17px !important;}}
.lp .lp-attr{background:#f7f5fc !important;border:1px solid #ebe6f5 !important;border-radius:12px !important;padding:12px 14px !important;}
.lp .attr-label{font-size:13px !important;}
.lp .attr-value{font-size:15px !important;}
.lp .attr-heading{font-size:18px !important;}

/* Телефон */
@media (max-width:767px){
.lp{padding:8px 16px 32px !important;}
body:has(.lp) .site-back-bar{padding:10px 16px 0 !important;}
.lp .listing-photo-grid{gap:20px !important;}
.lp .lp-photo{height:320px !important;border-radius:16px !important;}
.lp .lp-photo-img{max-height:300px !important;}
.lp .lp-thumb{width:64px !important;height:64px !important;}
.lp .lp-info h1{font-size:22px !important;}
.lp .lp-price{font-size:28px !important;}
}

/* Темна тема */
html[data-theme="dark"] .lp .lp-photo,html[data-theme="dark"] .lp .lp-card{background:#1d1530 !important;border-color:#3a2d5c;box-shadow:0 8px 24px rgba(0,0,0,.35);}
html[data-theme="dark"] .lp .lp-seller > div:first-child{background:#261c3d !important;color:#c4b5fd;}
html[data-theme="dark"] .lp .lp-phone{color:#c4b5fd !important;}
html[data-theme="dark"] .lp .lp-safe{background:rgba(16,185,129,.12) !important;border-color:rgba(52,211,153,.35);color:#6ee7b7 !important;}
html[data-theme="dark"] .lp .message-seller-btn{background:transparent !important;border-color:#6d5aa8 !important;color:#c4b5fd !important;}
html[data-theme="dark"] .lp .message-seller-btn:hover{background:rgba(255,255,255,.05) !important;}
html[data-theme="dark"] .lp .favorite-btn{background:#1d1530 !important;border-color:#3a2d5c !important;color:#c4b5fd !important;}
html[data-theme="dark"] .lp .favorite-btn--active{background:#261c3d !important;}
html[data-theme="dark"] .lp .lp-price{color:#c4b5fd !important;}
html[data-theme="dark"] .lp .lp-attr{background:#261c3d !important;border-color:#3d3060 !important;}

/* listing_v2: миніатюри без смуги прокрутки */
.lp .lp-photo ~ div:has(.lp-thumb){gap:10px !important;margin-top:12px !important;padding-bottom:2px;scrollbar-width:none;-ms-overflow-style:none;}
.lp .lp-photo ~ div:has(.lp-thumb)::-webkit-scrollbar{display:none;}

/* listing_v3: телефон — назва й ціна одразу під фото */
@media (max-width:767px){
.lp .listing-photo-grid{display:flex !important;flex-direction:column !important;align-items:stretch !important;gap:0 !important;}
.lp .listing-photo-grid > div{display:contents !important;}
.lp .listing-photo-grid > div > *{order:50;}
.lp .listing-photo-grid > div:first-child > :first-child{order:1;}
.lp .listing-photo-grid > div > div:has(.lp-thumb){order:2;}
.lp .listing-photo-grid > .lp-info > :first-child{order:3;margin-top:20px !important;}
.lp .listing-photo-grid > .lp-info > div:has(> h1){order:4;}
.lp .listing-photo-grid > .lp-info > .lp-price{order:5;margin-bottom:4px !important;}
.lp .listing-photo-grid > .lp-info > p{order:6;}
.lp .listing-photo-grid > .lp-info > p.lp-price{order:5;}
.lp .listing-photo-grid > div > .lp-seller{order:10;margin-top:16px !important;}
.lp .listing-photo-grid > div > .lp-card:not(.lp-seller){order:11;}
.lp .listing-photo-grid > div > .lp-safe{order:12;}
.lp .listing-photo-grid > div > .lp-actions{order:13;margin-bottom:8px !important;}
.lp .listing-photo-grid > div > div[style*="#fef2f2"]{order:13;}
.lp .listing-photo-grid > .lp-info > div[style*="height:1px"]{order:20;margin:20px 0 16px !important;}
.lp .listing-photo-grid > .lp-info > .listing-description{order:21;}
}

/* show_attrs_v1 (24.10.2026): характеристики — сітка значень і чіпи «є» групами */
.lp .lp-attr-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.lp .lp-attr .attr-label{margin:0 0 2px;color:#6b6386;}
.lp .lp-attr .attr-value{margin:0;font-weight:600;color:var(--color-text);overflow-wrap:anywhere;}
.lp .lp-attr-group{margin-top:16px;}
.lp .lp-attr-gtitle{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#7c3aed;margin:0 0 8px;}
.lp .lp-attr-chips{display:flex;flex-wrap:wrap;gap:8px;}
.lp .lp-attr-chip{display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 12px;border-radius:999px;background:#ede9fe;color:#4c1d95;font-size:14px;font-weight:600;}
.lp .lp-attr-chip svg{color:#7c3aed;flex-shrink:0;}
@media (min-width:1200px){.lp .lp-attr-grid{grid-template-columns:repeat(3,minmax(0,1fr));}}
html[data-theme="dark"] .lp .lp-attr .attr-label{color:#b8afd4;}
html[data-theme="dark"] .lp .lp-attr-chip{background:#33255a;color:#ede9fe;}
html[data-theme="dark"] .lp .lp-attr-chip svg{color:#c4b5fd;}
html[data-theme="dark"] .lp .lp-attr-gtitle{color:#c4b5fd;}