/* ==========================================================================
   Powell Listings — Listing Page Styles
   Designed to match the Powell Realty theme's design system
   ========================================================================== */

/* ---------- Breadcrumb ---------- */
.pwl-breadcrumb { background: var(--color-light, #f4f6f9); padding: .5rem 0; border-bottom: 1px solid var(--color-border,#e2e8f0); font-size:.8125rem; }
.pwl-breadcrumb ol { list-style:none; display:flex; flex-wrap:wrap; gap:.3rem; margin:0; padding:0; align-items:center; }
.pwl-breadcrumb li:not(:last-child)::after { content:'/'; margin-left:.3rem; color:#cbd5e1; }
.pwl-breadcrumb a { color: var(--color-primary,#1B4B8A); }

/* ---------- Single listing layout ---------- */
.pwl-listing-container { padding-top: 1.5rem; padding-bottom: 3rem; }

/* ---------- Gallery ---------- */
.pwl-gallery { margin-bottom: 1.5rem; border-radius: 12px; overflow: hidden; }
.pwl-gallery-main { position: relative; background: #000; aspect-ratio: 16/9; max-height: 520px; overflow: hidden; }
.pwl-gallery-main img { width: 100%; height: 100%; object-fit: cover; display: block; transition: opacity .15s; }
.pwl-gallery-nav {
    position: absolute; top: 50%; transform: translateY(-50%);
    background: rgba(0,0,0,.45); color: #fff; border: none; cursor: pointer;
    font-size: 2rem; padding: 0 .75rem; line-height: 2.5rem; border-radius: 4px;
    transition: background .15s;
}
.pwl-gallery-nav:hover { background: rgba(0,0,0,.7); }
.pwl-gallery-prev { left: .75rem; }
.pwl-gallery-next { right: .75rem; }
.pwl-photo-count { position:absolute; bottom:.75rem; right:.75rem; background:rgba(0,0,0,.55); color:#fff; font-size:.75rem; padding:3px 9px; border-radius:12px; }
.pwl-gallery-thumbs { display:flex; gap:6px; padding:6px 0 0; flex-wrap:wrap; }
.pwl-thumb { width:80px; height:54px; object-fit:cover; border-radius:4px; cursor:pointer; opacity:.7; transition:opacity .15s; border:2px solid transparent; }
.pwl-thumb:hover, .pwl-thumb.active { opacity:1; border-color: var(--color-primary,#1B4B8A); }
.pwl-more-photos { display:flex; align-items:center; justify-content:center; background:var(--color-light,#f4f6f9); font-size:.75rem; font-weight:600; color:var(--color-primary,#1B4B8A); cursor:pointer; border:1px solid var(--color-border,#e2e8f0); }
.pwl-no-photo { height:280px; background:var(--color-light,#f4f6f9); display:flex; align-items:center; justify-content:center; color:#94a3b8; font-size:.9rem; border-radius:12px; }

/* ---------- Two-column detail layout ---------- */
.pwl-detail-body { display:grid; gap:2rem; }
@media(min-width:900px){ .pwl-detail-body { grid-template-columns:1fr 320px; align-items:start; } }

/* ---------- Price, address ---------- */
.pwl-price-row { display:flex; align-items:center; gap:1rem; flex-wrap:wrap; margin-bottom:.4rem; }
.pwl-price { font-size:2rem; font-weight:800; margin:0; color:var(--color-dark,#1A1A2E); }
.pwl-status { font-size:.75rem; font-weight:700; text-transform:uppercase; padding:4px 10px; border-radius:20px; letter-spacing:.06em; }
.pwl-status--active  { background:#dcfce7; color:#14532d; }
.pwl-status--pending { background:#fef9c3; color:#713f12; }
.pwl-status--closed  { background:#fee2e2; color:#7f1d1d; }
.pwl-address { font-size:1.25rem; font-weight:700; margin:.25rem 0 .15rem; color:var(--color-dark,#1A1A2E); }
.pwl-city-line { font-size:.9375rem; color:var(--color-text-muted,#6b7280); margin:0 0 1.25rem; }
.pwl-tour-link { font-size:.875rem; font-weight:600; color:var(--color-primary,#1B4B8A); }

/* ---------- Specs bar ---------- */
.pwl-specs-bar { display:flex; gap:0; border:1px solid var(--color-border,#e2e8f0); border-radius:10px; overflow:hidden; margin-bottom:1.5rem; }
.pwl-spec { flex:1; text-align:center; padding:.75rem .5rem; border-right:1px solid var(--color-border,#e2e8f0); }
.pwl-spec:last-child { border-right:none; }
.pwl-spec strong { display:block; font-size:1.25rem; font-weight:700; color:var(--color-dark,#1A1A2E); }
.pwl-spec span { font-size:.75rem; color:var(--color-text-muted,#6b7280); text-transform:uppercase; letter-spacing:.05em; }

/* ---------- Sections ---------- */
.pwl-section { margin-bottom:1.75rem; }
.pwl-section h3 { font-size:1.0625rem; font-weight:700; margin:0 0 .85rem; padding-bottom:.5rem; border-bottom:2px solid var(--color-light,#f4f6f9); color:var(--color-dark,#1A1A2E); }
.pwl-description { font-size:.9375rem; line-height:1.7; color:var(--color-text,#2c2c3e); }

/* ---------- Details grid ---------- */
.pwl-details-grid { display:grid; grid-template-columns:1fr 1fr; gap:0; border:1px solid var(--color-border,#e2e8f0); border-radius:8px; overflow:hidden; }
.pwl-detail-row { display:contents; }
.pwl-detail-label, .pwl-detail-value { padding:.6rem .9rem; font-size:.875rem; border-bottom:1px solid var(--color-border,#e2e8f0); }
.pwl-detail-label { color:var(--color-text-muted,#6b7280); background:var(--color-light,#f4f6f9); font-weight:600; }
.pwl-detail-value { color:var(--color-text,#2c2c3e); }

/* ---------- Map ---------- */
.pwl-map { height:280px; border-radius:8px; overflow:hidden; border:1px solid var(--color-border,#e2e8f0); }
.pwl-map .leaflet-popup-pane, .pwl-map .leaflet-popup, .pwl-map .leaflet-popup-content-wrapper, .pwl-map .leaflet-popup-content, .pwl-map .leaflet-popup-tip-container { max-width: none !important; }

/* ---------- Disclaimer ---------- */
.pwl-disclaimer { font-size:.75rem; color:#94a3b8; margin-top:2rem; padding-top:1rem; border-top:1px solid var(--color-border,#e2e8f0); line-height:1.6; }

/* ---------- Contact sidebar ---------- */
.pwl-contact-sidebar { display:flex; flex-direction:column; gap:1rem; position:sticky; top:80px; }
.pwl-contact-card { background:#fff; border:1px solid var(--color-border,#e2e8f0); border-radius:12px; padding:1.5rem; }
.pwl-contact-card h3 { font-size:1rem; margin:0 0 .5rem; }
.pwl-contact-address { font-size:.8125rem; color:var(--color-text-muted,#6b7280); margin:.25rem 0; }
.pwl-contact-price { font-size:1.125rem; font-weight:700; color:var(--color-primary,#1B4B8A); margin:.25rem 0 1rem; }
.pwl-btn-phone, .pwl-btn-contact {
    display:block; text-align:center; padding:.75rem 1rem; border-radius:8px;
    font-weight:600; font-size:.9375rem; margin-bottom:.6rem; text-decoration:none; transition:all .15s;
}
.pwl-btn-phone   { background:var(--color-accent,#C8861A); color:#fff; }
.pwl-btn-phone:hover { background:#a86e0f; color:#fff; }
.pwl-btn-contact { background:transparent; border:2px solid var(--color-primary,#1B4B8A); color:var(--color-primary,#1B4B8A); }
.pwl-btn-contact:hover { background:var(--color-primary,#1B4B8A); color:#fff; }

/* ---------- Share card ---------- */
.pwl-share-card { background:var(--color-light,#f4f6f9); border-radius:10px; padding:1rem; font-size:.875rem; }
.pwl-share-card p { margin:0 0 .5rem; font-weight:600; }
.pwl-share-links { display:flex; gap:.75rem; }
.pwl-share-links a { color:var(--color-primary,#1B4B8A); font-size:.8125rem; text-decoration:underline; }

/* ---------- Similar listings ---------- */
.pwl-similar { background:#fff; border:1px solid var(--color-border,#e2e8f0); border-radius:12px; padding:1.25rem; }
.pwl-similar h3 { font-size:.9375rem; margin:0 0 1rem; }
.pwl-similar-item { display:flex; gap:.75rem; margin-bottom:.85rem; text-decoration:none; color:inherit; }
.pwl-similar-item:last-child { margin-bottom:0; }
.pwl-similar-item img { width:72px; height:54px; object-fit:cover; border-radius:6px; flex-shrink:0; }
.pwl-similar-info { display:flex; flex-direction:column; gap:2px; min-width:0; }
.pwl-similar-info strong { font-size:.9375rem; color:var(--color-dark,#1A1A2E); }
.pwl-similar-info span { font-size:.75rem; color:var(--color-text-muted,#6b7280); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* ---------- Archive grid ---------- */
.pwl-archive-header { background:linear-gradient(135deg, var(--color-primary,#1B4B8A) 0%, #2255a4 100%); color:#fff; padding:2rem 0; }
.pwl-archive-header h1 { color:#fff; margin:0 0 .3rem; }
.pwl-archive-header p { color:rgba(255,255,255,.8); margin:0; font-size:.9375rem; }
.pwl-archive-body { padding-top:2rem; padding-bottom:3rem; }
.pwl-listing-grid { display:grid; gap:1.25rem; grid-template-columns:repeat(auto-fill, minmax(280px,1fr)); }
.pwl-card { background:#fff; border:1px solid var(--color-border,#e2e8f0); border-radius:12px; overflow:hidden; transition:box-shadow .18s, transform .18s; }
.pwl-card:hover { box-shadow:0 6px 20px rgba(0,0,0,.1); transform:translateY(-2px); }
.pwl-card-photo-link { display:block; aspect-ratio:4/3; overflow:hidden; position:relative; }
.pwl-card-photo { width:100%; height:100%; object-fit:cover; transition:transform .35s; }
.pwl-card:hover .pwl-card-photo { transform:scale(1.03); }
.pwl-no-photo-bg { background:linear-gradient(135deg,var(--color-primary,#1B4B8A),var(--color-secondary,#2D7DD2)); height:100%; }
.pwl-card-dom { position:absolute; top:.6rem; left:.6rem; background:rgba(0,0,0,.55); color:#fff; font-size:.7rem; padding:3px 8px; border-radius:20px; }
.pwl-card-body { padding:1rem 1.1rem 1.1rem; }
.pwl-card-price { font-size:1.25rem; font-weight:700; color:var(--color-dark,#1A1A2E); margin-bottom:.3rem; }
.pwl-card-specs { display:flex; gap:.5rem; font-size:.8125rem; color:var(--color-text-muted,#6b7280); margin-bottom:.4rem; }
.pwl-card-specs span:not(:last-child)::after { content:'·'; margin-left:.5rem; }
.pwl-card-address { font-size:.9375rem; font-weight:600; margin:0 0 .2rem; }
.pwl-card-address a { color:var(--color-dark,#1A1A2E); text-decoration:none; }
.pwl-card-address a:hover { color:var(--color-primary,#1B4B8A); }
.pwl-card-city { font-size:.8125rem; color:var(--color-text-muted,#6b7280); margin:0; }

@media(max-width:600px) {
    .pwl-specs-bar { flex-wrap:wrap; }
    .pwl-spec { flex:0 0 33.33%; }
    .pwl-details-grid { grid-template-columns:1fr; }
}