/* ============================================
   MW15 PV-Marktplatz v2 — pva-invest.de Style
   ============================================ */

:root {
    --pvm-primary: #2c6e49;
    --pvm-primary-dk: #1e5235;
    --pvm-accent: #f5a623;
    --pvm-accent-dk: #e0950f;
    --pvm-dark: #0d1b2a;
    --pvm-text: #1a1a2e;
    --pvm-text-light: #6b7280;
    --pvm-bg: #f5f7f9;
    --pvm-card-bg: #ffffff;
    --pvm-border: #e5e7eb;
    --pvm-radius: 12px;
    --pvm-shadow: 0 2px 12px rgba(0,0,0,0.08);
    --pvm-shadow-hover: 0 12px 32px rgba(0,0,0,0.14);
    --pvm-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

/* ── Layout ── */
.pvm-marktplatz { max-width:1200px; margin:0 auto; padding:20px; font-family:var(--pvm-font); color:var(--pvm-text); }

/* ── Header ── */
.pvm-header { text-align:center; margin-bottom:30px; }
.pvm-subtitle { color:var(--pvm-primary); font-weight:600; font-size:.95rem; margin:0 0 6px; letter-spacing:.3px; }
.pvm-title { font-size:1.85rem; font-weight:700; color:var(--pvm-text); margin:0; line-height:1.25; }

/* ── Status Bar ── */
.pvm-status-bar { display:flex; align-items:center; justify-content:flex-end; gap:10px; flex-wrap:wrap; margin-bottom:14px; }
.pvm-user-hi { font-size:.88rem; color:var(--pvm-text-light); font-weight:500; }
.pvm-badge-ok { font-size:.78rem; padding:3px 10px; border-radius:14px; background:#d4edda; color:#155724; font-weight:600; }
.pvm-badge-warn { font-size:.78rem; padding:3px 10px; border-radius:14px; background:#fff3cd; color:#856404; font-weight:600; }
.pvm-badge-warn a { color:#856404; text-decoration:underline; }
.pvm-badge-info { font-size:.78rem; padding:3px 10px; border-radius:14px; background:#d1ecf1; color:#0c5460; font-weight:600; }

/* ── Buttons ── */
.pvm-btn { display:inline-flex; align-items:center; justify-content:center; padding:10px 22px; border:none; border-radius:8px; font-size:.9rem; font-weight:600; cursor:pointer; text-decoration:none; transition:all .2s; line-height:1.4; font-family:var(--pvm-font); }
.pvm-btn-primary { background:var(--pvm-primary); color:#fff; }
.pvm-btn-primary:hover { background:var(--pvm-primary-dk); color:#fff; }
.pvm-btn-accent { background:var(--pvm-accent); color:var(--pvm-dark); }
.pvm-btn-accent:hover { background:var(--pvm-accent-dk); color:var(--pvm-dark); }
.pvm-btn-ghost { background:transparent; color:var(--pvm-text-light); border:1px solid var(--pvm-border); }
.pvm-btn-ghost:hover { background:var(--pvm-bg); color:var(--pvm-text); }
.pvm-btn-sm { padding:5px 14px; font-size:.8rem; }
.pvm-btn-block { width:100%; text-align:center; }

/* ── Map Section with Filter Overlay ── */
.pvm-map-section {
    position:relative; margin-bottom:24px; border-radius:var(--pvm-radius);
    overflow:hidden; box-shadow:var(--pvm-shadow); border:1px solid var(--pvm-border);
}
.pvm-map-section .pvm-map-container { height:520px; width:100%; }

/* Leaflet Zoom-Buttons nach rechts verschieben (weg vom Filter) */
.pvm-map-section .leaflet-control-zoom,
.pvm-map-section .leaflet-top.leaflet-left { left:auto !important; right:10px !important; }

/* Filter Overlay */
.pvm-filter-overlay {
    position:absolute; top:10px; left:10px; z-index:800;
    width:300px; max-height:calc(100% - 20px);
    background:rgba(255,255,255,0.97); backdrop-filter:blur(10px);
    border-radius:10px; box-shadow:0 6px 24px rgba(0,0,0,.18);
    overflow:hidden; transition:transform .3s ease, opacity .3s ease;
    display:flex; flex-direction:column;
}
.pvm-filter-overlay.collapsed { transform:translateX(-320px); opacity:0; pointer-events:none; }
.pvm-filter-overlay-header {
    display:flex; align-items:center; justify-content:space-between;
    padding:12px 14px 8px; flex-shrink:0;
}
.pvm-filter-heading { font-size:.95rem; font-weight:700; color:var(--pvm-text); margin:0; }
.pvm-filter-close {
    background:none; border:none; cursor:pointer; padding:4px;
    color:var(--pvm-text-light); border-radius:6px; transition:.2s;
    display:flex; align-items:center; justify-content:center;
}
.pvm-filter-close:hover { background:var(--pvm-bg); color:var(--pvm-text); }
.pvm-filter-body { padding:4px 14px 14px; overflow-y:auto; flex:1; min-height:0; }
.pvm-filter-group { margin-bottom:10px; }
.pvm-filter-label { display:block; font-weight:600; font-size:.75rem; color:var(--pvm-text); margin-bottom:4px; text-transform:uppercase; letter-spacing:.3px; }
.pvm-filter-options { display:flex; flex-wrap:wrap; gap:5px; }
.pvm-checkbox-label { display:flex; align-items:center; gap:4px; font-size:.8rem; cursor:pointer; padding:3px 9px; background:var(--pvm-bg); border-radius:5px; border:1px solid var(--pvm-border); transition:.2s; }
.pvm-checkbox-label:hover { border-color:var(--pvm-primary); }
.pvm-checkbox-label input[type="checkbox"] { accent-color:var(--pvm-primary); width:13px; height:13px; }
.pvm-filter-range-inputs { display:flex; align-items:center; gap:6px; margin-bottom:6px; }
.pvm-filter-range-inputs input {
    flex:1; padding:5px 6px; border:1px solid var(--pvm-border); border-radius:5px;
    font-size:.8rem; background:#fff; font-family:var(--pvm-font); text-align:center;
}
.pvm-filter-range-inputs input:focus { outline:none; border-color:var(--pvm-primary); box-shadow:0 0 0 2px rgba(245,166,35,.15); }
.pvm-filter-overlay select { width:100%; padding:5px 8px; border:1px solid var(--pvm-border); border-radius:5px; font-size:.8rem; background:#fff; font-family:var(--pvm-font); }
.pvm-filter-overlay select:focus { outline:none; border-color:var(--pvm-primary); box-shadow:0 0 0 2px rgba(245,166,35,.15); }
.pvm-filter-actions { display:flex; gap:8px; padding-top:10px; border-top:1px solid var(--pvm-border); margin-top:4px; }
.pvm-filter-actions .pvm-btn { padding:8px 14px; font-size:.82rem; }

/* Filter Toggle Button */
.pvm-filter-toggle-btn {
    position:absolute; top:14px; left:14px; z-index:790;
    display:none; align-items:center; gap:8px; padding:10px 18px;
    background:rgba(255,255,255,0.95); backdrop-filter:blur(8px);
    border:none; border-radius:10px; box-shadow:0 4px 16px rgba(0,0,0,.15);
    font-size:.88rem; font-weight:600; color:var(--pvm-text);
    cursor:pointer; font-family:var(--pvm-font); transition:.2s;
}
.pvm-filter-toggle-btn:hover { box-shadow:0 6px 24px rgba(0,0,0,.2); }
.pvm-filter-toggle-btn.visible { display:flex; }

/* Results Bar */
.pvm-results-bar {
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 0; margin-bottom:20px; border-bottom:1px solid var(--pvm-border);
}
.pvm-results-count { font-size:.92rem; font-weight:600; color:var(--pvm-text); }

/* ── Dual Range Slider ── */
.pvm-range-slider { position:relative; height:26px; }
.pvm-range-track {
    position:absolute; top:50%; left:0; right:0; height:3px;
    background:#e0e0e0; border-radius:2px; transform:translateY(-50%);
}
.pvm-range-fill {
    position:absolute; height:100%; background:var(--pvm-primary); border-radius:2px;
}
.pvm-range-slider input[type="range"] {
    position:absolute; top:0; left:0; width:100%; height:100%;
    -webkit-appearance:none; appearance:none; background:transparent;
    pointer-events:none; margin:0; padding:0;
}
.pvm-range-slider input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance:none; width:18px; height:18px; border-radius:50%;
    background:#fff; border:3px solid var(--pvm-primary);
    box-shadow:0 1px 4px rgba(0,0,0,.15); cursor:pointer;
    pointer-events:all; position:relative; z-index:2;
}
.pvm-range-slider input[type="range"]::-moz-range-thumb {
    width:18px; height:18px; border-radius:50%;
    background:#fff; border:3px solid var(--pvm-primary);
    box-shadow:0 1px 4px rgba(0,0,0,.15); cursor:pointer;
    pointer-events:all;
}

/* ── Listings Grid ── */
.pvm-listings { display:grid; grid-template-columns:repeat(auto-fill, minmax(350px, 1fr)); gap:24px; }

/* ── Card (pva-invest.de Design) ── */
.pvm-card {
    background:var(--pvm-card-bg);
    border-radius:var(--pvm-radius);
    overflow:hidden;
    box-shadow:var(--pvm-shadow);
    border:1px solid var(--pvm-border);
    transition:all .25s;
    display:flex;
    flex-direction:column;
}
.pvm-card:hover { box-shadow:var(--pvm-shadow-hover); transform:translateY(-3px); }

/* Titel über dem Bild */
.pvm-card-title {
    margin:0;
    padding:16px 18px 10px;
    font-size:1.1rem;
    font-weight:700;
    line-height:1.3;
}
.pvm-card-title a { color:var(--pvm-text); text-decoration:none; transition:color .2s; }
.pvm-card-title a:hover { color:var(--pvm-primary); }

/* Bild-Container mit Logo-Overlay (wie pva-invest) */
.pvm-card-img-link { display:block; text-decoration:none; }
.pvm-card-img {
    position:relative;
    height:200px;
    overflow:hidden;
    background:#e8f5e9;
}
.pvm-card-img img {
    width:100%; height:100%; object-fit:cover;
    transition:transform .4s ease;
}
.pvm-card:hover .pvm-card-img img { transform:scale(1.05); }
.pvm-card-logo {
    position:absolute;
    bottom:12px; left:14px;
    color:#fff;
    font-weight:700;
    font-size:11px;
    letter-spacing:1.5px;
    text-transform:uppercase;
    text-shadow:0 1px 4px rgba(0,0,0,.5);
    z-index:2;
}
/* Gradient overlay on image bottom */
.pvm-card-img::after {
    content:'';
    position:absolute;
    bottom:0; left:0; right:0;
    height:60px;
    background:linear-gradient(transparent, rgba(0,0,0,.45));
    pointer-events:none;
}

/* Datenzeilen */
.pvm-card-data { padding:0 18px; flex:1; }
.pvm-data-row {
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    padding:7px 0;
    border-bottom:1px solid #f2f2f2;
    font-size:.86rem;
}
.pvm-data-row-last { border-bottom:none; }
.pvm-data-label { color:var(--pvm-text-light); font-weight:500; }
.pvm-data-value { font-weight:600; color:var(--pvm-text); text-align:right; }
.pvm-data-price { color:var(--pvm-primary); font-weight:700; }
.pvm-data-highlight { color:var(--pvm-accent); font-weight:700; font-size:.92rem; }
.pvm-lock-link {
    color:var(--pvm-primary);
    font-weight:600;
    font-size:.8rem;
    text-decoration:none;
    border-bottom:1px dashed var(--pvm-primary);
    cursor:pointer;
}
.pvm-lock-link:hover { color:var(--pvm-primary-dk); }

/* Card Footer */
.pvm-card-footer { padding:14px 18px 18px; }

/* End Text */
.pvm-end-text { text-align:center; padding:30px 0 10px; color:var(--pvm-text-light); font-size:.88rem; }
.pvm-no-results { grid-column:1/-1; text-align:center; padding:60px 20px; color:var(--pvm-text-light); }

/* ── User Nav ── */
.pvm-user-nav { display:flex; align-items:center; gap:10px; font-size:.88rem; }

/* ── Modal ── */
.pvm-modal-overlay {
    position:fixed; top:0; left:0; right:0; bottom:0;
    background:rgba(0,0,0,.55);
    z-index:99999;
    display:flex; align-items:center; justify-content:center;
    backdrop-filter:blur(3px);
    animation:pvmFade .2s ease;
}
@keyframes pvmFade { from{opacity:0} to{opacity:1} }
.pvm-modal {
    background:#fff; border-radius:16px;
    width:90%; max-width:520px; max-height:90vh; overflow-y:auto;
    padding:32px; position:relative;
    box-shadow:0 20px 60px rgba(0,0,0,.22);
    animation:pvmPop .3s ease;
}
@keyframes pvmPop { from{opacity:0;transform:scale(.95) translateY(10px)} to{opacity:1;transform:scale(1) translateY(0)} }
.pvm-modal-close { position:absolute; top:12px; right:16px; background:none; border:none; font-size:1.6rem; cursor:pointer; color:var(--pvm-text-light); line-height:1; z-index:2; }
.pvm-modal-close:hover { color:var(--pvm-text); }

.pvm-modal-brand { text-align:center; margin-bottom:20px; padding:16px; background:var(--pvm-dark); border-radius:10px; }
.pvm-modal-logo { color:#fff; font-weight:700; font-size:13px; letter-spacing:2px; text-transform:uppercase; }
.pvm-modal-title { font-size:1.15rem; font-weight:700; margin:0 0 16px; text-align:center; color:var(--pvm-text); }

/* ── Forms ── */
.pvm-form .pvm-fg { margin-bottom:12px; }
.pvm-form label { display:block; font-size:.82rem; font-weight:600; margin-bottom:3px; color:var(--pvm-text); }
.pvm-form input[type="email"],
.pvm-form input[type="password"],
.pvm-form input[type="text"],
.pvm-form input[type="tel"],
.pvm-form select {
    width:100%; padding:9px 12px; border:1px solid var(--pvm-border); border-radius:8px;
    font-size:.88rem; transition:.2s; box-sizing:border-box; font-family:var(--pvm-font);
}
.pvm-form input:focus, .pvm-form select:focus { outline:none; border-color:var(--pvm-primary); box-shadow:0 0 0 3px rgba(44,110,73,.12); }
.pvm-fg-row { display:flex; gap:12px; }
.pvm-fg-half { flex:1; min-width:0; }
.pvm-form-message { margin:10px 0; padding:10px 14px; border-radius:8px; font-size:.84rem; display:none; }
.pvm-form-message.success { background:#d4edda; color:#155724; display:block; }
.pvm-form-message.error { background:#f8d7da; color:#721c24; display:block; }
.pvm-form-links { text-align:center; margin:14px 0 0; font-size:.84rem; }
.pvm-form-links a { color:var(--pvm-primary); text-decoration:none; font-weight:600; }
.pvm-form-links a:hover { text-decoration:underline; }
.pvm-form .pvm-checkbox-label { font-size:.8rem; display:flex; align-items:flex-start; gap:6px; cursor:pointer; font-weight:400; color:var(--pvm-text-light); }
.pvm-form .pvm-checkbox-label a { color:var(--pvm-primary); }

/* ── Loading ── */
.pvm-loading { text-align:center; padding:40px; }
.pvm-spinner { display:inline-block; width:36px; height:36px; border:3px solid var(--pvm-border); border-top-color:var(--pvm-primary); border-radius:50%; animation:pvmSpin .7s linear infinite; }
@keyframes pvmSpin { to{transform:rotate(360deg)} }

/* ── Responsive ── */
@media (max-width:968px) {
    .pvm-filter-overlay { width:280px; }
    .pvm-map-section .pvm-map-container { height:450px; }
}
@media (max-width:768px) {
    .pvm-listings { grid-template-columns:1fr; }
    .pvm-title { font-size:1.4rem; }
    .pvm-modal { padding:24px; width:95%; }
    .pvm-fg-row { flex-direction:column; gap:0; }
    .pvm-status-bar { justify-content:center; }
    .pvm-card-img { height:180px; }
    .pvm-filter-overlay {
        position:fixed; top:0; left:0; width:100%; height:100%;
        max-height:100%; border-radius:0; z-index:9999;
    }
    .pvm-filter-overlay.collapsed { transform:translateY(100%); }
    .pvm-filter-body { max-height:calc(100vh - 60px); }
    .pvm-map-section .pvm-map-container { height:350px; }
    .pvm-map-section .leaflet-top.leaflet-left { left:0; right:auto; }
}
@media (max-width:480px) {
    .pvm-marktplatz { padding:10px; }
    .pvm-card-img { height:160px; }
    .pvm-filter-range-inputs { flex-direction:column; }
}

/* Leaflet Marker */
.pvm-map-marker { background: none !important; border: none !important; }
.leaflet-popup-content-wrapper { border-radius: 6px; box-shadow: 0 4px 16px rgba(0,0,0,0.15); }
.leaflet-popup-content { margin: 8px 12px; font-size: 13px; line-height: 1.5; }
